/* Duel Circle host presentation system. Existing ids and handlers remain the
   behavioral source of truth; this file owns the whole host visual contract. */
.host-ui {
  --bg:#08111d;--rail:rgba(7,14,24,.84);--surface:rgba(13,25,39,.64);--surface2:rgba(28,49,70,.62);
  --text:#edf4ff;--muted:#91a2b8;--line:rgba(137,165,196,.22);--accent:#d3ab55;
  --accent-ink:#171106;--good:#65c995;--bad:#e47b72;--info:#70aee5;
  --gold:var(--accent);--gold2:#eccb7e;--gold-dim:#a68130;
  --green:var(--good);--red:var(--bad);--blue:var(--info);
  --panel:var(--surface);--panel2:var(--surface2);--border:var(--line);--ink:var(--text);
  margin:0;min-height:100vh;padding:44px 40px 72px 268px;overflow-x:clip;
  color:var(--text);background:
    linear-gradient(rgba(5,11,20,.66),rgba(5,11,20,.88)),
    url('main-bg.jpg') center/cover fixed,
    var(--bg);
  font:400 16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.retired-presentation{visibility:hidden!important}
.host-ui *,.host-ui *::before,.host-ui *::after,.launcher-ui *,.launcher-ui *::before,.launcher-ui *::after{box-sizing:border-box}
.host-ui [hidden]{display:none!important}
.host-ui ::selection,.launcher-ui ::selection{color:var(--accent-ink);background:var(--accent)}
.host-ui :where(h1,h2,h3,p){margin-top:0}
.host-ui :where(h1,h2,h3,button,input,select,textarea,.num,.opp,.idle-name){font-family:inherit!important}
.host-ui :where(.eyebrow,.source-label,.su-title,.tw-kicker,.nowlbl,.lbl){letter-spacing:0!important;text-transform:none!important}
.host-ui h1{font-size:clamp(36px,5vw,52px);line-height:1.05}
.host-ui h2{font-size:clamp(24px,3vw,30px);line-height:1.2}
.host-ui h3{font-size:19px;line-height:1.35}
.host-ui :where(h1,h2,h3,strong,b){font-weight:600}
.host-ui :where(.hint,.sub,.muted,small){color:var(--muted);font-size:14px;line-height:1.5}
.host-ui :where(a:any-link){color:inherit;text-decoration-color:color-mix(in srgb,currentColor 48%,transparent);text-underline-offset:.22em}
.host-ui :where(a:any-link:hover){color:var(--gold2);text-decoration-color:currentColor}
.host-ui :where(a:any-link,button,input,select,textarea,summary):focus-visible,.launcher-ui :where(a:any-link,button,input,select,textarea,summary):focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.host-ui :where(button,input,select,textarea),.launcher-ui :where(button,input,select,textarea){font:inherit}

/* Controls */
.host-ui button,.host-ui a.button,.host-ui a.gl-btn,.host-ui a[role="button"]{
  min-height:44px;padding:10px 17px;border:1px solid var(--accent);border-radius:8px;
  color:var(--accent-ink);background:var(--accent);box-shadow:none;font-size:15px;
  font-weight:600;letter-spacing:0;line-height:1.45;text-align:center;text-decoration:none;
  text-transform:none;transition:background-color .14s,border-color .14s,color .14s,transform .14s
}
.host-ui button:hover:not(:disabled),.host-ui a.button:hover,.host-ui a.gl-btn:hover{filter:none;background:#e2b84f}
.host-ui button:active:not(:disabled){transform:translateY(1px)}
.host-ui :where(button.ghost,a.ghost,.ghost[role="button"],button.small,a.button.ghost){border-color:var(--line);color:var(--text);background:transparent}
.host-ui :where(button.ghost,a.ghost,button.small,a.button.ghost):hover:not(:disabled){border-color:#596873;color:var(--text);background:var(--surface2)}
.host-ui button.small,.host-ui .topnav button{min-height:44px;padding:9px 12px;font-size:14px}
.host-ui button.danger{border-color:#714247;color:#ffd2ce;background:#3b2227}
.host-ui button:disabled{border-color:#303943;color:#737e86;background:#1a2025;cursor:not-allowed;opacity:1}
.host-ui button.linkbtn{min-height:44px;padding-inline:4px;border-color:transparent;color:var(--gold2);background:transparent;text-decoration:underline;text-underline-offset:4px}
.host-ui :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){width:100%;min-height:48px;padding:11px 13px;border:1px solid #46535d;border-radius:8px;color:var(--text);background-color:#11171c;box-shadow:none;outline:none;font-size:16px}
.host-ui :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea):hover:not(:disabled){border-color:#687985}
.host-ui :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea):focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(214,168,62,.16)}
.host-ui :where(input,select,textarea):disabled{color:#747f86;background-color:#171d22;cursor:not-allowed}
.host-ui :where(input[type="checkbox"],input[type="radio"]){width:20px;height:20px;flex:0 0 20px;accent-color:var(--accent)}
.host-ui :where(label,.field>label){color:#c9d0d4;font-size:15px;font-weight:500}
.host-ui .checkline{min-height:44px;gap:10px;font-size:16px}

/* Page heading */
.host-ui>.header-art{display:none}
.host-ui>h1{display:block;width:min(1080px,100%);margin:0 auto 12px;color:var(--text);background:none;filter:none;font-family:Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:-.025em;text-align:left;text-transform:none}
.host-ui>h1::before,.host-ui>h1::after{content:none}
.host-ui>.tagline{display:block;width:min(1080px,100%);margin:0 auto 9px;color:var(--muted);font-size:16px;font-weight:400;letter-spacing:0;text-align:left;text-indent:0;text-transform:none}
.host-ui>.tagline::before,.host-ui>.tagline::after{content:none}
.host-ui>.sub{width:min(1080px,100%);margin:0 auto 38px;color:var(--muted);font-size:16px;line-height:1.6;text-align:left}
.host-ui>.host-heading{display:block;width:min(1080px,100%);margin:0 auto 36px;text-align:left}.host-ui>.host-heading h1{display:block;margin:0 0 11px;color:var(--text);background:none;filter:none;font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,4vw,46px);font-weight:500;letter-spacing:-.025em;text-align:left;text-transform:none}.host-ui>.host-heading h1::before,.host-ui>.host-heading h1::after{content:none}.host-ui>.host-heading .tagline{display:block;margin:0 0 10px;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:1.35px!important;text-align:left;text-indent:0;text-transform:uppercase!important}.host-ui>.host-heading .tagline::before,.host-ui>.host-heading .tagline::after{content:none}.host-ui>.host-heading .sub{margin:0;color:var(--muted);font-size:15px;line-height:1.6;text-align:left}
.host-ui>header.hero,.host-ui>header.lockup{display:block;width:min(1080px,100%);margin:0 auto 36px;padding:0;text-align:left}.host-ui>header.hero .header-art,.host-ui>header.lockup .header-art{display:none}.host-ui>header.hero h1,.host-ui>header.lockup h1{display:block;margin:0 0 11px;color:var(--text);background:none;filter:none;font-size:clamp(34px,4vw,46px);font-weight:500;letter-spacing:-.025em;text-align:left;text-transform:none}.host-ui>header.hero h1::before,.host-ui>header.hero h1::after,.host-ui>header.lockup h1::before,.host-ui>header.lockup h1::after{content:none}.host-ui>header.hero .tagline,.host-ui>header.lockup .tagline{display:block;margin:0 0 10px;color:var(--accent);font-size:11px;font-weight:700;letter-spacing:1.35px!important;text-align:left;text-indent:0;text-transform:uppercase!important}.host-ui>header.hero .tagline::before,.host-ui>header.hero .tagline::after,.host-ui>header.lockup .tagline::before,.host-ui>header.lockup .tagline::after{content:none}.host-ui>header.hero .sub,.host-ui>header.lockup .sub{margin:0;color:var(--muted);font-size:15px;line-height:1.6;text-align:left}

/* Persistent desktop rail */
.host-ui .topnav{position:fixed;z-index:80;inset:0 auto 0 0;display:flex;width:228px;max-width:none;height:100vh;min-height:0;margin:0;padding:24px 16px;flex-flow:column nowrap;align-items:stretch;gap:18px;overflow-y:auto;border:0;border-right:1px solid var(--line);border-radius:0;background:var(--rail);box-shadow:12px 0 38px rgba(0,0,0,.18);backdrop-filter:blur(18px)}
.host-ui .nav-lockup{display:flex;min-height:44px;padding:4px 8px;align-items:center;gap:11px;border-radius:8px;text-decoration:none}
.host-ui .nav-lockup img{width:34px;height:34px}.host-ui .nav-lockup span{color:var(--text);font-family:Georgia,"Times New Roman",serif;font-size:18px;font-weight:600;letter-spacing:0;text-transform:none}
.host-ui .nav-tabs{display:grid;width:100%;gap:4px}
.host-ui .nav-tabs a{display:flex;min-height:46px;padding:10px 12px;align-items:center;border-radius:8px;color:var(--muted);font-size:16px;font-weight:400;letter-spacing:0;line-height:1.4;text-align:left;text-decoration:none;text-transform:none}
.host-ui .nav-tabs a:hover{color:var(--text);background:rgba(112,174,229,.08)}
.host-ui .nav-tabs a.on,.host-ui .nav-tabs a[aria-current="page"]{color:var(--text);background:rgba(112,174,229,.12);box-shadow:inset 3px 0 var(--accent)}
.host-ui .nav-gear{order:3;display:flex;width:100%;min-height:46px;padding:10px 12px;align-items:center;justify-content:flex-start;border-color:transparent;color:var(--muted);background:transparent}
.host-ui .nav-gear{gap:10px}.host-ui .nav-gear>span{font-size:18px;line-height:1}.host-ui .nav-gear::after{content:"More"}
.host-ui .nav-gear:hover,.host-ui .nav-gear.on,.host-ui .nav-gear[aria-expanded="true"]{border-color:transparent;color:var(--text);background:var(--surface2)}
.host-ui .nav-me{order:4;display:grid;min-width:0;margin:auto 0 0;padding:14px 8px 0;gap:8px;border-top:1px solid var(--line)}
.host-ui .nav-me[hidden],.host-ui .nav-me>[hidden]{display:none}.host-ui .nav-who{display:flex;min-width:0;overflow:hidden;flex-direction:column;align-items:flex-start;gap:5px;color:var(--muted);font-size:14px;line-height:1.4;text-overflow:ellipsis;white-space:normal}
.host-ui .nav-identity{display:inline-flex;min-width:0;max-width:100%;align-items:center;gap:5px;white-space:nowrap}
.host-ui .nav-identity b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.host-ui .nav-divider{display:none}
.host-ui .nav-provider-icon{display:block;width:15px;height:15px;flex:0 0 15px;color:var(--gold2)}
.host-ui .nav-identity-twitch .nav-provider-icon{color:#a970ff}
.host-ui .nav-identity-hive .nav-provider-icon{color:#78d4b4}
.host-ui .nav-who b{display:block;color:var(--text);font-size:15px}.host-ui .nav-signin,.host-ui .nav-link,.host-ui .nav-signout{width:100%;min-height:44px;font-size:14px}
.host-ui .nav-status{order:5;display:grid;width:100%;margin:0;gap:6px}.host-ui .nav-status .badge{display:none!important}.host-ui .nav-status:empty{display:none}.host-ui .nav-status button{width:100%}.host-ui #displayOpenBtn{border-color:var(--line);color:var(--text);background:transparent}
.host-ui .gear-drawer{position:fixed;inset:0;z-index:120}.host-ui .gear-drawer[hidden]{display:none}.host-ui .gear-scrim{position:absolute;inset:0;background:rgba(4,7,9,.66)}
.host-ui .gear-pane{position:absolute;inset:0 auto 0 228px;display:flex;width:min(410px,calc(100vw - 228px));padding:26px;flex-direction:column;gap:10px;overflow:auto;border:0;border-right:1px solid var(--line);color:var(--text);background:var(--surface);box-shadow:18px 0 48px rgba(0,0,0,.34)}
.host-ui .gear-head{display:flex;min-height:48px;align-items:center;justify-content:space-between;margin-bottom:4px}.host-ui .gear-head b{color:var(--text);font-size:24px;font-weight:500;letter-spacing:-.02em;text-transform:none}
.host-ui .gear-close{width:44px;height:44px;padding:0;border-color:var(--line);color:var(--text);background:transparent}.host-ui .gear-hint{margin:0 0 8px;color:var(--muted);font-size:14px}
.host-ui .gear-link{display:block;min-height:62px;padding:11px 12px;border:0;border-radius:8px;color:inherit;background:transparent;text-decoration:none}.host-ui .gear-link:hover{color:inherit;background:var(--surface2)}
.host-ui .gear-link b{display:block;color:var(--text);font-size:16px;font-weight:500;letter-spacing:0;text-transform:none}.host-ui .gear-link span{display:block;margin-top:2px;color:var(--muted);font-size:14px;line-height:1.4}
.host-ui .gear-circle{width:100%}.host-ui .gear-tabs{position:static;display:grid;width:100%;margin:6px 0 12px;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.host-ui .gear-tabs button{border-color:var(--line);color:var(--muted);background:transparent}.host-ui .gear-tabs button.on{border-color:var(--accent);color:var(--text);background:var(--surface2)}.host-ui .gear-sec{padding:18px 0;border-top:1px solid var(--line);background:transparent}.host-ui .gear-sec h3{margin:0 0 8px;color:var(--text);font-size:18px;font-weight:500;letter-spacing:0;text-transform:none}
.host-ui .gear-pane.gear-pane-wide{width:min(720px,calc(100vw - 260px))}
.host-ui .gear-spotlight{display:block;padding:16px;border:1px solid rgba(112,174,229,.42);border-radius:10px;background:rgba(22,48,72,.42)}
.host-ui .gear-spotlight h3{margin-bottom:4px;color:var(--text);font-size:19px}
.host-ui .gear-spotlight p{margin:0 0 12px;color:var(--muted);font-size:14px;line-height:1.5}
.host-ui .gear-spotlight a{display:flex;min-height:48px;padding:10px 14px;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--accent);border-radius:8px;color:var(--accent-ink);background:var(--accent);font-weight:600;text-decoration:none}
.host-ui .gear-spotlight a:hover{color:var(--accent-ink);background:#e2b84f}
.host-ui .gear-pane-wide #presetBox .row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.host-ui .gear-pane-wide #presetBox .row button{width:100%}
.host-ui .gear-pane-wide #gearSlotPrizes{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
.host-ui .gear-prizes-link{display:block;padding:16px;border:1px solid var(--line);border-radius:10px;background:rgba(13,25,39,.48)}
.host-ui .gear-prizes-link h3{margin-bottom:4px;color:var(--text);font-size:19px}
.host-ui .gear-prizes-link p{margin:0 0 12px;color:var(--muted);font-size:14px;line-height:1.5}
.host-ui .gear-prizes-link a{display:flex;min-height:48px;padding:10px 14px;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:rgba(8,17,29,.48);font-weight:600;text-decoration:none}
.host-ui .gear-prizes-link a:hover{border-color:rgba(112,174,229,.42);background:rgba(112,174,229,.1)}

/* Control-console content grammar */
.host-ui :where(.wrap,.layout,.flow,.eventbar,.handoff,.quick-path,.private-bar){width:min(1080px,100%);max-width:none;margin-inline:auto}
.host-ui :where(.panel,.stage,.eventbar,.flow-step,.prize-link,.handoff,.current,.medallions){border-radius:11px}
.host-ui .panel{padding:22px;border:1px solid var(--line);background:var(--surface);box-shadow:inset 0 1px rgba(255,255,255,.055),0 16px 38px rgba(0,0,0,.18);backdrop-filter:blur(11px) saturate(128%);-webkit-backdrop-filter:blur(11px) saturate(128%)}.host-ui .panel+.panel{margin-top:16px}
.host-ui .panel h2{margin-bottom:16px;padding:0;border:0;color:var(--text);font-family:Georgia,"Times New Roman",serif!important;font-size:23px;font-weight:500;letter-spacing:-.015em;text-transform:none}.host-ui .panel h3{color:var(--text)}
.host-ui :where(.notice,.setup-rule,.recipient,.private-bar){border-radius:8px}.host-ui details>summary{min-height:44px;padding:10px 0;color:var(--muted);font-size:15px;font-weight:500;cursor:pointer}
.host-ui :where(.row,.actions){gap:10px}

/* Set up */
.host-ui.setup :is(h1,.tagline,.sub) .room-circle,.host-ui.setup :is(h1,.tagline,.sub) .room-tonight,.host-ui.prepare :is(h1,.tagline,.sub) .room-circle,.host-ui.prepare :is(h1,.tagline,.sub) .room-setup,.host-ui:not(.setup):not(.prepare) :is(h1,.tagline,.sub) .room-setup,.host-ui:not(.setup):not(.prepare) :is(h1,.tagline,.sub) .room-tonight{display:none}
.host-ui.setup .sudoor{width:min(780px,100%);max-width:none;margin:0 auto;padding:28px;border:0;border-radius:10px;background:var(--surface);box-shadow:none}
.host-ui.setup .su-head{margin-bottom:8px}.host-ui.setup .su-title{color:var(--text);font-size:24px;font-weight:500;letter-spacing:-.02em;text-transform:none}.host-ui.setup .su-count{color:var(--muted);font-size:14px}
.host-ui.setup .su-intro{margin:6px 0 18px;color:var(--muted);font-size:16px}.host-ui.setup .setup-output{margin:0 0 22px}.host-ui.setup .setup-output>.panel{margin:0}.host-ui.setup .su-step{display:none}.host-ui.setup .su-step[hidden]{display:none!important}
.host-ui.setup .su-step.done,.host-ui.setup .su-step.active,.host-ui.setup .su-step.pending-later{display:grid}.host-ui.setup .su-step.active{margin:8px 0;padding:18px 0;border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:transparent;box-shadow:none}
.host-ui.setup .su-step.pending-later{border:0;background:transparent;opacity:.62}.host-ui.setup .su-step:not(.active) .su-sub,.host-ui.setup .su-step:not(.active) .su-body{display:none}.host-ui.setup .su-step.done{min-height:54px;padding-block:7px;background:transparent}.host-ui.setup .su-step.done .su-act button{min-height:44px}
.host-ui.setup .setup-optional{margin-top:18px;border-top:1px solid var(--line)}.host-ui.setup .setup-optional-links{display:flex;padding:8px 0;align-items:center;gap:8px 18px;flex-wrap:wrap;font-size:15px}
.host-ui.setup:not(.setup-advanced) .account-advanced{display:none}.host-ui.setup .su-foot{gap:12px}.host-ui.setup :where(.su-guide,a.ghost){display:inline-flex;min-height:44px;padding:9px 12px;align-items:center;border:1px solid var(--line);border-radius:8px;font-size:14px;text-decoration:none}

/* Tonight */
.host-ui.prepare .tonight-overview{order:1;width:min(780px,100%);margin:0 auto 18px;padding:28px;border:0;border-radius:10px;background:var(--surface);box-shadow:none}
.tonight-overview-head,.tonight-row,.tonight-row>div{display:flex}.tonight-overview-head{align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}
.tonight-overview-head h2{margin:3px 0 0;color:var(--text);font:500 28px/1.2 inherit;letter-spacing:-.02em}.host-ui .tonight-overview .su-title,.host-ui .source-label{color:var(--muted);font-size:14px;font-weight:500;letter-spacing:0;text-transform:none}
.host-ui .tonight-overview .badge{padding:3px 0;border:0;color:var(--good);background:transparent;font-size:14px}.tonight-rows{border-top:1px solid var(--line)}
.tonight-row{min-height:72px;padding:12px 0;align-items:center;gap:16px;border-bottom:1px solid var(--line)}.tonight-row[hidden],.tonight-add-prizes[hidden],.wheel-waiting-links[hidden]{display:none!important}
.tonight-row>div{flex:1;min-width:0;flex-direction:column;gap:2px}.tonight-row b{color:var(--text);font-size:16px}.tonight-row span{overflow:hidden;color:var(--muted);font-size:15px;line-height:1.4;text-overflow:ellipsis}
.tonight-row.attention{margin:8px 0;padding:13px;border:0;border-left:3px solid var(--accent);border-radius:0;background:rgba(214,168,62,.08)}
.host-ui.prepare .tonight-add-prizes{min-height:44px;margin-top:8px;padding:8px 0;border:0;color:var(--muted);background:transparent}.host-ui.prepare .wrap,.host-ui.prepare #preList{display:none}
.host-ui.prepare .nightbar,.host-ui.prepare.twitch-ok .twitch-connect{display:none}.host-ui.prepare.editing-rules .wrap,.host-ui.prepare.editing-prizes .wrap{display:grid;order:2}
.host-ui.prepare.editing-rules #prizePanel,.host-ui.prepare.editing-prizes #rulesPanel{display:none}.host-ui.prepare.editing-checklist #preList{display:block;order:2}
.host-ui.prepare:is(.editing-rules,.editing-prizes,.editing-checklist) .tonight-overview{display:none}.tonight-editor-close{float:right;margin:-4px 0 12px 12px}
.host-ui.prepare :where(#rulesPanel,#prizePanel,#preList){scroll-margin-top:24px}.host-ui.prepare.editing-rules #rulesPanel .hint{display:none}.host-ui.prepare.editing-rules #rulesPanel .hint:is(#feeNote,#rulesetHint,#menuHint,#rulesUrlHint,#presetHint){display:block}
.host-ui.prepare .golive{width:min(780px,100%);margin-inline:auto;padding:18px 0;border:0;background:transparent;box-shadow:none}.host-ui.prepare .golive .gl-btn{min-width:190px;padding:12px 20px}.tonight-row-actions{display:flex;flex:0 0 auto;gap:8px}.tonight-row-actions [hidden]{display:none!important}

/* Wheel Scene and optional Arena setup */
.host-ui #wheelLinkBox{padding:28px;border:0;border-radius:10px;background:var(--surface)}.host-ui .obs-guide{margin-top:18px;border-top:1px solid var(--line)}
.host-ui .obs-task{display:grid;grid-template-columns:32px minmax(0,1fr) auto;min-height:74px;padding:14px 0;align-items:center;gap:14px;border-bottom:1px solid var(--line);opacity:.5}
.host-ui .obs-task.active{margin:0;padding:18px 0;border:0;border-bottom:1px solid var(--line);background:transparent;opacity:1}.host-ui .obs-task.done{opacity:.78}
.host-ui .obs-task-number{display:grid;width:30px;height:30px;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--muted);font-size:14px;font-weight:600}.host-ui .obs-task.done .obs-task-number{border-color:var(--good);color:var(--good);font-size:0}.host-ui .obs-task.done .obs-task-number::before{content:"✓";font-size:15px}
.host-ui .obs-task>div{display:flex;min-width:0;flex-direction:column;gap:3px}.host-ui .obs-task>div>b{font-size:16px}.host-ui .obs-task>div>span{color:var(--muted);font-size:15px;line-height:1.45}
.host-ui .obs-url-row{display:none;margin-top:9px}.host-ui .obs-task.active .obs-url-row,.host-ui .obs-task.done .obs-url-row{display:flex}.host-ui .obs-task.done>button{border-color:transparent;color:var(--good);background:transparent}.host-ui .quiet-details{margin-top:12px}
.overlay-setup:not(.arena-aligning) .wrap{grid-template-columns:minmax(0,820px);justify-content:center}.overlay-setup:not(.arena-open) .arena-config{display:none}
.overlay-setup .arena-toggle{width:min(820px,100%);margin:18px auto 0;padding:8px 20px;border:1px solid var(--line);border-radius:8px;background:transparent}.overlay-setup .arena-toggle .hint{margin-top:8px}
.overlay-setup.arena-open:not(.arena-aligning) #arenaAlignPanel,.overlay-setup.arena-open:not(.arena-aligning) .preview-col{display:none}.overlay-setup.arena-aligning #arenaSourcePanel{display:none}

/* Circle rebuild: the duel engine still owns every id and state transition, but
   the host surface is composed as one stage with one control column. */
.host-ui:not(.prepare):not(.setup) .nightbar:not(.live){display:none}.host-ui:not(.setup) .twitch-connect{display:none!important}.host-ui:not(.prepare):not(.setup) .twitch-connect{max-width:1160px;margin:0 auto 18px}
.host-ui:is(.circle-idle,.circle-ready) #nightBar:not(.live),.host-ui.circle-idle #medStrip,.host-ui.circle-idle #startBtn,.host-ui.circle-active #startBtn,.host-ui.circle-held #startBtn{display:none!important}
.circle-redesign:not(.prepare):not(.setup){
  --bg:#f6f5ed;--rail:#efefe4;--surface:#fffef8;--surface2:#e9eddf;
  --text:#2b3e32;--muted:#7d8375;--line:#dfe3d4;--accent:#426549;
  --accent-ink:#fffef1;--good:#648651;--bad:#a65c4f;--info:#668478;
  --gold:#708552;--gold2:#426549;--gold-dim:#8d986f;
  padding:34px 38px 64px 268px;color:var(--text);
  background:radial-gradient(circle at 68% 9%,rgba(219,231,164,.34),transparent 31rem),var(--bg);
}
.circle-redesign:not(.prepare):not(.setup) .topnav{width:228px;padding:25px 17px;border-color:#dcdfd1;background:var(--rail)}
.circle-redesign:not(.prepare):not(.setup) .nav-lockup{padding-inline:7px}.circle-redesign:not(.prepare):not(.setup) .nav-lockup span{font-family:Georgia,"Times New Roman",serif;font-size:18px;color:#304b37}
.circle-redesign:not(.prepare):not(.setup) .nav-tabs a{min-height:46px;padding:9px 11px;color:#7a8173;font-size:14px;font-weight:550}
.circle-redesign:not(.prepare):not(.setup) .nav-tabs a:hover{color:var(--text);background:#e5e8da}
.circle-redesign:not(.prepare):not(.setup) .nav-tabs a.on,.circle-redesign:not(.prepare):not(.setup) .nav-tabs a[aria-current="page"]{color:#36533c;background:#e1e8d3;box-shadow:inset 3px 0 #78905a}
.circle-redesign:not(.prepare):not(.setup) .nav-gear{min-height:46px;color:#7a8173}.circle-redesign:not(.prepare):not(.setup) .nav-gear:hover,.circle-redesign:not(.prepare):not(.setup) .nav-gear.on,.circle-redesign:not(.prepare):not(.setup) .nav-gear[aria-expanded="true"]{background:#e5e8da;color:var(--text)}
.circle-redesign:not(.prepare):not(.setup) .nav-me{border-color:#dcdfd1}.circle-redesign:not(.prepare):not(.setup) .nav-who b{color:var(--text)}
.circle-redesign:not(.prepare):not(.setup) #displayOpenBtn{border-color:#d8dccd;color:#66725e;background:#f8f8f0}
.circle-redesign:not(.prepare):not(.setup) .host-heading{width:min(1160px,100%);margin:0 auto 27px}
.circle-redesign:not(.prepare):not(.setup) .host-heading .tagline{margin:0 0 10px;color:#71865c;font-size:10px;font-weight:700;letter-spacing:1.55px!important;text-transform:uppercase!important}
.circle-redesign:not(.prepare):not(.setup) .host-heading h1{margin:0;color:#2d4934;font-family:Georgia,"Times New Roman",serif!important;font-size:43px;font-weight:500;letter-spacing:-1.8px;line-height:1.05}
.circle-redesign:not(.prepare):not(.setup) .host-heading .sub{margin:11px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
.circle-redesign:not(.prepare):not(.setup) .wrap{display:block;width:min(1160px,100%);max-width:none;margin-inline:auto}
.circle-redesign:not(.prepare):not(.setup) .wrap>.circle-workspace{display:grid;grid-template-columns:minmax(0,1fr) 316px;grid-template-areas:"stage queue";align-items:start;gap:24px}
.circle-redesign:not(.prepare):not(.setup) .wrap>.col.hide-stream{display:none}
.circle-redesign:not(.prepare):not(.setup) .circle-stage{display:flex;grid-area:stage;min-width:0;flex-direction:column;gap:14px}
.circle-redesign:not(.prepare):not(.setup) .current{position:relative;display:grid;min-height:436px;padding:76px 38px 42px;place-items:center;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--surface);box-shadow:0 4px 13px rgba(48,60,37,.035);text-align:center}
.circle-redesign:not(.prepare):not(.setup) .current::before{content:"";position:absolute;inset:56px 24px 24px;width:auto;height:auto;border:0;border-radius:11px;background:radial-gradient(circle at center,rgba(219,231,164,.46),rgba(244,246,232,.6) 42%,transparent 72%);pointer-events:none}
.circle-redesign:not(.prepare):not(.setup) .current::after{content:"";position:absolute;top:52%;left:50%;width:156px;height:156px;border:1px solid rgba(112,133,82,.2);border-radius:50%;box-shadow:0 0 0 26px rgba(219,231,164,.1),0 0 0 55px rgba(219,231,164,.075);transform:translate(-50%,-50%);pointer-events:none}
.circle-redesign:not(.prepare):not(.setup) .current .wm{position:absolute;z-index:1;top:44%;left:50%;display:grid;width:48px;height:48px;place-items:center;border:1px solid #d9dfc8;border-radius:50%;color:#788b56;background:#edf1e4;font-size:0;line-height:1;transform:translate(-50%,-50%)}.circle-redesign:not(.prepare):not(.setup) .current .wm svg{width:20px;height:20px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.circle-redesign:not(.prepare):not(.setup) .circle-stage-head{position:absolute;z-index:3;inset:0 0 auto;display:flex;height:58px;padding:0 19px;align-items:center;justify-content:space-between;border-bottom:1px solid #e5e7db;color:#68765f;background:rgba(255,254,248,.9);font-size:12px;font-weight:650}
.circle-redesign:not(.prepare):not(.setup) .circle-stage-state{display:flex;align-items:center;gap:7px;padding:6px 9px;border-radius:5px;color:#648651;background:#eef3e6;font-size:0}.circle-redesign:not(.prepare):not(.setup) .circle-stage-state::before{content:"";width:6px;height:6px;border-radius:50%;background:#82a367}.circle-redesign:not(.prepare):not(.setup) .circle-stage-state::after{content:"Open for challengers";font-size:10px}.circle-redesign.circle-ready .circle-stage-state::after{content:"Ready to start"}.circle-redesign.circle-active .circle-stage-state::after{content:"Duel in progress"}.circle-redesign.circle-held .circle-stage-state::after{content:"Result ready"}
.circle-redesign:not(.prepare):not(.setup) .current>.idle,.circle-redesign:not(.prepare):not(.setup) .current>#activeMatch{position:relative;z-index:2}
.circle-redesign:not(.prepare):not(.setup) .current .idle{max-width:330px;padding-top:76px;color:#848a7a;font-size:13px;line-height:1.65}.circle-redesign:not(.prepare):not(.setup) .current .idle.has-next{color:var(--text)}
.circle-redesign:not(.prepare):not(.setup) .current:has(#activeMatch[style*="display: block"]) .wm{display:none}
.circle-redesign:not(.prepare):not(.setup) .idle-cap,.circle-redesign:not(.prepare):not(.setup) .nowlbl{color:#7c8c69;font-size:9px;font-weight:700;letter-spacing:1.4px!important;text-transform:uppercase!important}.circle-redesign:not(.prepare):not(.setup) .idle-name,.circle-redesign:not(.prepare):not(.setup) .opp{color:#2d4934;font-family:Georgia,"Times New Roman",serif!important;font-size:clamp(42px,5vw,64px);font-weight:500;letter-spacing:-2px;line-height:1.02}
.circle-redesign:not(.prepare):not(.setup) .idle-tail,.circle-redesign:not(.prepare):not(.setup) .idle-run,.circle-redesign:not(.prepare):not(.setup) .current .state,.circle-redesign:not(.prepare):not(.setup) .current .timer,.circle-redesign:not(.prepare):not(.setup) .current .series,.circle-redesign:not(.prepare):not(.setup) .current .mana{color:var(--muted);font-size:12px}
.circle-redesign.circle-active .current{border-color:#b9cbc0}.circle-redesign.circle-active .circle-stage-state{color:#526f69;background:#e6efeb}.circle-redesign.circle-active .circle-stage-state::before{background:#668478}
.circle-redesign.circle-held .current{border-color:#d8ca99}.circle-redesign.circle-held .circle-stage-state{color:#92742f;background:#f5edcf}.circle-redesign.circle-held .circle-stage-state::before{background:#b49342}.circle-redesign.circle-held #revealBtn{min-width:200px}
.circle-redesign:not(.prepare):not(.setup) .medallions{margin:0;padding:0;border:1px solid var(--line);border-radius:11px;background:var(--surface);box-shadow:none;overflow:hidden}.circle-redesign:not(.prepare):not(.setup) .meds{gap:0}.circle-redesign:not(.prepare):not(.setup) .med{padding:16px 12px;background:transparent}.circle-redesign:not(.prepare):not(.setup) .med+.med{border-left:1px solid #e8eadf}.circle-redesign:not(.prepare):not(.setup) .med .num{color:#48604d;font-family:Georgia,"Times New Roman",serif!important;font-size:25px;font-weight:500}.circle-redesign:not(.prepare):not(.setup) .med .lbl{color:#949a8b;font-size:9px;letter-spacing:.8px!important;text-transform:uppercase!important}
.circle-redesign:not(.prepare):not(.setup) #queuePanel{grid-area:queue;min-height:436px;margin:0;padding:22px;border:1px solid var(--line);border-radius:13px;background:var(--surface);box-shadow:0 4px 12px rgba(60,69,35,.035)}
.circle-redesign:not(.prepare):not(.setup) .circle-queue-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}.circle-redesign:not(.prepare):not(.setup) .circle-section-label{display:block;margin-bottom:7px;color:#8b967a;font-size:8px;font-weight:700;letter-spacing:1.3px;text-transform:uppercase}.circle-redesign:not(.prepare):not(.setup) #queuePanel h2{margin:0;padding:0;border:0;color:#304b37;font-family:Georgia,"Times New Roman",serif!important;font-size:27px;font-weight:500;letter-spacing:-.8px}.circle-redesign:not(.prepare):not(.setup) .circle-count{padding:5px 7px;border:1px solid #e0e5d5;border-radius:5px;color:#879478;background:#f2f5e9;font-size:9px;font-weight:650;white-space:nowrap}
.circle-redesign:not(.prepare):not(.setup) .queue-list{display:grid;max-height:320px;margin:0 0 16px;gap:7px;overflow:auto}.circle-redesign:not(.prepare):not(.setup) .queue-list:empty{min-height:129px;border:1px dashed #d8decc;border-radius:9px;background:#fbfcf5}.circle-redesign:not(.prepare):not(.setup) .queue-list:empty::after{content:"No challengers yet";display:grid;place-items:center;color:#a0a693;font-size:11px}
.circle-redesign:not(.prepare):not(.setup) .queue-list li{min-height:45px;margin:0;padding:8px;border-color:#e4e7db;border-radius:8px;background:#fbfcf5;box-shadow:none}.circle-redesign:not(.prepare):not(.setup) .queue-list li:hover{border-color:#cbd4bb;box-shadow:none}.circle-redesign:not(.prepare):not(.setup) .queue-list .pos{color:#738264;background:#e8eddd}.circle-redesign:not(.prepare):not(.setup) .queue-list .name{color:#51604d;font-size:13px;font-weight:650}
.circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow{display:grid;margin-top:0;grid-template-columns:minmax(0,1fr) auto;gap:7px}.circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow input{min-height:43px;padding:9px 11px;border-color:#dfe3d5;border-radius:7px;color:#52634c;background:#fafbf4;font-size:12px}.circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow input::placeholder{color:#a3a99a}.circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow button{min-height:43px;padding-inline:14px}
.circle-redesign:not(.prepare):not(.setup) button,.circle-redesign:not(.prepare):not(.setup) a.button,.circle-redesign:not(.prepare):not(.setup) a.gl-btn{border-color:#45644a;color:#fffef1;background:#45644a;border-radius:8px;font-size:12px}.circle-redesign:not(.prepare):not(.setup) button:hover:not(:disabled),.circle-redesign:not(.prepare):not(.setup) a.button:hover,.circle-redesign:not(.prepare):not(.setup) a.gl-btn:hover{background:#36563c}.circle-redesign:not(.prepare):not(.setup) :where(button.ghost,a.ghost,button.small,a.button.ghost){border-color:#dbe0d2;color:#77836d;background:#fcfcf6}.circle-redesign:not(.prepare):not(.setup) :where(button.ghost,a.ghost,button.small,a.button.ghost):hover:not(:disabled){border-color:#cbd4bb;color:#4d6249;background:#f0f3e7}
.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear{border-color:transparent;color:#7a8173;background:transparent}.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear:hover,.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear[aria-expanded="true"]{border-color:transparent;color:var(--text);background:#e5e8da}
.circle-redesign:not(.prepare):not(.setup) #queuePanel>.row{margin-top:9px!important}.circle-redesign:not(.prepare):not(.setup) #queuePanel>.row button{min-height:42px}
.circle-redesign:not(.prepare):not(.setup) .debug,.circle-redesign:not(.prepare):not(.setup) #streamRail{display:none!important}.circle-redesign:not(.prepare):not(.setup) :where(.queue-recovery,.match-recovery){margin-top:9px;color:#91988a;font-size:10px}.circle-redesign:not(.prepare):not(.setup) :where(.queue-recovery,.match-recovery)>summary{min-height:36px;padding:8px 0;font-weight:550;text-align:center}.circle-redesign:not(.prepare):not(.setup) :where(.queue-recovery,.match-recovery)>div{display:flex;margin-top:7px;justify-content:center;gap:7px}.circle-redesign.circle-held .match-recovery{display:none}

/* Lobby */
.lobby-ui>.flow,.lobby-ui .eventbar{display:none}.lobby-ui .eventbar :where(#title,#newBtn,#openBtn,#endBtn){display:none}
.lobby-state-summary{display:flex;width:min(820px,100%);margin:0 auto 18px;padding:28px;align-items:center;gap:22px;border:0;border-radius:10px;background:var(--surface)}.lobby-state-summary>div{flex:1;min-width:0}
.lobby-state-summary h2{margin:3px 0 5px;color:var(--text);font:500 28px/1.2 inherit;letter-spacing:-.02em}.lobby-state-summary p{margin:0;color:var(--muted);font-size:16px}.lobby-state-summary>button{min-width:180px}
.lobby-ui .settings-panel{padding:6px}.lobby-ui .settings-panel>summary{display:flex;min-height:52px;padding:12px 14px;align-items:center;gap:10px;color:var(--muted);font-size:15px;font-weight:500;list-style:none}.lobby-ui .settings-panel>summary::-webkit-details-marker{display:none}.lobby-ui .settings-panel>summary::before{content:"›";display:grid;width:18px;height:18px;flex:0 0 18px;place-items:center;color:var(--info);font-size:22px;line-height:1;transform-origin:center;transition:transform .14s ease}.lobby-ui .settings-panel[open]>summary::before{transform:rotate(90deg)}.lobby-ui .settings-content{margin:0;padding:12px 14px 16px}
.lobby-ui :where(.handoff-actions,.pick-head) button{border-color:var(--line);color:var(--muted);background:transparent}.lobby-ui :where(.handoff-actions,.pick-head) button[aria-pressed="true"]{border-color:var(--accent);color:var(--text);background:var(--surface2)}
.lobby-ui.no-prizes .prize-strip,.lobby-ui.lobby-collecting .handoff,.lobby-ui.lobby-collecting #pickPanel,.lobby-ui.lobby-collecting #winnerQueuePanel,.lobby-ui.lobby-waiting .handoff,.lobby-ui.lobby-waiting #pickPanel,.lobby-ui.lobby-waiting #winnerQueuePanel,.lobby-ui.lobby-empty .handoff,.lobby-ui.lobby-empty #pickPanel,.lobby-ui.lobby-empty #winnerQueuePanel,.lobby-ui.lobby-ready #winnerQueuePanel,.lobby-ui.lobby-queued .handoff,.lobby-ui.lobby-queued #entrantsPanel{display:none}
.lobby-ui.lobby-empty .layout,.lobby-ui.lobby-waiting .layout,.lobby-ui.lobby-collecting .layout{grid-template-columns:minmax(0,780px);grid-template-areas:"entrants" "setup";justify-content:center}.lobby-ui.lobby-ready .layout{grid-template-columns:minmax(280px,.8fr) minmax(380px,1.2fr);grid-template-areas:"entrants pick" "setup setup"}.lobby-ui.lobby-queued .layout{grid-template-columns:minmax(380px,1.2fr) minmax(280px,.8fr);grid-template-areas:"pick queue" "setup setup"}.lobby-ui.lobby-queued :where(.pick-head,#drawWinner,#sendToWheel,#shuffleWinner){display:none}

/* Wheel */
.wheel-ui>.quick-path{display:none}.wheel-ui .demo-banner{position:static;width:min(1080px,100%);margin:0 auto 24px;padding:12px 16px;border-left:3px solid var(--info);color:var(--muted);background:rgba(115,180,232,.08);font-weight:500;letter-spacing:0;text-align:left;text-transform:none}
.wheel-ui .private-bar{width:min(820px,100%);max-width:none;margin:0 auto 26px;padding:15px 18px;border:1px solid var(--line);border-radius:10px;color:var(--muted);background:var(--surface);box-shadow:inset 0 1px rgba(255,255,255,.05);backdrop-filter:blur(11px) saturate(128%);-webkit-backdrop-filter:blur(11px) saturate(128%)}.wheel-ui .private-bar b{color:var(--text)}.wheel-ui .private-bar span{color:var(--muted)}.wheel-ui .private-bar a{padding:7px 0;color:var(--info);text-underline-offset:5px}
.wheel-ui .hero{width:min(820px,100%);max-width:none;margin:0 auto 28px;padding:0;align-items:flex-end}.wheel-ui .hero h2{color:var(--text);font-size:30px;font-weight:500}.wheel-ui .queue-count{padding:9px 14px;border-color:var(--line);color:var(--muted);background:rgba(8,17,29,.5);font-weight:600}
.wheel-ui .notice{width:min(820px,100%);margin:0 auto 28px;padding:15px 18px;line-height:1.55}
.wheel-ui .layout{width:min(1080px,100%);padding:0;grid-template-columns:minmax(520px,820px);justify-content:center;gap:24px}.wheel-waiting-links{display:flex;margin:0 auto 24px;justify-content:center;gap:12px;flex-wrap:wrap}.wheel-ui .stage,.wheel-ui .prize-stage{padding:32px;border:0!important;border-radius:10px;background:var(--surface)!important;box-shadow:none!important}.wheel-ui .prize-stage::before,.wheel-ui .prize-stage::after{display:none!important}
.wheel-ui .wheel-side-details{display:block;padding:8px 0;border:0;background:transparent}.wheel-ui .wheel-side-details>summary,.wheel-ui .wheel-recovery>summary{color:var(--muted);font-size:14px;font-weight:500}.wheel-ui .wheel-side-content{display:grid;margin-top:10px;gap:12px}.wheel-ui .wheel-recovery{width:100%;text-align:center}.wheel-ui .wheel-recovery>div{display:flex;margin-top:8px;justify-content:center;gap:8px}
.wheel-ui .prize-stage .stage-head{order:1}.wheel-ui .prize-stage .mode-choice{order:2}.wheel-ui .prize-stage .actions{order:3;margin:12px 0 6px}.wheel-ui .prize-stage .wheel-wrap{order:4}.wheel-ui .prize-stage .card-result{order:5}.wheel-ui .prize-stage .recipient{order:6}
.wheel-ui.wheel-waiting .actions,.wheel-ui.wheel-waiting .recipient{display:none}.wheel-ui.wheel-waiting .stage{min-height:270px;padding:44px 36px;justify-content:center}.wheel-ui.wheel-waiting .card-result{display:flex;min-height:0;align-items:center;justify-content:center}.wheel-ui.wheel-waiting .card-copy{max-width:320px}.wheel-ui.wheel-waiting .card-copy b{margin-bottom:6px}
.wheel-ui.wheel-landed #spinPrize{order:2;border-color:var(--line);color:var(--muted);background:transparent}.wheel-ui.wheel-landed #deliver{order:1;border-color:var(--accent);color:var(--accent-ink);background:var(--accent)}.wheel-ui.wheel-landed .wheel-recovery{order:3}

/* Prizes and Records */
.prizes-ui .prize-attention{display:flex;width:min(820px,100%);max-width:none;margin:0 auto 18px;padding:28px;align-items:center;gap:22px;border:0;border-radius:10px;background:var(--surface)}.prizes-ui .prize-attention>div{flex:1;min-width:0}.prizes-ui .prize-attention h2{margin:3px 0 5px;font:500 28px/1.2 inherit;letter-spacing:-.02em}.prizes-ui .prize-attention p{margin:0;color:var(--muted);font-size:16px}.prizes-ui .prize-attention>button{min-width:180px}
.prizes-ui .life-strip{width:min(1080px,100%);margin-inline:auto;padding:0 0 18px}.prizes-ui .life-tabs button{border-color:transparent;color:var(--muted);background:transparent}.prizes-ui .life-tabs button.on{border-color:var(--line);color:var(--text);background:var(--surface2)}
.prizes-ui.prizes-clear:not(.prizes-managing) :where(.life-strip,.prize-workspace,.life-col),.prizes-ui.prizes-locked:not(.prizes-managing) :where(.life-strip,.prize-workspace,.life-col),.prizes-ui.prizes-due:not(.prizes-managing) :where(.prize-workspace,.life-col){display:none}
.records-ui .records-tabs,.records-ui>.wrap{width:min(1050px,100%);max-width:none}.records-ui .records-tabs{margin:0 auto 22px;padding:0;gap:6px;border:0;background:transparent}.records-ui .records-tabs button{border-color:var(--line);color:var(--muted);background:transparent}.records-ui .records-tabs button.on{border-color:var(--accent);color:var(--accent-ink);background:var(--accent)}
.records-ui .records-summary{gap:1px;background:var(--line)}.records-ui .records-summary>div{background:var(--bg)}

/* Quiet account/chat context */
.host-ui .twitch-connect{padding:14px 18px;border:0;border-left:3px solid #7050b5;border-radius:0;background:rgba(112,80,181,.08)}.host-ui .tw-kicker{color:var(--muted);font-size:14px;letter-spacing:0;text-transform:none}.host-ui .tw-connect-title{font-size:16px}.host-ui .tw-connect-help{color:var(--muted);font-size:14px}
.host-ui.twitch-ok:not(.setup) .twitch-connect,.host-ui.prepare.twitch-verified .twitch-connect{display:none!important}.host-ui.twitch-verified:not(.twitch-ok):not(.prepare):not(.setup) #twitchListenWrap{display:none}

/* Every host page is one dark control console. The dedicated Arena, Wheel,
   Now Playing and Rules URLs remain the only presentation surfaces for OBS. */
.host-ui::before{display:none!important}
.host-ui :where(h1,h2){color:var(--text);font-family:Georgia,"Times New Roman",serif!important;font-weight:500}
.host-ui button:hover:not(:disabled),.host-ui a.button:hover,.host-ui a.gl-btn:hover{background:#e0b75f}
.records-ui .records-tabs button:hover:not(:disabled){color:var(--text);background:var(--surface2)}
.records-ui .records-tabs button.on:hover:not(:disabled){color:var(--accent-ink);background:var(--accent)}
.host-ui :where(button.ghost,a.ghost,.ghost[role="button"],button.small,a.button.ghost){border-color:var(--line);color:var(--text);background:rgba(8,17,29,.48)}
.host-ui :where(button.ghost,a.ghost,button.small,a.button.ghost):hover:not(:disabled){border-color:rgba(112,174,229,.42);color:var(--text);background:rgba(112,174,229,.1)}
.host-ui button.ghost,.host-ui button.small,.host-ui a.button.ghost{border-color:var(--line);color:var(--text);background:rgba(8,17,29,.48)}
.host-ui button.ghost:hover:not(:disabled),.host-ui button.small:hover:not(:disabled),.host-ui a.button.ghost:hover{border-color:rgba(112,174,229,.42);color:var(--text);background:rgba(112,174,229,.1)}
.host-ui :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){border-color:var(--line);color:var(--text);background-color:#091522}
.host-ui :where(label,.field>label){color:#cad6e5}
.host-ui .gear-pane{background:rgba(12,24,38,.88);backdrop-filter:blur(22px) saturate(125%);-webkit-backdrop-filter:blur(22px) saturate(125%)}.host-ui .gear-link:hover{background:rgba(112,174,229,.09)}
.host-ui.setup .sudoor,.host-ui.prepare .tonight-overview,.host-ui #wheelLinkBox,.lobby-state-summary,.wheel-ui .stage,.wheel-ui .prize-stage,.prizes-ui .prize-attention{border:1px solid var(--line)!important;background:var(--surface)!important;box-shadow:inset 0 1px rgba(255,255,255,.06),0 18px 42px rgba(0,0,0,.22)!important;backdrop-filter:blur(11px) saturate(128%);-webkit-backdrop-filter:blur(11px) saturate(128%)}
.host-ui.prepare .tonight-overview .badge{color:var(--good)}.tonight-row.attention{background:rgba(211,171,85,.08)}
.host-ui .obs-output-actions{display:flex;margin-top:16px;align-items:center;gap:12px;flex-wrap:wrap}

/* Circle: one stage and one compact queue, using the same console vocabulary. */
.circle-redesign:not(.prepare):not(.setup){--bg:#08111d;--rail:rgba(7,14,24,.84);--surface:rgba(13,25,39,.64);--surface2:rgba(28,49,70,.62);--text:#edf4ff;--muted:#91a2b8;--line:rgba(137,165,196,.22);--accent:#d3ab55;--accent-ink:#171106;--good:#65c995;--bad:#e47b72;--info:#70aee5;--gold:var(--accent);--gold2:#efd184;--gold-dim:#a88743;color:var(--text);background:linear-gradient(rgba(5,11,20,.5),rgba(5,11,20,.81)),url('main-bg.jpg') center/cover fixed,var(--bg)}
.circle-redesign:not(.prepare):not(.setup) .topnav{border-color:var(--line);background:var(--rail)}
.circle-redesign:not(.prepare):not(.setup) .nav-lockup span{color:var(--text)}
.circle-redesign:not(.prepare):not(.setup) .nav-tabs a{color:var(--muted)}
.circle-redesign:not(.prepare):not(.setup) .nav-tabs a:hover{color:var(--text);background:rgba(112,174,229,.08)}
.circle-redesign:not(.prepare):not(.setup) .nav-tabs a.on,.circle-redesign:not(.prepare):not(.setup) .nav-tabs a[aria-current="page"]{color:var(--text);background:rgba(112,174,229,.12);box-shadow:inset 3px 0 var(--accent)}
.circle-redesign:not(.prepare):not(.setup) .nav-gear,.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear{border-color:transparent;color:var(--muted);background:transparent}
.circle-redesign:not(.prepare):not(.setup) .nav-gear:hover,.circle-redesign:not(.prepare):not(.setup) .nav-gear.on,.circle-redesign:not(.prepare):not(.setup) .nav-gear[aria-expanded="true"],.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear:hover,.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear[aria-expanded="true"]{color:var(--text);background:rgba(112,174,229,.08)}
.circle-redesign:not(.prepare):not(.setup) .nav-me{border-color:var(--line)}
.circle-redesign:not(.prepare):not(.setup) .host-heading .tagline{color:var(--accent)}
.circle-redesign:not(.prepare):not(.setup) .host-heading h1{color:var(--text)}
.circle-redesign:not(.prepare):not(.setup) .current{border-color:var(--line);background:linear-gradient(145deg,rgba(19,35,53,.68),rgba(9,19,31,.58));box-shadow:inset 0 1px rgba(255,255,255,.06),0 20px 48px rgba(0,0,0,.26);backdrop-filter:blur(10px) saturate(128%);-webkit-backdrop-filter:blur(10px) saturate(128%)}
.circle-redesign:not(.prepare):not(.setup) .current::before{background:radial-gradient(circle at center,rgba(58,104,145,.22),rgba(12,28,44,.18) 43%,transparent 72%)}
.circle-redesign:not(.prepare):not(.setup) .current::after{border-color:rgba(112,174,229,.2);box-shadow:0 0 0 26px rgba(112,174,229,.055),0 0 0 55px rgba(112,174,229,.035)}
.circle-redesign:not(.prepare):not(.setup) .current .wm{border-color:rgba(211,171,85,.32);color:var(--accent);background:rgba(211,171,85,.07)}
.circle-redesign:not(.prepare):not(.setup) .circle-stage-head{border-color:var(--line);color:var(--muted);background:rgba(9,19,31,.72);backdrop-filter:blur(10px)}
.circle-redesign:not(.prepare):not(.setup) .circle-stage-state{color:var(--good);background:rgba(101,201,149,.09)}.circle-redesign:not(.prepare):not(.setup) .circle-stage-state::before{background:var(--good)}
.circle-redesign:not(.prepare):not(.setup) .current .idle{color:var(--muted)}
.circle-redesign:not(.prepare):not(.setup) .idle-cap,.circle-redesign:not(.prepare):not(.setup) .nowlbl{color:var(--accent)}
.circle-redesign:not(.prepare):not(.setup) .idle-name,.circle-redesign:not(.prepare):not(.setup) .opp{color:var(--text)}
.circle-redesign.circle-active .current{border-color:rgba(112,174,229,.42)}.circle-redesign.circle-active .circle-stage-state{color:var(--info);background:rgba(112,174,229,.09)}.circle-redesign.circle-active .circle-stage-state::before{background:var(--info)}
.circle-redesign.circle-held .current{border-color:rgba(211,171,85,.5)}.circle-redesign.circle-held .circle-stage-state{color:var(--accent);background:rgba(211,171,85,.1)}.circle-redesign.circle-held .circle-stage-state::before{background:var(--accent)}
.circle-redesign:not(.prepare):not(.setup) .medallions{border-color:var(--line);background:var(--surface);box-shadow:inset 0 1px rgba(255,255,255,.045),0 12px 30px rgba(0,0,0,.16);backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%)}
.circle-redesign:not(.prepare):not(.setup) .med+.med{border-color:var(--line)}.circle-redesign:not(.prepare):not(.setup) .med .num{color:var(--text)}.circle-redesign:not(.prepare):not(.setup) .med .lbl{color:var(--muted)}
.circle-redesign:not(.prepare):not(.setup) #queuePanel{border-color:var(--line);background:var(--surface);box-shadow:inset 0 1px rgba(255,255,255,.05),0 20px 48px rgba(0,0,0,.22);backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%)}
.circle-redesign:not(.prepare):not(.setup) .circle-section-label{color:var(--accent)}.circle-redesign:not(.prepare):not(.setup) #queuePanel h2{color:var(--text)}.circle-redesign:not(.prepare):not(.setup) .circle-count{border-color:var(--line);color:var(--muted);background:rgba(112,174,229,.07)}
.circle-redesign:not(.prepare):not(.setup) .queue-list:empty{border-color:var(--line);background:rgba(5,11,20,.2)}.circle-redesign:not(.prepare):not(.setup) .queue-list:empty::after{color:var(--muted)}
.circle-redesign:not(.prepare):not(.setup) .queue-list li{border-color:var(--line);background:rgba(8,17,29,.55)}.circle-redesign:not(.prepare):not(.setup) .queue-list li:hover{border-color:rgba(112,174,229,.38)}.circle-redesign:not(.prepare):not(.setup) .queue-list .pos{color:var(--info);background:rgba(112,174,229,.1)}.circle-redesign:not(.prepare):not(.setup) .queue-list .name{color:var(--text)}
.circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow input{border-color:var(--line);color:var(--text);background:#091522}.circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow input::placeholder{color:var(--muted)}
.circle-redesign:not(.prepare):not(.setup) button,.circle-redesign:not(.prepare):not(.setup) a.button,.circle-redesign:not(.prepare):not(.setup) a.gl-btn{border-color:var(--accent);color:var(--accent-ink);background:var(--accent)}
.circle-redesign:not(.prepare):not(.setup) button:hover:not(:disabled),.circle-redesign:not(.prepare):not(.setup) a.button:hover,.circle-redesign:not(.prepare):not(.setup) a.gl-btn:hover{background:#e0b75f}
.circle-redesign:not(.prepare):not(.setup) :where(button.ghost,a.ghost,button.small,a.button.ghost){border-color:var(--line);color:var(--text);background:rgba(8,17,29,.48)}
.circle-redesign:not(.prepare):not(.setup) :where(button.ghost,a.ghost,button.small,a.button.ghost):hover:not(:disabled){border-color:rgba(112,174,229,.42);color:var(--text);background:rgba(112,174,229,.1)}

/* Launcher */
.launcher-ui{--accent:#d6a83e;--accent-ink:#17130b;--text:#edf1f3;--muted:#9ca8b0;--line:#303b44;--surface:#182027;margin:0;overflow-x:clip;color:var(--text);background:#0d1115;font:400 16px/1.55 Inter,ui-sans-serif,system-ui,sans-serif}.launcher-ui::before{display:none}
.launcher-ui .top{min-height:64px;padding:10px clamp(18px,4vw,54px);border-bottom:1px solid var(--line);background:#12181e;backdrop-filter:none}.launcher-ui .brand{color:var(--text);font-weight:600;letter-spacing:0}.launcher-ui .toplinks a{min-height:44px;padding:10px 12px;color:var(--muted)}.launcher-ui .toplinks a:hover{color:var(--text);background:var(--surface)}
.launcher-ui .hero{max-width:920px;margin-inline:auto;padding:clamp(54px,8vw,92px) 20px 44px;text-align:left}.launcher-ui .hero img,.launcher-ui .eyebrow,.launcher-ui .jump{display:none}.launcher-ui .hero h1{margin:0 0 14px;color:var(--text);font:500 clamp(44px,7vw,76px)/1.02 inherit;letter-spacing:-.045em;text-shadow:none}.launcher-ui .hero p{margin:0;color:var(--muted);font-size:19px}.launcher-ui .host-start{display:inline-flex;min-height:48px;margin-top:26px;padding:11px 18px;align-items:center;border-radius:8px;color:var(--accent-ink);background:var(--accent);font-weight:600;text-decoration:none}
.launcher-ui .shelf{width:min(1120px,calc(100% - 36px))}.launcher-ui .shelf-head h2{color:var(--text);font:500 clamp(28px,4vw,38px)/1.1 inherit;letter-spacing:-.03em}.launcher-ui .shelf-head p{color:var(--muted)}
.launcher-ui .card{min-height:260px;padding:24px;border:0;border-radius:10px;background:var(--surface);box-shadow:none}.launcher-ui .card::before{opacity:.18;filter:grayscale(.35)}.launcher-ui .card::after{background:linear-gradient(180deg,rgba(13,17,21,.3),rgba(13,17,21,.96))}.launcher-ui .card:hover{transform:translateY(-2px)}
.launcher-ui .tag{padding:0;border:0;border-radius:0;color:var(--muted);background:transparent;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none}.launcher-ui .card h3{color:var(--text);font:500 clamp(26px,3vw,34px)/1.1 inherit;letter-spacing:-.03em;text-shadow:none}.launcher-ui .card p,.launcher-ui .door span{color:#bac3c8;font-size:15px}.launcher-ui .door-row{grid-template-columns:1fr;margin-top:18px}.launcher-ui .door{min-height:62px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:rgba(13,17,21,.8)}.launcher-ui .door:hover{border-color:#596873;background:#202a32}.launcher-ui .door[href="duel.html?prepare=1"]{order:-1;border-color:var(--accent);color:var(--accent-ink);background:var(--accent)}.launcher-ui .door[href="duel.html?prepare=1"] b,.launcher-ui .door[href="duel.html?prepare=1"] span{color:var(--accent-ink)}.launcher-ui .footer{color:#78838a}

@media(max-width:1050px){.wheel-ui .layout{grid-template-columns:minmax(0,1fr)}.lobby-ui.lobby-ready .layout,.lobby-ui.lobby-queued .layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"pick" "entrants" "queue" "setup"}}
@media(max-width:1020px){
  .circle-redesign:not(.prepare):not(.setup) .wrap>.circle-workspace{grid-template-columns:minmax(0,1fr);grid-template-areas:"stage" "queue"}
  .circle-redesign:not(.prepare):not(.setup) #queuePanel{min-height:0}
}
@media(max-width:760px){
  .host-ui{padding:84px 16px 92px;font-size:16px}.host-ui>h1{margin-bottom:11px;font-size:38px}.host-ui>.tagline{font-size:16px}.host-ui>.sub{margin-bottom:32px;font-size:15px;line-height:1.6}
  .host-ui .topnav{inset:0 0 auto;width:100%;height:64px;min-height:64px;padding:8px 14px;flex-direction:row;align-items:center;gap:8px;overflow:visible;border-right:0;border-bottom:1px solid var(--line);backdrop-filter:none}
  .host-ui .nav-lockup{min-width:0;padding:2px 0}.host-ui .nav-lockup img{width:32px;height:32px}.host-ui .nav-lockup span{overflow:hidden;font-size:16px;text-overflow:ellipsis;white-space:nowrap}
  .host-ui .nav-tabs{position:fixed;z-index:82;inset:auto 25% 0 0;display:grid;width:75%;height:74px;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1px solid var(--line);background:var(--rail)}
  .host-ui .nav-tabs a{display:none}.host-ui .nav-tabs a[href="duel.html?prepare=1"],.host-ui .nav-tabs a[href="duel.html"],.host-ui .nav-tabs a[href="lobby.html"]{display:grid;min-height:74px;padding:8px 4px;place-items:center;align-content:center;border-radius:0;font-size:14px;text-align:center}
  .host-ui .nav-tabs a.on,.host-ui .nav-tabs a[aria-current="page"]{box-shadow:inset 0 3px var(--accent)}
  .host-ui .nav-gear{position:fixed;z-index:83;inset:auto 0 0 auto;display:grid;width:25%;height:74px;min-height:74px;padding:8px 4px;place-items:center;align-content:center;border:0;border-top:1px solid var(--line);border-radius:0;background:var(--rail);font-size:14px}.host-ui .nav-gear[aria-expanded="true"]{box-shadow:inset 0 3px var(--accent)}
  .host-ui .nav-me{display:flex;min-width:0;margin:0 0 0 auto;padding:0;align-items:center;border:0}.host-ui .nav-me[hidden],.host-ui .nav-me>[hidden]{display:none}.host-ui .nav-who{max-width:min(210px,55vw);font-size:13px;flex-direction:row;align-items:center;gap:5px;flex-wrap:wrap;white-space:nowrap}.host-ui .nav-who .nav-identity{gap:4px;max-width:100%}.host-ui .nav-provider-icon{width:14px;height:14px;flex-basis:14px}.host-ui .nav-who b{display:inline;font-size:14px}.host-ui .nav-divider{display:inline;color:var(--line)}.host-ui .nav-signout,.host-ui .nav-link{display:none!important}.host-ui .nav-signin{width:auto;padding:9px 11px}.host-ui .nav-status{display:none}
  .host-ui .gear-pane{inset:auto 10px 82px;width:auto;max-height:min(74vh,620px);padding:18px;border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 48px rgba(0,0,0,.42)}.host-ui .gear-pane.gear-pane-wide{inset:auto 10px 82px;width:auto}.host-ui .gear-head b::after{content:" menu"}
  .host-ui :where(.wrap,.layout,.flow,.eventbar,.handoff,.quick-path,.private-bar){width:100%}.host-ui .panel{padding:20px 0}
  .host-ui.setup .sudoor,.host-ui.prepare .tonight-overview,.host-ui #wheelLinkBox,.lobby-state-summary,.wheel-ui .stage,.prizes-ui .prize-attention{width:100%;padding:20px}
  .host-ui.setup .su-head,.tonight-overview-head{align-items:flex-start}.host-ui.setup .su-guide{display:none}.host-ui.setup .su-step.active{grid-template-columns:32px minmax(0,1fr);padding:16px 0}.host-ui.setup .su-step.active .su-act,.host-ui.setup .su-step.active .su-body{grid-column:2/-1;justify-content:flex-start}
  .host-ui.setup .su-foot,.host-ui.prepare .gl-row{align-items:stretch;flex-direction:column}.host-ui.setup .su-foot>*,.host-ui.prepare .golive .gl-btn{width:100%}
  .tonight-row{min-height:72px;align-items:flex-start}.tonight-row-actions{align-self:center}.host-ui.prepare :where(#rulesPanel,#prizePanel,#preList){scroll-margin-top:76px}
  .host-ui .obs-task,.host-ui .obs-task.active{grid-template-columns:30px minmax(0,1fr)}.host-ui .obs-task>button{grid-column:2/-1;width:100%;justify-self:stretch}.host-ui .obs-url-row{align-items:stretch;flex-direction:column}
  .host-ui .current{min-height:230px;padding:24px 18px}.host-ui .idle-name,.host-ui .opp{font-size:40px}.host-ui #queuePanel .addrow,.host-ui #queuePanel>.row{align-items:stretch;flex-direction:column}
  .lobby-state-summary,.prizes-ui .prize-attention{align-items:stretch;flex-direction:column}.lobby-state-summary>button,.prizes-ui .prize-attention>button{width:100%;min-width:0}.wheel-waiting-links{align-items:stretch;flex-direction:column}
  .records-ui .records-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.records-ui .record-tools{grid-template-columns:1fr}.records-ui .record-tools button{width:100%}.prizes-ui .life-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .host-ui :where(.row,.actions){max-width:100%}.host-ui :where(button,input,select,textarea){max-width:100%}
  .launcher-ui .top{padding:8px 14px}.launcher-ui .toplinks{display:none}.launcher-ui .hero{padding:48px 18px 32px}.launcher-ui .hero h1{font-size:clamp(42px,13vw,58px)}.launcher-ui .hero p{font-size:17px}.launcher-ui .card{min-height:250px;padding:20px}
}
@media(max-width:760px){
  .circle-redesign:not(.prepare):not(.setup){padding:84px 16px 94px}
  .circle-redesign:not(.prepare):not(.setup) .topnav{inset:0 0 auto;width:100%;height:64px;padding:8px 14px;border-right:0;border-bottom:1px solid var(--line)}
  .circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear{border-top:1px solid var(--line);background:var(--rail)}
  .circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear:hover,.circle-redesign:not(.prepare):not(.setup) .topnav .nav-gear[aria-expanded="true"]{background:rgba(112,174,229,.08)}
  .circle-redesign:not(.prepare):not(.setup) .host-heading{margin-bottom:26px}
  .circle-redesign:not(.prepare):not(.setup) .host-heading h1{font-size:38px}
  .circle-redesign:not(.prepare):not(.setup) .host-heading .sub{font-size:12px}
  .circle-redesign:not(.prepare):not(.setup) .current{min-height:330px;padding:70px 18px 30px}
  .circle-redesign:not(.prepare):not(.setup) .current::before{inset:56px 10px 16px}
  .circle-redesign:not(.prepare):not(.setup) .current::after{width:122px;height:122px}
  .circle-redesign:not(.prepare):not(.setup) .current .wm{width:42px;height:42px;font-size:18px}
  .circle-redesign:not(.prepare):not(.setup) .current .idle{padding-top:64px}
  .circle-redesign:not(.prepare):not(.setup) #queuePanel{padding:19px}
  .circle-redesign:not(.prepare):not(.setup) #queuePanel .addrow{grid-template-columns:minmax(0,1fr) auto;align-items:stretch}
}
@media(max-width:430px){.host-ui{padding-inline:14px}.host-ui .nav-lockup span{max-width:120px}.host-ui .nav-signin{font-size:13px}.host-ui .tonight-overview,.host-ui.setup .sudoor{border-radius:8px}.tonight-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.tonight-row-actions{display:grid}.host-ui :where(.queue-recovery,.match-recovery)>div{align-items:stretch;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.host-ui *,.launcher-ui *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Tonight: selected rules and the saved preset library. */
.tonight-rules-list {
  margin: 6px 0;
  padding-left: 22px;
  color: var(--text);
  font-size: 15px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.rules-help {
  color: var(--muted);
  font-size: 15px;
  line-height: 1.5;
  margin: 8px 0;
}

.preset-library-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.preset-library-row > div {
  flex: 1 1 180px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.preset-library-row span {
  display: block;
  color: var(--muted);
  font-size: 14px;
  margin-top: 4px;
}

.preset-library-row button { flex: 0 0 auto; }
#newRulePresetBtn { margin-top: 12px; }
#presetRetryBtn[hidden] { display: none; }
.rules-details { margin: 20px 0; }
.rules-details summary { cursor: pointer; font-weight: 700; }
#nightRulesEditor, #defaultRulesEditor, #rulesChatEditor { scroll-margin-top: 95px; }
