Layouts

The .container, .grid and .row primitives, and the --container-bleed contract.

Overview

Why there are only three primitives, the column count they share, and the build step they all need.

Container

The centred wrapper, its responsive max-width, and the --container-bleed contract every full-bleed child depends on.

Grid

A CSS grid whose column count follows the breakpoint, and the inherited --grid-column that lets one child span…

Row

The flex wrapper, its four proportional column modifiers, the gap term in their width formula, and the two offsets.