body #magicMouseCursor {
  display: none;
}

body #magicMouseCursor.cursor-square {
  border-radius: 0;
}

body #magicPointer {
  height: 32px;
  width: 32px;
  top: 0;
  left: 0;
  position: fixed;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 24 24' fill='%23F0BB62'%3E%3Cpath d='M5 3h7c4.42 0 8 3.58 8 8s-3.58 8-8 8H5V3zm7 14c3.31 0 6-2.69 6-6s-2.69-6-6-6H7v12h5z'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-color: transparent;
  border-radius: 0;
  pointer-events: none;
  filter: 
    drop-shadow(1px 1px 0px #c99a4e) 
    drop-shadow(2px 2px 0px #a17b3e)
    drop-shadow(4px 4px 5px rgba(0,0,0,0.5));
  transition: transform 0.1s ease-out;
  transform-origin: 0 0;
}

body #magicPointer.is-hover {
  background: red;
}

body #magicPointer.pointer-blur {
  height: 50px;
  width: 50px;
  background: none;
  border: 1px solid #F0BB62;
  box-shadow: 0px 0px 15px -5px white;
}

body #magicPointer.pointer-overlay {
  height: 50px;
  width: 50px;
  mix-blend-mode: difference;
  box-shadow: 0px 0px 15px -5px white;
}

body .magic-hover {
  transition: all 0.2s;
}

body .magic-hover:hover {
  cursor: none;
}