:root{--bg: #0e1020;--panel: #1a1d33;--ink: #e8ecff;--muted: #8b93c0;--accent: #5bd1ff;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:radial-gradient(1200px 800px at 50% -10%,#1b2046,var(--bg));color:var(--ink);font:15px/1.4 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;display:flex;justify-content:center}#app{width:min(560px,96vw);padding:16px 12px 40px}h1{font-size:26px;margin:6px 0 2px;letter-spacing:.5px}h1 .bang{color:var(--accent)}.sub{color:var(--muted);margin:0 0 14px;font-size:13px}.bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.bar .grow{flex:1}button,select{background:var(--panel);color:var(--ink);border:1px solid #2c3157;border-radius:8px;padding:8px 12px;font:inherit;cursor:pointer}button:hover,select:hover{border-color:var(--accent)}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);color:#06223a;border-color:var(--accent);font-weight:600}.stats{display:flex;gap:18px;margin-bottom:10px;font-variant-numeric:tabular-nums}.stats .k{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.5px}.stats .v{font-size:20px;font-weight:700}canvas{display:block;width:100%;height:auto;border-radius:12px;background:#0a0c18;border:1px solid #242a4d;touch-action:manipulation}.banner{margin-top:12px;padding:12px 14px;border-radius:10px;text-align:center;background:var(--panel);border:1px solid #2c3157;display:none}.banner.show{display:block}.banner.win{border-color:#57e08a;color:#b6ffce}.banner.over{border-color:#ff7a7a;color:#ffd0d0}.hintnote{color:var(--muted);font-size:12px;margin-top:10px;min-height:16px}