/* Mobile refinements sit after the original heritage styles. */
.mobile-header-tools, .mobile-bottom-nav, .mobile-roster-footer { display: none; }

@media (max-width: 1100px) {
  html { scroll-padding-top: 100px; }
  .has-mobile-nav > header {
    position: sticky; top: 0; z-index: 30; display: flex; flex-wrap: nowrap;
    padding: 10px max(16px, env(safe-area-inset-left)) 10px max(16px, env(safe-area-inset-right));
    gap: 12px; min-height: 76px; border-bottom-width: 4px;
    box-shadow: 0 3px 12px #153e7715;
  }
  .has-mobile-nav > header > .brand { font-size: 21px; gap: 9px; min-width: 0; margin: 0; letter-spacing: .4px; }
  .has-mobile-nav > header .brand .crest { width: 38px; height: 47px; flex-basis: 38px; }
  .has-mobile-nav > header .brand small { font-size: 8px; letter-spacing: .9px; }
  .has-mobile-nav > header > .header-action { display: none; }
  .mobile-header-tools { display: flex; gap: 6px; align-items: center; margin-left: auto; }
  .mobile-header-tools .language-link, .menu-toggle {
    display: inline-flex; align-items: center; justify-content: center; flex: 0 0 44px;
    width: 44px; height: 44px; padding: 0; border: 1px solid #c7ab7e;
    border-radius: 5px; font-size: 13px; font-weight: 700; background: #fff2d8; color: #153e77;
  }
  .menu-toggle { background: #153e77; color: #fff0d3; border-color: #153e77; }
  .menu-toggle svg { width: 23px; height: 23px; }
  .has-mobile-nav > header > nav { display: none; }
  .has-mobile-nav.mobile-menu-open > header > nav {
    display: grid; grid-template-columns: 1fr 1fr; position: absolute; top: 100%; left: 0; right: 0;
    width: 100%; max-height: calc(100dvh - 170px); overflow-y: auto; overscroll-behavior: contain;
    background: #faf2df; padding: 12px 16px 18px; gap: 6px; border: 0;
    border-bottom: 4px solid #b92c35; box-shadow: 0 14px 20px #0c285b30;
  }
  .has-mobile-nav > header > nav a {
    display: flex; align-items: center; min-height: 48px; padding: 12px;
    white-space: normal; font-size: 14px; line-height: 1.5; border: 1px solid #dbc7a4; border-radius: 4px;
  }
  .has-mobile-nav > header > nav .language-link { display: none; }
}

@media (max-width: 760px) {
  html { scroll-padding-top: 90px; scroll-padding-bottom: 90px; }
  body { font-size: 16px; -webkit-text-size-adjust: 100%; }
  .has-mobile-nav { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
  .topline { padding: 8px 16px; font-size: 8px; line-height: 1.5; letter-spacing: .8px; }
  .has-mobile-nav > header > .brand { font-size: 19px; }
  .mobile-bottom-nav {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: fixed;
    bottom: 0; left: 0; right: 0; z-index: 35; border-top: 3px solid #b92c35;
    background: #faf2df; padding: 4px max(6px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(6px, env(safe-area-inset-left));
    box-shadow: 0 -4px 20px #0c285b1c;
  }
  .mobile-bottom-nav a, .mobile-bottom-nav button {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 5px; min-height: 62px; min-width: 0; padding: 6px 2px; color: #153e77;
    border: 0; border-radius: 4px; background: transparent; font: 600 11px/1.3 'DM Sans', sans-serif;
  }
  .mobile-bottom-nav svg { width: 23px; height: 23px; }
  .mobile-bottom-nav a[aria-current], .mobile-bottom-nav button[aria-expanded="true"] { color: #a42631; background: #eadbc1; }
  .mobile-bottom-nav :focus-visible { outline-offset: -3px; }
  .section, .fan-zone > .section, .wall-page .section { padding: 36px 20px; }
  .section-heading { gap: 12px; margin-bottom: 22px; }
  .section-heading > *, .podcast-heading > *, .game-opponent > div { min-width: 0; }
  .section-heading .eyebrow, .eyebrow, .hero .eyebrow, .podcast-heading .eyebrow {
    font-size: 10px; line-height: 1.6; letter-spacing: 1px;
  }
  h2 { font-size: 36px; line-height: 1.08; }
  .text-link { display: inline-flex; align-items: center; min-height: 44px; white-space: normal; font-size: 13px; line-height: 1.5; }
  .section-description, .fan-zone .fan-intro { font-size: 14px; line-height: 1.7; }
  .button, .outline-button, .segmented button, .game-link, .player-link, .podcast-links a, .podcast-rec-links a {
    min-height: 44px; font-size: 14px; line-height: 1.5;
  }
  input, select, textarea, .search input, .podcast-search input, .podcast-filters select,
  .add-podcast input, .add-podcast select, .upload-ticket #game-location,
  .upload-ticket input:not([type=checkbox]):not([type=file]), .upload-ticket select, .upload-ticket textarea {
    font-size: 16px; min-height: 48px; max-width: 100%;
  }
  button, input, select, textarea, summary, a { -webkit-tap-highlight-color: #b92c3526; }
  input[type=checkbox] { min-height: 0; }
  .hero-inner { padding: 26px 20px 48px; gap: 26px; }
  .hero h1 { font-size: clamp(40px, 11.5vw, 64px); line-height: .98; }
  .hero .eyebrow { margin-bottom: 14px; }
  .hero .hero-description { font-size: 14px; line-height: 1.6; padding: 12px 14px; margin: 18px 0 12px; }
  .hero-description br, .feature-story p br, .podcast-intro br { display: none; }
  .hero-buttons { display: grid; gap: 4px; }
  .hero .hero-buttons .button { font-size: 14px; padding: 12px 16px; min-height: 48px; }
  .hero .quiet-link { display: flex; align-items: center; min-height: 44px; font-size: 13px; }
  .hero-bottom { padding: 12px 0; font-size: 8px; }
  .next-game, .next-game:hover { padding: 0 20px 18px; }
  .ticket-ribbon { margin: 0 -20px 18px; padding: 16px 20px; }
  .ticket-ribbon > span { font-size: 22px; letter-spacing: 1px; }
  .ticket-ribbon > b { font-size: 9px; }
  .match-date { font-size: 13px; padding-bottom: 12px; }
  .match-teams { padding: 18px 0; }
  .team-badge strong { height: 68px; width: 68px; font-size: 32px; }
  .match-info { font-size: 13px; line-height: 1.7; padding: 10px; }
  .countdown { padding: 12px 8px; margin: 15px 0; }
  .countdown strong { font-size: 30px; letter-spacing: 1px; }
  .countdown small { font-size: 10px; letter-spacing: .5px; }
  .next-game .button { min-height: 48px; font-size: 14px; padding: 12px 16px; }
  .ticket-stub { margin-top: 17px; padding-top: 12px; font-size: 9px; letter-spacing: .3px; }
  .game-source { font-size: 11px; line-height: 1.6; }
  .heritage-ribbon { padding: 14px 20px; }
  .heritage-ribbon > span:nth-child(2) { font-size: 9px; line-height: 1.6; }
  .heritage-ribbon > a { font-size: 11px; min-height: 44px; display: flex; align-items: center; text-align: left; }
  .data-notice { padding: 14px 20px; font-size: 12px; line-height: 1.7; }
  .data-notice b { font-size: 11px; }
  .data-notice > a { font-size: 12px; min-height: 44px; display: flex; align-items: center; white-space: normal; }
  .dashboard-grid { display: flex; flex-direction: column; }
  .season-panel { order: -1; padding: 22px 18px; }
  .feature-story { min-height: 0; padding: 27px; }
  .feature-story h3 { font-size: 39px; }
  .feature-story .tag { font-size: 10px; line-height: 1.6; }
  .feature-story p, .feature-story > a { font-size: 14px; line-height: 1.7; }
  .feature-story > a { min-height: 44px; }
  .season-stats span { font-size: 11px; letter-spacing: .4px; }
  .panel-heading { gap: 12px; }
  .panel-heading > span { font-size: 11px; }
  .mini-heading { font-size: 11px; letter-spacing: .3px; align-items: center; }
  .mini-heading a { display: flex; align-items: center; min-height: 44px; font-size: 11px; line-height: 1.5; }
  .table-scroll { overflow-x: auto; }
  .season-panel table { font-size: 14px; }
  .season-panel th { font-size: 11px; padding: 10px 5px; }
  .season-panel td { padding: 12px 5px; }
  .data-caption, .room-section > .data-caption { font-size: 12px; line-height: 1.7; }
  .quick-links { gap: 14px; }
  .quick-links > a, .quick-links > a:last-child, .quick-links > a:nth-child(2), .quick-links > a:nth-child(-n+2) { min-height: 82px; padding: 15px 18px; }
  .quick-links b { font-size: 14px; }
  .quick-links small { font-size: 12px; line-height: 1.5; }
  .filter-bar { margin-left: 0; margin-right: 0; padding: 16px; gap: 14px; }
  .filter-bar .segmented button, .roster-toolbar .segmented button, .podcast-languages button { min-height: 44px; font-size: 13px; padding: 10px 12px; }
  .filter-bar .select-label { width: 100%; font-size: 11px; margin: 0; }
  .filter-bar select { flex: 1; min-width: 0; min-height: 48px; font-size: 16px; }
  .filter-bar .filter-note { font-size: 12px; }
  .game-row, .game-row:nth-child(even) { padding: 16px; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
  .game-day { font-size: 19px; }
  .game-day small, .game-time small, .game-result small { font-size: 11px; }
  .game-opponent { gap: 10px; }
  .opponent-abbr { flex-shrink: 0; width: 42px; }
  .game-opponent b { font-size: 14px; line-height: 1.5; }
  .game-opponent small { font-size: 12px; max-width: none; }
  .game-time, .game-result { font-size: 18px; }
  .game-row .venue-pill { font-size: 11px; letter-spacing: .5px; }
  .game-link { display: flex; align-items: center; justify-content: center; font-size: 13px; }
  .schedule-bottom { flex-direction: column; align-items: stretch; gap: 12px; }
  .schedule-bottom .data-caption { max-width: none; font-size: 12px; }
  .outline-button { padding: 12px 16px; }
  .roster-toolbar .segmented { width: 100%; display: flex; flex-wrap: nowrap; overflow-x: auto; padding: 5px; }
  .roster-toolbar .segmented button { flex: 0 0 auto; white-space: nowrap; }
  .search { width: 100%; }
  .player-grid { gap: 20px 14px; padding-right: 5px; }
  .player-card:before { min-height: 58px; padding: 15px 49px 12px 10px; font-size: 8px; letter-spacing: .5px; }
  .player-card .star { width: 44px; height: 44px; top: 6px; right: 6px; font-size: 24px; }
  .player-position { font-size: 10px; letter-spacing: .2px; }
  .player-body { padding: 14px 10px 5px; }
  .player-body h3 { font-size: 26px; line-height: 1.08; }
  .player-stats b { font-size: 22px; letter-spacing: -.5px; }
  .player-stats span { font-size: 10px; letter-spacing: .2px; }
  .player-link { font-size: 12px; line-height: 1.5; padding: 12px 0; }
  .mobile-roster-footer { display: grid; gap: 12px; margin-top: 20px; }
  .mobile-roster-footer p { font-size: 13px; }
  .fan-grid h3 { font-size: 31px; }
  .fan-grid .eyebrow { font-size: 10px; }
  .fan-card-ribbon strong small { font-size: 8px; letter-spacing: .3px; }
  .prediction-card > p:not(.eyebrow), .fan-zone #quiz-feedback { font-size: 14px; }
  .fan-zone #prediction-form label { font-size: 13px; }
  .fan-zone #prediction-form .button, .fan-zone #quiz-options button, .fan-zone #quiz-next { min-height: 48px; font-size: 14px; }
  .fan-zone #quiz-options { grid-template-columns: 1fr; }
  .fan-zone #quiz-progress { font-size: 11px; max-width: 110px; }
  .prediction-card .local-note { font-size: 12px !important; }
  .fan-zone .trivia-source { display: flex; align-items: center; min-height: 44px; font-size: 12px; }
  .source-grid > a, .source-grid > a:first-child { grid-row: auto; grid-template-rows: auto; gap: 12px; min-height: 0; }
  .source-grid small, .source-grid > a:first-child small { font-size: 11px; letter-spacing: .4px; }
  .source-grid p, .source-grid > a:first-child p { font-size: 14px; line-height: 1.7; }
  .source-grid b { font-size: 13px; }
  .podcast-heading { flex-wrap: wrap; }
  .dial-stamp { display: none; }
  .podcast-intro, .podcast-discover p:not(.eyebrow) { font-size: 14px; line-height: 1.7; }
  .podcast-discover .eyebrow { font-size: 10px; }
  .podcast-discover { padding: 22px; }
  .podcast-discover .button { font-size: 14px; min-height: 48px; width: 100%; }
  .podcast-languages { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .podcast-filters { grid-template-columns: minmax(0, 1fr); padding: 18px; gap: 16px; }
  .podcast-filters label { font-size: 11px; letter-spacing: .5px; }
  .podcast-saved-toggle { height: auto; min-height: 48px; font-size: 14px; }
  .podcast-results-bar { flex-wrap: wrap; }
  .podcast-results-bar p, .podcast-results-bar > button { font-size: 12px; }
  .podcast-results-bar > button { min-height: 44px; }
  .podcast-star { width: 44px; height: 44px; top: 9px; right: 9px; }
  .podcast-card-tags { padding-right: 29px; }
  .podcast-card-tags > small { font-size: 10px; }
  .podcast-card-tags > span, .podcast-category { font-size: 11px; }
  .podcast-card .podcast-description { font-size: 14px; line-height: 1.7; }
  .podcast-card .podcast-publisher, .podcast-card .podcast-episode-date { font-size: 12px; }
  .podcast-links { gap: 8px 16px; }
  .podcast-links a, .podcast-links .listen-primary { display: inline-flex; align-items: center; font-size: 13px; }
  #podcast-recommendation { flex-wrap: wrap; }
  #podcast-recommendation .eyebrow { font-size: 10px; }
  #podcast-recommendation p:not(.eyebrow) { font-size: 14px; }
  .podcast-rec-links a { display: inline-flex; align-items: center; font-size: 13px; }
  .add-podcast summary { font-size: 14px; min-height: 48px; }
  .add-podcast > p, .directory-note p, .directory-note a { font-size: 12px; line-height: 1.7; }
  .add-podcast label { font-size: 12px; }
  .add-podcast form .button { height: auto; min-height: 48px; font-size: 14px; white-space: normal; }
  .remove-custom { font-size: 12px; min-height: 44px; }
  .wall-invite { padding: 42px 20px; }
  .wall-hero { padding: 30px 22px 40px; gap: 28px; }
  .wall-hero h1 { font-size: clamp(40px, 12vw, 64px); }
  .wall-hero .eyebrow { font-size: 10px; }
  .wall-hero-copy > p:not(.eyebrow) { font-size: 15px; }
  .wall-pass { transform: none; }
  .wall-toolbar > .segmented button { font-size: 13px; min-height: 48px; padding: 10px; }
  .wall-rules summary { min-height: 44px; font-size: 14px; }
  .wall-rules p, .upload-note, .arena-hint, .upload-ticket .consent-label { font-size: 13px; }
  .upload-ticket label { font-size: 14px; }
  .upload-ticket .button { font-size: 14px; min-height: 48px; white-space: normal; }
  .photo-drop input { font-size: 13px; min-height: 44px; }
  .consent-label input { width: 24px; height: 24px; }
  .photo-close, .creator-close { width: 44px; height: 44px; }
  .creator-dialog { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
  .creator-trigger { font-size: 13px; min-height: 44px; }
  .creator-art figcaption { font-size: 12px; }
  .chant p { font-size: 14px; }
  .chant a { font-size: 12px; min-height: 44px; }
  footer { padding: 28px 20px; }
  .footer-top p { font-size: 12px; line-height: 1.7; }
  .footer-bottom { font-size: 11px; }
  .toast { bottom: calc(84px + env(safe-area-inset-bottom)); width: max-content; max-width: calc(100% - 32px); white-space: normal; font-size: 14px; }
}

@media (max-width: 380px) {
  .has-mobile-nav > header { padding-left: 12px; padding-right: 12px; gap: 6px; }
  .has-mobile-nav > header > .brand { font-size: 16px; gap: 6px; letter-spacing: .1px; }
  .has-mobile-nav > header .brand .crest { flex-basis: 32px; width: 32px; height: 42px; }
  .has-mobile-nav > header .brand small { font-size: 7px; letter-spacing: .4px; }
  .mobile-header-tools { gap: 4px; }
  .mobile-bottom-nav a, .mobile-bottom-nav button { font-size: 10px; }
  .section, .fan-zone > .section, .wall-page .section { padding-left: 16px; padding-right: 16px; }
  .game-row, .game-row:nth-child(even) { grid-template-columns: 72px minmax(0, 1fr); padding: 14px 12px; }
  .game-opponent { gap: 7px; }
  .opponent-abbr { width: 44px; font-size: 23px; }
  .player-stats b { font-size: 20px; }
  .fan-card-stamp { display: none; }
  .season-panel th, .season-panel td { padding-left: 3px; padding-right: 3px; }
}
@media (max-width: 360px) {
  .player-grid { grid-template-columns: minmax(0, 1fr); }
  .player-card:before { font-size: 10px; }
  .player-body h3 { min-height: 0; }
  .player-stats b { font-size: 25px; }
  .ticket-ribbon > b { max-width: 100px; font-size: 8px; }
  .ticket-ribbon > span { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
