:root {
  --color-ink: #172033;
  --color-ink-deep: #0b1733;
  --color-petrol: #1d4ed8;
  --color-teal: #3b82f6;
  --color-mint: #bfdbfe;
  --color-mint-soft: #eff6ff;
  /* Compatibility aliases stay until the layered CSS migration is complete. */
  --color-coral: #2563eb;
  --color-apricot: #93c5fd;
  --color-coral-soft: #dbeafe;
  --color-lilac: #c7d2fe;
  --color-lilac-soft: #eef2ff;
  --color-paper: #f7f9fc;
  --color-paper-light: #ffffff;
  --color-white: #ffffff;
  --color-text: #1f2937;
  --color-muted: #5f6b7a;
  --color-danger: #a9443d;
  --color-success: #26735f;
  --color-brand-blue: #2563eb;
  --color-brand-blue-deep: #102a56;
  --color-brand-blue-soft: #edf4ff;
  --font-display: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-interface: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --layout-public: 104rem;
  --layout-workspace: 105rem;
  --layout-process: 115rem;
  --layout-form: 64rem;
  --content-wide: var(--layout-public);
  --content: var(--layout-workspace);
  --readable: 68ch;
  --gutter: clamp(1rem, 3.2vw, 4.5rem);
  --radius-xs: 6px;
  --radius-control: 10px;
  --radius-card: 16px;
  --radius-panel: 24px;
  --border: 1px solid rgba(15, 37, 87, .12);
  --shadow-sm: 0 1px 2px rgba(11, 23, 51, .04), 0 10px 30px rgba(11, 23, 51, .05);
  --shadow-md: 0 20px 60px rgba(11, 23, 51, .1);
  --focus: 0 0 0 3px var(--color-paper-light), 0 0 0 5px var(--color-petrol);
  --control-height: 44px;
  --header-height: 76px;
  --workspace-nav-height: 0px;
  --nav-height: var(--header-height);
  --ease: 160ms cubic-bezier(.2, .75, .25, 1);
  --ink: var(--color-text);
  --muted: var(--color-muted);
  --paper: var(--color-paper);
  --card: rgba(255, 255, 255, .88);
  --solid: var(--color-white);
  --line: rgba(15, 37, 87, .12);
  --accent: var(--color-petrol);
  --accent-dark: var(--color-ink-deep);
  --soft-accent: var(--color-mint-soft);
  --success: var(--color-success);
  --danger: var(--color-danger);
  --shadow: var(--shadow-md);
}

body.dark {
  --ink: #f8fafc;
  --muted: rgba(226, 232, 240, .72);
  --paper: #0b1733;
  --card: rgba(23, 37, 67, .72);
  --solid: #172443;
  --line: rgba(246, 242, 233, .14);
  --accent: #60a5fa;
  --accent-dark: #93c5fd;
  --soft-accent: #172e5c;
  --success: #6ee7b7;
  --danger: #ffaaa0;
  --shadow: 0 20px 58px rgba(0, 0, 0, .24);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .15), 0 10px 28px rgba(0, 0, 0, .1);
}