/* ==========================================================================
   tokens.css — design tokens for the personal site.

   Shared in spirit with docs/skills/slide and visualization —
   Lora display + Newsreader body, Monet/Hokusai palette
   (dusty Prussian blue + crimson + warm cream).

   When updating values here, mirror them in slide.md's :root block so
   site + slides + figures read as one identity.
   ========================================================================== */

:root {
  color-scheme: light;
  /* ---- White with the Reading Group navy palette ------------------- */
  --c-primary:      #1D3A6E;
  --c-primary-soft: #EEF3FB;
  --c-accent:       #0046AD;
  --c-warn:         #8A6D24;
  --c-mint:         #0E6E5A;
  --c-ink:          #0A1422;
  --c-ink-soft:     #20252C;
  --c-ink-mute:     #7A8392;
  --c-paper:        #FFFFFF;
  --c-paper-warm:   #FAF8F3;
  --c-line:         #D8DEE8;

  /* ---- Site aliases --------------------------------------------------- */
  --navy:         #1D3A6E;
  --accent:       #0046AD;
  --accent-hover: #1D3A6E;
  --text:         #20252C;
  --muted:        #7A8392;
  --border:       #D8DEE8;
  --bg:           #FAF8F3;
  --card:         #FFFFFF;

  /* ---- Typography ----------------------------------------------------- */
  --font-display: 'Lora', Georgia, 'Times New Roman', serif;
  --font-body:    'Newsreader', Georgia, 'Iowan Old Style', serif;
  --font-mono:    ui-monospace, 'JetBrains Mono', Consolas, monospace;

  /* ---- Spacing (4px base) --------------------------------------------- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;

  /* ---- Borders, radii, shadows ---------------------------------------- */
  --radius-sm: 6px;
  --radius-md: 10px;
  --shadow-xs: 0 1px 2px rgba(0,0,0,0.08);
  --shadow-sm: 0 2px 4px rgba(0,0,0,0.10);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.10);

  /* ---- Motion --------------------------------------------------------- */
  --ease-expo: cubic-bezier(0.16, 1, 0.3, 1);

  /* ---- Layout --------------------------------------------------------- */
  --section-pad: 3rem 0 2.5rem;
  --max-width:   1120px;
}
