A long-form page begins with a clear source order: title, standfirst,
body, figures, and onward navigation. Use a measured column when
copy runs long, and keep an InlineCode chip available for tokens such as
--gutter-fluid mid-sentence.
Structure before decoration
The editorial split gives the headline and standfirst distinct measures without inventing another card. On small screens, source order collapses the tracks into one readable sequence.
- Squared markers, never rounded bullets.
- Nested items indent cleanly.
A hairline left rule marks the quote without adding a colored bar.

Composing the body
Prose keeps a stable reading measure while figures may use the full column. Code, quotation, and list styles remain part of the same document voice.
function renderArticle(slug: string) {
const source = loadMarkdown(slug);
// monochrome tokens, theme-flip-safe
return parse(source);
}
The closing navigation uses working destinations within this example.