/* Shared mobile layout contract. Loaded in the head, before UI initialization. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
img, video, iframe { max-width: 100%; }
:where(main, section, article, aside, form, fieldset, label, .shell) { min-width: 0; }
:where(h1, h2, h3, p, dd, li, main a, .callout, .trust-meta, .community-context-entry) { overflow-wrap: anywhere; }
.trust-meta > div { min-width: 0; }

@media (max-width: 900px) {
  .topbar .nav.shell { width: calc(100% - 32px); gap: 8px; min-height: 64px; height: auto !important; }
  .topbar .nav.shell > .brand { flex: 1 1 0; min-width: 0; gap: 8px; font-size: clamp(14px, 4vw, 19px); letter-spacing: -.03em; white-space: nowrap; }
  .topbar .nav.shell > .brand svg { width: 24px; height: 24px; flex: 0 0 24px; }
  .topbar .nav.shell > :is(.global-search-open, .global-mobile-menu-button, .menu) { flex: 0 0 44px; width: 44px; margin-left: 0; }
  .topbar .nav.shell > .community-shortcut { flex: 0 0 auto; margin-left: 0; }
  .topbar :is(.mobile-nav, .global-mobile-navigation)[data-open=true] { width: calc(100% - 32px); max-height: calc(100dvh - 88px); overflow-y: auto; overscroll-behavior: contain; }
  .global-search-panel .global-search-head { grid-template-columns: minmax(0,1fr) 44px; }
  .global-search-panel .global-search-input { min-width: 0; font-size: 16px; }
  .global-search-panel .global-search-close { width: 44px; }
  .global-search-dialog .global-search-panel { height: 100dvh; }
}

@media (max-width: 700px) {
  .shell { width: calc(100% - 32px); max-width: var(--max,1180px); }
  :where(.shell, main) > * { min-width: 0; }
  :where(.hero, .layout, .dashboard, .grid, .quick-grid, .cards, .results, .fields, .form-grid) > * { min-width: 0; }
  :is(.head, .article-head, .hero) h1 { font-size: clamp(2rem, 7.5vw, 2.6rem); line-height: 1.15; letter-spacing: -.035em; max-width: 100%; }
  :is(.head, .article-head) { padding-top: 32px; padding-bottom: 28px; }
  :where(.lead, .dek, .subtitle, .intro) { max-width: 100%; }
  :where(input, textarea, select, button) { max-width: 100%; box-sizing: border-box; }
  :where(input:not([type=checkbox]):not([type=radio]), textarea, select) { min-width: 0; font-size: max(16px,1em); }
  :where(.actions, .funnel-actions, .source-links, .filters, .tags) { flex-wrap: wrap; }
  :where(.btn, .button, .primary, .contact-button, .funnel-actions a) { white-space: normal; height: auto; min-height: 44px; line-height: 1.4; overflow-wrap: anywhere; }
  :where(.table-wrap, .table-scroll, .ds-table-wrap, .table-container) { max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; }
  /* Visually hidden headers must not create phantom horizontal overflow. */
  .mobile-card-table thead { clip-path: inset(50%); overflow: hidden; }
  .trust-meta { grid-template-columns: minmax(0,1fr); }
  .footer-row { flex-direction: column; align-items: flex-start; }
  .footer-row > * { min-width: 0; max-width: 100%; }
}

@media (max-width: 600px) {
  .hero { grid-template-columns: minmax(0,1fr); gap: 24px; padding-top: 28px; }
  .launch-mode { flex-direction: column; align-items: stretch; gap: 12px; }
  .launch-mode > div { min-width: 0; }
  .launch-mode .launch-mode-links { align-self: flex-start; flex-shrink: 1; }
  .home-community form > div { flex-direction: column; align-items: stretch; }
  .home-community :is(input, button) { width: 100%; min-width: 0; }
  .hero .actions { flex-direction: column; align-items: stretch; }
  .hero .actions .btn { flex: auto; padding: 12px 16px; }
  .home-destinations { grid-template-columns: minmax(0,1fr); }
  .quick-grid { grid-template-columns: minmax(0,1fr); }
  .contribute-data { grid-template-columns: minmax(0,1fr); }
  .contribute-data > * { min-width: 0; }
  .contribute-data a { white-space: normal; overflow-wrap: anywhere; }
}

@media (max-width: 359px) {
  .topbar .nav.shell > .community-shortcut { display: none !important; }
}
