designlang Files

Depth pass on extraction: the inventories become systems.

Four groups of tokens were being reported as flat lists — every font size, every shadow string, every max-width — leaving the reader to infer the system. Now the system itself is extracted.

Typography

• Modular ratio inference with a power penalty (without one, a minor second explains any scale by raising itself to the 4th), reporting fit, ladder coverage and anchor — or refusing to name a ratio at all.
• Named scale — a usable role per step; display reserved for the largest step on the page.
• Fluid type — computed styles resolve clamp() to one px value at the capture viewport, so a site's responsive ramp was invisible. Authored fluid declarations are now harvested off the stylesheets and parsed into min/max px, flagging clamps whose preferred term carries no viewport unit and therefore never scale.
• Measure — characters per line, measured from real line boxes rather than paragraph containers.

Elevation

• Multi-layer shadows parse correctly. 0 1px 2px …, 0 10px 15px -3px … — what Tailwind emits — was parsed as one shadow, so blur, offset and spread were wrong for most real sites.
• An elevation ladder deduped from the raw set, with per-shadow tint (neutral vs brand-coloured) and a redundancy figure.

Layout

• The layout system — content column and gutters, the column count the grids agree on weighted by governed area, the vertical rhythm full-bleed sections use, a numeric gap ladder, fluid max-widths. A genuinely full-bleed page is reported as such, with the widest constrained block inside it.

Color

• Tonal ramps — a 50–950 ladder per role in OKLCH, with the site's own colour keeping its rung.
• Semantic pairs — surfaces and action colours paired with the foreground that actually reaches contrast, with ratio and WCAG level.
• Area-weighted dominance — colour usage counted elements, so two hundred 16px icons outranked a hero background.

Fixed

• Shadow tokens silently overwrote each other in css-vars, DTCG and the Tailwind config (keyed by size label).
• semantic.typography.body emitted the headline size, reading scale[0].
• semantic.shadow.elevated pointed at the faintest hairline on the page.
• layout.gaps was string-sorted — '10px' ranked before '4px'.

Everything surfaces through the markdown report, DESIGN.md, css-vars, DTCG tokens and the Tailwind config. 624 tests pass; verified end to end against stripe.com, linear.app, vercel.com and tailwindcss.com.

PR: [#184]