/* Audit refinement: keep the identity, give the game content priority.
   Loaded only by the landing page and the three classroom games. */
.football-page .config-decoration,
.football-page .football-only-label,
.football-page .pitch-event,
.quiz-page .setup-page .hero-number {display:none}
.football-page .mode-tab {color:#4e5c52;font-size:13px}
.football-page .selection-top>div>span {color:#53634f}
.football-page .selection-panel {background:transparent;border:0;border-top:1px solid #d5e1d2;border-radius:0;padding:16px 0 0}
.football-page .card {box-shadow:none}
.football-page .field-step {border-radius:3px}
.football-page .field-step.ball-zone {box-shadow:none;font-size:12px}
.football-page .field-attack-note {font-weight:500}
.football-page .award-btn {justify-content:center}
.football-page .award-btn>span {min-width:0;overflow-wrap:anywhere}

/* Fleet frames recede; the grid remains the main visual object. */
.sea-page .score-card {background:transparent;border-top:0;border-bottom:0;border-radius:0}
.sea-page .question-panel {box-shadow:none;border-radius:10px}
.sea-page .fleet-panel {background:transparent;border:0;border-top:2px solid #57818c;border-radius:0;padding:12px}
.sea-page .fleet-red {border-top-color:var(--red)}
.sea-page .fleet-blue {border-top-color:var(--blue)}
.sea-page .fleet-panel.target {background:#154653;border-top-color:var(--acid);box-shadow:none}
.sea-page .team-mark {box-shadow:none}
.sea-page .battleship-grid {width:min(100%,480px);gap:4px}
.sea-page .fleet-meta {flex-direction:row;align-items:baseline;gap:6px}
.sea-page .fleet-meta b {font-size:18px}
.sea-page .fleet-meta span {font-size:11px}
.sea-page .sea-setup-card {box-shadow:none;border:0;border-top:1px solid #54818b;border-radius:0;background:transparent;padding-inline:0}
.sea-page .sea-check {background:transparent;border:0;border-radius:0;padding-inline:0}

/* Flat cobalt surfaces, quieter chrome and legible gold prices. */
body.quiz-page {background:#0d3285}
.quiz-page .setup-page .surface {background:transparent;box-shadow:none;border:0;border-radius:0;padding:16px 0}
.quiz-page .setup-page .setup-settings {border-right:1px solid #4875b8;padding-right:24px}
.quiz-page .setup-page .hero h1 {font-size:clamp(30px,4vw,42px);margin:0;line-height:1.2}
.quiz-page .setup-page .hero {margin-block:10px 18px}
.quiz-page .setup-settings .primary-btn {box-shadow:none}
.quiz-page .setup-value,.quiz-page .value-tile {background:#194fbd;color:#ffdd77;box-shadow:none;text-shadow:none}
.quiz-page .setup-value:hover,.quiz-page .value-tile:hover:not(:disabled) {background:#1746a4;filter:none;transform:none}
.quiz-page .stage-board {border:0;border-radius:0;background:transparent;padding-inline:0}
.quiz-page .score-card {box-shadow:none}
.quiz-page #question-overlay .question-body {font-size:clamp(24px,3vw,42px);line-height:1.4;letter-spacing:-.4px;text-align:left;padding:24px 0}
.quiz-page .question-dialog-head {position:sticky;top:0;z-index:2;background:#154092;padding-bottom:10px;border-bottom:1px solid #4875b8}
.quiz-page .question-dialog-head h2 {font-size:clamp(21px,2.5vw,30px)}
.quiz-page .question-dialog {scroll-padding-top:100px}
.quiz-page .question-bottom {position:sticky;bottom:0;background:#154092;padding-block:12px;z-index:2}

@media(min-width:901px){
 .sea-page .shell {max-width:1250px}
 .sea-page .battleship-grid {width:min(100%,480px,100cqh)}
 .sea-page .match-header {grid-template-columns:minmax(0,1fr) 36px minmax(0,1fr)}
}
@media(max-width:759px){
 .quiz-page .setup-page .setup-settings {border-right:0;border-bottom:1px solid #4875b8;padding-right:0;padding-bottom:24px}
 .quiz-page .play-board {overflow:visible;gap:16px}
 .quiz-page .play-row {min-width:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
 .quiz-page .topic-tile {grid-column:1/-1;background:transparent;border:0;padding:0 0 4px;min-height:0;font-size:15px;line-height:1.4}
 .quiz-page .value-tile {min-height:48px;font-size:18px;border-radius:5px;padding:4px 0}
 .quiz-page .setup-row {min-width:0;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
 .quiz-page .setup-label {grid-column:1/-1;flex-direction:row;align-items:center;gap:10px;padding:8px 10px}
 .quiz-page .setup-label input {font-size:16px;min-width:0}
 .quiz-page .setup-label span {font-size:11px;flex-shrink:0}
 .quiz-page .setup-value {min-height:48px;font-size:18px}
 .quiz-page .setup-grid {overflow:visible;gap:16px}
 .quiz-page #question-overlay .question-body {font-size:24px;padding-block:20px}
 .quiz-page .question-bottom-actions {width:100%}
 .quiz-page .question-bottom-actions .primary-btn {width:100%}
}
@media(max-width:650px){
 .sea-page .active-fleet {order:-1}
 .sea-page .fleet-panel {padding:10px}
 .sea-page .fleet-panel.target {padding:10px;border-radius:8px}
 .sea-page .question-panel {padding:14px}
 .sea-page .award {font-size:13px;min-height:44px}
 .football-page .question-view-toolbar {display:grid;grid-template-columns:1fr;gap:10px}
 .football-page .question-view-toggle {display:grid;grid-template-columns:1fr 1fr}
 .football-page .question-view-toggle button {font-size:13px;min-height:44px;white-space:nowrap}
 .football-page .question-navigation {justify-content:space-between}
 .football-page .secondary-control {font-size:13px;min-height:44px;white-space:nowrap}
 .football-page .award-btn {font-size:14px;min-height:60px;padding:10px 8px}
 .football-page .entry-mode-bar .mode-tab {font-size:13px;min-height:44px}
 .football-page .task-panel h2,.football-page .config-panel h2 {font-size:22px}
 .football-page .builder-grid {gap:14px}
}

/* Keep all mobile sea controls on one row; navigation owns the second. */
@media(max-width:650px){
 .sea-page .topbar-inner:has(.global-nav){display:grid;grid-template-columns:minmax(0,1fr) repeat(4,32px);gap:6px;padding:10px 12px}
 .sea-page .topbar-inner .brand{grid-column:1;grid-row:1;font-size:20px}
 .sea-page .topbar-inner :is(.mode-name,.header-divider,.topbar-spacer){display:none}
 .sea-page .topbar-inner .tool-button{width:32px;min-width:0;min-height:36px;padding:6px;display:grid;place-items:center;grid-row:1}
 .sea-page #fullscreen-btn{grid-column:2}
 .sea-page #sea-settings-btn{grid-column:3}
 .sea-page #new-game-btn{grid-column:4}
 .sea-page .topbar-inner .back-btn{grid-column:5}
 .sea-page .topbar-inner .global-nav{grid-column:1/-1;grid-row:2;width:100%;margin:0}
}

@media(max-width:400px){
 .sea-page .score-card{flex-direction:column;align-items:flex-start;gap:5px}
 .sea-page .score-card .team-mark{display:none}
 .sea-page .team-copy{width:100%}
 .sea-page .team-name{font-size:15px}
 .sea-page .hit-score{margin-left:0;flex-direction:row;align-items:baseline;gap:5px}
 .sea-page .fleet-title-row{flex-direction:column;align-items:flex-start;gap:4px}
 .sea-page .fleet-meta{white-space:nowrap}
}
