/* Mobile overrides for all pages */
@media (max-width: 900px) {
  body { overflow-x: hidden; }
  header { flex-direction: column; align-items: flex-start; gap: 8px; }
  .layout { grid-template-columns: 1fr !important; min-height: auto !important; }
  main { padding: 12px !important; }
  .card { padding: 12px !important; margin-bottom: 12px !important; }
  .grid { grid-template-columns: 1fr !important; }
  form .grid { grid-template-columns: 1fr !important; }
  table { display: block; width: 100% !important; overflow-x: auto; }
  th, td { white-space: nowrap; }
  img, video, canvas, svg { max-width: 100%; height: auto; }
}

@media (max-width: 600px) {
  h1 { font-size: 20px; }
  h2 { font-size: 18px; }
  h3 { font-size: 16px; }
  .value { font-size: 18px; }
}