:root{--ink: #f6f1e7;--muted: #b9b2a5;--bg: #121014;--panel: rgba(18, 16, 20, .82);--line: rgba(246, 241, 231, .16);--accent: #ffc21a;--accent-ink: #1b1400;--hot: #ff5a36;--font-display: "Anton", Impact, "Arial Narrow", sans-serif;--font-ui: "Inter", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--font-ui);overflow:hidden}canvas#game{position:fixed;inset:0;width:100%;height:100%;display:block}.screen{position:fixed;inset:0;display:none;pointer-events:none}.screen.show{display:block}.screen.show>*{pointer-events:auto}.logo{font-family:var(--font-display);font-weight:400;font-size:clamp(56px,11vw,140px);line-height:.9;margin:0;letter-spacing:.01em;color:var(--accent);text-shadow:0 6px 0 #000,0 0 40px rgba(255,194,26,.25)}.logo span{display:block;color:var(--ink);font-size:.55em;letter-spacing:.3em;text-shadow:0 4px 0 #000}.sub{margin:14px 0 28px;color:var(--muted);letter-spacing:.4em;text-transform:uppercase;font-size:13px}#loading{background:radial-gradient(ellipse at 50% 30%,#2a2230 0%,var(--bg) 70%);display:none}#loading.show{display:grid;place-items:center}.loading-box,.title-box{text-align:center;padding:16px}.bar{width:min(420px,80vw);height:6px;background:var(--line);margin:0 auto;border-radius:3px;overflow:hidden}#load-bar{height:100%;width:0;background:var(--accent);transition:width .2s}#load-text{color:var(--muted);font-size:13px;margin-top:12px}#title.show{display:grid;place-items:center;background:linear-gradient(180deg,#0000,#0000008c)}.hint{color:var(--muted);font-size:12px;margin-top:16px}.btn{font:600 15px var(--font-ui);color:var(--ink);background:#ffffff0f;border:1px solid var(--line);padding:12px 20px;border-radius:10px;cursor:pointer;transition:background .15s,transform .08s,border-color .15s}.btn:hover,.btn:focus-visible{background:#ffffff24;border-color:#fff6;outline:none}.btn:active{transform:translateY(1px)}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:800}.btn.primary:hover,.btn.primary:focus-visible{background:#ffd24f}.btn.small{padding:6px 12px;font-size:13px}.btn.active{border-color:var(--accent);color:var(--accent)}.top{position:absolute;top:20px;left:24px;right:24px;display:flex;align-items:baseline;gap:14px}.top h2{font-family:var(--font-display);font-weight:400;font-size:clamp(30px,4vw,48px);margin:0;letter-spacing:.02em;text-shadow:0 3px 0 #000}.step{color:var(--accent);font-weight:800;font-size:13px;letter-spacing:.2em}.bottom{position:absolute;bottom:20px;left:24px;right:24px;display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}.bottom .btn:first-child{margin-right:auto}.carousel{position:absolute;left:0;right:0;bottom:150px;display:flex;justify-content:center;align-items:center;gap:18px}.arrow{font-size:34px;width:56px;height:56px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}.arrow:hover{border-color:var(--accent);color:var(--accent)}.char-card{min-width:240px;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 22px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.char-name{font-family:var(--font-display);font-size:34px;letter-spacing:.04em}.char-meta{color:var(--muted);font-size:13px}.dots{display:flex;gap:6px;justify-content:center;margin-top:8px}.dots i{width:7px;height:7px;border-radius:50%;background:var(--line)}.dots i.on{background:var(--accent)}.variant-row{position:absolute;left:0;right:0;bottom:84px;display:flex;justify-content:center;gap:28px;flex-wrap:wrap}.variant{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}.swatches{display:flex;gap:6px}.swatch{width:26px;height:26px;border-radius:50%;border:2px solid rgba(255,255,255,.25);cursor:pointer;padding:0}.swatch.on{border-color:var(--accent);box-shadow:0 0 0 2px #ffc21a59}.panel{position:absolute;top:84px;bottom:84px;right:24px;width:min(380px,calc(100vw - 48px));background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.tabs{display:flex;gap:6px;flex-wrap:wrap}.tabs button{flex:1;min-width:60px;font:700 12px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;padding:9px 6px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer}.tabs button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}.items{flex:1;overflow-y:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:start}.item{text-align:left;border:1px solid var(--line);background:#ffffff0a;color:var(--ink);border-radius:10px;padding:8px;cursor:pointer;display:flex;flex-direction:column;gap:6px;font:600 12px var(--font-ui)}.item:hover{border-color:#fff6}.item.on{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.item .thumb{height:74px;border-radius:6px;background:#2a2730 center/contain no-repeat}.colors{display:flex;gap:6px;flex-wrap:wrap;min-height:26px}.hud{position:fixed;inset:0;pointer-events:none;display:none}.hud.show{display:block}.trick{position:absolute;top:18%;left:0;right:0;text-align:center;font-family:var(--font-display);font-size:clamp(26px,4vw,44px);letter-spacing:.03em;text-shadow:0 3px 0 #000}.combo{position:absolute;top:calc(18% + 54px);left:0;right:0;text-align:center;color:var(--accent);font-weight:800;font-size:20px;text-shadow:0 2px 0 #000}.score{position:absolute;top:18px;right:24px;font-family:var(--font-display);font-size:40px;text-shadow:0 3px 0 #000}.speed{position:absolute;bottom:18px;right:24px;color:var(--muted);font-weight:600;font-size:13px}.balance{position:absolute;bottom:32%;left:50%;width:220px;height:8px;margin-left:-110px;background:#00000080;border-radius:4px;display:none;border:1px solid var(--line)}.balance.show{display:block}#balance-needle{position:absolute;top:-5px;width:4px;height:18px;background:var(--accent);left:50%;margin-left:-2px;border-radius:2px}.toast{position:absolute;top:80px;left:0;right:0;text-align:center;color:var(--ink);font-weight:600;opacity:0;transition:opacity .3s;text-shadow:0 2px 4px #000}.toast.show{opacity:1}.help{position:absolute;bottom:14px;left:18px;right:160px;color:#f6f1e7cc;font-size:12px;line-height:1.7;text-shadow:0 1px 3px #000}.help b{color:var(--accent)}#pause.show{display:grid;place-items:center;background:#0000008c}.pause-box{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px;width:min(360px,calc(100vw - 32px));display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 32px);overflow-y:auto}.pause-box h2{font-family:var(--font-display);font-weight:400;margin:0 0 6px;font-size:40px}.travel span,.quality span{display:block;color:var(--muted);font-size:12px;margin:6px 0;text-transform:uppercase;letter-spacing:.15em}#travel-list{display:flex;flex-wrap:wrap;gap:6px}.quality{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.quality span{width:100%}@media(max-width:760px){.panel{height:46vh;inset:auto 16px 76px;width:auto}.top{left:16px;right:16px;top:14px}.bottom{left:16px;right:16px;bottom:14px}.carousel{bottom:140px}.help{display:none}}