Models → TTS rendered as a 45px strip in the middle of an empty
workspace. The cause was not inside the page: `models-tts-section` had
no CSS rule at all, and an unknown custom element is `display: inline`.
Its host is switched to `display: flex` by JS, so the section became a
content-sized flex item in a row container. Its three siblings escaped
only because they were named in a sizing block that TTS was never added
to.
Replace that enumeration with `tasks-page > *, projects-page > *,
models-hub-page > *`. The three multiplexers render exactly one section
at a time as their only child, so a new section now inherits the sizing
by existing — the list of names was itself the bug, and forgetting it
was silent: no console error, no failed build, just a narrow page.
Also give every remaining page host the two properties that made this
survivable elsewhere: `flex-direction: column` on agent-inbox,
approval-rules, approval-groups, llm-providers and models-hub (in the
default `row` the width depends on the inner div remembering
`width: 100%`), and `min-width: 0` on agents, config and dashboard so a
wide table cannot push the workspace past the viewport.
Measured in headless Chrome against the real stylesheets: the TTS
section goes from 45px to 589px in a 590px host, matching its siblings.
Record the trap in dev-docs/frontend.md, which had no page-shell section
at all — and add the models-tts row missing from its component table.
Daniele
dguiducci