/* AGOGE — Spinner montagne. Reference de conception validee le 24 octobre 2026.
   Un seul mouvement, quatre usages. Ne charge aucun script et ne declenche aucune requete. */
/* R6b-L6-J6 (2026-10-27) — copie de docs/ui-ux/AGOGE-UIUX-Claude-Code-v1/spinner-montagne/agoge-spinner.css (1 669 o, sha256 40441bd6…
   du MANIFESTE.json) : bloc de la référence ci-dessous À L'OCTET (jetons déjà ceux d'agoge-montagne.css : --agm-navy, --agm-lime ;
   trait 1,8 = --agm-ic-stroke ; courbe = --agm-ease ; [hidden] forcé gardé). Écarts : ce commentaire, puis la section « composition »
   en fin de fichier (ajouts, rien de retiré ni de modifié au-dessus) : bloc d'attente (agoge-spinner.js), deux formats d'écran
   composés comme exemple.html (signature fixe, libellé ; #DCE5EE de l'exemple → --agm-on-navy-muted, graisse 750 → --agm-fw-bold,
   14 px → --agm-fs-body), contenu des boutons (texte du bouton gardé : --agm-on-lime sur citron, pas le #142438 de l'exemple),
   bouton occupé lisible (opacité 1, comme .aw-action), libellé lu non affiché (tirer-pour-rafraîchir). Aucune animation ajoutée. */
.agoge-spinner{
  --agoge-spinner-size:32px;
  --agoge-spinner-color:var(--agm-navy,#172C45);
  --agoge-spinner-cycle:1800ms;
  display:inline-flex;align-items:center;justify-content:center;
  width:var(--agoge-spinner-size);height:var(--agoge-spinner-size);
  color:var(--agoge-spinner-color);flex:0 0 auto;
}
.agoge-spinner[hidden]{display:none!important}
.agoge-spinner svg{display:block;width:100%;height:100%;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.agoge-spinner__ghost{opacity:.18}
.agoge-spinner__trace{stroke-dasharray:100;stroke-dashoffset:100;animation:agoge-spinner-trace var(--agoge-spinner-cycle) infinite;will-change:stroke-dashoffset,opacity}
.agoge-spinner--screen{--agoge-spinner-size:46px}
.agoge-spinner--zone{--agoge-spinner-size:32px}
.agoge-spinner--button{--agoge-spinner-size:22px}
.agoge-spinner--on-dark{--agoge-spinner-color:var(--agm-lime,#D5F365)}
.agoge-spinner--on-light{--agoge-spinner-color:var(--agm-navy,#172C45)}
@keyframes agoge-spinner-trace{
  0%{stroke-dashoffset:100;opacity:1;animation-timing-function:cubic-bezier(.22,1,.36,1)}
  45%{stroke-dashoffset:0;opacity:1;animation-timing-function:linear}
  66%{stroke-dashoffset:0;opacity:1}
  88%{stroke-dashoffset:0;opacity:0}
  88.1%{stroke-dashoffset:100;opacity:0}
  100%{stroke-dashoffset:100;opacity:1}
}
@media(prefers-reduced-motion:reduce){.agoge-spinner__trace{animation:none;stroke-dashoffset:0;opacity:1;will-change:auto}}

/* ===== R6b-L6-J6 — composition dans l'app (ajouts ; jetons d'agoge-montagne.css, spécificité de ses règles) =====
   Bloc d'attente (agSpinner) : le bloc porte aria-busy="true", la montagne est aria-hidden, le libellé porte role="status" ; le
   contenu réel remplace le bloc dans la même image (retrait immédiat, aucune durée minimale). */
html[data-ui="montagne"] .agoge-wait{display:flex;align-items:center;gap:var(--agm-sp-3);margin:0;color:var(--agm-muted)}
html[data-ui="montagne"] .agoge-wait__label{margin:0;font-size:var(--agm-fs-body);font-weight:var(--agm-fw-regular);line-height:var(--agm-lh-meta);color:var(--agm-muted);text-align:left}
html[data-ui="montagne"] .agoge-wait--zone{min-height:37px}
/* Écran bleu nuit / écran blanc (exemple.html : .aw-full, .aw-signature, .aw-word ; variante ≤ 380 px) : signature AGOGE fixe, libellé dessous. */
html[data-ui="montagne"] .agoge-wait--screen{flex-direction:column;justify-content:center;gap:var(--agm-sp-4);min-height:212px;padding:28px var(--agm-sp-6);text-align:center}
html[data-ui="montagne"] .agoge-wait--screen .agoge-wait__label{text-align:center}
html[data-ui="montagne"] .agoge-wait__signature{display:flex;align-items:center;justify-content:center;gap:13px}
html[data-ui="montagne"] .agoge-wait__word{font-size:36px;font-weight:var(--agm-fw-bold);letter-spacing:-1.3px;line-height:1.1}
html[data-ui="montagne"] .agoge-wait--navy{background:var(--agm-navy);color:var(--agm-on-navy)}
html[data-ui="montagne"] .agoge-wait--navy .agoge-wait__label{color:var(--agm-on-navy-muted)}
html[data-ui="montagne"] .agoge-wait--white{background:var(--agm-paper);color:var(--agm-navy)}
@media(max-width:380px){html[data-ui="montagne"] .agoge-wait--screen{min-height:194px;padding:25px 18px}html[data-ui="montagne"] .agoge-wait__word{font-size:32px}html[data-ui="montagne"] .agoge-wait--screen .agoge-spinner{--agoge-spinner-size:40px}}
/* Bouton : montagne (et libellé si le bouton a un texte) dans le contenu ; le display, la taille et la couleur du texte restent ceux du
   bouton (marge négative de la montagne : la ligne garde la hauteur du texte, le bouton ne grandit pas pendant l'attente) ; bouton occupé
   lisible (désactivé sans voile). */
html[data-ui="montagne"] .agoge-wait--button{display:inline-flex;gap:var(--agm-sp-2);color:inherit;vertical-align:middle}
html[data-ui="montagne"] .agoge-wait--button .agoge-spinner{margin:-3px 0}
html[data-ui="montagne"] .agoge-wait--button .agoge-wait__label{font:inherit;color:inherit;text-align:inherit}
html[data-ui="montagne"] .agoge-busy[aria-busy="true"]:disabled{opacity:1;cursor:progress}
/* Libellé lu, non affiché. */
html[data-ui="montagne"] .agoge-wait__label--sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}