PageLayout

The rhythm of a page's content — the gap between blocks, a reading width, and an optional side index. What every screen used to assemble by hand.

When to use it

Every admin screen. The block order is binding: header → metrics → toolbar → content; the gaps between them are held by this primitive, not by classes written in place.
A screen that is read or filled in — a long settings flow, a form, legal text: width="reading". A line across a whole monitor is skimmed, not read.
A record's detail: read, but not a form — width="wide". Wider than a reading column, narrower than the frame: a block stretched to 1,440 px stops reading as one object.
The whole screen is one small box — signing in, confirming, a module with nothing in it yet: width="card". The one width that also centres itself.
A screen with its own index (aside + IngotSideNav): the index stands still, the content scrolls.

The application's outer frame — the 1440 px width and the edge padding are held by the shell under the top bar, not by the page.
A card grid or a two-column block inside the content. That is the inside of a block (a grid written in place), not the page frame — the frame must not know what is in it.
Application-level side navigation. The admin has none; aside is the index of one page's content.

width: "full" | "wide" | "reading" | "card" — By what the page IS: full (default, --frame) for tables and lists · wide (--page-wide) for a detail that is read · reading (--page-reading) for a form or a text · card (--page-card) for a screen that is one box, and the only one that centres itself.
aside: ReactNode — The side index on the left, typically IngotSideNav. From `md` a sticky column `--aside` wide; below `md` a collapsed block above the content. It travels with `asideLabel` — the type does not allow one without the other.
asideLabel: string — What the collapsed index is called on a narrow screen (“Contents”), already translated. Required with `aside`: below `md` the index is a block the reader opens, and an unnamed block is one nobody opens.
children: ReactNode — The page's blocks in the binding order. The gaps between them are drawn by the layout.
testId: string — An anchor for tests. It does not affect the appearance.