/* Стили анимации персонажа (canvas-риг на одном фото) */

/* Плавное свечение-рамка по состоянию задаётся из JS через box-shadow */
#character-rig {
    transition: box-shadow 300ms ease;
    transform-style: preserve-3d;
    will-change: transform;
}

/* Дыхание: лёгкая постоянная пульсация */
@keyframes rig-breathe {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-4px) scale(1.006); }
}
#rig-breath {
    animation: rig-breathe 4.5s ease-in-out infinite;
    will-change: transform;
}

/* Веки для моргания: sweep сверху вниз (scaleY 0 -> 1).
   Фон (кожа над глазом) и позиция задаются из JS. */
.rig-eyelid {
    position: absolute;
    transform-origin: top center;
    transform: scaleY(0);
    background-repeat: no-repeat;
    pointer-events: none;
    will-change: transform;
    border-radius: 40% 40% 45% 45%;
}

/* Индикатор «печатает…» — три пульсирующие точки */
.typing-dots {
    display: inline-flex;
    gap: 4px;
    align-items: center;
}
.typing-dots span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    opacity: 0.35;
    animation: typing-blink 1.2s infinite;
}
.typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.typing-dots span:nth-child(3) { animation-delay: 0.4s; }
@keyframes typing-blink {
    0%, 100% { opacity: 0.25; transform: translateY(0); }
    50%      { opacity: 1;    transform: translateY(-2px); }
}

/* Рот: тёмная полость, растёт по громкости голоса.
   Позиция и размер задаются из JS. */
.rig-mouth {
    position: absolute;
    transform-origin: center center;
    transform: scaleY(0.15);
    opacity: 0;
    border-radius: 50%;
    background: radial-gradient(ellipse at center,
        rgba(70, 12, 22, 0.96) 0%,
        rgba(45, 6, 14, 0.88) 55%,
        rgba(45, 6, 14, 0) 78%);
    filter: blur(1px);
    pointer-events: none;
    will-change: transform, opacity;
}