.site-cursor {
  position: fixed;
  z-index: 2147483647;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  color: #fff;
  mix-blend-mode: difference;
  pointer-events: none;
  visibility: hidden;
  will-change: transform;
}
.site-cursor * { pointer-events: none; }
.site-cursor__shape {
  position: absolute;
  top: -32px;
  left: -32px;
  display: grid;
  width: 64px;
  height: 64px;
  place-items: center;
}
.site-cursor__dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: currentColor;
}
.site-cursor__arrow { position: absolute; width: 32px; height: 32px; opacity: 0; }
.site-cursor__label { position: absolute; font: 500 10px/1 Arial, sans-serif; letter-spacing: 0.25em; opacity: 0; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.has-site-cursor, html.has-site-cursor * { cursor: none !important; }
  html.has-site-cursor :is(input, textarea, [contenteditable="true"]) { cursor: text !important; }
  html.has-site-cursor :is(select, iframe) { cursor: auto !important; }
}