/* Mobile readability layer (<=640px). Loaded after app.css from Base.astro.
   Kept separate from the global.css/app.css sync pair on purpose: pure overrides,
   no tokens. Floors: secondary text 12px, labels 12px, data 14px+, taps 44px. */
@media (max-width: 640px) {
  body { -webkit-text-size-adjust: 100%; line-height: 1.5; }
  html { --fs9: 12px; --fs10: 12px; --fs11: 12px; }
  html .text-\[10px\], html .text-\[11px\] { font-size: 12px; }
  html .page-op-label,
  html .eyebrow,
  html .stat-label,
  html .badge,
  html .classification-band,
  html .pm-tier-name,
  html .pm-tier-note,
  html .pm-fig,
  html .tc-op-label,
  html .tc-tier-label,
  html .tc-cap-name,
  html .tc-mini-lbl,
  html .tc-mini-v,
  html .tc-mini-tag,
  html .tc-preview-label,
  html .tc-classband-mark,
  html .tc-trust-inline { font-size: 12px; letter-spacing: 0.14em; }
  html .panel-head h3 { font-size: 13px; }
  html .btn { min-height: 44px; }
  html .btn-sm { min-height: 44px; font-size: 14px; padding: 0 16px; }
  html .input, html select.input, html input.input { min-height: 44px; font-size: 16px; }
  html .tc-navlink { padding-block: 12px; font-size: 16px; }
  html .panel-body { padding: 16px; }
  html .stat-value { font-size: 20px; }
  html .overflow-x-auto > table td, html .overflow-x-auto > table th { white-space: nowrap; }

  /* War report (wp-*): dense table keeps 12px floor, filters become real tap targets */
  html .wp-table { font-size: 12px; }
  html .wp-table th, html .wp-table td { padding: 8px 6px; }
  html .wp-sticky { max-width: 112px; }
  html .wp-chip { font-size: 13px; min-height: 40px; padding: 0 14px; }
  html .wp-fgroup-label { font-size: 12px; min-height: 40px; }
  html .wp-filters { gap: 6px 14px; }
  html .wp-legend, html .wp-status { font-size: 12px; }
  html .wp-warname { font-size: 15px; }
  html .wp-table thead th { font-size: 12px; }
  html #mobileMenu a, html #mobileMenu button { min-height: 44px; }
}
