/* ============================================================
   REALISTIC CAT — alive idle behavior
   ============================================================ */
.cat-stage {
  position: relative;
  width: 100%;
  max-width: 360px;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  user-select: none;
}
.cat-svg {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: visible;
}
.cat-shadow {
  position: absolute;
  bottom: 6%;
  left: 22%;
  right: 22%;
  height: 14px;
  background: transparent;
  filter: blur(4px);
  animation: catShadow 2.6s ease-in-out infinite;
}
@keyframes catShadow {
  0%, 100% { transform: scale(1, 1); opacity: 0.6; }
  50% { transform: scale(0.92, 0.85); opacity: 0.4; }
}

/* Body bobs gently */
.cat-body-group {
  transform-origin: 50% 90%;
  animation: catBreathe 2.6s ease-in-out infinite;
}
@keyframes catBreathe {
  0%, 100% { transform: translateY(0) scaleY(1); }
  50% { transform: translateY(-3px) scaleY(1.01); }
}

/* Head slight independent motion */
.cat-head {
  transform-origin: 50% 90%;
  transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Ears */
.cat-ear-l, .cat-ear-r {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.cat-ear-l.twitch { animation: earTwitch 0.5s ease-out; }
.cat-ear-r.twitch { animation: earTwitch 0.5s ease-out; }
@keyframes earTwitch {
  0%, 100% { transform: rotate(0); }
  30% { transform: rotate(-6deg); }
  60% { transform: rotate(2deg); }
}

/* Pupils */
.cat-pupil {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Eyelids — blink */
.cat-lid {
  transform-box: fill-box;
  transform-origin: 50% 0%;
  transform: scaleY(0);
  transition: transform 0.1s ease-out;
}
.cat-lid.blinking {
  transform: scaleY(1);
}

/* Tail wag */
.cat-tail {
  transform-box: fill-box;
  transform-origin: 12% 80%;
  animation: tailWag 3.2s ease-in-out infinite;
}
@keyframes tailWag {
  0%, 100% { transform: rotate(0) translateX(0); }
  25% { transform: rotate(8deg) translateX(2px); }
  50% { transform: rotate(0) translateX(0); }
  75% { transform: rotate(-6deg) translateX(-2px); }
}

/* Whiskers */
.cat-whisker {
  transform-box: fill-box;
  transform-origin: 100% 50%;
  animation: whiskerTwitch 5s ease-in-out infinite;
}
.cat-whisker.right { transform-origin: 0% 50%; }
@keyframes whiskerTwitch {
  0%, 92%, 100% { transform: rotate(0); }
  94% { transform: rotate(2deg); }
  96% { transform: rotate(-1deg); }
  98% { transform: rotate(1deg); }
}

/* Question bubble — appears when cat is "asking" */
.cat-bubble {
  position: absolute;
  top: 4%;
  right: -8%;
  background: var(--n-0);
  border: 2px solid var(--tory);
  border-radius: 18px 18px 4px 18px;
  padding: 10px 14px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--tory);
  font-weight: 600;
  box-shadow: 0 8px 24px rgba(11, 95, 165, 0.18);
  opacity: 0;
  transform: translateY(6px) scale(0.9);
  transition: opacity 0.4s, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
  white-space: nowrap;
  z-index: 5;
}
.cat-stage.asking .cat-bubble { opacity: 1; transform: translateY(0) scale(1); }