:root{--ink:#101322;--navy:#151a2c;--mint:#91f2cb;--paper:#f4f1e9;--muted:#b1b5c9;--line:#30364c;--purple:#b5a0f5}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--ink);color:var(--paper);font-family:Inter,Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--mint);outline-offset:5px}img,video{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2{font-family:Impact,'Arial Black',sans-serif;font-weight:900;line-height:.98;letter-spacing:-.025em}h1{font-size:clamp(3.6rem,6.1vw,6rem);margin:22px 0}h2{font-size:clamp(2.8rem,4.5vw,4.9rem)}h3{line-height:1.2;font-size:1.6rem}p{margin:16px 0;color:var(--muted)}.mint{color:var(--mint)}.section{max-width:1360px;margin:auto;padding:104px 56px}.eyebrow{font-size:.74rem;font-weight:800;letter-spacing:.16em;color:var(--mint);margin:0 0 18px}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--mint);margin-right:8px}.header{position:relative;z-index:5;max-width:1480px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:25px 56px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:1.2rem;letter-spacing:-.04em;line-height:1.05}.brand>span{display:block}.brand small{display:block;font-size:.57rem;letter-spacing:.28em;font-weight:500;margin-top:7px;color:var(--muted)}.brand img{border-radius:50%}nav{display:flex;gap:30px;align-items:center;font-size:.86rem;font-weight:600}nav>a:hover,.text-link:hover{color:var(--mint)}.button{background:var(--mint);color:var(--ink);font-weight:800;display:inline-flex;justify-content:space-between;align-items:center;gap:34px;padding:18px 23px;border-radius:5px;border:1px solid var(--mint);transition:transform .18s,background .18s}.button:hover{background:#bdffe3;transform:translateY(-2px)}.button.small{padding:11px 17px}.menu-toggle{display:none}.skip{position:absolute;top:-80px;left:20px;background:var(--mint);padding:12px;color:var(--ink);z-index:20}.skip:focus{top:10px}.hero{display:grid;grid-template-columns:1fr 1.18fr;gap:45px;align-items:center;min-height:660px;padding-top:80px;padding-bottom:90px;overflow:hidden}.hero-copy{position:relative;z-index:2}.hero-copy>p:not(.eyebrow){max-width:430px}.lede{font-size:1.22rem;color:var(--paper);line-height:1.45}.actions{display:flex;align-items:center;gap:24px;margin-top:30px;flex-wrap:wrap}.text-link{font-size:.88rem;font-weight:700}.fine{font-size:.77rem;color:#9298b3;line-height:1.65}.hero-art{position:relative;padding:70px 0 100px}.game-window{position:relative;z-index:1;background:#252a3d;border:1px solid #53556b;border-radius:12px;box-shadow:0 32px 90px #0008;transform:rotate(-3deg);overflow:hidden}.window-top{padding:12px;font-size:.62rem;letter-spacing:.13em;font-weight:800;display:flex;align-items:center}.window-top .dot{width:6px;height:6px}.window-top>span:last-child{margin-left:auto;color:#a3a5b9;font-weight:500;font-size:.55rem}.game-window video{width:100%;aspect-ratio:16/9;background:var(--navy)}#video-toggle{position:absolute;right:12px;bottom:12px;background:#101322d9;border:1px solid #777a93;border-radius:4px;color:white;padding:5px 10px;font-size:.66rem}.hero-fighter{position:absolute;width:240px;bottom:5px;left:-50px;z-index:2;filter:drop-shadow(0 15px 15px #0008)}.sticker{position:absolute;z-index:2;background:var(--purple);color:var(--ink);padding:17px 24px;font-family:Impact,'Arial Black',sans-serif;font-size:1.35rem;line-height:1.1;right:0;bottom:35px;transform:rotate(6deg);box-shadow:7px 7px 0 #0005}.orbit{position:absolute;width:420px;height:420px;border:1px solid #47415f;border-radius:50%;top:0;left:20px}.orbit-two{transform:scale(.8) translate(80px,70px)}.ticker{display:flex;justify-content:center;gap:36px;padding:19px 20px;background:var(--mint);color:var(--ink);font-weight:900;font-size:.83rem;letter-spacing:.08em;flex-wrap:wrap}.modes{display:grid;grid-template-columns:.85fr 1.15fr;gap:100px}.section-heading>p:not(.eyebrow){max-width:390px}.mode-list article{border-bottom:1px solid var(--line);display:grid;grid-template-columns:30px 1fr 90px;gap:22px;padding:28px 0;align-items:center}.mode-list article:first-child{padding-top:0}.mode-list p{font-size:.94rem}.mode-list img{width:90px}.number{align-self:start;color:var(--mint);font-size:.78rem;letter-spacing:.1em}.tag{display:inline-block;font-size:.64rem;letter-spacing:.12em;border:1px solid #56566b;padding:6px 10px;border-radius:3px;font-weight:700}.fighter-section{background:var(--paper);color:var(--ink)}.fighter-section p{color:#606373}.fighter-section .eyebrow{color:#247559}.fighter-section .mint{color:#20745e}.fighter-inner{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.fighter-picker>p{max-width:440px}.fighter-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;max-width:500px;margin:25px 0}.fighter-grid button{background:#e6e1d8;border:2px solid transparent;padding:2px;border-radius:6px;min-width:0;transition:transform .15s}.fighter-grid button[aria-pressed=true]{border-color:#20745e;background:#bce8d1;transform:translateY(-3px)}.fighter-grid img{width:100%;aspect-ratio:1/1;object-fit:contain}.fighter-showcase{position:relative;display:grid;grid-template-columns:1fr;justify-items:center;padding-top:10px}.fighter-halo{background:#d3d3ed;border-radius:50%;width:280px;height:280px;position:absolute;top:0}.fighter-showcase>img{position:relative;object-fit:contain;width:320px;height:280px;image-rendering:auto;filter:drop-shadow(0 12px 10px #2222)}.fighter-info{width:100%;max-width:430px}.fighter-info h3{font-size:2rem}.fighter-info .eyebrow{margin-bottom:4px}.fighter-info p{font-size:.9rem;margin:8px 0 18px}.fighter-info dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 25px}.stat dt{font-size:.67rem;letter-spacing:.13em;text-transform:uppercase;color:#5d6171}.stat dd{margin:1px 0;font-size:1.1rem;font-weight:800}.stat-meter{height:4px;background:#dad8d0}.stat-meter span{height:100%;display:block;background:#247559}.watch{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;align-items:center}.video-card video{border:1px solid #4b506b;width:100%;border-radius:8px;aspect-ratio:16/9;background:#17172a}.video-caption{display:flex;justify-content:space-between;gap:20px;padding:16px 0;font-size:.69rem;letter-spacing:.08em}.video-caption a{color:var(--mint)}.tutorial-section{background:#20243a}.tutorial-inner{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.steps{list-style:none;padding:0;margin:30px 0 0}.steps li{display:flex;gap:20px;margin:25px 0}.steps li>span{color:var(--mint);font-size:.8rem;letter-spacing:.1em;padding-top:3px}.steps h3{font-size:1.12rem}.steps p{font-size:.9rem;margin:8px 0}.tutorial-card{padding:25px;border:1px solid #4b506b;border-radius:10px;background:#161b2e}.tutorial-card .tag{margin-bottom:18px;color:var(--mint)}.tutorial-card video{width:100%;aspect-ratio:16/9;background:#0b1222;border-radius:5px}.tutorial-card h3{margin-top:22px}.tutorial-card p{font-size:.9rem}.tutorial-card .text-link{color:var(--mint)}.download{display:grid;grid-template-columns:1fr 1fr;gap:100px}.download-copy{max-width:480px}.download .button{margin-top:15px}.faq>h3{font-size:.85rem;letter-spacing:.09em;margin-bottom:24px}.faq details{border-top:1px solid var(--line);padding:18px 0}.faq details:last-child{border-bottom:1px solid var(--line)}.faq summary{cursor:pointer;font-size:.96rem;font-weight:600}.faq details p{font-size:.9rem}.faq a{color:var(--mint);font-size:.85rem}footer{max-width:1360px;margin:auto;padding:40px 56px;border-top:1px solid var(--line);display:flex;align-items:center;gap:25px;flex-wrap:wrap}footer p,footer small{font-size:.72rem;color:var(--muted)}footer div{margin-left:auto;display:flex;flex-wrap:wrap;gap:14px 20px;font-size:.78rem}footer small{width:100%;margin-top:-12px}@media(max-width:1000px){.section{padding:75px 30px}.header{padding:22px 30px}.hero{gap:20px}.hero-fighter{width:180px;left:-15px}.hero-art{padding-bottom:65px}.sticker{font-size:1.1rem;right:-5px;bottom:20px}.hero h1{font-size:4.3rem}.modes,.fighter-inner,.watch,.tutorial-inner,.download{gap:45px}.ticker{gap:20px;font-size:.7rem}nav{gap:20px}.mode-list article{grid-template-columns:24px 1fr}.mode-list img{display:none}.fighter-grid{grid-template-columns:repeat(6,1fr)}}@media(max-width:700px){.header{padding:18px 22px}.brand{font-size:1rem}.brand img{width:38px;height:38px}.menu-toggle{display:block;background:transparent;color:var(--paper);border:1px solid #5b637c;border-radius:5px;padding:7px 13px}nav{display:none;position:absolute;top:84px;left:0;right:0;background:var(--navy);padding:24px;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line)}nav.open{display:flex}.section{padding:60px 24px}.hero{grid-template-columns:1fr;padding-top:48px;padding-bottom:25px}.hero h1{font-size:clamp(3rem,12vw,5rem)}.hero-copy>p:not(.eyebrow){max-width:100%}.hero-art{padding:35px 10px 75px;margin-top:8px}.orbit{width:290px;height:290px;left:30px;top:10px}.hero-fighter{width:170px;left:0;bottom:5px}.sticker{right:5px;bottom:20px}.actions{gap:20px}.ticker{padding:18px;gap:12px 18px;justify-content:flex-start}.ticker span:last-child,.ticker span:nth-last-child(2){display:none}.modes,.fighter-inner,.watch,.tutorial-inner,.download{grid-template-columns:1fr;gap:35px}.section-heading h2{font-size:3rem}.mode-list article{grid-template-columns:24px 1fr 70px;gap:13px;padding:22px 0}.mode-list img{display:block;width:70px}.mode-list h3{font-size:1.35rem}.fighter-grid{grid-template-columns:repeat(7,1fr);gap:5px}.fighter-inner{padding-bottom:65px}.fighter-showcase{padding-top:5px}.fighter-info{max-width:100%}.fighter-showcase>img{height:240px}.fighter-halo{width:240px;height:240px}.watch{padding-top:65px;padding-bottom:65px}.tutorial-card{padding:18px}.download{padding-bottom:65px}.video-caption{font-size:.59rem;gap:10px}footer{padding:28px 24px;gap:18px}footer div{margin-left:0;width:100%}footer p{margin:0}footer small{margin:0}.window-top>span:last-child{font-size:.5rem}.window-top{font-size:.56rem}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.hero-fighter{filter:none}}

/* Gameplay leads on phones; decorative art never covers the arena. */
@media(min-width:701px){
 .hero{padding-top:28px;padding-bottom:64px;min-height:0;align-items:start}
 .hero-art{padding-top:32px;padding-bottom:80px}
}
.mobile-hook{display:none}
.preview-controls{position:absolute;right:10px;bottom:10px;display:flex;gap:8px}
.preview-controls #video-toggle,.preview-controls #video-sound{position:static;background:#101322ed;border:1px solid #777a93;border-radius:5px;color:white;padding:8px 12px;font-size:.75rem;min-height:36px}
@media(max-width:700px){
 .header{padding:11px 18px}.brand img{width:34px;height:34px}.brand small{margin-top:4px}.menu-toggle{min-height:40px}
 .hero{padding:14px 16px 26px;gap:18px;min-height:0;overflow:visible}
 .hero-art{order:-1;padding:0;margin:0;min-width:0}
 .hero-art .orbit,.hero-art .hero-fighter,.hero-art .sticker{display:none}
 .game-window{transform:none;border-radius:9px;box-shadow:0 10px 28px #0005}
 .window-top{padding:8px 10px;font-size:.56rem}
 .game-window video{object-fit:contain;aspect-ratio:16/9}
 .hero-copy .eyebrow{font-size:.61rem;margin:0 0 10px;letter-spacing:.12em}
 .hero h1{font-size:clamp(2.4rem,10vw,3.8rem);margin:0 0 10px;line-height:1}
 .hero-description,.hero-copy .text-link{display:none}
 .mobile-hook{display:block;color:var(--paper);font-size:1rem;margin:0 0 14px}
 .hero-copy .actions{margin-top:0;display:block}
 .hero-copy .button{width:100%;padding:14px 18px;min-height:54px}
 .preview-controls{right:8px;bottom:8px;gap:6px}
 .preview-controls #video-toggle,.preview-controls #video-sound{font-size:.65rem;padding:6px 9px;min-height:34px}
}

/* Four real character families, with accessible category selection. */
.family-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:22px 0 12px}
.family-cards button{background:#141e31;border:1px solid #34435b;border-radius:14px;padding:10px 4px;color:#fff;cursor:pointer;min-width:0}
.family-cards button[aria-pressed=true]{border-color:#70f0da;background:#193c40}
.family-cards img{width:100%;height:110px;object-fit:contain;display:block}
.family-cards strong{display:block;font-size:15px}.family-cards small{display:block;font-size:9px;margin-top:7px;color:#a9bdd0}
.fighter-grid button[hidden]{display:none}
@media(max-width:480px){.family-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.family-cards img{height:125px}}

.duel-clips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.duel-clips article{min-width:0}.duel-clips video{display:block;width:100%;aspect-ratio:16/9;background:#0b1222;border-radius:12px}.duel-clips p{color:#a9bdd0;font-size:13px}@media(max-width:760px){.duel-clips{grid-template-columns:1fr}}

/* Platform availability stays visible beside the Android download. */
.hero-copy .actions:has(.ios-coming-soon){gap:12px}.ios-coming-soon{background:var(--mint);color:var(--ink);border-color:var(--mint);cursor:default;opacity:1;gap:16px}.ios-coming-soon:hover{background:var(--mint);transform:none}.coming-soon-label{font-size:.76rem;font-weight:700;color:var(--ink);white-space:nowrap}.hero-copy .gameplay-action{margin-top:18px}@media(max-width:600px){.hero-copy .actions:has(.ios-coming-soon){display:grid;grid-template-columns:1fr;width:100%}.hero-copy .actions:has(.ios-coming-soon)>.button{width:100%;min-height:64px}.hero-copy .gameplay-action{margin-top:18px}}
