/* Design tokens for the Turmite Explorer.
   Aesthetic: artificial-life field notebook / specimen plate.
   Paper is the canvas, ink is the data, vermilion is only ever the live ant
   and the one primary action. No #000 / #fff anywhere. */

@font-face {
  font-family: "Fraunces";
  src: url("/fonts/fraunces-latin.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  font-optical-sizing: auto;
}

@font-face {
  font-family: "Spline Sans Mono";
  src: url("/fonts/splinesansmono-latin.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}

:root {
  /* --- Paper surface (warm ivory, tinted neutrals) --- */
  --paper-0:   oklch(0.985 0.008 85);
  --paper-1:   oklch(0.965 0.011 83);
  --paper-2:   oklch(0.940 0.013 82);
  --paper-3:   oklch(0.910 0.014 80);
  --paper-edge: oklch(0.870 0.016 78);

  /* --- Ink neutrals (warm graphite, never #000) --- */
  --ink-3: oklch(0.560 0.012 75);
  --ink-2: oklch(0.430 0.014 72);
  --ink-1: oklch(0.320 0.016 70);
  --ink-0: oklch(0.235 0.018 68);

  /* --- Accent: oxidized vermilion (the ant, single accent) --- */
  --vermilion:       oklch(0.585 0.205 32);
  --vermilion-press: oklch(0.520 0.195 31);
  --vermilion-text:  oklch(0.505 0.190 31);  /* darkened for text/border contrast */
  --vermilion-tint:  oklch(0.930 0.045 38);
  --vermilion-trail: oklch(0.585 0.205 32 / 0.14);

  /* --- Functional --- */
  --signal-emerge: oklch(0.560 0.118 150);
  --signal-warn:   oklch(0.560 0.150 55);
  --focus-ring:    oklch(0.585 0.205 32 / 0.55);

  /* --- Binary cell states (the classic Langton rule) --- */
  --cell-off: oklch(0.975 0.008 85);
  --cell-on:  oklch(0.300 0.016 70);

  /* --- Multi-state ramp (for R/L/U rule strings of length 3-6) --- */
  --state-1: oklch(0.300 0.016 70);
  --state-2: oklch(0.560 0.130 250);
  --state-3: oklch(0.600 0.120 150);
  --state-4: oklch(0.660 0.140 75);
  --state-5: oklch(0.520 0.140 300);
  --state-6: oklch(0.600 0.110 200);

  /* --- Type families --- */
  --font-display: "Fraunces", "Hoefler Text", Georgia, serif;
  --font-mono: "Spline Sans Mono", "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* --- Type scale (ratio 1.25, base 16px) --- */
  --text-xs:  0.64rem;
  --text-sm:  0.8rem;
  --text-base: 1rem;
  --text-md:  1.25rem;
  --text-lg:  1.563rem;
  --text-xl:  1.953rem;
  --text-2xl: 2.441rem;
  --text-3xl: 3.052rem;

  --leading-tight: 1.1;
  --leading-snug:  1.3;
  --leading-body:  1.55;

  /* --- Spacing --- */
  --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 / elevation --- */
  --radius-sm: 3px;
  --radius-md: 5px;
  --radius-lg: 8px;

  --rule-hairline: 1px solid var(--paper-edge);
  --shadow-plate: 0 1px 2px oklch(0.235 0.018 68 / 0.06),
                  0 8px 24px oklch(0.235 0.018 68 / 0.05);

  /* --- Motion --- */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 140ms;
  --dur-base: 240ms;
  --dur-slow: 420ms;
}