/* =============================================================
   Julie's Garden — THEME TOKENS
   -------------------------------------------------------------
   This file is the whole "skin." To re-theme the site, edit the
   values below — nothing else needs to change. Every color, font,
   and spacing rule elsewhere reads from these variables.
   ============================================================= */

:root {
  /* ---- Palette: "Fern & Foxglove" ------------------------------
     PNW greenhouse greens with a foxglove-bloom accent.          */
  --color-bg:          #EAEEE6; /* page — pale cool sage "paper"   */
  --color-surface:     #FBFCF9; /* entry card / raised surfaces    */
  --color-sidebar:     #2C4A3B; /* deep fern — the left field      */
  --color-sidebar-ink: #E7EFE7; /* text on the sidebar             */
  --color-sidebar-mut: #9DB4A6; /* muted text on the sidebar       */
  --color-ink:         #1E2A22; /* body text — near-black evergreen*/
  --color-muted:       #566a5d; /* captions, dates, meta           */
  --color-line:        #D3DACE; /* hairlines, dividers             */
  --color-accent:      #C05C86; /* foxglove — accents, active mark */
  --color-accent-ink:  #8E3A5F; /* readable accent for link text   */

  /* ---- Type ---------------------------------------------------- */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body:    'Karla', system-ui, -apple-system, Segoe UI, sans-serif;

  /* Fluid type scale */
  --step--1: clamp(0.83rem, 0.79rem + 0.20vw, 0.94rem);
  --step-0:  clamp(1.00rem, 0.95rem + 0.25vw, 1.15rem);
  --step-1:  clamp(1.25rem, 1.15rem + 0.50vw, 1.55rem);
  --step-2:  clamp(1.60rem, 1.40rem + 1.00vw, 2.20rem);
  --step-3:  clamp(2.10rem, 1.70rem + 2.00vw, 3.40rem);

  /* ---- Layout & rhythm ---------------------------------------- */
  --measure:   66ch;   /* max comfortable reading width            */
  --sidebar-w: 17rem;  /* left panel width on desktop              */
  --radius:    5px;
  --gap:  clamp(1rem, 0.6rem + 1.6vw, 1.75rem);
  --pad:  clamp(1.25rem, 0.6rem + 3vw, 3rem);
  --shadow: 0 1px 2px rgba(30,42,34,.05), 0 8px 28px -18px rgba(30,42,34,.35);
}