/* ═══════════════════════════════════════════════════════════════════════
   Open Projects Lab — tokens de conception
   ⚠️ FICHIER GÉNÉRÉ. Ne pas modifier à la main : la prochaine compilation
   écraserait la modification. La source est design/tokens.mjs.
       node design/build.mjs
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  /* Primitives — ne PAS utiliser directement dans un composant */
  --navy-950: #0A0D13;
  --navy-900: #10141C;
  --navy-850: #171D27;
  --navy-800: #0E1219;
  --navy-700: #232A36;
  --navy-600: #637294;
  --ardoise-100: #eef2f8;
  --ardoise-300: #a7b6cf;
  --ardoise-400: #8798b5;
  --cyan-400: #5fd8f5;
  --cyan-500: #38bddc;
  --cyan-600: #2cc9e6;
  --cyan-100: #96ebfa;
  --bleu-400: #63b3ed;
  --vert-950: #06231e;
  --vert-400: #37c68f;
  --rouge-400: #ed657c;
  --ambre-400: #e8b45f;
  --blanc: #ffffff;
  --noir: #000000;
  --clair-000: #ffffff;
  --clair-050: #f5f8fc;
  --clair-100: #edf1f8;
  --clair-200: #dce3ef;
  --clair-300: #808899;
  --encre-600: #3c4a68;
  --encre-400: #54648a;
  --vert-700: #217756;
  --rouge-700: #ac495a;
  --ambre-700: #826535;

  /* Dérivées du thème — calculées, jamais écrites à la main */
  --succes-texte: #bee7dd;
  --succes-fond: #152d2c;
  --succes-trait: #205f4c;
  --erreur-texte: #eecdd8;
  --erreur-fond: #2f1f29;
  --erreur-trait: #6d3644;
  --alerte-texte: #ece2d0;
  --alerte-fond: #2e2a25;
  --alerte-trait: #6b5738;
  --info-texte: #bfe4f1;
  --info-fond: #162c37;
  --info-trait: #215b6d;

  /* Sémantique — c'est CE niveau que les composants utilisent */
  --bg-haut: #0A0D13;
  --bg-bas: #0E1219;
  --surface: #10141C;
  --surface-haute: #171D27;
  --ligne: #232A36;
  --ligne-forte: #637294;
  --texte: #eef2f8;
  --texte-doux: #a7b6cf;
  --texte-discret: #8798b5;
  --succes: #37c68f;
  --erreur: #ed657c;
  --alerte: #e8b45f;
  --soutien: #e8b45f;
  --accent: #30d2eb;
  --accent-vif: #59e2fd;
  --accent-texte: #59e2fd;
  --accent-2: #6c8cf5;
  --liquide: #2cc9e6;
  --sur-accent: #04222e;
  --succes-texte: #bee7dd;
  --succes-fond: #152d2c;
  --succes-trait: #205f4c;
  --erreur-texte: #eecdd8;
  --erreur-fond: #2f1f29;
  --erreur-trait: #6d3644;
  --alerte-texte: #ece2d0;
  --alerte-fond: #2e2a25;
  --alerte-trait: #6b5738;
  --info-texte: #bfe4f1;
  --info-fond: #162c37;
  --info-trait: #215b6d;

  /* Surfaces translucides et profondeur — dérivées du thème */
  --voile-entete: rgba(10,13,19,0.82);
  --voile-tiroir: rgba(10,13,19,0.98);
  --voile-modale: rgba(10,13,19,0.72);
  --fond-fantome: rgba(238,242,248,0.03);
  --surface-bande: rgba(16,20,28,0.4);
  --separation-surface: inset 0 1px 0 rgba(255,255,255,0.06);
  --ombre-sm: 0 1px 2px rgba(0,0,0,0.3);
  --ombre: 0 4px 16px rgba(0,0,0,0.32);
  --ombre-lg: 0 16px 40px rgba(0,0,0,0.42);
  --ombre-logo: 0 14px 34px rgba(0,0,0,0.40);

  /* Aplats teintés par l'accent */
  --accent-fond: rgba(48,210,235,0.1);
  --accent-fond-fort: rgba(48,210,235,0.16);
  --accent-trait: rgba(48,210,235,0.35);
  --accent-trait-fort: rgba(48,210,235,0.45);
  --accent-halo: rgba(48,210,235,0.1);
  --accent-2-halo: rgba(108,140,245,0.08);
  --lueur-logo: rgba(44,201,230,0.55);

  /* Typographie */
  --txt-xs: calc(clamp(0.75rem, 0.72rem + 0.15vw, 0.8rem) * var(--echelle-txt, 1));
  --txt-sm: calc(clamp(0.85rem, 0.82rem + 0.18vw, 0.92rem) * var(--echelle-txt, 1));
  --txt-base: calc(clamp(1rem, 0.96rem + 0.2vw, 1.06rem) * var(--echelle-txt, 1));
  --txt-md: calc(clamp(1.1rem, 1.04rem + 0.3vw, 1.2rem) * var(--echelle-txt, 1));
  --txt-lg: calc(clamp(1.25rem, 1.15rem + 0.5vw, 1.45rem) * var(--echelle-txt, 1));
  --txt-xl: calc(clamp(1.5rem, 1.3rem + 1vw, 1.9rem) * var(--echelle-txt, 1));
  --txt-2xl: calc(clamp(1.9rem, 1.5rem + 2vw, 2.6rem) * var(--echelle-txt, 1));
  --txt-3xl: calc(clamp(2.4rem, 1.8rem + 3vw, 3.6rem) * var(--echelle-txt, 1));
  --gras-normal: 400;
  --gras-moyen: 600;
  --gras-fort: 800;
  --interligne-serre: 1.25;
  --interligne: 1.6;
  --interligne-large: 1.75;
  --police: "Segoe UI", system-ui, -apple-system, Roboto, Helvetica, Arial, sans-serif;
  --police-mono: ui-monospace, "Cascadia Code", "Segoe UI Mono", Consolas, monospace;

  /* Espacement */
  --esp-0: 0;
  --esp-1: calc(4px * var(--densite, 1));
  --esp-2: calc(8px * var(--densite, 1));
  --esp-3: calc(12px * var(--densite, 1));
  --esp-4: calc(16px * var(--densite, 1));
  --esp-5: calc(22px * var(--densite, 1));
  --esp-6: calc(30px * var(--densite, 1));
  --esp-7: calc(40px * var(--densite, 1));
  --esp-8: calc(56px * var(--densite, 1));
  --esp-9: calc(76px * var(--densite, 1));
  --esp-10: calc(104px * var(--densite, 1));

  /* Formes et profondeur visuelle */
  --rayon-sm: 8px;
  --rayon: 12px;
  --rayon-lg: 16px;
  --rayon-xl: 22px;
  --rayon-rond: 999px;

  /* Plans (z-index) */
  --z-base: 0;
  --z-flottant: 10;
  --z-entete: 40;
  --z-tiroir: 50;
  --z-modale: 100;
  --z-notification: 200;

  /* Mouvement */
  --duree-courte: 120ms;
  --duree: 200ms;
  --duree-longue: 320ms;
  --courbe: cubic-bezier(0.2, 0, 0.2, 1);
  --courbe-sortie: cubic-bezier(0.4, 0, 1, 1);

  /* Composants */
  --largeur-max: 1140px;
  --largeur-app: 100%;
  --largeur-contenu: 960px;
  --largeur-lecture: 66ch;
  --hauteur-entete: 60px;
  --hauteur-barre-vue: 46px;
  --largeur-nav: 210px;
  --largeur-nav-etroite: 190px;
  --largeur-chat: 344px;
  --largeur-panneau: 380px;
  --cible-tactile: 44px;
  --focus-epaisseur: 2px;
  --focus-decalage: 2px;
}

