/* Hidden Differences — keyframes. Everything decorative collapses to a gentle
   fade (or nothing) under reduced motion. */

.hd-marker { animation: hd-marker-pop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes hd-marker-pop {
  0% { transform: translate(-50%, -50%) scale(0.2); opacity: 0; }
  100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

.hd-wiggle { animation: hd-wiggle 0.4s ease; }
@keyframes hd-wiggle {
  0%, 100% { transform: translate(-50%, -50%) rotate(0); }
  25% { transform: translate(-50%, -50%) rotate(-8deg); }
  75% { transform: translate(-50%, -50%) rotate(8deg); }
}

.hd-ripple { animation: hd-ripple 0.8s ease-out forwards; }
@keyframes hd-ripple {
  0% { opacity: 0.9; scale: 0.4; }
  100% { opacity: 0; scale: 1.6; }
}

.hd-sparkle { animation: hd-sparkle 1.5s ease-in-out; }
@keyframes hd-sparkle {
  0%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(0.6); }
  30%, 70% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); }
}

.hd-hint-pulse { animation: hd-hint-pulse 1s ease-in-out 3; }
@keyframes hd-hint-pulse {
  0%, 100% { opacity: 0.4; transform: translate(-50%, -50%) scale(0.9); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.1); }
}

.hd-pulse-once { animation: hd-btn-pulse 0.75s ease-in-out 2; }
@keyframes hd-btn-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}

.hd-star-pop { animation: hd-star-pop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) both; }
@keyframes hd-star-pop {
  0% { transform: scale(0); }
  100% { transform: scale(1); }
}

.hd-inner { transition: transform 0.25s ease-out; }

.hd-skeleton-pair span { animation: hd-shimmer 1.4s linear infinite; }
@keyframes hd-shimmer {
  0% { background-position: 120% 0; }
  100% { background-position: -80% 0; }
}

.hd-hero-flip { display: inline-block; animation: hd-hero-flip 3s ease-in-out infinite; }
@keyframes hd-hero-flip {
  0%, 40%, 100% { filter: hue-rotate(0deg); }
  50%, 90% { filter: hue-rotate(140deg); }
}

/* Reduced motion: keep state changes, drop the show. */
body.hd-reduced .hd-marker,
body.hd-reduced .hd-star-pop { animation: hd-fade 0.2s ease both; }
body.hd-reduced .hd-inner { transition: none; }
body.hd-reduced .hd-wiggle,
body.hd-reduced .hd-pulse-once,
body.hd-reduced .hd-hero-flip { animation: none; }
/* Reduced motion: keep a static tint instead of the shimmer/fade. */
body.hd-reduced .hd-skeleton-pair span,
body.hd-reduced .hd-cat-cover.is-loading,
body.hd-reduced .hd-puzzle-thumb.is-loading { animation: none; }
body.hd-reduced .hd-cat-cover.is-loaded,
body.hd-reduced .hd-puzzle-thumb.is-loaded { animation: none; }
body.hd-reduced .hd-found-slot.is-filled { animation: none; }
@keyframes hd-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}