/* ============================================================
   Global Cursor — Solid dot with manual color invert (no blend-mode)
   - 16px solid circle (1.6x of 10px for clear visibility)
   - Background color under cursor is detected on every move
   - Dot color is set to OPPOSITE of background (manual invert)
   - Works on every background including images, gradients, text
   - Native cursor hidden
   ============================================================ */

*, *::before, *::after { cursor: none !important; }

@media (hover: none), (pointer: coarse) {
  *, *::before, *::after { cursor: auto !important; }
  .cursor-dot { display: none !important; }
}

.cursor-dot {
  position: fixed;
  top: 0; left: 0;
  width: 16px;       /* larger for visibility */
  height: 16px;
  border-radius: 50%;
  background: #ffffff;            /* default before first detection */
  pointer-events: none;
  z-index: 999999;
  will-change: transform, background-color;
  transform: translate3d(-100px, -100px, 0);
  margin: -8px 0 0 -8px;
  contain: layout style paint;
  backface-visibility: hidden;
  /* Subtle outline so the dot is always visible regardless of color logic */
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.35),
    0 0 0 2px rgba(0,0,0,0.18);
  transition: background-color 0.12s ease;
}