/* ══════════════════════════════════════════════════════
   DESIGN TOKENS — Variables et constantes de design
══════════════════════════════════════════════════════ */
:root {
  --white:        #ffffff;
  --bg:           #f3f4f7;
  --bg-card:      #ffffff;
  --bg-subtle:    #f7f8fa;
  --bg-hover:     #f0f1f4;
  --primary:      #FFCC00;
  --primary-dark: #e8b800;
  --primary-soft: rgba(255,204,0,.13);
  --primary-ring: rgba(255,204,0,.32);
  --ink:          #0e1118;
  --ink-2:        #3d4150;
  --ink-3:        #7c8292;
  --ink-4:        #b4b9c5;
  --border:       #e8eaef;
  --border-dark:  #d4d7df;
  --green:        #16a34a;
  --green-soft:   #dcfce7;
  --red:          #dc2626;
  --red-soft:     #fee2e2;
  --orange:       #ea580c;
  --blue:         #2563eb;

  --shadow-xs:    0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --shadow-s:     0 2px 8px rgba(0,0,0,.07), 0 1px 3px rgba(0,0,0,.05);
  --shadow-m:     0 4px 16px rgba(0,0,0,.09), 0 2px 6px rgba(0,0,0,.06);
  --shadow-l:     0 8px 32px rgba(0,0,0,.11), 0 4px 12px rgba(0,0,0,.07);

  --r-s:   8px;
  --r-m:   14px;
  --r-l:   20px;
  --r-xl:  28px;
  --r-full: 9999px;

  --ease:         cubic-bezier(0.25, 0.8, 0.25, 1);
  --ease-spring:  cubic-bezier(0.16, 1, 0.3, 1);

  --panel-w:      400px;
  --font:         'Plus Jakarta Sans', -apple-system, sans-serif;
  --mono:         'DM Mono', monospace;
}