/* ═══════════════════════════════════════════
   POST BAIL — assets/cursor.css
   Ball & Chain Cursor + Free Cursor
   ═══════════════════════════════════════════ */

/* ── Chain container ── */
.chain-cursor {
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 9999;
  display: none; /* 🔒 touch gate: hidden by default (safe on mobile/tablet) */
}

.chain-cursor .seg {
  position: absolute;
  top: 0;
  left: 0;
  will-change: transform, opacity;
}

.chain-cursor .seg img {
  display: block;
  pointer-events: none;
  max-width: none;       /* ← overrides postbail.css base img rule */
/*  filter: brightness(1.3) drop-shadow(0 0 4px rgba(255, 255, 255, .3));*/
  filter: brightness(1.25) drop-shadow(0 0 10px rgba(255, 255, 255, .12));
}

/* ── Segment sizes (keep in sync with cursor.js) ── */
.seg--ring img { width: 36px; height: 36px; }
.seg--link img { width: 28px; height: 28px; }
.seg--ball img { width: 80px; height: 80px; }

/* ── Free cursor (post-release) ── */
.free-cursor {
  position: fixed;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  border-radius: 50%;

  /*gray cursor*/
  background: #f0f0f0;
  box-shadow: 0 0 8px rgba(255, 255, 255, .4);

  /*red cursor*/
/*
  background: #d30000;
  box-shadow: 0 0 8px rgba(211, 0, 0, .5);
*/

  pointer-events: none;
  z-index: 9999;
  opacity: 0;
  display: none; /* 🔒 touch gate: hidden by default */
  transform: translate(-50%, -50%);
  transition: opacity .5s ease .2s;
}

.free-cursor.is-visible {
  opacity: 1;
}

/* ═══════════════════════════════════════════
   🔒 TOUCH GATE — only show custom cursor
      on devices that actually have a mouse
      (hoverable surface + fine pointer)
   ═══════════════════════════════════════════ */
@media (hover: hover) and (pointer: fine) {

  .chain-cursor {
    display: block;
  }

  .free-cursor {
    display: block;
  }

  /* ── Hide default cursor when custom is active ── */
  body.has-chain-cursor,
  body.has-chain-cursor * {
    cursor: none !important;
  }

}