/* ============================================================================
   Field-guide design tokens
   A warm, naturalist palette inspired by printed bird guides: sage greens,
   clay/ochre accents, aged-paper creams, and warm ink. One source of truth
   for color, type, space, and elevation — every component reads from here.
   ============================================================================ */

:root {
  /* --- Paper / surfaces (warm cream, like field-guide pages) --- */
  --paper:        #f4efe3;   /* page background */
  --paper-2:      #efe8d8;   /* recessed areas, table header */
  --card:         #fbf8f0;   /* raised card surface */
  --card-2:       #fffdf7;   /* lightest surface, hover */

  /* --- Ink (warm near-black, never pure #000) --- */
  --ink:          #2b2722;
  --ink-soft:     #4f4a40;
  --ink-muted:    #7a7264;
  --ink-faint:    #a59b88;

  /* --- Sage (primary; foliage greens) --- */
  --sage-900:     #2f3b25;
  --sage-700:     #44542f;
  --sage-600:     #556a3a;   /* primary action / links */
  --sage-500:     #6d8350;
  --sage-300:     #9aac7c;
  --sage-100:     #d8e0c6;
  --sage-50:      #ecf0e1;

  /* --- Clay / ochre (accent; warm highlight, rarities, warnings) --- */
  --clay-700:     #9a6b39;
  --clay-600:     #b07c44;
  --clay-500:     #c4955a;   /* accent */
  --clay-300:     #ddb888;
  --clay-100:     #f0dfc4;

  /* --- Borders / rules (warm, soft) --- */
  --line:         #ddd3bf;
  --line-soft:    #e8e0cf;
  --line-strong:  #c8bca2;

  /* --- Seasonal semantic colors (used in charts + badges) --- */
  --spring:       #6d8350;   /* sage green */
  --summer:       #4a8db0;   /* lake blue */
  --fall:         #c4955a;   /* ochre */
  --winter:       #7d8896;   /* slate */
  --resident:     #8a7f6c;   /* warm gray */
  --rare:         #b0563f;   /* terracotta — rarities pop */

  /* --- Functional --- */
  --good:         #5d7d4a;
  --warn:         #c08a3e;
  --bad:          #b0563f;
  --info:         #4a8db0;

  /* --- Typography --- */
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-serif:   "Spectral", Georgia, serif;
  --font-sans:    "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale (1.250 major-third-ish, tuned) */
  --t-xs:    0.78rem;
  --t-sm:    0.875rem;
  --t-base:  1rem;
  --t-md:    1.125rem;
  --t-lg:    1.375rem;
  --t-xl:    1.75rem;
  --t-2xl:   2.25rem;
  --t-3xl:   3rem;
  --t-display: clamp(2.4rem, 5vw, 3.6rem);

  --leading-tight: 1.2;
  --leading-snug:  1.4;
  --leading-normal: 1.6;

  /* --- Spacing scale (4px base) --- */
  --s-1:  0.25rem;
  --s-2:  0.5rem;
  --s-3:  0.75rem;
  --s-4:  1rem;
  --s-5:  1.5rem;
  --s-6:  2rem;
  --s-7:  3rem;
  --s-8:  4rem;

  /* --- Radii (restrained; field guides aren't bubbly) --- */
  --r-sm:  3px;
  --r-md:  5px;
  --r-lg:  8px;
  --r-pill: 999px;

  /* --- Elevation (soft, warm-tinted shadows) --- */
  --shadow-sm:  0 1px 2px rgba(60, 50, 30, 0.06);
  --shadow-md:  0 2px 8px rgba(60, 50, 30, 0.08), 0 1px 2px rgba(60, 50, 30, 0.05);
  --shadow-lg:  0 8px 28px rgba(60, 50, 30, 0.12);

  /* --- Layout --- */
  --container: 1180px;
  --container-narrow: 880px;
}