/*
 * Transitions de page. Turbo 8 déclenche l'API View Transitions du navigateur
 * (méta `view-transition` dans le gabarit) : c'est le navigateur qui capture
 * l'ancienne page et fait le fondu, sans une ligne de JavaScript de notre part.
 *
 * Là où l'API n'existe pas, la navigation reste instantanée : aucune régression.
 */

::view-transition-old(root) {
    animation: sortie-page 0.32s var(--ease-franc) both;
}

::view-transition-new(root) {
    animation: entree-page 0.42s var(--ease-sortie) both;
}

@keyframes sortie-page {
    to {
        opacity: 0;
        transform: translateY(-1.25rem);
        filter: blur(3px);
    }
}

@keyframes entree-page {
    from {
        opacity: 0;
        transform: translateY(1.75rem);
    }
}

/*
 * L'en-tête et le curseur ne doivent pas être capturés dans la transition :
 * un nom de vue propre les fait persister d'une page à l'autre.
 */
.entete {
    view-transition-name: entete;
}

.curseur {
    view-transition-name: curseur;
}

@media (prefers-reduced-motion: reduce) {
    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation: none;
    }
}

/*
 * Éléments révélés : cachés seulement si le contrôleur a pu s'armer. Sans
 * JavaScript, `--arme` n'est jamais posée et tout reste visible.
 */
.revele--arme > * {
    will-change: transform, opacity;
}

.revele--fini > * {
    will-change: auto;
}
