:root{--bg: #0d0a1a;--panel: #181231;--ink: #ece8ff;--muted: #9b93c7;--accent: #ffcf4d;--line: #2b2150}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(1200px 800px at 50% -10%,#1b1440,var(--bg));color:var(--ink);font-family:Segoe UI,system-ui,sans-serif;-webkit-user-select:none;user-select:none}#app{max-width:560px;margin:0 auto;padding:14px 12px 32px}header h1{margin:4px 0 2px;font-size:30px;letter-spacing:.5px;background:linear-gradient(90deg,#ff7ad9,#7ad0ff,#ffe07a);-webkit-background-clip:text;background-clip:text;color:transparent}.tag{margin:0 0 10px;color:var(--muted);font-size:13px}.bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg button{background:transparent;color:var(--muted);border:0;padding:7px 12px;font-size:13px;cursor:pointer}.seg button.active{background:var(--accent);color:#2a1d00;font-weight:700}.spacer{flex:1}.stat{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:6px 12px;text-align:center}.stat .k{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.stat b{font-size:18px}.progwrap{height:10px;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-bottom:10px}.progfill{height:100%;width:0%;background:linear-gradient(90deg,#7ad0ff,#ff7ad9);transition:width .25s}.chargewrap{display:flex;align-items:center;gap:8px;margin-bottom:10px}.chargewrap .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.chargebar{flex:1;height:10px;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow:hidden}.chargefill{height:100%;width:0%;background:linear-gradient(90deg,#ffd166,#ff9f1c);transition:width .2s}.chargefill.ready{background:linear-gradient(90deg,#7ee787,#ffe07a);box-shadow:0 0 8px #ffe07a}.chargestate{font-size:11px;color:var(--muted);min-width:94px;text-align:right}kbd{background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:0 5px;font-size:11px;color:var(--ink)}.btn:disabled{opacity:.45;cursor:default}.btn.active{background:#ffe07a;color:#2a1d00;font-weight:700;border-color:transparent}canvas{display:block;width:100%;height:auto;border-radius:14px;background:#100b24;border:1px solid var(--line);touch-action:none}.controls{display:flex;gap:10px;margin-top:12px}.btn{flex:1;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:10px;font-size:14px;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:#2a1d00;font-weight:700;border-color:transparent}.msg{text-align:center;margin-top:10px;min-height:20px;color:var(--accent);font-size:14px}.over{color:#ff8b8b;font-weight:700}.standing{text-align:center;margin-top:6px;min-height:18px;color:var(--accent);font-size:14px;font-weight:700}