[data-accent="bleu"] {
  --accent: #5aa4ec;
  --accent-2: #5fd8c5;
  --liquide: #4a95e0;
  --sur-accent: #06231e;
  --accent-vif: #8cc4f5;
  --accent-texte: #8cc4f5;
  --accent-fond: rgba(90,164,236,0.1);
  --accent-fond-fort: rgba(90,164,236,0.16);
  --accent-trait: rgba(90,164,236,0.35);
  --accent-trait-fort: rgba(90,164,236,0.45);
  --accent-halo: rgba(90,164,236,0.1);
  --accent-2-halo: rgba(95,216,197,0.08);
  --lueur-logo: rgba(74,149,224,0.55);
}

[data-accent="violet"] {
  --accent: #6d4ae8;
  --accent-2: #f0a8d0;
  --liquide: #7c5cf0;
  --sur-accent: #ffffff;
  --accent-vif: #a78bfa;
  --accent-texte: #a78bfa;
  --accent-fond: rgba(109,74,232,0.1);
  --accent-fond-fort: rgba(109,74,232,0.16);
  --accent-trait: rgba(109,74,232,0.35);
  --accent-trait-fort: rgba(109,74,232,0.45);
  --accent-halo: rgba(109,74,232,0.1);
  --accent-2-halo: rgba(240,168,208,0.08);
  --lueur-logo: rgba(124,92,240,0.55);
}

