/* REPAIRS FRAGMENT — #home horizontal overflow at phone widths.
   Save as app/assets/home-overflow-fix.css and link it in <head>
   (or paste at the end of the inline <style> block).

   ROOT CAUSE (verified in the cascade):
   1) Base rule `.home-view{overflow-y:auto;overflow-x:hidden}` is CLOBBERED by the
      `@media(max-width:960px)` block's `.home-view{overflow:auto}` — so on every
      phone the home view is allowed to scroll sideways, and decorative overflow
      (hero-art 15px box-shadow, the rotated hero-art, the giant "13" watermarks,
      the stamp offsets) turns into a visible horizontal scrollbar.
   2) `.reaction-week` keeps its desktop 2-column `minmax(220px,.65fr)` grid at ALL
      widths — at 390px the featured video player crushes to a ~40px sliver, and
      at very narrow widths the fixed 220px minimum genuinely overflows its track.
   Selectors below use slightly higher specificity than the originals so this file
   wins regardless of where it lands in the cascade. Nothing else is touched. */

/* 1) Re-lock horizontal scrolling on the home view */
section.home-view{overflow-x:hidden}

/* 2) Collapse the Reaction-of-the-week grid to one column on phones/tablets */
@media(max-width:700px){
  #home .reaction-week{grid-template-columns:1fr}
  #home .reaction-player{width:100%;max-height:62vh}
}

/* 3) Defensive guards: grid children can't force columns wider than the phone,
      and no media inside #home may exceed the viewport */
#home .welcome-stage>*,
#home .home-layout>*,
#home .reaction-week>*,
#home .home-short>*{min-width:0}
#home img,#home iframe,#home video{max-width:100%}
