/* Mobile safety net for pages without bespoke responsive CSS.
   Purely defensive — prevents the "broken on a phone" failure modes
   (horizontal scroll/overflow, iOS auto-zoom on input focus, images
   busting layout) without redesigning any page's actual layout. */
@media (max-width: 600px) {
  html, body {
    max-width: 100vw;
    overflow-x: hidden;
  }

  table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
  }

  input, select, textarea, button {
    font-size: 16px; /* prevents iOS Safari auto-zoom-on-focus */
    max-width: 100%;
  }

  img, video, canvas, svg {
    max-width: 100%;
    height: auto;
  }
}
