.correlatif-cursor {
position: fixed;
top: 0;
left: 0;
z-index: 99;
contain: layout style size;
pointer-events: none;
will-change: transform;
transition: opacity 0.3s, color 0.4s;
}
.correlatif-cursor:before {
content: "";
position: absolute;
top: -30px;
left: -30px;
display: block;
width: 60px;
height: 60px;
border-radius: 50%;
transform: scale(0);
transition: transform 0.3s ease-in-out, opacity 0.1s;
background: var(--e-global-color-primary);
}
.correlatif-cursor.-normal { mix-blend-mode: normal; }
.correlatif-cursor.-normal:before { background: currentColor; }
.correlatif-cursor.-text { mix-blend-mode: normal; }
.correlatif-cursor.-text .correlatif-cursor-text { opacity: 1; transform: scale(1); }
.correlatif-cursor.-text:before { background: currentColor; }
.correlatif-cursor.-inverse { color: white; }
.correlatif-cursor.-visible:before { transform: scale(0.2); }
.correlatif-cursor.-visible.-active:before { transform: scale(0.23); transition-duration: 0.2s; }
.correlatif-cursor.-pointer:before { transform: scale(0); }
.correlatif-cursor.-text:before {
background: #000;
opacity: 0.8;
backdrop-filter: blur(10);
transform: scale(1.5);
}
.correlatif-cursor.-text.-active:before { transform: scale(1.6); transition-duration: 0.2s; }
.correlatif-cursor.-opaque:before { transform: scale(1.5); }
.correlatif-cursor-text {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0);
opacity: 0;
color: #fff;
font-size: 12px;
white-space: nowrap;
padding: 0 12px;
}