/* Approved sports-game target: chrome bevels, charcoal question belt, red/blue teams. */
@font-face{font-family:'Fusion Pixel Sport';src:url('assets/fonts/fusion-pixel-12px-proportional-zh_hant.ttf.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Tug Sans TC';src:url('assets/fonts/noto-sans-tc-black.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Tug Sport';src:url('assets/fonts/barlow-condensed-black-italic.woff2') format('woff2');font-weight:900;font-style:italic;font-display:swap}
:root{--paper:#f5f1df;--metal:#d3d4c5;--ink:#111815;--green:#16742e;--red:#db252b;--blue:#087fe0;--edge:24px;--answer-size:24px;--cut:12px;color-scheme:dark;font-family:'Fusion Pixel Sport','Microsoft JhengHei',sans-serif;font-synthesis:none}
body{background:#1d3023;color:#fff}
button,input,select{font-family:inherit;font-weight:400}
button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #c6ff42;outline-offset:4px}
.screen-shade{background:linear-gradient(180deg,#15291b26,transparent 25%,transparent 70%,#181b1638)}
.hud{inset:18px var(--edge) auto;gap:14px;filter:drop-shadow(3px 5px 0 #111811b0)}
.hud h1{padding:8px 21px 11px 18px;color:#fff;font-size:clamp(24px,2.4vw,42px);font-weight:400;line-height:1.15;letter-spacing:.02em;transform:skewX(-13deg);border:3px solid var(--paper);background:linear-gradient(#274633,#14291c 50%,#0c1810 51%);box-shadow:inset 0 0 0 3px #101612,inset 0 0 0 5px #8d9a81;text-shadow:2px 3px 0 #0b130d;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.hud h1::before{content:'';display:inline-block;width:7px;height:.95em;margin-right:10px;vertical-align:-2px;background:#ef333b;box-shadow:-6px 0 0 #fff,-11px 0 0 #c92129}
.hud h1 span{letter-spacing:.08em;margin-right:7px}
.tools{gap:10px}
.icon-button{width:46px;height:46px;font-family:'Segoe UI Symbol','Microsoft JhengHei',sans-serif;font-size:27px;color:#fff;background:linear-gradient(#3c4039,#1c211c 52%,#101610 53%);border:3px solid #e5e5d6;border-radius:0;box-shadow:inset 0 0 0 2px #141914,inset 0 0 0 4px #71786a;clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px)}
.icon-button:hover{filter:brightness(1.25)}
.icon-button:active{transform:translateY(3px);filter:brightness(1.5)}
.sound-toggle[aria-pressed=true]{color:#9da397;filter:brightness(.8)}
.scoreboard{gap:6px;text-shadow:3px 3px 0 #0c1611;font-weight:400;filter:drop-shadow(2px 3px 0 #0a130f)}
.scoreboard>span:not(.versus){display:block;min-width:88px;padding:3px 17px 6px;color:#fff;font-size:60px;line-height:1;text-align:center;transform:skewX(-14deg);border:3px solid #f6f6e9;box-shadow:inset 0 0 0 2px #151c15,inset 0 0 0 4px #ffffff69;clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%)}
.redscore{background:linear-gradient(#f74a53,#cc1425 52%,#a91220 53%)}
.bluescore{background:linear-gradient(#1baeff,#0075db 52%,#0453a3 53%)}
.versus{font-size:36px;font-style:italic;color:#f4f3e7;letter-spacing:-3px;padding:0 3px;-webkit-text-stroke:1px #152018}
.question-hud{top:106px;width:min(1320px,83%);padding:14px 18px 18px 24px;color:#fff;border:3px solid #f2efdc;box-shadow:inset 0 0 0 3px #111812,inset 0 0 0 5px #848a79;filter:drop-shadow(4px 6px 0 #11170fb3);background:linear-gradient(#373b36,#1e211d 49%,#10140f 50%,#1c211a);clip-path:polygon(20px 0,calc(100% - 16px) 0,100% 16px,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 25px)}
.question-meta{position:absolute;right:128px;top:8px;font-size:10px;line-height:1.1;color:#c7d3bd;opacity:.84;gap:20px;margin:0}
.question-meta #unit{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.question-meta #counter{white-space:nowrap}
.question-row{gap:22px;min-height:42px}
.question-row h2{padding-top:6px;font-size:clamp(24px,2.12vw,36px);line-height:1.35;font-weight:400;letter-spacing:.025em;text-shadow:2px 3px 0 #090e09;text-wrap:pretty}
.timer{position:relative;min-width:94px;height:59px;align-self:stretch;max-height:80px;font-size:43px;line-height:1;color:#fff;background:linear-gradient(#258b39,#0b5821 55%,#0a401a);border:3px solid #e6ebcf;box-shadow:inset 0 0 0 2px #0b2110,inset 0 0 0 4px #75a66b;text-shadow:2px 2px 0 #062b10;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);padding-left:17px}
.timer::before{content:'◷';position:absolute;left:7px;font-size:20px;color:#d9e9d3}
.timer.urgent{background:linear-gradient(#e34e3b,#a91e19);animation:timer-pulse .5s steps(2,end) infinite}
.time-track{height:3px;background:#71806a4a}.time-track i{background:#85d434}
.battle-announcement{padding:8px 24px 12px;font-size:clamp(30px,3.6vw,56px);line-height:1.1;color:#fff;font-weight:400;text-shadow:3px 4px 0 #162016;filter:drop-shadow(3px 5px 0 #111810bd);background:linear-gradient(#4a5244,#1b251a);border:3px solid #f5f3e4;box-shadow:inset 0 0 0 3px #111c12;clip-path:polygon(18px 0,100% 0,calc(100% - 18px) 100%,0 100%)}
.battle-announcement.red{background:linear-gradient(#e94945,#97111c)}.battle-announcement.blue{background:linear-gradient(#209de8,#075494)}
.pull-gauge{width:min(390px,32vw);height:18px;gap:0;filter:drop-shadow(2px 3px 0 #172016)}
.pull-gauge>span{display:none}
.pull-gauge>div{height:18px;border:3px solid #f9f6e1;box-shadow:0 0 0 2px #172016,inset 0 0 0 2px #172016;background:linear-gradient(180deg,#ffffff77 0 22%,transparent 23%),linear-gradient(90deg,#e02b38 0 49.6%,#0c83e4 50.4% 100%);clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,9px 100%,0 50%)}
.pull-gauge i{top:-2px;width:12px;height:16px;background:#f3f4c9;border:2px solid #111c11;clip-path:polygon(0 0,100% 0,100% 50%,50% 100%,0 50%)}

/* The side rail frees both answer rows for real question text. */
.answer-dock{left:var(--edge);right:var(--edge);bottom:18px;gap:clamp(30px,5.5vw,112px);filter:drop-shadow(3px 6px 0 #181c16b8)}
.control-deck{left:var(--edge);right:var(--edge);bottom:18px;gap:14px}
.team-panel{--team:#d52b32;--team-dark:#6b111b;--team-light:#ff6f67;grid-template-columns:88px minmax(0,1fr);gap:9px;padding:11px 13px 13px 9px;border:3px solid #f3ead8;background:linear-gradient(130deg,#b92e33 0%,#5a0f18 22%,#240e14 80%);box-shadow:inset 0 0 0 2px #241614,inset 0 0 0 5px var(--team-light),inset 0 0 0 7px #290d13;clip-path:polygon(16px 0,calc(100% - 13px) 0,100% 13px,100% calc(100% - 16px),calc(100% - 16px) 100%,13px 100%,0 calc(100% - 13px),0 17px)}
.blue-panel{--team:#087cce;--team-dark:#064c82;--team-light:#5ac6ff;background:linear-gradient(130deg,#0b84d9 0%,#064d83 22%,#081c2d 80%)}
.team-panel>header{padding:0 0 3px;gap:10px}
.team-panel h2{color:#fff;font-size:28px;font-weight:400;line-height:1.1;text-shadow:2px 3px 0 var(--team-dark);letter-spacing:1px;transform:skewX(-10deg);background:linear-gradient(var(--team-light),var(--team) 24%,var(--team-dark));border:2px solid #f5e8d6;box-shadow:inset 0 0 0 2px var(--team-dark);padding:6px 7px 9px;clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%)}
.team-emblem{display:none}
.cooldown{width:70px;height:70px;border:3px solid #101c12;border-radius:50%;background:radial-gradient(circle,#252d25 0 48%,#0b140d 50% 55%,#6c755f 57% 100%);color:#ddf7cb;box-shadow:0 0 0 2px #e8e5c8,inset 0 0 0 3px #122012}
.cooldown circle{stroke-width:6}.ring-track{stroke:#808b73}.ring-progress{stroke:#9dee21;stroke-dasharray:100;stroke-dashoffset:0;stroke-linecap:butt}.cooldown svg{padding:2px}
.cooldown::after{content:'';position:absolute;inset:1px;border-radius:50%;background:repeating-conic-gradient(transparent 0 25deg,#182017 25deg 30deg);mask:radial-gradient(circle,transparent 0 62%,#000 64%);pointer-events:none}
.cooldown span{font-size:24px;line-height:1;text-shadow:1px 2px 0 #0c190f}.cooldown.cooling .ring-progress{stroke:#b8f84c}.cooldown.cooling span{color:#fff}
.options{gap:9px}
.option{min-height:74px;padding:10px 11px 12px 7px;gap:10px;color:#111610;background:linear-gradient(#fffff1,#e8e7d7 60%,#c8cbbb);border:3px solid #1c2018;border-radius:0;box-shadow:inset 0 0 0 2px #fffceb,inset -4px -5px 0 #8d9484;font-size:var(--answer-size);font-weight:400;line-height:1.15;filter:drop-shadow(1px 3px 0 #10160f);clip-path:polygon(9px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:transform .055s,filter .055s}
.option .letter{width:35px;min-height:41px;align-self:stretch;padding:3px 0;font-size:30px;line-height:1;color:#fff;background:linear-gradient(var(--team-light),var(--team) 35%,var(--team-dark));border:2px solid #fff8dd;box-shadow:0 0 0 1px #1c2218,inset -2px -2px 0 var(--team-dark);transform:skewX(-8deg);text-shadow:2px 2px 0 var(--team-dark)}
.option:hover:not(:disabled){filter:brightness(1.12) drop-shadow(1px 3px 0 #10160f)}
.option:active:not(:disabled),button.key-pressed{transform:translateY(4px);filter:brightness(1.25) drop-shadow(0 1px 0 #10160f);box-shadow:inset 3px 4px 0 #a0ad8c}
.option:disabled{filter:saturate(.4) brightness(.83) drop-shadow(1px 3px 0 #10160f)}
.option.wrong{color:#7c2d27;background:linear-gradient(#e7c7b7,#ad8573);filter:saturate(.65);box-shadow:inset 0 0 0 2px #e8b5a4,inset -4px -5px 0 #79574b}
.option.wrong .letter{background:#6a514b;color:#c9b7aa;border-color:#aa887b}
.option.correct{color:#fff;background:linear-gradient(#5bbf3e,#1c7a2e 65%,#12511f);border-color:#eaffd4;box-shadow:inset 0 0 0 2px #16431c,inset -4px -5px 0 #16431c;filter:brightness(1.12) drop-shadow(1px 3px 0 #10160f);text-shadow:1px 2px 0 #14511d}
.option.correct .letter{color:#144b1c;background:#e8f4cf;border-color:#f7ffe9;text-shadow:none;box-shadow:inset -2px -2px 0 #a1bb85}
.option.correct::after{content:'✓';position:absolute;top:2px;right:5px;color:#fff;font-size:12px}
.team-panel.cooling .options{filter:none}
.game-footer{left:var(--edge);right:var(--edge);bottom:calc(18px + 174px + 14px);height:32px;gap:12px;pointer-events:none}
.game-footer>*{pointer-events:auto}
.game-footer>#status{font-size:12px;color:#fff;line-height:1.2;text-shadow:1px 2px 0 #1e2e18;background:#142319a3;padding:4px 10px;border-radius:2px}
.game-footer>#status:empty{display:none}
.game-footer>.icon-button{position:absolute;left:0;width:31px;height:31px;font-size:21px;opacity:.85}
.next{min-height:42px;padding:7px 25px 11px;color:#fff;background:linear-gradient(#46a245,#166d2c 50%,#10541f 51%);border:3px solid #f3f2dc;box-shadow:inset 0 0 0 2px #122a15,inset 0 0 0 4px #6eae59;clip-path:polygon(9px 0,100% 0,calc(100% - 9px) 100%,0 100%);font-size:24px;line-height:1;font-weight:400;filter:drop-shadow(2px 4px 0 #132114);text-shadow:1px 2px 0 #0f3816}
.next:active{transform:translateY(3px);filter:brightness(1.2)}
.answer-note summary{font-family:'Segoe UI Symbol',sans-serif;color:#fff;font-size:28px;text-shadow:2px 3px 0 #152316}
.answer-note .feedback{padding:16px 20px;font-family:'Microsoft JhengHei',sans-serif;font-size:20px;font-weight:700;line-height:1.5;color:#202a1c;background:#f5f2de;border:3px solid #213021;border-left:9px solid #1a782e;box-shadow:4px 5px 0 #172219a6}
.overlay{background:#111b11ce;backdrop-filter:blur(5px)}
.dialog{padding:23px;color:#e9efdb;background:linear-gradient(#333d30,#172819);border:4px solid #e7e9d2;box-shadow:inset 0 0 0 3px #152314,8px 10px 0 #0b180ed9;clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px)}
.dialog>header{margin-bottom:14px}.dialog h2{font-size:30px;font-weight:400}
.setting{gap:16px;padding:16px 0;border-top:2px solid #94a78035}.setting label{font-size:24px;line-height:1.2}.setting select{color:#1b2a18;background:#f3f1dc;border:2px solid #b9c7a3;padding:6px 10px;font-size:24px}
.group-setting label small{display:block;margin-top:5px;color:#c9d8ba;font:12px/1.4 'Microsoft JhengHei',sans-serif}.group-setting select{font-family:'Tug Sans TC','Microsoft JhengHei',sans-serif;font-weight:900;font-size:20px}
.audio-setting-row{grid-template-columns:100px 1fr 50px;gap:10px}.audio-setting-row input{accent-color:#a9ec3a}.audio-setting-row output{font-size:24px}
.key-guide{font-size:24px;line-height:1.4;gap:8px;padding-top:12px}.key-guide p{font-family:'Microsoft JhengHei',sans-serif;font-size:16px;line-height:1.6;color:#c9d8ba;margin:8px 0}
.red-text{color:#ff9a92}.blue-text{color:#8fd0ff}.custom-art{font-family:'Microsoft JhengHei',sans-serif;color:#c4d2b7;font-size:15px;margin-top:12px}.custom-art .setting label{font-size:18px}.custom-art input{font-size:12px}
.score-pop{animation:score-pop .45s ease-out}.wrong-flash{animation:wrong-flash .2s ease-out}.answer-flash{animation:answer-flash .45s ease-out}
@keyframes score-pop{35%{scale:1.22;filter:brightness(1.5)}}@keyframes wrong-flash{30%{translate:-4px}65%{translate:4px}}@keyframes answer-flash{40%{filter:brightness(1.4)}}@keyframes timer-pulse{50%{filter:brightness(1.6)}}
@media(min-width:1600px) and (min-height:850px){
 :root{--edge:36px;--answer-size:32px}
 .hud{top:24px}.hud h1{padding:10px 24px 13px}.icon-button{width:56px;height:56px;font-size:34px}.tools{gap:15px}.scoreboard>span:not(.versus){font-size:78px;min-width:112px}.versus{font-size:48px}
 .question-hud{top:142px;padding:17px 22px 21px 30px}.question-meta{font-size:16px;margin-right:138px}.question-row h2{font-size:36px}.timer{min-width:120px;height:76px;font-size:56px;padding-left:24px}.timer::before{font-size:25px;left:9px}
 .answer-dock{bottom:22px}.team-panel{grid-template-columns:116px minmax(0,1fr);gap:13px;padding:15px 18px 17px 12px}.team-panel h2{font-size:36px;padding:9px 12px 12px}.cooldown{width:92px;height:92px}.cooldown span{font-size:30px}.options{gap:12px}.option{min-height:98px;padding:13px 14px 16px 11px;gap:14px}.option .letter{width:45px;min-height:54px;font-size:40px}
 .game-footer{bottom:calc(22px + 231px + 18px);height:40px}.game-footer>#status{font-size:16px}.next{font-size:30px;min-height:50px}.pull-gauge{height:23px;width:500px}.pull-gauge>div{height:23px}.pull-gauge i{width:15px;height:20px}
}
@media(max-width:1100px){
 :root{--edge:16px;--answer-size:21px}
 .hud{top:13px}.hud h1{font-size:24px;padding:8px 13px 10px}.hud h1::before{margin-right:6px}.scoreboard>span:not(.versus){min-width:65px;font-size:48px;padding:3px 13px 6px}.versus{font-size:28px}.tools{gap:6px}.icon-button{width:37px;height:37px;font-size:23px}
 .question-hud{top:90px;width:90%;padding:11px 15px 16px 20px}.question-row h2{font-size:24px}.timer{min-width:78px;height:53px;font-size:36px}.question-meta{margin-right:90px}
 .answer-dock{gap:25px;bottom:16px}.team-panel{grid-template-columns:70px minmax(0,1fr);gap:7px;padding:10px 10px 12px 7px}.team-panel h2{font-size:24px;padding:6px 5px 8px}.cooldown{width:58px;height:58px}.cooldown span{font-size:21px}.option{min-height:70px;padding:8px 8px 11px 6px;gap:7px}.option .letter{width:27px;font-size:25px;min-height:37px}.options{gap:8px}.game-footer{bottom:calc(16px + 166px + 13px)}
}
@media(min-width:1101px) and (max-width:1599px){
 :root{--answer-size:22px}
 .team-panel{grid-template-columns:64px minmax(0,1fr);gap:7px;padding:11px 10px 13px 8px}
 .team-panel h2{font-size:24px;padding:6px 4px 9px;letter-spacing:0}.cooldown{width:56px;height:56px}.cooldown span{font-size:21px}
 .option{gap:7px;padding:9px 8px 11px 6px}.option .letter{width:28px;font-size:27px}
}
@media(min-width:1050px) and (max-width:1100px){
 .team-panel{grid-template-columns:54px minmax(0,1fr)}
 .team-panel h2{font-size:23px;padding:6px 3px 8px;letter-spacing:0}
 .cooldown{width:49px;height:49px}.cooldown span{font-size:18px}
 .option{gap:4px;padding-left:4px;padding-right:4px}.option .letter{width:24px}
}
@media(max-height:650px) and (min-width:750px){
 :root{--answer-size:20px}.hud{top:8px}.hud h1{font-size:24px;padding:6px 14px 8px}.scoreboard>span:not(.versus){font-size:42px;min-width:65px}.versus{font-size:28px}.icon-button{width:35px;height:35px;font-size:22px}
 .question-hud{top:71px;padding:8px 16px 13px 20px}.question-meta{font-size:10px;margin-bottom:3px}.question-row{min-height:35px}.question-row h2{font-size:22px;line-height:1.22}.timer{height:43px;font-size:32px;min-width:76px}.time-track{bottom:6px}
 .answer-dock{bottom:12px}.option{min-height:64px;padding:7px 8px 10px 6px;gap:7px}.option .letter{width:29px;min-height:35px;font-size:26px}.team-panel{grid-template-columns:75px minmax(0,1fr);padding:9px 10px 11px 7px;gap:8px}.team-panel h2{font-size:24px}.cooldown{width:58px;height:58px}.cooldown span{font-size:21px}.game-footer{bottom:calc(12px + 152px + 10px);height:28px}.next{min-height:36px;font-size:21px;padding:5px 20px 8px}.battle-announcement{top:30%;font-size:32px}
}
@media(max-width:749px){
 :root{--edge:10px;--answer-size:18px}.hud{top:10px;align-items:flex-start}.hud h1{font-size:18px;padding:6px 9px 8px}.hud h1::before{width:4px;box-shadow:-4px 0 0 #fff,-8px 0 0 #c92129;margin-right:5px}.hud h1 span{margin-right:2px}.tools{gap:4px}.icon-button{width:32px;height:32px;font-size:20px}.scoreboard{top:52px}.scoreboard>span:not(.versus){min-width:58px;font-size:36px;padding:3px 13px 6px}.versus{font-size:24px}
 .question-hud{top:115px;width:94%;padding:10px 12px 15px 17px}.question-meta{font-size:10px;margin-right:64px;margin-bottom:4px}.question-row{gap:10px}.question-row h2{font-family:'Microsoft JhengHei',sans-serif;font-size:20px;line-height:1.35;font-weight:800}.timer{min-width:60px;height:48px;font-size:30px;padding-left:10px}.timer::before{font-size:15px;left:4px}
 .answer-dock{bottom:12px;gap:12px}.team-panel{grid-template-columns:1fr;gap:7px;padding:8px 8px 11px}.team-panel>header{flex-direction:row;justify-content:space-between;padding:0 2px;gap:4px}.team-panel h2{font-size:22px;padding:5px 8px 7px}.cooldown{width:37px;height:37px}.cooldown span{font-size:15px}.cooldown circle{stroke-width:5}.options{grid-template-columns:1fr;gap:6px}.option{min-height:49px;font-family:'Microsoft JhengHei',sans-serif;font-size:18px;font-weight:800;line-height:1.2;padding:6px 7px 9px;gap:7px}.option .letter{font-family:'Fusion Pixel Sport',sans-serif;width:26px;min-height:29px;font-size:24px}
 .game-footer{bottom:calc(12px + 284px + 9px);height:28px}.game-footer>#status{font-size:10px}.next{font-size:20px;min-height:34px;padding:5px 17px 8px}.game-footer>.icon-button{width:28px;height:28px;font-size:18px}.pull-gauge{top:57%;width:37vw;height:14px}.pull-gauge>div{height:14px;border-width:2px}.pull-gauge i{height:14px;width:10px}.battle-announcement{font-size:28px;top:34%;padding:7px 18px 10px}.dialog{padding:18px}.setting label,.setting select,.audio-setting-row output{font-size:20px}.audio-setting-row{grid-template-columns:85px 1fr 42px}.key-guide{font-size:20px}
}
/* Footer follows the real card height, including wrapped answers. */
/* Counter floats above the sentence rather than adding another line of HUD. */
.question-meta{margin:0}
@media(min-width:1600px) and (min-height:850px){.question-meta{right:158px;top:9px;font-size:12px}}
@media(max-width:1100px){.question-meta{right:110px;font-size:10px}}
@media(max-width:749px){.question-meta{right:82px;font-size:10px}}
@media(min-width:1600px) and (min-height:850px){.control-deck{bottom:22px;gap:18px}}
@media(max-width:1100px){.control-deck{bottom:16px;gap:12px}}
@media(max-height:650px) and (min-width:750px){.control-deck{bottom:12px;gap:9px}}
@media(max-width:749px){.control-deck{bottom:12px;gap:9px}}

/* Match the reference's solid sports lettering with embedded real 900-weight faces. */
.hud h1,.question-row h2,.team-panel h2,.option,.next,.battle-announcement{
 font-family:'Tug Sans TC','Microsoft JhengHei',sans-serif;font-weight:900;font-synthesis:none;
}
.hud h1{font-size:clamp(26px,2.65vw,44px);letter-spacing:-.035em;-webkit-text-stroke:.5px #fff;paint-order:stroke fill;text-shadow:2px 3px 0 #061008,3px 4px 0 #061008}
.hud h1 span{font-family:'Tug Sport',Impact,sans-serif;font-style:italic;font-weight:900;letter-spacing:0}
.scoreboard{gap:11px}
.number-glyph{display:inline-block;transform:scaleX(1.18);transform-origin:center;white-space:nowrap}
.scoreboard>span:not(.versus){font-family:'Tug Sport',Impact,sans-serif;font-weight:900;font-synthesis:none;font-style:italic;letter-spacing:0;line-height:1;padding-top:1px;padding-bottom:8px;-webkit-text-stroke:1px #fff;paint-order:stroke fill;text-shadow:3px 3px 0 #141a14,4px 4px 0 #141a14}
.versus{font-family:'Tug Sport',Impact,sans-serif;font-weight:900;font-synthesis:none;font-size:42px;line-height:1;font-style:italic;letter-spacing:-1px;-webkit-text-stroke:1px #f4f3e7;paint-order:stroke fill;text-shadow:2px 2px 0 #11180f,-2px -2px 0 #11180f,2px -2px 0 #11180f,-2px 2px 0 #11180f}
.question-row h2{text-align:center;font-size:clamp(26px,2.5vw,40px);line-height:1.28;letter-spacing:.015em;text-shadow:2px 3px 0 #0a110a;text-wrap:balance}
.timer{font-family:'Tug Sport',Impact,sans-serif;font-weight:900;font-style:italic;font-synthesis:none;font-size:43px;letter-spacing:0;-webkit-text-stroke:.5px #fff;paint-order:stroke fill}
.timer::before{font-family:'Segoe UI Symbol',sans-serif;font-style:normal;letter-spacing:0}
.team-panel h2{font-style:normal;text-shadow:2px 3px 0 var(--team-dark);-webkit-text-stroke:.3px #fff;paint-order:stroke fill}
.option{font-size:var(--answer-size);line-height:1.14;font-weight:900}
.option .option-text{flex:1;text-align:center}
.option .letter{font-family:'Tug Sport',Impact,sans-serif;font-weight:900;font-synthesis:none;font-style:italic;line-height:1;text-shadow:2px 2px 0 var(--team-dark)}
.cooldown span{font-family:'Tug Sport','Tug Sans TC',sans-serif;font-size:21px;font-weight:900;font-style:italic}
.next{font-size:24px;letter-spacing:.08em;position:fixed;left:50%;top:calc(32vh + 82px);transform:translateX(-50%);z-index:9;min-width:160px}
.next:active{transform:translateX(-50%) translateY(3px)}
.battle-announcement{font-family:'Tug Sport','Tug Sans TC',sans-serif;font-style:italic;letter-spacing:.04em}
.game-footer>#status{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;background:none}
.reset-tool{width:36px;height:36px;font-size:23px;opacity:.8}
.pull-gauge{top:calc(65% + 9px)}
@media(min-width:1101px) and (max-width:1599px){
 :root{--answer-size:24px}
 .team-panel{grid-template-columns:52px minmax(0,1fr)}
 .team-panel h2{font-size:23px;padding:6px 3px 9px;letter-spacing:0}
 .cooldown{width:49px;height:49px}.cooldown span{font-size:18px}
 .option{gap:5px;padding:9px 4px 11px}
}
@media(min-width:1600px) and (min-height:850px){.question-row h2{font-size:40px}.versus{font-size:48px}.timer{font-size:56px}.next{font-size:30px;top:calc(32vh + 100px)}.reset-tool{width:43px;height:43px;font-size:28px}}
@media(max-width:1100px){.hud h1{font-size:26px}.question-row h2{font-size:27px}.versus{font-size:29px}.timer{font-size:36px}.reset-tool{width:30px;height:30px;font-size:20px}}
@media(max-height:650px) and (min-width:750px){.hud h1{font-size:24px}.question-row h2{font-size:24px}.timer{font-size:32px}.next{font-size:22px;top:calc(30vh + 64px)}}
@media(max-width:749px){.hud h1{font-size:18px}.question-row h2{font-size:21px}.scoreboard>span:not(.versus){font-size:36px}.versus{font-size:24px}.timer{font-size:30px}.option{font-size:18px}.next{font-size:20px;min-width:140px;top:calc(34vh + 65px)}.reset-tool{width:27px;height:27px;font-size:18px}.cooldown span{font-size:15px}.pull-gauge{top:57%}}

/* 4:3 classroom screens: reserve the field above a compact two-row control deck. */
@media(min-width:750px) and (max-width:1100px){
 :root{--answer-size:20px}
 .answer-dock{gap:22px}
 .team-panel{grid-template-columns:48px minmax(0,1fr);gap:6px;padding:8px 6px 10px}
 .team-panel>header{gap:7px;padding:1px 0 2px}
 .team-panel h2{font-size:21px;letter-spacing:0;padding:5px 2px 7px}
 .cooldown{width:44px;height:44px}.cooldown span{font-size:16px}
 .options{gap:8px}
 .option{min-height:72px;font-size:20px;line-height:1.07;padding:4px 4px 6px;gap:4px}
 .option .letter{width:24px;min-height:34px;font-size:24px;padding:2px 0}
 .option .option-text{text-wrap:pretty}
}

/* A–D are the sole visible answer labels. Shortcut keys remain functional. */
.option{--badge-width:35px;display:grid;grid-template-columns:var(--badge-width) minmax(0,1fr);grid-template-rows:minmax(0,1fr);row-gap:0}
.option .letter{grid-column:1;grid-row:1;width:var(--badge-width);height:100%;padding:0;align-self:stretch}
.option .option-text{grid-column:2;grid-row:1;width:100%;font-synthesis:none}
@media(min-width:1600px) and (min-height:850px){.option{--badge-width:45px}}
@media(min-width:1101px) and (max-width:1599px){.option{--badge-width:28px}}
@media(min-width:750px) and (max-width:1100px){.option{--badge-width:24px}}
@media(max-width:749px){.option{--badge-width:26px}.option .letter{min-height:33px}}