:root{
  color-scheme:dark;
  --bg:#040711;
  --bg-2:#060a18;
  --panel:rgba(8,13,32,.88);
  --panel-strong:#0b1128;
  --line:#1d2a55;
  --text:#f7f9ff;
  --muted:#98a5c8;
  --blue:#3472ff;
  --blue-soft:#75a1ff;
  --purple:#8a5cf6;
  --pink:#e768ad;
  --teal:#31c9cf;
  --shadow:0 24px 80px rgba(0,0,0,.34);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);overflow-x:hidden}
body{
  margin:0;
  min-width:0;
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
  isolation:isolate;
  color:var(--text);
  background:linear-gradient(180deg,#03060f 0%,#060a17 29%,#070c1d 60%,#040711 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.17;
  background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:linear-gradient(#000 0%,rgba(0,0,0,.88) 56%,transparent 100%);
  mask-image:linear-gradient(#000 0%,rgba(0,0,0,.88) 56%,transparent 100%);
}
body::after{
  content:"";
  position:fixed;
  inset:-18%;
  z-index:-3;
  pointer-events:none;
  background:
    radial-gradient(circle at 14% 13%,rgba(40,103,255,.23),transparent 25%),
    radial-gradient(circle at 83% 11%,rgba(133,82,255,.19),transparent 25%),
    radial-gradient(circle at 28% 63%,rgba(66,132,255,.15),transparent 28%),
    radial-gradient(circle at 74% 72%,rgba(153,81,255,.17),transparent 27%),
    radial-gradient(circle at 48% 38%,rgba(26,210,255,.08),transparent 24%);
  filter:blur(22px) saturate(118%);
  animation:aurora-float 26s ease-in-out infinite alternate;
}
@keyframes aurora-float{
  0%{transform:translate3d(-1.5%,0,0) scale(1)}
  50%{transform:translate3d(1.8%,-1.2%,0) scale(1.04)}
  100%{transform:translate3d(-.8%,1.4%,0) scale(1.02)}
}
@keyframes section-pulse{
  0%,100%{transform:translate3d(0,0,0) scale(1);opacity:.78}
  50%{transform:translate3d(1.5%,-1%,0) scale(1.06);opacity:1}
}

img{max-width:100%}
a{color:inherit;text-decoration:none}
button,select{font:inherit}
button,a,select{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid rgba(117,161,255,.76);outline-offset:3px}
.wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto;min-width:0}

.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(111,130,200,.14);background:rgba(4,7,17,.74);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.nav{height:70px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:11px;min-width:0;font-weight:900;font-size:18px;letter-spacing:-.035em}
.brand-mark{width:36px;height:36px;flex:0 0 auto;border:1px solid #344783;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(52,114,255,.2),rgba(138,92,246,.2));color:#dbe4ff;box-shadow:0 0 26px rgba(88,89,255,.12)}
.nav-links{display:flex;gap:24px;align-items:center;color:#aeb9d8;font-size:14px;font-weight:750}
.nav-links a{padding:8px 2px}
.nav-links a:hover{color:white}

.hero{padding:82px 0 56px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:46px;align-items:center}
.hero-copy{min-width:0}
.eyebrow,.section-kicker,.card-label{margin:0 0 14px;color:#95a4d0;text-transform:uppercase;letter-spacing:.17em;font-size:11px;font-weight:950}
.hero h1{margin:0;font-size:clamp(50px,7vw,86px);line-height:.96;letter-spacing:-.065em;background:linear-gradient(105deg,#fff,#d3dcff 54%,#9c84ff);-webkit-background-clip:text;background-clip:text;color:transparent;overflow-wrap:anywhere}
.hero-text{max-width:610px;margin:21px 0 0;color:#a9b4d2;font-size:clamp(15px,1.6vw,18px);line-height:1.7}
.hero-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:27px}
.button{display:inline-flex;min-height:44px;align-items:center;justify-content:center;padding:11px 15px;border-radius:12px;border:1px solid #283763;font-weight:850;font-size:13px;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.button:hover{transform:translateY(-1px);border-color:#465b9b}
.button.primary{border-color:transparent;background:linear-gradient(135deg,var(--blue),#6941da);box-shadow:0 14px 32px rgba(64,87,255,.21)}
.button.secondary{background:#0a1024}
.identity-chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.chip{max-width:100%;padding:8px 11px;border:1px solid #1e2b57;border-radius:999px;background:#0a1025;color:#b6c0df;font-size:12px;font-weight:700;overflow-wrap:anywhere}
.chip b{color:#fff}
.hero-rank{position:relative;overflow:hidden;min-width:0;padding:28px;border:1px solid rgba(86,111,194,.31);border-radius:26px;background:linear-gradient(150deg,rgba(14,23,52,.94),rgba(9,12,29,.95));box-shadow:var(--shadow)}
.hero-rank::after{content:"";position:absolute;width:260px;height:260px;right:-120px;bottom:-130px;border-radius:50%;background:radial-gradient(circle,rgba(93,73,255,.29),transparent 69%);pointer-events:none}
.hero-role{display:block;position:relative;z-index:1;margin-top:5px;font-size:clamp(40px,5vw,58px);letter-spacing:-.055em}
.hero-rank-sub{position:relative;z-index:1;margin:5px 0 24px;color:#9facce;font-size:13px}
.hero-rank-meta{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}
.hero-rank-meta div{min-width:0;padding:12px;border:1px solid rgba(81,101,166,.34);border-radius:12px;background:rgba(4,8,23,.48)}
.hero-rank-meta dt{color:#7f8db3;text-transform:uppercase;letter-spacing:.11em;font-size:9px;font-weight:900}
.hero-rank-meta dd{margin:4px 0 0;font-size:13px;font-weight:850;overflow-wrap:anywhere}

section{scroll-margin-top:84px}
.gaming,.lele-section,.friends-section{padding:70px 0}
.section-heading{display:flex;justify-content:space-between;gap:18px;align-items:end;margin-bottom:24px}
.section-heading h2{margin:0;font-size:clamp(30px,4vw,40px);line-height:1.05;letter-spacing:-.05em}
.section-kicker{margin-bottom:9px}
.gaming-shell{position:relative;overflow:hidden;min-width:0;padding:18px;border:1px solid #192652;border-radius:28px;background:linear-gradient(180deg,rgba(8,13,32,.93),rgba(6,10,24,.9));box-shadow:var(--shadow)}
.gaming-shell::before,.gaming-shell::after{content:"";position:absolute;border-radius:50%;pointer-events:none;filter:blur(26px);animation:section-pulse 18s ease-in-out infinite}
.gaming-shell::before{inset:auto -8% 52% 48%;height:280px;background:radial-gradient(circle,rgba(63,113,255,.22),transparent 70%)}
.gaming-shell::after{inset:58% 52% auto -8%;height:220px;background:radial-gradient(circle,rgba(129,90,255,.18),transparent 70%);animation-direction:reverse}
.game-tabs{position:relative;z-index:2;display:flex;width:max-content;max-width:100%;padding:6px;gap:6px;border:1px solid #182148;border-radius:15px;background:#080d20}
.game-tab{min-height:44px;padding:10px 18px;border:0;border-radius:10px;background:transparent;color:#7f8caf;font-weight:900;cursor:pointer;transition:background .18s ease,color .18s ease,transform .18s ease}
.game-tab:hover{color:#dbe3ff}.game-tab.is-active{color:#fff;background:linear-gradient(135deg,#162654,#292052);box-shadow:inset 0 0 0 1px #394b89}
.game-panel{position:relative;z-index:2;margin-top:18px;min-width:0}
.game-panel[hidden]{display:none}
.gaming-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:end;padding:5px 4px 17px}
.player-id{margin:0;font-size:clamp(21px,3vw,28px);letter-spacing:-.035em;overflow-wrap:anywhere}
.player-sub{margin:7px 0 0;color:#8794b8;font-size:12px}
.season-field{display:flex;align-items:center;gap:9px;color:#8c99bc;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.season-field select{min-height:42px;max-width:190px;padding:9px 34px 9px 11px;border:1px solid #293864;border-radius:11px;color:#ecf0ff;background:#0b1128}
.summary-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:12px}
.summary-card{min-width:0;padding:13px 14px;border:1px solid #1e2c59;border-radius:14px;background:rgba(10,16,38,.86)}
.summary-card span{display:block;color:#7e8cad;text-transform:uppercase;letter-spacing:.11em;font-size:9px;font-weight:900}.summary-card strong{display:block;margin-top:5px;font-size:14px;overflow-wrap:anywhere}.summary-card.goal{border-color:#3e3573;background:linear-gradient(145deg,rgba(37,28,77,.78),rgba(11,17,40,.9))}
.rank-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.rank-card{min-width:0;min-height:210px;padding:20px;border:1px solid #26376b;border-radius:20px;background:linear-gradient(145deg,rgba(16,26,61,.96),rgba(11,15,36,.96));display:flex;flex-direction:column;box-shadow:inset 0 1px rgba(255,255,255,.025)}
.rank-card.main-role{border-color:#425bb0;background:linear-gradient(145deg,rgba(20,38,83,.98),rgba(20,20,55,.97));box-shadow:inset 0 0 0 1px rgba(72,103,216,.16),0 16px 44px rgba(36,72,190,.09)}
.role-name{margin:0;color:#91a0c7;text-transform:uppercase;letter-spacing:.13em;font-size:10px;font-weight:950}.role-name span{display:inline-block;margin-left:5px;padding:4px 6px;border-radius:999px;background:#263f8a;color:#dce6ff;font-size:8px;letter-spacing:.08em;vertical-align:middle}
.rank-card.is-unavailable .rank-value{color:#c2c9dd}
.rank-value{margin:27px 0 0;font-size:clamp(26px,3vw,34px);line-height:1;letter-spacing:-.045em;overflow-wrap:anywhere}.rank-context{margin:8px 0 0;color:#8592b6;font-size:12px}.rank-meta{display:flex;justify-content:space-between;gap:10px;margin-top:auto;padding-top:24px;border-top:1px solid rgba(63,80,139,.35);color:#7e8bad;font-size:10px}.rank-meta span{min-width:0}.rank-meta b{display:block;margin-top:4px;color:#cfd8f7;font-size:11px;overflow-wrap:anywhere}
.season-history{display:flex;gap:8px;overflow-x:auto;margin-top:15px;padding:15px 2px 3px;border-top:1px solid #17234c;scrollbar-width:thin}
.season-button{flex:0 0 auto;min-height:48px;padding:9px 12px;border:1px solid #23315f;border-radius:12px;background:#0b1128;color:#aab5d4;text-align:left;cursor:pointer}.season-button.is-active{border-color:#4960a9;background:#14204a;color:#fff}.season-button b{display:block;font-size:11px}.season-button span{display:block;margin-top:3px;color:#7d8aaa;font-size:9px}
.valorant-card{min-height:260px;padding:34px;border:1px solid #572d49;border-radius:20px;background:linear-gradient(145deg,rgba(52,18,39,.82),rgba(12,14,31,.94));display:flex;flex-direction:column;justify-content:center}.valorant-card h3{margin:0;font-size:clamp(28px,4vw,44px);letter-spacing:-.045em;overflow-wrap:anywhere}.valorant-card p:last-child{margin:11px 0 0;color:#b9a8ba;font-size:14px}

.lele-section{padding-top:80px}
.lele-card{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:520px;overflow:hidden;border:1px solid rgba(126,95,223,.45);border-radius:30px;background:linear-gradient(135deg,#0a1837 0%,#11163a 36%,#21103f 72%,#35144b 100%);box-shadow:0 30px 85px rgba(8,4,30,.39)}
.lele-card::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 90%,rgba(46,101,255,.19),transparent 30%),radial-gradient(circle at 88% 8%,rgba(208,91,246,.23),transparent 33%)}
.lele-card::after{content:"";position:absolute;inset:auto -8% -18% 46%;height:240px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(188,99,255,.2),transparent 70%);filter:blur(30px);animation:section-pulse 18s ease-in-out infinite}
.lele-photo{position:relative;z-index:1;min-width:0;min-height:520px;overflow:hidden;background:#090d1c}
.lele-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 30%;filter:saturate(.95) contrast(1.03) brightness(.9)}
.lele-photo::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 60%,rgba(18,15,52,.55)),linear-gradient(0deg,rgba(5,8,22,.2),transparent 46%)}
.lele-copy{position:relative;z-index:2;min-width:0;padding:clamp(34px,5vw,60px);display:flex;flex-direction:column;justify-content:center}
.lele-name{margin:0;color:#d9c9ff;font-size:clamp(34px,4.4vw,52px);line-height:1;letter-spacing:-.05em;text-shadow:0 0 28px rgba(174,112,255,.26);overflow-wrap:anywhere}
.lele-main{margin:17px 0 0;color:#fff;font-size:clamp(31px,4.8vw,52px);line-height:1.04;letter-spacing:-.055em;font-weight:950}
.love-message{max-width:620px;margin:22px 0 0;color:#e2e6fa;font-size:clamp(15px,1.8vw,18px);line-height:1.72}
.tiktok-link{display:inline-flex;align-self:flex-start;max-width:100%;margin-top:25px;padding:11px 14px;border:1px solid #5a468d;border-radius:12px;background:rgba(20,18,50,.72);color:#e0d6ff;font-size:12px;font-weight:900;overflow-wrap:anywhere}

.friends-section{position:relative;padding-bottom:84px}.friends-section .wrap{position:relative}.friends-section .wrap::before,.friends-section .wrap::after{content:"";position:absolute;z-index:-1;border-radius:50%;pointer-events:none;filter:blur(35px);animation:section-pulse 22s ease-in-out infinite}.friends-section .wrap::before{inset:8% 12% auto -4%;height:260px;background:radial-gradient(circle,rgba(73,99,255,.12),transparent 72%)}.friends-section .wrap::after{inset:auto -6% 10% 54%;height:240px;background:radial-gradient(circle,rgba(124,87,255,.11),transparent 72%);animation-direction:reverse}
.friends-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.friend-card{position:relative;overflow:hidden;min-width:0;min-height:285px;padding:24px;border:1px solid #28345f;border-radius:21px;display:flex;flex-direction:column}
.friend-card::after{content:"";position:absolute;width:170px;height:170px;right:-88px;bottom:-90px;border-radius:50%;pointer-events:none}
.friend-avatar{position:relative;z-index:1;width:82px;height:82px;flex:0 0 auto;display:block;margin:0 0 16px;border-radius:50%;object-fit:cover;object-position:center;box-shadow:0 8px 28px rgba(0,0,0,.28)}
.friend-card h3{position:relative;z-index:1;margin:0 0 10px;font-size:22px;letter-spacing:-.025em}.friend-card p{position:relative;z-index:1;margin:0;color:#adb7d0;font-size:13px;line-height:1.68;overflow-wrap:anywhere}
.friend-card.fae{border-color:#3e315a;background:linear-gradient(160deg,#151024,#090b16 66%)}.friend-card.fae .friend-avatar{border:2px solid #76539d;box-shadow:0 0 0 4px rgba(118,83,157,.11),0 8px 28px rgba(0,0,0,.28)}.friend-card.fae::after{background:radial-gradient(circle,rgba(103,64,153,.26),transparent 70%)}
.friend-card.martha{border-color:#65304f;background:linear-gradient(155deg,#261020,#110d18 66%)}.friend-card.martha .friend-avatar{border:2px solid #d15b9b;box-shadow:0 0 0 4px rgba(209,91,155,.11),0 8px 28px rgba(0,0,0,.28)}.friend-card.martha::after{background:radial-gradient(circle,rgba(236,109,187,.25),transparent 70%)}
.friend-card.lucas{border-color:#284c78;background:linear-gradient(155deg,#0c1830,#0a0e18 68%)}.friend-card.lucas .friend-avatar{border:2px solid #4e89cf;box-shadow:0 0 0 4px rgba(78,137,207,.11),0 8px 28px rgba(0,0,0,.28)}.friend-card.lucas h3{font-weight:950}.friend-card.lucas::after{background:radial-gradient(circle,rgba(52,114,255,.27),transparent 70%)}
.friend-card.lukas{border-color:#28575e;background:linear-gradient(155deg,#0d2025,#091316 68%)}.friend-card.lukas .friend-avatar{border:2px solid #38a7ad;box-shadow:0 0 0 4px rgba(56,167,173,.11),0 8px 28px rgba(0,0,0,.28)}.friend-card.lukas::after{background:radial-gradient(circle,rgba(32,201,207,.23),transparent 70%)}

.site-footer{border-top:1px solid rgba(74,90,150,.16);padding:31px 0 46px;color:#6d799d;font-size:11px}.site-footer .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px}.site-footer strong{color:#919dc0}

@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr}.hero-rank{max-width:720px}.rank-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.friends-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lele-card{grid-template-columns:1fr}.lele-photo{min-height:0;aspect-ratio:4/3}.lele-photo::after{background:linear-gradient(0deg,rgba(22,13,55,.5),transparent 45%)}
}
@media (max-width:650px){
  .wrap{width:min(100% - 24px,1180px)}.nav{height:64px}.nav-links{gap:12px;font-size:12px}.brand{font-size:16px}.brand-mark{width:33px;height:33px}
  .hero{padding:48px 0 36px}.hero-grid{gap:27px}.hero h1{font-size:clamp(42px,15vw,64px)}.hero-actions{display:grid;grid-template-columns:1fr}.button{width:100%}.hero-rank{padding:21px}.hero-rank-meta{grid-template-columns:1fr 1fr}
  .gaming,.lele-section,.friends-section{padding:52px 0}.gaming-shell{padding:12px;border-radius:22px}.game-tabs{width:100%}.game-tab{flex:1;min-width:0;padding:10px 8px}.gaming-toolbar{grid-template-columns:1fr;align-items:start}.season-field{width:100%;justify-content:space-between}.season-field select{flex:1;min-width:0;max-width:none}.summary-strip{grid-template-columns:1fr}.rank-grid{grid-template-columns:1fr}.rank-card{min-height:180px}.rank-meta{flex-wrap:wrap}
  .lele-card{border-radius:24px}.lele-photo{aspect-ratio:4/5}.lele-copy{padding:30px 24px}.lele-name{font-size:clamp(30px,11vw,42px)}.lele-main{font-size:clamp(31px,10.5vw,44px)}
  .friends-grid{grid-template-columns:1fr}.friend-card{min-height:0;padding:22px}.friend-avatar{width:68px;height:68px}.site-footer .wrap{align-items:flex-start;flex-direction:column}
}
@media (max-width:380px){
  .wrap{width:min(100% - 18px,1180px)}.nav-links{gap:8px;font-size:11px}.hero-rank-meta{grid-template-columns:1fr}.rank-meta{display:grid;grid-template-columns:1fr}.identity-chips{display:grid;grid-template-columns:1fr}.chip{border-radius:12px}.tiktok-link{width:100%;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition-duration:0.001ms!important;animation-duration:0s!important;animation-iteration-count:1!important}
}
.valorant-live{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:22px;width:min(760px,100%)}
.valorant-live>div{min-width:0;padding:14px;border:1px solid rgba(147,68,112,.38);border-radius:14px;background:rgba(8,10,24,.42)}
.valorant-live span{display:block;color:#947f94;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.valorant-live strong{display:block;margin-top:6px;color:#fff;font-size:clamp(18px,2.4vw,25px);overflow-wrap:anywhere}
.tracker-status{margin:15px 0 0!important;color:#8e9aba!important;font-size:11px!important}
@media(max-width:650px){.valorant-live{grid-template-columns:1fr}.valorant-live>div{padding:12px}}