/**
 * Lottie / DotLottie player styles for auth pages
 */

.lottie-wrap {
    width: var(--lottie-size, 4.5rem);
    height: var(--lottie-size, 4.5rem);
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: var(--accent-soft, #e8f5ef);
    color: var(--accent, #1f6b4a);
    position: relative;
    overflow: hidden;
}

.lottie-wrap svg {
    width: 100%;
    height: 100%;
    display: block;
}

.lottie-wrap .lottie-embed,
.lottie-wrap .lottie-player,
.lottie-wrap dotlottie-player {
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
    pointer-events: none;
    background: transparent;
}

.lottie-bob {
    animation: lottie-bob 3s ease-in-out infinite;
}

@keyframes lottie-bob {
    50% { transform: translateY(-6px); }
}

@media (prefers-reduced-motion: reduce) {
    .lottie-bob { animation: none; }
}

.lottie-fallback {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    pointer-events: none;
}

.auth-figure {
    width: var(--lottie-size, 12.5rem);
    height: var(--lottie-size, 12.5rem);
    margin: 0 auto 1.25rem;
    border-radius: 999px;
    overflow: hidden;
}