/* Les tokens du design system Whaist, repris tels quels du projet Claude Design
   (`_ds/whaist-design-system-…/tokens/`) : couleurs, typographie, espacements,
   base. Les cinq fichiers d'origine sont réunis ici, et les `@font-face`
   pointent vers `fonts/` au lieu du CDN Fontsource — le reste est inchangé,
   pour qu'un réimport se lise comme un diff.

   IBM Plex Sans et IBM Plex Mono sont sous licence SIL Open Font License 1.1. */

/* — Fontes — */
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/ibm-plex-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/ibm-plex-sans-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/ibm-plex-mono-latin-600-normal.woff2) format('woff2')}

/* — Couleurs — */
:root{
/* — Primary · Bleu (remplace le vert) — */
--blue-50:#F0F6FF;--blue-100:#DCEAFE;--blue-200:#B9D5FD;--blue-300:#8ABAFB;--blue-400:#549AF7;--blue-500:#2A7FF2;--blue-600:#1266E3;--blue-700:#0E52BC;--blue-800:#114494;--blue-900:#123A79;
/* — Complémentaire · Orange — */
--orange-50:#FFF6ED;--orange-100:#FFEAD5;--orange-200:#FED4AA;--orange-300:#FDB274;--orange-400:#FB8B3C;--orange-500:#F76B15;--orange-600:#E25A0A;--orange-700:#BC4A08;--orange-800:#953B0E;--orange-900:#78330F;
/* — Sémantiques — */
--green-50:#EFFDF3;--green-100:#D7FAE0;--green-500:#22C55E;--green-600:#17A34A;--green-700:#15803C;
--amber-50:#FFFBEB;--amber-100:#FEF3C7;--amber-500:#F5A524;--amber-600:#D97706;--amber-700:#B45309;
--red-50:#FEF1F1;--red-100:#FDE2E2;--red-500:#EF4444;--red-600:#DC2626;--red-700:#B91C1C;
/* — Neutres (gris chauds, style iOS) — */
--neutral-0:#FFFFFF;--neutral-25:#FAFAF9;--neutral-50:#F5F5F4;--neutral-100:#EDEDEB;--neutral-200:#E0E0DE;--neutral-300:#C9C9C6;--neutral-400:#A5A5A1;--neutral-500:#7D7D78;--neutral-600:#5C5C57;--neutral-700:#44443F;--neutral-800:#2B2B27;--neutral-900:#1C1C1A;
/* — Alias sémantiques — */
--accent:var(--blue-600);--accent-hover:var(--blue-500);--accent-pressed:var(--blue-700);--accent-tonal:var(--blue-100);--accent-tonal-text:var(--blue-700);--accent-soft:var(--blue-50);
--complement:var(--orange-500);--complement-tonal:var(--orange-100);--complement-tonal-text:var(--orange-700);
--surface-page:#F2F2F0;--surface-card:var(--neutral-0);--surface-sunken:var(--neutral-100);--surface-overlay:rgba(28,28,26,.44);
--text-primary:var(--neutral-900);--text-secondary:var(--neutral-500);--text-tertiary:var(--neutral-400);--text-on-accent:#FFFFFF;--text-link:var(--blue-600);
--border-hairline:rgba(28,28,26,.10);--border-strong:var(--neutral-300);
--success:var(--green-600);--success-bg:var(--green-100);--warning:var(--amber-700);--warning-bg:var(--amber-100);--danger:var(--red-600);--danger-bg:var(--red-100);--info:var(--blue-600);--info-bg:var(--blue-100);
/* — Déclinaison statuts métier (kanban opérations) — */
--status-new-bg:var(--amber-100);--status-new-text:var(--amber-700);--status-new-dot:var(--amber-500);
--status-progress-bg:var(--blue-100);--status-progress-text:var(--blue-700);--status-progress-dot:var(--blue-500);
--status-done-bg:var(--green-100);--status-done-text:var(--green-700);--status-done-dot:var(--green-600);
--status-cancelled-bg:var(--neutral-200);--status-cancelled-text:var(--neutral-600);--status-cancelled-dot:var(--neutral-400);
/* — Surfaces translucides (barres floutées) — */
--surface-blur-strong:rgba(255,255,255,.92);--surface-blur-page:rgba(242,242,240,.85);--surface-blur-weak:rgba(255,255,255,.7);
--switch-knob:#FFFFFF;--focus-ring:0 0 0 3px rgba(18,102,227,.35);/* @kind shadow */
--surface-control:var(--neutral-100);--surface-control-hover:var(--neutral-200);--surface-row-hover:var(--neutral-50);--switch-off:var(--neutral-300);--icon-quiet:var(--neutral-400);
}
/* — Mode sombre — (sélecteur qualifié `html[...]` : spécificité 0,1,1 pour battre les `:root` des autres fichiers de tokens, quel que soit l'ordre d'import) */
html[data-theme="dark"]{
--surface-page:#131312;--surface-card:#1F1F1D;--surface-sunken:#2B2B29;--surface-overlay:rgba(0,0,0,.6);
--surface-blur-strong:rgba(31,31,29,.92);--surface-blur-page:rgba(19,19,18,.85);--surface-blur-weak:rgba(26,26,25,.7);
--switch-knob:#F5F5F4;--focus-ring:0 0 0 3px rgba(138,186,251,.45);/* @kind shadow */
--surface-control:#2E2E2B;--surface-control-hover:#3A3A36;--surface-row-hover:rgba(255,255,255,.06);--switch-off:#4A4A45;--icon-quiet:#6F6F6A;
--shadow-card:0 0 0 1px rgba(255,255,255,.07),0 4px 16px rgba(0,0,0,.45);
--shadow-raised:0 0 0 1px rgba(255,255,255,.09),0 10px 28px rgba(0,0,0,.55);
--shadow-float:0 0 0 1px rgba(255,255,255,.10),0 12px 36px rgba(0,0,0,.65);
--text-primary:#F5F5F4;--text-secondary:#A8A8A3;--text-tertiary:#6F6F6A;--text-link:var(--blue-300);
--border-hairline:rgba(255,255,255,.12);--border-strong:#44443F;
--accent:var(--blue-500);--accent-hover:var(--blue-400);--accent-pressed:var(--blue-600);--accent-tonal:rgba(42,127,242,.24);--accent-tonal-text:var(--blue-200);--accent-soft:rgba(42,127,242,.12);
--complement-tonal:rgba(247,107,21,.22);--complement-tonal-text:var(--orange-300);
--success:var(--green-500);--success-bg:rgba(34,197,94,.22);--warning:var(--amber-500);--warning-bg:rgba(245,165,36,.22);--danger:var(--red-500);--danger-bg:rgba(239,68,68,.22);--info:var(--blue-300);--info-bg:rgba(42,127,242,.24);
--status-new-bg:rgba(245,165,36,.2);--status-new-text:#FBBF4D;
--status-progress-bg:rgba(42,127,242,.24);--status-progress-text:var(--blue-300);
--status-done-bg:rgba(34,197,94,.2);--status-done-text:#4ADE80;
--status-cancelled-bg:rgba(165,165,161,.18);--status-cancelled-text:var(--neutral-400);
}

