/* Large CSS viewports retain the Full-HD reading proportions. No DPR guessing. */
:root{--display-unit:1}
.global-music{position:fixed;top:max(8px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));z-index:260;width:44px;height:44px;padding:9px;border:1px solid #bda36b99;border-radius:50%;background:#102730ed;color:#efdaa1;cursor:pointer;touch-action:manipulation;box-shadow:0 2px 8px #0006}
#globalControls .global-music{top:max(0px,env(safe-area-inset-top))}
.global-music svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.global-music[data-on='true'] .music-off-mark{display:none}
.global-music[data-on='false']{color:#a8bab6}
.global-music:hover{background:#24434b}
.global-music:focus-visible{outline:3px solid #f2dfaa;outline-offset:3px}
.global-music:disabled{opacity:.5;cursor:default}
.teacher-actions{margin-right:56px}
#hub .hub-gear{right:80px}
.story-header{padding-right:76px}
/* Keep the one persistent control consistent when it moves into a modal. */
.tutorial-dialog .global-music,.story-dialog .global-music{width:44px;height:44px;min-width:44px;min-height:44px;padding:9px;border-radius:50%;font-size:16px;background:#102730ed}
:root[data-display-large='true'] #gameScene{--hud-height:calc(36px * var(--display-unit));--prompt-height:calc(100px * var(--display-unit));--answer-height:calc(50px * var(--display-unit));--keyboard-height:calc(194px * var(--display-unit));--power-height:calc(66px * var(--display-unit))}
:root[data-display-large='true'] #gameScene[data-board='xl']{--prompt-height:calc(136px * var(--display-unit));--answer-height:calc(60px * var(--display-unit));--keyboard-height:calc(248px * var(--display-unit))}
:root[data-display-large='true'] .team .team-mark{width:calc(38px * var(--display-unit));height:calc(38px * var(--display-unit))}
:root[data-display-large='true'] .team-title strong{font-size:calc(22px * var(--display-unit))}
:root[data-display-large='true'] .hud-values strong{font-size:calc(21px * var(--display-unit))}
:root[data-display-large='true'] .prompt-label{font-size:calc(20px * var(--display-unit));min-height:calc(20px * var(--display-unit))}
:root[data-display-large='true'] .team[data-question-mode='missing'] .prompt-note strong{font-size:calc(40px * var(--display-unit))}
:root[data-display-large='true'] .team[data-question-mode='missing'] .prompt-note small{font-size:calc(14px * var(--display-unit))}
:root[data-display-large='true'] .key-row button{font-size:calc(28px * var(--display-unit))}
:root[data-display-large='true'] .key-row .function-key{font-size:calc(28px * var(--display-unit))}
:root[data-display-large='true'] #gameScene[data-board='xl'] .key-row button{font-size:calc(36px * var(--display-unit))}
:root[data-display-large='true'] #gameScene[data-board='xl'] .key-row .function-key{font-size:calc(36px * var(--display-unit))}
:root[data-display-large='true'] .power-panel,:root[data-display-large='true'] .team-b .power-panel{grid-template-columns:calc(140px * var(--display-unit)) 1fr}
:root[data-display-large='true'] .power-buttons{gap:calc(14px * var(--display-unit))}
:root[data-display-large='true'] .power-buttons button{width:calc(58px * var(--display-unit));height:calc(46px * var(--display-unit))}
:root[data-display-large='true'] .power-buttons svg{width:calc(35px * var(--display-unit));height:calc(35px * var(--display-unit))}
:root[data-display-large='true'] #gameScene .power-buttons .power-cost{font-size:calc(17px * var(--display-unit));line-height:calc(20px * var(--display-unit))}
:root[data-display-large='true'] #gameScene .power-panel .charge-pips{grid-template-columns:repeat(4,calc(25px * var(--display-unit)));gap:calc(4px * var(--display-unit)) calc(8px * var(--display-unit))}
:root[data-display-large='true'] #gameScene .power-panel .charge-pips i{width:calc(25px * var(--display-unit));height:calc(20px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .phase-card{width:min(calc(760px * var(--display-unit)),94vw);max-width:calc(760px * var(--display-unit));padding:calc(20px * var(--display-unit)) calc(28px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] #phaseTitle{font-size:calc(44px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] #phaseDetails{font-size:calc(17px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-table{font-size:calc(20px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-table thead th{font-size:calc(18px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-table th,:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-table td{padding:calc(8px * var(--display-unit)) calc(12px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-table .round-team th{font-size:calc(22px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-team img{width:calc(28px * var(--display-unit));height:calc(30px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .round-footnote{font-size:calc(13px * var(--display-unit))}
:root[data-display-large='true'] .final-actions button{font-size:calc(18px * var(--display-unit));min-height:calc(48px * var(--display-unit));padding:calc(10px * var(--display-unit)) calc(20px * var(--display-unit))}

:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .phase-card{max-height:94vh;overflow:auto}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .final-score{gap:calc(48px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .final-score span{font-size:calc(20px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .final-score strong{font-size:calc(24px * var(--display-unit))}
:root[data-display-large='true'] #phaseOverlay[data-phase='final'] .final-score img{width:calc(42px * var(--display-unit));height:calc(46px * var(--display-unit))}
:root[data-display-large='true'] .race-awards{max-width:calc(560px * var(--display-unit));gap:calc(7px * var(--display-unit))}
:root[data-display-large='true'] .award-row{grid-template-columns:calc(86px * var(--display-unit)) 1fr calc(86px * var(--display-unit));gap:calc(14px * var(--display-unit))}
:root[data-display-large='true'] .award-label{font-size:calc(17px * var(--display-unit))}
:root[data-display-large='true'] .award-icon{width:calc(24px * var(--display-unit));height:calc(24px * var(--display-unit))}
:root[data-display-large='true'] .award-medal{height:calc(46px * var(--display-unit));font-size:calc(30px * var(--display-unit))}
:root[data-display-large='true'] #finalStats{font-size:calc(15px * var(--display-unit))}