[ripple] {
    --ripple-color: rgba(102, 102, 102, 0.3);
    position: relative;
    overflow: hidden
}
.ripple {
    background-color: var(--ripple-color, rgba(0,0,0,0.25));
    transition: transform 1s ease-out, opacity 1s ease;
    transform: translate(-50%, -50%) scale(0);
    pointer-events: none;
    border-radius: 50%;
    position: absolute;
    z-index: -1
}
@keyframes ripple-enter {
    to {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0
    }
}