/* Ubit Halloween rig — CSS puro, sin dependencias.
   Copiar carpeta completa a Blazor wwwroot/ubit-rig/ y Astro public/ubit-rig/.
   v1: idle float + blink (squash ojos) + wing breathe + hat sway.
   Sin JS sigue animando; ubit-rig.js solo pausa offscreen. */

.ubit-rig {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    min-height: 0;
    overflow: clip;
    animation: ubit-float 3.2s ease-in-out infinite;
}

/* Tamaño natural (sin caja asignada): respeta proporción 237/512. */
.ubit-rig--auto {
    height: auto;
    aspect-ratio: 237 / 512;
}

.ubit-rig img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
}

.ubit-rig .layer-wing-left {
    transform-origin: 75% 45%;
    animation: ubit-breathe-l 3.2s ease-in-out infinite;
}

.ubit-rig .layer-wing-right {
    transform-origin: 25% 45%;
    animation: ubit-breathe-r 3.2s ease-in-out infinite;
}

.ubit-rig .layer-eyes {
    transform-origin: 53.6% 29.4%;
    animation: ubit-blink 4.5s ease-in-out infinite;
}

.ubit-rig .layer-hat {
    transform-origin: 55% 28%;
    animation: ubit-sway 5s ease-in-out infinite;
}

.ubit-rig.is-paused,
.ubit-rig.is-paused img {
    animation-play-state: paused;
}

@keyframes ubit-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

@keyframes ubit-breathe-l {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.03, 1.015); }
}

@keyframes ubit-breathe-r {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.03, 1.015); }
}

@keyframes ubit-blink {
    0%, 92%, 100% { transform: scaleY(1); }
    95% { transform: scaleY(0.12); }
}

@keyframes ubit-sway {
    0%, 100% { transform: rotate(1.5deg); }
    50% { transform: rotate(-2deg); }
}

@media (prefers-reduced-motion: reduce) {
    .ubit-rig,
    .ubit-rig img {
        animation: none;
    }
}
