/* Magnifier cursor styles */
.hammer-cursor {
  position: fixed;
  left: 0;
  top: 0;
  width: 64px; /* initial lens size; JS will resize */
  height: 64px;
  pointer-events: none;
  z-index: 2147483647; /* ensure on top */
  opacity: 0; /* fade in on first move */
  transition: opacity 0.25s ease, width 0.12s ease, height 0.12s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  will-change: transform;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,0.15);
  box-shadow: 0 10px 25px rgba(0,0,0,0.2);
  background: transparent;
}

/* The magnified viewport (an iframe showing this page, scaled up) */
.magnifier-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  border: none;
  transform-origin: 0 0;
  pointer-events: none; /* never capture clicks */
}

/* Subtle emphasis when hovering interactive elements */
.hammer-cursor--active {
  border-color: rgba(230, 126, 34, 0.5);
  box-shadow: 0 14px 35px rgba(230,126,34,0.25), 0 0 0 4px rgba(230,126,34,0.08) inset;
}

/* Hide the custom cursor for touch devices and users preferring reduced motion */
@media (hover: none), (pointer: coarse) {
  .hammer-cursor { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .hammer-cursor { display: none !important; }
}