[data-accent="rose"] {
  --accent: #c9206c;
  --accent-2: #f0b8a0;
  --liquide: #db2777;
  --sur-accent: #ffffff;
  --accent-vif: #f472b6;
  --accent-texte: #f472b6;
  --accent-fond: rgba(201,32,108,0.1);
  --accent-fond-fort: rgba(201,32,108,0.16);
  --accent-trait: rgba(201,32,108,0.35);
  --accent-trait-fort: rgba(201,32,108,0.45);
  --accent-halo: rgba(201,32,108,0.1);
  --accent-2-halo: rgba(240,184,160,0.08);
  --lueur-logo: rgba(219,39,119,0.55);
}

[data-accent="ambre"] {
  --accent: #d69e2e;
  --accent-2: #e8637a;
  --liquide: #e0ac47;
  --sur-accent: #06231e;
  --accent-vif: #f0c674;
  --accent-texte: #f0c674;
  --accent-fond: rgba(214,158,46,0.1);
  --accent-fond-fort: rgba(214,158,46,0.16);
  --accent-trait: rgba(214,158,46,0.35);
  --accent-trait-fort: rgba(214,158,46,0.45);
  --accent-halo: rgba(214,158,46,0.1);
  --accent-2-halo: rgba(232,99,122,0.08);
  --lueur-logo: rgba(224,172,71,0.55);
}

[data-accent="vert"] {
  --accent: #2f9e68;
  --accent-2: #5fd8f5;
  --liquide: #37c68f;
  --sur-accent: #06231e;
  --accent-vif: #5fd8a0;
  --accent-texte: #5fd8a0;
  --accent-fond: rgba(47,158,104,0.1);
  --accent-fond-fort: rgba(47,158,104,0.16);
  --accent-trait: rgba(47,158,104,0.35);
  --accent-trait-fort: rgba(47,158,104,0.45);
  --accent-halo: rgba(47,158,104,0.1);
  --accent-2-halo: rgba(95,216,245,0.08);
  --lueur-logo: rgba(55,198,143,0.55);
}

