/* Hallmark · genre: playful · macrostructure: Ecosystem Index (home) + Map split (search)
 * theme: custom · vibe: "neighborly, trustworthy, clean white, map-first"
 * paper white · ink oklch(24% 0.05 265) navy · accent oklch(50% 0.15 145) leaf green
 * display: Bricolage Grotesque · body: Figtree · axes: light / rounded-sans / chromatic-other (green)
 */
:root {
  /* surfaces */
  --color-paper: #ffffff;
  --color-paper-2: oklch(97.4% 0.006 250);
  --color-paper-3: oklch(94.5% 0.009 250);
  --color-surface: #ffffff;
  --color-rule: oklch(91% 0.008 250);
  --color-rule-strong: oklch(84% 0.012 250);

  /* ink (logo navy) */
  --color-ink: oklch(24% 0.05 265);
  --color-ink-2: oklch(34% 0.045 265);
  --color-muted: oklch(46% 0.03 265);
  --color-faint: oklch(60% 0.02 265);

  /* accent (logo leaf green) */
  --color-accent: oklch(50% 0.15 145);
  --color-accent-strong: oklch(42% 0.13 147);
  --color-accent-bright: oklch(62% 0.19 140);
  --color-accent-tint: oklch(94.5% 0.045 140);
  --color-accent-tint-2: oklch(90% 0.07 140);
  --color-on-accent: oklch(99% 0.01 140);

  /* stars only */
  --color-star: oklch(79% 0.16 78);
  --color-star-empty: oklch(90% 0.01 250);

  /* status */
  --color-danger: oklch(52% 0.19 27);
  --color-danger-tint: oklch(95% 0.03 27);
  --color-warn: oklch(62% 0.14 70);
  --color-warn-tint: oklch(95.5% 0.045 85);
  --color-info: oklch(50% 0.12 245);
  --color-info-tint: oklch(95.5% 0.025 245);
  --color-focus: oklch(55% 0.2 145);

  /* map lens x-ray layer */
  --color-night: oklch(26% 0.05 265);
  --color-night-2: oklch(33% 0.055 265);

  /* type */
  --font-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Figtree", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.3125rem;
  --text-xl: 1.625rem;
  --text-2xl: clamp(1.75rem, 1.4rem + 1.5vw, 2.25rem);
  --text-3xl: clamp(2rem, 1.5rem + 2.4vw, 3rem);
  --text-display: clamp(2.5rem, 1.6rem + 4.2vw, 4.5rem);

  /* space (4pt) */
  --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: 4rem;
  --space-3xl: 6rem;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px oklch(24% 0.05 265 / 0.06), 0 1px 1px oklch(24% 0.05 265 / 0.04);
  --shadow-md: 0 8px 24px -12px oklch(24% 0.05 265 / 0.22), 0 2px 6px -2px oklch(24% 0.05 265 / 0.08);
  --shadow-lg: 0 24px 48px -20px oklch(24% 0.05 265 / 0.30), 0 4px 12px -4px oklch(24% 0.05 265 / 0.10);

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 360ms;

  --page-max: 1200px;
  --page-gutter: clamp(1rem, 0.5rem + 2.5vw, 2rem);
}