/* Coffee Notebook — design tokens
 * Single source of truth for color, type scale, spacing, and other primitives.
 * Components and base styles read from these custom properties.
 */

:root {
  color-scheme: light;

  /* ── Color ───────────────────────────────────────────── */
  --bg:           #FFF8E7;  /* cosmic latte — the average color of the universe */
  --surface:      #FFFFFF;  /* cards on bg, subtle elevation */
  --ink:          #1A1410;  /* warm near-black body text */
  --ink-muted:    #6E635A;  /* metadata, secondary */
  --ink-faint:    #B5A99E;  /* placeholders, dividers */
  --border:       #E8DFD2;  /* hairline borders, separators */
  --accent:       #A03820;  /* cherry-red, links and active states */
  --accent-soft:  #F5E4DE;  /* active filter chip bg, hover surfaces */

  /* Rating chip pairs (bg / text) */
  --rating-outstanding-bg:   #E2EBD9;
  --rating-outstanding-text: #3D5230;
  --rating-great-bg:         #F5E5CE;
  --rating-great-text:       #7A5828;
  --rating-average-bg:       #EFE9E2;
  --rating-average-text:     #54483D;
  --rating-pass-bg:          #EFD9D5;
  --rating-pass-text:        #6E332C;

  /* ── Typography ──────────────────────────────────────── */
  --font-display: "FlagOverride", "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body:    "FlagOverride", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Modular scale */
  --text-xs:   0.75rem;     /* 12px — tags, metadata */
  --text-sm:   0.875rem;    /* 14px — UI, secondary */
  --text-base: 1.0625rem;   /* 17px — body */
  --text-md:   1.25rem;     /* 20px — subheadings */
  --text-lg:   1.5rem;      /* 24px — card titles */
  --text-xl:   2rem;        /* 32px — page titles */
  --text-2xl:  2.75rem;     /* 44px — hero / display */

  --leading-tight: 1.2;
  --leading-snug:  1.4;
  --leading-body:  1.65;

  /* ── Spacing (8px base) ──────────────────────────────── */
  --space-1:  0.25rem;   /* 4 */
  --space-2:  0.5rem;    /* 8 */
  --space-3:  0.75rem;   /* 12 */
  --space-4:  1rem;      /* 16 */
  --space-6:  1.5rem;    /* 24 */
  --space-8:  2rem;      /* 32 */
  --space-12: 3rem;      /* 48 */
  --space-16: 4rem;      /* 64 */

  /* ── Layout ──────────────────────────────────────────── */
  --page-max:  1100px;
  --prose-max: 65ch;
  --radius:    6px;
  --radius-lg: 12px;

  /* ── Motion ──────────────────────────────────────────── */
  --ease:      cubic-bezier(0.2, 0.8, 0.2, 1);
  --duration:  150ms;
}