/* Phase 8.5.4d — mobile document-width containment.
   Keep intentional horizontal scrolling inside individual wallpaper rails. */
@media (max-width:700px) {
  html { width:100%!important; max-width:100%!important; overflow-x:clip!important; }
  body { width:100%!important; max-width:100%!important; min-width:0!important; overflow-x:clip!important; margin-left:0!important; margin-right:0!important; }
  body > main#home { display:block; width:100%; min-width:0; max-width:100%; overflow-x:clip; box-sizing:border-box; }
  main#home > .section, main#home > section, body > .siteFooter {
    width:100%; min-width:0; max-width:100%; box-sizing:border-box;
  }
  /* The page sections must not grow to the width of their desktop rails. */
  main#home > #categories, main#home > #featured,
  main#home > #explore, main#home > #genreBrowse {
    overflow-x:clip;
  }
  /* Grid children can shrink rather than impose their intrinsic min-content width. */
  #categories .categoryCarousel, #categories .heading,
  #featured .heading, #explore .heading, #genreBrowse .heading,
  #featuredGrid, #topicRows, #genreGrid { min-width:0; max-width:100%; box-sizing:border-box; }
  #categories .categoryCarousel { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  #categories .chip { min-width:0!important; }
  /* Fixed navigation always measures against the viewport, not a carousel. */
  html body > nav#mobileFloatNav.mobileFloatNav {
    left:0!important; right:0!important; width:100%!important;
    max-width:100%!important; box-sizing:border-box!important;
  }
}
