/* Arcade edition: same atlas, content and learning progress. */
:root{--gold:#65ffe3;--text:#f2f4ff;--muted:#b7b0cb;--line:#65ffe355;color-scheme:dark}
body{background:#080912;font-family:'Courier New',monospace}
header{height:90px;background:#080912ee;border-bottom:1px solid #ffffff1c;padding:0 4%}
.brand{font-weight:900;letter-spacing:.09em;font-size:14px}.orb{color:#ff71d4;font-size:35px;text-shadow:3px 3px #783860}
nav{gap:28px}nav button{font:700 11px 'Courier New',monospace;text-transform:uppercase;letter-spacing:.05em}nav button[aria-current]{color:#65ffe3;border-bottom:3px solid #65ffe3}
.skin-switch{font-family:inherit;border-radius:2px;border-color:#ff71d477;color:#ff9ce2;box-shadow:3px 3px #ff71d418}
.universe{background:radial-gradient(ellipse at 68% 45%,#3d174637,transparent 60%),#080912;min-height:730px}
.universe:before{content:'';position:absolute;inset:90px 0 0;background-image:linear-gradient(#aa65ef12 1px,transparent 1px),linear-gradient(90deg,#aa65ef12 1px,transparent 1px);background-size:48px 48px;pointer-events:none}
.universe:after{content:'';position:absolute;inset:90px 0 0;pointer-events:none;background:repeating-linear-gradient(transparent 0 3px,#00000014 3px 4px);z-index:3}
.arcade-hud{position:absolute;top:116px;left:4%;right:4%;display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.12em;color:#948da7;z-index:2}
.arcade-hud span:first-child:before{content:'■ ';color:#65ffe3}
.interactive-atlas .scene picture{display:none!important}.scene:after{background:none}.scene{inset:75px 0 30px}
.intro{left:4%;top:26%;max-width:340px}.intro .eyebrow{font-size:10px;color:#ff9cde;letter-spacing:.08em}
h1{font:900 clamp(36px,4.2vw,64px)/1.04 'Courier New',monospace;letter-spacing:-.055em;margin:24px 0;text-shadow:3px 3px #62365e}h1 em{color:#65ffe3;text-shadow:3px 3px #235e58}
.intro .rule{width:52px;height:4px;background:#ff71d4;margin:26px 0}.intro p:not(.eyebrow){font-size:12px;line-height:1.9;color:#b7b0cb}
.outline{border:1px solid #65ffe3;border-radius:0;background:#65ffe3;color:#09151a;font:700 12px 'Courier New',monospace;padding:16px 20px;box-shadow:5px 5px #225b54;margin-top:20px}.outline:hover{background:#b6ffef;transform:translateY(-2px)}
.controls{border-radius:0;border-color:#65ffe34d;background:#0d1125;box-shadow:4px 4px #000;right:4%;top:30%;padding:0}.controls button{color:#65ffe3;border-bottom:1px solid #65ffe326;font-family:monospace}.controls button:last-child{border:0}
.scene-footer{left:4%;right:4%;bottom:30px;border-top:1px solid #ffffff20;padding-top:20px;font-family:monospace}.status b{background:#65ffe3;border-radius:0;box-shadow:0 0 9px #65ffe388}.signature{color:#ff9cde;letter-spacing:.06em}.atlas-hint{font-family:monospace;color:#a99fbf}
/* Game inventory windows are crisp, opaque and readable. */
dialog{background:#101024;border:1px solid #65ffe3;border-radius:0;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:8px 8px 0 #02030a,9px 9px 0 #ff71d466;padding:30px 32px;color:#f2f4ff}
dialog::backdrop{background:#03050bd9;backdrop-filter:blur(4px)}.dialog-top{background:#101024;border-bottom:1px solid #65ffe344}.dialog-top .eyebrow{font-family:monospace;letter-spacing:.12em}#close{color:#ff9cde;border:1px solid #ff71d455;border-radius:0}
dialog h2{font-family:'Courier New',monospace;font-weight:900;letter-spacing:-.04em;font-size:34px}dialog .card,dialog .lesson-card{border-radius:0;background:#19182f;border:1px solid #6c607d;box-shadow:3px 3px #050711}dialog .card:hover,dialog .lesson-card:hover{border-color:#65ffe3;background:#22203a}dialog .card h3,dialog .lesson-card h3{font-family:'Courier New',monospace;font-weight:700}dialog .search{border-radius:0;background:#080b18;border-color:#665676;font-family:monospace}dialog .filters button{border-radius:0;font-family:monospace}dialog .filters button.active{background:#65ffe3;color:#07151a}dialog .outline{border-radius:0;background:#65ffe3;color:#09151a;box-shadow:3px 3px #225b54}dialog progress{accent-color:#65ffe3}dialog .training-progress{border-radius:0}dialog p,dialog li{color:#c9c5d8}
@media(min-width:751px) and (max-width:1100px){header nav{gap:16px;margin-right:15px}.brand{font-size:12px}.intro{max-width:250px}h1{font-size:42px}.signature{display:none}}
@media(max-width:750px){header{height:66px;padding:0 16px}.brand{font-size:11px!important}.orb{font-size:27px}.universe{height:calc(100svh - 76px - env(safe-area-inset-bottom));min-height:620px}.universe:before,.universe:after{top:66px}.arcade-hud{top:81px;left:20px;right:20px;font-size:8px;letter-spacing:.02em}.arcade-hud span:last-child{color:#ff9cde}.intro{top:113px;left:20px;right:20px;max-width:none}.intro .eyebrow{font-size:8px;margin:0}.intro h1{font-size:34px;line-height:1.02;margin:12px 0;text-shadow:2px 2px #62365e}.intro h1 br{display:none}.intro h1 em{display:inline}.intro h1 em:before,.intro h1 em:after{content:' '}.intro .outline{margin-top:4px;padding:12px 16px;font-size:10px;min-height:44px}.scene{inset:235px 0 118px}.controls{top:auto;right:auto;bottom:48px;padding:0}.controls button{border-bottom:0;border-right:1px solid #65ffe326}.atlas-hint{bottom:106px;font-size:9px}.scene-footer{left:20px;right:20px;bottom:12px;padding-top:10px;font-size:9px}.scene-footer .signature{display:none}nav{background:#101024!important;border-top:1px solid #65ffe34d!important;border-radius:0!important}nav button{font-size:9px!important}dialog{border-radius:0;padding:22px 20px;max-height:88svh}.dialog-top{background:#101024}dialog h2{font-size:27px}.card{border-radius:0}.skin-switch{min-height:40px}}
@media(prefers-reduced-motion:reduce){.outline:hover{transform:none}}@media(prefers-contrast:more){.arcade-hud,.atlas-hint{color:#fff}.universe:after{display:none}}
.interactive-atlas .nodes .node{border-radius:0;border-color:#65ffe34d;background:#101024;font-family:monospace;color:#b7dfd8}.interactive-atlas .controls{border-radius:0;border-color:#65ffe34d;background:#0d1125}.interactive-atlas nav button{border-radius:0}.interactive-atlas .atlas-hint{color:#aaa2b9}
@media(max-width:750px){.interactive-atlas .intro{top:115px;left:20px;right:20px}.interactive-atlas .intro h1{font-size:32px;line-height:1.05;max-width:350px;margin:10px 0}.interactive-atlas .intro h1 em{display:inline}.interactive-atlas .intro h1 br{display:none}.interactive-atlas .scene{inset:224px 0 118px}.interactive-atlas .controls{padding:0;gap:0}.interactive-atlas .intro .eyebrow{margin-bottom:5px}}
