:root{--bg: #0a0e1a;--panel: #121a2e;--ink: #e8eefc;--muted: #8aa0c8;--accent: #36e2c4;--accent2: #ff5d73;--rail: #2c3a5c}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent;user-select:none}#app{min-height:100%;display:flex;align-items:center;justify-content:center;padding:16px}.wrap{width:100%;max-width:460px;display:flex;flex-direction:column;gap:14px}.title{font-size:30px;font-weight:800;letter-spacing:.5px;text-align:center;background:linear-gradient(90deg,var(--accent),#6fa8ff);-webkit-background-clip:text;background-clip:text;color:transparent}.sub{text-align:center;color:var(--muted);font-size:14px;line-height:1.5;margin:-4px 0 4px}.card{background:var(--panel);border:1px solid #1d2845;border-radius:16px;padding:18px}.btns{display:flex;flex-direction:column;gap:10px}button.primary,button.ghost{font:inherit;font-weight:700;border-radius:12px;padding:14px 16px;cursor:pointer;border:1px solid transparent;transition:transform .05s ease,filter .15s ease}button.primary{background:linear-gradient(180deg,var(--accent),#1bbfa3);color:#06231f}button.ghost{background:transparent;color:var(--ink);border-color:#2a3a5c}button.primary:active,button.ghost:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:default}.row{display:flex;gap:8px;align-items:center;justify-content:space-between}.hud{display:flex;justify-content:space-between;align-items:baseline;font-variant-numeric:tabular-nums;padding:0 4px}.hud .score{font-size:26px;font-weight:800}.hud .meta{color:var(--muted);font-size:13px}.hud .mode{color:var(--accent);font-size:13px;font-weight:700}canvas{width:100%;display:block;border-radius:16px;background:#070b16;border:1px solid #1d2845;touch-action:none}.hint{text-align:center;color:var(--muted);font-size:13px}.overlay{text-align:center;display:flex;flex-direction:column;gap:8px}.overlay .big{font-size:24px;font-weight:800}.overlay .stat{color:var(--muted);font-size:14px}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%);background:#1b2742;color:var(--ink);padding:10px 16px;border-radius:999px;font-size:14px;border:1px solid #2a3a5c}.legend{display:flex;gap:14px;justify-content:center;font-size:12px;color:var(--muted)}.legend .dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:middle}