/* Final mobile guardrails: preserve the approved visual system while preventing
   narrow-screen clipping, crowded controls, and undersized footer targets. */
@media (max-width: 640px) {
  html,
  body { overflow-x: clip; }

  :is(main, #submission, .submission-layout, .submission-intro, .submission-form-surface, #business-form, #business-form .fields, .form-section, .section-grid, .create-card, .tell-community, .board-tools, #board-cards, .live-card-stage, .live-preview-heading, .footer-inner, .footer-nav, .footer-utility) { min-width: 0; }

  :is(.header-descriptor, .directory-intro > p, .submission-intro .hint, .intro-copy, .auth-explanation, .live-card-caption, .contact-note, .footer-community, .footer-credit, .footer-meta, .detail .description, .detail .facts dd) { overflow-wrap: anywhere; }

  .live-preview-heading { flex-wrap: wrap; align-items: center; row-gap: 8px; }
  .live-preview-tabs { flex: 0 0 auto; }

  .upload-preview,
  .upload-preview-actions,
  .submission-actions { min-width: 0; }

  .upload-preview :is(img, .card-preview),
  .live-card-cork,
  .preview-board-card { max-width: 100%; }

  .footer-nav a,
  .footer-utility a { display: inline-flex; align-items: center; min-height: 44px; }

  .footer-utility p { overflow-wrap: anywhere; }
}

@media (max-width: 480px) {
  .site-header { gap: 12px; }
  .site-header .brand-lockup { min-width: 0; }
  .site-header .board-link { min-width: 44px; padding-inline: 12px; white-space: nowrap; }

  .about-hero h1 { max-width: 12ch; }
  .about-section,
  .founder-content { min-width: 0; }

  .detail .links { grid-template-columns: 1fr; }
  .detail .links a { justify-content: center; }
}

@media (max-width: 360px) {
  main > header .actions { max-width: 100%; flex-wrap: wrap; justify-content: center; }
  main > header .pin-business-action { max-width: 100%; }
  .board-tools :is(input, select) { min-width: 0; }
  .footer-logo { max-width: min(100%, 190px); }
}