@keyframes pet-idle {
  0%,
  100% {
    transform: translateY(0) rotate(-0.6deg);
  }
  48% {
    transform: translateY(-3.5px) rotate(0.7deg);
  }
}

@keyframes pet-happy {
  0%,
  100% {
    transform: translateY(0) rotate(-1deg);
  }
  28% {
    transform: translateY(-12%) rotate(2deg) scale(1.02, 0.98);
  }
  55% {
    transform: translateY(1%) rotate(-1.5deg) scale(0.99, 1.01);
  }
  76% {
    transform: translateY(-6%) rotate(1deg);
  }
}

@keyframes pet-eat {
  0%,
  100% {
    transform: translateY(0) rotate(0);
  }
  35% {
    transform: translateY(1.5%) rotate(-2deg) scale(1.015, 0.985);
  }
  70% {
    transform: translateY(0) rotate(2deg) scale(0.99, 1.01);
  }
}

@keyframes pet-sleep {
  0%,
  100% {
    transform: translateY(1.5%) rotate(-2deg) scale(0.985, 0.985);
  }
  50% {
    transform: translateY(0.5%) rotate(-1deg) scale(1, 1.005);
  }
}

@keyframes pet-interact {
  0%,
  100% {
    transform: translateY(0) rotate(0);
  }
  22% {
    transform: translateY(-4%) rotate(-2.4deg);
  }
  48% {
    transform: translateY(-1%) rotate(2.2deg);
  }
  72% {
    transform: translateY(-2.5%) rotate(-1deg);
  }
}

@keyframes pet-breathe {
  0%,
  100% {
    transform: scale(0.994, 0.992);
  }
  48% {
    transform: scale(1.008, 1.018);
  }
}

@keyframes pet-eye-blink {
  0%,
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scaleY(0);
  }
  24%,
  70% {
    opacity: 1;
    transform: translate(-50%, -50%) scaleY(1);
  }
}

@keyframes pet-tap {
  0%,
  100% {
    transform: translateY(0) scale(1);
  }
  22% {
    transform: translateY(-9%) scale(1.03, 0.97);
  }
  48% {
    transform: translateY(2%) scale(0.98, 1.02);
  }
  72% {
    transform: translateY(-3.5%) scale(1.01, 0.99);
  }
}

@keyframes pet-lean-left {
  0%,
  100% {
    transform: rotate(0);
  }
  45%,
  75% {
    transform: rotate(-3.8deg) translateX(-2%);
  }
}

@keyframes pet-lean-right {
  0%,
  100% {
    transform: rotate(0);
  }
  45%,
  75% {
    transform: rotate(3.8deg) translateX(2%);
  }
}

@keyframes pet-stretch {
  0%,
  100% {
    transform: rotate(0) scale(1);
  }
  30% {
    transform: rotate(-2deg) scale(0.97, 1.04);
  }
  60% {
    transform: rotate(2deg) scale(0.98, 1.03);
  }
}

@keyframes pet-bath-wiggle {
  0%,
  100% {
    transform: rotate(0) translateY(0);
  }
  28% {
    transform: rotate(-1.2deg) translateY(-1.5%);
  }
  55% {
    transform: rotate(1.1deg) translateY(0.5%);
  }
  78% {
    transform: rotate(-0.7deg) translateY(-0.8%);
  }
}

@keyframes pet-petting-happy {
  0%,
  100% {
    transform: translateY(0) rotate(0) scale(1);
  }
  30% {
    transform: translateY(-4%) rotate(-1.8deg) scale(1.015, 0.985);
  }
  66% {
    transform: translateY(-1%) rotate(1.5deg) scale(0.99, 1.01);
  }
}

@keyframes pet-thought-float {
  0%,
  100% {
    opacity: 0;
    transform: translateY(6px) scale(0.82);
  }
  20%,
  72% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes pet-tap-spark {
  0% {
    opacity: 0;
    transform: translateY(8px) scale(0.5) rotate(-8deg);
  }
  25%,
  65% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateY(-22px) scale(1.05) rotate(9deg);
  }
}

@keyframes role-ball-roll {
  0%,
  100% {
    transform: translate(0, 0) rotate(0);
  }
  45% {
    transform: translate(24%, -7px) rotate(150deg);
  }
  70% {
    transform: translate(8%, 0) rotate(210deg);
  }
}

@keyframes daydream-float {
  0%,
  100% {
    opacity: 0;
    transform: translate(-50%, 6px) scale(0.7);
  }
  25%,
  72% {
    opacity: 0.9;
  }
  100% {
    transform: translate(calc(-50% + var(--x)), -44px) scale(1);
  }
}

@keyframes effect-float {
  0% {
    opacity: 0;
    transform: translate(-50%, 8px) scale(0.5) rotate(-8deg);
  }
  18% {
    opacity: 1;
  }
  75% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--x)), -58px) scale(1.1) rotate(8deg);
  }
}

@keyframes bubble-rise {
  0% {
    opacity: 0;
    transform: translate(-50%, 8px) scale(0.35);
  }
  25% {
    opacity: 0.9;
  }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--x)), -72px) scale(1.35);
  }
}

@keyframes sleep-drift {
  0% {
    opacity: 0;
    transform: translate(-45%, 8px) scale(0.65) rotate(-8deg);
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(calc(-45% + var(--x)), -45px) scale(1.08) rotate(7deg);
  }
}

@keyframes selection-ring {
  to {
    transform: rotateX(54deg) rotate(360deg) scale(0.8);
  }
}

@keyframes selection-nudge {
  0%,
  100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-5px);
  }
  50% {
    transform: translateX(5px);
  }
  75% {
    transform: translateX(-3px);
  }
}

