/* Shared pointer follower: a small circle that trails the mouse.
   The native cursor stays visible; the circle is only an extra cue.
   Touch devices and reduced-motion users never see it. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .cursor-ring {
    position: fixed;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    z-index: 9999;
    pointer-events: none;
    will-change: transform;
  }

  .cursor-ring i {
    position: absolute;
    top: 0;
    left: 0;
    width: 9px;
    height: 9px;
    margin: -4.5px 0 0 -4.5px;
    border: 0;
    border-radius: 50%;
    background: #1b1b1e;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .65);
    opacity: 0;
    transform: scale(1);
    transition: opacity 200ms ease, transform 200ms ease, background-color 200ms ease;
  }

  .cursor-ring.is-visible i {
    opacity: .9;
  }

  .cursor-ring.is-active i {
    opacity: 1;
    transform: scale(1.7);
  }

  [data-theme="dark"] .cursor-ring i {
    background: #f4f4f5;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .45);
  }
}