/* Shared cursor: soft dot with five trailing dots.
   Hidden on touch / coarse-pointer devices. Respects prefers-reduced-motion. */

@media (hover: hover) and (pointer: fine) {
  html, body, *, *::before, *::after { cursor: none; }

  .cursor-dot,
  .cursor-trail span {
    position: fixed;
    top: 0;
    left: 0;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform;
    background: #000000;
    z-index: 99999;
  }

  .cursor-dot {
    width: 7px;
    height: 7px;
    transition: width .25s ease, height .25s ease, opacity .25s ease;
  }

  .cursor-trail span { z-index: 99998; }
  .cursor-trail span:nth-child(1) { width: 5px; height: 5px; opacity: .55; }
  .cursor-trail span:nth-child(2) { width: 4px; height: 4px; opacity: .42; }
  .cursor-trail span:nth-child(3) { width: 4px; height: 4px; opacity: .30; }
  .cursor-trail span:nth-child(4) { width: 3px; height: 3px; opacity: .20; }
  .cursor-trail span:nth-child(5) { width: 2px; height: 2px; opacity: .12; }

  .cursor-dot.is-interactive {
    width: 14px;
    height: 14px;
  }

  html[data-theme="dark"] .cursor-dot,
  html[data-theme="dark"] .cursor-trail span {
    background: #ffffff;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cursor-trail { display: none; }
}