/* ==========================================================================
   INSTRUMENT — control room, operator consoles, judging, Hall screens page
   Tools used under pressure. White ground, Manrope, dense, no ornament.
   One solid primary action per panel; everything else is an outline.
   Part 1 styles pages built on this file alone (body.instrument).
   Part 2 re-dresses the existing consoles (body.console-workspace), loaded
   after style.css + design.css, without touching their markup or scripts.
   ========================================================================== */

/* ============================== PART 1 · base ============================ */
body.instrument{margin:0;background:#F6F7F4;color:var(--ink);font:500 15px/1.5 var(--ui);-webkit-font-smoothing:antialiased}
body.instrument *{box-sizing:border-box}
body.instrument h1,body.instrument h2,body.instrument h3{margin:0}
.label,.instrument h3{font:800 11px/1.3 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.hint{margin:6px 0 0;font:500 12.5px/1.45 var(--ui);color:var(--muted)}

/* Buttons */
.btn,:where(body.instrument) :where(button:not(.mode):not(.bare)){font:700 13.5px/1 var(--ui);min-height:40px;padding:0 16px;border-radius:var(--r2);cursor:pointer;
  background:var(--paper);color:var(--ink);border:1.5px solid #CDD3CE;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;
  transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast),box-shadow var(--t-fast)}
.btn:hover,:where(body.instrument) :where(button:not(.mode):not(.bare)):hover{border-color:var(--green-600)}
.btn.primary,body.instrument button.primary,body.instrument .gate button{background:var(--go);border-color:var(--go);color:#fff}
.btn.primary:hover,body.instrument button.primary:hover{background:var(--go-hover)}
.btn.stop,body.instrument button.stop{color:var(--stop);border-color:color-mix(in oklab,var(--stop) 55%,#fff)}
.btn.stop.active{background:var(--stop);color:#fff;border-color:var(--stop)}
.btn.nav{color:var(--nav);border-color:color-mix(in oklab,var(--nav) 35%,#fff)}
.btn.quiet{border-color:transparent;background:transparent;color:var(--muted)}
.btn.big{min-height:60px;font-size:17px;padding:0 26px}
body.instrument button:disabled{background:#fff!important;color:#9AA39D!important;border:1.5px dashed #CCD2CD!important;cursor:not-allowed}
body.instrument :focus-visible{outline:2.5px solid var(--signal);outline-offset:2px}
body.instrument input,body.instrument select,body.instrument textarea{font:500 14px/1.4 var(--ui);color:var(--ink);background:#fff;border:1.5px solid #D6DBD7;border-radius:var(--r1);padding:9px 11px}
body.instrument input:focus,body.instrument select:focus,body.instrument textarea:focus{border-color:var(--green-600);outline:none;box-shadow:0 0 0 3px var(--green-100)}

/* Top bar */
.topbar{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:20px;padding:10px 22px;background:#fff;border-bottom:1px solid var(--line)}
.topbar-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--green-900)}
.topbar-brand img{height:36px;width:auto}
.topbar-brand span{font:700 20px/1.1 var(--display)}
.topbar-brand small{display:block;font:700 10.5px/1.3 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.onair-pill{display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:var(--pill);background:var(--green-50);border:1px solid var(--green-100);font:700 13px/1 var(--ui);color:var(--green-900)}
.onair-pill i{width:10px;height:10px;border-radius:50%;background:var(--signal);box-shadow:0 0 0 4px color-mix(in oklab,var(--signal) 25%,transparent)}
.onair-pill[data-mode="break"],.onair-pill[data-mode="holding"]{background:var(--amber-wash);border-color:#EED9AE;color:var(--amber)}
.topbar-nav{margin-left:auto;display:flex;gap:8px}
.offline{display:none;background:var(--stop-wash);color:var(--stop);padding:8px 22px;font-weight:700;border-bottom:1px solid #EFC9C4}
body[data-connected="0"] .offline{display:block}
.control-error:not(:empty){margin:8px 22px 0;padding:10px 14px;border-radius:var(--r2);background:var(--stop-wash);color:var(--stop);font-weight:700}

/* Gate (sign-in) for instrument pages */
body.instrument .gate{position:fixed;inset:0;z-index:99;display:grid;place-items:center;padding:24px;
  background:radial-gradient(1200px 700px at 50% 30%,var(--green-700),var(--green-950))}
body.instrument .gate form{width:min(400px,100%);background:#fff;border-radius:var(--r3);padding:32px;text-align:center;box-shadow:0 0 0 1.5px var(--gold-500),0 30px 80px #0008}
body.instrument .gate img{width:100%;max-width:280px;margin:0 auto 12px;display:block}
body.instrument .gate h2{font:700 26px/1.2 var(--display);color:var(--green-900)}
body.instrument .gate p{color:var(--muted);font-size:14px;margin:6px 0 16px}
body.instrument .gate .pin-label{display:block;text-align:left;font:700 12px/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
body.instrument .gate input{width:100%;font:800 26px/1 var(--ui);letter-spacing:.4em;text-align:center;padding:14px}
body.instrument .gate button{width:100%;margin-top:14px;min-height:50px;background:var(--go);border-color:var(--go);color:#fff}
body.instrument .gate .err{color:var(--stop);min-height:1.3em;margin-top:8px;font-weight:700;font-size:13px}
body.instrument #modeBanner{position:fixed;left:12px;bottom:12px;z-index:80;padding:6px 10px;border-radius:6px;font:800 10.5px/1 var(--ui);letter-spacing:.12em;text-transform:uppercase;background:var(--gold-100);color:var(--gold-800);border:1px solid #E3D1A6}
body.instrument [data-cloud-signout]{font:700 13px/1 var(--ui);min-height:36px;padding:0 14px;border-radius:var(--r2);background:#fff;color:var(--nav);border:1.5px solid #C9D2E0}

/* Segmented */
.seg{display:inline-flex;gap:0;border:1.5px solid #D6DBD7;border-radius:var(--r2);overflow:hidden;background:#fff}
body.instrument .seg button{border:0!important;border-radius:0!important;min-height:36px!important;background:transparent!important;color:var(--ink-soft)!important}
body.instrument .seg button+button{border-left:1.5px solid #E3E7E3!important}
body.instrument .seg button.on{background:var(--green-700)!important;color:#fff!important}

/* ---------------------------------------------------------- screens strip */
.screens-strip{position:sticky;top:57px;z-index:25;display:grid;grid-template-columns:auto minmax(260px,1fr) auto 176px;gap:16px;align-items:center;
  padding:12px 22px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 6px 18px #0a2a180a}
.strip-modes{display:flex;gap:6px;flex-wrap:wrap}
.mode{font-family:var(--ui);cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:3px;min-height:56px;padding:8px 14px;border-radius:var(--r2);
  background:#fff;border:1.5px solid #D6DBD7;color:var(--ink);text-align:left;transition:background var(--t-fast),border-color var(--t-fast)}
.mode small{font:800 9.5px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.mode b{font:700 15px/1.1 var(--ui);white-space:nowrap}
.mode:hover{border-color:var(--green-600)}
.mode.on{background:var(--green-700);border-color:var(--green-700);color:#fff;box-shadow:inset 0 -3px 0 var(--signal)}
.mode.on small{color:var(--gold-300)}
.split{position:relative;display:flex}
.split>.mode:first-child{border-top-right-radius:0;border-bottom-right-radius:0}
.split>.caret{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0;padding:0 10px;align-items:center;font-size:12px;color:var(--muted)}
.split.on>.caret{background:var(--green-800);border-color:var(--green-700);color:#fff}
.pop{position:absolute;top:calc(100% + 6px);left:0;z-index:40;min-width:260px;background:#fff;border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--shadow-2);padding:10px;display:flex;flex-direction:column;gap:6px}
.pop[hidden]{display:none}
body.instrument .pop>button{justify-content:flex-start;min-height:42px;border-color:transparent;background:transparent}
body.instrument .pop>button:hover{background:var(--green-50)}
.pop-break{width:340px;gap:10px;padding:14px}
.pop-break label{display:flex;flex-direction:column;gap:5px;font:700 11px/1 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pop-break .seg{width:100%}
body.instrument .pop-break .seg button{flex:1}
.strip-message{display:flex;gap:6px;min-width:0}
.strip-message input{flex:1;min-width:0}
.strip-audio{display:flex;gap:8px;align-items:center}
.sound-state{font:700 12.5px/1 var(--ui);padding:9px 11px;border-radius:var(--pill);background:#F1F3F0;color:var(--ink-soft);white-space:nowrap}
.sound-state.ok{background:var(--green-50);color:var(--green-800)}
.sound-state.warn{background:var(--amber-wash);color:var(--amber)}
.strip-monitor{width:176px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:var(--green-950);box-shadow:0 0 0 2px var(--stop)}
.strip-monitor iframe,.cd-mini iframe{width:1920px;height:1080px;border:0;transform:scale(.0917);transform-origin:0 0;pointer-events:none}
.mute-banner{background:var(--stop);color:#fff;padding:9px 22px;font-weight:700}

/* ---------------------------------------------------------- ceremony desk */
.ceremony-desk{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;margin:16px 22px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--shadow-1)}
.ceremony-desk[hidden]{display:none}
.cd-frames{display:grid;grid-template-columns:minmax(0,1.6fr) 1fr;gap:16px;margin:10px 0 14px;align-items:center}
.cd-frames figure{margin:0}
.cd-frames figcaption{font:800 10.5px/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--stop);margin-bottom:6px}
.cd-mini{position:relative;width:100%;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:var(--green-950);box-shadow:0 0 0 2px var(--stop)}
.cd-mini iframe{position:absolute;left:0;top:0;transform-origin:0 0}
.cd-next b{display:block;font:700 22px/1.25 var(--display);color:var(--green-900);margin-top:6px}
.cd-buttons{display:grid;grid-template-columns:1fr 2fr;gap:10px}
.cd-list{list-style:none;margin:0;padding:0;max-height:430px;overflow:auto;border:1px solid var(--line);border-radius:var(--r2)}
body.instrument .cd-list button{width:100%;justify-content:flex-start;border:0;border-bottom:1px solid var(--line-2);border-radius:0;min-height:40px;font-weight:600;font-size:13px}
.cd-list button span{width:26px;color:var(--muted);font-variant-numeric:tabular-nums}
body.instrument .cd-list button.award{padding-left:34px}
body.instrument .cd-list button.category{font-weight:800;color:var(--gold-800)}
body.instrument .cd-list button.current{background:var(--green-700);color:#fff}
body.instrument .cd-list button.current span{color:var(--gold-300)}
.cd-list .pending{padding:10px 14px;font-size:12.5px;color:var(--muted);background:#FAFAF8}

/* ---------------------------------------------------------- console */
.console-tabs{display:flex;gap:6px;align-items:center;padding:14px 22px 0}
body.instrument .console-tabs button{min-height:40px;border-radius:var(--r2) var(--r2) 0 0;border-bottom:0}
body.instrument .console-tabs button.on{background:#fff;border-color:var(--line);color:var(--green-900);box-shadow:inset 0 3px 0 var(--green-700)}
.console-tabs i{width:10px;height:10px;border-radius:50%}
.dot-ladder{background:var(--jannati)}.dot-hadith{background:var(--ahadith)}.dot-bayan{background:var(--bayan)}
.console-hint{margin-left:10px;font:700 12.5px/1 var(--ui);color:var(--amber)}
.category-frame{display:block;width:calc(100% - 44px);margin:0 22px;height:calc(100vh - 190px);min-height:640px;border:1px solid var(--line);border-radius:0 var(--r3) var(--r3) var(--r3);background:#fff}
body.ceremony-on .category-frame{height:520px;min-height:0}

/* ---------------------------------------------------------- settings */
.settings{margin:22px;background:#fff;border:1px solid var(--line);border-radius:var(--r3)}
.settings>summary{cursor:pointer;padding:16px 20px;font:700 15px/1 var(--ui);color:var(--green-900)}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0 20px 20px}
.panel{border:1px solid var(--line);border-radius:var(--r3);padding:18px;display:flex;flex-direction:column;gap:10px}
.panel.wide{grid-column:1/-1}
.panel h2{font:700 20px/1.2 var(--display);color:var(--green-900)}
.panel h3{margin-top:8px}
.check{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.check input{margin-top:3px;width:18px;height:18px;accent-color:var(--green-700)}
.bw{display:grid;grid-template-columns:90px 1fr 1.6fr auto;gap:8px;align-items:center}
.bw b{font-size:13px}
.rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.row-edit{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid var(--line);border-radius:var(--r2);background:#FCFCFA}
.row-head{display:flex;gap:8px;align-items:center}
.row-head .n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:var(--green-50);color:var(--green-800);font:800 12px/1 var(--ui)}
.row-head select{flex:1}
.row-ops{display:flex;gap:4px}
body.instrument .row-ops button{min-height:30px;padding:0 9px}
body.instrument .row-ops button.del{color:var(--stop)}
.row-edit textarea{min-height:64px;resize:vertical}
.rows-actions{grid-column:1/-1;display:flex;gap:8px;align-items:center}
.saved{font:700 12.5px/1 var(--ui);color:var(--green-700)}

@media (max-width:1180px){
  .screens-strip{grid-template-columns:1fr;position:static}
  .strip-monitor{display:none}
  .ceremony-desk{grid-template-columns:1fr}
  .settings-grid{grid-template-columns:1fr}
}

/* ============================ PART 2 · consoles ========================== */
/* The existing operator and judging screens, re-dressed in the instrument
   register. Specific enough to win over design.css without editing it. */
html body.console-workspace{background:#F6F7F4!important;color:var(--ink);font-family:var(--ui)!important;font-size:15px}
html body.console-workspace .bar{background:#fff!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important;padding:10px 22px!important;min-height:0!important}
html body.console-workspace .bar h1{font:700 20px/1.2 var(--display)!important;color:var(--green-900)!important;letter-spacing:0!important}
html body.console-workspace .bar img{height:34px!important}
html body.console-workspace .pane{background:transparent!important;padding:18px 22px!important}
html body.console-workspace .pane.side{background:#FBFBF9!important;border-left:1px solid var(--line)!important}
html body.console-workspace .group{background:#fff!important;border:1px solid var(--line)!important;border-top:1px solid var(--line)!important;border-radius:var(--r3)!important;box-shadow:none!important;padding:16px 18px!important;margin-bottom:14px!important}
html body.console-workspace .group::before,html body.console-workspace .group::after{display:none!important}
html body.console-workspace .group>h3,html body.console-workspace h3{font:800 11px/1.3 var(--ui)!important;letter-spacing:.14em!important;text-transform:uppercase!important;color:var(--muted)!important;margin:0 0 12px!important}
html body.console-workspace .kv>div{border-color:var(--line-2)!important}
html body.console-workspace .kv span:first-child{color:var(--muted)!important}
html body.console-workspace .kv span:last-child{font-weight:700;color:var(--ink)!important}

/* Buttons: outline by default, one solid primary, destructive outlined */
html body.console-workspace button:not(.record-link):not(.uncoloured){background:#fff!important;color:var(--ink)!important;border:1.5px solid #CDD3CE!important;
  border-radius:var(--r2)!important;font:700 14px/1.1 var(--ui)!important;min-height:44px!important;box-shadow:none!important;text-transform:none!important;letter-spacing:0!important}
html body.console-workspace button:not(.record-link):not(.uncoloured):hover:not(:disabled){border-color:var(--green-600)!important;background:var(--green-50)!important}
html body.console-workspace button.primary:not(:disabled),html body.console-workspace button.gold:not(:disabled),
html body.console-workspace #b-tstart:not(:disabled),html body.console-workspace #b-score:not(:disabled),html body.console-workspace #b-verify:not(:disabled){
  background:var(--go)!important;border-color:var(--go)!important;color:#fff!important}
html body.console-workspace button.primary:hover:not(:disabled){background:var(--go-hover)!important}
html body.console-workspace button.danger:not(:disabled),html body.console-workspace #b-treset:not(:disabled),html body.console-workspace #b-abandon:not(:disabled),
html body.console-workspace #b-end:not(:disabled),html body.console-workspace #b-clear:not(:disabled),html body.console-workspace [id*="undo"]:not(:disabled),
html body.console-workspace [id*="reset"]:not(:disabled){background:#fff!important;color:var(--stop)!important;border-color:color-mix(in oklab,var(--stop) 50%,#fff)!important}
html body.console-workspace button.danger:hover:not(:disabled){background:var(--stop-wash)!important}
html body.console-workspace button:not(.record-link):not(.uncoloured):disabled{background:#fff!important;color:#A0A8A2!important;border:1.5px dashed #CDD3CE!important;opacity:1!important;cursor:not-allowed}

/* Judge signals: filled, with a glyph and a word — never pastel */
html body.console-workspace .signals button{min-height:68px!important;font-size:16px!important;border:0!important;color:#fff!important}
html body.console-workspace .signals button.sig-green{background:#1F7A4B!important}
html body.console-workspace .signals button.sig-red{background:#A3322B!important}
html body.console-workspace .signals button.sig-amber{background:#8A5A06!important}
html body.console-workspace .signals button.sig-blue{background:#1F3B63!important}
html body.console-workspace .signals button.sig-green::before{content:"✓  "}
html body.console-workspace .signals button.sig-red::before{content:"✕  "}
html body.console-workspace .signals button.sig-amber::before{content:"…  "}
html body.console-workspace .signals button.sig-blue::before{content:"!  "}
html body.console-workspace .signals button:not(.record-link):not(.uncoloured):disabled{background:#fff!important;color:#A0A8A2!important;border:1.5px dashed #CDD3CE!important}
html body.console-workspace .signals button:disabled::before{content:""}

/* Phase stepper */
html body.console-workspace .track{gap:6px!important}
html body.console-workspace .track>*{border-radius:var(--pill)!important;font:700 12px/1 var(--ui)!important;letter-spacing:.04em!important;border:1px solid var(--line)!important;background:#fff!important;color:var(--muted)!important;padding:9px 12px!important}
html body.console-workspace .track>.done{background:var(--green-50)!important;color:var(--green-800)!important;border-color:var(--green-100)!important}
html body.console-workspace .track>.now,html body.console-workspace .track>.active,html body.console-workspace .track>.current{background:var(--green-700)!important;color:#fff!important;border-color:var(--green-700)!important}

/* Inputs */
html body.console-workspace input,html body.console-workspace select,html body.console-workspace textarea{font-family:var(--ui)!important;border:1.5px solid #D6DBD7!important;border-radius:var(--r1)!important;background:#fff!important}
html body.console-workspace .chips span,html body.console-workspace .chip{border-radius:var(--pill)!important;font-family:var(--ui)!important}

/* Confidential answer panel */
html body.console-workspace [class*="answer"][class*="confidential"],html body.console-workspace .confidential{border:1.5px dashed var(--gold-500)!important;background:var(--gold-50)!important}

/* Numbers */
html body.console-workspace #clock,html body.console-workspace .total,html body.console-workspace [id$="clock"]{font-family:var(--ui)!important;font-weight:800!important;font-variant-numeric:tabular-nums lining-nums}

/* Rehearsal marker: a small tag, not a bar */
html body.console-workspace #modeBanner{position:fixed!important;left:12px!important;bottom:12px!important;top:auto!important;right:auto!important;width:auto!important;z-index:80;
  padding:6px 10px!important;border-radius:6px!important;font:800 10.5px/1 var(--ui)!important;letter-spacing:.12em!important;background:var(--gold-100)!important;color:var(--gold-800)!important;border:1px solid #E3D1A6!important}
html body.console-workspace:has(#modeBanner){padding-top:0!important}
html body.console-workspace .bar nav a.home-link,html body.console-workspace .bar a.home-link{background:#fff!important;color:var(--nav)!important;border:1.5px solid #C9D2E0!important;box-shadow:none!important;min-height:38px!important;padding:8px 14px!important}
html body.console-workspace [data-cloud-signout]{background:#fff!important;color:var(--nav)!important;border:1.5px solid #C9D2E0!important}

/* ============================ PART 3 · polish ============================ */
/* Page atmosphere: a whisper of warmth at the top, the gold leaf under the bar. */
body.instrument{background:linear-gradient(180deg,#FBFAF6 0,#F5F6F2 320px) fixed}
.topbar{border-bottom:0;box-shadow:0 1px 0 var(--line)}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gold-leaf);opacity:.85}
.topbar-brand img{height:40px}
.topbar-brand span{font-size:22px}
.onair-pill{background:#fff;border:1.5px solid var(--green-100);box-shadow:var(--shadow-1)}
.onair-pill[data-mode="ceremony"]{border-color:#EADCB8;background:var(--gold-50);color:var(--gold-800)}
.onair-pill[data-mode="finished"]{border-color:#CCDAF2;background:var(--jannati-tint);color:var(--jannati)}
.topbar #modeBanner{position:static!important;padding:7px 10px!important;border-radius:999px!important}

/* The strip reads as one instrument panel */
.screens-strip{top:62px;margin:16px 22px 0;border:1px solid var(--line);border-radius:var(--r3);box-shadow:var(--shadow-1);padding:12px 14px}
.strip-modes{gap:8px}
.mode{border-radius:12px;min-height:60px;padding:9px 16px;box-shadow:0 1px 0 #0a2a180a}
.mode[data-mode="live"]{border-left:4px solid var(--jannati)}
.mode[data-mode="break"]{border-left:4px solid var(--gold-500)}
.mode[data-mode="ceremony"]{border-left:4px solid var(--gold-700)}
.mode[data-mode="holding"],.mode[data-mode="finished"]{border-left:4px solid var(--green-600)}
.mode.on{background:linear-gradient(180deg,var(--green-600),var(--green-700));border-color:var(--green-700);border-left-color:var(--gold-300)}
.strip-monitor{box-shadow:0 0 0 2px var(--gold-500),0 8px 20px #0a2a1820;position:relative}
.strip-monitor::after{content:"ON SCREEN";position:absolute;left:6px;top:6px;font:800 8px/1 var(--ui);letter-spacing:.14em;color:#fff;background:var(--stop);padding:3px 5px;border-radius:3px}
.strip-message input{border-radius:var(--pill);padding-left:16px}

/* Console tabs sit on the page like folder tabs, coloured by category */
.console-tabs{padding-top:22px}
body.instrument .console-tabs button{font-size:14px;padding:0 18px;min-height:44px;background:transparent;border-color:transparent}
body.instrument .console-tabs button.on{background:#fff;border-color:var(--line)}
body.instrument .console-tabs button[data-category="ladder"].on{box-shadow:inset 0 3px 0 var(--jannati);color:var(--jannati)}
body.instrument .console-tabs button[data-category="hadith"].on{box-shadow:inset 0 3px 0 var(--gold-500);color:var(--gold-800)}
body.instrument .console-tabs button[data-category="bayan"].on{box-shadow:inset 0 3px 0 var(--green-700);color:var(--green-800)}
.category-frame{box-shadow:var(--shadow-1)}
.settings{box-shadow:var(--shadow-1)}
.settings>summary{list-style:none;display:flex;align-items:center;gap:10px}
.settings>summary::before{content:"";width:8px;height:8px;border-right:2px solid var(--gold-700);border-bottom:2px solid var(--gold-700);transform:rotate(-45deg);transition:transform var(--t-fast)}
.settings[open]>summary::before{transform:rotate(45deg)}
.ceremony-desk{border-top:4px solid var(--gold-500)}
.cd-next b{font-size:26px}

/* Consoles: calmer surfaces, category-coloured edges, legible question card */
html body.console-workspace .shell{background:transparent!important}
html body.console-workspace.category-hadith .group{border-left:3px solid var(--gold-500)!important}
html body.console-workspace.category-bayan .group{border-left:3px solid var(--green-600)!important}
html body.console-workspace:not(.category-hadith):not(.category-bayan) .group{border-left:3px solid var(--jannati)!important}
html body.console-workspace .card{background:#fff!important;border:1.5px dashed #D8C79D!important;border-left:1.5px dashed #D8C79D!important;border-radius:var(--r2)!important;box-shadow:none!important;padding:16px 18px!important}
html body.console-workspace .card .q{font:600 22px/1.35 var(--display)!important;color:var(--green-900)!important}
html body.console-workspace .card .kv span{font-family:var(--ui)!important}
html body.console-workspace .pane.side .group{border-left-width:1px!important}
html body.console-workspace .blocked:not(:empty){background:var(--stop-wash)!important;color:var(--stop)!important;border:0!important;border-radius:var(--r2)!important;font-weight:700!important}
html body.console-workspace .notice,html body.console-workspace .status{font-family:var(--ui)!important}
.strip-modes{flex-wrap:nowrap}
.mode{padding:8px 12px}
.screens-strip{grid-template-columns:auto minmax(170px,1fr) auto 150px;gap:12px}
.topbar #modeBanner{max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1280px){.strip-modes{flex-wrap:wrap}}
.strip-monitor{width:100%}
