:root{--bg:#1e1f22;--panel:#2b2d31;--text:#f2f3f5;--muted:#b5bac1;--accent:#5865f2;--error:#f23f43;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;color:var(--text);margin:0}.app{flex-direction:column;gap:8px;height:100%;padding:8px;display:flex}.load,.controls,.status{align-items:center;gap:8px;display:flex}.load input{flex:1}input,button{font:inherit;color:var(--text);background:var(--panel);border:1px solid #3f4147;border-radius:6px;padding:6px 10px}button{background:var(--accent);border-color:var(--accent);cursor:pointer}button:disabled{opacity:.5;cursor:default}.stage{background:#000;border-radius:8px;flex:1;place-items:center;min-height:0;display:grid;position:relative;overflow:hidden}:is(.app:fullscreen .load,.app:fullscreen .queue,.app:fullscreen .status,.app.theater .load,.app.theater .queue,.app.theater .status){display:none}:is(.app:fullscreen .stage,.app.theater .stage){border-radius:0}.app.pip{gap:0;padding:0}.app.pip>:not(.stage){display:none}.app.pip .stage{border-radius:0}@media (height<=280px){.app{gap:0;padding:0}.app>:not(.stage){display:none}.app .stage{border-radius:0}}.app.theater{padding:0 0 4px}.app.theater .controls{padding:0 8px}.stage video[hidden]{display:none}.stage video{object-fit:contain;width:100%;height:100%;position:absolute;inset:0}.channel-bug{opacity:.85;pointer-events:none;width:auto;position:absolute}.placeholder{color:var(--muted);text-align:center;padding:16px}.placeholder progress{width:min(320px,80vw)}.play-error{background:#000000b3;border-radius:4px;margin:0 8px;padding:4px 8px;position:absolute;bottom:8px}.join{padding:12px 20px;font-size:1.2em;position:absolute}.secondary{background:var(--panel);border-color:#3f4147}.toggle{background:var(--panel);white-space:nowrap;border-color:#3f4147}.toggle.on{border-color:var(--accent)}.seek{flex:1;align-items:center;display:flex;position:relative}.downloaded{pointer-events:none;background:#4e5058;border-radius:2px;height:4px;position:absolute;left:0}.seek input[type=range]{width:100%;accent-color:var(--accent);background:0 0;border:none;padding:0;position:relative}.queue{--queue-row:28px;height:calc(3 * var(--queue-row));color:var(--muted);flex:none;margin:0;padding:0;list-style:none;overflow-y:auto}.queue li{box-sizing:border-box;height:var(--queue-row);border-top:2px solid #0000;border-radius:4px;align-items:center;gap:6px;padding:2px 4px;display:flex}.queue-number{font-variant-numeric:tabular-nums;min-width:1.5em}.queue li.dragging{opacity:.4}.queue li.drop-target{border-top-color:var(--accent)}.drag-handle{cursor:grab;opacity:.6}.queue-title{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;overflow:hidden}.queue li.queue-empty{opacity:.6}.queue-actions{gap:2px;display:flex}.requested-by{color:var(--muted);opacity:.75;white-space:nowrap}.queue-button{color:var(--muted);background:0 0;border-color:#0000;padding:0 6px}.queue-button:disabled{opacity:.25}.controls{flex-wrap:wrap}.seek{min-width:160px}.audio{align-items:center;gap:6px;display:flex}.audio .secondary{padding:4px 8px}.mute{place-items:center;display:grid}.mute svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:1.4em;height:1.4em}.mute svg .speaker{fill:currentColor}.volume{width:110px;accent-color:var(--accent);background:0 0;border:none;padding:0}.volume-label{width:3.5em;color:var(--muted);font-variant-numeric:tabular-nums}.skip{align-items:center;gap:6px;display:flex}.skip-count{font-variant-numeric:tabular-nums;opacity:.8}.time{font-variant-numeric:tabular-nums;color:var(--muted);white-space:nowrap}.status{color:var(--muted);justify-content:space-between;align-items:flex-start;font-size:.85em}.status .now{flex:1;min-width:0}.status .room-info{text-align:right;max-width:40%}.fullscreen{place-items:center;padding:6px 10px;display:grid}.fullscreen svg{fill:none;stroke:currentColor;stroke-width:2.25px;stroke-linecap:round;stroke-linejoin:round;width:1.25em;height:1.25em}.watchers{justify-content:flex-end;align-items:baseline;gap:5px;display:flex}.watchers svg{fill:currentColor;flex:none;align-self:center;width:1.1em;height:1.1em}.error{color:var(--error)}.fatal{padding:16px}.queue li.autoplay-next{opacity:.7;font-style:italic}.status+.queue{border-top:1px solid #3f4147;padding-top:4px}.now-playing{color:var(--text);font-size:1.3em;font-weight:600}.play-pause{place-items:center;padding:6px 12px;display:grid}.play-pause svg,.skip svg{fill:currentColor;width:1.25em;height:1.25em}