:root{--ink:#0a0604;--ink-2:#1a0f08;--bone:#f3e2b8;--dim:#a88a5c;--gold:#e8b23c;--gold-deep:#8a5420;--torch:#ff7a1a;--blood:#d8432a;--teal:#3fd0c0;--cyan:#7fe0ff;--hud:"Press Start 2P","Courier New",monospace;--body:"VT323","Courier New",monospace;color-scheme:dark}html,body{height:100%;margin:0;overscroll-behavior:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:var(--ink);color:var(--bone);overflow:hidden;touch-action:none;-webkit-user-select:none;user-select:none}[hidden]{display:none!important}.zone-banner{justify-self:center;font-size:clamp(12px,2.4vw,18px);letter-spacing:.3em;color:var(--bone);opacity:0;transition:opacity .6s;text-align:center;min-height:1em;grid-row:3}.zone-banner.on{opacity:1}#stage{position:fixed;inset:0;background:var(--ink)}#stage canvas{display:block;width:100%;height:100%}#ui{position:fixed;inset:0;display:grid;grid-template-rows:auto auto auto 1fr auto;gap:10px;pointer-events:none;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:calc(env(safe-area-inset-top,0px) + 14px) calc(env(safe-area-inset-bottom,0px) + 14px);font-family:var(--hud);text-shadow:2px 2px 0 #000}.hud-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:8px 14px;background:radial-gradient(circle at 7px 7px,#ffd27a 0 1.5px,#3a1a0c 2.5px,transparent 3px),radial-gradient(circle at calc(100% - 7px) 7px,#ffd27a 0 1.5px,#3a1a0c 2.5px,transparent 3px),radial-gradient(circle at 7px calc(100% - 7px),#ffd27a 0 1.5px,#3a1a0c 2.5px,transparent 3px),radial-gradient(circle at calc(100% - 7px) calc(100% - 7px),#ffd27a 0 1.5px,#3a1a0c 2.5px,transparent 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.12) 0 2px,transparent 2px 6px),linear-gradient(#c07a32,#8f4a18 40%,#5a2a0e 75%,#3a1a0c);border:3px solid #120804;box-shadow:inset 0 2px #f2a640,inset 0 -2px #2a1206,0 4px #000}.cell{display:flex;align-items:center;gap:10px;min-width:0}.cell.right{justify-content:flex-end}.cell .lbl{color:#2a1206;text-shadow:1px 1px 0 #f2a640}.lcd{font-size:clamp(14px,2.6vw,22px);color:#ff9a2a;background:#120804;padding:8px 12px 6px;border:3px solid #2a1206;box-shadow:inset 2px 2px #000,0 1px #f2a640;letter-spacing:.14em;font-variant-numeric:tabular-nums;text-shadow:0 0 6px rgba(255,120,30,.7);background-image:repeating-linear-gradient(0deg,rgba(0,0,0,.45) 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,rgba(0,0,0,.35) 0 1px,transparent 1px 3px)}.lcd.small{font-size:clamp(10px,1.6vw,13px);padding:6px 8px 4px}.lcd.gem{color:var(--teal);text-shadow:0 0 6px rgba(63,208,192,.6)}.hud-bot{grid-row:5;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-end}.hud-bot{align-items:flex-end}.hud-block{display:grid;gap:8px}.hud-block.right{text-align:right}.lbl{font-size:9px;letter-spacing:.12em;color:var(--dim)}.val{font-size:clamp(14px,2.4vw,20px);color:var(--bone);font-variant-numeric:tabular-nums}.val.gem{color:var(--teal)}.powers{grid-row:2;display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:flex-start;min-height:20px}.chip{font-size:10px;padding:6px 8px 5px;border:2px solid currentColor;background:#0a0604b3;display:grid;gap:5px;min-width:68px}.chip i{display:block;height:4px;background:currentColor;transform-origin:left}.chip.shield{color:var(--cyan)}.chip.magnet{color:var(--blood)}.chip.idol{color:var(--gold)}.center{grid-row:4;display:grid;place-items:center;min-height:0}.panel{pointer-events:auto;width:min(540px,100%);box-sizing:border-box;background:#0a0604db;border:4px solid #b8641c;box-shadow:0 0 0 4px #000,8px 8px 0 4px #000;padding:clamp(18px,4vw,30px);display:grid;gap:16px;max-height:100%;overflow:auto}.kicker{margin:0;font-size:10px;letter-spacing:.18em;line-height:1.5;color:var(--torch)}.logo{margin:0;font-size:clamp(30px,min(11.5vw,8.5vh),84px);line-height:1.2;letter-spacing:.04em;white-space:nowrap;background:linear-gradient(#fff4c8 0 30%,#f6c868 30% 55%,#e39a48 55% 78%,#bd742e 78%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(2px 0 0 #000) drop-shadow(-2px 0 0 #000) drop-shadow(0 2px 0 #000) drop-shadow(0 -2px 0 #000) drop-shadow(3px 4px 0 #000)}.stats dd,.best{font-family:var(--body)}.stats dd{text-shadow:none}.go{font-family:var(--hud);font-size:12px;letter-spacing:.08em;line-height:1.5;white-space:nowrap;color:var(--ink);background:var(--gold);border:0;padding:14px 16px 12px;box-shadow:4px 4px #000;cursor:pointer;animation:blink 1.1s steps(2) infinite}.go:hover{background:var(--bone)}.go:focus-visible,.opts button:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}@keyframes blink{50%{background:var(--torch)}}.best{margin:0;font-size:22px;color:var(--bone);text-align:center;text-shadow:2px 2px 0 #000}h2{margin:0;font-size:clamp(16px,3.6vw,24px);color:var(--blood);line-height:1.3;text-wrap:balance}.stats{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stats div{display:grid;gap:6px}.stats dt{font-size:10px;color:var(--dim);letter-spacing:.12em;line-height:1.5}.stats dd{margin:0;font-size:30px;color:var(--bone);font-variant-numeric:tabular-nums}.stats .new{color:var(--gold)}.opts{display:flex;gap:8px;flex-wrap:wrap}.opts button{pointer-events:auto;font-family:var(--hud);font-size:9px;color:var(--dim);background:#0a0604bf;border:2px solid #3a2a1a;padding:8px 9px 7px;cursor:pointer;text-shadow:2px 2px 0 #000}.opts button b{color:var(--bone);font-weight:400}.opts button:hover{border-color:var(--gold)}.meters{display:grid;gap:8px;text-align:right}.meters .val{font-size:clamp(12px,2vw,16px)}.spd{display:flex;gap:3px;justify-content:flex-end}.spd i{width:7px;height:10px;background:#2a1c10;box-shadow:1px 1px #000}.spd i.on{background:var(--torch)}.spd i.hot{background:var(--blood)}.small{width:auto;text-align:center;font-size:14px}@media (max-width:480px){.lbl{font-size:9px}.cell .lbl{display:none}.hud-top{padding:6px 10px;gap:6px}.opts button{font-size:9px;padding:8px}}@media (prefers-reduced-motion:reduce){.go{animation:none}}.title-screen{pointer-events:auto;display:grid;justify-items:center;gap:18px;text-align:center;padding:24px 40px 32px;background:radial-gradient(closest-side,#0a0604e6,#0a0604b3 65%,#0a060400)}.hint{margin:0;font-size:10px;letter-spacing:.16em;color:var(--bone);line-height:1.8}.hint .ar{font-family:var(--body);font-weight:400;font-size:24px;letter-spacing:.05em;color:var(--gold);vertical-align:-3px}.t{display:none}@media (hover:none) and (pointer:coarse){.k{display:none}.t{display:inline}.opts button{padding:11px 12px;font-size:9px}}@media (max-width:480px){.hint{font-size:10px;letter-spacing:.04em}.go{font-size:11px;padding:14px 14px 12px}.title-screen{padding:32px 16px}}#ui[data-mode=title] .meters{visibility:hidden}#ui[data-mode=title] .hud-top,#ui[data-mode=title] .powers,#ui[data-mode=title] .zone-banner{display:none}#ui:not([data-mode=play]) #bPause{display:none}#pause .lbl{font-size:11px;color:var(--bone);letter-spacing:.12em}h2{line-height:1.45}.hint,.lcd{white-space:nowrap}@media (max-height:480px){.title-screen{gap:10px;padding:10px 24px}.logo{font-size:clamp(22px,8vh,40px)}.best{font-size:18px}}.byline{position:absolute;margin:0;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(env(safe-area-inset-bottom,0px) + 16px);font-family:var(--body);font-size:20px;letter-spacing:.04em;color:var(--bone);text-shadow:2px 2px 0 #000}#ui:not([data-mode=title]) .byline{display:none}.lcd.flash{animation:cp-flash .4s linear 4}@keyframes cp-flash{0%,49%{color:#1a0c06;background:#ffd27a;text-shadow:none}}#ui[data-mode=title] .center{align-items:start;padding-top:3vh;grid-row:1/5}
