/* CapOrientation — Design tokens (source: docs/design-system.md) */
:root{
  /* Fonds & surfaces */
  --capo-bg:#F4F8FC;
  --capo-bg-2:#E9F1FA;
  --capo-surface:#FFFFFF;
  --capo-surface-2:#F7FAFD;
  --capo-glass:rgba(255,255,255,.72);
  --capo-glass-strong:rgba(255,255,255,.88);
  --capo-glass-border:rgba(255,255,255,.7);

  /* Texte */
  --capo-text:#0B2942;
  --capo-text-secondary:#38536B;
  --capo-text-muted:#5A7286;
  --capo-text-on-primary:#FFFFFF;

  /* Couleurs de marque & sémantiques */
  --capo-primary:#0369A1;
  --capo-primary-hover:#075E8C;
  --capo-primary-50:#EFF6FC;
  --capo-primary-100:#DCEBF7;
  --capo-secondary:#38BDF8;
  --capo-success:#15803D;
  --capo-success-50:#ECFDF3;
  --capo-warning:#B45309;
  --capo-warning-50:#FEF6EC;
  --capo-danger:#B91C1C;
  --capo-danger-50:#FEF2F2;
  --capo-info:#0369A1;
  --capo-info-50:#EFF6FC;

  /* Lignes & focus */
  --capo-border:#DCE6F0;
  --capo-border-strong:#C3D3E3;
  --capo-focus:#2563EB;

  /* Ombres */
  --capo-shadow-sm:0 1px 2px rgba(11,41,66,.06);
  --capo-shadow-md:0 8px 24px rgba(11,41,66,.10);
  --capo-shadow-lg:0 24px 60px rgba(11,41,66,.14);

  /* Rayons */
  --capo-radius-sm:10px;
  --capo-radius-md:16px;
  --capo-radius-lg:22px;
  --capo-radius-xl:28px;
  --capo-radius-pill:9999px;

  /* Espacement (base 4px) */
  --capo-space-1:4px;  --capo-space-2:8px;  --capo-space-3:12px;
  --capo-space-4:16px; --capo-space-5:20px; --capo-space-6:24px;
  --capo-space-7:32px; --capo-space-8:40px; --capo-space-9:48px;
  --capo-space-10:64px;

  /* Typographie */
  --capo-font: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
    "Segoe UI", Inter, Roboto, Helvetica, Arial, sans-serif;
  --capo-fs-display:clamp(2rem, 1.4rem + 2.6vw, 3rem);
  --capo-fs-h1:clamp(1.6rem, 1.3rem + 1.4vw, 2.25rem);
  --capo-fs-h2:clamp(1.3rem, 1.15rem + .8vw, 1.6rem);
  --capo-fs-h3:clamp(1.1rem, 1rem + .4vw, 1.25rem);
  --capo-fs-body:1rem;
  --capo-fs-sm:.875rem;
  --capo-fs-xs:.75rem;

  /* Z-index */
  --capo-z-sticky:10; --capo-z-sidebar:20; --capo-z-dropdown:30;
  --capo-z-overlay:50; --capo-z-toast:60;

  /* Durées (respectées par capo-app.js) */
  --capo-dur-fast:160ms; --capo-dur:280ms; --capo-dur-slow:450ms;
  --capo-ease:cubic-bezier(.22,.61,.36,1);
}

/* Mode sombre — réservé (non prioritaire), activé via [data-capo-theme="dark"] */
:root[data-capo-theme="dark"]{
  --capo-bg:#0A1826; --capo-bg-2:#0E2033;
  --capo-surface:#12263B; --capo-surface-2:#0F2033;
  --capo-glass:rgba(18,38,59,.62); --capo-glass-strong:rgba(18,38,59,.85);
  --capo-glass-border:rgba(255,255,255,.12);
  --capo-text:#EAF2FB; --capo-text-secondary:#B6C8D9; --capo-text-muted:#8DA6BC;
  --capo-primary:#38BDF8; --capo-primary-hover:#7DD3FC; --capo-primary-50:#0E2A3D;
  --capo-border:#22405A; --capo-border-strong:#2C4E6B;
  --capo-shadow-md:0 8px 24px rgba(0,0,0,.4); --capo-shadow-lg:0 24px 60px rgba(0,0,0,.5);
}