feat(theme): add typography role tokens

[wemra3]

Motivation

AppShell defines a font family but no typography tokens. The styling guide gives a table of utility pairings, and real code matches it in only 15% to 40% of places (analysis in tailor-inc/platform-planning#1580). Without names for text styles, people and AI agents choose size, weight, and line height again for each element.

This PR adds the tokens only. No component uses them yet, so nothing changes visually.

Design Decision

Tokens first, in two layers like the colors

themes/default.css holds four variables per role: --app-shell-type-<role>-<size|line-height|weight|letter-spacing>. theme.bridge.css maps them to --text-<role> inside the existing @theme inline, with var() references only. @theme inline writes literal values into the utility, so values placed in the bridge could not be overridden on :root.

Ten roles with today's values

heading-lg, heading-md, heading-sm, body-md, body-sm, label-md, label-sm, code-sm, plus body-md-relaxed and body-sm-relaxed for long text. The values match the current utility pairings. Line height is a unitless ratio on a 4px grid. code-sm needs font-mono, because --text-* cannot set font-family.

cn() registers the role names

tailwind-merge reads an unknown text-* class as a text color. Without registration, cn("text-label-md", "text-muted-foreground") keeps only the color, so a role passed in className to an AppShell component would be lost. Core's cn() now registers the ten names in the font-size group. This change is limited to lib/utils.ts and its test.

Modifiers are a documented rule

A role may be combined with leading-none, tabular-nums, font-medium or font-semibold, and uppercase. This is written in the styling guide. There is no lint rule.

Summary

• Add 10 typography role tokens and text-* utilities.
• Register the role names in core's cn().
• Add tests: token and bridge symmetry, fixed values, and a Tailwind compile test that checks the emitted CSS.
• Rewrite the Typography section of the styling guide, with a live example.
• Add the decision record decisions/typography-roles.md.
• Fix the docs-browser @source path, which pointed to a folder that does not exist. This affects the docs app only.

Not in this PR

Applying roles to core components, a Text component, overline, moving 10px and 11px text to 12px, and tabular-nums as the default for numeric DataTable columns.

Question for reviewers

The cream and bloom palettes set line-height: 1.2 and letter-spacing: -0.03em on html :where(h1, h2, h3, h4, h5, h6) outside any @layer. This rule wins over a role utility on those elements. This PR keeps the rule and documents the effect. What does the rule protect, and should it stay after heading roles are applied?

🤖 Generated with Claude Code

[github-actions]

Code Metrics Report

	main (529b3ac)	#572 (9d5f2ec)	+/-
Coverage	87.6%	87.6%	+0.0%
Test Execution Time	2m14s	1m27s	-47s

Details

  |                     | main (529b3ac) | #572 (9d5f2ec) |  +/-  |
  |---------------------|----------------|----------------|-------|
+ | Coverage            |          87.6% |          87.6% | +0.0% |
  |   Files             |            206 |            206 |     0 |
  |   Lines             |           6090 |           6092 |    +2 |
+ |   Covered           |           5335 |           5337 |    +2 |
+ | Test Execution Time |          2m14s |          1m27s |  -47s |

Code coverage of files in pull request scope (100.0% → 100.0%, patch 100.0%)

Files	Coverage	+/-	Patch Coverage	Status
packages/core/src/lib/utils.ts	100.0%	0.0%	100.0%	modified

---

Reported by octocov

[IzumiSy]

@wemra3 this looks good to go, but can you resolve conflicts? I will approve this PR after that 🙏

[IzumiSy]

Looks good!

Can I get eyes from @interacsean, too?