.sfli-floating-wrap {
    position: fixed;
    z-index: var(--sfli-z-index, 99999);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 180ms ease, visibility 180ms ease;
    line-height: 0;
}

.sfli-floating-wrap.sfli-is-visible {
    opacity: var(--sfli-opacity, 1);
    visibility: visible;
    pointer-events: auto;
}

.sfli-position-top-right { top: var(--sfli-offset-y); right: var(--sfli-offset-x); }
.sfli-position-top-left { top: var(--sfli-offset-y); left: var(--sfli-offset-x); }
.sfli-position-bottom-right { bottom: var(--sfli-offset-y); right: var(--sfli-offset-x); }
.sfli-position-bottom-left { bottom: var(--sfli-offset-y); left: var(--sfli-offset-x); }
.sfli-position-middle-right { top: 50%; right: var(--sfli-offset-x); transform: translateY(-50%); }
.sfli-position-middle-left { top: 50%; left: var(--sfli-offset-x); transform: translateY(-50%); }

.sfli-floating-button {
    display: block;
    width: var(--sfli-size, 72px);
    height: var(--sfli-size, 72px);
    text-decoration: none !important;
    border: 0;
    outline: 0;
    background: transparent;
    transform-origin: center;
    will-change: transform, opacity, filter;
    -webkit-tap-highlight-color: transparent;
}

.sfli-floating-button img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    border: 0;
}

.sfli-shape-rounded,
.sfli-shape-rounded img { border-radius: 18%; }
.sfli-shape-circle,
.sfli-shape-circle img { border-radius: 50%; }
.sfli-has-shadow { filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.22)); }

.sfli-floating-button.sfli-run-animation {
    animation-duration: var(--sfli-duration, 700ms);
    animation-timing-function: cubic-bezier(.2,.8,.2,1);
    animation-fill-mode: both;
}

.sfli-animation-fade-in.sfli-run-animation { animation-name: sfliFadeIn; }
.sfli-animation-zoom-in.sfli-run-animation { animation-name: sfliZoomIn; }
.sfli-animation-zoom-rotate.sfli-run-animation { animation-name: sfliZoomRotate; }
.sfli-animation-slide-right.sfli-run-animation { animation-name: sfliSlideRight; }
.sfli-animation-slide-left.sfli-run-animation { animation-name: sfliSlideLeft; }
.sfli-animation-slide-up.sfli-run-animation { animation-name: sfliSlideUp; }
.sfli-animation-slide-down.sfli-run-animation { animation-name: sfliSlideDown; }
.sfli-animation-bounce-in.sfli-run-animation { animation-name: sfliBounceIn; }
.sfli-animation-elastic-in.sfli-run-animation { animation-name: sfliElasticIn; }
.sfli-animation-flip-in.sfli-run-animation { animation-name: sfliFlipIn; backface-visibility: visible; }
.sfli-animation-swing-in.sfli-run-animation { animation-name: sfliSwingIn; transform-origin: top center; }
.sfli-animation-blur-in.sfli-run-animation { animation-name: sfliBlurIn; }
.sfli-animation-roll-in.sfli-run-animation { animation-name: sfliRollIn; }

.sfli-hover-lift,
.sfli-hover-glow,
.sfli-hover-rotate {
    transition: transform 220ms ease, filter 220ms ease;
}
.sfli-hover-lift:hover { transform: translateY(-7px) scale(1.03); }
.sfli-hover-glow:hover { filter: drop-shadow(0 0 16px rgba(61, 134, 255, .72)); transform: scale(1.04); }
.sfli-hover-rotate:hover { transform: rotate(9deg) scale(1.04); }
.sfli-hover-pulse:hover { animation: sfliHoverPulse .7s ease-in-out infinite alternate; }

.sfli-floating-button:focus-visible {
    outline: 3px solid #2271b1;
    outline-offset: 5px;
    border-radius: 12px;
}

@keyframes sfliFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes sfliZoomIn { from { opacity: 0; transform: scale(.35); } 65% { transform: scale(1.08); } to { opacity: 1; transform: scale(1); } }
@keyframes sfliZoomRotate { from { opacity: 0; transform: scale(.25) rotate(-150deg); } 70% { transform: scale(1.08) rotate(8deg); } to { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes sfliSlideRight { from { opacity: 0; transform: translateX(90px); } to { opacity: 1; transform: translateX(0); } }
@keyframes sfliSlideLeft { from { opacity: 0; transform: translateX(-90px); } to { opacity: 1; transform: translateX(0); } }
@keyframes sfliSlideUp { from { opacity: 0; transform: translateY(90px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sfliSlideDown { from { opacity: 0; transform: translateY(-90px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sfliBounceIn { 0% { opacity: 0; transform: scale(.25); } 55% { opacity: 1; transform: scale(1.16); } 72% { transform: scale(.92); } 88% { transform: scale(1.05); } 100% { transform: scale(1); } }
@keyframes sfliElasticIn { 0% { opacity: 0; transform: scale(.1); } 55% { opacity: 1; transform: scale(1.22); } 70% { transform: scale(.86); } 82% { transform: scale(1.10); } 91% { transform: scale(.96); } 100% { transform: scale(1); } }
@keyframes sfliFlipIn { from { opacity: 0; transform: perspective(500px) rotateY(-95deg) scale(.75); } 65% { opacity: 1; transform: perspective(500px) rotateY(12deg) scale(1.03); } to { transform: perspective(500px) rotateY(0) scale(1); } }
@keyframes sfliSwingIn { 0% { opacity: 0; transform: rotate(28deg) translateY(-25px); } 45% { opacity: 1; transform: rotate(-10deg); } 70% { transform: rotate(5deg); } 88% { transform: rotate(-2deg); } 100% { transform: rotate(0); } }
@keyframes sfliBlurIn { from { opacity: 0; filter: blur(18px); transform: scale(1.28); } to { opacity: 1; filter: blur(0); transform: scale(1); } }
@keyframes sfliRollIn { from { opacity: 0; transform: translateX(-100px) rotate(-180deg); } to { opacity: 1; transform: translateX(0) rotate(0); } }
@keyframes sfliHoverPulse { from { transform: scale(1); } to { transform: scale(1.10); } }

@media (max-width: 782px) {
    .sfli-floating-button {
        width: var(--sfli-mobile-size, 58px);
        height: var(--sfli-mobile-size, 58px);
    }
    .sfli-hide-mobile { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .sfli-floating-button,
    .sfli-floating-button:hover {
        animation: none !important;
        transition: none !important;
        transform: none !important;
    }
}