Colour · light
Base surface · mist--surface-base#E8EFED
Pane glass · 55% white--pane-bgrgba(252,254,253,.55)
Sheet glass · 74% white--sheet-bgrgba(252,254,253,.74)
Float glass · 38% white--float-bgrgba(252,254,253,.38)
Primary ink--ink-primary#182625
Secondary ink--ink-secondary#5B6E6B
Accent · kelp--accent-kelp#2E5E52
Agent pebble--agent-pebble#2E5E52
Success--success#2E5E52
Warning--warning#9A6A2F
Refraction edge--edge-refractrgba(255,255,255,.95)
Colour · dark
Base surface · deep harbour--surface-base#0C1616
Pane glass · slate 52%--pane-bgrgba(34,52,50,.52)
Sheet glass · slate 72%--sheet-bgrgba(26,40,39,.72)
Float glass · slate 40%--float-bgrgba(40,58,56,.40)
Primary ink--ink-primary#E2ECE9
Secondary ink--ink-secondary#93A8A3
Accent · kelp light--accent-kelp#7FB3A4
Agent pebble--agent-pebble#7FB3A4
Success--success#7FB3A4
Warning--warning#D8A76A
Refraction edge--edge-refractrgba(226,236,233,.55)
Type
Display--text-display · Hanken Grotesk 700 34px/1.08 · -0.022em
Title--text-title · Hanken Grotesk 600 20px/1.2 · -0.01em
Head--text-head · Hanken Grotesk 600 17px/1.3
Body, the 17px baseline--text-body · Hanken Grotesk 400 17px/1.45
Meta, provenance and timestamps--text-meta · Hanken Grotesk 500 13px/1.35 · +0.01em
Micro labels--text-micro · Hanken Grotesk 600 11px/1.3 · +0.10em · caps
Agent aside, the reflective register--text-aside · Newsreader italic 500 16px/1.4
Spacing
--sp-1 · 4px
--sp-2 · 8px
--sp-3 · 12px
--sp-4 · 16px
--sp-5 · 20px
--sp-6 · 24px
--sp-8 · 32px
--sp-10 · 40px
Radius
--r-chip · 10px
--r-card · 16px
--r-pane · 22px
--r-sheet · 28px
--r-pill · 999px
Device frame 54px. Message panes square one corner (6px) toward their sender.
Motion · fog drift
--dur-press · 140msPress feedback
--dur-ui · 220msSmall UI state changes
--dur-enter · 480msPanes condensing in
--dur-ceremony · 900msThe reconnection
--ease-driftcubic-bezier(.22, 1, .36, 1)
--ease-outcubic-bezier(.23, 1, .32, 1)
--ease-inoutcubic-bezier(.65, 0, .35, 1) · mist and refraction loops
Only transform and opacity animate. The unprompted arrival condenses out of the fog; patience is light refracting across the waiting card. Reduced motion swaps all of it for short cross-fades.