/* Global responsive fix: layout-only overrides. */
html, body { max-width: 100%; overflow-x: hidden; }

*, *::before, *::after { box-sizing: border-box; }

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

iframe { max-width: 100%; }

table { width: 100%; max-width: 100%; display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

pre, code, kbd, samp { max-width: 100%; }
pre { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; }
code { overflow-wrap: anywhere; word-break: break-word; }

a, p, li, h1, h2, h3, h4, h5, h6, span { overflow-wrap: anywhere; word-break: break-word; }

.wrap, .layout, .card, .prose, main, article, section, header, footer, nav { min-width: 0; }

@media (max-width: 980px){
  body { display: block !important; padding: 12px 12px 18px !important; }
  .wrap { width: 100% !important; max-width: 100% !important; }
  .layout { grid-template-columns: 1fr !important; }
  header { flex-wrap: wrap !important; gap: 10px !important; }
  .toggles { flex-wrap: wrap !important; }
  .chip { max-width: 100% !important; }
  h1 { font-size: clamp(28px, 7vw, 40px) !important; }
}