body.cursorLoaded {
  cursor: none;
}
.cursor {
  --scale: 1;
  pointer-events: none;
  position: fixed;
  z-index: 1011;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border: 2px solid red;
  border-radius: 50%;
  transform: translate(calc(var(--left) - 50%), calc(var(--top) - 50%))
    scale(var(--scale));
}
@media (width < 500px) {
  .cursor {
    display: none;
  }
  body.cursorLoaded {
    cursor: unset;
  }
}