Density
Comfortable and compact change the vertical rhythm and the type scale — nothing else.
Density is set with data-density on any ancestor. It changes row padding, section gaps,
card padding, line height and the type scale. It never touches --spacing, and no control
drops below 24 × 24 px in either density — the release gate measures every interactive
element in a real browser at both.
| Token | Comfortable | Compact |
|---|---|---|
--row-py | 0.6875rem | 0.40625rem |
--section-gap | 1.5rem | 1rem |
--card-p | 1rem | 0.75rem |
--line-height | 1.5 | 1.36 |
--nav-row-h | 2rem | 1.75rem |
--fs-xs | 0.75rem | 0.75rem |
--fs-sm | 0.875rem | 0.8125rem |
--fs-base | 0.875rem | 0.8125rem |
--fs-2xl | 1.5rem | 1.375rem |