/* ==========================================================================
   Magic Pointer Easter Egg
   ========================================================================== */

body.magic-pointer-active,
body.magic-pointer-active * {
  cursor: none !important;
}

.magic-pointer {
  position: fixed;
  top: 0;
  left: 0;
  width: 44px;
  height: 47px;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  z-index: 99999999;
  transform: translate3d(-100px, -100px, 0);
  will-change: transform, filter;
  filter: drop-shadow(0 4px 14px rgba(66, 133, 244, 0.45));
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.15s ease, filter 0.2s ease;
}

.magic-pointer.pointer-visible {
  opacity: 1;
  visibility: visible;
}

.magic-pointer.pointer-hovering {
  filter: drop-shadow(0 0 16px rgba(169, 168, 255, 0.85)) drop-shadow(0 0 26px rgba(255, 99, 160, 0.5));
}

.magic-pointer.pointer-clicking {
  filter: drop-shadow(0 0 20px rgba(255, 99, 160, 0.9)) drop-shadow(0 0 30px rgba(66, 133, 244, 0.7));
}

/* Allow smooth cursor tracking over video shield when magic pointer is active */
body.magic-pointer-active .theater-video-shield {
  pointer-events: auto;
  cursor: none;
}

/* Magic Sparkle Particles */
.magic-sparkle {
  position: fixed;
  pointer-events: none;
  z-index: 99999998;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: magicSparkleFade 0.65s cubic-bezier(0.1, 0.8, 0.2, 1) forwards;
}

@keyframes magicSparkleFade {
  0% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--spark-dx, 0px)), calc(-50% + var(--spark-dy, 0px))) scale(0.15);
  }
}

@media (pointer: coarse), (max-width: 768px) {
  .magic-pointer,
  .magic-sparkle {
    display: none !important;
    visibility: hidden !important;
  }
}