*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow-x:hidden}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at 50% 0,#facc15 0 7rem,transparent 22rem),radial-gradient(circle at 18% 18%,#2563eb 0 12rem,transparent 30rem),linear-gradient(135deg,#03000f,#10002b 54%,#020617);color:#f8fafc}button,a{font:inherit}.shell{width:min(1220px,calc(100% - 28px));margin:auto;padding:18px 0 40px}.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.back,.round{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.1);color:#fff;text-decoration:none;border-radius:999px;padding:10px 14px;font-weight:950}.round{width:44px;height:44px;cursor:pointer}.brand{display:flex;align-items:center;gap:10px;background:rgba(3,0,15,.78);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:9px 16px;box-shadow:0 18px 42px rgba(0,0,0,.28)}.brand span{font-size:1.25rem}.brand small{color:#fde68a;font-weight:850}.hero{display:grid;grid-template-columns:1fr 230px;gap:16px;margin-bottom:16px;padding:24px;border-radius:32px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 70px rgba(0,0,0,.25)}.eyebrow{margin:0 0 8px;text-transform:uppercase;letter-spacing:.12em;color:#fde68a;font-weight:1000;font-size:.76rem}.hero h1{margin:0;font-size:clamp(2rem,5vw,4.5rem);line-height:.9;letter-spacing:-.07em}.hero p{max-width:720px;color:#dbeafe;line-height:1.55}.hero aside{background:linear-gradient(135deg,#f59e0b,#7c3aed);border-radius:24px;padding:18px}.hero aside span,.hero aside small{display:block;color:#fff7ed;font-weight:900}.hero aside strong{display:block;font-size:1.25rem;margin:5px 0}.game{display:grid;grid-template-columns:220px minmax(0,1fr) 260px;gap:16px}.panel{border:1px solid rgba(255,255,255,.13);border-radius:30px;background:rgba(255,255,255,.09);box-shadow:0 22px 65px rgba(0,0,0,.26);overflow:hidden;backdrop-filter:blur(12px)}.hud{padding:16px;display:grid;gap:10px;align-content:start}.hud>div{display:flex;justify-content:space-between;align-items:center;background:rgba(255,255,255,.1);border-radius:18px;padding:12px}.hud span{font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;color:#bfdbfe;font-weight:950}.hud strong{font-size:1.25rem}.primary,.ghost{border:0;border-radius:17px;padding:12px;color:white;font-weight:950;cursor:pointer}.primary{background:linear-gradient(135deg,#f59e0b,#38bdf8);color:#111827}.ghost{background:#111827}.hud p{color:#dbeafe;line-height:1.45;font-weight:750}.stage{padding:12px}canvas{display:block;width:100%;aspect-ratio:900/600;border-radius:22px;touch-action:none;background:#020617}.legend{padding:18px}.legend strong{font-size:1.2rem}.legend div{display:grid;gap:8px;margin-top:14px}.legend b{color:#fde68a}.legend span{margin-top:-8px;color:#dbeafe;font-size:.86rem}.stars{font-size:2rem;color:#facc15;margin-top:18px;text-align:center}.toast{position:fixed;left:50%;top:18px;transform:translateX(-50%) translateY(-16px);opacity:0;border-radius:999px;padding:12px 18px;background:#111827;color:#fff;font-weight:1000;box-shadow:0 18px 38px rgba(0,0,0,.35);transition:.18s;z-index:30}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.toast.good{background:#166534}.toast.bad{background:#991b1b}@media(max-width:1050px){.game{grid-template-columns:1fr}.hud{grid-template-columns:repeat(4,1fr)}.hud .primary,.hud .ghost,.hud p{grid-column:span 2}.legend{order:2}.stage{order:3}}@media(max-width:680px){.shell{width:calc(100% - 18px);padding-top:10px}.brand small{display:none}.hero{grid-template-columns:1fr;padding:18px;border-radius:24px}.hero h1{font-size:2.2rem}.hud{grid-template-columns:1fr 1fr;border-radius:24px}.hud p{grid-column:span 2}.stage{padding:8px;border-radius:24px}canvas{border-radius:18px}.legend{display:none}}
.banner{position:absolute;left:50%;top:34px;transform:translateX(-50%) translateY(-18px);opacity:0;pointer-events:none;border-radius:999px;padding:12px 20px;background:rgba(250,204,21,.94);color:#111827;font-weight:1000;box-shadow:0 18px 42px rgba(250,204,21,.25);transition:.22s;z-index:5}.banner.show{opacity:1;transform:translateX(-50%) translateY(0)}
.stage{position:relative}.hud{grid-template-columns:1fr}.hud>div:nth-child(5),.hud>div:nth-child(6){background:rgba(250,204,21,.12)}
@media(max-width:1050px){.hud{grid-template-columns:repeat(3,1fr)}.hud .primary,.hud .ghost,.hud p{grid-column:span 3}}
@media(max-width:680px){.hud{grid-template-columns:1fr 1fr}.hud .primary,.hud .ghost,.hud p{grid-column:span 2}.banner{top:18px;max-width:calc(100% - 24px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
/* 90s arcade cabinet / CRT pass */
body{background:radial-gradient(circle at 50% -8%,#fef08a 0 8rem,transparent 24rem),radial-gradient(circle at 12% 18%,#ec4899 0 14rem,transparent 32rem),radial-gradient(circle at 88% 22%,#22d3ee 0 13rem,transparent 30rem),linear-gradient(135deg,#050014,#190033 46%,#001b2e)!important}.arcade-cabinet{position:relative}.arcade-cabinet:before{content:"VOIDRUSH 1996";display:block;text-align:center;margin:0 auto 12px;width:min(680px,100%);padding:10px 16px;border:3px solid #facc15;border-radius:18px;background:linear-gradient(90deg,#111827,#581c87,#111827);color:#fef08a;font-weight:1000;letter-spacing:.18em;text-shadow:0 0 8px #facc15,0 0 18px #ec4899;box-shadow:0 0 0 4px rgba(236,72,153,.22),0 18px 50px rgba(0,0,0,.35)}.top,.hero,.panel{border-color:rgba(250,204,21,.34)!important;box-shadow:0 0 0 2px rgba(34,211,238,.12),0 0 32px rgba(236,72,153,.22),0 22px 65px rgba(0,0,0,.34)!important}.brand{background:linear-gradient(90deg,#111827,#581c87)!important;border-color:#facc15!important;text-shadow:0 0 10px rgba(250,204,21,.75)}.hero h1{color:#fef08a;text-shadow:0 0 14px rgba(250,204,21,.55),0 0 26px rgba(236,72,153,.35)}.hud>div{background:linear-gradient(135deg,rgba(17,24,39,.88),rgba(88,28,135,.5))!important;border:1px solid rgba(34,211,238,.26)}.hud strong{color:#fef08a;text-shadow:0 0 10px rgba(250,204,21,.45)}.primary{background:linear-gradient(135deg,#facc15,#22d3ee)!important;color:#16051f!important;box-shadow:0 5px 0 #a16207,0 0 24px rgba(34,211,238,.35)}canvas{border:4px solid #111827;box-shadow:inset 0 0 0 3px rgba(250,204,21,.6),0 0 34px rgba(34,211,238,.38),0 0 60px rgba(236,72,153,.25)!important;image-rendering:auto}.crt-overlay{position:fixed;inset:0;z-index:999;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.055) 0 1px,rgba(0,0,0,0) 1px 4px),radial-gradient(circle at 50% 50%,transparent 45%,rgba(0,0,0,.22) 100%);mix-blend-mode:screen;opacity:.3}.banner{border:2px solid #facc15;background:linear-gradient(90deg,#facc15,#22d3ee,#ec4899)!important;color:#111827!important;text-shadow:none!important}.toast{border:2px solid #22d3ee;background:#111827!important;color:#fef08a!important;text-shadow:0 0 8px rgba(250,204,21,.55)}@media(max-width:680px){.arcade-cabinet:before{font-size:.78rem;letter-spacing:.1em}.crt-overlay{opacity:.28}}

.missionBox{margin-top:18px;padding:14px;border-radius:20px;background:rgba(15,23,42,.62);border:1px solid rgba(250,204,21,.26)}.missionBox b{display:block;color:#fef08a;margin-bottom:10px}.missionBox ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}.missionBox li{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:8px;border-radius:14px;background:rgba(255,255,255,.07);color:#dbeafe;font-size:.82rem;font-weight:850}.missionBox li.done{background:rgba(34,197,94,.2);color:#dcfce7}.missionBox li span{color:#facc15}.missionBox li em{font-style:normal;color:#67e8f9;font-weight:1000}@media(max-width:1050px){.missionBox{display:none}}

.masteryBox{margin-top:12px;padding:14px;border-radius:20px;background:rgba(88,28,135,.38);border:1px solid rgba(34,211,238,.26)}.masteryBox b{display:block;color:#67e8f9;margin-bottom:10px}.masteryBox #mastery{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 8px}.masteryBox span{padding:6px 8px;border-radius:999px;background:rgba(255,255,255,.08);color:#cbd5e1;font-weight:1000;font-size:.8rem}.masteryBox span.cleared{background:linear-gradient(135deg,#facc15,#22d3ee);color:#111827;box-shadow:0 0 18px rgba(250,204,21,.22)}.masteryBox small{color:#dbeafe;font-weight:850;line-height:1.35}@media(max-width:1050px){.masteryBox{display:none}}

.echo-line{margin:12px 0 0;padding:10px 12px;border-radius:14px;background:rgba(34,211,238,.10);border:1px solid rgba(34,211,238,.28);color:#e0f2fe;font-size:.82rem;font-weight:800;line-height:1.4}.echo-line b{color:#67e8f9;margin-right:6px}
@media(prefers-reduced-motion:reduce){.crt-overlay{display:none}}

.meters{grid-column:1/-1;display:grid;gap:6px;margin-top:6px}
.hud>.meters{background:none!important;border:0!important;padding:0!important;box-shadow:none!important}
.meters .bar{position:relative;height:10px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}
.meters .bar i{position:absolute;top:0;bottom:0;left:0;width:0;border-radius:999px;transition:width .12s linear}
.sun-bar i{background:linear-gradient(90deg,#facc15,#fb923c)}
.sun-bar i.low{background:linear-gradient(90deg,#ef4444,#f97316)}
.grade-bar i{background:linear-gradient(90deg,#22d3ee,#a855f7)}
.meters small{font-size:.68rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase;color:#cbd5e1}

.coach{position:absolute;inset:0;display:none;flex-direction:column;gap:12px;justify-content:center;padding:20px;border-radius:24px;background:linear-gradient(180deg,rgba(5,0,20,.72),rgba(5,0,20,.92));z-index:6;color:#e0f2fe}
.coach.show{display:flex}
.coach h2{margin:0;font-size:1.05rem;color:#fef08a}
.coach ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.coach li{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;font-size:.86rem;line-height:1.4;font-weight:700}
.coach li b{color:#67e8f9}
.coach button{align-self:flex-start;background:linear-gradient(135deg,#facc15,#22d3ee);color:#16051f;border:0;border-radius:10px;padding:10px 18px;font:inherit;font-weight:900;cursor:pointer}

.dpad{display:none;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(2,46px);gap:6px;margin-top:10px;justify-content:center}
.dpad button{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:12px;font-size:1rem;font-weight:900;cursor:pointer;touch-action:none}
.dpad button[data-dir="up"]{grid-column:2;grid-row:1}
.dpad button[data-dir="left"]{grid-column:1;grid-row:2}
.dpad button[data-dir="down"]{grid-column:2;grid-row:2}
.dpad button[data-dir="right"]{grid-column:3;grid-row:2}
@media(pointer:coarse){.dpad{display:grid}}

button:focus-visible,a:focus-visible{outline:3px solid #67e8f9;outline-offset:2px}
@media(prefers-contrast:more){.crt-overlay{display:none}}

