:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#0c121c;color:#e8eff8}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,select,input{font:inherit}button{background:#293a50;color:#f1f6ff;border:1px solid #42556e;border-radius:8px;padding:10px 12px;cursor:pointer;touch-action:manipulation}button:active{filter:brightness(1.2)}button:disabled{opacity:.4;cursor:default}.primary{background:#1e78c8;border-color:#3893dc}.danger{background:#ad3441;border-color:#ed6273}header{min-height:70px;padding:10px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#151f2c;border-bottom:1px solid #304157}.brand{display:flex;align-items:center;gap:12px}.brand strong{font-size:16px;letter-spacing:.08em}.brand small{display:block;color:#a8bdcf;font-size:11px;margin-top:3px}.logo{font-size:30px;color:#5db5f9}.headerActions{display:flex;align-items:center;gap:8px}.headerActions span{color:#b8cbd9;font-size:12px}.app{height:calc(100dvh - 70px);min-height:520px;display:grid;grid-template-columns:minmax(190px,220px) minmax(320px,1fr) minmax(320px,1.1fr)}.sidebar,.stack,.mixer{min-width:0;padding:18px;border-right:1px solid #304157;display:flex;flex-direction:column;gap:13px;overflow:hidden}.sidebar{background:#101927}.sidebar label,.eyebrow{font-size:11px;font-weight:750;color:#8cbbdb;letter-spacing:.12em}.sidebar select{width:100%;background:#223246;color:white;border:1px solid #496078;border-radius:8px;padding:12px}.sidebarActions{display:flex;gap:7px}.sidebarActions button{flex:1;padding:9px 6px;font-size:12px}.sidebarBottom{margin-top:auto;display:flex;flex-direction:column;gap:8px}.wide{width:100%}.hint{color:#94a8b9;font-size:11px;line-height:1.5}.sectionTitle{display:flex;justify-content:space-between;align-items:center;gap:8px}.sectionTitle h1{font-size:20px;margin:4px 0 0}.chip{color:#adbfcc;background:#223143;padding:7px 10px;border-radius:100px;font-size:12px;white-space:nowrap}.cueList{overflow:auto;flex:1;min-height:0;border:1px solid #2b3e51;border-radius:10px;background:#111d2c}.cue{display:flex;align-items:center;gap:9px;padding:10px;border-bottom:1px solid #2a3848;min-height:74px}.cue.next{background:#183654;outline:1px solid #399cf2;outline-offset:-1px}.cue.playing{border-left:4px solid #4cc8a2}.num{font-size:12px;color:#81b9e4;width:28px}.cueInfo{min-width:0;flex:1}.cueInfo strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.cueInfo small{color:#a6b9c8;display:block;margin-top:5px}.cueActions{display:flex;align-items:center;gap:5px}.cueActions button{font-size:12px;padding:9px}.cueActions .play{background:#237e60;border-color:#41b990}.cueTransport{display:flex;gap:8px;align-items:center;border-top:1px solid #3a4a5a;padding-top:13px}.nextCue{flex:1;min-width:0}.nextCue small{display:block;font-size:10px;color:#8fb9d7}.nextCue strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:4px}.cueTransport .go{background:#1c9c71;border:1px solid #63e9b0;color:#fff;font-weight:800;font-size:24px;padding:13px 25px}.channelList{min-height:0;overflow-x:auto;overflow-y:auto;display:flex;align-items:stretch;gap:10px;flex:1;padding:7px 0}.empty{margin:auto;text-align:center;color:#8ea7b8;line-height:1.6;padding:12px}.channel{border:1px solid #405975;background:linear-gradient(180deg,#223348,#182537);border-radius:11px;min-width:121px;max-width:138px;flex:1;display:flex;align-items:center;flex-direction:column;gap:8px;padding:12px 8px}.channelTitle{height:40px;font-size:12px;font-weight:700;text-align:center;overflow:hidden;line-height:1.3}.meter{height:8px;background:#0a1522;width:90%;border-radius:10px;overflow:hidden}.meter>div{height:100%;background:#43c69c;transition:width .12s}.faderArea{flex:1;min-height:100px;display:flex;align-items:center;justify-content:center;width:100%}.fader{writing-mode:vertical-lr;direction:rtl;width:35px;height:100%;min-height:100px;accent-color:#64bffa;cursor:pointer}.percent{font-size:14px;font-variant-numeric:tabular-nums}.channelButtons{display:grid;grid-template-columns:1fr 1fr;gap:5px;width:100%}.channelButtons button{padding:8px 4px;font-size:10px}.channelButtons .span2{grid-column:span 2}.master{border-top:1px solid #334b62;padding-top:12px}.masterTitle{font-size:12px;font-weight:700;display:flex;justify-content:space-between}.master input{width:100%;accent-color:#62b5ed;margin:12px 0}.panic{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.panic button{font-size:11px;padding:10px 5px}.toast{pointer-events:none;position:fixed;bottom:15px;left:50%;transform:translateX(-50%);padding:10px 15px;border-radius:8px;background:#38516b;color:white;opacity:0;transition:opacity .2s;z-index:9}.toast.visible{opacity:1}body.performance .sidebarBottom,body.performance .sidebarActions,body.performance .cueActions .edit,body.performance .cueActions .remove{display:none}body.performance .cue{min-height:85px}body.performance .cueTransport .go{font-size:30px}@media(max-width:1020px){.app{grid-template-columns:160px minmax(280px,1fr) minmax(290px,1fr)}.sidebar,.stack,.mixer{padding:10px}.brand strong{font-size:13px}.headerActions span{display:none}.panic{grid-template-columns:1fr 1fr}}@media(max-width:760px){header{flex-wrap:wrap}.app{height:auto;grid-template-columns:1fr}.sidebar{overflow:visible}.stack{height:530px}.mixer{height:510px}.channelList{min-height:260px}}

