# 05 — Design system (applied)

Source of truth: `brand/tokens.json`. Designed reference: `brand/design-system.html`, `brand/contracts-states.html`.

## Token changes in this programme

| Token | Before | After | Why |
|---|---|---|---|
| `color.faint` | `#5b6678` (3.47:1) | `#7a8496` (≥5.3:1 on bg) | WCAG AA for small meta text |

## Semantic mapping (product CSS)

| Semantic | Primitive |
|---|---|
| `--bg` canvas | bg |
| `--ink` text | ink |
| `--dim` secondary | dim |
| `--faint` meta | faint (updated) |
| `--mood` accent/action | mood |
| `--danger` error | danger |
| State moods | stateMood.* |

## Components in product

Buttons, chips, tier cards, companion host, speech, intent dialog, gallery cards, code export — contracts in `brand/contracts-states.html`.

## Motion

`dur-fast` 160ms · `dur` 280ms · ease `cubic-bezier(.22,1,.36,1)` · reduced-motion disables transforms/caret blink.

## Icons

Mood pip only as filled signature; prop icons remain minimal spans.