/* Ink & Daylight design tokens (docs/14-ui-design-tokens.md). Every hex is twinned in
   crates/vk-client/src/palette.rs; a test keeps the two equal. */
:root {
  --ink-900: #08090a;
  --ink-800: #0f1012;
  --ink-700: #17181b;
  --ink-600: #212226;
  --ink-500: #2c2d32;
  --graphite-400: #4a4b50;
  --graphite-300: #6e6f74;
  --graphite-200: #9a9b9f;
  --paper-100: #d9d9d6;
  --paper-000: #f1f0ec;
  --white: #ffffff;

  --zarya-900: #473519;
  --zarya-700: #6c501f;
  --zarya-600: #8a6830;
  --zarya-500: #ce9d4e;
  --zarya-400: #e2b672;
  --zarya-300: #f1ce98;
  --zarya-100: #f9e5c7;

  --meridian-900: #103e46;
  --meridian-700: #065d6b;
  --meridian-600: #1b7888;
  --meridian-500: #31b5cb;
  --meridian-400: #64cce0;
  --meridian-300: #91dfef;
  --meridian-100: #c5eff7;

  --seal-500: #e04a7a;
  --seal-700: #963052;

  --zone-core: #f1ede4;
  --zone-zarya-hearth: #bca27a;
  --zone-meridian-hearth: #75afba;
  --zone-zarya-marches: #8f7b5c;
  --zone-meridian-marches: #58858e;
  --zone-approaches: #6f716e;
  --zone-hollows: #4a4470;
  --zone-wash: #3a3b3a;

  --space: var(--ink-900);
  --faction-zarya: var(--zarya-500);
  --faction-meridian: var(--meridian-500);
  --own-accent: var(--paper-000);

  --font-display: "Unbounded", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --text-xs: 11px;
  --text-sm: 12px;
  --text-md: 14px;
  --text-body: 16px;
  --text-lg: 20px;
  --text-xl: 25px;
  --text-2xl: 31px;
  --text-3xl: 39px;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  --radius: 2px;
  --radius-badge: 4px;
  --hairline: 1px solid var(--ink-500);
  --hairline-strong: 1px solid var(--graphite-400);

  --motion-fast: 90ms;
  --motion-base: 140ms;
  --motion-slow: 200ms;
  --ease: ease-out;

  --touch-target: 44px;
  --focus-ring: 0 0 0 1px var(--ink-900), 0 0 0 3px var(--paper-000);
}