:root{color-scheme:dark;--gold:#f4cf7b;--cream:#fff1cf;--green:#063b2b;--red:#b21820}*{box-sizing:border-box}body{margin:0;color:var(--cream);font:16px/1.5 system-ui,sans-serif;background:radial-gradient(ellipse at 50% 0,#14634588,transparent 55%),repeating-linear-gradient(100deg,#43050c 0,#700b16 4%,#32060b 8%,#6d0c17 12%);min-height:100vh}body:before{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent,#051e18dd 18%,#051e18ee 82%,transparent);z-index:-0}main{position:relative;max-width:1160px;margin:auto;padding:30px 28px}.garland{position:relative;text-align:center;color:#ffde84;font-size:28px;letter-spacing:20px;height:50px;overflow:hidden;background:#06291e;box-shadow:0 5px 35px #000;white-space:nowrap;text-shadow:0 0 15px #ffad17}.garland span{color:#b51e29;font-size:24px}.marquee{position:relative;text-align:center;border:2px solid #eac06a;border-radius:30px;padding:24px 20px 30px;background:radial-gradient(ellipse,#fff5da,#e9d29e);color:#082e21;box-shadow:0 0 0 6px #681012,0 0 0 8px #cd8836,0 0 35px #ffae3944;margin:10px auto 30px;max-width:800px}.marquee:before,.marquee:after{content:'';position:absolute;left:25px;right:25px;height:8px;background:radial-gradient(circle,#fffbe0 3px,#ffc852 4px,transparent 5px) 0 0/30px 8px;filter:drop-shadow(0 0 5px #f2aa2e)}.marquee:before{top:9px}.marquee:after{bottom:9px}.brand{font-size:38px;font-weight:900;letter-spacing:-3px;color:#111;line-height:1.1}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2.5px;margin:12px 0;color:var(--gold)}.marquee .eyebrow{color:#365240;font-size:10px}h1{margin:10px 0;font-size:clamp(44px,7vw,78px);line-height:.95;text-transform:uppercase;font-weight:950;letter-spacing:-3px;color:#075034;text-shadow:1px 2px #e8bf61,2px 3px #69300c}h1 span{color:#a6171d}.tagline{font-size:13px;margin:15px 0 0}.connection{display:flex;justify-content:space-between;max-width:800px;margin:0 auto 22px;font-size:11px;letter-spacing:1.5px;font-weight:700;color:var(--gold)}.panel{background:linear-gradient(140deg,#0a4635,#062c22);padding:30px;border:1px solid #a78240;border-radius:18px;box-shadow:0 15px 40px #0004,inset 0 0 25px #0002}#join,#hostLogin{max-width:510px;margin:30px auto}h2{font-size:28px;line-height:1.2;margin:10px 0 18px}h3{font-size:19px;margin:0 0 20px}p{color:#d4dfd2}label{display:block;font-size:13px;margin:22px 0 8px;font-weight:650}input{width:100%;padding:15px;border:1px solid #bca36588;border-radius:8px;background:#031f18;color:var(--cream);font:inherit}button{font:inherit;font-weight:750;cursor:pointer;border-radius:8px;padding:14px 18px;color:var(--cream);border:1px solid #d8b46877;background:#14513d;touch-action:manipulation}button:hover{filter:brightness(1.13)}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #fff;outline-offset:4px}.gold{background:linear-gradient(#ffe6a0,#d5a342);color:#38250c;border:1px solid #ffe1a0;box-shadow:0 3px 0 #785019}form .gold{width:100%;margin-top:18px;display:flex;justify-content:space-between}.text{border:0;background:none;padding:6px;color:#e4cc94;font-size:12px;text-decoration:underline}#player{text-align:center;max-width:650px;margin:auto}.teamline{display:flex;justify-content:space-between;align-items:center;font-weight:700;padding-bottom:20px}#playerStatus{font-size:32px;margin-bottom:6px}#playerHint{margin-top:0}#buzz{width:min(70vw,300px);height:min(70vw,300px);border-radius:50%;margin:28px auto 0;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;z-index:1;border:7px solid #dca744;background:radial-gradient(circle at 40% 20%,#ffb4a7 0,#f64136 15%,#c3131d 45%,#6e0410 80%);box-shadow:inset 0 4px 5px #ffcbc3,0 14px 0 #360609,0 19px 0 #eac373,0 25px 0 #6e4517,0 30px 35px #000a;color:#fff5dc;text-shadow:0 3px 5px #550713}#buzz span{font-size:58px;font-weight:950;letter-spacing:3px}#buzz small{font-size:10px;letter-spacing:2px}#buzz:disabled{opacity:.65}#buzz:active:enabled{transform:translateY(9px);box-shadow:inset 0 4px 5px #ffcbc3,0 5px 0 #360609,0 10px 0 #eac373,0 16px 0 #6e4517}#buzz.won{background:radial-gradient(circle at 40% 20%,#c4ff9c,#0a854f 40%,#03452b 80%);opacity:1}.buzzerBase{width:80%;height:45px;margin:0 auto 30px;border-radius:50%;background:#6a1817;box-shadow:0 10px 0 #9e6527}.fine{font-size:12px;color:#acbeb0;line-height:1.6}.hostHeading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.hostGrid{display:grid;grid-template-columns:1.1fr 1fr;gap:22px;margin-bottom:22px}.winner{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:320px;border:2px solid #e4b855;background:radial-gradient(ellipse at center,#16613c,#052e21)}.winner h2{font-size:clamp(25px,4vw,42px);overflow-wrap:anywhere}.star{font-size:60px;color:var(--gold);text-shadow:0 0 24px #e9a533}.controls>button{display:block;width:100%;margin-bottom:14px}.switch{display:flex;gap:10px;align-items:center}.switch input{width:20px;height:20px;accent-color:#e4b95b}.copyrow{display:flex;gap:8px}.copyrow input{min-width:0;font-size:12px}.copyrow button{font-size:12px}ul,ol{list-style:none;padding:0;margin:0}li{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:15px 0;border-bottom:1px solid #ffffff18;overflow-wrap:anywhere}li strong{min-width:0}li small{font-size:11px;text-align:right;color:#becbbd;flex-shrink:0}.online{color:#bce8bb}.offline{color:#9ca89c}.pill{float:right;background:#ffffff10;font-size:12px;padding:4px 10px;border-radius:20px;color:var(--gold)}.empty{font-size:14px;padding:25px 0}.winner p{margin:6px 0}#error{background:#7a1722;color:#fff1cf;border:1px solid #e89d7c;border-radius:8px;padding:12px;max-width:800px;margin:15px auto}footer{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.5px;color:#aeaa83;margin:45px 0 10px}a{color:var(--gold)}[hidden]{display:none!important}@media(max-width:700px){main{padding:16px}.hostGrid{grid-template-columns:1fr}.panel{padding:23px}.marquee{padding:23px 12px}.brand{font-size:31px}.hostHeading h2{font-size:23px}.garland{letter-spacing:12px}.winner{min-height:260px}footer{font-size:8px;letter-spacing:1px}li{gap:8px}li small{max-width:140px}.teamline{font-size:14px}#playerStatus{font-size:27px}}
.marquee .tagline{color:#365240}

/* Preserve the exact hat logo and marquee lettering from the event poster.
   The original image stays intact; this viewport displays only its brand area. */
.poster-header{padding:0;overflow:hidden;border-radius:24px;background:#062e21;max-width:800px}
.poster-header:before,.poster-header:after{display:none}
.poster-window{width:100%;aspect-ratio:1.86;overflow:hidden;background:#f8e8c5}
.poster-art{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 25.35%}
.show-year{margin:0;padding:12px 10px;color:#ffe3a0;background:linear-gradient(90deg,#063b2b,#0a5139,#063b2b);font-size:10px;font-weight:800;letter-spacing:2.8px;border-top:1px solid #cf9a40}
.show-year span{display:inline-block;margin:0 10px;color:#ffcf65}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.poster-header{padding:0;border-radius:18px}.show-year{font-size:8px;letter-spacing:1.8px;padding:10px 6px}.show-year span{margin:0 5px}}

/* A slow, low-contrast shimmer over individual bulbs in the original artwork. */
.poster-window{position:relative}
.poster-lights{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
.poster-lights circle{fill:#fff0b0;opacity:.04;filter:drop-shadow(0 0 7px #ffc65c);animation:bulb-twinkle 7.5s ease-in-out infinite}
.poster-lights circle:nth-child(6n+1){animation-delay:-1.2s}
.poster-lights circle:nth-child(6n+2){animation-delay:-2.4s}
.poster-lights circle:nth-child(6n+3){animation-delay:-3.6s}
.poster-lights circle:nth-child(6n+4){animation-delay:-4.8s}
.poster-lights circle:nth-child(6n+5){animation-delay:-6s}
.poster-lights circle:nth-child(5n){animation-duration:9.5s}
.garland span{animation:garland-glow 6s ease-in-out infinite}
.garland span:nth-child(2){animation-delay:-1.5s}
.garland span:nth-child(3){animation-delay:-3s}
.garland span:nth-child(4){animation-delay:-4.5s}
@keyframes bulb-twinkle{0%,38%,100%{opacity:.04}58%{opacity:.55}78%{opacity:.12}}
@keyframes garland-glow{0%,100%{text-shadow:0 0 9px #ffab3144;opacity:.8}50%{text-shadow:0 0 18px #ffbd66aa;opacity:1}}
@media(prefers-reduced-motion:reduce){.poster-lights circle,.garland span{animation:none}.poster-lights circle{opacity:.08}}
/* Make the slow chase legible on phone screens and against the lit artwork. */
.poster-lights circle{r:6px;fill:#fff9d5;filter:drop-shadow(0 0 5px #fff0ac) drop-shadow(0 0 12px #ffbf43);animation-duration:4.8s}
.poster-lights circle:nth-child(5n){animation-duration:6.4s}
.poster-lights circle:nth-child(6n+1){animation-delay:-.8s}
.poster-lights circle:nth-child(6n+2){animation-delay:-1.6s}
.poster-lights circle:nth-child(6n+3){animation-delay:-2.4s}
.poster-lights circle:nth-child(6n+4){animation-delay:-3.2s}
.poster-lights circle:nth-child(6n+5){animation-delay:-4s}
@keyframes bulb-twinkle{0%,25%,100%{opacity:.02}50%{opacity:.95}75%{opacity:.1}}
.poster-header{animation:marquee-warmth 5.6s ease-in-out infinite}
@keyframes marquee-warmth{0%,100%{box-shadow:0 0 0 6px #681012,0 0 0 8px #cd8836,0 0 20px #ffae3933}50%{box-shadow:0 0 0 6px #681012,0 0 0 8px #edc574,0 0 38px #ffc75c88}}
.garland span{animation-duration:4.8s}
@keyframes garland-glow{0%,100%{text-shadow:0 0 5px #ffab3133;opacity:.65}50%{text-shadow:0 0 8px #ffdf8a,0 0 24px #ffb638;opacity:1;color:#ffcf72}}
@media(prefers-reduced-motion:reduce){.poster-header,.poster-lights circle,.garland span{animation:none}.poster-lights circle{opacity:.08}}
/* Dim the printed bulb cores gently, then reveal their original white glow.
   Bright overlays alone disappear against the poster's already-white bulbs. */
.poster-lights circle{fill:#59310e;filter:none;r:7px}
@keyframes bulb-twinkle{0%,22%,100%{opacity:.58}50%{opacity:0}76%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.poster-lights circle{opacity:0}}
select{width:100%;padding:12px;border:1px solid #bca36588;border-radius:8px;background:#031f18;color:var(--cream);font:inherit;margin-bottom:18px}.display-link{display:block;margin-bottom:16px;font-weight:700}.score-controls{display:flex;align-items:center;gap:6px;flex-shrink:0}.score-controls button{padding:6px 9px;font-size:12px}.score-controls strong{font-size:12px;min-width:38px}.room-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px}.room-toolbar button{font-size:12px;padding:10px 14px;margin-left:8px}.room-announcement{text-align:center;margin:22px 0 30px;padding:25px;border:1px solid #b68e43;border-radius:18px;background:#073b2bee;transition:background .3s}.room-announcement h2{font-size:clamp(32px,4.5vw,66px);color:#ffe5a1;margin:8px 0;overflow-wrap:anywhere}.room-announcement p:last-child{margin:8px 0}.has-winner .room-announcement{background:radial-gradient(ellipse,#7a301b,#143c28);border-color:#ffe09a;box-shadow:0 0 35px #f7b94044}.podium-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:20px}.podium{text-align:center;border:2px solid #a78240;border-radius:20px;padding:18px 14px;background:linear-gradient(#0b503a,#06271f);position:relative}.podium h3{font-size:clamp(20px,2.3vw,30px);margin:10px 0;overflow-wrap:anywhere}.podium-status{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#c8e3c7;margin:0}.podium-lamp{width:100px;height:70px;border-radius:70px 70px 18px 18px;margin:20px auto;background:radial-gradient(circle at 35% 20%,#e97a64,#aa101e 45%,#430610);border:4px solid #c99b4c;box-shadow:0 8px 0 #77501d;color:#ffc6b0;display:grid;place-items:center;font-size:30px;font-weight:900}.podium-score{display:block;font-size:24px;color:#ffe2a0;margin-top:24px}.podium small{display:block;font-size:10px;color:#c2cbb6;margin-top:10px}.podium.disconnected{opacity:.5}.podium.buzzed .podium-lamp{background:radial-gradient(circle at 35% 20%,#fff6bc,#f5ba42 48%,#d66f1c);color:#66330b;box-shadow:0 8px 0 #77501d,0 0 35px #ffd36388}.podium.first{border-color:#ffe69c;box-shadow:0 0 24px #efba5066;background:linear-gradient(#56713a,#143c28)}.podium.first .podium-status{color:#ffdf83}.podium.just-buzzed{animation:podium-reveal 1.2s ease-out}.room-join{text-align:center;letter-spacing:2px;font-size:12px;margin:32px 0}.room-join strong{display:block;color:#ffe3a2;font-size:clamp(18px,2.5vw,32px);letter-spacing:.5px}.room-offline{opacity:.65}.room-leaderboard{max-width:1000px;margin:auto;counter-reset:rank}.room-leaderboard li{background:#073d2e;border:1px solid #a78240;border-radius:12px;padding:20px 28px;margin-bottom:12px;font-size:clamp(20px,3vw,36px);gap:25px}.room-leaderboard li>strong{flex:1}.room-leaderboard li>span{color:#ffe09b}.leaderboard-title{text-align:center;color:#ffdf90}.display-page main{max-width:1600px}.display-page .poster-header{max-width:460px;margin:8px auto 20px}.display-page .connection{max-width:none}.display-page footer{margin-top:25px}.display-page .show-year{font-size:8px}.display-page .garland{height:36px;font-size:22px}@keyframes podium-reveal{0%{transform:translateY(-6px);filter:brightness(1.5)}100%{transform:translateY(0);filter:brightness(1)}}@media(min-width:1100px){.display-page .poster-header{max-width:420px}.display-page .room-announcement{margin-top:10px}.display-page .podium-grid:has(.podium:nth-child(9)){grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}@media(max-width:700px){.room-toolbar{align-items:flex-start;flex-direction:column}.room-toolbar button{margin:0 5px 5px 0}.podium-grid{grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:12px}.podium{padding:15px 9px}.score-controls{flex-wrap:wrap}.display-page .poster-header{max-width:350px}.room-leaderboard li{padding:15px;gap:12px}}@media(prefers-reduced-motion:reduce){.podium.just-buzzed{animation:none}}
