/* Hallmark · design-system: design.md · genre: modern-minimal · macrostructure: Workbench
 * contrast: pass (40–41) · honest: pass (46) · chrome: pass (47)
 * tokens: pass (48) · mobile: target (34, 49, 50–57)
 */
:root {
  --color-paper: oklch(97.5% 0.012 86);
  --color-paper-2: oklch(100% 0 0);
  --color-paper-3: oklch(94.8% 0.014 86);
  --color-ink: oklch(22% 0.018 155);
  --color-ink-2: oklch(45% 0.018 100);
  --color-rule: oklch(87% 0.018 88);
  --color-accent: oklch(48% 0.105 164);
  --color-accent-hover: oklch(40% 0.09 164);
  --color-accent-soft: oklch(93% 0.035 164);
  --color-accent-ink: oklch(99% 0 0);
  --color-focus: oklch(56% 0.14 164);
  --color-danger: oklch(49% 0.17 27);
  --color-danger-soft: oklch(94% 0.035 27);
  --color-warning: oklch(48% 0.1 77);
  --color-warning-soft: oklch(95% 0.055 88);
  --color-success: oklch(43% 0.1 155);
  --color-success-soft: oklch(94% 0.04 155);
  --color-info: oklch(46% 0.11 255);
  --color-info-soft: oklch(94% 0.035 255);
  --color-shadow: oklch(20% 0.02 120 / 8%);

  --font-display: "Avenir Next", Avenir, "Segoe UI", sans-serif;
  --font-body: "Avenir Next", Avenir, "Segoe UI", sans-serif;
  --font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --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;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-md: 1rem;
  --text-lg: 1.25rem;
  --text-xl: clamp(1.55rem, 2.5vw, 2rem);
  --text-2xl: clamp(2rem, 4vw, 3.25rem);

  --radius-control: 0.625rem;
  --radius-card: 0.75rem;
  --radius-pill: 999px;
  --control-height: 2.75rem;
  --sidebar-width: 16.5rem;
  --topbar-height: 4.25rem;
  --mobile-nav-height: 4.5rem;

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-short: 160ms;
  --z-sticky: 20;
  --z-navigation: 40;
}

.surface-admin {
  --color-paper: oklch(18% 0.025 252);
  --color-paper-2: oklch(23% 0.028 252);
  --color-paper-3: oklch(27% 0.03 252);
  --color-ink: oklch(96% 0.008 250);
  --color-ink-2: oklch(73% 0.025 250);
  --color-rule: oklch(34% 0.035 252);
  --color-accent: oklch(73% 0.12 250);
  --color-accent-hover: oklch(82% 0.08 250);
  --color-accent-soft: oklch(30% 0.06 250);
  --color-accent-ink: oklch(18% 0.025 252);
  --color-focus: oklch(78% 0.12 250);
  --color-danger: oklch(75% 0.13 25);
  --color-danger-soft: oklch(30% 0.07 25);
  --color-warning: oklch(82% 0.11 85);
  --color-warning-soft: oklch(30% 0.055 80);
  --color-success: oklch(76% 0.11 155);
  --color-success-soft: oklch(29% 0.055 155);
  --color-info: oklch(76% 0.1 250);
  --color-info-soft: oklch(30% 0.055 250);
  --color-shadow: oklch(4% 0.02 250 / 28%);
}