:root { --night:#171426; --panel:#25203a; --line:#595076; --ink:#fbf8ff; --muted:#c4bdd5; --gold:#f2c65c; --green:#7ad69a; }
* { box-sizing:border-box; }
body { min-height:100vh; margin:0; background:radial-gradient(circle at 50% 0,#36305d 0,var(--night) 58%); color:var(--ink); font-family:system-ui,-apple-system,"Segoe UI",sans-serif; }
button,input,select { font:inherit; }
.setup { max-width:720px; margin:20px auto; padding:34px; background:var(--panel); border:1px solid var(--line); border-radius:18px; box-shadow:0 20px 50px #0006; }
.eyebrow { margin:0; color:var(--gold); font-size:.8rem; font-weight:800; letter-spacing:.15em; }
.setup h1 { margin:.15em 0; font-size:clamp(2rem,5vw,3.2rem); }
.lede,.help { color:var(--muted); }
label { display:block; margin:18px 0; font-weight:700; }
select,input { display:block; width:100%; margin-top:7px; padding:11px; border:1px solid #6f668d; border-radius:8px; background:#151224; color:var(--ink); }
.scope { padding:2px 16px 12px; border:1px solid var(--line); border-radius:10px; }
.scope label { margin:12px 0; }
.types { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.types label { display:flex; gap:8px; align-items:center; margin:0; font-weight:600; }
.types input { width:auto; margin:0; }
.fullscreen-option { display:flex; gap:8px; align-items:center; }
.fullscreen-option input { width:auto; margin:0; }
.timers { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.primary,.plain { padding:12px 16px; border:1px solid #8d80b5; border-radius:9px; background:#30264a; color:var(--ink); cursor:pointer; }
.primary { border-color:#ffe087; background:var(--gold); color:#231c31; font-weight:800; }
.primary:hover,.plain:hover { filter:brightness(1.08); }
.note { min-height:1.5em; color:var(--muted); }

.ticker { position:relative; display:grid; min-height:100vh; padding:30px 5vw; }
.ticker-head { position:absolute; top:16px; right:5vw; padding:8px; opacity:0; transition:opacity .18s ease; }
.ticker-head:hover,.ticker-head:focus-within { opacity:1; }
.quiet-link { padding:0; border:0; background:transparent; color:#06050a; cursor:pointer; font-size:.85rem; }
.quiet-link:hover,.quiet-link:focus { color:#65577c; }
.question-card { align-self:center; width:100%; max-width:1100px; margin:auto; text-align:center; }
.type { color:var(--gold); font-size:.9rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.type-spacer { visibility:hidden; }
.question-card h1 { margin:.35em 0; font-size:clamp(1.6rem,4.4vw,4.4rem); line-height:1.15; }
.question-reference { color:var(--gold); font-size:.48em; font-weight:700; white-space:nowrap; }
.choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; max-width:900px; margin:102px auto 0; text-align:left; }
.choice { padding:17px 20px; border:1px solid #625a81; border-radius:12px; background:#241e38; font-size:clamp(1.05rem,2vw,1.55rem); }
.choice.correct { border-color:var(--green); background:#1f4538; color:#ecfff2; }
.countdown { max-width:650px; margin:200px auto 0; }
.countdown.is-hidden { visibility:hidden; }
.bar { height:5px; overflow:hidden; border-radius:999px; background:#4a4265; }
.bar i { display:block; width:100%; height:100%; background:var(--gold); transform-origin:left; }
.hidden { display:none; }

@media (max-width:700px) {
  .setup { margin:20px 14px; padding:24px; }
  .ticker { padding:20px; }
  .choices,.timers { grid-template-columns:1fr; }
}
