/* Mobile fixes v5 */
@media (max-width: 768px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  *, *::before, *::after { box-sizing: border-box; }

  /* Tighten common paddings */
  .max-w-6xl.mx-auto.px-4 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
  .py-10 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
  .p-6 { padding: 1rem !important; }     /* many cards */
  .p-5 { padding: 1rem !important; }     /* topic cards */
  .rounded-3xl { border-radius: 1.25rem !important; }

  /* Ensure flex children can shrink */
  .min-w-0 { min-width: 0 !important; }
  .flex > * { min-width: 0; }

  /* Topic list: make title/meta wrap (no forced single-line) */
  a[href^="/topic"] .truncate {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* Badge / meta blocks should wrap */
  a[href^="/topic"] .flex { flex-wrap: wrap; }

  /* Contact form + any embedded anti-bot widget */
  form, .contact, .contact-form { width: 100% !important; max-width: 100% !important; }
  input, textarea, select, button { max-width: 100% !important; }

  /* If Cloudflare Turnstile is present, keep it inside viewport */
  .cf-turnstile, .cf-turnstile * { max-width: 100% !important; }
  .cf-turnstile { overflow: hidden; }
  @media (max-width: 360px) {
    .cf-turnstile { transform: scale(0.92); transform-origin: left top; }
  }

  /* Responsive video embeds */
  iframe, video { max-width: 100% !important; width: 100% !important; height: auto !important; }
  .video, .embed, .embed-video, .prose iframe { max-width: 100% !important; }

  /* Forum posts: prevent any content from forcing horizontal scroll */
  .post-body, .prose, .prose * {
    max-width: 100% !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .post-body img, .prose img { max-width: 100% !important; height: auto !important; }
  .post-body iframe, .prose iframe { max-width: 100% !important; }
  .post-body pre, .prose pre { max-width: 100% !important; overflow-x: auto !important; }
  .post-body code, .prose code { word-break: break-word; }
  .post-body table, .prose table { display: block; max-width: 100% !important; overflow-x: auto !important; }
}