/* Night supervisor — shared SVG + idle loops (design.md).
 * Positioning is per-page (auth.css / desk.css). Idle life, not UI.
 */

.cat {
  display: block;
  stroke: currentColor;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}

.cat text {
  font-family: var(--font-mono);
  fill: currentColor;
  stroke: none;
}

.cat-tail {
  transform-box: fill-box;
  transform-origin: 0% 100%;
  animation: cat-tail-flick 6.5s ease-in-out infinite;
}

.cat-sleep .cat-tail {
  animation: none;
}

@keyframes cat-tail-flick {
  0%, 70%, 100% { transform: rotate(0deg); }
  75% { transform: rotate(7deg); }
  80% { transform: rotate(-5deg); }
  86% { transform: rotate(3deg); }
  92% { transform: rotate(-1deg); }
}

.cat-eye,
.cat-eyes {
  transform-box: fill-box;
  transform-origin: center;
  animation: cat-blink 5.4s ease-in-out infinite;
}

@keyframes cat-blink {
  0%, 91%, 100% { transform: scaleY(1); }
  94% { transform: scaleY(0.06); }
  97% { transform: scaleY(1); }
}

.cat-ear-r {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  animation: cat-ear-twitch 7.5s ease-in-out infinite;
}

@keyframes cat-ear-twitch {
  0%, 84%, 100% { transform: rotate(0deg); }
  87% { transform: rotate(-9deg); }
  90% { transform: rotate(4deg); }
  93% { transform: rotate(0deg); }
}

.cat-face {
  animation: cat-glance 9s ease-in-out infinite;
}

@keyframes cat-glance {
  0%, 100% { transform: translateX(0); }
  30% { transform: translateX(-2.5px); }
  60% { transform: translateX(2.5px); }
}

.cat-sleep .cat-body {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  animation: cat-breathe 3.8s ease-in-out infinite;
}

@keyframes cat-breathe {
  0%, 100% { transform: scale(1, 1); }
  50% { transform: scale(1.02, 1.045); }
}

.cat-z {
  font-size: 13px;
  opacity: 0;
  animation: cat-z-float 3.4s ease-out infinite;
}

.cat-z:nth-child(2) { animation-delay: 1.1s; font-size: 16px; }
.cat-z:nth-child(3) { animation-delay: 2.2s; font-size: 20px; }

@keyframes cat-z-float {
  0% { opacity: 0; transform: translateY(5px); }
  25% { opacity: 0.9; }
  100% { opacity: 0; transform: translateY(-13px); }
}

@media (prefers-reduced-motion: reduce) {
  .cat-tail,
  .cat-eye,
  .cat-eyes,
  .cat-ear-r,
  .cat-face,
  .cat-sleep .cat-body,
  .cat-z {
    animation: none;
  }
  .cat-z { opacity: 0; }
}