Rhythm
All clamp-based. Same on web and docs. The app uses fixed values for chrome (sidebar, topbar) but page interiors inherit these.
At the current viewport
--pad-x
--section-y
--section-y-tight
--gap-card
--gap-grid
Tokens
| Token | Value | Use |
|---|---|---|
--content-w | 1240px | content max width |
--pad-x | clamp(20px, 5vw, 96px) | side gutter |
--section-y | clamp(100px, 12vw, 180px) | section padding |
--section-y-tight | clamp(72px, 8vw, 120px) | tight sections |
--gap-card | clamp(24px, 3vw, 40px) | card grid gap |
--gap-grid | clamp(40px, 5vw, 80px) | feature-row grid gap |
Two-column layouts collapse at 900 px.