Audit and standardize typography (colors, sizes, casing)

[thalida]

Audit all text across the site and standardize the typography system — font colors, sizes, and casing — so type is consistent and token-driven everywhere.

Audit (exhaustive): sweep every view/component for text styling and catalog where it diverges:

• Sizes — one-off font-size values that bypass the size scale; inconsistent sizing for the same role (labels, headings, body, captions).
• Colors — text using hardcoded/ad-hoc colors instead of the semantic text tokens; inconsistent "primary vs faint vs muted" usage.
• Casing — mixed UPPERCASE / Title Case / sentence case for the same kind of element (section headers, labels, tab/button text, badges).

Standardize: consolidate onto the design-token system and define the canonical conventions:

• A single type size scale (tokens) and a rule for which role uses which step.
• Semantic text color roles (primary / secondary / faint / inverse / accent) with no raw color values at call sites.
• A casing convention — when uppercase (e.g. eyebrow labels) vs sentence case — applied consistently.

Then apply across the app and remove the divergent one-offs.

Relevant code:

• app/src/styles/tokens.css (type + color tokens)
• app/src/styles/text.css (text utility classes)
• per-component CSS under app/src/views/ and app/src/components/

Overlaps the accessibility audit (#79) for color contrast (text tokens must meet WCAG AA), and follows the interactive-affordance work (#78) which established the link/button/tab visual vocabulary.