:root{--bg:#f5f4f1;--panel:#fff;--raised:#fff;--sunken:#eeede9;--hover:#e8e6e1;--text:#1b1b1d;--muted:#6b6b70;--line:#e2e0da;--line-strong:#cfccc5;--accent:#c98a12;--on-accent:#1a1406;--white-key:#fbfbf9;--black-key:#1f1f22;--stage:#ebe9e4;--focus:#9a6500;--error:#c62a2f;--shadow:0 12px 40px #00000024;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#0b0b0d;--panel:#151518;--raised:#1c1c20;--sunken:#101013;--hover:#26262b;--text:#ececee;--muted:#8e8e96;--line:#232328;--line-strong:#323238;--accent:#f2b84b;--white-key:#e9e9e6;--black-key:#161618;--stage:#0c0c0e;--focus:#f2b84b;--error:#ff6369;--shadow:0 20px 60px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}#room[data-style=glow],#room[data-style=pfa]{--bg:#0b0b0d;--panel:#151518;--raised:#1c1c20;--sunken:#101013;--hover:#26262b;--text:#ececee;--muted:#8e8e96;--line:#232328;--line-strong:#323238;--accent:#f2b84b;--focus:#f2b84b;--error:#ff6369;--shadow:0 20px 60px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font:14px/1.45 Segoe UI Variable Text,Segoe UI,system-ui,-apple-system,sans-serif;overflow:hidden}[hidden]{display:none!important}svg.lucide{stroke-width:1.75px;flex:none;width:18px;height:18px}*{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent}button,input,select{font:inherit;color:inherit}button,select,input:not([type]),input[type=text]{border:1px solid var(--line-strong);background:var(--raised);border-radius:8px;height:32px;transition:background-color .12s,border-color .12s,color .12s}button{cursor:pointer;align-items:center;gap:6px;padding:0 12px;font-weight:500;display:inline-flex}button:hover{background:var(--hover)}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}button:active{transform:translateY(1px)}button.icon{width:32px;color:var(--muted);background:0 0;border-color:#0000;justify-content:center;padding:0}button.icon:hover{background:var(--hover);color:var(--text)}button.icon.hint{color:var(--text);animation:.8s ease-in-out 4 alternate hint}@keyframes hint{0%{background:0 0}to{background:var(--hover);box-shadow:0 0 0 2px var(--line)}}button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);justify-content:center;font-weight:600}button.primary:hover{background:color-mix(in srgb, var(--accent) 88%, white)}select{appearance:none;cursor:pointer;background:var(--raised) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238e8e96' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center / 16px;padding:0 30px 0 10px}select:hover{border-color:var(--muted)}input:not([type]),input[type=text]{padding:0 12px}input:not([type]):focus,input[type=text]:focus{border-color:var(--accent);outline:none}::placeholder{color:var(--muted);opacity:1}#start{place-items:center;height:100%;padding:16px;display:grid}@media (prefers-color-scheme:dark){#start{background:radial-gradient(90% 70% at 50% 115%, #1d1533 0%, var(--bg) 70%)}}#start-form{gap:14px;width:min(440px,100%);font-size:18px;display:grid}#start h1{letter-spacing:-.02em;justify-content:center;align-items:center;gap:14px;margin:0 0 24px;font-size:clamp(36px,9vw,52px);font-weight:700;line-height:1.1;display:flex}#start h1 svg{filter:drop-shadow(0 1px 1px #00000040);width:1em;height:1em}#start h1 .p2p{color:var(--accent)}#start input{text-align:center;border-radius:12px;height:54px;padding:0 18px}#start button{border-radius:12px;gap:10px;height:54px}#start button svg{width:22px;height:22px}#start .go-row{grid-template-columns:1fr auto;gap:10px;display:grid}#start .go-row:has(#lock[hidden]){grid-template-columns:1fr}#lock{width:54px;color:var(--muted);justify-content:center;padding:0}#lock[aria-pressed=true]{color:var(--accent);border-color:var(--accent)}#notice{color:var(--error);justify-content:center;align-items:center;gap:8px;margin:-8px 0 4px;font-size:15px;display:flex}#notice svg{width:18px;height:18px}#room-lock{color:var(--muted);margin-left:-6px;display:inline-flex}#room-lock svg{width:14px;height:14px}.hash-status{color:var(--muted);text-align:center;letter-spacing:.03em;margin:4px 0 0;font-size:12.5px;font-weight:500;animation:1.8s ease-in-out infinite pulse-subtle}@keyframes pulse-subtle{0%,to{opacity:.6}50%{opacity:1}}#player-menu{background:var(--panel);width:230px;color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:12px;flex-direction:column;gap:4px;margin:0;padding:10px;display:none;position:fixed;inset:auto}#player-menu:popover-open{display:flex}#pm-name{color:var(--c);text-overflow:ellipsis;white-space:nowrap;padding:2px 6px 6px;font-weight:600;overflow:hidden}.pm-rename{color:var(--muted);align-items:center;gap:6px;padding:0 6px 6px;display:flex}.pm-rename svg{flex:none;width:14px;height:14px}#pm-rename{min-width:0;height:28px;color:var(--c);background:0 0;border-color:#0000;flex:1;padding:0 6px;font-weight:600}#pm-rename:hover,#pm-rename:focus{background:var(--sunken);border-color:var(--line)}.pm-volume{color:var(--muted);align-items:center;gap:8px;padding:0 6px 4px;display:flex}.pm-volume input{min-width:0;accent-color:var(--accent);flex:1}.pm-volume output{text-align:right;width:38px;color:var(--text);font-variant-numeric:tabular-nums;font-size:12px}#player-menu button{background:0 0;border-color:#0000;gap:8px;width:100%;height:32px;padding:0 8px;font-weight:500}#player-menu button:hover{background:var(--hover)}#player-menu button svg{width:16px;height:16px;color:var(--muted)}#player-menu button[aria-pressed=true]{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}#player-menu button[aria-pressed=true] svg{color:currentColor}#player-menu button[hidden]{display:none}#jumpscare{background:#000;border:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;position:fixed;inset:0;overflow:hidden}#jumpscare::backdrop{background:#000}#jumpscare img{object-fit:contain;width:100%;height:100%}#jumpscare.go img{animation:lunge var(--jumpscare-dur,1.5s) ease-out both}@keyframes lunge{0%{filter:brightness(2.5);transform:scale(.3)}5%{filter:brightness(1.4);transform:scale(1.12)}9%{transform:scale(1.04)translate(-1.5%,1%)}13%{transform:scale(1.08)translate(1.5%,-1%)}17%{transform:scale(1.05)translate(-1%,-1%)}21%,90%{filter:none;opacity:1;transform:scale(1.06)}to{opacity:0;transform:scale(1.1)}}#pm-hosting{border-top:1px solid var(--line);flex-direction:column;gap:4px;margin-top:4px;padding-top:6px;display:flex}#pm-hosting[hidden]{display:none}.pm-tags{border-top:1px solid var(--line);flex-direction:column;gap:4px;margin-top:4px;padding-top:6px;display:flex}#player-menu .danger,#player-menu .danger svg{color:var(--error)}#player-menu .armed{background:color-mix(in srgb, var(--error) 14%, transparent);color:var(--error)}#player-menu #pm-host.armed{background:color-mix(in srgb, var(--accent) 14%, transparent);color:var(--accent)}#room{background:var(--bg);height:100%;color:var(--text);grid-template:"head head""stage stage"minmax(0,1fr)"map map""keys keys"minmax(120px,24vh)/minmax(210px,250px) minmax(0,1fr);display:grid;position:relative}header{grid-area:head}#players{z-index:1;grid-area:2/1/3/2}#stage{grid-area:stage}#map{grid-area:map}#keys{grid-area:keys}#cursors{z-index:30;pointer-events:none;position:absolute;inset:0;overflow:hidden}.cursor{will-change:transform, opacity;transition:opacity .4s;position:absolute}.cursor.idle{opacity:0}.cursor svg{width:20px;height:20px;fill:var(--c);stroke:#0000008c;stroke-width:1.5px;stroke-linejoin:round;margin:-3px 0 0 -3px;display:block}.cursor span{white-space:nowrap;background:var(--c);color:#0d0b14;border-radius:6px;padding:1px 6px;font-size:11px;font-weight:600;line-height:16px;position:absolute;top:16px;left:14px}header{border-bottom:1px solid var(--line);background:var(--bg);flex-wrap:wrap;align-items:center;gap:12px;padding:8px 12px;display:flex}#room-name{color:var(--muted);letter-spacing:.02em;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font:13px ui-monospace,Cascadia Mono,monospace;overflow:hidden}#players{background:color-mix(in srgb, var(--panel) 70%, transparent);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px)saturate(1.3);backdrop-filter:blur(14px)saturate(1.3);min-height:0;box-shadow:var(--shadow);border-radius:14px;flex-direction:column;margin:10px 0 10px 10px;padding:10px 6px 8px;display:flex}#players h2{color:var(--muted);font-variant-numeric:tabular-nums;align-items:center;gap:6px;margin:0 10px 6px;font-size:12px;font-weight:600;display:flex}#players h2 svg{width:14px;height:14px}#players-toggle{height:auto;color:inherit;font:inherit;cursor:default;background:0 0;border:0;align-items:center;gap:6px;padding:0;display:inline-flex}#players{transition:opacity .4s}@media (min-width:701px){#players.idle{opacity:0}}#people{flex:none;gap:1px;max-height:40%;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}#people li{color:color-mix(in srgb, var(--c) 62%, black);font-weight:600}#people .person{width:100%;height:auto;color:inherit;font:inherit;text-align:left;background:0 0;border:0;border-radius:8px;align-items:center;gap:6px;padding:5px 10px;display:flex}#people button.person:hover{background:var(--hover)}#people .person .name{text-overflow:ellipsis;white-space:nowrap;flex:0 auto;min-width:0;margin-right:auto;overflow:hidden}#via-card{z-index:50;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:10px;gap:2px;padding:4px;font-size:13px;font-weight:600;display:grid;position:fixed}#via-card[hidden]{display:none}#via-card a{color:var(--text);white-space:nowrap;border-radius:6px;align-items:center;gap:8px;padding:4px 8px;text-decoration:none;display:flex}#via-card a:hover{background:var(--hover)}#via-card .brand{width:16px;height:16px}#people .person svg{width:14px;height:14px;color:var(--muted);flex:none}#people .person svg.lucide-crown{color:var(--accent)}#people li.self .person{background:color-mix(in srgb, var(--c) 12%, transparent)}.tag{letter-spacing:.04em;text-transform:uppercase;vertical-align:1px;color:var(--on-accent);background:var(--accent);border-radius:5px;flex:none;padding:0 6px;font-size:10.5px;font-weight:700;line-height:17px}.tag-dev{color:#0d0b14;background:linear-gradient(135deg,#b28cf2,#5ec7e8)}.tag-codev{color:#04141c;background:linear-gradient(135deg,#4facfe,#00f2fe)}.tag-trusted{color:#0d140b;background:#8bd17c}.tag-tester{color:#140d0b;background:#f58d4e}.tag-mod{color:#140b0d;background:#ef6f8e}.tag-member{color:#0d1424;background:#60a5fa}.tag-guest{color:#fff;background:#6b7280}.tag-list{flex-wrap:wrap;gap:6px 14px;display:flex}.tag-list[hidden],.account[hidden],.pm-tags[hidden]{display:none}.brand{fill:currentColor;flex:none;width:18px;height:18px}.brand-discord{color:#5865f2}.account{gap:8px;display:grid}.account:has(>.sign-in){gap:10px;display:flex}.account .sign-in{color:var(--muted);flex:1;justify-content:center}#start .account button:not(.sign-in){border-radius:8px;gap:4px;height:32px}#start .account button:not(.sign-in) svg{width:16px;height:16px}#start .account .sign-in{font-size:15px}#start .account .sign-in .brand{width:20px;height:20px}.account .logins{gap:4px;margin:0;padding:0;list-style:none;display:grid}.account .logins li{color:var(--text);align-items:center;gap:8px;font-size:13px;display:flex}.account .logins li span{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.account-actions{gap:6px;display:flex}.account-actions .add-login{gap:4px;padding:0 8px}.account-actions .add-login svg{width:14px;height:14px}.account-actions .sign-out{margin-left:auto}.account .merge{color:var(--text);background:color-mix(in srgb, var(--accent) 10%, transparent);border-radius:8px;flex-wrap:wrap;align-items:center;gap:6px;padding:6px 8px;font-size:13px;display:flex}.account .merge>svg.lucide-merge{width:16px;height:16px;color:var(--accent)}.account .merge .merge-yes{height:28px;margin-left:auto;padding:0 10px}#chat{border-top:1px solid var(--line);flex-direction:column;flex:1;gap:8px;min-height:0;margin-top:8px;padding-top:8px;display:flex}#messages{overflow-wrap:anywhere;flex-direction:column;flex:1;gap:4px;min-height:0;margin:0;padding:0 10px;list-style:none;display:flex;overflow-y:auto}#messages li:first-child{margin-top:auto}#messages b{color:color-mix(in srgb, var(--c) 62%, black);font-weight:600}@media (prefers-color-scheme:dark){#people li,#messages b{color:var(--c)}}#room[data-style=glow] :is(#people li,#messages b),#room[data-style=pfa] :is(#people li,#messages b){color:var(--c)}#chat-input{background:var(--sunken);border-color:var(--line);box-sizing:border-box;border-radius:10px;flex:1;width:100%;min-width:0;height:34px;padding:0 10px}.chat-row{box-sizing:border-box;flex:none;align-items:center;gap:4px;width:100%;display:flex}.chat-input-wrap{flex:1;align-items:center;min-width:0;display:flex;position:relative}.chat-input-wrap #chat-input{z-index:1;width:100%;position:relative}.chat-autocomplete{font:inherit;white-space:pre;pointer-events:none;z-index:2;color:#0000;align-items:center;padding:0 10px;font-size:14px;display:flex;position:absolute;inset:0;overflow:hidden}.chat-autocomplete .chat-typed{visibility:hidden;white-space:pre}.chat-autocomplete .chat-prediction{color:var(--muted);opacity:.65;white-space:pre}.chat-row.chat-disabled{opacity:.55;filter:grayscale(.6)}.chat-row.chat-disabled #chat-input{background:var(--line);color:var(--muted);cursor:not-allowed}#emoji-open{flex:none;height:34px}#players:has(#emoji-picker:popover-open) #emoji-open{color:var(--accent)}#emoji-picker,#emoji-suggest{background:var(--panel);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:12px;margin:0;padding:0;position:fixed;inset:auto;overflow:hidden}#emoji-picker{flex-direction:column;width:300px;height:340px;display:none}#emoji-picker:popover-open{display:flex}.emoji-glyph,.emoji-cell,.emoji-tab{font-family:Segoe UI Emoji,Apple Color Emoji,Noto Color Emoji,sans-serif}#emoji-picker .emoji-search{background:var(--sunken);border-color:var(--line);flex:none;height:30px;margin:8px 8px 4px}.emoji-tabs{border-bottom:1px solid var(--line);flex:none;gap:2px;padding:0 8px 6px;display:flex}.emoji-tabs .emoji-tab{filter:grayscale();opacity:.6;background:0 0;border-color:#0000;flex:1;justify-content:center;min-width:0;height:28px;padding:0;font-size:16px}.emoji-tabs .emoji-tab:hover{background:var(--hover);filter:none;opacity:1}.emoji-tabs .emoji-tab[aria-pressed=true]{filter:none;opacity:1;background:color-mix(in srgb, var(--accent) 14%, transparent)}.emoji-grid{flex:1;min-height:0;padding:6px 8px 8px;position:relative;overflow-y:auto}.emoji-cells{grid-template-columns:repeat(auto-fill,32px);justify-content:space-between;gap:2px;display:grid}.emoji-cells:not([hidden])~.emoji-cells:not([hidden]){border-top:1px solid var(--line);margin-top:6px;padding-top:6px}.emoji-cells .emoji-cell{background:0 0;border:0;border-radius:6px;justify-content:center;width:32px;height:32px;padding:0;font-size:21px;line-height:1}.emoji-cells .emoji-cell:hover{background:var(--hover)}.emoji-cells .emoji-cell:active{transform:none}#emoji-suggest{padding:4px;list-style:none;overflow-y:auto}#emoji-suggest li{cursor:pointer;color:var(--muted);border-radius:6px;align-items:center;gap:8px;padding:4px 8px;display:flex}#emoji-suggest li:hover{background:var(--hover)}#emoji-suggest li[aria-selected=true]{background:color-mix(in srgb, var(--accent) 14%, transparent);color:var(--text)}#emoji-suggest .emoji-glyph{font-size:18px;line-height:1}#people small{color:var(--muted);font-variant-numeric:tabular-nums;flex:none;font-size:12px;font-weight:400}#loading{color:var(--muted);align-items:center;gap:8px;font-size:13px;display:flex}#loading .bar{background:var(--line-strong);border-radius:2px;width:120px;height:4px;overflow:hidden}#loading-bar{background:var(--accent);width:0;height:100%;transition:width .2s}#loading.error{color:var(--error)}#loading.error .bar{display:none}.meters{align-items:center;gap:12px;display:flex}.meter{color:var(--muted);align-items:center;gap:5px;min-width:52px;font-size:13px;display:inline-flex}.meter svg{width:16px;height:16px}.meter b{color:var(--text);font-variant-numeric:tabular-nums;font-size:14px;font-weight:600}.transpose,.pedals{background:var(--sunken);border:1px solid var(--line);border-radius:10px;align-items:center;gap:2px;padding:2px;display:inline-flex}.transpose button,.pedals .toggle{height:28px;color:var(--muted);background:0 0;border-color:#0000;border-radius:7px}.transpose button{justify-content:center;width:28px;padding:0}.transpose button:hover,.pedals .toggle:hover{background:var(--hover);color:var(--text)}.transpose svg{width:16px;height:16px}.transpose button:focus-visible{z-index:1;position:relative}#transpose{width:36px;color:var(--text);font-variant-numeric:tabular-nums;font-weight:600}.pedal{height:28px;color:var(--muted);border-radius:7px;align-items:center;padding:0 10px;font-size:12px;font-weight:500;transition:background-color 80ms,color 80ms;display:inline-flex}button.pedal{background:0 0;border-color:#0000}button.pedal:hover{background:var(--hover);color:var(--text)}.pedal.on,button.pedal.on{background:var(--accent);color:var(--on-accent)}.toggle{gap:4px;padding:0 10px 0 8px;font-size:12px}.toggle svg{width:14px;height:14px}.toggle[aria-pressed=true],.pedals .toggle[aria-pressed=true]{color:var(--accent);background:color-mix(in srgb, var(--accent) 14%, transparent)}#settings{background:var(--panel);width:min(320px,100vw - 24px);max-height:calc(100vh - 64px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);box-sizing:border-box;border-radius:14px;margin:52px 12px auto auto;padding:18px;overflow:hidden auto}#settings h2{margin:0 0 14px;font-size:15px;font-weight:600}#settings .section{border-top:1px solid var(--line);box-sizing:border-box;gap:12px;min-width:0;max-width:100%;padding:14px 0;display:grid}#settings .section:first-of-type{border-top:0;padding-top:0}#settings label{color:var(--muted);box-sizing:border-box;gap:6px;min-width:0;max-width:100%;font-size:13px;display:grid}#settings :is(input,select){color:var(--text)}#settings label>span{justify-content:space-between;display:flex}#settings label>span.pick{align-items:center;gap:4px}#settings .pick select{flex:1;min-width:0}#settings output{color:var(--text);font-variant-numeric:tabular-nums}#settings label.check{align-items:center;gap:8px;display:flex}#settings input[type=range]{box-sizing:border-box;width:100%;max-width:100%;accent-color:var(--accent);margin:4px 0;display:block}#settings input[type=checkbox]{accent-color:var(--accent);margin:0}.swatches{gap:16px;display:flex}#settings .swatches label{align-items:center;gap:6px;display:flex}#settings .wheel-swatch{background:var(--raised);border:1px solid var(--line-strong);border-radius:6px;flex:none;width:32px;height:26px;padding:2px}.wheel-swatch:hover{border-color:var(--muted)}.wheel-swatch span{border-radius:3px;width:100%;height:100%}.wheel-pop{background:var(--panel);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:12px;flex-direction:column;gap:12px;margin:0;padding:12px;display:none;position:fixed;inset:auto}.wheel-pop:popover-open{display:flex}.wheel-disc{width:176px;height:176px;position:relative}.wheel-disc canvas{cursor:crosshair;touch-action:none;border-radius:50%;width:100%;height:100%;display:block}.wheel-mark{pointer-events:none;border:2px solid #fff;border-radius:50%;width:16px;height:16px;margin:-8px 0 0 -8px;position:absolute;box-shadow:0 0 0 1px #00000080,0 1px 4px #0006}#settings .wheel-pop input[type=range]{appearance:none;cursor:pointer;border:1px solid var(--line-strong);background:linear-gradient(to right, #000, var(--full,#fff));border-radius:7px;width:176px;height:14px;margin:0}.wheel-pop input[type=range]::-webkit-slider-thumb{appearance:none;background:0 0;border:2px solid #fff;border-radius:50%;width:16px;height:16px;box-shadow:0 0 0 1px #00000080,0 1px 4px #0006}.wheel-pop input[type=range]::-moz-range-thumb{background:0 0;border:2px solid #fff;border-radius:50%;width:12px;height:12px;box-shadow:0 0 0 1px #00000080,0 1px 4px #0006}.wheel-pop input[type=range]::-moz-range-track{background:0 0}.wheel-rgb{grid-template-columns:repeat(3,1fr);gap:8px;width:176px;display:grid}#settings .wheel-rgb label{gap:4px;font-size:12px}#settings .wheel-rgb label>span{justify-content:center}#settings .wheel-rgb input{text-align:center;font-variant-numeric:tabular-nums;width:100%;min-width:0;padding:0 4px}#settings fieldset{border:0;gap:6px;margin:0;padding:0;display:grid}#settings legend{color:var(--muted);margin-bottom:6px;padding:0;font-size:13px}#midi-list,#ban-list{margin:0;padding:0;list-style:none}#ban-list li{color:var(--text);justify-content:space-between;align-items:center;gap:8px;display:flex}#ban-list span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}#midi-list label{color:var(--text);align-items:center;gap:8px;margin:4px 0;display:flex}#midi-none{color:var(--muted);margin:0;font-size:13px}.credit{color:var(--muted);margin:0;font-size:11.5px;line-height:1.5}.credit a{color:inherit}#stage{background:var(--stage);min-height:0;position:relative}#rise{width:100%;height:100%;position:absolute;inset:0}#keys{isolation:isolate;background:var(--black-key);touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:relative;overflow:hidden}.keybed{width:100%;position:absolute;top:0;bottom:0;left:0}#map{box-sizing:border-box;touch-action:none;cursor:grab;-webkit-touch-callout:none;background:#050507;width:100%;height:22px;padding:3px 0;display:block}[data-narrow] .key span{display:none}.key{position:absolute;top:0}.key.white{background:var(--white-key);border-right:1px solid #0003;border-radius:0 0 4px 4px;height:100%}.key.black{z-index:1;background:var(--black-key);border-radius:0 0 3px 3px;height:62%;box-shadow:inset 0 -3px #ffffff14}.key span{text-align:center;color:#0000008c;pointer-events:none;font-size:clamp(8px,.8vw,12px);position:absolute;bottom:6px;left:0;right:0}.key.black span{color:#ffffffa6;font-size:clamp(7px,.7vw,11px);bottom:4px}.key span.ctrl{text-underline-offset:2px;text-decoration:underline}.key span{z-index:1}.key.on:after{content:"";border-radius:inherit;background:var(--c);opacity:var(--a);position:absolute;inset:0}[data-style=glow] #stage{background:radial-gradient(120% 90% at 50% 115%,#1b1430 0%,#08080b 55%,#050507 100%)}[data-style=glow] #keys{background:#050507;box-shadow:0 -1px #ffffff1a}[data-style=glow] #keys:before{content:"";z-index:2;pointer-events:none;background:linear-gradient(#000,#0000);height:3px;position:absolute;top:0;left:0;right:0}[data-style=glow] .key.white{background:linear-gradient(#cfcfcb 0%,#fbfbf9 6%,#f3f3f0 86%,#e2e2de 96%,#c9c9c4 100%);border-right:1px solid #0000004d;box-shadow:inset 2px 0 2px -1px #00000026,inset -2px 0 2px -1px #00000026}[data-style=glow] .key.black{background:linear-gradient(#0b0b0c 0%,#222225 80%,#3a3a3e 86%,#141416 100%);box-shadow:0 2px 3px #00000080}[data-style=glow] .key.on:after{opacity:calc(.55 + .4 * var(--a));background:linear-gradient(color-mix(in srgb, var(--c) 60%, white), var(--c) 70%);box-shadow:0 0 calc(24px * var(--g,.5)) var(--c)}[data-style=glow] .key.white span{color:#000000a6}[data-style=pfa] #stage,[data-style=pfa] #keys{background:#000}[data-style=pfa] #keys:before{content:"";z-index:2;pointer-events:none;background:linear-gradient(#161616 0,#050505 1px,#4b0503 1px,#950a06 7px,#3d3d3d 7px);height:9px;position:absolute;top:0;left:0;right:0}[data-style=pfa] .key.white{background:linear-gradient(#ccc 0%,#fff 86%,#878787 86%,#545454 92%,#9d9d9d 92%,#bababa 100%);border-right:1px solid #0b0b0b;border-radius:0}[data-style=pfa] .key.black{box-shadow:none;background:linear-gradient(#0000 88%,#4d4d4d 88%),linear-gradient(90deg,#333 12%,#1a1a1a 12% 88%,#000 88%);border-radius:0}[data-style=pfa] .key.on:after{opacity:1;background:linear-gradient(color-mix(in srgb, var(--c) 50%, black), var(--c) 30%)}[data-style=pfa] .key.black.on:after{background:linear-gradient(to right, var(--c) 12%, color-mix(in srgb, var(--c) 85%, black) 12% 88%, color-mix(in srgb, var(--c) 70%, black) 88%)}@media (max-width:700px){.meters .pedals{display:none}.meters{order:1}#room{grid-template:"head""side""stage"minmax(0,1fr)"map""keys"minmax(120px,24vh)/minmax(0,1fr)}#players{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--panel);border-width:0 0 1px;border-radius:0;flex-flow:wrap;grid-area:side;align-items:center;gap:4px;margin:0;padding:6px 8px}#players h2{margin:0 6px 0 4px}#people{flex:1;display:flex;overflow-x:auto}#people .person{white-space:nowrap;width:auto}#chat{flex-basis:100%;max-height:120px;margin:0;padding-top:6px}}@media (pointer:coarse){#cursors{display:none!important}#players{-webkit-backdrop-filter:none;backdrop-filter:none}.meter,.transpose,#sus-invert,#ped-sos,#ped-soft{display:none}.meters{order:0}.meters .pedals{display:inline-flex}.pedals .pedal{height:34px;padding:0 14px;font-size:13px}header button.icon,#invite{height:40px}header button.icon{width:40px}#room[data-labels=qwerty] .key span{display:none}}@media (pointer:coarse) and (max-width:420px){#invite span{display:none}#invite{justify-content:center;width:40px;padding:0}}@media (pointer:coarse) and (orientation:landscape) and (max-height:500px){#room{grid-template-rows:auto minmax(0,1fr) auto minmax(96px,42vh)}header{padding:4px 10px}#players{place-self:start;max-height:calc(100% - 16px);margin:8px 0 8px 8px;padding:6px;overflow:hidden}#players.open{background:var(--panel);grid-row:2/5;place-self:stretch stretch}#players.idle{opacity:1}#players:not(.open) :is(#people,#chat){display:none}#players h2{margin:0}#players-toggle{cursor:pointer;height:32px;padding:0 8px}#players.unread:not(.open) #players-toggle:after{content:"";background:var(--accent);border-radius:50%;width:7px;height:7px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}@media (forced-colors:active){.pedal.on,.key.on:after{forced-color-adjust:none;color:highlighttext;opacity:1;background:highlight}}.switch{color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:8px;font-size:12px;font-weight:500;display:inline-flex;position:relative}.switch input[type=checkbox]{appearance:none;background:var(--panel);border:1px solid var(--line-strong);cursor:pointer;border-radius:9999px;outline:none;flex-shrink:0;width:32px;height:18px;margin:0;transition:background .2s,border-color .2s;position:relative}.switch input[type=checkbox]:after{content:"";background:var(--muted);border-radius:50%;width:12px;height:12px;transition:transform .2s,background .2s;position:absolute;top:2px;left:2px}.switch input[type=checkbox]:hover{border-color:var(--accent)}.switch input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.switch input[type=checkbox]:checked:after{background:#0d0b14;transform:translate(14px)}.switch input[type=checkbox]:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 40%, transparent)}#tag-editor{background:var(--panel);width:min(620px,100vw - 24px);max-height:calc(100vh - 48px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:14px;margin:auto;padding:18px;position:fixed;inset:0;overflow-y:auto}#tag-editor:popover-open{flex-direction:column;gap:14px;display:flex}.tag-editor-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.tag-editor-header h2{align-items:center;gap:8px;margin:0;font-size:16px;font-weight:600;display:flex}.tag-editor-header svg{width:18px;height:18px;color:var(--accent)}#tag-editor .section{border-top:1px solid var(--line);gap:10px;padding:12px 0 0;display:grid}#tag-editor h3{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:12px;font-weight:600}.tag-perms-table{gap:10px;display:grid}.tag-perm-card{background:var(--raised);border:1px solid var(--line);border-radius:10px;flex-direction:column;gap:10px;padding:12px 14px;display:flex}.tag-perm-card-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.tag-perm-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px 12px;display:grid}.tag-delete-btn{width:24px;height:24px;color:var(--error);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;padding:0;display:inline-flex}.tag-delete-btn:hover{background:color-mix(in srgb, var(--error) 15%, transparent);border-radius:4px}.new-tag-form{gap:10px;display:grid}.new-tag-row{align-items:center;gap:8px;display:flex}.new-tag-row input[type=text]{flex:1;min-width:0}.new-tag-row input[type=color]{border:1px solid var(--line-strong);background:var(--raised);cursor:pointer;border-radius:8px;width:38px;height:32px;padding:2px}.new-tag-perms{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px 12px;padding:4px 0;display:grid}#banlist-dialog{background:var(--panel);width:min(520px,100vw - 24px);max-height:calc(100vh - 48px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:14px;margin:auto;padding:18px;position:fixed;inset:0;overflow-y:auto}#banlist-dialog:popover-open{flex-direction:column;gap:14px;display:flex}.banlist-container{gap:8px;display:grid}.ban-card{background:var(--raised);border:1px solid var(--line);border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.ban-card-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.ban-card-top{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.ban-card-name{color:var(--text);font-size:14px;font-weight:600}.ban-card-id{background:var(--panel);color:var(--muted);border-radius:4px;padding:2px 6px;font-family:ui-monospace,Cascadia Mono,monospace;font-size:11px}.ban-card-ip{background:var(--panel);color:var(--muted);border:1px solid var(--line);border-radius:4px;padding:2px 6px;font-family:ui-monospace,Cascadia Mono,monospace;font-size:11px}.ban-card-badge{text-transform:uppercase;letter-spacing:.05em;background:color-mix(in srgb, var(--accent) 15%, transparent);color:var(--accent);border:1px solid color-mix(in srgb, var(--accent) 30%, transparent);border-radius:4px;padding:2px 6px;font-size:10px;font-weight:600}.ban-card-badge.permanent{background:color-mix(in srgb, var(--error) 15%, transparent);color:var(--error);border-color:color-mix(in srgb, var(--error) 30%, transparent)}.ban-card-badge.temp{color:#fbbf24;background:#fbbf2426;border-color:#fbbf244d}.ban-card-badge.room-ban{color:#93c5fd;background:#60a5fa26;border-color:#60a5fa4d}.ban-card-acct{color:var(--accent);font-size:11px}.ban-card-meta{color:var(--muted);flex-wrap:wrap;gap:8px;font-size:12px;display:flex}.ban-card-reason{color:var(--error);font-style:italic}.ban-unban-btn{border:1px solid var(--line-strong);background:var(--panel);height:30px;color:var(--text);cursor:pointer;border-radius:6px;flex-shrink:0;align-items:center;gap:6px;padding:0 12px;font-size:12px;font-weight:500;transition:background .15s,border-color .15s;display:inline-flex}.ban-unban-btn:hover{background:color-mix(in srgb, var(--accent) 15%, transparent);border-color:var(--accent)}.ban-unban-btn svg{width:14px;height:14px}.user-id-row{color:var(--muted);justify-content:space-between;align-items:center;gap:8px;margin-top:4px;font-size:13px;display:flex}.user-id-val-wrap{align-items:center;gap:6px;display:flex}.user-id-val-wrap code{background:var(--raised);border:1px solid var(--line);color:var(--text);-webkit-user-select:all;user-select:all;border-radius:4px;padding:2px 6px;font-family:ui-monospace,Cascadia Mono,monospace;font-size:12px}.icon-small{border:1px solid var(--line);background:var(--raised);width:26px;height:26px;color:var(--text);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding:0;display:inline-flex}.icon-small:hover{background:var(--hover)}.icon-small svg{width:14px;height:14px}#jumpscare-menu{background:var(--panel);width:min(520px,100vw - 24px);max-height:calc(100vh - 48px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:14px;margin:auto;padding:18px;position:fixed;inset:0;overflow-y:auto}#jumpscare-menu:popover-open{flex-direction:column;gap:14px;display:flex}#jumpscare-menu .section{border-top:1px solid var(--line);gap:10px;padding:12px 0 0;display:grid}#jumpscare-menu h3{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:12px;font-weight:600}.js-media-card{background:var(--raised);border:1px solid var(--line);border-radius:10px;flex-direction:column;gap:10px;padding:10px;display:flex}.js-img-preview-box{border:1px solid var(--line);background:#000;border-radius:8px;justify-content:center;align-items:center;width:100%;height:120px;display:flex;overflow:hidden}.js-img-preview-box img{object-fit:contain;max-width:100%;max-height:100%}.js-media-actions{flex-wrap:wrap;gap:8px;display:flex}.js-media-actions button{border:1px solid var(--line);background:var(--panel);height:32px;color:var(--text);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:0 10px;font-size:12px;font-weight:600;display:inline-flex}.js-media-actions button:hover{background:var(--hover)}.js-media-actions button svg{width:14px;height:14px}.js-audio-status{color:var(--text);align-items:center;gap:8px;font-size:13px;font-weight:500;display:flex}.js-audio-status svg{width:16px;height:16px;color:var(--accent);flex:none}.error-msg{color:var(--error);margin:0;font-size:12px;font-weight:500}.js-targets-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.js-target-quick{gap:10px;display:flex}.link-btn{color:var(--accent);cursor:pointer;background:0 0;border:0;padding:0;font-size:11px;font-weight:600;text-decoration:underline}.link-btn:hover{color:color-mix(in srgb, var(--accent) 80%, white)}.js-targets-list{background:var(--raised);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:4px;max-height:150px;padding:6px;display:flex;overflow-y:auto}.js-target-item{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:6px;align-items:center;gap:8px;padding:4px 6px;font-size:13px;font-weight:500;display:flex}.js-target-item:hover{background:var(--hover)}.js-target-item input[type=checkbox]{cursor:pointer}.js-target-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.js-footer-section{flex-direction:column;gap:8px;display:flex}.js-send-button{justify-content:center;align-items:center;gap:8px;height:38px;font-size:14px;font-weight:600;display:inline-flex}.js-send-button:disabled{opacity:.6;cursor:not-allowed}.js-cooldown-note{color:var(--muted);text-align:center;margin:0;font-size:12px}#room-search-dialog{background:var(--panel);width:min(560px,100vw - 24px);max-height:calc(100vh - 48px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:14px;margin:auto;padding:18px;position:fixed;inset:0;overflow-y:auto}#room-search-dialog:popover-open{flex-direction:column;gap:14px;display:flex}#room-search-dialog .section{border-top:1px solid var(--line);gap:10px;padding:12px 0 0;display:grid}.rs-search-bar{background:var(--raised);border:1px solid var(--line);border-radius:8px;align-items:center;gap:8px;padding:0 12px;display:flex}.rs-search-bar svg{width:16px;height:16px;color:var(--muted);flex:none}.rs-search-bar input{color:var(--text);background:0 0;border:0;outline:none;flex:1;padding:8px 0;font-size:13px}.rs-rooms-list{flex-direction:column;gap:8px;max-height:320px;display:flex;overflow-y:auto}.rs-empty{color:var(--muted);text-align:center;margin:0;padding:24px 0;font-size:13px}.rs-room-card{background:var(--raised);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:6px;padding:10px 12px;display:flex}.rs-room-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.rs-room-name{color:var(--text);font-size:14px;font-weight:600}.rs-pass-info{color:var(--accent);font-family:ui-monospace,Cascadia Mono,monospace;font-size:11px}.rs-pass-none{color:var(--muted);font-size:11px}.rs-room-players{color:var(--muted);flex-wrap:wrap;gap:6px;font-size:12px;display:flex}.rs-player-pill{background:var(--panel);border:1px solid var(--line);color:var(--text);border-radius:4px;padding:1px 6px;font-size:11px}.rs-join-btn{border:1px solid var(--accent);background:var(--accent);color:#000;cursor:pointer;border-radius:6px;align-self:flex-end;height:28px;padding:0 12px;font-size:12px;font-weight:600}.rs-join-btn:hover{background:color-mix(in srgb, var(--accent) 85%, white)}.room-announcement{z-index:10000;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0006;justify-content:center;align-items:center;transition:opacity .25s;display:flex;position:fixed;inset:0}.announcement-content{pointer-events:auto;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:2px solid var(--accent);text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;background:#12101aeb;border-radius:16px;max-width:min(780px,92vw);max-height:80vh;padding:28px 36px;animation:.3s cubic-bezier(.16,1,.3,1) annEntrance;overflow-y:auto;box-shadow:0 20px 60px #000c}@keyframes annEntrance{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.announcement-text{word-break:break-word;overflow-wrap:break-word;font-weight:700;line-height:1.25}.announcement-author{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-top:14px;font-size:12px;font-weight:600}.cmd-output{background:var(--raised);border:1px solid var(--line);color:var(--text);border-radius:6px;margin:4px 0;padding:8px 10px;font-size:12px;line-height:1.45}.cmd-output b{color:var(--accent)}.cmd-output ul{margin:4px 0 0 16px;padding:0}.cmd-output li{margin-bottom:2px}#temptag-status-dialog{background:var(--panel);width:min(620px,100vw - 24px);max-height:calc(100vh - 48px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:14px;margin:auto;padding:18px;position:fixed;inset:0;overflow-y:auto}#temptag-status-dialog:popover-open{flex-direction:column;gap:14px;display:flex}.temptag-status-body{flex-direction:column;gap:14px;display:flex}.tt-status-banner{background:var(--raised);border:1px solid var(--line);border-radius:10px;align-items:center;gap:12px;padding:12px 14px;display:flex}.tt-badge{text-transform:uppercase;letter-spacing:.05em;border-radius:6px;flex-shrink:0;padding:4px 10px;font-size:11px;font-weight:700}.tt-badge.idle{background:var(--line);color:var(--muted)}.tt-badge.syncing{color:#60a5fa;background:#3b82f633;border:1px solid #3b82f666}.tt-badge.rate_limited{color:#fbbf24;background:#f59e0b33;border:1px solid #f59e0b66}.tt-badge.success{color:#34d399;background:#10b98133;border:1px solid #10b98166}.tt-badge.error{color:#f87171;background:#ef444433;border:1px solid #ef444466}.tt-badge.queued{color:#c084fc;background:#a855f733;border:1px solid #a855f766}.tt-status-desc{color:var(--text);font-size:13px;font-weight:500}.tt-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}@media (max-width:480px){.tt-grid{grid-template-columns:1fr}}.tt-card{background:var(--raised);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:4px;padding:10px 12px;display:flex}.tt-card-label{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:600}.tt-card-val{color:var(--text);font-family:ui-monospace,monospace;font-size:13px;font-weight:600}.tt-section{flex-direction:column;gap:8px;display:flex}.tt-section h3{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0;font-size:12px;font-weight:600}.tt-fallbacks-list{flex-direction:column;gap:6px;display:flex}.tt-fallback-item{background:var(--raised);border:1px solid var(--line);border-radius:8px;align-items:center;gap:10px;padding:8px 12px;display:flex}.tt-fallback-item.active{border-color:color-mix(in srgb, var(--accent) 40%, transparent);background:color-mix(in srgb, var(--accent) 8%, var(--raised))}.tt-fb-icon{background:var(--panel);width:28px;height:28px;color:var(--accent);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.tt-fb-icon svg{width:16px;height:16px}.tt-fb-info{flex:1;min-width:0}.tt-fb-info strong{color:var(--text);font-size:13px;display:block}.tt-fb-info p{color:var(--muted);margin:2px 0 0;font-size:11px}.tt-fb-status{background:var(--panel);color:var(--muted);border:1px solid var(--line);border-radius:4px;flex-shrink:0;padding:2px 8px;font-size:11px;font-weight:600}.tt-fb-status.active{color:#34d399;background:#10b98126;border-color:#10b9814d}.tt-fb-status.blocked{color:#fbbf24;background:#f59e0b26;border-color:#f59e0b4d}.tt-token-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.tt-token-row input{border:1px solid var(--line);background:var(--raised);min-width:200px;height:34px;color:var(--text);border-radius:6px;flex:1;padding:0 10px;font-family:monospace;font-size:12px}.tt-pending-list{background:var(--raised);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:4px;max-height:120px;padding:8px;display:flex;overflow-y:auto}.tt-pending-chip{background:var(--panel);border:1px solid var(--line);border-radius:6px;justify-content:space-between;align-items:center;gap:8px;padding:6px 10px;font-size:12px;display:flex}.tt-empty{color:var(--muted);text-align:center;margin:4px 0;font-size:12px}.tt-log-header{justify-content:space-between;align-items:center;display:flex}.icon-link{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;font-size:11px}.icon-link:hover{text-decoration:underline}.tt-log-console{color:#c9d1d9;border:1px solid var(--line-strong);background:#0d1117;border-radius:8px;flex-direction:column;max-height:160px;padding:10px;font-family:ui-monospace,Cascadia Mono,monospace;font-size:11px;line-height:1.5;display:flex;overflow-y:auto}.tt-log-entry{word-break:break-all;margin-bottom:2px}.tt-log-entry .tt-log-time{color:#8b949e;margin-right:6px}.tt-log-entry .tt-log-level{margin-right:6px;font-weight:700}.tt-log-entry.info .tt-log-msg{color:#58a6ff}.tt-log-entry.success .tt-log-msg{color:#3fb950}.tt-log-entry.warn .tt-log-msg{color:#d29922}.tt-log-entry.error .tt-log-msg{color:#f85149}.tt-log-entry.fallback .tt-log-msg{color:#bc8cff;font-weight:600}.tt-actions-bar{flex-wrap:wrap;gap:8px;margin-top:4px;display:flex}.tt-actions-bar .btn{cursor:pointer;border:1px solid var(--line-strong);background:var(--raised);height:34px;color:var(--text);border-radius:6px;align-items:center;gap:6px;padding:0 14px;font-size:12px;font-weight:600;transition:background .15s,border-color .15s;display:inline-flex}.tt-actions-bar .btn:hover{background:color-mix(in srgb, var(--accent) 15%, transparent);border-color:var(--accent)}.tt-actions-bar .btn.primary{background:var(--accent);color:#000;border-color:var(--accent)}.tt-actions-bar .btn.primary:hover{filter:brightness(1.1)}.tt-actions-bar .btn.secondary{background:var(--panel)}.tt-actions-bar .btn svg{width:14px;height:14px}#midi-dialog{background:var(--panel);width:min(340px,100vw - 24px);max-height:calc(100vh - 64px);color:var(--text);border:1px solid var(--line-strong);box-shadow:var(--shadow);box-sizing:border-box;border-radius:14px;margin:52px 12px auto auto;padding:18px;overflow:hidden auto}#midi-dialog:popover-open{flex-direction:column;gap:12px;display:flex}.midi-dialog-body{flex-direction:column;gap:10px;display:flex}.midi-fieldset{border:1px solid var(--line);border-radius:8px;gap:6px;margin:0;padding:10px 12px;display:grid}.midi-fieldset legend{color:var(--muted);padding:0 6px;font-size:12px;font-weight:600}.tt-progress-container{background:var(--raised);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:6px;padding:10px 12px;display:flex}.tt-progress-header{color:var(--text);justify-content:space-between;align-items:center;font-size:12px;font-weight:600;display:flex}.tt-progress-header span:last-child{color:var(--accent);font-family:ui-monospace,monospace;font-weight:700}.tt-progress-track{background:var(--sunken);border:1px solid var(--line);border-radius:4px;width:100%;height:8px;overflow:hidden}.tt-progress-bar{background:linear-gradient(90deg, var(--accent), #fbbf24);border-radius:3px;height:100%;transition:width .3s}.ban-overlay{z-index:99999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-sizing:border-box;background:#000000e0;border:none;justify-content:center;align-items:center;width:100vw;max-width:100vw;height:100vh;max-height:100vh;margin:0;padding:20px;display:flex;position:fixed;inset:0}.ban-overlay:popover-open{display:flex!important}.ban-overlay[hidden]{display:none!important}.ban-overlay-card{background:var(--panel);border:1px solid var(--line-strong);text-align:center;border-radius:16px;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:440px;padding:28px 24px;display:flex;box-shadow:0 24px 60px #000000b3}.ban-overlay-icon{color:#ef4444;background:#ef444426;border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;margin-bottom:4px;display:flex}.ban-overlay-icon svg{width:28px;height:28px}.ban-overlay h1{color:#fff;margin:0;font-size:22px;font-weight:700}.ban-overlay.site-wide h1{color:#ef4444}.ban-overlay.site-wide .ban-overlay-icon{color:#ef4444;background:#ef444440;animation:2s infinite pulse-red}@keyframes pulse-red{0%,to{transform:scale(1);box-shadow:0 0 #ef444466}50%{transform:scale(1.05);box-shadow:0 0 0 10px #ef444400}}.ban-overlay p{color:#fff;margin:0;font-size:14px;line-height:1.5}.ban-overlay.site-wide p{color:#fca5a5;font-weight:600}.ban-overlay .ban-overlay-reason{color:#d1d5db;background:var(--raised);border:1px solid var(--line);word-break:break-word;box-sizing:border-box;border-radius:8px;width:100%;padding:8px 12px;font-size:13px;font-style:italic}.ban-overlay .ban-overlay-expiry{color:#fbbf24;font-size:12px;font-weight:600}.ban-overlay-actions{width:100%;margin-top:8px}.ban-overlay-actions .btn{justify-content:center;width:100%;height:38px;font-size:14px}#stage.piano-disabled,#keys.piano-disabled,#map.piano-disabled{opacity:.45;filter:grayscale(.85);transition:opacity .2s,filter .2s;pointer-events:none!important}.tag-list{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.tag-list .tag-badge{background:color-mix(in srgb, var(--c,var(--accent)) 16%, var(--raised));color:var(--c,var(--accent));border:1px solid color-mix(in srgb, var(--c,var(--accent)) 35%, transparent);border-radius:6px;align-items:center;gap:4px;padding:3px 8px;font-size:11.5px;font-weight:600;display:inline-flex}