@keyframes cloud-drift {
  0%,
  100% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(7px);
  }
}

@keyframes mote-float {
  0%,
  100% {
    opacity: 0.2;
    transform: translateY(0) scale(0.7);
  }
  50% {
    opacity: 0.85;
    transform: translateY(-11px) scale(1);
  }
}

@keyframes curtain-breathe {
  0%,
  100% {
    transform: rotate(2deg) skewY(0deg);
  }
  50% {
    transform: rotate(2.8deg) skewY(1deg);
  }
}

@keyframes curtain-breathe-right {
  0%,
  100% {
    transform: rotate(-2deg) skewY(0deg);
  }
  50% {
    transform: rotate(-2.8deg) skewY(-1deg);
  }
}

.pet-actor[data-action="idle"] {
  animation: pet-idle var(--idle-duration, 3.7s) ease-in-out infinite;
  animation-delay: var(--idle-delay, -0.8s);
}

.pet-actor[data-action="idle"] .pet-body {
  animation: pet-breathe var(--breath-duration, 3.8s) ease-in-out infinite;
  animation-delay: var(--breath-delay, -1.2s);
}

.pet-actor[data-action="happy"] {
  animation: pet-happy 0.82s cubic-bezier(0.22, 0.8, 0.24, 1) infinite;
}

.pet-actor[data-action="eat"] {
  animation: pet-eat 0.38s ease-in-out infinite;
}

.pet-actor[data-action="sleep"] {
  animation: pet-sleep 3s ease-in-out infinite;
}

.pet-actor[data-action="interact"] {
  animation: pet-interact 0.72s ease-in-out infinite;
}

.pet-actor[data-action="bath"] {
  animation: pet-bath-wiggle 2.6s ease-in-out infinite;
}

.pet-actor[data-action="pet"] {
  animation: pet-petting-happy 1.75s ease-in-out infinite;
}

.pet-slot.is-sleeping .pet-shadow {
  transform: scaleX(1.16);
}

.pet-slot.is-sleeping .pet-body {
  filter: saturate(0.92) brightness(0.98);
}

.pet-slot.is-tapped .pet-actor {
  animation: pet-tap 680ms cubic-bezier(0.2, 0.8, 0.22, 1);
}

.pet-slot.is-tapped .pet-tap-spark--left {
  animation: pet-tap-spark 720ms ease-out both;
}

.pet-slot.is-tapped .pet-tap-spark--right {
  animation: pet-tap-spark 720ms 80ms ease-out both;
}

.pet-slot.is-leaning-left .pet-sprite {
  animation: pet-lean-left 2.8s ease-in-out both;
}

.pet-slot.is-leaning-right .pet-sprite {
  animation: pet-lean-right 2.8s ease-in-out both;
}

.pet-slot.pose--stretch .pet-sprite {
  animation: pet-stretch 2.6s ease-in-out both;
}

.role--playing .pet-role-prop {
  animation: role-ball-roll 2.4s ease-in-out infinite;
}

.pet-slot[data-action="happy"] .pet-button:hover .pet-shadow {
  transform: scaleX(0.86);
}

.has-effect .pet-slot.is-selected,
.has-effect .pet-selected-ring {
  animation-duration: 1.2s;
}

.effect-particle--heart {
  animation: effect-float 1.8s ease-out infinite;
  animation-delay: var(--delay);
  color: #ec91a1;
}

.effect-particle--sparkle {
  animation: effect-float 1.55s ease-out infinite;
  animation-delay: var(--delay);
  color: #e6b74e;
}

.effect-particle--food {
  animation: effect-float 1.55s ease-in-out infinite;
  animation-delay: var(--delay);
}

.effect-particle--bubbles {
  animation: bubble-rise 2.1s ease-in-out infinite;
  animation-delay: var(--delay);
}

.effect-particle--sleep {
  animation: sleep-drift 2.4s ease-out infinite;
  animation-delay: var(--delay);
}

.effect-particle--daydream {
  animation: daydream-float 2.5s ease-out infinite;
  animation-delay: var(--delay);
}

.window-cloud {
  animation: cloud-drift 8s ease-in-out infinite;
}

.window-cloud--two {
  animation-delay: -3s;
}

.room-motes i {
  animation: mote-float 4.5s ease-in-out infinite;
}

.room-motes i:nth-child(2) {
  animation-delay: -1.3s;
}

.room-motes i:nth-child(3) {
  animation-delay: -2.2s;
}

.room-motes i:nth-child(4) {
  animation-delay: -0.7s;
}

.room-motes i:nth-child(5) {
  animation-delay: -3.1s;
}

.room-motes i:nth-child(6) {
  animation-delay: -1.8s;
}

.curtain--left {
  animation: curtain-breathe 7s ease-in-out infinite;
}

.curtain--right {
  animation: curtain-breathe-right 7s ease-in-out infinite;
}

.pet-slot.is-selected .pet-face {
  animation: pet-happy 2.2s ease-in-out infinite;
}

.pet-info-card.is-open .stat-row {
  animation: card-row-in 420ms ease both;
}

.pet-info-card.is-open .stat-row:nth-child(2) {
  animation-delay: 35ms;
}

.pet-info-card.is-open .stat-row:nth-child(3) {
  animation-delay: 70ms;
}

.pet-info-card.is-open .stat-row:nth-child(4) {
  animation-delay: 105ms;
}

.pet-info-card.is-open .stat-row:nth-child(5) {
  animation-delay: 140ms;
}

@keyframes card-row-in {
  from {
    opacity: 0;
    transform: translateX(7px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}