Container

The width constraint, and the only thing in the system that knows the page gutter. It goes inside a full-width <section>, so the section's background bleeds edge to edge while its content stays aligned with every other section (ADR 0012). Wrapping a section in a container instead is the mistake this component exists to prevent.

Three widths. default is the content measure,wide is chrome that wants to reach past the prose (the header bar), and full lifts the cap entirely — the viewport, held off its edges by the gutter alone. Only the listings index usesfull, and it is not a measure, so it has no token.

Container publishes its gutter as --container-gutter. That is what lets a descendant hang into it: the .well idiom bleeds its card exactly one gutter outward, so the text inside still lines up with unwelled content at the same measure. A block must never compute the gutter for itself — it cannot see the value, and a guess goes wrong the moment the gutter changes.

The three widths

The frame below is the viewport stand-in. Each band is a container of a different width holding the same sentence.

The well

well is the convenience form: the card's chrome bleeds outward by exactly the gutter, so its padding sits in the gutter instead of indenting the text. The two paragraphs below start on the same vertical line.