/* Hide native OS cursor globally so only the glass cursor is visible */
html,
body,
*,
*::before,
*::after,
*:hover,
*:active,
*:focus,
a,
button,
input,
textarea,
select,
label {
  cursor: none !important;
}

#cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  border: 1.2px solid rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(0px) saturate(180%) contrast(1.1) brightness(1.18);
  -webkit-backdrop-filter: blur(0px) saturate(180%) contrast(1.1) brightness(1.18);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.3),
    inset 0 1.5px 1.5px rgba(255, 255, 255, 0.9),
    inset 0 -1.5px 3px rgba(255, 255, 255, 0.25),
    0 0 14px rgba(255, 255, 255, 0.5),
    0 0 20px rgba(0, 229, 255, 0.25);
  pointer-events: none;
  z-index: 99999;
  transform: translate3d(0, 0, 0) translate(-50%, -50%) scale(1);
  will-change: transform, width, height, border-radius;
  transition:
    width 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    height 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    border-radius 0.35s cubic-bezier(0.16, 1, 0.3, 1),
    background 0.35s ease,
    border-color 0.35s ease,
    backdrop-filter 0.35s ease,
    box-shadow 0.35s ease;
}

/* Soft ambient gradient RGB ring around the glass edge */
#cursor::after {
  content: '';
  position: absolute;
  top: -4px;
  left: -4px;
  right: -4px;
  bottom: -4px;
  border-radius: inherit;
  background: conic-gradient(
    from 0deg,
    #ff3366,
    #ff9900,
    #33cc66,
    #00ccff,
    #9933ff,
    #ff33cc,
    #ff3366
  );
  padding: 2.5px;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  opacity: 0;
  filter: blur(4px) brightness(1.2);
  pointer-events: none;
  transition: opacity 0.35s ease, filter 0.35s ease;
}

#cursor.hovering {
  background: rgba(255, 255, 255, 0.06);
  border: 1.5px solid rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(0px) saturate(240%) contrast(1.18) brightness(1.28);
  -webkit-backdrop-filter: blur(0px) saturate(240%) contrast(1.18) brightness(1.28);
  box-shadow:
    0 12px 36px rgba(0, 0, 0, 0.35),
    inset 0 2px 2px rgba(255, 255, 255, 0.95),
    inset 0 -2px 6px rgba(255, 255, 255, 0.3),
    0 0 20px rgba(255, 255, 255, 0.7),
    0 0 22px rgba(0, 229, 255, 0.35),
    0 0 22px rgba(255, 0, 180, 0.35);
}

#cursor.hovering::after {
  opacity: 0.85;
  filter: blur(3px) brightness(1.3) drop-shadow(0 0 8px rgba(0, 204, 255, 0.35));
}

/* Glass subtle highlight helper for hovered elements */
.glass-magnified {
  transform: scale(1.025) !important;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease !important;
  z-index: 5 !important;
}


#cursor.clicking {
  opacity: 0.85;
}

/* Touch / no-hover devices: fall back to native cursor */
@media (hover: none), (pointer: coarse) {
  #cursor {
    display: none !important;
  }
  html, body, a, button, input, select, textarea {
    cursor: auto !important;
  }
}