/* iPhone/iPad usability overrides. Kept separate so device-specific tuning stays easy to extend. */
@media (max-width: 650px) {
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body { display: block; min-height: 100vh; min-height: 100dvh; overflow-x: hidden; padding-bottom: env(safe-area-inset-bottom); }
  .sidebar {
    position: sticky; top: 0; z-index: 30; width: 100%; min-width: 0; min-height: unset;
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
    background: var(--navy); box-shadow: 0 3px 12px #13243b18;
  }
  nav { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; scrollbar-width: none; padding-bottom: 2px; }
  nav::-webkit-scrollbar { display: none; }
  nav .nav-item { flex: 0 0 auto; min-height: 44px; touch-action: pan-x; }
  header { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 10px; }
  .header-right { min-width: 0; width: 100%; justify-content: flex-start; }
  #voiceStatus { min-width: 0; }
  .content { min-width: 0; width: 100%; overflow-wrap: anywhere; padding-bottom: calc(22px + env(safe-area-inset-bottom)); }
  .grid, .card, .field { min-width: 0; }
  .table-wrap { max-width: 100%; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
  .btn, .icon-btn, .walk-subtab { min-height: 44px; }
  .icon-btn { min-width: 44px; }
  input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px !important; }
  input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; }
  .field input, .field select, .field textarea { min-height: 44px; }
  .walk-map { touch-action: manipulation; }
  .signatures { display: grid; gap: 32px; margin-top: 42px; }
  footer { padding-bottom: max(12px, env(safe-area-inset-bottom)); }
}

@media (max-width: 430px) {
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .page-intro { flex-wrap: wrap; }
  .page-intro > * { min-width: 0; }
  .inline-form { align-items: stretch; }
  .inline-form .field { min-width: min(100%, 130px); }
  .actions, .toolbar { flex-wrap: wrap; }
  .photo-item { max-width: 100%; flex-wrap: wrap; }
  .photo-item input { max-width: 100%; min-width: 0; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stat { min-width: 0; }
  .stat-value { overflow-wrap: anywhere; }
}

@media (max-width: 360px) {
  .content { padding-left: max(10px, env(safe-area-inset-left)); padding-right: max(10px, env(safe-area-inset-right)); }
  .header-right { gap: 4px; }
  .global-plan-select { max-width: min(100%, 145px); }
  .btn { padding-left: 9px; padding-right: 9px; }
  .stats { grid-template-columns: minmax(0, 1fr); }
}

@media (min-width: 651px) and (max-width: 1000px) {
  body { min-height: 100vh; min-height: 100dvh; padding-bottom: env(safe-area-inset-bottom); }
  .sidebar { padding-top: calc(12px + env(safe-area-inset-top)); }
  footer { padding-bottom: max(15px, env(safe-area-inset-bottom)); }
}
