/**
 * SCENE CINEMATIQUE - habillage de la scène jetable.
 * File: modules/combat/cinematic/cinematic.css
 * Documentation: Documentations/Combat/cinematiques_v2.md
 *
 * Toute la mise en scène se joue dans #cinematic-scene, posée sur le body
 * par-dessus l'interface de combat (z-40). Rien ici ne touche le DOM de combat :
 * c'est la règle qui rend le nettoyage trivial (on retire un seul noeud).
 */

#cinematic-scene {
    position: fixed;
    inset: 0;
    z-index: 60;            /* au-dessus du conteneur de combat (z-40) */
    overflow: hidden;
    pointer-events: none;   /* une cinématique ne se clique pas */
    /* Fond transparent au départ : le combat reste visible tant que le décor
       n'a pas été demandé. C'est ce qui permet d'ouvrir une scène "sur place". */
    background: transparent;
}

/* Le décor : image plein cadre, changée par fondu. Deux couches pour croiser
   proprement l'ancienne et la nouvelle sans passer par du noir. */
.cine-decor {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
}

/* Le monde : tout ce que la caméra déplace. Les acteurs et les effets vivent
   dedans, le décor et le flash restent fixes. */
.cine-monde {
    position: absolute;
    inset: 0;
    will-change: transform;
}

/* L'ANCRE PORTE LE PLACEMENT, LE SPRITE PORTE L'ANIMATION. Deux éléments, et
   c'est indispensable.

   La propriété `translate` entre dans la même chaîne que `rotate` et `transform`,
   et toute la chaîne tourne autour de `transform-origin`. Un sprite qui portait à
   la fois `translate: -50% -100%` et une rotation voyait donc son pivot effectif
   glisser jusqu'au coin BAS GAUCHE de l'image rendue, au lieu de son centre.
   L'ancre absorbe le décalage d'ancrage, le sprite ne fait plus que tourner et
   grandir autour de son propre centre. */
.cine-ancre {
    position: absolute;
    translate: -50% -100%;
}

.cine-acteur {
    display: block;
    width: auto;
    transform-origin: center bottom;
    object-fit: contain;
    max-width: none;
    filter: drop-shadow(0 14px 22px rgba(0, 0, 0, 0.55));
}

/* Un effet : webp joué à un point d'ancrage. Même convention de pieds que les
   acteurs quand il est ancré au sol. */
.cine-effet {
    position: absolute;
    translate: -50% -100%;
    object-fit: contain;
    max-width: none;
    pointer-events: none;
}

.cine-effet.cine-effet--centre {
    translate: -50% -50%;
}

.cine-effet.cine-effet--plein {
    inset: 0;
    width: 100%;
    height: 100%;
    translate: none;
    object-fit: cover;
}

/* Le flash : voile plein cadre, au-dessus de tout le reste de la scène. */
.cine-flash {
    position: absolute;
    inset: 0;
    background: #fff;
    opacity: 0;
}

/* Le sol : repère invisible, jamais peint. Il porte la ligne d'horizon mesurée
   une seule fois au lancement, pour que rien n'ait besoin de mesurer un élément
   en cours d'animation. */
.cine-sol {
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    opacity: 0;
}

/* EOF: modules/combat/cinematic/cinematic.css - INTEGRITY_CHECK_OK */