.cafe-pet .cafe-pet-art {
  overflow: visible;
}

.cafe-pet [data-touch-zone] {
  cursor: pointer;
}

.cafe-pet .cr-pose {
  display: none;
}

.cafe-pet .cr-seated {
  display: inline;
}

.cafe-pet .cr-breath,
.cafe-pet .cr-pat-breathe,
.cafe-pet .cr-rest-breathe {
  transform-box: view-box;
  transform-origin: 50px 90px;
  animation: cr-breath 3.4s ease-in-out infinite;
}

.cafe-pet .cr-rest-breathe { transform-origin: 50px 102px; }

.cafe-pet .cr-tail {
  transform-box: fill-box;
  transform-origin: 8% 76%;
  animation: cr-tail 3.8s ease-in-out infinite;
}

/* Hands share the contacted body part's transform; origins do not depend on visible hands. */
.cafe-pet .cr-head {
  transform-box: view-box;
  transform-origin: 50px 62px;
}

.cafe-pet .cr-eyes {
  transform-box: fill-box;
  transform-origin: center;
  animation: cr-blink 6s linear infinite;
}

.cafe-pet .cr-hand,
.cafe-pet .cr-purr,
.cafe-pet .cr-pat-lines,
.cafe-pet .cr-invite-paws {
  display: none;
  pointer-events: none;
}

.cafe-pet .cr-hand {
  transform-box: view-box;
  transform-origin: 50px 62px;
}

.cafe-pet.state-head .cr-head {
  animation: cr-nuzzle 1.4s ease-in-out infinite;
}

.cafe-pet.state-head .cr-hand-head {
  display: inline;
  animation: cr-pet-hand 1.4s ease-in-out infinite;
}

.cafe-pet.state-head .cr-purr,
.cafe-pet.state-chin .cr-purr {
  display: inline;
  animation: cr-purr 1.4s ease-in-out infinite;
}

.cafe-pet.state-head .cr-eyes,
.cafe-pet.state-chin .cr-eyes {
  animation: none;
  transform: scaleY(.65);
}

.cafe-pet.state-chin .cr-head {
  animation: cr-chin-up 1.6s ease-in-out infinite;
}

.cafe-pet.state-chin .cr-hand-chin {
  display: inline;
  animation: cr-chin-hand .44s ease-in-out infinite;
}

.cafe-pet.state-invite .cr-front-paws {
  display: none;
}

.cafe-pet.state-invite .cr-invite-paws {
  display: inline;
  transform-box: fill-box;
  transform-origin: center bottom;
  animation: cr-reach 1.5s ease-in-out infinite;
}

.cafe-pet.state-invite .cr-head {
  transform: translateY(-2px) rotate(-5deg);
}

.cafe-pet.state-invite .cr-tail {
  animation-duration: 1.7s;
}

.cafe-pet.state-held .cr-seated,
.cafe-pet.state-pat .cr-seated,
.cafe-pet.state-rest .cr-seated {
  display: none;
}

.cafe-pet.state-held .cr-held,
.cafe-pet.state-release .cr-held,
.cafe-pet.state-pat .cr-patting,
.cafe-pet.state-rest .cr-resting {
  display: inline;
}

.cafe-pet.state-held .cr-held-bob {
  animation: cr-held-bob 2.6s ease-in-out infinite;
}

.cafe-pet.state-release .cr-held-bob {
  animation: cr-lower-to-floor .7s ease-in-out both;
}

.cafe-pet.state-release .cr-held {
  animation: cr-release-held .7s linear both;
}

.cafe-pet.state-release .cr-seated {
  animation: cr-release-seated .7s linear both;
}

.cafe-pet.state-held .cr-ground-shadow {
  transform-box: fill-box;
  transform-origin: center;
  transform: scale(.78);
  opacity: .08;
}

.cafe-pet.state-pat .cr-hand-pat {
  display: inline;
  animation: cr-pat-hand 1s ease-in-out infinite;
}

.cafe-pet.state-pat .cr-pat-body {
  transform-box: view-box;
  transform-origin: 50px 90px;
  animation: cr-pat-body 1s ease-in-out infinite;
}

.cafe-pet.state-pat .cr-pat-tail {
  animation: cr-pat-tail 1s ease-in-out infinite;
}

