/* ═══════════════════════════════════════════════════════════
   PIPER, fx-fixes.css
   Loads last. Corrections found by measuring the real page in a
   real browser, kept out of the module files so the modules stay
   as their authors wrote them and this stays auditable.
   ═══════════════════════════════════════════════════════════ */

/* A grid item's default min-width is auto, which refuses to shrink
   below the item's min-content width. The swap card's large mono
   input sets a wide min-content, so at 390px the card measured
   409px inside a 350px column and pushed the whole document into
   horizontal scroll. minmax(0, 1fr) is the actual fix; min-width
   on the child alone would leave the same trap for the next item
   dropped into this grid. */
@media (max-width: 860px) {
  .buy__grid,
  .market__grid,
  .verify__grid,
  .terms__grid,
  .log__grid { grid-template-columns: minmax(0, 1fr); }
}

/* The input itself must also be allowed to shrink. A flex child
   with a long value and no min-width will not wrap or clip, it
   just widens its parent. */
.swap__field { min-width: 0; }
.swap__input,
.swap__out { min-width: 0; }

/* Parallax needs the backdrop to be larger than its frame, which
   is fine, but the frame has to clip it. Without this the bleed
   becomes page-level horizontal scroll on every phone. */
.wild { overflow: hidden; }
.wild__bg { overflow: hidden; }

/* Last line of defence. Vertical scrolling is untouched, and clip
   beats hidden here because hidden on the root would silently
   create a scroll container and break position: sticky in the
   meme stack. */
html { overflow-x: clip; }