/* Shared rhythm for platform pages; games keep their own viewport layouts. */
.platform-shell:not(.platform-home-shell) .site-footer { margin-top: 1.5rem; }
.platform-shell :is(.auth-layout, .dashboard-page, .create-page, .info-page) { min-width: 0; }
.platform-shell :is(.dashboard-page, .create-page) { padding-top: var(--page-start); padding-bottom: var(--page-end); }
.platform-shell :is(.dashboard-heading, .create-heading) { gap: var(--heading-gap); padding-bottom: var(--heading-padding); }
.platform-shell :is(.dashboard-heading, .create-heading) h1 { font-size: clamp(2.1rem, 5vw, 4rem); line-height: 1.08; text-wrap: balance; }
.platform-shell :is(.dashboard-heading, .create-heading) > div { min-width: 0; }
.platform-shell .dashboard-tournament { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
.platform-shell .dashboard-tournament > div { min-width: 0; }
.platform-shell .dashboard-tournament h2 { margin-top: 1.25rem; font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.15; overflow-wrap: anywhere; }
.platform-shell .dashboard-tournament p { max-width: 65ch; overflow-wrap: anywhere; line-height: 1.6; }
.platform-shell .dashboard-tournament-actions { align-items: center; }
.platform-shell .dashboard-demo { margin-top: 1.5rem; border-left: 3px solid var(--brand-accent); }
.platform-shell .dashboard-demo > div { min-width: 0; }
.platform-shell .dashboard-empty { margin-top: 1rem; padding-block: 2.5rem; }
.platform-shell .dashboard-empty h2 { line-height: 1.2; }
.platform-shell .create-section { grid-template-columns: 2rem minmax(0, 1fr); gap: 1rem; padding-block: 2.25rem; }
.platform-shell .create-section h2 { margin-bottom: 1.25rem; font-size: clamp(1.6rem, 3vw, 2.25rem); line-height: 1.15; }
.platform-shell .create-section > div { min-width: 0; }
.platform-shell .create-section .help-text { max-width: 65ch; line-height: 1.6; }
.platform-shell .discipline-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.platform-shell .discipline-picker label > span { grid-template-columns: 2rem minmax(0, 1fr); }
.platform-shell .create-trial { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; margin-top: 2rem; border: 1px solid var(--line); border-left: 3px solid var(--brand-accent); }
.platform-shell .create-trial > div { flex: 1 1 20rem; min-width: 0; }
.platform-shell .create-trial h2 { margin: 0 0 .4rem; font-size: 1.25rem; line-height: 1.3; }
.platform-shell .create-trial p { max-width: 60ch; margin: 0; color: var(--muted); line-height: 1.6; }
.platform-shell .create-trial form { margin: 0; }
.platform-shell .auth-layout { grid-template-columns: minmax(0, 1fr) minmax(320px, 420px); align-content: center; gap: clamp(2rem, 5vw, 5rem); padding: var(--page-start) var(--page-gutter) var(--page-end); }
.platform-shell .auth-intro { min-width: 0; align-self: center; padding: 0; }
.platform-shell .auth-intro h1 { max-width: 13ch; font-size: clamp(2.25rem, 5vw, 4.25rem); line-height: 1.08; }
.platform-shell .auth-intro > p:last-child { max-width: 34rem; margin-bottom: 0; line-height: 1.65; overflow-wrap: anywhere; }
.platform-shell .auth-card h2 { margin-bottom: .5rem; font-size: clamp(1.65rem, 3vw, 2.25rem); line-height: 1.15; }
.platform-shell .auth-card > p { margin: 0; color: var(--muted); line-height: 1.6; }
.platform-shell .info-page { margin-block: var(--page-start) var(--page-end); }
.platform-shell .info-heading { border-bottom: 1px solid var(--line); margin-bottom: 2rem; padding-bottom: 2rem; }
.platform-shell .info-heading h1 { max-width: 21ch; font-size: clamp(2.1rem, 4.5vw, 3.5rem); line-height: 1.1; }
.platform-shell .info-heading > .button { max-width: 100%; white-space: normal; }
.platform-shell .info-lead { font-size: 1rem; }
.platform-shell .info-section { scroll-margin-top: 1.5rem; }
.platform-shell .info-section h2 { font-size: 1.3rem; line-height: 1.3; }
.platform-shell .account-details { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: .75rem 1.5rem; }
.platform-shell .account-details dd { margin: 0; }

@media (min-width: 1100px) {
  .platform-shell .dashboard-tournament { grid-template-columns: minmax(0, 1fr) minmax(0, 25rem); align-items: center; }
  .platform-shell .dashboard-tournament-actions { justify-content: flex-end; }
}
@media (max-width: 900px) {
  .platform-shell .auth-layout { width: min(100%, 42rem); grid-template-columns: minmax(0, 1fr); align-content: start; gap: 1.75rem; padding-top: 2.5rem; }
  .platform-shell .auth-intro h1 { max-width: 18ch; font-size: clamp(2.1rem, 7vw, 3.5rem); }
}
@media (max-width: 620px) {
  .platform-shell :is(.dashboard-page, .create-page, .auth-layout) { padding-inline: var(--page-gutter); }
  .platform-shell .auth-layout { padding-top: 2.5rem; padding-bottom: 1.5rem; }
  .platform-shell .auth-intro h1 { font-size: clamp(1.9rem, 9vw, 3rem); }
  .platform-shell .info-page { width: calc(100% - 2 * var(--page-gutter)); }
  .platform-shell .create-section { grid-template-columns: 1.25rem minmax(0, 1fr); gap: .65rem; padding-block: 1.75rem; }
  .platform-shell .discipline-picker { grid-template-columns: minmax(0, 1fr); }
  .platform-shell .discipline-picker label > span { grid-template-columns: 1.5rem minmax(0, 1fr); padding-left: .8rem; }
  .platform-shell .account-details { grid-template-columns: minmax(0, 1fr); gap: .25rem; }
  .platform-shell .account-details dd { margin-bottom: .8rem; }
}

/* Host setup follows the site rhythm; live stages keep their viewport layout. */
:is(.host-edit-shell, .host-config-shell) .admin-page {
  padding: clamp(.75rem, 2vw, 1.5rem);
}
:is(.host-edit-shell, .host-config-shell) .admin-section {
  min-width: 0;
  margin: 0 0 1rem;
}
.host-config-shell .admin-section > h1 {
  max-width: 24ch;
  font-size: clamp(1.75rem, 4.5vw, 3.5rem);
  line-height: 1.1;
}
.host-edit-shell .section-heading {
  display: grid;
  justify-items: start;
  gap: .45rem;
  margin-bottom: 1.1rem;
}
.host-edit-shell .section-heading h1 { font-size: clamp(1.75rem, 4.5vw, 3.5rem); line-height: 1.1; }
.host-edit-shell .section-heading h2 { font-size: clamp(1.5rem, 3.5vw, 2.5rem); line-height: 1.15; }
.host-config-shell .admin-section > .help-text { max-width: 75ch; margin: .85rem 0 1.25rem; }
.host-config-shell :is(.word-config-form, .quote-config-form) { margin-top: 1.25rem; }
.host-config-shell :is(form, fieldset, label, input, select, textarea) { min-width: 0; max-width: 100%; }
.host-config-shell :is(.quote-config-basics, .topics-global-settings, .topics-final-grid) {
  min-width: 0;
}
.host-config-shell .topics-config-form { grid-template-columns: minmax(0, 1fr); }
.host-config-shell .topics-global-settings {
  width: 100%;
  margin-inline: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.host-config-shell .topics-global-settings > label { display: grid; gap: var(--field-gap); }
.host-config-shell .topics-global-settings > .check-row { grid-column: 1 / -1; }
.host-config-shell .topics-final-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.host-config-shell :is(#topics-rounds, .topics-round-editor, .topics-theme-editor, .topics-theme-body, .topics-question-grid, .topics-question-card, .topics-options-editor, .topics-options-editor-list, .topics-final-editor) {
  min-width: 0;
  max-width: 100%;
}
.host-config-shell :is(.topics-theme-body, .topics-question-grid, .topics-question-card, .topics-options-editor, .topics-options-editor-list, .topics-final-editor) {
  grid-template-columns: minmax(0, 1fr);
}
.host-config-shell .topics-question-heading { flex-wrap: wrap; }
.host-config-shell .host-config-help {
  margin: 0 0 1.25rem;
  border-block: 1px solid var(--line);
  color: var(--muted);
  font-size: .85rem;
}
.host-config-help > summary { min-height: var(--control-height); padding: .75rem 0; color: var(--paper); cursor: pointer; }
.host-config-help > p { max-width: 75ch; margin: .25rem 0 .85rem; line-height: 1.6; }
.host-config-shell .quote-config-card-actions .text-button { min-height: var(--control-height); padding-inline: .4rem; }
.host-config-shell .sticky-actions { z-index: 2; flex-wrap: wrap; padding-bottom: max(.8rem, env(safe-area-inset-bottom)); }
.host-config-shell .sticky-actions .button { min-width: 0; text-align: center; }
.host-config-shell :is(.topics-theme-editor summary, .slots-turn-order li) { overflow-wrap: anywhere; }
.host-edit-shell :is(.discipline-card-identity h3, .danger-zone-action h3, .status-banner) { overflow-wrap: anywhere; }
.host-edit-shell .toggle { min-height: var(--control-height); }
.host-edit-shell .toggle i { flex: 0 0 auto; }
.host-edit-shell .status-banner { grid-template-columns: minmax(0, 1fr); gap: .1rem; }
.host-edit-shell .status-banner small { max-width: 70ch; font-size: .8rem; text-transform: none; }
.host-edit-shell .status-banner strong { font-size: clamp(1.35rem, 3vw, 1.8rem); }
:is(.host-edit-shell, .host-config-shell, .conductor-shell) .admin-header > a,
:is(.host-edit-shell, .host-config-shell, .conductor-shell) .admin-header nav :is(a, .text-button) {
  display: inline-flex;
  min-height: var(--control-height);
  align-items: center;
}
.conductor-shell .conductor-hero h1 { max-width: 19ch; font-size: clamp(1.8rem, 5vw, 3.5rem); line-height: 1.1; }
.conductor-shell .conductor-round-list strong { overflow-wrap: anywhere; }
.results-conductor-shell .results-page > .admin-section > h1 { font-size: clamp(1.5rem, 3.5vw, 2.75rem); line-height: 1.1; }
.results-conductor-shell :is(.manual-result-inputs, .manual-result-inputs label, .manual-result-actions, .manual-result-total, .result-row-actions) { min-width: 0; }
.results-conductor-shell :is(.result-row output, .manual-result-total) { max-width: 100%; overflow-wrap: anywhere; }
.game-conductor-shell .admin-header nav a { display: inline-flex; min-height: var(--control-height); align-items: center; }
.closest-conductor-shell .closest-live-correct { flex-wrap: wrap; }
.closest-conductor-shell .closest-live-correct strong { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.rehearsal-shell .rehearsal-empty h1 { max-width: 20ch; font-size: clamp(2rem, 5vw, 4.5rem); line-height: 1.08; }

/* The toolbar may wrap; let its actual height determine the remaining workspace. */
@media (min-width: 920px) {
  .rehearsal-shell { display: grid; grid-template-rows: auto minmax(0, 1fr); }
  .rehearsal-grid { height: auto; min-width: 0; min-height: 0; }
  .rehearsal-empty { min-height: 0; margin-block: 0; overflow-y: auto; }
}

@media (max-width: 700px) {
  .host-edit-shell .management-mode-switch :is(a, span) { padding-inline: .35rem; font-size: .65rem; letter-spacing: .03em; }
  .host-config-shell :is(.quote-config-card, .topics-round-editor, .topics-final-editor) { padding: .75rem; }
  .host-config-shell :is(.topics-question-card, .topics-options-editor, .question-image-field) { padding: .6rem; }
  .host-config-shell :is(.topics-global-settings, .topics-round-header) { grid-template-columns: minmax(0, 1fr); }
  .host-config-shell .topics-question-heading > label { width: min(100%, 220px); }
  .results-conductor-shell .result-row { grid-template-columns: minmax(0, 1fr); gap: .35rem; }
  .results-conductor-shell .result-row-actions { justify-content: flex-start; }
  .results-conductor-shell .result-row output { text-align: left; }
}

@media (max-width: 480px) {
  :is(.host-edit-shell, .host-config-shell) .admin-header { gap: .25rem .75rem; padding-block: .6rem; }
  .host-edit-shell .admin-header nav { justify-content: flex-start; column-gap: 1rem; }
  .host-edit-shell .admin-discipline { padding: .75rem; }
  .host-edit-shell .discipline-card-identity { grid-template-columns: 1.75rem minmax(0, 1fr); gap: .5rem; }
  .host-edit-shell .participant-admin-list form { grid-template-columns: 1.25rem minmax(0, 1fr); }
  .host-edit-shell :is(.discipline-card-actions, .participant-admin-actions) .button { max-width: 100%; font-size: .85rem; text-align: center; }
  .host-config-shell .word-config-options { grid-template-columns: minmax(0, 1fr); }
  .host-config-shell .sticky-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .host-config-shell .sticky-actions .button { width: 100%; padding-inline: .5rem; font-size: .8rem; }
  .host-config-shell .topics-option-editor-row { grid-template-columns: auto minmax(0, 1fr); }
  .host-config-shell .topics-option-editor-row .topics-option-remove { grid-column: 2; justify-self: end; }
  .rehearsal-shell .rehearsal-panel { grid-template-rows: var(--control-height) minmax(0, 1fr); }
  .rehearsal-shell .rehearsal-panel > header button { min-height: var(--control-height); }
}

/* Keep headers full width while retaining each page's content measure. */
:is(.identity-page, .portal-page, .five-letters-page, .quote-page, .slots-page) {
  width: 100%;
  margin-block: 0;
  margin-inline: auto;
}
.portal-page > :is(.portal-hero, .schedule) { width: min(100%, 920px); margin-inline: auto; }
.five-letters-game { width: min(100%, 760px); margin-inline: auto; }
:is(.quote-game, .slots-game) { width: min(100%, 820px); margin-inline: auto; }

/* Participant entry, waiting rooms, and archived results. */
.identity-panel { min-width: 0; }
.identity-panel h1 { font-size: clamp(2.4rem, 8vw, 4.5rem); line-height: 1.08; }
.identity-intro { flex: 0 0 auto; max-width: 34rem; margin: -.5rem 0 1.2rem; font-size: .9rem; }
.participant-picker button { gap: .5rem; }
.identity-panel .choice-actions { flex-wrap: wrap; }
.participant-lobby-shell .portal-hero { padding-top: clamp(2rem, 5vw, 3.5rem); }
.portal-hero h1 { margin-bottom: 2rem; font-size: clamp(2.4rem, 9vw, 4.5rem); line-height: 1.08; }
.current-discipline strong { overflow-wrap: anywhere; font-size: clamp(1.5rem, 6vw, 2.3rem); line-height: 1.2; }
.portal-instructions { max-width: 38rem; margin: 1.2rem 0 0; font-size: .9rem; }
.placeholder-page { width: 100%; min-height: 100dvh; margin-inline: auto; }
.placeholder-page h1 { overflow-wrap: anywhere; font-size: clamp(2.3rem, 8vw, 5rem); line-height: 1.08; }
.discipline-placeholder-shell { --game-mark: ""; }
.discipline-placeholder-shell .placeholder-page section { width: min(100%, 1100px); margin-block: clamp(2rem, 7vh, 5rem); margin-inline: auto; }

/* Preserve compact active-game layouts; keep waiting titles within the phone. */
.game-title-row { min-width: 0; }
.game-title-row > div:first-child { min-width: 0; }
.game-title-row h1 { overflow-wrap: anywhere; }
.five-letters-shell:not(.is-five-letters-playing) .game-title-row h1,
.quote-shell:not(:is([data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="revealed"])) .game-title-row h1,
.closest-shell:not(:is([data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="revealed"])) .game-title-row h1,
.slots-shell:not(.is-slots-playing) .game-title-row h1,
.topics-shell:not([data-game-phase]) .game-title-row h1,
.squares-shell:not([data-game-phase]) .game-title-row h1 {
  font-size: clamp(2.2rem, 8vw, 4.5rem);
  line-height: 1.05;
}
.five-letters-shell:not(.is-five-letters-playing) .five-letters-game,
.quote-shell:not(:is([data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="revealed"])) .quote-game,
.closest-shell:not(:is([data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="revealed"])) .quote-game,
.slots-shell:not(.is-slots-playing) .slots-game {
  padding-top: clamp(1.5rem, 4vw, 2.5rem);
}
.arithmetic-sprint-shell:not([data-game-phase="playing"]) .sprint-title-row h1 { font-size: clamp(1.6rem, 5vw, 3.7rem); line-height: 1.08; }
.slots-shell:not(.is-slots-playing) .slots-title-row { flex-wrap: wrap; }
.game-start { max-width: 100%; }
.game-start .button { min-width: min(180px, 100%); max-width: 100%; }

.squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: repeat(5, minmax(0, 1fr));
}
.squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-cell {
  min-width: 0;
  min-height: 0;
}

@media (max-width: 680px) and (orientation: portrait) {
  .squares-shell[data-game-phase] .squares-title-row {
    grid-template-columns: minmax(0, 1fr);
    gap: .4rem;
  }
  .squares-shell[data-game-phase] .squares-title-row h1 {
    overflow-wrap: normal;
    font-size: clamp(1.65rem, 7vw, 2.4rem);
    line-height: 1.05;
  }
}

@media (max-height: 620px) and (orientation: landscape) {
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-page {
    grid-template-rows: minmax(0, 1fr);
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-stage {
    height: 100%;
    align-content: stretch;
    grid-template-rows: auto minmax(0, 1fr) auto;
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-title-row {
    display: block;
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-title-row > div:first-child {
    display: block;
    margin-bottom: .5rem;
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-title-row > div:first-child::after {
    display: none;
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-title-row h1 {
    overflow-wrap: normal;
    font-size: clamp(1.4rem, 4vw, 1.75rem);
    line-height: 1.05;
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-game-meta {
    grid-template-columns: minmax(0, 1fr);
  }
  .squares-shell:is([data-game-phase="countdown"], [data-game-phase="memorizing"], [data-game-phase="answering"], [data-game-phase="grace"], [data-game-phase="result"]) .squares-board-stage {
    min-width: 0;
  }
}

.archive-hero h1 { font-size: clamp(2.6rem, 6vw, 4.5rem); line-height: 1.08; }
.archive-intro { max-width: 40rem; margin: 1.2rem 0 0; }
.archive-scoring-note { margin: -0.3rem 0 1.4rem; font-size: .88rem; }
.archive-ranking-heading h2,
.archive-protocol-heading h2 { font-size: clamp(1.7rem, 5vw, 2.6rem); line-height: 1.12; }
.archive-protocol-heading { align-items: start; flex-direction: column; gap: .6rem; }
.archive-podium-points { flex-wrap: wrap; gap: .15rem .35rem; }
.participant-result-hero { padding: clamp(2rem, 5vw, 3.5rem) 0 2rem; }
.participant-result-page h1 { font-size: clamp(2.5rem, 9vw, 4.5rem); line-height: 1.08; }
.participant-total { margin-top: 1.75rem; }
.participant-results-heading { margin: 0 0 1rem; font-size: clamp(1.2rem, 4vw, 1.5rem); line-height: 1.3; }
.participant-results li { gap: .7rem; }
.participant-results li > strong { padding-left: .3rem; font-variant-numeric: tabular-nums; }

@media (max-width: 699px) {
  .identity-panel { justify-content: flex-start; overflow-y: auto; }
  .identity-panel h1 { font-size: clamp(2.25rem, 10vw, 3.6rem); margin-bottom: 1rem; }
  .identity-intro { margin: 0 0 1rem; font-size: .85rem; }
  .participant-picker button { grid-template-columns: 1.7rem minmax(0, 1fr) auto; }
  .participant-picker button:disabled b { max-width: 4rem; }
  .participant-result-page { padding-inline: var(--page-gutter); }
}

@media (max-width: 380px) {
  .identity-panel { padding-inline: var(--page-gutter); }
  .participant-results li { grid-template-columns: 1.6rem minmax(0, 1fr) auto; gap: .4rem; }
  .archive-standings-table :is(th, td):last-child { width: 4.5rem; }
}
