/* A lightweight orbital cursor for precise-pointer devices. */
@media (hover: hover) and (pointer: fine) {
  body.interactive-cursor-active,
  body.interactive-cursor-active * { cursor: none; }
  body.interactive-cursor-active.cursor-text-mode input,
  body.interactive-cursor-active.cursor-text-mode textarea,
  body.interactive-cursor-active.cursor-text-mode select,
  body.interactive-cursor-active.cursor-text-mode [contenteditable="true"] { cursor: text; }

  .interactive-cursor {
    position: fixed;
    z-index: 99999;
    inset: 0 auto auto 0;
    width: 0;
    height: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
    mix-blend-mode: screen;
  }
  .interactive-cursor.is-visible { opacity: 1; }
  .interactive-cursor.is-text { opacity: 0; }
  .interactive-cursor__ring {
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(89, 219, 255, .65);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(12, 170, 255, .08), rgba(12, 170, 255, .015) 62%, transparent 72%);
    box-shadow: 0 0 18px rgba(0, 180, 255, .16), inset 0 0 10px rgba(75, 211, 255, .08);
    transition: width .24s cubic-bezier(.2,.8,.2,1), height .24s cubic-bezier(.2,.8,.2,1), border-color .24s ease, background .24s ease, box-shadow .24s ease;
    will-change: transform, width, height;
  }
  .interactive-cursor__ring::before,
  .interactive-cursor__ring::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
  }
  .interactive-cursor__ring::before {
    left: 50%;
    top: -3px;
    width: 5px;
    height: 5px;
    background: #a9f4ff;
    box-shadow: 0 0 9px rgba(49, 207, 255, .9);
    transform: translateX(-50%);
  }
  .interactive-cursor__ring::after {
    inset: 5px;
    border: 1px dashed rgba(115, 220, 255, .28);
    animation: cursor-orbit 12s linear infinite;
  }
  .interactive-cursor__dot {
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #e8fbff;
    box-shadow: 0 0 7px 2px rgba(52, 202, 255, .72);
    will-change: transform;
  }
  .interactive-cursor.is-interactive .interactive-cursor__ring {
    width: 48px;
    height: 48px;
    border-color: rgba(121, 232, 255, .9);
    background: radial-gradient(circle, rgba(12, 170, 255, .15), rgba(12, 170, 255, .035) 65%, transparent 74%);
    box-shadow: 0 0 24px rgba(0, 180, 255, .25), inset 0 0 14px rgba(75, 211, 255, .12);
  }
  .interactive-cursor.is-pressed .interactive-cursor__ring {
    width: 25px;
    height: 25px;
    border-color: rgba(218, 250, 255, .95);
  }
  .interactive-cursor.is-pressed .interactive-cursor__dot {
    transform: translate3d(-50%, -50%, 0) scale(1.7) !important;
  }
  @keyframes cursor-orbit { to { transform: rotate(360deg); } }
}
