.ce-cursor-heart,
.ce-cursor-heart * {
cursor: url(https://poissonmort.com/wp-content/plugins/click-effects/assets/heart-cursor.svg) 15 15, auto !important;
}
.ce-cursor-skull,
.ce-cursor-skull * {
cursor: url(https://poissonmort.com/wp-content/plugins/click-effects/assets/skull-cursor.svg) 15 15, auto !important;
} .ce-effect {
position: fixed;
pointer-events: none;
z-index: 2147483647;
user-select: none;
} .ce-flash {
width: 33px;
height: 33px;
border-radius: 50%;
background:
radial-gradient(
circle,
rgba(255,255,255,0.95) 0%,
rgba(255,255,255,0.45) 40%,
rgba(255,255,255,0) 75%
);
transform:
translate(-50%, -50%)
scale(0);
animation:
ce-flash-animation 80ms ease-out forwards;
}
@keyframes ce-flash-animation {
0% {
opacity: 1;
transform:
translate(-50%, -50%)
scale(0);
}
100% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(4);
}
} .ce-ring {
width: 21px;
height: 21px;
border-radius: 50%;
border:
3px solid rgba(255,216,74,0.95);
box-shadow:
0 0 8px rgba(255,216,74,0.8),
0 0 18px rgba(255,216,74,0.5);
filter: blur(1px);
transform:
translate(-50%, -50%)
scale(0);
animation:
ce-ring-animation 450ms ease-out forwards;
}
@keyframes ce-ring-animation {
0% {
opacity: 1;
transform:
translate(-50%, -50%)
scale(0);
}
100% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(7);
}
} .ce-particle {
width: 5px;
height: 5px;
border-radius: 50%;
background:
radial-gradient(
circle,
#fff6a0 0%,
#ffd84a 45%,
#e9a800 100%
);
box-shadow:
0 0 5px rgba(255,216,74,0.9);
transform:
translate(-50%, -50%)
scale(1);
animation:
ce-particle-animation 500ms ease-out forwards;
}
@keyframes ce-particle-animation {
0% {
opacity: 1;
transform:
translate(-50%, -50%)
translate(0,0)
scale(1);
}
100% {
opacity: 0;
transform:
translate(-50%, -50%)
translate(var(--ce-x), var(--ce-y))
scale(0);
}
} .ce-icon {
font-size: 25px;
line-height: 1;
transform:
translate(-50%, -50%)
scale(1);
opacity: 1;
animation:
ce-icon-animation 1000ms ease-out forwards;
}
@keyframes ce-icon-animation {
0% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(1);
}
15% {
opacity: 1;
transform:
translate(-50%, -50%)
scale(1);
}
100% {
opacity: 0;
transform:
translate(-50%, -50%)
scale(1);
}
} @media (prefers-reduced-motion: reduce) {
.ce-effect {
animation: none !important;
}
}