/*  binary.ly — THE B-CURSOR (shared)
    Parallelogram cursor + two trailing ghosts. Cream-on-difference: the
    stroke is hard-coded cream and `mix-blend-mode: difference` auto-
    inverts against the backdrop, so the cursor reads cream on dark
    surfaces and ink on cream surfaces — no theme tokens needed. Tying
    the stroke to a theme-swap variable BREAKS the difference math.   */

/* Hide the OS cursor on fine-pointer devices so the b-cursor is the
   only visible one. Important to win over page-local rules. */
@media (pointer: fine) {
  html, body { cursor: none !important; }
  html *, html *::before, html *::after { cursor: none !important; }
  a, button, [role="button"], input, textarea, select { cursor: none !important; }
}

.b-cursor {
  position: fixed; top: 0; left: 0;
  width: 17px; height: 32px;
  pointer-events: none;
  z-index: 10001;
  opacity: 0;
  transform: translate3d(-50px, -50px, 0);
  /* Pivot rotation around the cursor tip (matches the polygon's (1,1) point)
     so the body banks behind the tip as it travels. */
  transform-origin: 1px 1px;
  transition: opacity 0.3s ease;
  mix-blend-mode: difference;
  /* Hard-coded cream. DO NOT switch to a theme var — would invert the
     contrast math and make the cursor invisible in light mode. */
  color: rgba(240, 235, 225, 0.9);
  will-change: transform;
}
.b-cursor-trail            { z-index: 10000; transition: opacity 0.35s ease, transform 0s; }
.b-cursor-trail--1         { color: rgba(240, 235, 225, 0.3); }
.b-cursor-trail--2         { color: rgba(240, 235, 225, 0.12); }

.b-cursor svg {
  display: block; width: 100%; height: 100%; overflow: visible;
  transition: transform 0.45s cubic-bezier(0.34, 1.56, 0.64, 1),
              filter    0.25s ease;
}
.b-cursor polygon {
  stroke: currentColor;
  fill: none;
  stroke-linejoin: round;
  transition: fill 0.22s ease, stroke 0.22s ease;
}

/* Hover state: cursor turns gold + glows + scales up; trails fade out */
.b-cursor.is-active polygon {
  stroke: #C9A84C;
  fill: rgba(201, 168, 76, 0.6);
}
.b-cursor.is-active svg {
  transform: scale(1.18);
  filter: drop-shadow(0 0 5px rgba(201, 168, 76, 1))
          drop-shadow(0 0 16px rgba(201, 168, 76, 0.45));
}
.b-cursor-trail.is-faded { opacity: 0 !important; }

/* Coarse pointers (touch) — restore native cursor, hide the b-cursor */
@media (pointer: coarse), (hover: none) {
  html, body, html *, html *::before, html *::after,
  a, button, [role="button"], input, textarea, select {
    cursor: auto !important;
  }
  .b-cursor { display: none !important; }
}
