/* USCS shared responsive layer — collapses inline-styled grids and rigid boxes on small screens.
   Selectors use comma/colon-free fragments so they match the browser's serialized inline style. */

img, video, canvas { max-width: 100%; }
/* overflow-x:clip (not hidden) — hidden turns html/body into a scroll container and kills position:sticky */
body { overflow-x: clip; }

/* ---- tablet / small desktop ---- */
@media (max-width: 1024px) {
  [style*="repeat(4"], [style*="repeat(5"], [style*="repeat(6"] {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ---- portrait tablet ---- */
@media (max-width: 900px) {
  [style*="repeat(3"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [style*="1.2fr 1fr"],
  [style*="1.05fr 1fr"],
  [style*="1.02fr 1fr"],
  [style*="1.1fr 1fr"],
  [style*="1.4fr 1fr"],
  [style*="0.9fr 1.1fr"],
  [style*="1fr 1.1fr"],
  [style*="1fr 1.2fr"],
  [style*="220px 1fr"],
  [style*="auto 1fr 1fr 1.4fr"] { grid-template-columns: minmax(0, 1fr) !important; }

  [style*="height: 640px"], [style*="height: 800px"], [style*="height: 900px"],
  [style*="height:640px"], [style*="height:800px"], [style*="height:900px"] {
    height: auto !important; min-height: 300px;
  }
  [style*="min-width: 900px"], [style*="min-width: 800px"], [style*="min-width: 640px"],
  [style*="min-width:900px"], [style*="min-width:800px"], [style*="min-width:640px"] {
    min-width: 0 !important;
  }
}

/* ---- phone ---- */
@media (max-width: 640px) {
  [style*="repeat(2"], [style*="repeat(3"], [style*="repeat(4"],
  [style*="repeat(5"], [style*="repeat(6"],
  [style*="1fr 1fr"] { grid-template-columns: minmax(0, 1fr) !important; }

  /* let button and label rows wrap instead of overflowing */
  section [style*="display: flex"]:not([style*="flex-direction: column"]):not([style*="overflow: hidden"]) {
    flex-wrap: wrap;
  }

  /* desktop padding is too generous on a phone */
  section[style*="padding: clamp"] { padding-left: 20px !important; padding-right: 20px !important; }
  [style*="padding: 40px"] { padding: 24px !important; }
  [style*="padding: 36px 40px"] { padding: 24px 20px !important; }
  [style*="padding: 40px 36px"] { padding: 26px 22px !important; }
  [style*="padding: 0 40px"] { padding-left: 20px !important; padding-right: 20px !important; }

  [style*="letter-spacing: -0.03em"], [style*="letter-spacing: -0.035em"] { hyphens: auto; }
}