/* Custom pointer for mouse users; touch and reduced-motion users keep the native cursor. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html.has-custom-cursor,
  html.has-custom-cursor * {
    cursor: none !important;
  }

  .cursor-halo {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 14px;
    height: 19px;
    pointer-events: none;
    opacity: 0;
    transform: scale(0.9);
    transform-origin: 0 0;
    transition: opacity 140ms ease, transform 150ms ease;
    will-change: transform;
  }

  .cursor-halo::before,
  .cursor-halo::after {
    position: absolute;
    content: "";
  }

  .cursor-halo::before {
    inset: 0;
    z-index: 1;
    background: #8baeea;
    clip-path: polygon(0 0, 0 100%, 34% 75%, 57% 100%, 73% 91%, 51% 66%, 100% 62%);
    filter: drop-shadow(0 0 1px rgba(120, 165, 245, 0.45));
  }

  .cursor-halo::after {
    z-index: 0;
    top: 10px;
    left: 2px;
    width: 16px;
    height: 11px;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(88, 153, 255, 0.6) 0%, rgba(88, 153, 255, 0.23) 42%, transparent 76%);
    filter: blur(4px);
  }

  .cursor-halo__core {
    position: absolute;
    z-index: 2;
    top: 1px;
    left: 1px;
    width: 11px;
    height: 16px;
    background: linear-gradient(145deg, #202a39, #111720 75%);
    clip-path: polygon(0 0, 0 100%, 34% 75%, 57% 100%, 73% 91%, 51% 66%, 100% 62%);
  }

  .cursor-halo.is-visible {
    opacity: 1;
    transform: scale(1);
  }

  .cursor-halo.is-interactive {
    transform: scale(1.05);
  }
}