/* ACED shared CRT theme.
   Linked by every page BEFORE its own inline <style>, so page-specific rules
   still win. Token names match aced-pack.js applyTheme() exactly, so a custom
   pack palette rethemes everything defined here.
   Token values are the site palette (landing + game pages). daily.html,
   importer.html, study.html and cheatsheet.html intentionally re-declare the
   token block inline with their own darker/legacy variants. */
:root{
  --green:#22ff66; --green-dim:#0fa84a; --amber:#ffb627; --cyan:#5cffea; --gold:#ffd23f;
  --money:#9be36b; --white:#d8f5d8; --grey:#5a7058; --magenta:#ff5cb8; --red:#ff5238;
  --bg:#070b08; --bg2:#0d1409; --panel:#0a160a; --panel2:#06100a; --border:#16291a;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--white);font-family:'VT323',ui-monospace,monospace;font-size:20px;line-height:1.3;overflow-x:hidden}
body{background:radial-gradient(ellipse at center,var(--bg2),#000),var(--bg);min-height:100vh;position:relative}
/* scanlines + vignette — the CRT signature, pointer-events off */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;background:repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0,rgba(0,0,0,.16) 1px,transparent 1px,transparent 3px)}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:199;background:radial-gradient(ellipse at center,transparent 56%,rgba(0,0,0,.66))}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}

/* ---- top nav ---- */
header{position:sticky;top:0;z-index:50;background:linear-gradient(180deg,var(--bg),rgba(7,11,8,.85));border-bottom:1px solid var(--border);backdrop-filter:blur(3px)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:54px;flex-wrap:wrap;gap:6px;padding:6px 0}
.brand{font-family:'Press Start 2P';font-size:15px;color:var(--green);text-shadow:0 0 10px rgba(34,255,102,.6);letter-spacing:1px}
.blink{animation:blink 1.1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.navlinks{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.chip{font-family:'Press Start 2P';font-size:8px;border:1px solid var(--border);background:var(--panel);color:var(--grey);padding:8px 10px}
.chip:hover{color:var(--green);border-color:var(--green-dim)}
.chip.on{color:var(--cyan);border-color:#0a4a4a}
@media(max-width:720px){.navlinks .chip{font-size:7px;padding:7px 8px}}

/* ---- touch + mobile pass ---- */
button,.btn,.chip,.choice,a,[role="button"],input,select,textarea{touch-action:manipulation}
@media (hover:none){
  button:active,.btn:active,.chip:active{filter:brightness(1.25)}
  .choice:active{transform:scale(.99);filter:brightness(1.2)}
}
/* No shared font-size/padding override for buttons at <=480px: pages that use
   .btn already size it for mobile, and forcing it here re-wrapped CTA labels on
   study.html and league.html. Tap-target sizing stays with the page. */
@media (max-width:480px){
  .choice{font-size:17px;padding:12px;min-height:44px}
}