/* Hallmark · pre-emit critique: P4 H4 E4 S4 R4 V4 */
/* Hallmark · macrostructure: Workbench · tone: soft · anchor hue: blue-250
 * theme: custom (vibe: "white paper, school-blue, night sky")
 * paper: oklch(99.2% 0.004 250) · accent: oklch(51% 0.13 250)
 * fonts: Fraunces + Be Vietnam Pro · axes: light / roman-serif / cool
 * nav: N3 side-rail · footer: Ft1 colophon · enrichment: none
 */

:root {
  --font-display: "Fraunces", "Times New Roman", serif;
  --font-body: "Be Vietnam Pro", "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: 1.75rem;
  --text-display: 4.5rem;

  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;

  --radius-sm: 0.5rem;
  --radius-md: 0.875rem;
  --radius-lg: 1.25rem;
  --radius-pill: 999px;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);
  --dur-fast: 150ms;
  --dur-mid: 220ms;

  --rule-hair: 1px;

  --color-paper: oklch(99.2% 0.004 250);
  --color-paper-2: oklch(97.4% 0.012 250);
  --color-paper-3: oklch(94.5% 0.02 250);
  --color-ink: oklch(22% 0.03 260);
  --color-ink-soft: oklch(45% 0.03 260);
  --color-line: oklch(88% 0.02 250);
  --color-accent: oklch(51% 0.13 250);
  --color-accent-hover: oklch(45% 0.14 250);
  --color-accent-ink: oklch(99% 0.01 250);
  --color-accent-soft: oklch(94% 0.04 250);
  --color-self: oklch(51% 0.13 250);
  --color-peer: oklch(96.5% 0.01 250);
  --color-ai: oklch(96% 0.03 170);
  --color-ai-ink: oklch(28% 0.05 170);
  --color-focus: oklch(51% 0.16 250);
  --color-danger: oklch(48% 0.14 25);
  --color-ok: oklch(48% 0.1 155);
  --shadow-soft: 0 12px 40px oklch(40% 0.04 250 / 0.08);
}

html[data-palette="sunset"] {
  --color-paper: oklch(99% 0.012 55);
  --color-paper-2: oklch(97.2% 0.03 50);
  --color-paper-3: oklch(94% 0.05 48);
  --color-ink: oklch(24% 0.04 40);
  --color-ink-soft: oklch(46% 0.04 40);
  --color-line: oklch(88% 0.04 50);
  --color-accent: oklch(58% 0.16 40);
  --color-accent-hover: oklch(52% 0.17 38);
  --color-accent-ink: oklch(99% 0.01 80);
  --color-accent-soft: oklch(94% 0.05 50);
  --color-self: oklch(58% 0.16 40);
  --color-peer: oklch(97% 0.02 55);
  --color-ai: oklch(96% 0.03 80);
  --color-ai-ink: oklch(30% 0.05 50);
  --color-focus: oklch(58% 0.16 40);
  --shadow-soft: 0 12px 40px oklch(40% 0.06 40 / 0.1);
}

html[data-palette="emerald"] {
  --color-paper: oklch(98.8% 0.01 155);
  --color-paper-2: oklch(96.6% 0.025 155);
  --color-paper-3: oklch(93.5% 0.04 155);
  --color-ink: oklch(22% 0.03 160);
  --color-ink-soft: oklch(44% 0.03 160);
  --color-line: oklch(86% 0.03 155);
  --color-accent: oklch(46% 0.1 155);
  --color-accent-hover: oklch(40% 0.11 155);
  --color-accent-ink: oklch(99% 0.01 155);
  --color-accent-soft: oklch(93% 0.04 155);
  --color-self: oklch(46% 0.1 155);
  --color-peer: oklch(96.5% 0.02 155);
  --color-ai: oklch(95% 0.03 175);
  --color-ai-ink: oklch(28% 0.05 170);
  --color-focus: oklch(46% 0.12 155);
  --shadow-soft: 0 12px 40px oklch(35% 0.05 155 / 0.1);
}

html[data-palette="midnight"] {
  --color-paper: oklch(16% 0.04 280);
  --color-paper-2: oklch(19% 0.045 278);
  --color-paper-3: oklch(23% 0.05 276);
  --color-ink: oklch(96% 0.01 250);
  --color-ink-soft: oklch(78% 0.03 260);
  --color-line: oklch(32% 0.04 278);
  --color-accent: oklch(72% 0.12 250);
  --color-accent-hover: oklch(78% 0.1 250);
  --color-accent-ink: oklch(16% 0.04 280);
  --color-accent-soft: oklch(28% 0.06 260);
  --color-self: oklch(48% 0.12 250);
  --color-peer: oklch(24% 0.04 278);
  --color-ai: oklch(26% 0.05 175);
  --color-ai-ink: oklch(92% 0.03 170);
  --color-focus: oklch(78% 0.12 250);
  --color-danger: oklch(72% 0.12 25);
  --color-ok: oklch(78% 0.1 155);
  --shadow-soft: 0 16px 48px oklch(8% 0.03 280 / 0.45);
}

html[data-theme="dark"] {
  --color-paper: oklch(16% 0.04 280);
  --color-paper-2: oklch(19% 0.045 278);
  --color-paper-3: oklch(23% 0.05 276);
  --color-ink: oklch(96% 0.01 250);
  --color-ink-soft: oklch(78% 0.03 260);
  --color-line: oklch(32% 0.04 278);
  --color-accent: oklch(72% 0.12 250);
  --color-accent-hover: oklch(78% 0.1 250);
  --color-accent-ink: oklch(16% 0.04 280);
  --color-accent-soft: oklch(28% 0.06 260);
  --color-self: oklch(48% 0.12 250);
  --color-peer: oklch(24% 0.04 278);
  --color-ai: oklch(26% 0.05 175);
  --color-ai-ink: oklch(92% 0.03 170);
  --color-focus: oklch(78% 0.12 250);
  --color-danger: oklch(72% 0.12 25);
  --color-ok: oklch(78% 0.1 155);
  --shadow-soft: 0 16px 48px oklch(8% 0.03 280 / 0.45);
}