:root{
  --text:#fff;--muted:#cbc6ed;--soft:#948cb8;--cyan:#58e8ff;--teal:#35ffd2;--pink:#ff72dd;--purple:#9d62ff;--gold:#ffe49a;--max:1320px;
  --mx:50%;--my:50%;--games-pos:44%;--ringX:0px;--ringY:0px;--catX:0px;--catY:0px;--rise:0px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:#050614}
body{
  margin:0;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:#050614;overflow-x:hidden
}
a{color:inherit} img{display:block;max-width:100%;-webkit-user-drag:none;user-drag:none}
.container{width:min(var(--max),calc(100% - 36px));margin:0 auto}

.animated-bg{position:fixed;inset:-4vh -4vw;z-index:0;overflow:hidden;pointer-events:none;contain:layout paint style}
.header,main,.footer{position:relative;z-index:2}
body:after{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(5,6,22,.12),rgba(5,6,22,.05) 38%,rgba(5,6,22,.18))}
.bg-gradient{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 17% 28%,rgba(157,98,255,.48),rgba(157,98,255,.16) 25%,transparent 52%),
    radial-gradient(ellipse at 85% 24%,rgba(255,114,221,.34),rgba(255,114,221,.14) 25%,transparent 55%),
    radial-gradient(ellipse at 44% 88%,rgba(88,232,255,.27),rgba(88,232,255,.10) 28%,transparent 58%),
    linear-gradient(180deg,#060719 0%,#0d1231 45%,#080719 100%);
}
.cursor-light{position:absolute;inset:0;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.15),transparent 0 18%),radial-gradient(circle at calc(var(--mx) - 8%) calc(var(--my) + 6%),rgba(88,232,255,.13),transparent 0 23%),radial-gradient(circle at calc(var(--mx) + 8%) calc(var(--my) - 6%),rgba(255,114,221,.12),transparent 0 23%);opacity:.82;will-change:background}
.grid-layer{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:72px 72px;opacity:.30}
.stars{position:absolute;inset:0;background-repeat:repeat;will-change:transform}
.stars-a{opacity:.62;background-image:radial-gradient(2px 2px at 60px 80px,#fff,transparent 55%),radial-gradient(2px 2px at 260px 120px,rgba(88,232,255,.88),transparent 55%),radial-gradient(1px 1px at 420px 210px,rgba(255,114,221,.82),transparent 55%);background-size:560px 300px;animation:starFloat 150s linear infinite}
.stars-b{opacity:.28;background-image:radial-gradient(2px 2px at 100px 140px,rgba(255,255,255,.78),transparent 55%),radial-gradient(2px 2px at 360px 240px,rgba(255,228,154,.75),transparent 55%);background-size:680px 420px;animation:starFloat 220s linear infinite reverse}
@keyframes starFloat{to{transform:translate3d(0,-520px,0)}}
.aurora{position:absolute;border-radius:999px;filter:blur(34px);opacity:.62;will-change:transform}
.aurora-a{width:36vw;height:36vw;left:-13vw;top:8vh;background:rgba(157,98,255,.62)}
.aurora-b{width:38vw;height:38vw;right:-14vw;top:14vh;background:rgba(255,114,221,.52)}
.aurora-c{width:32vw;height:32vw;left:30vw;bottom:-15vw;background:rgba(88,232,255,.36)}
.ribbon{position:absolute;left:-8vw;top:28vh;width:68vw;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);opacity:.38;rotate:-14deg}
.particles{position:absolute;inset:0}
.particles span{position:absolute;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle,#fff,rgba(255,255,255,.05));opacity:.0;animation:particleFloat linear infinite}
@keyframes particleFloat{0%{transform:translate3d(0,22px,0) scale(.7);opacity:0}18%{opacity:.7}100%{transform:translate3d(0,-130px,0) scale(1.1);opacity:0}}

.header{position:sticky;top:0;z-index:40;background:linear-gradient(180deg,rgba(4,5,16,.82),rgba(4,5,16,.46));border-bottom:1px solid rgba(255,255,255,.09);backdrop-filter:blur(10px)}
.nav{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand-mark{width:54px;height:54px;border-radius:18px;overflow:hidden;flex:0 0 auto;background:linear-gradient(135deg,rgba(255,114,221,.18),rgba(88,232,255,.12));border:1px solid rgba(255,255,255,.16);box-shadow:0 16px 34px rgba(157,98,255,.22)}
.brand-mark img{width:112%;height:112%;object-fit:contain}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text strong{font-size:1.35rem;font-weight:1000;letter-spacing:.07em}
.brand-text small{margin-top:7px;color:var(--muted);font-size:.72rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.nav-links{display:flex;gap:8px;flex-wrap:wrap}
.nav-links a{text-decoration:none;color:var(--muted);padding:10px 14px;border-radius:14px;font-weight:900;transition:.18s}
.nav-links a:hover{color:#fff;background:rgba(255,255,255,.08)}

section{position:relative;padding:clamp(54px,7vw,104px) 0}
.hero{min-height:760px;display:grid;align-items:center}
.hero:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 20% 46%,rgba(157,98,255,.30),transparent 35%),radial-gradient(circle at 72% 40%,rgba(255,114,221,.18),transparent 32%)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);align-items:center;gap:clamp(28px,6vw,84px)}
.eyebrow,.kicker{display:inline-flex;align-items:center;gap:10px;color:var(--teal);text-transform:uppercase;letter-spacing:.16em;font-weight:1000;font-size:.78rem}
.eyebrow{padding:10px 14px;border-radius:999px;background:rgba(53,255,208,.10);border:1px solid rgba(53,255,208,.22);box-shadow:0 0 24px rgba(53,255,208,.10)}
.dot{width:10px;height:10px;border-radius:999px;background:var(--teal);box-shadow:0 0 16px var(--teal);animation:pulse 1.8s ease-in-out infinite}
@keyframes pulse{50%{transform:scale(1.35)}}
h1,h2,h3,p{margin-top:0}
h1{margin:18px 0;font-size:clamp(58px,7.4vw,116px);line-height:.86;letter-spacing:-.08em;font-weight:1000;text-transform:uppercase;text-shadow:0 0 34px rgba(157,98,255,.30)}
.animated-title{display:flex;flex-direction:column;gap:.02em;overflow:visible}
.animated-title .title-word{display:flex;white-space:nowrap;overflow:visible;align-items:flex-end}
.animated-title .letter{position:relative;display:inline-block;will-change:transform;transform:translate3d(0,var(--rise),0);backface-visibility:hidden}
.title-main .letter{color:#fff;animation:letterFloat 5.8s ease-in-out infinite;animation-delay:calc(var(--i) * .055s)}
.title-sub{font-style:normal;background:none;color:transparent;overflow:visible}
.title-sub .letter{
  color:transparent;-webkit-text-fill-color:transparent;
  background-image:linear-gradient(90deg,#57e7ff 0%,#7cc9ff 22%,#b5a6ff 46%,#ef7de0 74%,#9d62ff 100%);
  background-size:240% 100%;background-position:calc(var(--games-pos) + (var(--i) * 3%)) 50%;
  -webkit-background-clip:text;background-clip:text;
  animation:letterFloatSub 4.8s ease-in-out infinite;animation-delay:calc(var(--i) * .075s)
}
@keyframes letterFloat{50%{transform:translate3d(0,calc(var(--rise) - 5px),0) rotate(-.7deg)}}
@keyframes letterFloatSub{50%{transform:translate3d(0,calc(var(--rise) - 8px),0) rotate(.8deg)}}
.lead{max-width:650px;color:var(--muted);font-size:clamp(18px,1.75vw,23px);line-height:1.58}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}
.btn{position:relative;overflow:hidden;min-height:54px;display:inline-flex;align-items:center;justify-content:center;padding:0 24px;border-radius:999px;color:#fff;text-decoration:none;font-weight:1000;border:1px solid rgba(255,255,255,.17);transition:transform .18s,box-shadow .18s}
.btn:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(88,232,255,.14)}
.btn.primary{color:#12081e;background:linear-gradient(135deg,var(--gold),#ff98df 45%,var(--cyan));box-shadow:0 16px 36px rgba(255,114,221,.20)}
.btn.glass{background:rgba(255,255,255,.08)}
.hero-stats,.video-grid,.social-grid{display:grid;gap:18px}
.hero-stats{max-width:650px;grid-template-columns:repeat(3,minmax(0,1fr))}
.hero-stats article,.video-card,.social-card,.contact-card{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.052));border:1px solid rgba(255,255,255,.14);border-radius:28px;box-shadow:0 18px 48px rgba(0,0,0,.24),0 0 22px rgba(157,98,255,.08)}
.hero-stats article{padding:18px;position:relative;overflow:hidden}
.hero-stats strong{display:block;font-size:clamp(1.45rem,3vw,2rem);line-height:1.05;letter-spacing:-.045em}
.hero-stats span{display:block;color:var(--muted);margin-top:8px;font-size:.86rem;font-weight:850}

.hero-art{min-height:660px;display:grid;place-items:center;padding:20px 0;overflow:visible}
.mascot-orb{position:relative;width:min(680px,96vw);aspect-ratio:1;display:grid;place-items:center;transform-style:preserve-3d;transition:transform .08s linear;overflow:visible;will-change:transform}
.mascot-orb:before,.mascot-orb:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.mascot-orb:before{inset:-3%;z-index:-2;background:radial-gradient(circle at 50% 48%,rgba(255,255,255,.06),rgba(255,114,221,.10) 42%,rgba(157,98,255,.11) 55%,rgba(88,232,255,.09) 66%,transparent 78%);filter:blur(22px);opacity:.88;transform:translate3d(calc(var(--ringX)*.7),calc(var(--ringY)*.7),0)}
.mascot-orb:after{inset:2%;z-index:-1;box-shadow:0 0 76px rgba(255,228,154,.15),0 0 118px rgba(255,114,221,.14),0 0 150px rgba(157,98,255,.12),0 0 190px rgba(88,232,255,.09);transform:translate3d(calc(var(--ringX)*.55),calc(var(--ringY)*.55),0)}
.halo{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.12);transform:translate3d(var(--ringX),var(--ringY),0);will-change:transform}
.halo-big{inset:0;border-color:rgba(255,228,154,.34);box-shadow:0 0 88px rgba(255,228,154,.14),0 0 120px rgba(255,114,221,.08),inset 0 0 76px rgba(157,98,255,.14);animation:spin 48s linear infinite}
.halo-mid{inset:8%;border-color:rgba(255,114,221,.22);background:radial-gradient(circle,rgba(157,98,255,.18),rgba(255,255,255,.03) 55%,transparent 74%)}
.halo-small{inset:18%;border-color:rgba(88,232,255,.22);animation:spinReverse 62s linear infinite}
@keyframes spin{to{transform:translate3d(var(--ringX),var(--ringY),0) rotate(360deg)}}@keyframes spinReverse{to{transform:translate3d(var(--ringX),var(--ringY),0) rotate(-360deg)}}
.mascot-glass{position:relative;width:82%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;overflow:visible;background:radial-gradient(circle at 50% 34%,rgba(255,255,255,.12),rgba(255,255,255,.04) 40%,transparent 75%);border:1px solid rgba(255,255,255,.16);box-shadow:0 26px 80px rgba(0,0,0,.34),0 0 86px rgba(255,114,221,.14),0 0 60px rgba(88,232,255,.10);transform:translate3d(var(--catX),var(--catY),0);will-change:transform}
.mascot-glass img{width:106%;height:106%;object-fit:contain;filter:drop-shadow(0 28px 48px rgba(0,0,0,.32)) drop-shadow(0 0 26px rgba(255,114,221,.18));animation:floaty 7.5s ease-in-out infinite;transform:translate3d(calc(var(--catX)*.18),calc(var(--catY)*.18),0);will-change:transform}
@keyframes floaty{50%{translate:0 -10px}}
.orbit-dot,.spark{position:absolute;z-index:5;transform:translate3d(var(--ringX),var(--ringY),0)}
.orbit-dot{border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--pink));box-shadow:0 0 20px rgba(88,232,255,.56)}
.od-a{width:22px;height:22px;left:6%;top:62%}.od-b{width:15px;height:15px;right:7%;top:38%}.od-c{width:13px;height:13px;left:18%;top:18%}
.spark{font-size:34px;color:white;filter:drop-shadow(0 0 12px rgba(255,255,255,.58))}
.spark-a{top:19%;left:10%}.spark-b{right:8%;bottom:26%}.spark-c{top:28%;right:8%}.spark-d{bottom:18%;left:14%}.spark-e{left:2%;bottom:34%}

