/* Alpha 0.3.11: media takes the viewport; live controls and scoring remain independent. */
.media-spotlight { position:fixed; inset:0; z-index:3000; box-sizing:border-box; display:grid; grid-template-rows:minmax(0,1fr) auto; gap:10px; padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); background:#07101bf5; color:#f5f8ff; animation:mediaSpotlightIn .2s ease-out; }
.media-spotlight[hidden] { display:none; }
.media-spotlight-mount { min-height:0; min-width:0; display:grid; place-items:center; }
.media-spotlight .question-media { width:100%; height:100%; max-width:none; max-height:none; margin:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.media-spotlight .question-media img,.media-spotlight .question-media video,.media-spotlight .question-media iframe { display:block; flex:1 1 0; min-height:0; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; border:0; border-radius:5px; }
.media-spotlight .question-media video { margin:0; }
.media-spotlight .giphy-media a { color:#e7dcff; font-size:13px; flex:0 0 auto; }
.media-spotlight .media-status { color:#c7d8ec; margin:0; font-size:13px; flex:0 0 auto; }
.media-spotlight-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.media-spotlight-caption { flex:1; font-size:clamp(13px,1.5vw,20px); line-height:1.25; }
.media-spotlight-footer .btn { flex:0 0 auto; min-height:44px; }
.media-spotlight-footer .btn[hidden] { display:none; }
.media-spotlight-placeholder { width:100%; }
@keyframes mediaSpotlightIn { from { opacity:.35; transform:scale(.95); } to { opacity:1; transform:scale(1); } }

.final-results { --podium-gold:#f8ca50; --podium-silver:#d8e4ee; --podium-bronze:#ce945f; display:grid; gap:18px; }
.final-heading { text-align:center; }
.final-heading h1 { font-size:clamp(28px,3.6vh,52px); line-height:1.05; margin:0; }
.final-heading p { color:var(--muted); margin:5px 0 0; font-size:16px; }
.final-results h2 { font-size:20px; margin:0 0 9px; line-height:1.2; }
.final-round-winners { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:9px; }
.final-round-winner { display:flex; flex-direction:column; gap:4px; padding:10px 12px; border:1px solid #59738b; background:#182d43; border-radius:10px; overflow-wrap:anywhere; }
.final-round-winner>span:first-child { color:#b7cce1; font-size:14px; line-height:1.2; }
.final-round-winner>strong { font-size:18px; line-height:1.18; }
.final-podium-section { text-align:center; }
.final-podium-section>.phase { margin-bottom:3px; }
.final-podium-section>h2 { font-size:clamp(24px,3vh,40px); }
.final-podium { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; gap:12px; max-width:1180px; margin:0 auto; padding-top:10px; }
.podium-place { min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; }
.podium-team-list { width:100%; display:grid; gap:10px; padding:0 4px 7px; }
.podium-team { display:grid; gap:3px; line-height:1.12; }
.podium-team-name { font-size:clamp(20px,2.6vh,36px); font-weight:900; overflow-wrap:anywhere; }
.podium-score { font-size:clamp(17px,2.1vh,27px); }
.podium-score span { font-size:.65em; color:var(--muted); }
.podium-team small { color:#bccfe2; font-size:12px; line-height:1.3; }
.podium-place .award-trophy { width:clamp(70px,10vh,128px); height:clamp(70px,10vh,128px); filter:drop-shadow(0 4px 10px #0005); }
.podium-pedestal { width:100%; box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:9px 9px 3px 3px; border:1px solid #ffffff50; box-shadow:inset -14px 0 #0002,0 8px 16px #0004; color:#172639; }
.podium-pedestal>strong { font-size:clamp(27px,4.3vh,55px); font-weight:950; line-height:1; }
.podium-pedestal>span { font-size:clamp(11px,1.4vh,18px); font-weight:850; margin-top:5px; }
.podium-place-1 .podium-pedestal { height:clamp(100px,12vh,145px); background:linear-gradient(135deg,#ffe49a,var(--podium-gold)); }
.podium-place-2 .podium-pedestal { height:clamp(74px,9vh,108px); background:linear-gradient(135deg,#f3f8fd,var(--podium-silver)); }
.podium-place-3 .podium-pedestal { height:clamp(52px,6.4vh,76px); background:linear-gradient(135deg,#e9bd91,var(--podium-bronze)); }
.podium-empty-trophy { height:70px; display:grid; place-items:center; color:var(--muted); font-size:30px; }
.podium-no-team { font-size:13px; color:var(--muted); }
.podium-place.unawarded .podium-pedestal { background:#344a60; color:#bdccdc; }
.final-tie { font-size:12px; color:var(--amber); font-weight:750; }
.my-podium-team { border:2px solid var(--cyan); border-radius:8px; padding:7px 4px; }
.final-remaining { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.final-team { display:flex; align-items:center; gap:9px; border:1px solid #47617a; border-radius:9px; background:#152b40; padding:9px 11px; min-width:0; }
.final-team-rank { color:#b9d6ee; font-size:22px; font-weight:900; min-width:26px; font-variant-numeric:tabular-nums; }
.final-team-main { display:grid; gap:4px; min-width:0; flex:1; }
.final-team-main>strong { font-size:17px; line-height:1.12; overflow-wrap:anywhere; }
.final-team-stats { color:#bbcbde; font-size:11px; line-height:1.3; }
.final-team-score { font-size:20px; text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.final-team-score small { display:block; font-size:11px; color:var(--muted); }
.final-team.my-final-team { border:2px solid var(--cyan); }
.final-thanks { text-align:center; font-size:15px; color:var(--muted); margin:0; }
.final-results .leaderboard-page-label { font-size:16px; margin-top:7px; }
.finished-presentation .presentation-stage { overflow:auto; }
.presentation .final-results { gap:12px; }
.presentation .final-round-winners { grid-template-columns:repeat(4,minmax(0,1fr)); }
.presentation .final-round-winner>span:first-child { font-size:clamp(16px,1.9vh,25px); }
.presentation .final-round-winner>strong { font-size:clamp(20px,2.4vh,32px); }
.presentation .final-results h2 { font-size:clamp(21px,2.5vh,34px); }
.presentation .final-podium-section>h2 { font-size:clamp(27px,3.2vh,44px); margin-bottom:3px; }
.presentation .final-remaining { grid-template-columns:repeat(3,minmax(0,1fr)); }
.presentation .final-team-main>strong { font-size:clamp(19px,2.3vh,30px); }
.presentation .final-team-score { font-size:clamp(23px,2.8vh,36px); }
.presentation .final-team-stats { font-size:clamp(13px,1.55vh,20px); }
.presentation .podium-team small { font-size:clamp(14px,1.6vh,21px); }
.presentation .final-results .leaderboard-page-label { font-size:clamp(17px,2vh,25px); }
.player-shell .final-results { gap:16px; }
.player-shell .final-heading h1 { font-size:28px; }
.player-shell .final-heading p { font-size:13px; }
.player-shell .final-round-winners { grid-template-columns:minmax(0,1fr); gap:6px; }
.player-shell .final-round-winner { padding:8px 10px; gap:3px; }
.player-shell .final-round-winner>span:first-child { font-size:12px; }
.player-shell .final-round-winner>strong { font-size:15px; }
.player-shell .final-podium { gap:6px; padding-top:5px; }
.player-shell .podium-team-list { padding:0 0 6px; }
.player-shell .podium-team-name { font-size:clamp(14px,4vw,19px); }
.player-shell .podium-score { font-size:16px; }
.player-shell .podium-team small { font-size:10px; line-height:1.3; }
.player-shell .podium-place .award-trophy { width:68px; height:68px; max-width:100%; }
.player-shell .podium-pedestal>strong { font-size:32px; }
.player-shell .podium-pedestal>span { font-size:10px; }
.player-shell .podium-place-1 .podium-pedestal { height:104px; }
.player-shell .podium-place-2 .podium-pedestal { height:78px; }
.player-shell .podium-place-3 .podium-pedestal { height:55px; }
.player-shell .final-remaining { grid-template-columns:minmax(0,1fr); }
.player-shell .final-team-main>strong { font-size:16px; }
.player-shell .final-team-score { font-size:19px; }
@media (max-width:700px) { .media-spotlight-footer { flex-wrap:wrap; gap:7px; } .media-spotlight-caption { flex:1 0 100%; font-size:12px; } .media-spotlight-footer .btn { padding:8px 10px; font-size:12px; } }
@media (prefers-reduced-motion:reduce) { .media-spotlight { animation:none; } }
