/* Les jetons du système de design. Un seul endroit où une couleur existe :
   l'écran de connexion et l'application lisent le même fichier.

   Règle absolue : le clair se définit sur « :root » nu. Une couleur définie
   uniquement dans un bloc @media ou [data-theme] n'existe pas dans l'autre
   thème, et le bouton de thème ne gagne alors que dans un sens. */

:root{
  --bg:#F2F2F5; --card:#FFFFFF; --card-2:#FAFAFC; --sunk:#EDEDF1;
  --ink:#1C1C1E; --ink-2:#3A3A3E; --muted:#6E6E76; --faint:#A1A1AA;
  --line:#E6E6EB; --line-soft:#EFEFF3;
  --ok:#12A150;     --ok-bg:#E9F7EF;
  --warn:#C2410C;   --warn-bg:#FDF0E9;
  --rouge:#D8362A;  --rouge-bg:#FCECEA;
  --orange:#E07B2C; --orange-bg:#FDF2E7;
  --ardoise:#4B6479;--ardoise-bg:#EEF2F6;
  --neutre:#7C5CFF; --neutre-bg:#F1EEFF;
  --accent:#2F6BFF; --accent-bg:#EAF0FF;
  --nv1:#DC3A2E; --nv2:#E8813A; --nv3:#D9A62E; --nv4:#5AA84F; --nv5:#12A150;
  --sh-1:0 1px 2px rgba(16,18,27,.04), 0 2px 6px rgba(16,18,27,.04);
  --sh-2:0 2px 4px rgba(16,18,27,.05), 0 8px 20px rgba(16,18,27,.06);
  --sh-3:0 8px 16px rgba(16,18,27,.08), 0 24px 56px rgba(16,18,27,.12);
  --r-lg:20px; --r-md:16px; --r-sm:11px;
}
@media(prefers-color-scheme:dark){:root{
  --bg:#0C0D10; --card:#16181D; --card-2:#1B1E24; --sunk:#101216;
  --ink:#F2F2F4; --ink-2:#D6D6DC; --muted:#9A9AA4; --faint:#6C6C76;
  --line:#25282F; --line-soft:#1E2127;
  --ok:#34D399;     --ok-bg:#10281F;
  --warn:#FB923C;   --warn-bg:#2A1A11;
  --rouge:#F2685C;  --rouge-bg:#2A1614;
  --orange:#F0A057; --orange-bg:#2A1E12;
  --ardoise:#93AAC0;--ardoise-bg:#161D24;
  --neutre:#A78BFA; --neutre-bg:#211B36;
  --accent:#6E96FF; --accent-bg:#151C2E;
  --nv1:#F2685C; --nv2:#F59B4E; --nv3:#E3BE55; --nv4:#6FC66A; --nv5:#34D399;
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 2px 6px rgba(0,0,0,.45), 0 10px 24px rgba(0,0,0,.35);
  --sh-3:0 10px 24px rgba(0,0,0,.5), 0 30px 60px rgba(0,0,0,.5);
}}
:root[data-theme=light]{
  --bg:#F2F2F5; --card:#FFFFFF; --card-2:#FAFAFC; --sunk:#EDEDF1;
  --ink:#1C1C1E; --ink-2:#3A3A3E; --muted:#6E6E76; --faint:#A1A1AA;
  --line:#E6E6EB; --line-soft:#EFEFF3;
  --ok:#12A150;     --ok-bg:#E9F7EF;
  --warn:#C2410C;   --warn-bg:#FDF0E9;
  --rouge:#D8362A;  --rouge-bg:#FCECEA;
  --orange:#E07B2C; --orange-bg:#FDF2E7;
  --ardoise:#4B6479;--ardoise-bg:#EEF2F6;
  --neutre:#7C5CFF; --neutre-bg:#F1EEFF;
  --accent:#2F6BFF; --accent-bg:#EAF0FF;
  --nv1:#DC3A2E; --nv2:#E8813A; --nv3:#D9A62E; --nv4:#5AA84F; --nv5:#12A150;
  --sh-1:0 1px 2px rgba(16,18,27,.04), 0 2px 6px rgba(16,18,27,.04);
  --sh-2:0 2px 4px rgba(16,18,27,.05), 0 8px 20px rgba(16,18,27,.06);
  --sh-3:0 8px 16px rgba(16,18,27,.08), 0 24px 56px rgba(16,18,27,.12);
}
:root[data-theme=dark]{
  --bg:#0C0D10; --card:#16181D; --card-2:#1B1E24; --sunk:#101216;
  --ink:#F2F2F4; --ink-2:#D6D6DC; --muted:#9A9AA4; --faint:#6C6C76;
  --line:#25282F; --line-soft:#1E2127;
  --ok:#34D399;     --ok-bg:#10281F;
  --warn:#FB923C;   --warn-bg:#2A1A11;
  --rouge:#F2685C;  --rouge-bg:#2A1614;
  --orange:#F0A057; --orange-bg:#2A1E12;
  --ardoise:#93AAC0;--ardoise-bg:#161D24;
  --neutre:#A78BFA; --neutre-bg:#211B36;
  --accent:#6E96FF; --accent-bg:#151C2E;
  --nv1:#F2685C; --nv2:#F59B4E; --nv3:#E3BE55; --nv4:#6FC66A; --nv5:#34D399;
  --sh-1:0 1px 2px rgba(0,0,0,.4);
  --sh-2:0 2px 6px rgba(0,0,0,.45), 0 10px 24px rgba(0,0,0,.35);
  --sh-3:0 10px 24px rgba(0,0,0,.5), 0 30px 60px rgba(0,0,0,.5);
}

*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{background:var(--bg)}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,Roboto,sans-serif;
  font-size:15px;line-height:1.5;letter-spacing:-.01em;
  -webkit-font-smoothing:antialiased;
  background:var(--bg);color:var(--ink);
}
.card{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.tabulaire{font-variant-numeric:tabular-nums}
