﻿@media (hover:hover) and (pointer:fine) {
 html.custom-cursor-enabled,
 html.custom-cursor-enabled body,
 html.custom-cursor-enabled body * {
  cursor:none!important;
 }

 html.custom-cursor-enabled input,
 html.custom-cursor-enabled textarea,
 html.custom-cursor-enabled [contenteditable=true] {
  cursor:text!important;
 }

 #skyder-custom-cursor {
  position:fixed;
  z-index:2147483647;
  left:0;
  top:0;
  width:0;
  height:0;
  pointer-events:none;
  opacity:0;
  will-change:transform;
  transition:opacity .12s ease;
 }

 #skyder-custom-cursor.visible {opacity:1}

 #skyder-custom-cursor .arrow {
  position: absolute;
  left: 0;
  top: 0;
  width: 20px;
  height: 28px;
  opacity: 1;
  overflow: visible;
  filter:
    drop-shadow(0 0 2px rgba(255,255,255,.95))
    drop-shadow(0 0 4px rgba(0,110,255,.95))
    drop-shadow(0 0 8px rgba(0,75,255,.9))
    drop-shadow(0 0 14px rgba(0,55,255,.65));
  transition: opacity .12s ease;
}

 #skyder-custom-cursor .reticle {
  position:absolute;
  left:-15px;
  top:-15px;
  width:30px;
  height:30px;
  opacity:0;
  transform:scale(.72);
  transition:opacity .16s ease,transform .16s ease;
  filter:
   drop-shadow(0 0 3px #fff)
   drop-shadow(0 0 7px #00baff);
 }

 #skyder-custom-cursor.hovering .arrow {opacity:0}
 #skyder-custom-cursor.hovering .reticle {
  opacity:1;
  transform:scale(1);
 }

 #skyder-custom-cursor.pressed .arrow,
 #skyder-custom-cursor.pressed .reticle {
  transform:scale(.88);
 }
}

@media (hover:none),(pointer:coarse) {
 #skyder-custom-cursor {display:none!important}
}