/* Thème clair — chaque valeur a été cherchée puis MESURÉE, pas dérivée du sombre */
[data-theme="clair"] {
  --bg-haut: #ffffff;
  --bg-bas: #edf1f8;
  --surface: #ffffff;
  --surface-haute: #f5f8fc;
  --ligne: #dce3ef;
  --ligne-forte: #808899;
  --texte: #10141C;
  --texte-doux: #3c4a68;
  --texte-discret: #54648a;
  --succes: #217756;
  --erreur: #ac495a;
  --alerte: #826535;
  --soutien: #826535;
  --succes-texte: #1f4c50;
  --succes-fond: #daf0ec;
  --succes-trait: #a5e2ce;
  --erreur-texte: #4e334b;
  --erreur-fond: #f3e3e9;
  --erreur-trait: #f1bac6;
  --alerte-texte: #4d4744;
  --alerte-fond: #f2eee5;
  --alerte-trait: #efdbb9;
  --info-texte: #1f4a64;
  --info-fond: #daeff7;
  --info-trait: #a5dfee;
  --accent-vif: #1e759c;
  --accent-texte: #1e759c;
  --voile-entete: rgba(255,255,255,0.82);
  --voile-tiroir: rgba(255,255,255,0.98);
  --voile-modale: rgba(255,255,255,0.55);
  --fond-fantome: rgba(22,33,58,0.04);
  --surface-bande: rgba(255,255,255,0.4);
  --separation-surface: 0 1px 2px rgba(16,22,36,0.06);
  --ombre-sm: 0 1px 2px rgba(16,22,36,0.08);
  --ombre: 0 4px 16px rgba(16,22,36,0.10);
  --ombre-lg: 0 16px 40px rgba(16,22,36,0.16);
  --ombre-logo: 0 14px 34px rgba(16,22,36,0.18);
}

[data-theme="clair"][data-accent="bleu"] {
  --accent-vif: #2b6cb0;
  --accent-texte: #2b6cb0;
}

[data-theme="clair"][data-accent="violet"] {
  --accent-vif: #6035d6;
  --accent-texte: #6035d6;
}

[data-theme="clair"][data-accent="rose"] {
  --accent-vif: #be185d;
  --accent-texte: #be185d;
}

[data-theme="clair"][data-accent="ambre"] {
  --accent-vif: #975a16;
  --accent-texte: #975a16;
}

[data-theme="clair"][data-accent="vert"] {
  --accent-vif: #0b784b;
  --accent-texte: #0b784b;
}

/* Thème « auto » : aucun attribut posé, on suit le système d'exploitation.
   `:root:not([data-theme])` et non `:root` seul : un choix EXPLICITE de
   thème sombre doit rester sombre même si le système est en clair.

   Les blocs par accent qui suivent ne sont PAS redondants avec ceux du
   thème clair explicite : sans eux, l'encre du bloc ci-dessus l'emporte sur
   l'accent choisi. C'est `design/cascade.mjs` qui le vérifie désormais. */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    --bg-haut: #ffffff;
    --bg-bas: #edf1f8;
    --surface: #ffffff;
    --surface-haute: #f5f8fc;
    --ligne: #dce3ef;
    --ligne-forte: #808899;
    --texte: #10141C;
    --texte-doux: #3c4a68;
    --texte-discret: #54648a;
    --succes: #217756;
    --erreur: #ac495a;
    --alerte: #826535;
    --soutien: #826535;
    --succes-texte: #1f4c50;
    --succes-fond: #daf0ec;
    --succes-trait: #a5e2ce;
    --erreur-texte: #4e334b;
    --erreur-fond: #f3e3e9;
    --erreur-trait: #f1bac6;
    --alerte-texte: #4d4744;
    --alerte-fond: #f2eee5;
    --alerte-trait: #efdbb9;
    --info-texte: #1f4a64;
    --info-fond: #daeff7;
    --info-trait: #a5dfee;
    --accent-vif: #1e759c;
    --accent-texte: #1e759c;
    --voile-entete: rgba(255,255,255,0.82);
    --voile-tiroir: rgba(255,255,255,0.98);
    --voile-modale: rgba(255,255,255,0.55);
    --fond-fantome: rgba(22,33,58,0.04);
    --surface-bande: rgba(255,255,255,0.4);
    --separation-surface: 0 1px 2px rgba(16,22,36,0.06);
    --ombre-sm: 0 1px 2px rgba(16,22,36,0.08);
    --ombre: 0 4px 16px rgba(16,22,36,0.10);
    --ombre-lg: 0 16px 40px rgba(16,22,36,0.16);
    --ombre-logo: 0 14px 34px rgba(16,22,36,0.18);
  }
  :root:not([data-theme])[data-accent="bleu"] {
    --accent-vif: #2b6cb0;
    --accent-texte: #2b6cb0;
  }
  :root:not([data-theme])[data-accent="violet"] {
    --accent-vif: #6035d6;
    --accent-texte: #6035d6;
  }
  :root:not([data-theme])[data-accent="rose"] {
    --accent-vif: #be185d;
    --accent-texte: #be185d;
  }
  :root:not([data-theme])[data-accent="ambre"] {
    --accent-vif: #975a16;
    --accent-texte: #975a16;
  }
  :root:not([data-theme])[data-accent="vert"] {
    --accent-vif: #0b784b;
    --accent-texte: #0b784b;
  }
}

