# Design System — Light Mode Color Palette

> **Superseded — light mode is not implemented, and this palette is not in the code.**
>
> The site is **dark only**. `css/tokens.css` has a single `:root` block; there is no
> `prefers-color-scheme` query, no `data-theme` switch, and none of the light hex values below appear
> anywhere in `css/`. Dark mode shipped as *the* theme rather than as one of two
> (`../working/plans/2026-06-19-dark-mode.md`, 2026-06-20).
>
> Keep this file as the record of the pre-dark-mode palette and as the starting point if a light
> theme is ever built — but do not read the "Light" column as describing the running site. See
> [`superseded-decisions.md`](superseded-decisions.md) → R9.

Light-mode counterpart to `design-system.md`, as originally specified. Only color tokens were intended to differ between themes — typography, spacing, radius, shadows, and layout are identical.

---

## Color palette

| Token | Light | Dark | Usage |
|---|---|---|---|
| `--color-paper` | `#F7F5F2` | `#1A1814` | Page background |
| `--color-canvas` | `#FFFFFF` | `#22201B` | Card surfaces, form backgrounds |
| `--color-ink` | `#17171A` | `#EDE8DF` | Primary text |
| `--color-ink-2` | `#4A4850` | `#B8B0A4` | Body text — muted |
| `--color-ink-muted` | `#9896A0` | `#90887E` | Labels, timestamps, captions |
| `--color-border` | `#E8E6E3` | `#2E2B25` | Standard dividers |
| `--color-border-soft` | `#F0EDEA` | `#252219` | Subtle dividers |
| `--color-accent` | `#1F6B5A` | `#2E9880` | Teal — brand color, links, CTAs |
| `--color-accent-hover` | `#185647` | `#287A68` | Hover/pressed teal |
| `--color-accent-light` | `#EBF5F2` | `#1A2E29` | Pale teal tint backgrounds |
| `--color-accent-on` | `#FFFFFF` | `#FFFFFF` | Text on accent surfaces |
| `--color-surface-raised` | `#F0EDE9` | `#2A2720` | Elevated surfaces: tooltips, hover |
| `--color-ink-inverse` | `#FFFFFF` | `#17171A` | Text on accent-coloured buttons |

### Notes on accent values

The dark accent is `#2E9880` — a lightened version of the original `#1F6B5A` to maintain contrast against near-black backgrounds.

### Notes on the two added tokens

- **`--color-surface-raised`** (`#F0EDE9`): warm off-white, slightly darker than `--color-canvas` (`#FFFFFF`) to suggest elevation — mirrors the dark mode pattern of `#2A2720` sitting just above `#22201B`.
- **`--color-ink-inverse`** (`#FFFFFF`): white text on the dark teal accent (`#1F6B5A`). Inverse of dark mode where the lightened accent (`#2E9880`) is bright enough to carry dark text (`#17171A`).