/* Shared screen layout: keep actions readable as the available content width changes. */
.page-heading > div:first-child,
.heading-actions,
.console-context > div,
.match-play { min-width: 0; }
.page-heading h1 { text-wrap: balance; }
.page-heading .heading-actions { flex-wrap: wrap; justify-content: flex-end; }
.page-heading .heading-actions .btn { white-space: normal; line-height: 1.4; }
.section-heading > div:last-child { min-width: 0; max-width: 100%; flex-shrink: 1; }
.library-meta { flex-wrap: wrap; row-gap: 8px; }
.library-card > .row { flex-wrap: wrap; }
.score-layout { align-items: start; }
.score-layout > .stack { align-content: start; }
.score-team-grid { align-items: start; }
.score-card .team-name { padding-right: 65px; overflow-wrap: anywhere; }
.focus-strip { flex-wrap: wrap; }
.focus-strip select { min-width: 170px; min-height: 44px; }
.live-coaching-empty {
  padding: 18px 21px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.live-coaching-empty h2 { font-size: 17px; margin: 6px 0; }
.live-coaching-empty p { margin: 0; }
.live-coaching-empty > .text-btn { flex-shrink: 0; }
.match-page { max-width: 1160px; margin: 0 auto; }
.match-view { max-width: none; }
.match-page > .live-coaching { margin-top: 24px; }
.match-score-number { border: 0; padding: 0; }
.match-score-caption { display: block; }
.match-score-help { line-height: 1.5; }
.match-heading > div:last-child { display: flex; gap: 8px; }
.match-timer-settings .btn { white-space: normal; text-align: left; }

@media (min-width: 1001px) {
  .match-console {
    display: grid;
    grid-template-columns: minmax(260px, .85fr) minmax(0, 2fr);
    gap: 20px;
    align-items: start;
  }
  .match-timer { padding: 20px 18px 12px; }
  .match-clock { font-size: clamp(58px, 5.6vw, 80px); margin: 34px 0; }
  .match-timer-controls { gap: 7px; grid-template-columns: 1fr 1.5fr 1fr; }
  .match-timer-controls .btn { padding: 10px 5px; min-height: 50px; font-size: 12px; }
  .match-timer-settings { gap: 12px; margin-top: 13px; }
  .match-timer-settings .btn { font-size: 11px; }
  .match-scoreboard { margin-top: 0; gap: 16px; }
  .match-team { padding: 18px 16px 14px; }
  .match-score-number { margin: 12px auto 0; font-size: 70px; }
  .match-score-controls { margin-top: 18px; grid-template-columns: 42px minmax(0, 1fr); }
  .match-score-controls .btn { min-height: 50px; font-size: 14px; padding: 8px; }
  .match-score-controls .match-minus { font-size: 24px; }
  .match-vs { top: 116px; }
  .match-score-help { margin-bottom: 0; }
  .match-secondary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
  .match-disclosure { margin: 0; }
  .match-setup-actions { grid-column: 1 / -1; margin-top: 4px; }
}

@media (min-width: 761px) and (max-width: 1200px) {
  .page-heading { align-items: flex-start; flex-wrap: wrap; gap: 16px; }
  .page-heading > div:first-child { flex: 1 1 340px; }
  .page-heading .heading-actions { flex: 1 1 340px; justify-content: flex-start; }
  .page-heading h1 { font-size: 30px; }
  .character-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .character-body { padding: 16px 14px; }
  .character-body h3 { font-size: 14px; }
  .character-cue { font-size: 12px; }
  .character-leader { font-size: 11px; min-height: 40px; }
  .nominate-button { min-height: 36px; font-size: 12px; }
  .focus-strip .caption { margin-left: 0; flex-basis: 100%; }
  .score-layout { grid-template-columns: minmax(0, 1fr) 220px; gap: 16px; }
  .score-buttons .btn { padding: 10px 8px; white-space: normal; font-size: 12px; }
  .console-context { flex-wrap: wrap; }
  .console-context-actions { flex-wrap: wrap; }
  .console-context select { font-size: 12px; }
}

@media (min-width: 761px) and (max-width: 1000px) {
  .content { padding: 24px; }
  .score-layout { grid-template-columns: 1fr; }
  .score-aside { grid-template-columns: 1fr 1fr; align-items: start; }
  .score-aside > .empty-box { grid-column: 1 / -1; }
  .match-timer { padding: 16px 20px 8px; }
  .match-clock { font-size: 64px; margin: 10px 0 14px; }
  .match-timer-controls .btn { min-height: 46px; }
  .match-score-number { font-size: 60px; }
  .live-coaching-empty { align-items: flex-start; flex-direction: column; gap: 8px; }
}

@media (max-width: 760px) {
  .content { padding: 18px 14px 24px; }
  .page-heading { display: block; margin-bottom: 22px; }
  .page-heading h1 { font-size: 27px; line-height: 1.18; letter-spacing: -.8px; text-wrap: pretty; }
  .page-heading p { font-size: 13px; line-height: 1.65; max-width: none; }
  .page-heading .heading-actions { flex-direction: row; justify-content: flex-start; gap: 8px; margin-top: 16px; }
  .page-heading .heading-actions:empty { display: none; }
  .page-heading .heading-actions .btn { min-height: 44px; font-size: 12px; padding: 10px 13px; flex: 1 1 auto; }
  .page-heading .heading-actions .btn svg { display: block; flex-shrink: 0; }
  .game-console-page .page-heading .heading-actions > .btn { font-size: 12px; }
  .console-context-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .console-context-actions label { min-width: 0; font-size: 11px; }
  .console-context-actions select { min-height: 46px; width: 100%; }
  .console-context-actions > .btn { margin-top: 0; }
  .console-workspace-head > .row { width: 100%; }
  .console-workspace-head .row > .btn { flex: 1; }
  .focus-strip { display: grid; grid-template-columns: minmax(0, 1fr); padding: 17px; gap: 10px; }
  .focus-strip select { max-width: none; width: 100%; min-width: 0; padding: 10px 12px; margin: 0; }
  .focus-strip .btn { width: 100%; white-space: normal; }
  .focus-strip .caption { width: auto; margin: 0; line-height: 1.6; }
  .character-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; gap: 12px; padding: 0; }
  .character-body { padding: 14px 11px; }
  .character-body h3 { font-size: 13px; overflow-wrap: anywhere; }
  .character-cue { font-size: 12px; line-height: 1.6; min-height: 58px; }
  .character-leader { white-space: normal; font-size: 11px; min-height: 44px; line-height: 1.5; }
  .nominate-button { min-height: 44px; font-size: 12px; }
  .character-art { height: 100px; }
  .section-heading { align-items: flex-start; }
  .section-heading p { font-size: 12px; line-height: 1.6; }
  .preset-library > summary { flex-wrap: wrap; gap: 12px; }
  .preset-library > summary > span { white-space: normal; display: flex; align-items: center; gap: 6px; }
  .preset-library > summary > span span { margin-left: 0; }
  .preset-library > summary .eyebrow { font-size: 9px; letter-spacing: 1.2px; }
  .live-coaching-empty { padding: 17px; display: block; }
  .live-coaching-empty .text-btn { margin-top: 10px; text-align: left; }
  .live-coaching > summary { align-items: flex-start; flex-wrap: wrap; }
  .live-coaching > summary > span { white-space: normal; }
  .match-heading { align-items: flex-start; }
  .match-heading h1 { text-wrap: pretty; }
  .match-score-number { line-height: 1.05; }
  .match-team-note { line-height: 1.5; }
  .match-score-help { margin-top: 10px; }
  .score-caption > .row { flex-wrap: wrap; }
  .score-caption > .row:last-child { width: 100%; }
  .score-caption > .row:last-child .btn { flex: 1; min-height: 44px; font-size: 12px; }
  .score-layout { gap: 16px; }
  .score-sub { font-size: 12px; line-height: 1.6; }
  .score-buttons .btn { min-height: 46px; font-size: 13px; }
  .modal-head > div { min-width: 0; }
  .modal-head h2 { overflow-wrap: anywhere; }
  .modal-footer { flex-wrap: wrap; }
  .modal-footer .btn { flex: 1 1 110px; }
  .team-form-row { grid-template-columns: minmax(0, 1fr); }
  .library-meta { gap: 10px; font-size: 12px; }
  .library-card h3 { font-size: 22px; line-height: 1.35; overflow-wrap: anywhere; }
  .library-card p { font-size: 13px; }
}

@media (max-width: 360px) {
  .page-heading h1 { font-size: 25px; }
  .character-grid { grid-template-columns: minmax(0, 1fr); }
  .character-cue { min-height: 0; }
  .character-body h3 { font-size: 16px; }
  .match-heading { flex-wrap: wrap; }
  .match-heading > div:first-child { flex: 1 1 180px; }
  .match-heading .btn { font-size: 10px; padding: 8px; }
}

/* Preserve a complete match control surface on smaller phone heights. */
@media (max-width: 760px) and (max-height: 740px) {
  .content { padding-top: 8px; }
  .match-team-note { display: none; }
}
@media (max-width: 360px) and (max-height: 740px) {
  .match-timer { padding: 8px 12px 3px; }
  .match-clock { font-size: 48px; margin: 3px 0 6px; }
  .match-team { padding-top: 8px; padding-bottom: 8px; }
  .match-score-number { font-size: 40px; }
  .match-score-controls { margin-top: 7px; }
}