/* ============================================================
   Design tokens — pandack.fr
   Source unique de vérité : couleurs, typo, espacements.
   ============================================================ */

:root {
  /* ---------- Couleurs — mode clair ---------- */
  --c-bg:            #F5F1EA;   /* ivoire chaud, pas de blanc pur */
  --c-bg-card:       #FBF8F3;
  --c-bg-elevated:   #FFFDF8;
  --c-text:          #1A1F26;
  --c-text-muted:    #5B6B7A;
  --c-accent:        #1F4E79;
  --c-accent-hover:  #2A6094;
  --c-signal:        #00A87E;
  --c-signal-hover:  #00C492;
  --c-border:        #E5DDD0;
  --c-border-strong: #C9BFAE;
  --c-code-bg:       #EDE6D7;

  /* ---------- Familles ---------- */
  --f-serif: 'Fraunces', 'Cambria', 'Georgia', serif;
  --f-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --f-mono:  'JetBrains Mono', 'Consolas', 'Menlo', monospace;

  /* ---------- Échelle typographique (ratio 1.25) ---------- */
  --t-12:  0.75rem;
  --t-14:  0.875rem;
  --t-16:  1rem;
  --t-18:  1.125rem;
  --t-20:  1.25rem;
  --t-25:  1.5625rem;
  --t-32:  2rem;
  --t-40:  2.5rem;
  --t-48:  3rem;
  --t-64:  4rem;

  /* ---------- Espacements (échelle 4) ---------- */
  --s-1:   0.25rem;   /* 4  */
  --s-2:   0.5rem;    /* 8  */
  --s-3:   0.75rem;   /* 12 */
  --s-4:   1rem;      /* 16 */
  --s-6:   1.5rem;    /* 24 */
  --s-8:   2rem;      /* 32 */
  --s-12:  3rem;      /* 48 */
  --s-16:  4rem;      /* 64 */
  --s-24:  6rem;      /* 96 */
  --s-32:  8rem;      /* 128 */

  /* ---------- Largeurs ---------- */
  --w-prose: 68ch;
  --w-page:  1180px;
  --w-narrow: 860px;

  /* ---------- Rayons ---------- */
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;

  /* ---------- Bordures ---------- */
  --b-1: 1px;
  --b-accent: 3px;

  /* ---------- Transitions ---------- */
  --tr-fast: 120ms ease;
  --tr-mid:  220ms ease;
}

/* ============================================================
   Mode sombre — override des tokens couleur
   ============================================================ */
[data-theme="dark"] {
  --c-bg:            #0F1620;
  --c-bg-card:       #172230;
  --c-bg-elevated:   #1E2C3D;
  --c-text:          #E8E4DC;
  --c-text-muted:    #9AA7B4;
  --c-accent:        #5A8FBF;
  --c-accent-hover:  #7AA8D3;
  --c-signal:        #3DD9A8;
  --c-signal-hover:  #5FE5BC;
  --c-border:        #2A3645;
  --c-border-strong: #3B4A5E;
  --c-code-bg:       #1E2C3D;
}