/* Reusable DRO hover. Set --dro-angle to match the surrounding layout. */
.dro-hover {
  animation: dro-hover 4s ease-in-out infinite;
  transform-origin: 50% 52%;
}
.dro-hover.is-paused { animation-play-state: paused; }
@keyframes dro-hover {
  0%, 100% { transform: translate(0, 0) rotate(var(--dro-angle, 0deg)); }
  25% { transform: translate(3px, var(--dro-lift-quarter, -12px)) rotate(calc(var(--dro-angle, 0deg) + 1.5deg)); }
  50% { transform: translate(0, var(--dro-lift-half, -18px)) rotate(var(--dro-angle, 0deg)); }
  75% { transform: translate(-3px, var(--dro-lift-end, -9px)) rotate(calc(var(--dro-angle, 0deg) - 1.5deg)); }
}
@media (prefers-reduced-motion: reduce) {
  .dro-hover { animation: none; transform: rotate(var(--dro-angle, 0deg)); }
}