:root { color-scheme: dark; --bg:#0b0d26; --bg2:#1a1550; --panel:#1b1a4a; --panel2:#262268; --line:#4a43b0; --text:#f2f0ff; --muted:#a9a6d8; --gold:#ffd23f; --cyan:#9fe8ff; --green:#46e37e; --red:#ff5a6a; --pink:#ff4fa3;
  --mono: ui-monospace,"Cascadia Mono",Consolas,Menlo,monospace; --sans: system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin:0; min-height:100%; background:var(--bg); color:var(--text); font:16px/1.4 var(--sans); }
body { background:radial-gradient(ellipse at 50% 120%,#3a2f8f 0%,var(--bg2) 45%,var(--bg) 100%) fixed; overflow-x:hidden; }
canvas.px { image-rendering: pixelated; image-rendering: crisp-edges; display:block; }
button { font: inherit; color: inherit; cursor: pointer; }
.btn { min-height:48px; padding:10px 20px; border:2px solid var(--line); border-radius:10px; background:var(--panel2); color:var(--text); font-weight:700; letter-spacing:.04em; }
.btn:active { transform: translateY(1px); }
.btn.gold { background:var(--gold); color:#2a1b00; border-color:#fff2a8; }
.btn.ghost { background:transparent; }
.btn[disabled] { opacity:.45; cursor:not-allowed; }
.title { font:900 clamp(2rem,9vw,4.5rem)/1 var(--mono); letter-spacing:.1em; color:var(--gold); text-shadow:4px 4px 0 #7a3a00,0 0 36px #ffd23f66; text-transform:uppercase; margin:0; }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
:focus-visible { outline:3px solid var(--cyan); outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { * { animation-duration:.01ms !important; transition-duration:.01ms !important; } }