/* Sans ceci, le navigateur dessine les contrôles natifs et les barres de
   défilement dans le mauvais mode : champs clairs sur interface sombre. */
:root { color-scheme: dark; }
:root[data-theme="clair"] { color-scheme: light; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) { color-scheme: light; }
}

/* Taille de texte — 90 / 100 / 110 / 125 %.
   Multiplicateur et non `font-size` sur la racine : le terme `vw` des
   clamp() ne suit pas la racine, et l'effet demandé était amputé de moitié
   sur les gros titres. Mesuré à 960 px : +12,50 % au lieu de +25,00 %. */
:root { --echelle-txt: 1; }
:root[data-taille="90"] { --echelle-txt: 0.9; }
:root[data-taille="110"] { --echelle-txt: 1.1; }
:root[data-taille="125"] { --echelle-txt: 1.25; }

/* Densité — l'air entre les choses. Espace membre uniquement : la vitrine
   n'expose que le thème, la teinte et la taille (décision explicite).

   L'interligne est SURCHARGÉ par palier et non multiplié : ×0,8 donnerait 1,28,
   sous le 1,5 que WCAG 1.4.12 demande de pouvoir atteindre pour du texte
   courant. Plancher tenu à 1,5 en compacte.

   --cible-tactile n'est PAS dans l'échelle : huit sélecteurs sont déjà collés à
   ses 44 px, et les faire tomber à 35 px serait une panne SILENCIEUSE — au
   doigt on rate la cible et on touche le lien voisin, sans qu'aucune étape
   n'échoue. design/cascade.mjs vérifie qu'aucun palier ne le redéclare. */
:root { --densite: 1; }
:root[data-densite="compacte"] { --densite: 0.8; --interligne: 1.5; }
:root[data-densite="confortable"] { --densite: 1.2; --interligne: 1.75; }


/* Le bloc de compatibilité avec les anciens noms a été RETIRÉ à la fin du
   LOT 7, une fois ses 38 usages migrés.

   Il avait rendu le service attendu : laisser l'ancien code fonctionner pendant
   la bascule, plutôt que renommer d'un coup dans deux codebases — le genre de
   chantier où l'on casse quelque chose sans le voir. Mais un pont laissé en
   place finit par ne plus être un pont : on écrit du neuf dessus.

   La migration a été faite par TABLE EXPLICITE, jamais par remplacement de
   préfixe. L'ancien « radius » valait 16 px (le rayon large) et l'ancien
   « radius-sm » valait 12 px (le rayon moyen) : un remplacement mécanique de
   « radius » vers « rayon » aurait décalé les deux d'un cran et fait passer
   toutes les cartes de 16 à 12 px — invisible en revue de code, très visible à
   l'écran. Rayons relevés au navigateur avant et après : identiques.

   design/garde-html.mjs, branché dans verify.ps1, refuse désormais tout usage
   d'un alias supprimé. Nécessaire, parce qu'une propriété personnalisée inconnue
   ne produit aucune erreur : la déclaration est simplement ignorée. */