/* Compagnon Ludipo — rendu SVG (composé par static/js/compagnon.js).
   Les animations vivent ICI, pas dans le sprite : coupables d'un bloc
   prefers-reduced-motion, et remplaçables sans toucher aux dessins. */

/* Taille INTRINSÈQUE, jamais en pourcentage : le SVG est injecté dans un
   <span> inline (profil, topbar du Carnet, cartes de boutique) dont la
   largeur dépend de son contenu. Un `width: 100%` s'y résout à zéro et le
   compagnon disparaît sans erreur — c'est le bug qui a atteint la prod. */
.compagnon-svg {
    display: block;
    width: var(--compagnon-taille, 240px);
    height: auto;
    margin: 0 auto;
    flex: none;
}

.compagnon-mini .compagnon-svg,
.compagnon-svg.compagnon-mini {
    --compagnon-taille: 64px;
}

.compagnon-moyen .compagnon-svg,
.compagnon-svg.compagnon-moyen {
    --compagnon-taille: 120px;
}

/* Le conteneur hydraté est un <span> : il doit former une vraie boîte. */
[data-compagnon] {
    display: inline-block;
    line-height: 0;
}

/* Respiration douce du corps. Cible l'enveloppe NOMMÉE posée par le
   composeur — jamais « l'enfant direct » : la propriété CSS transform écrase
   l'attribut transform (SVG2), et un sélecteur structurel finirait tôt ou
   tard sur un <g> de positionnement, arrachant le visage de la tête
   (bug du 24/08, penderie). */
.compagnon-anime .compagnon-svg .compagnon-corps {
    transform-origin: 120px 210px;
    transform-box: view-box;
    animation: compagnon-respire 3.6s ease-in-out infinite;
}

@keyframes compagnon-respire {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(0, -2px) scale(1.012); }
}

/* Rotation lente de l'anneau d'énergie. */
.compagnon-aura-rotative {
    transform-origin: 120px 148px;
    transform-box: view-box;
    animation: compagnon-aura-tourne 22s linear infinite;
}

@keyframes compagnon-aura-tourne {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .compagnon-anime .compagnon-svg .compagnon-corps,
    .compagnon-aura-rotative {
        animation: none;
    }
}
