/* ═══════════════════════════════════════════════════════════════════════
   AMBIANCES DU HUB — la couleur du fond satiné, au choix de chacun.

   CE FICHIER N'EST PAS GÉNÉRÉ. Il ne doit rien devoir à `rouzes-ui` :
   tokens.css et theme-hub.css, eux, sont recopiés par socle-erp/sync.mjs
   et toute retouche y serait écrasée au prochain passage. L'ambiance ne
   descendant pas dans les modules, rien n'a de raison de remonter là-bas.
   À charger APRÈS hub.css.

   Chaque ambiance pose deux choses :

   1. --amb-h / --amb-s / --amb-l : la couleur du FOND, sans unité, lue
      telle quelle par js/ambiance.js pour peindre le canvas. Le motif
      étant monochrome (mesuré sur la vidéo de référence : la teinte y
      varie de 4,7° en tout), une ambiance EST une couleur — la structure,
      elle, ne bouge pas d'un pixel d'une ambiance à l'autre.

   2. Les accents du hub. Deux valeurs, pas une : `--azur` se pose sur le
      rail presque noir, `--azur-fonce` sur du blanc. Une seule teinte ne
      peut pas tenir les deux contrastes, et c'est exactement ce qu'une
      roue chromatique libre ne savait pas garantir.

   CE QUI NE CHANGE PAS : les treize teintes de MODULES[]. Elles portent
   l'identité de chaque module, pas la décoration, et hub.css leur impose
   déjà une clarté mesurée (--L-actif / --L-survol / --L-pilule). La
   pastille active reste donc à la couleur de SON module.
   --indigo, lui, suit l'ambiance : il n'est la teinte que de « Tableau de
   bord », seule entrée propre au hub depuis le départ de la Répartition
   (12/09/2026). Comme la clarté lui est imposée en OKLCH, le contraste
   tient quelle que soit la teinte reçue — sans rien à remesurer.
   ═══════════════════════════════════════════════════════════════════════ */

/* Défaut — Azur Rouzès. Valeurs d'accent IDENTIQUES à celles d'avant :
   qui ne choisit rien ne voit aucun accent changer, seul le fond s'anime. */
:root{
  --amb-h:206; --amb-s:84; --amb-l:46;
  /* L'anneau de focus se pose sur la zone BLANCHE : il suit la teinte FONCÉE
     de l'ambiance (5,4 à 9,1:1 sur blanc dans les neuf), pas la claire, qui
     ne donnait que 1,9:1 en « Jaune » (CSA-09). */
  --color-ring: var(--color-primary-hover);
  --color-primary:#008CF8;  --color-primary-hover:#0066D6;  --indigo:#008CF8;
}

[data-amb="magenta"]{ --amb-h:324; --amb-s:78; --amb-l:52;
  --color-primary:#E2168F;  --color-primary-hover:#A8106A;  --indigo:#E2168F; }

[data-amb="violet"] { --amb-h:272; --amb-s:62; --amb-l:48;
  --color-primary:#8B5CF6;  --color-primary-hover:#6D28D9;  --indigo:#8B5CF6; }

[data-amb="rouge"]  { --amb-h:356; --amb-s:74; --amb-l:46;
  --color-primary:#E11D48;  --color-primary-hover:#A81236;  --indigo:#E11D48; }

[data-amb="braise"] { --amb-h:16;  --amb-s:80; --amb-l:50;
  --color-primary:#EA580C;  --color-primary-hover:#B23C00;  --indigo:#EA580C; }

[data-amb="jaune"]  { --amb-h:46;  --amb-s:92; --amb-l:54;
  --color-primary:#EAB308;  --color-primary-hover:#8A6100;  --indigo:#EAB308; }

[data-amb="foret"]  { --amb-h:168; --amb-s:62; --amb-l:36;
  --color-primary:#0D9488;  --color-primary-hover:#0A6E66;  --indigo:#0D9488; }

[data-amb="marine"] { --amb-h:226; --amb-s:78; --amb-l:30;
  --color-primary:#3B5BDB;  --color-primary-hover:#23409E;  --indigo:#3B5BDB; }

[data-amb="ardoise"]{ --amb-h:224; --amb-s:26; --amb-l:42;
  --color-primary:#64748B;  --color-primary-hover:#46536B;  --indigo:#64748B; }

/* Le pont vers la couche sémantique du socle : theme-hub.css fait
   `--color-primary: var(--rz-azur)`, et les variables CSS se résolvent
   PARESSEUSEMENT. Cette seule ligne suffit donc à faire suivre .btn,
   .toast, les anneaux de focus — sans dupliquer une seule règle, et sans
   toucher au fichier généré. */
:root{
  --rz-azur: var(--color-primary);
  --rz-azur-fonce: var(--color-primary-hover);
}

/* ═══ LE FOND ═══════════════════════════════════════════════════════════
   Ce dégradé n'est PAS décoratif : c'est le repli. Il est visible
   1) le temps que le canvas peigne sa première image,
   2) si le canvas échoue ou n'est pas disponible,
   3) sous `prefers-reduced-motion`, où hub.css coupe toute animation.
   Il doit donc tenir debout seul, et rester dans la couleur de
   l'ambiance — sinon le repli trahirait le choix de la personne. */
body{
  background:
    radial-gradient(1200px 800px at 84% 10%,
      hsl(calc(var(--amb-h) + 12) calc(var(--amb-s) * .82 * 1%) calc((var(--amb-l) + 20) * 1%)),
      transparent 62%),
    radial-gradient(950px 720px at 8% 90%,
      hsl(calc(var(--amb-h) - 10) calc(var(--amb-s) * 1%) calc((var(--amb-l) - 12) * 1%)),
      transparent 60%),
    linear-gradient(128deg,
      hsl(var(--amb-h) calc(var(--amb-s) * 1%) calc((var(--amb-l) + 7) * 1%)),
      hsl(var(--amb-h) calc(var(--amb-s) * 1%) calc((var(--amb-l) - 7) * 1%)));
  background-attachment:fixed;
}

/* La toile couvre le repli quand elle a quelque chose à montrer. Elle
   reste `hidden` tant que js/ambiance.js n'a pas peint : un canvas vide
   est TRANSPARENT, pas noir — mais l'afficher avant la première image
   ferait clignoter le dégradé pour rien. */
.fond{
  position:fixed;inset:0;z-index:-1;
  width:100%;height:100%;
  display:block;pointer-events:none;
  /* le canvas est peint en 160×90 puis étiré : le flou masque
     l'interpolation de l'agrandissement, qui ferait sinon apparaître des
     losanges sur les grands aplats. */
  filter:blur(6px);
  transform:scale(1.04);   /* mange les bords adoucis par le flou */
}