.dab_bubbles_module,
.dab_bubbles_module .et_pb_module_inner {
    position: relative;
    width: 100%;
    min-height: var(--dab-height, 420px);
}

.dab-bubbles-stage {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    isolation: isolate;
    -webkit-mask-image: linear-gradient(
        to bottom,
        transparent 0,
        #000 var(--dab-fade-bottom, 8%),
        #000 calc(100% - var(--dab-fade-top, 14%)),
        transparent 100%
    );
    mask-image: linear-gradient(
        to bottom,
        transparent 0,
        #000 var(--dab-fade-bottom, 8%),
        #000 calc(100% - var(--dab-fade-top, 14%)),
        transparent 100%
    );
}

.dab-bubble {
    position: absolute;
    left: var(--x);
    bottom: calc(-1 * var(--size) - 8%);
    width: var(--size);
    height: var(--size);
    border-radius: 999px;
    color: var(--dab-color, #ffffff);
    border: 1.5px solid color-mix(in srgb, currentColor 54%, transparent);
    background:
        radial-gradient(circle at 31% 27%, color-mix(in srgb, currentColor 34%, transparent) 0 5%, transparent 18%),
        radial-gradient(circle at 67% 72%, transparent 0 48%, color-mix(in srgb, currentColor 12%, transparent) 78%, transparent 100%),
        color-mix(in srgb, currentColor 7%, transparent);
    box-shadow:
        inset -3px -5px 12px color-mix(in srgb, currentColor 8%, transparent),
        inset 3px 4px 9px color-mix(in srgb, currentColor 18%, transparent),
        0 0 12px color-mix(in srgb, currentColor 8%, transparent);
    opacity: calc(var(--dab-opacity, 28) / 100 * var(--alpha));
    transform: translate3d(0, 0, 0) scale(0.92);
    animation: dab-bubble-rise var(--duration) linear var(--delay) infinite;
    will-change: transform, opacity;
}

@keyframes dab-bubble-rise {
    0% {
        transform: translate3d(0, 8vh, 0) scale(0.88);
        opacity: 0;
    }
    8% {
        opacity: calc(var(--dab-opacity, 28) / 100 * var(--alpha));
    }
    42% {
        transform: translate3d(var(--drift-a), -48vh, 0) scale(1);
    }
    74% {
        transform: translate3d(var(--drift-b), -94vh, 0) scale(1.04);
    }
    94% {
        opacity: calc(var(--dab-opacity, 28) / 100 * var(--alpha));
    }
    100% {
        transform: translate3d(var(--drift-c), -132vh, 0) scale(1.08);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .dab-bubble {
        animation: none !important;
        bottom: auto;
        top: var(--static-y, 50%);
        opacity: calc(var(--dab-opacity, 28) / 100 * var(--alpha) * 0.72);
    }
}