:root{color-scheme:dark;--bg:#101a20;--panel:#17242b;--gold:#dec28a;--muted:#92a4aa;--line:#ffffff16}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 30% 35%,#21353b 0, var(--bg) 65%);color:#f3f0e8;font:15px/1.5 system-ui,-apple-system,sans-serif}button,input,select{font:inherit}button,.file{border:1px solid #ffffff25;border-radius:8px;background:#ffffff06;color:inherit;padding:10px 16px;cursor:pointer;transition:background .2s}button:hover,.file:hover{background:#ffffff12}button:disabled{opacity:.35;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}header{height:96px;padding:24px 40px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px;color:var(--gold);font-size:32px;text-decoration:none}.brand span{color:#f3f0e8;font-size:14px;letter-spacing:3px;font-weight:700}.brand small{display:block;font-size:8px;letter-spacing:4px;color:var(--muted)}.top-actions{display:flex;align-items:center;gap:12px}.local{color:var(--muted);font-size:12px;margin-right:16px}kbd{font:11px system-ui;border:1px solid #ffffff30;border-radius:4px;padding:2px 5px;margin-left:10px;opacity:.7}main{display:grid;grid-template-columns:minmax(0,1fr) 355px;min-height:calc(100vh - 96px)}.stage{text-align:center;padding:35px 30px 25px;overflow:hidden}.eyebrow{font-size:9px;color:var(--gold);letter-spacing:2.5px;font-weight:650}h1{font:400 clamp(25px,3vw,44px)/1.2 Georgia,serif;margin:12px 0 18px}h2{font-size:22px;margin:4px 0 16px}.stats{display:flex;justify-content:center;align-items:center;gap:20px;color:var(--muted);font-size:12px}.stats b{color:#e9e8e0;font-weight:600}.stats i{height:12px;border-left:1px solid #ffffff30}.wheel-wrap{position:relative;width:min(47vh,440px,75vw);aspect-ratio:1;margin:30px auto 22px;filter:drop-shadow(0 20px 28px #0006)}#wheel{display:block;width:100%;height:100%;border-radius:50%;border:9px solid #bd9e65;outline:2px solid #ead8af;outline-offset:5px;transform:rotate(0deg)}.pointer{position:absolute;z-index:3;top:-15px;left:calc(50% - 15px);width:30px;height:39px;background:#f7e6bd;clip-path:polygon(0 0,100% 0,50% 100%);filter:drop-shadow(0 2px 2px #000)}.hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:18%;aspect-ratio:1;border-radius:50%;background:#13252c;border:3px solid #d7bb82;box-shadow:0 0 0 7px #101a2033;display:flex;flex-direction:column;justify-content:center;font:italic 28px Georgia;color:#f2d7a0}.hub span{font:6px system-ui;letter-spacing:2px;margin-top:4px}#stateLabel{font-size:9px;letter-spacing:3px;color:var(--gold)}#winner{font:400 clamp(27px,3vw,43px)/1.15 Georgia;margin:8px 0;overflow-wrap:anywhere}#status{color:var(--muted);font-size:12px;margin:10px 0 17px}.primary{color:#17242b;background:var(--gold);border-color:var(--gold);min-width:260px;font-weight:650;padding:13px 22px}.primary:hover{background:#efd7aa}.primary kbd{border-color:#17242b50}.stage-note{font-size:10px;color:var(--muted);margin:13px}aside{background:#111c23cc;border-left:1px solid var(--line);padding:25px;max-height:calc(100vh - 96px);overflow:auto}.drawer-head,.row{display:flex;justify-content:space-between;align-items:center;gap:12px}.drawer-head h2{font:24px Georgia;margin:5px 0 22px}#closeDrawer{font-size:23px;padding:0 8px;border:0}.notice{font-size:11px;color:var(--gold);padding:12px;background:#dec28a0b;border:1px solid #dec28a24;border-radius:6px;margin-bottom:22px}label{display:block;color:#bdc9cd;font-size:12px;margin:15px 0}input:not([type=checkbox]):not([type=file]),select{display:block;width:100%;background:#0c171d;border:1px solid #ffffff20;border-radius:6px;padding:9px 10px;color:#f3f0e8;margin-top:7px}input[type=checkbox]{accent-color:var(--gold)}input[type=file]{width:100%;margin-top:8px;font-size:11px}.file{display:block;font-size:12px}.panel{border-top:1px solid var(--line);margin-top:24px;padding-top:17px}h3{font-size:13px;font-weight:600;margin:0 0 10px}.panel p,details p{font-size:11px;color:var(--muted)}.secondary{background:var(--gold);color:#142129;border:0}ol{padding-left:22px;font-size:12px;max-height:180px;overflow:auto}li{padding:5px 0;border-bottom:1px solid var(--line)}li.empty{list-style:none;color:var(--muted);margin-left:-22px;border:0}.button-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.button-grid button{font-size:11px;padding:9px}details{font-size:12px;border-top:1px solid var(--line);padding-top:18px;margin-top:24px}details button{font-size:11px;margin:5px 0}.fine{font-size:10px;color:var(--muted)}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#ead5ab;color:#142129;padding:12px 20px;border-radius:8px;max-width:90%;z-index:9;display:none}dialog{background:#1c2b32;color:#f3f0e8;border:1px solid #dec28a66;border-radius:12px;padding:28px;max-width:440px}dialog::backdrop{background:#000a}dialog p{color:#b5c3c8}body.drawer-closed main{grid-template-columns:1fr}body.drawer-closed aside{display:none}body.presenting header{display:none}body.presenting main{min-height:100vh;grid-template-columns:1fr}body.presenting aside{display:none}body.presenting .stage{padding:25px}body.presenting .wheel-wrap{width:min(49vh,650px,76vw)}body.presenting .stage-note{display:none}body.presenting .primary{background:transparent;color:var(--muted);border:0;font-weight:400;font-size:12px;padding:3px}body.presenting .eyebrow{display:none}body.presenting h1{margin-top:0}.winner-state #winner{color:#f4d9a1}.winner-state .wheel-wrap{filter:drop-shadow(0 0 45px #dec28a22)}@media(max-width:850px){header{padding:18px;height:80px}.local{display:none}main{grid-template-columns:1fr}.stage{padding:30px 16px}aside{max-height:none;border-left:0;border-top:1px solid var(--line)}.wheel-wrap{width:min(54vh,560px,80vw)}.top-actions{gap:7px}.top-actions button{font-size:11px;padding:8px}kbd{margin-left:4px}.brand span{font-size:11px}.brand{font-size:24px;gap:7px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Reserve vertical space for the announcement and operator action on laptop displays. */
@media(min-width:851px){.stage{padding-top:23px;padding-bottom:16px}.wheel-wrap{width:min(47vh,560px,70vw);margin-top:24px;margin-bottom:20px}h1{font-size:clamp(25px,2.6vw,40px)}body.presenting .wheel-wrap{width:min(55vh,720px,76vw)}body.presenting #winner{font-size:clamp(32px,4vw,64px)}}
@media(max-height:720px) and (min-width:851px){header{height:72px;padding-top:12px;padding-bottom:12px}main{min-height:calc(100vh - 72px)}aside{max-height:calc(100vh - 72px)}.stage{padding-top:15px}.wheel-wrap{width:40vh;margin:16px auto 12px}h1{margin:7px 0 12px}#winner{font-size:30px}}

/* Give more of the stage to names while keeping the announcement close. */
.stage{padding-top:18px}.wheel-wrap{margin-top:22px;margin-bottom:16px}h1{margin-bottom:12px}#status{margin:7px 0 12px}.stage-note{margin:9px}body.presenting .stage{padding:18px}body.presenting h1{font-size:clamp(25px,2.6vw,40px)}
/* Center the full presentation composition vertically instead of anchoring it to the top. */
body.presenting .stage{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 18px}
body.presenting .stage>h1,body.presenting #announcement{flex-shrink:0}
body.presenting .wheel-wrap{flex-shrink:0}

/* Keep the wheel drawing square and isolated from flex and rotation compositing. */
#wheel{position:absolute;inset:0;aspect-ratio:1;transform-origin:50% 50%;background:#294b54}

.key-guide{width:100%;border-collapse:collapse;margin:12px 0 8px;font-size:10px;line-height:1.45;text-align:left}.key-guide th,.key-guide td{padding:7px 0;border-bottom:1px solid var(--line);vertical-align:middle}.key-guide thead th{color:var(--muted);font-size:9px;letter-spacing:1px;text-transform:uppercase;font-weight:500;padding-top:0}.key-guide tbody th{width:105px;padding-right:10px;font-weight:400;white-space:nowrap}.key-guide td{color:#bdc9cd}.key-guide kbd{display:inline-block;font-size:9px;margin:0;padding:2px 5px;opacity:1;color:#ead5ab;background:#ffffff04}.key-guide tr:last-child th,.key-guide tr:last-child td{border-bottom:0}

#guard .row{flex-wrap:wrap;justify-content:flex-end}#guard .row button{font-size:12px}#guard:has(#downloadClear:not([hidden])) #acceptGuard{background:transparent;color:#bdc9cd;border:1px solid #ffffff25}