/* Hallmark · genre: modern-minimal · macrostructure: Narrative Workflow
 * theme: Cobalt · design-system: design.md · designed-as-app
 * enrichment: instrument-panel (Tier A) · nav: Cobalt ⌘K · footer: Ft5
 * pre-emit critique: P4 H4 E4 S4 R4 V4
 * axes: paper=neutral-light / display=grotesk-sans / accent=amber-touch
 */

:root {
  /* Colour — black & white, amber as a rare signal only */
  --color-paper: oklch(99% 0.002 100);
  --color-paper-2: oklch(96.5% 0.002 100);
  --color-rule: oklch(90% 0.002 100);
  --color-rule-2: oklch(82% 0.003 100);
  --color-muted: oklch(50% 0.004 100);
  --color-ink-2: oklch(32% 0.004 100);
  --color-ink: oklch(18% 0.005 100);
  --color-accent: oklch(82% 0.17 90); /* amber — use sparingly */
  --color-accent-ink: oklch(18% 0.005 100);
  --color-focus: oklch(18% 0.005 100);
  --color-graphite: oklch(16% 0.004 100);
  --color-graphite-2: oklch(12% 0.003 100);
  --color-on-graphite: oklch(96% 0.002 100);
  --color-on-graphite-muted: oklch(68% 0.004 100);

  /* Type */
  --font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Space — 4pt scale */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4.5rem;
  --space-3xl: 7rem;
  --page-gutter: clamp(1.25rem, 4vw, 5%);

  /* Type scale */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1.125rem;
  --text-lg: 1.375rem;
  --text-xl: 1.75rem;
  --text-2xl: 2.25rem;
  --text-display: clamp(2.5rem, 5vw + 0.5rem, 4.5rem);

  /* Motion */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-short: 220ms;
  --dur-mid: 600ms;

  /* Radii — Cobalt technical */
  --radius-btn: 6px;
  --radius-card: 10px;
  --radius-pill: 999px;

  --rule-hair: 1px;

  /* Legacy aliases */
  --df-ink: var(--color-ink);
  --df-graphite: var(--color-graphite);
  --df-bg: var(--color-paper);
  --df-amber: var(--color-accent);

  --cw-midnight: var(--color-paper);
  --cw-surface: var(--color-paper-2);
  --cw-cloud: var(--color-ink);
  --cw-ghost: var(--color-ink-2);
  --cw-slate: var(--color-muted);
  --cw-steel: var(--color-muted);
  --cw-accent: var(--color-ink);
  --cw-accent-light: var(--color-ink-2);
  --cw-accent-bright: var(--color-ink);
  --cw-accent-glow: oklch(18% 0.005 100 / 0.12);
  --cw-emerald: var(--color-accent);
  --cw-card: var(--color-paper);
  --cw-card-hover: var(--color-paper-2);
  --cw-card-border: var(--color-rule);
  --cw-card-border-strong: var(--color-rule-2);
  --cw-card-shadow: 0 1px 2px oklch(18% 0.005 100 / 0.05);
  --cw-card-shadow-hover: 0 8px 24px -16px oklch(18% 0.005 100 / 0.16);
  --cw-radius-card: var(--radius-card);
  --cw-radius-btn: var(--radius-btn);
  --cw-ease: var(--ease-out);
  --cw-violet: var(--color-ink);
  --cw-violet-glow: var(--cw-accent-glow);
}
