/* Main-site layouts only. Fortune has its own base; game interiors are excluded. */
.breadcrumbs > *,
.messages .message,
.report-card p,
.hidden-item > a,
.hidden-item > p {
  min-width: 0;
  overflow-wrap: anywhere;
}
.site-footer nav > a { overflow-wrap: anywhere; }
.arcade-board .arcade-board-tabs > button { min-height: 44px; }

/* The main navigation, including the signed-in label, needs desktop width. */
@media (max-width: 1199px) {
  .site-header .desktop-nav { display: none; }
  .site-header .mobile-menu { display: block; margin-left: auto; flex-shrink: 0; }
  .mobile-menu summary {
    cursor: pointer; list-style: none; width: 44px; height: 44px;
    display: grid; place-items: center;
  }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu .menu-lines {
    display: block; width: 23px; height: 16px;
    border-block: 1.5px solid var(--paper); position: relative;
  }
  .mobile-menu .menu-lines::after {
    content: ''; position: absolute; left: 0; right: 0; top: 6px;
    height: 1.5px; background: var(--paper);
  }
  .site-header .mobile-menu nav {
    position: absolute; top: calc(100% + 8px); left: 0; right: 0;
    border: 1px solid #4b5b62; border-radius: 10px; background: #111a1f;
    display: grid; z-index: 50; padding: 8px;
    max-height: calc(100dvh - 128px); overflow-y: auto;
    box-shadow: 0 15px 40px #0008;
  }
  .mobile-menu nav a {
    display: flex; align-items: center; min-height: 48px; padding: 12px 14px;
    font-size: 16px; line-height: 1.5; border-bottom: 1px solid #2e3b40;
  }
  .mobile-menu nav a:last-child { border-bottom: 0; }
  .mobile-menu nav a:hover { background: #222e34; }

  /* A 16px input keeps Safari's focus zoom from displacing the form. */
  :is(.page-shell, .auth-layout) :is(input, select, textarea):not([type=checkbox]):not([type=radio]) {
    font-size: 16px; min-height: 48px;
  }
  .forum-filters .search-field input { padding-right: 54px; }
  .forum-filters .search-button { width: 48px; }
  .forum-filters .filter-actions .secondary.small { min-height: 44px; }
  .account-shell .account-disclosure > summary {
    min-height: 44px; display: flex; align-items: center;
  }
  .home-page .atmosphere-dock :is(.motion-toggle, .atmosphere-control) { min-height: 44px; }
}

@media (max-width: 900px) {
  .form-layout, .auth-layout, .review-layout { grid-template-columns: minmax(0, 1fr); }
  .form-aside { max-width: none; }
  .forum-filters .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  :is(.page-shell, .auth-layout) :is(.field label, .stack-form > label, .filter-grid label),
  .report-disclosure form > label { font-size: 14px; line-height: 1.5; }
  :is(.page-shell, .auth-layout) :is(.help-text, .field-errors, .form-errors, .checkbox-row label) {
    font-size: 14px; line-height: 1.6;
  }
  :is(.page-shell, .auth-layout) .checkbox-row { min-height: 44px; align-items: center; }
  :is(.page-shell, .auth-layout) .checkbox-row label { padding-block: 8px; }
  :is(.page-shell, .auth-layout) :is(.text-link, .quiet-link, .small),
  :is(.hero-actions, .content-shell, .replay-feature, .latest-section) .text-link {
    display: inline-flex; align-items: center; min-height: 44px;
    padding-block: 10px; font-size: 14px; line-height: 1.5;
    max-width: 100%; overflow-wrap: anywhere;
  }
  .page-shell .reply-permalink {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; min-height: 44px; font-size: 14px;
  }
  .page-shell :is(.auth-bottom, .auth-card .recovery-link) { font-size: 14px; }
  .page-shell :is(.auth-bottom > a, .post-bottom > a, .breadcrumbs > a) {
    display: inline-flex; align-items: center; min-height: 44px; padding-block: 8px;
    font-size: 14px; line-height: 1.5;
  }
  .page-shell .form-note { font-size: 13px !important; }
  .page-shell .post-author { flex-wrap: wrap; }
  .page-shell .post-author > div { flex: 1; }
  .page-shell :is(.disclosure, .account-disclosure) > summary {
    min-height: 44px; display: flex; align-items: center; font-size: 15px;
  }
  .page-shell .filter-actions { flex-wrap: wrap; gap: 8px 18px; }
  .page-shell .pagination { flex-wrap: wrap; gap: 10px 18px; }
  .page-shell :is(.post-body, .article-body, .prose-page p, .selection-steps p, .team-bottom .panel p) {
    font-size: 16px; line-height: 1.75;
  }
  .page-shell :is(.notice, .report-card p, .hidden-item p) { font-size: 14px; }
  .page-shell :is(.topic-meta, .small-meta, .post-author time, .post-bottom, .match-strip > div > span) {
    font-size: 12px; line-height: 1.6;
  }
  .page-shell :is(.category-label, .badge) { font-size: 11px; line-height: 1.5; }
  .page-shell .match-strip { gap: 16px 22px; }
  .page-shell .match-strip :is(strong, a) { font-size: 14px; }
  .site-footer nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 18px; }
  .site-footer nav a {
    display: flex; align-items: center; min-height: 44px; font-size: 14px;
    line-height: 1.5; padding-block: 10px;
  }
  .footer-meta { font-size: 12px; align-items: center; flex-wrap: wrap; }
  .footer-meta > a { min-height: 44px; }
}

@media (max-width: 480px) {
  .forum-filters .filter-grid { grid-template-columns: minmax(0, 1fr); }
  .page-shell .section-heading { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
  .page-shell .form-actions > :is(.primary, .secondary) { width: 100%; }
}
/* Keep news, playbook, and the signed-in account on one header row. */
@media (min-width: 1200px) and (max-width: 1399px) {
  .site-header .desktop-nav { gap: 14px; }
  .site-header .desktop-nav .login { white-space: nowrap; gap: 12px; padding-inline: 16px; }
}