/* ═══════════════════════════════════════════════════════════════════════
   Fairbook design tokens — Rebrand Round 1: token-only flip to the v2 system.
   Source of truth: docs/design-system.md §2 (do NOT re-derive from mockups).

   Old → v2 mapping (legacy names kept below as aliases so every existing
   selector keeps working; new code must use the v2 names):

     --green   #2d6a4f            → var(--fairway)    value unchanged
     --green2  #40916c            → var(--fairway-2)  value unchanged
     --green3  #74c69d            → --green3          v2 keeps name+value
                                                      (dark-surface accents only)
     --gold    #e9a825            → var(--flag)       value unchanged; RATINGS
                                                      ONLY — no new usages
     --dark    #1b2d23            → var(--ink)        → #14211b
     --muted   #6b7e74            → var(--slate)      → #5b6b63
     --cream   #f8fdf9            → var(--fog)        → #f4f6f5
     --white   #fff               → var(--paper)      value unchanged
     --border  #d3e8da            → var(--line)       → #e4e9e6 (neutral hairline)
     --mint    #d8f3dc            → --mint            name collides; v2 value
                                                      #e8f5ed wins (fainter tint)
     --radius  14px               → var(--r)          → 12px
     --shadow  0 4px 24px         → --shadow          v2 layered neutral shadow
               rgba(45,106,79,.10)                    (was green-tinted)
     --red     #e74c3c            → --red             → #b23a2c per §2

   New in v2 (no legacy counterpart): --amber/--amber-bg (pending status),
   --red-bg, --r-sm, --bar-shadow, --sans/--serif/--mono (font roles;
   DM Mono loaded but not applied anywhere yet — later round).

   ── Responsive breakpoints (rebrand R2) — canonical, mobile-first ──
   All media queries site-wide are written min-width against exactly:
     480px   large phones — minor easing of paddings/grids
     768px   tablet — nav links go inline (burger hides), 2-col layouts
     980px   desktop — full grid density, generous section padding
   Base styles are the 390px mobile layout. No max-width queries.
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  /* ── v2 tokens — verbatim from docs/design-system.md §2 ── */
  --ink:#14211b;        /* primary text; dark fills (footer, scorecard header, active chips, toasts) */
  --slate:#5b6b63;      /* muted text, secondary labels */
  --fairway:#2d6a4f;    /* THE accent: CTAs, key numerals, active states, links. ~10% of surface */
  --fairway-2:#40916c;  /* hover / pressed state of fairway */
  --green3:#74c69d;     /* light green accents ON DARK surfaces only */
  --paper:#ffffff;      /* card surface */
  --fog:#f4f6f5;        /* app/page background, subdued row fills */
  --line:#e4e9e6;       /* hairline borders — the only border colour */
  --mint:#e8f5ed;       /* faint selected/positive tint ONLY */
  --flag:#e9a825;       /* RATING STARS ONLY */

  /* functional status colours (semantic, never decorative) */
  --amber:#a9781a; --amber-bg:#faf1dd;   /* pending / waiting / needs-action */
  --red:#b23a2c;   --red-bg:#fbeae7;     /* decline / destructive */

  --r:12px;             /* default radius (cards, panels) */
  --r-sm:9px;           /* small radius (inputs, slots, day chips, scorecard) */
  --shadow:0 1px 2px rgba(20,33,27,.05), 0 8px 24px rgba(20,33,27,.06);
  --bar-shadow:0 -1px 0 var(--line), 0 -8px 24px rgba(20,33,27,.05);
  --sans:'Nunito',system-ui,sans-serif;
  --serif:'Lora',Georgia,serif;
  --mono:'DM Mono',ui-monospace,monospace;

  /* ── legacy aliases — keep old selectors working; do not use in new code ── */
  --green:var(--fairway);
  --green2:var(--fairway-2);
  --gold:var(--flag);
  --dark:var(--ink);
  --muted:var(--slate);
  --cream:var(--fog);
  --white:var(--paper);
  --border:var(--line);
  --radius:var(--r);
}
