The footer collapsed its facts by wrapping the overflow onto a clipped
second line. The fact disappeared but its width did not: the row kept the
space it had been given, so a dropped agent left a hole between the effort
and the duration — visible on both the phone and the desktop.
Decide it by measuring instead. The row cannot overflow, because the model
name truncates, so "did it fit" is read off the model: while the model is
cut, hide the next fact by priority — timestamp, then agent, then thinking
effort — and measure again. Hidden facts leave the layout entirely, the
model truncates only when there is nothing left to give, and the row stays
tight at every width.
CSS could not do this. Container-width breakpoints know nothing about the
model's length and dropped facts that still fitted; wrap-and-clip is what
left the hole in the first place.
Testing: package type-check, lint, the message test suite under the
isolated runner; drove a real chat in a browser (430px drops the timestamp
and the agent, 330px also the effort, restoring the width brings them all
back, no gaps in any state). The ResizeObserver path is unverified — this
preview browser delivers no observer callbacks at all — while the window
resize path is.