@keyframes target-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.75);
  }
}
.animate-target-pulse {
  animation: target-pulse 1s ease-in-out infinite;
}
/* ============================================
 * Rotate button — manual tuning knobs.
 * Edit --rotate-btn-dx / --rotate-btn-dy (any CSS length) and
 * reload. No Tailwind rebuild needed.
 *   dx > 0 nudges right, dy > 0 nudges down.
 * ============================================ */
#rotateBtn {
  --rotate-btn-dx: 2px;
  --rotate-btn-dy: 2px;
  top: calc(6.25% + var(--rotate-btn-dy));
  left: calc(6.25% + var(--rotate-btn-dx));
  transform: translate(-50%, -50%);
}
/* Only the visible move hint reacts to the pointer. Its full-square wrapper
   remains transparent to pointer events, so empty space does not highlight. */
.move-hint {
  pointer-events: auto;
  cursor: pointer;
}
.move-hint:hover {
  animation-play-state: paused;
}

@keyframes piece-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
.animate-piece-pulse {
  animation: piece-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes ripple {
  0% {
    width: 0.5rem;
    height: 0.5rem;
    opacity: 0.6;
  }
  100% {
    width: 2rem;
    height: 2rem;
    opacity: 0;
  }
}
.animate-ripple {
  animation: ripple 130ms ease-out forwards;
}

@keyframes land-pop {
  0% {
    transform: scale(0.85);
  }
  50% {
    transform: scale(1.08);
  }
  100% {
    transform: scale(1);
  }
}
.animate-land {
  animation: land-pop 150ms ease-out;
}

.abs-fill {
  position: absolute;
  inset: 0;
}
.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.abs-coord {
  position: absolute;
  font-size: 10px;
  font-weight: 700;
  opacity: 0.5;
  user-select: none;
  pointer-events: none;
}
.label {
  display: block;
  font-size: 12px;
  color: #737373;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
}

.board-rotation-transition {
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.counter-rotate-transition {
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}