:root{color-scheme:dark;--felt: #0f6a3c;--felt-hot: #178a4c;--wood: #8b5a2b;--blood: #6a1d24;--blood-hot: #a32a2a;--steel: #9aa3ad;--paper: #efe6d6;--ink: #07140c;--hazard: #e7ff3a;--line: rgba(139, 90, 43, .48);--display: "Oswald", "Noto Sans SC", sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;--body: "Noto Sans SC", "Oswald", sans-serif;font-family:var(--body)}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:#07140c;color:var(--paper)}#view{display:block;width:100%;height:100%;touch-action:none}#vignette{pointer-events:none;position:fixed;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 40%,rgba(0,0,0,.72) 100%)}#grade{pointer-events:none;position:fixed;inset:0;background:linear-gradient(180deg,#0f6a3c1a,#3d24122e);mix-blend-mode:overlay}#chain-overlay{pointer-events:none;position:fixed;inset:0;opacity:.07;background:repeating-linear-gradient(45deg,transparent 0 10px,rgba(200,200,200,.9) 10px 11px),repeating-linear-gradient(-45deg,transparent 0 10px,rgba(200,200,200,.9) 10px 11px);mix-blend-mode:overlay}body.playing #chain-overlay{opacity:0}body.playing #vignette{opacity:.45}body.playing #grade{opacity:.35}.hidden{display:none!important}.screen{position:fixed;inset:0;display:grid;place-items:center;padding:24px;overflow:auto;background:linear-gradient(180deg,#07140c52,#080e0a9e);z-index:4}.screen-inner{width:min(560px,100%);max-width:100%;min-width:0;padding:28px 28px 24px;background:#0a160ed1;border:1px solid var(--line);box-shadow:0 0 0 1px #00000080,inset 0 0 0 1px #e8d2a00d,0 24px 60px #00000073}.screen-inner.wide{width:min(920px,100%)}.eyebrow{margin:0 0 10px;font-family:var(--mono);font-size:11px;letter-spacing:.22em;color:var(--hazard);background:repeating-linear-gradient(-45deg,#0c1a12,#0c1a12 8px,#12301c 8px 16px);padding:6px 10px;display:inline-block}.emblem{display:block;width:96px;height:96px;object-fit:cover;border:2px solid rgba(154,163,173,.55);margin:8px 0 12px}h1{font-family:var(--display);font-size:clamp(40px,9vw,84px);line-height:.9;margin:0;letter-spacing:.04em;max-width:100%;overflow-wrap:anywhere}h2{font-family:var(--display);margin:6px 0 14px;font-size:28px;font-weight:600;color:#d7c4b0}.lede{margin:0 0 14px;line-height:1.5;color:#d8cbb8}.controls{margin:0 0 16px;padding:0;list-style:none;font-family:var(--mono);font-size:12px;color:#cbbba6}.controls li{margin:6px 0;overflow-wrap:anywhere}kbd{font-family:var(--mono);font-size:11px;padding:1px 6px;border:1px solid rgba(231,255,58,.35);color:var(--hazard)}.actions{display:flex;gap:10px;flex-wrap:wrap}#online-box{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}#online-box input{font-family:var(--mono);background:#120e0c;color:var(--paper);border:1px solid var(--line);padding:8px 10px}button{font-family:var(--display);letter-spacing:.08em;cursor:pointer;border:1px solid var(--line);background:#102018;color:var(--paper);padding:10px 16px}button.primary{background:var(--felt);border-color:#2a9a58;color:#f4fff6}button.primary:hover{background:var(--felt-hot)}button.ghost{background:transparent}button.mini{font-size:11px;padding:6px 10px}.fineprint{font-family:var(--mono);font-size:12px;color:#8a7d70;min-height:1em}#hud{position:fixed;inset:0;pointer-events:none;z-index:3;padding:16px 18px;display:flex;flex-direction:column}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.frame{border:1px solid var(--line);background:#08120c94;padding:8px 12px}.meters{display:flex;flex-direction:column;gap:2px;font-family:var(--mono)}.meters span{font-size:12px;letter-spacing:.16em;color:var(--hazard)}.meters b{font-size:28px;letter-spacing:.08em}.lives{display:flex;gap:6px;pointer-events:none;margin-top:6px}.life{width:14px;height:14px;border-radius:50%;background:#e8e0d4;box-shadow:0 0 0 2px #3d2412}.life.empty{background:transparent;border:2px solid var(--wood);box-shadow:none}#hud-status{margin:10px 0 0;font-family:var(--mono);font-size:13px;color:#dccab4}.combo{margin:6px 0 0;font-family:var(--display);color:var(--hazard);letter-spacing:.12em}.hud-bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;pointer-events:auto}#hud-mods{display:flex;gap:6px;flex-wrap:wrap}.chip{font-family:var(--mono);font-size:11px;letter-spacing:.08em;border:1px solid var(--line);padding:4px 8px;background:#08120c94}#power-wrap{position:absolute;left:50%;bottom:22px;transform:translate(-50%);pointer-events:none;width:min(320px,70vw);font-family:var(--mono);font-size:11px;letter-spacing:.16em;color:var(--hazard)}.bar{margin-top:6px;height:10px;border:1px solid var(--hazard);background:#102018;overflow:hidden}#power-fill{display:block;width:100%;height:100%;background:linear-gradient(90deg,#e7ff3a,#2a9a58);transform-origin:left center;transform:scaleX(0)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.card{text-align:left;padding:12px 12px 16px;background:#0a160eeb;display:flex;flex-direction:column;gap:6px;pointer-events:auto}.card:hover{border-color:var(--hazard)}.card img{width:100%;aspect-ratio:1;object-fit:contain;background:#102018}.card h3{margin:4px 0 0;font-size:20px}.card .en{margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--hazard)}.card p{margin:0;font-size:13px;color:#d5c4b0;line-height:1.4}.card .key{font-family:var(--mono);color:var(--hazard)}.log{font-family:var(--mono);font-size:12px;white-space:pre-wrap;color:#cbbba6;background:#00000047;padding:10px;border:1px solid var(--line)}#over-screen .eyebrow{background:repeating-linear-gradient(-45deg,#1a0c0c,#1a0c0c 8px,#2a1010 8px 16px)}#over-screen .screen-inner{border-color:#a32a2a8c;box-shadow:0 0 0 1px #00000080,inset 0 0 0 1px #ffb4a00f,0 24px 60px #00000073}#over-screen button.primary{background:var(--blood);border-color:#c45a3a;color:#fff5ea}#over-screen button.primary:hover{background:var(--blood-hot)}@media(max-width:760px){.cards{grid-template-columns:1fr}h1{font-size:48px}}@media(max-width:390px){.screen{padding:12px;align-items:start}.screen-inner,.screen-inner.wide{width:100%;padding:16px 12px 14px}h1{font-size:36px;letter-spacing:.02em}h2{font-size:22px}.emblem{width:72px;height:72px}.controls{font-size:12px}.controls li{margin:4px 0}}