.section-head{margin-bottom:28px}.section-head h2,.contact-card h2{margin:8px 0 0;font-size:clamp(38px,5.4vw,72px);line-height:.94;letter-spacing:-.06em}
.shorts-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.long-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.video-card{position:relative;overflow:hidden;color:white;text-decoration:none;transition:transform .18s,border-color .18s}
.video-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.23)}
.thumb{position:relative;overflow:hidden;background:rgba(255,255,255,.03)}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .28s}
.video-card:hover .thumb img{transform:scale(1.045)}
.shorts-grid .thumb{aspect-ratio:9/16}.long-grid .thumb{aspect-ratio:16/9}
.badge{position:absolute;top:14px;left:14px;z-index:4;padding:8px 12px;border-radius:999px;font-size:.76rem;font-weight:1000;letter-spacing:.09em;text-transform:uppercase;background:rgba(0,0,0,.62);border:1px solid rgba(255,255,255,.17)}
.play-float{position:absolute;inset:0;display:grid;place-items:center;z-index:2}.play-float span{width:72px;height:72px;display:grid;place-items:center;border-radius:999px;color:#0d1021;font-weight:1000;font-size:1.35rem;background:linear-gradient(135deg,var(--gold),#ff98df 45%,var(--cyan));box-shadow:0 18px 44px rgba(0,0,0,.28)}
.video-body{padding:18px;display:flex;flex-direction:column;gap:12px}.video-body h3{margin:0;font-size:1.12rem;line-height:1.3}.video-body p{margin:0;color:var(--muted);line-height:1.6}.video-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto}.video-meta strong{color:var(--teal)}.video-meta span{color:var(--soft);font-weight:1000;letter-spacing:.08em}
.social-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.social-card{min-height:190px;padding:22px;color:white;text-decoration:none;transition:transform .18s,border-color .18s}.social-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.22)}
.social-icon{width:58px;height:58px;display:grid;place-items:center;border-radius:18px;margin-bottom:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);font-size:1.7rem;font-weight:1000}.yt{color:#ff6868}.tg{color:var(--cyan)}.fb{color:#96b7ff}.ig{color:#ff98df}.social-card strong{display:block;font-size:1.25rem;margin-bottom:8px}.social-card p{margin:0;color:var(--muted);line-height:1.6}
.contact-card{display:grid;grid-template-columns:1.12fr .62fr;gap:24px;align-items:center;padding:clamp(26px,5vw,60px);overflow:hidden}.contact-art{position:relative;min-height:320px;display:grid;place-items:center}.contact-bg{position:absolute;inset:0;border-radius:28px;background:radial-gradient(circle at 50% 45%,rgba(255,114,221,.16),transparent 30%),url('/assets/cat-bg.jpg') center/cover no-repeat;filter:saturate(1.08) brightness(.55)}.contact-art img{position:relative;z-index:2;width:min(300px,100%);filter:drop-shadow(0 24px 42px rgba(0,0,0,.32))}
.footer{padding:0 0 44px}.footer-inner{padding-top:22px;border-top:1px solid rgba(255,255,255,.10);color:var(--muted);display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.92rem}.footer a{color:var(--muted);text-decoration:none;margin-left:14px;font-weight:850}.footer a:hover{color:#fff}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .55s,transform .55s}.reveal.visible{opacity:1;transform:translateY(0)}.delay-1{transition-delay:.08s}

@media(max-width:1180px){.hero-grid{grid-template-columns:1fr}.hero{min-height:auto;padding-top:42px}.hero-art{min-height:600px}.shorts-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-card{grid-template-columns:1fr}}
@media(max-width:820px){
  .container{width:min(var(--max),calc(100% - 20px))}.animated-bg{inset:-2vh -2vw}.cursor-light{display:none}.aurora{filter:blur(26px);opacity:.45}.aurora-c,.ribbon,.stars-b{display:none}.grid-layer{opacity:.20}.header{position:relative}.nav{min-height:auto;padding:16px 0;flex-direction:column;align-items:flex-start}.brand-mark{width:62px;height:62px}.brand-text strong{font-size:1.65rem}.brand-text small{font-size:.74rem}.nav-links{width:100%;justify-content:space-between;gap:4px}.nav-links a{padding:8px 4px;font-size:.92rem}section{padding:42px 0}.hero{padding-top:18px}.hero-grid{gap:18px}.hero-art{min-height:360px}.mascot-orb{width:min(370px,92vw)}.mascot-orb:before{filter:blur(16px)}.halo,.orbit-dot,.spark,.mascot-orb:before,.mascot-orb:after,.mascot-glass,.mascot-glass img{transform:none!important}h1{font-size:clamp(44px,14vw,74px);line-height:.88;letter-spacing:-.065em}.lead{font-size:1.05rem}.hero-stats,.long-grid,.social-grid{grid-template-columns:1fr}.shorts-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.video-body{padding:12px;gap:8px}.video-body h3{font-size:.82rem;line-height:1.22}.video-meta{display:block}.video-meta strong,.video-meta span{display:block;font-size:.78rem}.badge{top:8px;left:8px;padding:6px 8px;font-size:.62rem}.play-float span{width:48px;height:48px;font-size:1rem}.contact-art{min-height:260px}
}
@media(max-width:430px){.shorts-grid{gap:10px}.video-body{padding:10px}.video-body h3{font-size:.78rem}.particles span:nth-child(n+7){display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}
