/*
 * Ink Wash design tokens for Needsmith.
 * Source of truth for color, type, spacing, radius, and shadow values.
 * The same names are used in the Needsmith Ink Wash design system artifact;
 * see DESIGN.md for usage rules. Load this file before styles.css.
 *
 * Each color is declared twice: an sRGB hex fallback, then the OKLCH value
 * that browsers with OKLCH support use instead.
 */

:root {
  /* Color: surfaces */
  --ink-base: #1d1f29;
  --ink-base: oklch(20% 0.02 260);
  --ink-surface: #252731;
  --ink-surface: oklch(24% 0.02 260);
  --ink-surface-2: #2e303a;
  --ink-surface-2: oklch(28% 0.02 260);
  --ink-line: #383a43;
  --ink-line: oklch(32% 0.015 260);

  /* Color: accent */
  --ink-amber: #e4a568;
  --ink-amber: oklch(72% 0.1 60);
  --ink-amber-hover: #f0b978;
  --ink-amber-hover: oklch(78% 0.1 60);
  --ink-amber-pressed: #c97c42;
  --ink-amber-pressed: oklch(62% 0.13 55);

  /* Color: text */
  --ink-cream: #f3ebda;
  --ink-cream: oklch(95% 0.02 90);
  --ink-muted: #a4a6b1;
  --ink-muted: oklch(70% 0.015 260);
  --ink-dim: #6c6e78;
  --ink-dim: oklch(50% 0.012 260);

  /* Color: signal */
  --ink-danger: #f3625d;
  --ink-danger: oklch(68% 0.18 25);

  /* Type */
  --font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Layout */
  --shell: 1200px;
  --gutter: 32px;

  /* Spacing scale */
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-14: 14px;
  --space-18: 18px;
  --space-22: 22px;
  --space-28: 28px;
  --space-32: 32px;
  --space-56: 56px;

  /* Radius */
  --radius-stamp: 2px;
  --radius-control: 12px;
  --radius-card: 14px;
  --radius-card-lg: 18px;
  --radius-pill: 999px;
  --radius-app-icon: 22.37%;

  /* Shadow */
  --shadow-heavy: 0 30px 80px -20px rgba(0, 0, 0, 0.6);
  --shadow-app-icon: 0 1px 2px rgba(0, 0, 0, 0.08), 0 4px 12px -6px rgba(0, 0, 0, 0.25);
}