/**
 * Hulyx Viewport Captions v1.0
 */
/* ── Typing indicator dots ───────────────────────────────────── */
.hvc-typing-dots {
    display: inline-flex;
    gap: 3px;
    align-items: center;
}
.hvc-typing-dots span {
    display: inline-block;
    animation: hvcDotPulse 1s ease-in-out infinite;
    font-size: 1.4em;
    opacity: 0;
}
.hvc-typing-dots span:nth-child(1) { animation-delay: 0s; }
.hvc-typing-dots span:nth-child(2) { animation-delay: 0.18s; }
.hvc-typing-dots span:nth-child(3) { animation-delay: 0.36s; }
@keyframes hvcDotPulse {
    0%, 100% { opacity: 0; transform: translateY(0); }
    50%       { opacity: 1; transform: translateY(-4px); }
}
/* ── Entry animations ────────────────────────────────────────── */
.hvc-bubble {
    transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* pop */
.hvc-anim-pop {
    animation: hvcPop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}
@keyframes hvcPop {
    0%   { opacity: 0; transform: scale(0.4) rotate(var(--tilt, 0deg)); }
    100% { opacity: 1; transform: scale(1)   rotate(var(--tilt, 0deg)); }
}
/* float */
.hvc-anim-float {
    animation: hvcFloat 0.55s ease-out both;
}
@keyframes hvcFloat {
    0%   { opacity: 0; transform: translateY(18px) rotate(var(--tilt, 0deg)); }
    100% { opacity: 1; transform: translateY(0)    rotate(var(--tilt, 0deg)); }
}
/* bounce */
.hvc-anim-bounce {
    animation: hvcBounce 0.6s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
}
@keyframes hvcBounce {
    0%   { opacity: 0; transform: scale(0.3)  rotate(var(--tilt, 0deg)); }
    60%  { opacity: 1; transform: scale(1.08) rotate(var(--tilt, 0deg)); }
    80%  {             transform: scale(0.96) rotate(var(--tilt, 0deg)); }
    100% {             transform: scale(1)    rotate(var(--tilt, 0deg)); }
}
/* shake */
.hvc-anim-shake {
    animation: hvcShake 0.5s ease both;
}
@keyframes hvcShake {
    0%   { opacity: 0; transform: translateX(-12px) rotate(var(--tilt, 0deg)); }
    30%  { opacity: 1; transform: translateX(6px)  rotate(var(--tilt, 0deg)); }
    60%  {             transform: translateX(-3px) rotate(var(--tilt, 0deg)); }
    100% {             transform: translateX(0)   rotate(var(--tilt, 0deg)); }
}
/* swing */
.hvc-anim-swing {
    animation: hvcSwing 0.6s ease both;
    transform-origin: top center;
}
@keyframes hvcSwing {
    0%   { opacity: 0; transform: rotate(-8deg); }
    40%  { opacity: 1; transform: rotate(4deg);  }
    70%  {             transform: rotate(-2deg); }
    100% {             transform: rotate(var(--tilt-deg, 0deg)); }
}
/* ── Typewriter cursor ───────────────────────────────────────── */
.hvc-cursor {
    display: inline-block;
    margin-left: 2px;
    font-weight: 400;
    animation: hvcCursorBlink 0.75s step-end infinite;
    vertical-align: baseline;
}
@keyframes hvcCursorBlink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0; }
}