/* CareForAll AI — shared phone-friendly rules.
   Linked after each page's own <style>, so on small screens these win and the
   desktop-oriented layouts reflow into a single column that fits a phone. */
@media (max-width: 700px) {
  body { padding: 12px !important; }
  .wrap { max-width: 100% !important; }
  .card { padding: 14px !important; }

  /* stack multi-column form / layout grids */
  .row, .grid, .mods { display: block !important; }
  .row > div, .grid > div { margin-bottom: 10px; }

  /* stat tiles and code blocks: 2-up instead of 4-up */
  .kpis { grid-template-columns: 1fr 1fr !important; }
  .codes { grid-template-columns: 1fr 1fr !important; }

  /* wide tables scroll sideways instead of breaking the layout */
  table { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  .tabs { flex-wrap: wrap; }
  h1 { font-size: 18px !important; }

  /* 16px inputs stop iOS from auto-zooming on focus */
  input, select, textarea { font-size: 16px !important; }
}