/* — Typographie — */
:root{
--font-sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;
--font-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
/* Échelle iOS */
--text-large-title:34px;--text-title1:28px;--text-title2:22px;--text-title3:20px;--text-headline:17px;--text-body:17px;--text-callout:16px;--text-subhead:15px;--text-footnote:13px;--text-caption:11px;
--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;
--leading-tight:1.15;--leading-snug:1.3;--leading-normal:1.45;
--tracking-title:-0.02em;--tracking-body:-0.01em;
}

/* — Espacements, rayons, ombres — */
:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;
--radius-xs:8px;--radius-sm:12px;--radius-md:16px;--radius-lg:22px;--radius-xl:28px;--radius-pill:999px;
--shadow-card:0 1px 2px rgba(28,28,26,.04),0 4px 16px rgba(28,28,26,.05);
--shadow-raised:0 2px 6px rgba(28,28,26,.06),0 10px 28px rgba(28,28,26,.08);
--shadow-float:0 8px 32px rgba(28,28,26,.16);
--hairline:1px solid var(--border-hairline);
--control-h-sm:32px;--control-h-md:44px;--control-h-lg:52px;
--tap-min:44px;
--ease-out:cubic-bezier(.2,.8,.3,1);/* @kind other */
--dur-fast:120ms;/* @kind other */
--dur-med:220ms;/* @kind other */
}

/* — Base — */
body{font-family:var(--font-sans);color:var(--text-primary);background:var(--surface-page);-webkit-font-smoothing:antialiased;letter-spacing:var(--tracking-body)}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--accent-pressed);text-decoration:underline}
:focus-visible{outline:none;box-shadow:var(--focus-ring)}