:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0b0914;--panel:#13101e;--raised:#1b1729;--line:#2b2542;--text:#eeeaff;--muted:#9993b5;--kick:#ff4d8d;--clap:#f4ecff;--hats:#3ee6ff;--bass:#a585ff;--arp:#ffd23d;--pad:#4dffb8;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;margin:0}#app{flex-direction:column;max-width:560px;height:100dvh;margin:0 auto;display:flex}#arena{touch-action:none;flex:1 1 0;width:100%;min-height:0;display:block}#panel{padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--line);gap:10px;display:grid}.band{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.chip{border:1px solid var(--line);background:var(--raised);min-height:56px;color:var(--text);font:inherit;text-align:left;cursor:pointer;touch-action:manipulation;border-radius:12px;flex-direction:column;align-items:flex-start;gap:8px;padding:10px 12px;font-size:14px;font-weight:600;transition:opacity .12s,border-color .12s;display:flex}.chip.off{opacity:.5}.chip.pending{border-style:dashed;border-color:var(--c)}.chip .dots{gap:5px;display:flex}.chip i{background:#2e2845;border-radius:50%;width:9px;height:9px}.chip i.on{background:var(--c);box-shadow:0 0 8px var(--c)}.hint{color:var(--muted);margin:0;font-size:12px}.row{align-items:center;gap:8px;display:flex}.action{border:1px solid var(--line);background:var(--raised);min-height:44px;color:var(--text);font:inherit;cursor:pointer;touch-action:manipulation;border-radius:12px;flex:1;padding:0 8px;font-size:13px;font-weight:600}.action[aria-pressed=true]{border-color:var(--hats)}.action.accent{border-color:var(--kick);color:#ffd0e2}.slider{color:var(--muted);font-size:13px}.slider span{min-width:84px}.slider input{accent-color:var(--kick);flex:1}.slider output{min-width:52px;color:var(--text);text-align:right;font-variant-numeric:tabular-nums}details{color:var(--muted);font-size:13px}details[open]{gap:8px;display:grid}summary{cursor:pointer;padding:4px 0}#debug{color:#b8b2d6;white-space:pre-wrap;background:#0e0c17;border-radius:8px;margin:0;padding:8px;font-size:11px;line-height:1.5}#start{background:#0b0914f0;place-items:center;padding:24px;display:grid;position:fixed;inset:0}#start[hidden]{display:none}#start .card{text-align:center;gap:12px;max-width:340px;display:grid}#start .eyebrow{color:var(--kick);letter-spacing:.04em;margin:0;font-size:13px;font-weight:600}#start h1{margin:0;font-size:28px;line-height:1.15}#start p{color:var(--muted);margin:0;line-height:1.5}#btn-start{background:var(--kick);color:#1a0710;min-height:52px;font:inherit;cursor:pointer;border:0;border-radius:14px;margin-top:8px;font-size:17px;font-weight:700}