/* Couches de scène — GÉNÉRÉ par site/scene-gen/lib/sprites.mjs. Ne pas éditer à la main.
   Le mouvement est porté par des DIV (compositeur : 0 layout, 0 repaint par frame) ; les
   @keyframes ci-dessous sont celles du kit, exprimées en % du repère 1000 × 600. */

.stage.az-lift { position: relative; display: block; margin: 0; overflow: hidden; }
/* Le cadre (format, fond, arrondi, ombre) que portait le <svg> racine avant d'être tranché.
   ".az-lift-nu" le retire quand le conteneur le fournit déjà (tuile du hero, § PREUVE). */
.stage.az-lift:not(.az-lift-nu) { width: 100%; aspect-ratio: 1000 / 600;
  border-radius: 16px; background: #0b1220; box-shadow: var(--shadow-lift); }
.still .stage.az-lift:not(.az-lift-nu) { border-radius: 16px 16px 0 0; }
/* .az-lift-nu : le conteneur fournit déjà la boîte (tuile du hero, .preuve-stage de l'accueil). */
.stage.az-lift.az-lift-nu { position: absolute; inset: 0; }
.stage.az-lift > .az-fitbox { position: absolute; inset: 0; container-type: size; pointer-events: none; }
.az-fit { position: absolute; inset: 0; }
/* Les couches vivent dans .az-couches, PAS dans .az-fit : le cadrage « cover » centre .az-fit par
   un transform, et l'animation d'entrée pose le sien — deux transforms, deux éléments.
   ("margin:auto" ne convient pas : une marge automatique NÉGATIVE est refusée par la spec, la
   boîte se collait à gauche — écart mesuré de 14,5 px sur la tuile du hero.) */
.az-couches { position: absolute; inset: 0; }
/* « contain » : la scène porte DÉJÀ le rapport du viewBox (aspect-ratio sur .stage.az-lift, ou sur
   le conteneur en .az-lift-nu) — la boîte des couches est donc simplement la scène entière.
   ⚠️ Ne PAS la recalculer en unités de conteneur : sur une largeur fractionnaire, l'arrondi de
   min()/calc() décale l'ensemble d'un sous-pixel, et TOUTE la scène change de rasterisation
   (mesuré : 0,3 à 2,8 % des pixels de la page). Ici, zéro calcul, zéro écart. */
.az-fit-meet { inset: 0; width: auto; height: auto; }
/* « cover » : la plus petite qui la COUVRE (le cadrage rogné de la tuile du hero). */
.az-fit-slice { inset: auto; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: max(100cqw, calc(100cqh * 1000 / 600));
  height: max(100cqh, calc(100cqw * 600 / 1000)); }
/* ⚠️ Ces trois-là doivent BATTRE ".stage:not(.bubble) svg" (fond, arrondi, aspect-ratio) : sans
   "!important", chaque tranche repeindrait un fond nuit par-dessus la tranche précédente. */
.az-couches > .az-lyr, .az-couches > .az-spr, .az-spr > svg, .az-spr-mi > svg {
  position: absolute !important; inset: 0; width: 100% !important; height: 100% !important;
  aspect-ratio: auto !important; background: none !important; border-radius: 0 !important;
  box-shadow: none !important; display: block; }
.az-spr > svg, .az-spr-mi > svg { overflow: visible; }
/* Enveloppes « M · T · M⁻¹ » : voir sprites.mjs § 4 (chaîne d'ancêtres tournée ou mise à l'échelle). */
.az-couches > .az-spr-m, .az-spr-m > .az-spr, .az-spr > .az-spr-mi {
  position: absolute !important; inset: 0; width: 100% !important; height: 100% !important;
  transform-box: border-box; }
/* Le pivot ("transform-box:fill-box; transform-origin:center" du kit) est retranscrit en % du
   repère, en style INLINE sur chaque sprite, à partir de la boîte englobante mesurée. */
.az-spr { transform-box: border-box; transform-origin: center; }
.az-enter { animation:svgcam--azh .85s cubic-bezier(.2,.85,.25,1) both }

@keyframes svgcam--azh{0%{opacity:0;transform:scale(1.9)}55%{opacity:1}100%{opacity:1;transform:scale(1)}}
@keyframes svgbreathe--azh{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
@keyframes svgping--azh{0%{transform:scale(.35);opacity:.6}75%,100%{transform:scale(2.5);opacity:0}}
@keyframes svgwiggle--azh{0%,100%{transform:rotate(-3.5deg)}50%{transform:rotate(3.5deg)}}
@keyframes svgtravel--azh{0%{transform:translateX(0);opacity:0}8%{opacity:1}46%{transform:translateX(52%);opacity:1}64%{transform:translateX(52%);opacity:1}74%{opacity:0}100%{transform:translateX(0);opacity:0}}
@keyframes svgburst--azh{0%,46%{transform:scale(0);opacity:0}54%{transform:scale(1.25);opacity:1}62%,84%{transform:scale(1);opacity:1}93%,100%{transform:scale(0);opacity:0}}
@keyframes svgdrop--azh{0%{transform:translateY(-12%);opacity:0}22%{transform:translateY(0);opacity:1}84%{transform:translateY(0);opacity:1}100%{transform:translateY(-12%);opacity:0}}
@keyframes svgshake--azh{0%,68%,100%{transform:translateX(0)}72%{transform:translateX(-0.5%)}76%{transform:translateX(0.5%)}80%{transform:translateX(-0.5%)}84%{transform:translateX(0.5%)}88%{transform:translateX(0)}}
@keyframes svgbob--azh{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.3333%)}}
@keyframes svgzap--azh{0%{transform:scale(0);opacity:0}9%{transform:scale(1);opacity:1}46%{transform:scale(1);opacity:1}58%{transform:scale(1.25);opacity:1}73%{transform:scale(0);opacity:0}100%{transform:scale(0);opacity:0}}
@keyframes svgbounce--azh{0%{transform:translateX(0);opacity:0}14%{opacity:1}44%{transform:translateX(-9%)}54%{transform:translateX(-6.8%)}66%{transform:translateX(-9%);opacity:1}80%{opacity:0}100%{transform:translateX(0);opacity:0}}
@keyframes svgdriftl--azh{0%,100%{transform:translateX(0)}50%{transform:translateX(-2.2%)}}
@keyframes svgdriftr--azh{0%,100%{transform:translateX(0)}50%{transform:translateX(2.2%)}}
@keyframes svgrise--azh{0%{transform:translateY(5.6667%);opacity:.2}50%{transform:translateY(0);opacity:1}100%{transform:translateY(-5.6667%);opacity:0}}
@keyframes svgwave--azh{0%{transform:scale(.05);opacity:.7}80%,100%{transform:scale(2.05);opacity:0}}
@keyframes svgjet--azh{0%,100%{transform:scaleY(.5);opacity:.4}45%{transform:scaleY(1.05);opacity:.85}}
@keyframes svgdropl--azh{0%{transform:translate(0,0);opacity:0}14%{opacity:1}44%{transform:translate(-1.6%,-13.3333%)}100%{transform:translate(-3.4%,2.3333%);opacity:0}}
@keyframes svgdropr--azh{0%{transform:translate(0,0);opacity:0}14%{opacity:1}44%{transform:translate(1.6%,-13.3333%)}100%{transform:translate(3.4%,2.3333%);opacity:0}}
@keyframes svgdropc--azh{0%{transform:translate(0,0);opacity:0}12%{opacity:1}46%{transform:translate(0,-106px)}100%{transform:translate(0.4%,1.6667%);opacity:0}}
@keyframes svgsmoke--azh{0%{transform:translateY(0) scale(.5);opacity:0}22%{opacity:.5}100%{transform:translateY(-14.3333%) scale(1.8);opacity:0}}
@keyframes svgbombl--azh{0%{transform:translate(0,0);opacity:0}12%{opacity:1}46%{transform:translate(-2.2%,-8.6667%)}100%{transform:translate(-5%,6%);opacity:0}}
@keyframes svgbombr--azh{0%{transform:translate(0,0);opacity:0}12%{opacity:1}46%{transform:translate(2.2%,-8.6667%)}100%{transform:translate(5%,6%);opacity:0}}
@keyframes svgflowdown--azh{0%{transform:translate(0,0);opacity:0}14%{opacity:.95}70%{opacity:.7}100%{transform:translate(5.8%,12%);opacity:0}}
@keyframes svgstream--azh{0%{transform:translate(-2.4%,-3%);opacity:0}16%{opacity:1}74%{opacity:1}100%{transform:translate(16.8%,21%);opacity:0}}
@keyframes svgspin--azh{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes svghalo--azh{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:.95;transform:scale(1.06)}}
@keyframes svgheatup--azh{0%{transform:scaleY(.42)}55%{transform:scaleY(1)}100%{transform:scaleY(1)}}
@keyframes svgglcslide--azh{0%{transform:translate(0,0);opacity:0}10%{opacity:1}48%{transform:translate(4.6%,7%)}66%{transform:translate(7%,11.6667%)}72%{transform:translate(7%,10.6667%)}100%{transform:translate(7%,11.6667%);opacity:0}}
@keyframes svgsealift--azh{0%{transform:translateY(4.3333%)}46%,76%{transform:translateY(0)}100%{transform:translateY(4.3333%)}}
@keyframes svgseaexp--azh{0%,100%{transform:scaleY(.8)}48%{transform:scaleY(1)}}
@keyframes svgshfpole--azh{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(-7.3333%);opacity:1}}
@keyframes svgshfclimb--azh{0%,100%{transform:translate(0,0);opacity:.5}50%{transform:translate(2.8%,-10%);opacity:1}}
@keyframes svgscan--azh{0%{transform:translateX(0);opacity:0}8%{opacity:1}48%{transform:translateX(68%);opacity:1}56%{transform:translateX(68%);opacity:1}92%{opacity:1}100%{transform:translateX(0);opacity:0}}
@keyframes svgcog--azh{from{transform:rotate(0)}to{transform:rotate(360deg)}}

@media (prefers-reduced-motion: reduce) { .az-couches, .az-spr { animation: none !important; } }