A bare 1fr track is shorthand for minmax(auto, 1fr), and that auto minimum is the content's min-content width. The track will not go below it, whatever you asked for. So one long word, one wide table or one marquee can push a column past its share and the whole grid past its container.
On one build a two-column panel specified as roughly 57 to 46 resolved to 356px and 955px, because the narrow panel's min-content was a heading plus a row of tag pills. On a phone the same component laid out nearly 2000px wide inside a 390px viewport.
The fix, and the trap next to it
Write minmax(0, 1fr) on the column and min-width: 0 on the item. Do it by default on any grid holding a marquee or a table.
Putting overflow: hidden on the guilty child does not help when that child is a flex item in a column flex container. Horizontal is then its cross axis, and the automatic minimum size rule never applies.
Why you will not see it
Because body { overflow-x: hidden } is on nearly every site, real overflow becomes unscrollable and therefore invisible to any check that detects it by trying to scroll. Measure the rectangles instead, skipping anything inside a clipping ancestor, and the offenders name themselves.