.cafe-pet.state-pat .cr-pat-lines {
  display: inline;
  animation: cr-pat-lines 1s ease-in-out infinite;
}

.cafe-pet.state-rest .cr-rest-breathe {
  animation-duration: 4.8s;
}

.cafe-pet.state-rest .cr-rest-tail {
  animation-duration: 7s;
}

.cafe-pet.state-decline .cr-seated-move {
  animation: cr-step-back .65s ease-out both;
}

.cafe-pet.state-decline .cr-face {
  transform: translateX(2px);
}

.cafe-pet.state-decline .cr-head {
  transform: rotate(7deg);
}

.cafe-pet.state-decline .cr-tail {
  animation: none;
  transform: rotate(-12deg);
}

@keyframes cr-breath {
  0%, 100% { transform: scaleY(1); }
  50% { transform: scaleY(1.017); }
}

@keyframes cr-tail {
  0%, 100% { transform: rotate(-5deg); }
  50% { transform: rotate(9deg); }
}

@keyframes cr-blink {
  0%, 43%, 46%, 82%, 85%, 100% { transform: scaleY(1); }
  44.5%, 83.5% { transform: scaleY(.12); }
}

@keyframes cr-nuzzle {
  0%, 100% { transform: rotate(-2deg) translateY(-1px); }
  50% { transform: rotate(3deg) translateY(-2px); }
}

@keyframes cr-pet-hand {
  0%, 100% { transform: translate(-1.5px, 0); }
  50% { transform: translate(1.5px, 0); }
}

@keyframes cr-purr {
  0%, 100% { opacity: .3; }
  50% { opacity: .85; }
}

@keyframes cr-chin-up {
  0%, 100% { transform: translateY(-4px) rotate(-2deg); }
  50% { transform: translateY(-6px) rotate(1deg); }
}

@keyframes cr-chin-hand {
  0%, 100% { transform: translate(-.5px, 0); }
  50% { transform: translate(.5px, -.6px); }
}

@keyframes cr-reach {
  0%, 100% { transform: rotate(-2deg) translateY(1px); }
  50% { transform: rotate(2deg) translateY(-3px); }
}

@keyframes cr-held-bob {
  0%, 100% { transform: translateY(-4px); }
  50% { transform: translateY(-7px); }
}

@keyframes cr-lower-to-floor {
  0% { transform: translateY(-5px); }
  75%, 100% { transform: translateY(4px); }
}

@keyframes cr-release-held {
  0%, 65% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes cr-release-seated {
  0%, 65% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes cr-pat-hand {
  0%, 100% { transform: translateY(-2px); }
  42%, 58% { transform: translateY(0); }
}

@keyframes cr-pat-body {
  0%, 100% { transform: scaleY(1); }
  48%, 58% { transform: scaleY(.985); }
}

@keyframes cr-pat-tail {
  0%, 100% { transform: rotate(-3deg); }
  50% { transform: rotate(10deg); }
}

@keyframes cr-pat-lines {
  0%, 25%, 75%, 100% { opacity: 0; }
  45%, 55% { opacity: .8; }
}

@keyframes cr-step-back {
  0% { transform: translate(0, 0); }
  50% { transform: translate(5px, -2px); }
  100% { transform: translate(8px, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .cafe-pet .cafe-pet-art * {
    animation: none !important;
    transition: none !important;
  }

  .cafe-pet.state-head .cr-head { transform: rotate(3deg) translateY(-2px); }
  .cafe-pet.state-head .cr-hand-head { transform: translateX(1.5px); }
  .cafe-pet.state-chin .cr-head { transform: translateY(-5px) rotate(-2deg); }
  .cafe-pet.state-chin .cr-hand-chin { transform: translateY(-.3px); }
  .cafe-pet.state-held .cr-held-bob { transform: translateY(-5px); }
  .cafe-pet.state-release .cr-held { display: none; }
  .cafe-pet.state-release .cr-seated { opacity: 1; }
  .cafe-pet.state-pat .cr-hand-pat { transform: translateY(0); }
  .cafe-pet.state-pat .cr-pat-lines { opacity: .5; }
  .cafe-pet.state-decline .cr-seated-move { transform: translateX(8px); }
}