Tokens

Page ground. Warm near-black in dark, warm paper in light. Replaces the old --bg #111111.

Cards, the sidebar, table headers, the app frame. Replaces --surface and --bg-card.

Raised fills inside a card: inputs, segmented controls, icon tiles, hover rows, flat cards. Replaces --surface2.

Popovers, dropdowns, tooltips and the active segment of a segmented control.

Every hairline: card edges, table rules, list dividers, the sidebar edge. Decorative only, never the sole carrier of meaning.

Outline buttons, step connectors, empty-state dashes and any edge that must read on bg-200.

Border of a highlighted card (the active step, the primary call-to-action panel). Pair with shadow-glow.

Headings, body copy, stat values and button labels on bg-000 through bg-300 (16.5:1 dark, 15.8:1 light on bg-000).

Subtitles, descriptions, table cells, nav items at rest. Reads on bg-000 through bg-300 (8.9:1 dark, 6.9:1 light).

Kickers, captions, timestamps, placeholders and the Skipped status, on bg-000 through bg-200 (5.3:1 dark on bg-000, 4.7:1 on bg-200). Not for text on bg-300 in dark (4.2:1): use ink-secondary there.

Text and icons on accent-fill. 8.3:1 on the amber fill in both themes.

The brand amber as ink: kickers, active nav items, links, icon tiles, focus rings and the italic word in a title. 8.8:1 dark and 5.2:1 light on bg-000. Never as a large fill in light (use accent-fill).

Hover state of accent-coloured text and outlines.

Primary button and toggle fill in both themes, always with ink-inverse on it. Replaces the cream #f5e9d3 button and the violet --accent.

Hover state of accent-fill.

Tinted fill behind an active nav item, an icon tile, the input focus halo and the Running badge ground.

The old violet accent, kept for the Running state, info notices and the debug log level. 7.6:1 dark, 6.1:1 light on bg-000. Never for calls to action.

Ground of the Running badge and info notices.

Completed backups, healthy connections, positive deltas, the check mark on a recent-backup row. 7.2:1 dark, 4.8:1 light on bg-000. Always paired with a word or icon: success and danger are told apart by hue only (1.3:1), kept from the source.

Ground of the success badge and success notice.

Failed backups, error log lines, destructive buttons, negative deltas. 5.6:1 dark, 5.1:1 light on bg-000. Always with a word or icon (see success).

Ground of the error badge, error notice and destructive button.

Warn log lines, degraded connections, retry notices. Orange, not amber, so it never reads as the brand colour. 7.5:1 dark, 5.1:1 light on bg-000.

Ground of the warning badge and warning notice.

The main series in every chart: successful backups, storage over time. 8.8:1 dark, 3.0:1 light on bg-100 (a mark, not text).

Failed series beside chart-primary. Darker, not just redder, so the two bars differ in lightness (3.7:1 dark, 5.0:1 light on bg-100).

Skipped series and inactive bars. 3.1:1 dark, 3.7:1 light on bg-100.

Dashed grid lines (3 3) behind bars and areas.

Axis tick labels at 11px mono. Alias of ink-muted kept separate so charts can be tuned alone.

The 2px focus ring, offset 3px, on every interactive element. Solid, 8.8:1 dark and 5.2:1 light on bg-000.

Text selection highlight.

Scrim behind the mobile sidebar drawer and modals, including the HITL confirmation dialog.