/* Light theme: original dark theme remains unchanged. */
:root[data-theme="light"]{color-scheme:light;background:#f4f7fb;color:#172437}
:root[data-theme="light"] body{background:#f4f7fb;color:#172437}
:root[data-theme="light"] button{background:#e8f0f9;color:#18314b;border-color:#aebfd2}
:root[data-theme="light"] button:active{filter:brightness(.94)}
:root[data-theme="light"] button:disabled{opacity:.46}
:root[data-theme="light"] .primary{background:#1876bd;border-color:#0966a7;color:#fff}
:root[data-theme="light"] .danger,:root[data-theme="light"] #stopAll{background:#b83240;border-color:#992633;color:#fff}
:root[data-theme="light"] header{background:#fff;border-bottom-color:#c7d5e3}
:root[data-theme="light"] .brand small,:root[data-theme="light"] .headerActions span{color:#52677b}
:root[data-theme="light"] .logo{color:#1479bd}
:root[data-theme="light"] .sidebar,:root[data-theme="light"] .stack,:root[data-theme="light"] .mixer{border-right-color:#d2dce6}
:root[data-theme="light"] .sidebar{background:#eaf1f8}
:root[data-theme="light"] .sidebar label,:root[data-theme="light"] .eyebrow{color:#205f90}
:root[data-theme="light"] .sidebar select{background:#fff;color:#152a3c;border-color:#afc1d1}
:root[data-theme="light"] .hint{color:#536a7e}
:root[data-theme="light"] .chip{background:#dbe7f3;color:#385a76}
:root[data-theme="light"] .cueList{background:#fff;border-color:#c4d3e0}
:root[data-theme="light"] .cue{border-bottom-color:#e0e8ef}
:root[data-theme="light"] .cue.next{background:#d8ebfa;outline-color:#2285cb}
:root[data-theme="light"] .cue.playing{border-left-color:#138d69}
:root[data-theme="light"] .num{color:#286e9f}
:root[data-theme="light"] .cueInfo small{color:#566e80}
:root[data-theme="light"] .cueActions .play{background:#16805f;border-color:#116f52;color:#fff}
:root[data-theme="light"] .cueTransport{border-top-color:#ccdae5}
:root[data-theme="light"] .nextCue small{color:#276f9e}
:root[data-theme="light"] .cueTransport .go{background:#14855f;border-color:#0c704f;color:#fff}
:root[data-theme="light"] .channel{background:linear-gradient(180deg,#ffffff,#e9f1f9);border-color:#b2c5d6}
:root[data-theme="light"] .meter{background:#c8d6e3}
:root[data-theme="light"] .meter>div{background:#159c72}
:root[data-theme="light"] .empty{color:#5a7287}
:root[data-theme="light"] .master{border-top-color:#c1cfda}
:root[data-theme="light"] .toast{background:#244b70;color:#fff}
:root[data-theme="light"] input[type="range"]{accent-color:#1779b9}
:root[data-theme="light"] .fader{accent-color:#1479bd}
:root[data-theme="light"] :focus-visible{outline:3px solid #1178bb;outline-offset:2px}

/* v0.3 cue organizing controls */
.cueHelp{font-size:11px;color:#a4b8ca;margin-top:-7px}
.cueActions{flex-wrap:wrap;justify-content:flex-end;max-width:230px}
.cueActions button{padding:6px 7px}
.cueActions .organize{font-size:11px}
.dragHandle{font-size:20px;color:#95aabe;cursor:grab;touch-action:auto}
.cue.dragging{opacity:.45}
.cue.dropTarget{outline:2px dashed #45a4eb;outline-offset:-2px}
.cue-disabled .cueInfo{opacity:.53}
.cue-disabled .num{text-decoration:line-through}
body.performance .cueHelp,body.performance .dragHandle{display:none}
:root[data-theme="light"] .cueHelp{color:#506b80}
:root[data-theme="light"] .dragHandle{color:#6485a1}
@media(max-width:1150px){.cueActions{max-width:160px}.cueActions button{font-size:10px;padding:5px 6px}.cue{gap:5px}}

.autoStatus{font-size:.72rem;color:var(--muted,#64748b);white-space:nowrap}#holdAuto[aria-pressed="true"]{background:#a33;color:white;border-color:#a33}

/* v0.7: Color-coded show controls, clearly differentiated cue states. */
:root { --cue-playing:#103e32; --cue-ondeck:#5d3810; }
:root[data-theme="light"] { --cue-playing:#d9f4e5; --cue-ondeck:#ffe5bd; }
.cue{cursor:pointer;position:relative}
.cue.next{background:var(--cue-ondeck);outline:2px solid #ec970a;outline-offset:-2px}
.cue.playing{background:var(--cue-playing);border-left:5px solid #19aa73}
.cue.playing.next{background:linear-gradient(90deg,var(--cue-playing) 55%,var(--cue-ondeck));outline:2px solid #ec970a}
.cueState{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.06em;margin-top:4px;color:#f0ab41}
.cue.playing .cueState{color:#3bdc9a}
.cue-disabled .cueState{color:#9aa4b1}
:root[data-theme="light"] .cue.playing .cueState{color:#146847}
:root[data-theme="light"] .cue.next:not(.playing) .cueState{color:#925000}
.cueTransport button.btn-back,.cueTransport button.btn-skip{border:2px solid #4c8ed5;color:#c4e3ff;background:#173453}
.cueTransport button.btn-hold{border:2px solid #e29b2d;color:#ffd89b;background:#52350f}
.cueTransport .go{box-shadow:inset 0 0 0 2px #69e2ac}
.panic .btn-fade,.channelButtons .btn-fade{border:2px solid #368fdb;background:#153a63;color:#c9e8ff}
.panic .btn-pause{border:2px solid #e7a638;background:#51380f;color:#ffe0a0}
.channelButtons .btn-stop{border:2px solid #e45b6a;background:#631e28;color:#ffe2e4}
.channelButtons .btn-mute{border:2px solid #d6aa35;background:#494012;color:#ffe6a1}
.channelButtons .btn-loop{border:2px solid #916de4;background:#302453;color:#e2d7ff}
.channelButtons .btn-level{border:2px solid #36aaab;background:#123f44;color:#c0fafa}
:root[data-theme="light"] .cueTransport button.btn-back,:root[data-theme="light"] .cueTransport button.btn-skip{color:#17528b;background:#e6f1ff;border-color:#2f7ac2}
:root[data-theme="light"] .cueTransport button.btn-hold{color:#8f5000;background:#fff1d7;border-color:#d98c16}
:root[data-theme="light"] .panic .btn-fade,:root[data-theme="light"] .channelButtons .btn-fade{color:#165a96;background:#e1f0ff;border-color:#3489cc}
:root[data-theme="light"] .panic .btn-pause{color:#845000;background:#fff1d3;border-color:#d99a23}
:root[data-theme="light"] .channelButtons .btn-stop{color:#9b2330;background:#ffe7e9;border-color:#c63d50}
:root[data-theme="light"] .channelButtons .btn-mute{color:#755500;background:#fff5cc;border-color:#c8a02e}
:root[data-theme="light"] .channelButtons .btn-loop{color:#6234ac;background:#eee7ff;border-color:#916de4}
:root[data-theme="light"] .channelButtons .btn-level{color:#076c74;background:#dff6f5;border-color:#26a0a7}
#holdAuto[aria-pressed="true"]{background:#a52d27!important;color:#fff!important;border:2px solid #f87171!important}
.audioMeter{height:12px;position:relative;background:#253443;border:1px solid #677887;overflow:hidden;border-radius:4px;width:95%}
.audioMeterFill{height:100%;width:0;background:linear-gradient(90deg,#11b86f 0%,#48d585 58%,#e8c647 78%,#eb5c51 100%);transition:width 90ms linear}
.masterAudioMeter{height:11px;width:100%;margin-top:9px}
:root[data-theme="light"] .audioMeter{background:#d8e1eb;border-color:#a4b6c8}
.fadeTimeLabel{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:750;letter-spacing:.05em;margin-top:10px;gap:8px}
.fadeTimeLabel input{width:90px;min-height:35px;text-align:center;border:1px solid #7797b2;background:#223246;color:#f6faff;border-radius:6px;padding:5px}
:root[data-theme="light"] .fadeTimeLabel input{background:#fff;color:#14344f;border-color:#abc1d3}
@media(max-width:1050px){.cueTransport{flex-wrap:wrap}.cueTransport .autoStatus{width:100%}}

/* v0.7.2: high-contrast volume sliders on iPad, Chrome and desktop. */
:root { --volume-control:#ffffff; --volume-track:#54697b; --volume-knob-border:#142335; }
:root[data-theme="light"] { --volume-control:#111111; --volume-track:#b3c3d2; --volume-knob-border:#ffffff; }
.fader, .master input[type="range"] { accent-color:var(--volume-control); }
/* WebKit sliders (iPad Chrome/Safari and desktop Chrome) */
.fader, .master input[type="range"] { -webkit-appearance:none; appearance:none; background:transparent; }
.fader::-webkit-slider-runnable-track { width:8px; height:100%; background:var(--volume-track); border-radius:12px; border:1px solid #899aaa; }
.master input[type="range"]::-webkit-slider-runnable-track { width:100%; height:8px; background:var(--volume-track); border-radius:12px; border:1px solid #899aaa; }
.fader::-webkit-slider-thumb, .master input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none; appearance:none; width:23px; height:23px; border-radius:50%; background:var(--volume-control); border:2px solid var(--volume-knob-border); box-shadow:0 1px 3px #0005; }
.master input[type="range"]::-webkit-slider-thumb { margin-top:-9px; }
/* Firefox equivalent */
.fader::-moz-range-track, .master input[type="range"]::-moz-range-track { background:var(--volume-track); border-radius:12px; border:1px solid #899aaa; }
.fader::-moz-range-track { width:8px; }
.master input[type="range"]::-moz-range-track { height:8px; }
.fader::-moz-range-thumb, .master input[type="range"]::-moz-range-thumb { background:var(--volume-control); border:2px solid var(--volume-knob-border); border-radius:50%; width:19px; height:19px; box-shadow:0 1px 3px #0005; }


/* v0.7.4 — LANDSCAPE THEATER CONTROLS. Presentation only. No changes to input elements or playback. */
/* Stronger specificity ensures theme styles and native iPad focus styles do not obscure state. */
:root .cueList .cue.next:not(.playing):not(.cue-disabled) {
  background:#59370f !important;
  outline:3px solid #ffa928 !important;
  outline-offset:-3px;
  box-shadow:inset 5px 0 0 #ffab29;
}
:root[data-theme="light"] .cueList .cue.next:not(.playing):not(.cue-disabled) {
  background:#ffdfaa !important;outline-color:#d57800 !important;box-shadow:inset 5px 0 0 #d57800;
}
:root .cueList .cue.playing:not(.cue-disabled) {
  background:#103c30 !important;border-left:5px solid #2bd59a;
}
:root[data-theme="light"] .cueList .cue.playing:not(.cue-disabled) {background:#d5f3e2 !important;border-left-color:#148b60}
:root .cueList .cue.playing.next:not(.cue-disabled) {
  outline:3px solid #ffa928 !important;outline-offset:-3px;box-shadow:inset -5px 0 0 #ffab29;
}
:root .cueList .cue.cue-disabled {opacity:.63;background:transparent !important}
:root .cueList .cue.next .cueState {font-weight:900;color:#ffbf55;letter-spacing:.08em}
:root[data-theme="light"] .cueList .cue.next .cueState {color:#8b4a00}
:root .cueList .cue.playing .cueState {color:#5aefb0}
:root[data-theme="light"] .cueList .cue.playing .cueState {color:#086d48}

/* Use solid, clearly distinguished controls with a contrasting text label. */
:root .cueTransport #goBtn {background:#159a70 !important;color:#fff !important;border:2px solid #63dfb6 !important}
:root .cueTransport #backCue,:root .cueTransport #skipCue {background:#173b67 !important;color:#fff !important;border:2px solid #5b9eea !important}
:root .cueTransport #holdAuto {background:#68400b !important;color:#fff0ce !important;border:2px solid #ffad39 !important}
:root .cueTransport #holdAuto[aria-pressed="true"] {background:#a52d27 !important;color:white !important;border-color:#ff7777 !important}
:root .panic #fadeAll3,:root .channelButtons .btn-fade {background:#174a79 !important;color:#fff !important;border:2px solid #54adf5 !important}
:root .panic #pauseAll {background:#69460e !important;color:#fff2d8 !important;border:2px solid #f2b849 !important}
:root .panic #stopAll,:root .channelButtons .btn-stop {background:#a9293b !important;color:white !important;border:2px solid #f27182 !important}
:root .channelButtons .btn-mute {background:#6c4f10 !important;color:#fff5ca !important;border:2px solid #f4c84b !important}
:root .channelButtons .btn-loop {background:#483174 !important;color:#fff !important;border:2px solid #b99cff !important}
:root .channelButtons .btn-level {background:#075a64 !important;color:white !important;border:2px solid #59cbd2 !important}
:root .cueActions button.play {background:#087c5b !important;color:white !important;border:2px solid #41d3a5 !important}
:root .cueTransport button:disabled,:root .cueActions button:disabled {opacity:.43 !important}
/* A larger finger-sized hit area, without affecting event handling. */
@media (orientation:landscape) and (pointer:coarse) {
  .cueActions {gap:5px;flex-wrap:wrap;justify-content:flex-end}
  .cueActions button {min-width:35px;min-height:36px;padding:6px 7px;font-size:12px}
  .cueTransport button {min-height:52px}
  .cueTransport #goBtn {min-height:62px;min-width:94px}
  .panic button {min-height:44px}
  .channelButtons button {min-height:38px}
  .cue {min-height:84px}
}
/* Keyboard focus stays visible but does not replace the status color. */
.cue:focus-within {outline-offset:-3px}

/* v0.8: landscape mixer uses space according to the number of active sounds.
   Keep the full-height faders when channels are present; eliminate the enormous idle panel. */
.channelClock{font-size:11px;font-weight:750;font-variant-numeric:tabular-nums;white-space:nowrap;letter-spacing:.02em;color:#b2cce1;padding:2px 0}
:root[data-theme="light"] .channelClock{color:#245876}
.mixer .channelList{flex:0 1 auto;min-height:0;height:clamp(245px,44vh,425px);align-items:stretch}
.mixer .channelList:has(.empty){height:96px;flex:0 0 96px;border:1px dashed #71869b;border-radius:9px;background:rgba(100,130,160,.05)}
.mixer .channelList:has(.empty) .empty{font-size:13px}
.mixer .master{margin-top:0}
@media (orientation:landscape) and (max-height:750px){
 .mixer .channelList{height:clamp(210px,37vh,330px)}
 .mixer .channelList:has(.empty){height:76px;flex-basis:76px}
}

/* v0.9: always-available instant sounds, separate from the GO cue stack. */
.instantEffects{border:1px solid #536d86;border-radius:10px;padding:10px;background:rgba(83,127,167,.10);display:flex;flex-direction:column;gap:9px;flex-shrink:0}
.instantHead{display:flex;align-items:center;justify-content:space-between;gap:8px}
.instantHead strong{font-size:12px;letter-spacing:.07em}.instantHead small{font-size:10px;color:#a3bdd2;text-align:right}
.instantGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.instantSlot{display:flex;gap:3px;min-width:0}
.instantTrigger{flex:1;min-width:0;min-height:48px;padding:7px 4px;font-size:11px;line-height:1.15;font-weight:750;background:#195b69 !important;border:2px solid #49b6c0 !important;color:#f6feff !important;white-space:normal;overflow-wrap:anywhere}
.instantSlot.instantPlaying .instantTrigger{background:#167d49 !important;border-color:#4bdc94 !important}
.instantAssign{width:27px;min-width:27px;padding:0;background:#354b63 !important;border:1px solid #6d92b1 !important;color:white !important;font-size:15px}
.instantTrigger:disabled{opacity:.48 !important}
:root[data-theme="light"] .instantEffects{background:#eaf4fb;border-color:#b4cede}
:root[data-theme="light"] .instantHead small{color:#486981}
:root[data-theme="light"] .instantTrigger{background:#d5eef5 !important;color:#155364 !important;border-color:#298ea2 !important}
:root[data-theme="light"] .instantSlot.instantPlaying .instantTrigger{background:#b7edc8 !important;color:#145d37 !important;border-color:#23945c !important}
:root[data-theme="light"] .instantAssign{background:#c4d9ed !important;color:#234760 !important;border-color:#84a8c4 !important}
body.performance .instantAssign{display:none}
@media(max-height:760px) and (orientation:landscape){.instantEffects{padding:7px;gap:5px}.instantTrigger{min-height:40px}.mixer{gap:7px}}

/* Keep master/panic controls reachable on smaller landscape devices. */
.mixer{overflow-y:auto}

/* v0.9.2: horizontal active-channel control strips, landscape-first.
   Retains existing Web Audio controls and native range input behavior. */
.mixer .channelList{display:flex;flex-direction:column;align-items:stretch;overflow-x:hidden;overflow-y:auto;height:clamp(190px,34vh,340px);flex:0 1 auto;padding:6px 0;gap:8px}
.mixer .channelList:has(.empty){height:76px;flex:0 0 76px}
.mixer .channel{flex:0 0 auto;width:100%;max-width:none;min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:11px 12px}
.channelHeader{display:flex;justify-content:space-between;align-items:center;gap:10px;min-width:0}
.channelHeader .channelTitle{height:auto;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:13px}
.channelHeader .channelClock{flex:0 0 auto}
.mixer .channel .meter{width:100%;height:9px}
.channelVolume{display:flex;align-items:center;gap:12px;width:100%;min-width:0}
.mixer .channel .faderArea{width:auto;min-height:0;height:auto;flex:1;min-width:0;display:block}
.mixer .channel .fader{writing-mode:horizontal-tb !important;direction:ltr !important;display:block;width:100%;height:34px;min-height:0;margin:0;cursor:pointer;touch-action:pan-x}
.mixer .channel .fader::-webkit-slider-runnable-track{width:100%;height:8px;background:var(--volume-track);border:1px solid #899aaa;border-radius:12px}
.mixer .channel .fader::-webkit-slider-thumb{margin-top:-9px}
.mixer .channel .percent{flex:0 0 46px;text-align:right;font-weight:750}
.mixer .channelButtons{display:flex;flex-wrap:wrap;gap:6px;width:100%}
.mixer .channelButtons button{flex:1 1 76px;min-width:70px;min-height:40px;padding:7px 5px;font-size:11px;white-space:nowrap}
.mixer .channelButtons .span2{grid-column:auto}
.visuallyHidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (orientation:landscape) and (max-height:760px){.mixer .channelList{height:clamp(190px,32vh,275px)}.mixer .channel{gap:6px;padding:8px 10px}.mixer .channelButtons button{min-height:38px}}

/* v0.9.3 server Sound Library, independent of the live mixer layout */
.libraryBackdrop[hidden]{display:none!important}
.libraryBackdrop{position:fixed;inset:0;background:rgba(4,13,24,.70);z-index:30;display:flex;align-items:center;justify-content:center;padding:12px}
.libraryDialog{width:min(850px,96vw);max-height:min(86dvh,850px);display:flex;flex-direction:column;gap:12px;background:#152234;color:#eef5ff;border:1px solid #59738d;border-radius:14px;padding:18px;box-shadow:0 16px 60px #0008;overflow:hidden}
.libraryHeader{display:flex;justify-content:space-between;align-items:center;gap:10px}.libraryHeader h2{margin:3px 0;font-size:22px}.libraryDialog .hint{margin:0}
.libraryFilters{display:flex;gap:8px;flex-wrap:wrap}.libraryFilters input{flex:1 1 230px;min-width:110px}.libraryFilters input,.libraryFilters select{color:#f5f9fd;background:#23354c;border:1px solid #65809b;border-radius:8px;padding:10px}
.libraryResults{overflow-y:auto;min-height:110px;overscroll-behavior:contain}.libraryItem{padding:12px 2px;border-top:1px solid #3b5067;display:flex;align-items:center;justify-content:space-between;gap:14px}.libraryItemInfo{min-width:0;flex:1}.libraryItemInfo strong{display:block;overflow-wrap:anywhere}.libraryItemInfo small{display:block;margin-top:5px;color:#abc1d3}.libraryItemActions{display:flex;gap:7px;flex-wrap:wrap}.libraryItemActions button{font-size:12px;min-height:42px}.libraryEmpty{color:#b3c3d1;text-align:center;padding:18px}
:root[data-theme="light"] .libraryDialog{background:#fff;color:#172437;border-color:#b5c8d9}:root[data-theme="light"] .libraryFilters input,:root[data-theme="light"] .libraryFilters select{background:#fff;color:#172437;border-color:#aebfd2}:root[data-theme="light"] .libraryItem{border-top-color:#d6e1eb}:root[data-theme="light"] .libraryItemInfo small{color:#52677b}
@media(max-width:650px){.libraryDialog{padding:12px;max-height:94dvh}.libraryItem{align-items:stretch;flex-direction:column;gap:8px}.libraryItemActions button{flex:1}.libraryFilters select{flex:1}}
/* Online library view must hide inactive controls even under flex styles. */
.libraryFilters[hidden],.libraryResults[hidden],#onlineStatus[hidden]{display:none!important}
#onlineResults a{color:#70b5f6;text-decoration:underline}
:root[data-theme="light"] #onlineResults a{color:#1764a6}