/**
 * tokens.css — BUDSY design tokens (single source of truth)
 * ───────────────────────────────────────────────────────────
 * Phase 1 of the design-system effort. Every page links this file instead of
 * declaring its own copy of the brand palette. Before this file existed, each
 * page's :root was a hand-copied snapshot — colors drifted (2026-09 rebrand
 * required ~150 edits across 28 files to fix what should have been a one-line
 * change), variable names diverged (--mid vs --gray, --bg vs --light,
 * --yellow2 vs --yellow-dark), and border definitions split between rgba and
 * plain hex. This file is the fix; tests/guards/design-system.spec.js guards
 * that no page redeclares these and skips this link.
 *
 * Scope, deliberately: colors + borders only. --radius* / --shadow* and the
 * semantic tag colors (--green/--red/--blue/--purple/--teal/--orange) stay
 * page-local for now — they carry real per-component sizing/hue decisions
 * that were never shown to be drifting, unlike the brand palette. Folding
 * them in is Phase 3 (component library), not this file.
 *
 * Usage — link on every page, in <head>, after the Google Fonts <link> and
 * BEFORE the page's own <style> block (so a page's own rules can still win
 * on specificity if a narrow, deliberate override is ever needed):
 *   <link rel="stylesheet" href="tokens.css">
 */

:root {
  /* The board palette has exactly four neutrals + white: Grafit #2D2C28,
     Szary #6B6862, Jasnoszary #F4F3F1, Linia #E6E4E0. The numbered names
     below are legacy tiers that used to carry in-between shades; they are
     kept as aliases onto those four so no page can render an off-palette
     grey. Do not give them their own values again — pick one of the four. */

  /* Grafit — dark surfaces, headings, primary text */
  --dark:  #2D2C28;
  --dark2: #2D2C28;
  --dark3: #2D2C28;
  --dark4: #2D2C28;

  /* Szary — secondary text */
  --gray:  #6B6862;
  --gray2: #6B6862;
  --gray3: #E6E4E0;   /* was a border/divider tier → Linia */

  /* Jasnoszary — every other section's background, input fills */
  --light:  #F4F3F1;
  /* Linia — borders, separators */
  --light2: #E6E4E0;
  --light3: #E6E4E0;

  --white: #ffffff;

  /* Brand accent — orange (was yellow pre-rebrand; names kept to avoid a
     second migration through every var(--yellow) usage site) */
  --yellow:      #EE7A1E;
  --yellow-dark: #A84F10;
  --yellow-pale: #FDEEE1;
  --yellow-mid:  #FAD7BC;

  /* Borders */
  --border:       rgba(45,44,40,0.09);
  --border-dark:  rgba(255,255,255,0.08);
  --border-light: rgba(45,44,40,0.09);

  /* Aliases — three pages (budsy-forum.html, budsy-gallery.html,
     budsy-project.html) named the same concepts differently before this
     file existed. Kept as aliases rather than forcing a rename through
     every usage site in those files; new pages should use the canonical
     names above, not these. */
  --mid:     var(--gray);
  --bg:      var(--light);
  --yellow2: var(--yellow-dark);
}