/* Shared phone fixes, loaded last on every page so it wins over page styles. */

@media (max-width: 720px) {
  /* Decorative glows and off-canvas drawers must not make the page scroll sideways. */
  html, body { max-width: 100%; overflow-x: clip; }

  /* Top bars: logo stays, the button row scrolls horizontally instead of overflowing. */
  body > nav, .topbar { gap: 12px; padding-left: 16px; padding-right: 16px; }
  .nav-logo { flex-shrink: 0; white-space: nowrap; }
  .nav-actions {
    min-width: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .nav-actions::-webkit-scrollbar { display: none; }
  .nav-actions > * { flex-shrink: 0; white-space: nowrap; }

  /* iOS Safari zooms into any field with a font smaller than 16px. */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,
  select { font-size: max(16px, 1em); }
}

@media (max-width: 420px) {
  .nav-logo { font-size: 1rem; }
  .nav-logo svg { width: 1.6rem; height: 1.6rem; }
}