/* Fixed broadcast frame: game state changes must never reflow the playing surface. */
#gameView .route-banner{box-sizing:border-box!important;height:92px!important;min-height:92px!important;max-height:92px!important}
#gameView .game-grid{align-items:start!important}
#gameView .stage:not(:has(.final-splash)){height:634px!important;min-height:634px!important;max-height:634px!important;grid-template-columns:minmax(0,1fr) 255px!important;grid-template-rows:20px 64px 370px 80px 64px!important;align-items:stretch!important;overflow:visible!important}

/* Category | points | player: points remain physically centred. */
.question-rail{box-sizing:border-box!important;height:64px!important;min-height:64px!important;max-height:64px!important;grid-template-columns:minmax(90px,1fr) 178px minmax(0,1fr)!important;grid-template-rows:64px!important;gap:12px!important;overflow:hidden!important}
.question-rail #categoryLabel{grid-column:1!important;grid-row:1!important;justify-self:start!important;max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.question-rail .value{grid-column:2!important;grid-row:1!important;justify-self:center!important;width:178px!important;min-width:178px!important;height:46px!important;align-self:center!important}
.question-rail #activePlayerLabel{grid-column:3!important;grid-row:1!important;width:100%!important;height:64px!important;padding:0 6px!important;overflow:hidden!important;white-space:normal!important;text-align:right!important;justify-content:flex-end!important}

/* A resolved message occupies the same 64px rail—no height change. */
.question-rail.resolved{height:64px!important;min-height:64px!important;max-height:64px!important;grid-template-columns:minmax(0,1fr)!important;grid-template-rows:64px!important}
.question-rail.resolved #activePlayerLabel{grid-column:1!important;width:100%!important;height:64px!important;padding:0 18px!important;text-align:center!important;justify-content:center!important}

/* Every live-game panel keeps its allotted dimensions. */
#gameView .stage:not(:has(.final-splash)) article#questionText{height:370px!important;min-height:370px!important;max-height:370px!important;overflow:hidden!important}
#gameView .stage:not(:has(.final-splash)) #answerReveal{box-sizing:border-box!important;height:370px!important;min-height:370px!important;max-height:370px!important;margin:0!important;overflow:auto!important;scrollbar-gutter:stable!important}
#gameView .stage:not(:has(.final-splash)) .timer{box-sizing:border-box!important;height:80px!important;min-height:80px!important;max-height:80px!important;margin:0!important;overflow:hidden!important}
#gameView .stage:not(:has(.final-splash)) #gameControls{box-sizing:border-box!important;height:154px!important;min-height:154px!important;max-height:154px!important;margin:0!important;overflow:hidden!important}
#gameView .stage:not(:has(.final-splash)) .hint{box-sizing:border-box!important;height:64px!important;min-height:64px!important;max-height:64px!important;margin:0!important;overflow:hidden!important}

@media(max-width:850px){
  #gameView .route-banner{height:92px!important;min-height:92px!important;max-height:92px!important;overflow:hidden!important}
  #gameView .stage:not(:has(.final-splash)){height:914px!important;min-height:914px!important;max-height:914px!important;grid-template-columns:1fr!important;grid-template-rows:20px 64px 330px 180px 80px 154px 24px!important}
  .question-rail{grid-template-columns:minmax(70px,1fr) 150px minmax(0,1fr)!important;grid-template-rows:64px!important;height:64px!important;min-height:64px!important;max-height:64px!important}
  .question-rail .value{width:150px!important;min-width:150px!important}
  .question-rail #activePlayerLabel{grid-column:3!important;grid-row:1!important;height:64px!important;font-size:.72rem!important}
  .question-rail.resolved{grid-template-columns:1fr!important}
  .question-rail.resolved #activePlayerLabel{grid-column:1!important;font-size:.82rem!important;text-align:center!important;justify-content:center!important}
  #gameView .stage:not(:has(.final-splash)) article#questionText{height:330px!important;min-height:330px!important;max-height:330px!important}
  #gameView .stage:not(:has(.final-splash)) #answerReveal{height:180px!important;min-height:180px!important;max-height:180px!important}
}
