/* Pet motion — unique choreography per action + lineage idle language */

.tg-pet {
  /* Positioning is owned by tmigochi.css (.tg-pet { position:absolute; inset:0 }).
     This file previously re-declared `position: relative` at equal specificity
     and loads later, so it won all ties — which dropped `inset` and left the pet
     as a normal block at the TOP of the stage while the aura stayed centred, so
     the pet never stood on the floor. This file owns motion only. */
  transform-origin: 50% 72%;
  animation: tg-idle 3.2s ease-in-out infinite;
  will-change: transform, filter;
  touch-action: none;
  cursor: grab;
  user-select: none;
}

.tg-pet[data-anim="idle"] {
  animation-name: tg-idle;
  animation-duration: 3.2s;
  animation-iteration-count: infinite;
}

/*
 * Action choreographies — Readable Clarity pass (v1.60)
 * Pose-to-pose: anticipate → HOLD accent → impact → follow-through settle.
 * Longer held silhouettes = clearer “what just happened”.
 */
.tg-pet[data-anim="feed"] {
  animation: tg-anim-feed 1.65s cubic-bezier(0.33, 0.12, 0.2, 1) both;
}

.tg-pet[data-anim="play"] {
  animation: tg-anim-play 1.55s cubic-bezier(0.28, 0.15, 0.2, 1) both;
}

.tg-pet[data-anim="sleep"] {
  animation: tg-anim-sleep 2.15s cubic-bezier(0.33, 0.08, 0.2, 1) both;
}

.tg-pet[data-anim="sleep_loop"] {
  animation: tg-anim-sleep-loop 3.2s ease-in-out infinite;
  filter: brightness(0.86) saturate(0.9);
}

.tg-pet[data-anim="wake"] {
  animation: tg-anim-wake 1.95s cubic-bezier(0.28, 0.12, 0.22, 1) both;
}

.tg-pet[data-anim="wake_early"] {
  animation: tg-anim-wake-early 1.7s cubic-bezier(0.32, 0.1, 0.2, 1) both;
}

.tg-pet[data-anim="wash"] {
  animation: tg-anim-wash 1.7s cubic-bezier(0.3, 0.12, 0.2, 1) both;
}

.tg-pet[data-anim="teach"] {
  animation: tg-anim-teach 1.7s cubic-bezier(0.28, 0.14, 0.22, 1) both;
}

.tg-pet[data-anim="work"] {
  animation: tg-anim-work 1.6s cubic-bezier(0.28, 0.12, 0.2, 1) both;
}

.tg-pet[data-anim="dance"] {
  animation: tg-anim-dance 1.85s cubic-bezier(0.25, 0.12, 0.18, 1) both;
}

.tg-pet[data-anim="discipline"] {
  animation: tg-anim-discipline 1.35s cubic-bezier(0.3, 0.1, 0.2, 1) both;
}

/* Staging: lift pet above stage clutter while an action plays (no filter — keyframes own it) */
.tg-pet[data-anim]:not([data-anim="idle"]) {
  z-index: 2;
}

.tg-pet[data-anim="use"] {
  animation: tg-anim-sparkle 1.2s ease both;
}

.tg-pet[data-anim="hatch"] {
  animation: tg-anim-hatch 1.55s cubic-bezier(0.18, 0.9, 0.2, 1) both;
}

.tg-pet[data-anim="buy"],
.tg-pet[data-anim="equip"] {
  animation: tg-anim-sparkle 1.05s ease both;
}

.tg-pet[data-fx="snack"] {
  filter: saturate(1.15) brightness(1.04);
}

.tg-pet[data-fx="rare_meal"] .tg-layer--aura,
.tg-pet[data-fx="tonic"] .tg-layer--aura {
  filter: drop-shadow(0 0 22px rgba(200, 245, 66, 0.55));
}

.tg-pet[data-fx="arcade"] {
  animation: tg-anim-play 1.35s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet[data-anim="place"] {
  animation: tg-anim-place 0.95s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet[data-anim="quest"] {
  animation: tg-anim-quest 1.15s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet[data-anim="event"] {
  animation: tg-anim-event 1.3s ease both;
}

/* ---- Direct gestures (Nintendogs/Petz) — squash/stretch juice ---- */
.tg-pet[data-anim="pet"] {
  animation: tg-anim-pet 1.15s cubic-bezier(0.22, 0.9, 0.28, 1) both;
}

.tg-pet[data-anim="tickle"] {
  animation: tg-anim-tickle 1.25s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet[data-anim="nuzzle"] {
  animation: tg-anim-nuzzle 1.45s ease-in-out both;
}

.tg-pet[data-anim="wave"] {
  animation: tg-anim-wave 1.05s cubic-bezier(0.25, 0.8, 0.25, 1) both;
}

.tg-pet[data-anim="cheer"] {
  animation: tg-anim-cheer 1.55s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet[data-anim="idle_soft"] {
  animation: tg-idle-soft 0.85s ease both;
}

.tg-pet[data-anim="idle_look"] {
  animation: tg-idle-look 0.9s ease both;
}

.tg-pet[data-anim="idle_yawn"] {
  animation: tg-idle-yawn 1.05s ease both;
}

.tg-pet[data-anim="idle_spark"] {
  animation: tg-idle-spark 0.95s ease both;
}

.tg-pet[data-anim="idle_bounce"] {
  animation: tg-idle-bounce 0.9s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet[data-anim="idle_stretch"] {
  animation: tg-idle-stretch 1.15s cubic-bezier(0.22, 0.9, 0.28, 1) both;
}

.tg-pet[data-anim="idle_wiggle"] {
  animation: tg-idle-wiggle 0.95s ease both;
}

.tg-pet[data-anim="idle_preen"] {
  animation: tg-idle-preen 1.1s ease both;
}

.tg-pet[data-anim="idle_spin"] {
  animation: tg-idle-spin 1.05s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-pet.is-touching {
  cursor: grabbing;
  filter: brightness(1.08) saturate(1.1);
  transform: scale(0.97, 1.03);
  transition: transform 0.12s ease, filter 0.15s ease;
}

.tg-pet.is-stroking {
  animation: tg-stroke-sway 0.5s ease-in-out infinite;
}

.tg-pet[data-zone="head"][data-anim="pet"] .tg-layer--hat,
.tg-pet[data-zone="head"][data-anim="pet"] .tg-layer--face,
.tg-pet[data-zone="head"][data-anim="pet"] .tg-slot--hat,
.tg-pet[data-zone="head"][data-anim="pet"] .tg-slot--face,
.tg-pet[data-zone="head"].is-touching .tg-layer--face,
.tg-pet[data-zone="head"].is-touching .tg-slot--face {
  filter: drop-shadow(0 0 14px rgba(253, 164, 175, 0.55));
}

.tg-pet[data-zone="held"][data-anim="tickle"] .tg-layer--held,
.tg-pet[data-zone="held"][data-anim="cheer"] .tg-layer--held,
.tg-pet[data-zone="held"][data-anim="pet"] .tg-layer--held,
.tg-pet[data-zone="held"] .tg-slot--held {
  filter: drop-shadow(0 0 12px rgba(200, 245, 66, 0.45));
}

.tg-pet[data-zone="body"][data-anim="pet"] {
  filter: drop-shadow(0 0 10px rgba(253, 164, 175, 0.28));
}

/* Hold-to-nuzzle progress (anticipation without input lag on fire). */
.tg-hold-ring {
  position: absolute;
  left: 50%;
  top: 42%;
  z-index: 6;
  width: 4.2rem;
  height: 4.2rem;
  margin: -2.1rem 0 0 -2.1rem;
  border-radius: 50%;
  pointer-events: none;
  background: conic-gradient(
    from -90deg,
    rgba(167, 139, 250, 0.95) calc(var(--hold, 0) * 1turn),
    rgba(148, 163, 184, 0.18) 0
  );
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 calc(100% - 3px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 4px), #000 calc(100% - 3px));
  opacity: 0;
  transform: scale(0.85);
}

.tg-hold-ring.is-charging {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.12s ease, transform 0.15s ease;
}

.tg-hold-ring.is-complete {
  filter: drop-shadow(0 0 10px rgba(167, 139, 250, 0.65));
  transform: scale(1.08);
}

/* Mood tints */
.tg-pet[data-mood="sad"] {
  filter: saturate(0.72) brightness(0.92);
}

.tg-pet[data-mood="joyful"] .tg-layer--aura {
  filter: drop-shadow(0 0 18px rgba(200, 245, 66, 0.4));
}

.tg-pet[data-mood="sleepy"][data-anim="idle"] {
  animation: tg-idle-sleepy 2.8s ease-in-out infinite;
}

/* Lineage presence */
.tg-pet[data-lineage="cosmos"] .tg-layer--body,
.tg-pet[data-lineage="cosmos"] .tg-rig {
  filter: drop-shadow(0 0 16px rgba(165, 180, 252, 0.45));
}

.tg-pet[data-lineage="cosmos"][data-mood="joyful"] .tg-layer--aura {
  filter: drop-shadow(0 0 22px rgba(253, 230, 138, 0.45));
  animation: tg-aura-spin 6s linear infinite;
}

.tg-pet[data-lineage="ocean"] .tg-layer--body,
.tg-pet[data-lineage="ocean"] .tg-rig {
  filter: drop-shadow(0 8px 18px rgba(45, 212, 191, 0.35));
}

.tg-pet[data-lineage="ocean"][data-anim="idle"] {
  animation: tg-idle-float 3.6s ease-in-out infinite;
}

.tg-pet[data-lineage="forest"] .tg-layer--body,
.tg-pet[data-lineage="forest"] .tg-rig {
  filter: drop-shadow(0 10px 14px rgba(34, 197, 94, 0.28));
}

.tg-pet[data-lineage="forest"][data-mood="joyful"] .tg-layer--body,
.tg-pet[data-lineage="forest"][data-mood="joyful"] .tg-rig {
  filter: drop-shadow(0 0 14px rgba(134, 239, 172, 0.5));
}

.tg-pet[data-lineage="ember"] .tg-layer--body,
.tg-pet[data-lineage="ember"] .tg-rig {
  filter: drop-shadow(0 0 14px rgba(251, 146, 60, 0.42));
}

.tg-pet[data-lineage="ember"][data-anim="idle"] {
  animation: tg-idle-ember 3s ease-in-out infinite;
}

.tg-pet[data-lineage="cyber"] .tg-layer--body,
.tg-pet[data-lineage="cyber"] .tg-rig {
  filter: drop-shadow(0 0 12px rgba(200, 245, 66, 0.4));
}

.tg-pet[data-lineage="cyber"][data-mood="joyful"][data-anim="idle"] .tg-layer--body,
.tg-pet[data-lineage="cyber"][data-mood="joyful"][data-anim="idle"] .tg-rig {
  animation: tg-cyber-pulse 1.6s ease-in-out infinite;
}

/* Legacy full-body scale (egg / fallback). Rig growth uses --tg-growth. */
.tg-pet:not(.tg-pet--rig)[data-stage="hatchling"] { --tg-pet-scale: 0.92; }
.tg-pet:not(.tg-pet--rig)[data-stage="juvenile"] { --tg-pet-scale: 1; }
.tg-pet:not(.tg-pet--rig)[data-stage="adult"] { --tg-pet-scale: 1.06; }

.tg-pet:not(.tg-pet--rig)[data-stage] .tg-layer--body {
  transform: scale(var(--tg-pet-scale, 1));
  transform-origin: 50% 80%;
}

/* Held item wobble during play/dance */
.tg-pet[data-anim="play"] .tg-layer--held,
.tg-pet[data-anim="dance"] .tg-layer--held,
.tg-pet[data-anim="play"] .tg-slot--held,
.tg-pet[data-anim="dance"] .tg-slot--held {
  animation: tg-held-wiggle 0.55s ease-in-out infinite;
}

.tg-pet[data-anim="feed"] .tg-layer--held,
.tg-pet[data-anim="feed"] .tg-slot--held {
  animation: tg-held-nibble 0.35s ease-in-out 3;
}

.tg-layer--held.is-prop-hidden {
  opacity: 0;
  transition: opacity 0.2s ease;
}

.tg-layer--prop {
  position: absolute;
  inset: 18% 22% auto;
  z-index: 8;
  display: grid;
  place-items: center;
  pointer-events: none;
  transform-origin: 50% 80%;
}

.tg-layer--prop[hidden] {
  display: none !important;
}

.tg-layer--prop.is-active {
  animation: tg-prop-pop 1.35s cubic-bezier(0.2, 0.85, 0.25, 1) both;
}

.tg-layer--prop img {
  width: min(42%, 7.5rem);
  height: auto;
  filter: drop-shadow(0 10px 18px rgba(0, 0, 0, 0.35));
}

@keyframes tg-prop-pop {
  0% { opacity: 0; transform: translateY(28px) scale(0.4) rotate(-12deg); }
  28% { opacity: 1; transform: translateY(-6px) scale(1.08) rotate(4deg); }
  55% { transform: translateY(0) scale(1) rotate(-2deg); }
  78% { opacity: 1; transform: translateY(-4px) scale(1.04) rotate(2deg); }
  100% { opacity: 0; transform: translateY(18px) scale(0.7) rotate(8deg); }
}

@media (prefers-reduced-motion: reduce) {
  .tg-layer--prop.is-active { animation: none; opacity: 1; }
}

/* ---- Idle ---- */
@keyframes tg-idle {
  0%, 100% { transform: translateY(0) scale(1) rotate(0deg); }
  35% { transform: translateY(-7px) scale(1.012, 0.995) rotate(-0.6deg); }
  70% { transform: translateY(-10px) scale(1.018, 0.992) rotate(0.6deg); }
}

@keyframes tg-idle-float {
  0%, 100% { transform: translateY(0) rotate(-1.2deg) scale(1); }
  50% { transform: translateY(-14px) rotate(1.4deg) scale(1.02); }
}

@keyframes tg-idle-ember {
  0%, 100% { transform: translateY(0) scale(1); }
  30% { transform: translateY(-5px) scale(1.015); }
  55% { transform: translateY(-11px) scale(1.01); }
  80% { transform: translateY(-4px) scale(1.02); }
}

@keyframes tg-idle-sleepy {
  0%, 100% { transform: translateY(8px) scale(0.985); filter: brightness(0.9); }
  50% { transform: translateY(12px) scale(0.975); filter: brightness(0.84); }
}

@keyframes tg-cyber-pulse {
  0%, 100% { filter: drop-shadow(0 0 10px rgba(200, 245, 66, 0.35)); }
  50% { filter: drop-shadow(0 0 22px rgba(45, 212, 191, 0.65)); }
}

/* Feed: lean HOLD → nibble → happy settle (readable “eating”) */
@keyframes tg-anim-feed {
  0% { transform: translate(0, 0) scale(1, 1) rotate(0); }
  8% { transform: translate(0, 5px) scale(1.08, 0.9) rotate(2deg); }
  18% { transform: translate(14px, 8px) scale(0.96, 1.04) rotate(8deg); }
  28%, 38% { transform: translate(16px, 6px) scale(0.95, 1.05) rotate(9deg); } /* HOLD lean */
  48% { transform: translate(10px, 2px) scale(1.06, 0.94) rotate(3deg); }
  58% { transform: translate(6px, 8px) scale(0.97, 1.06) rotate(0); } /* nibble squash */
  70% { transform: translate(0, -18px) scale(1.1, 0.92) rotate(-4deg); filter: brightness(1.1); }
  78%, 86% { transform: translate(0, -14px) scale(1.08, 0.94) rotate(-3deg); filter: brightness(1.08); } /* HOLD joy */
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); filter: brightness(1); }
}

/* Play: crouch → clear hop arc → land settle */
@keyframes tg-anim-play {
  0% { transform: translate(0, 0) scale(1, 1) rotate(0); }
  10% { transform: translate(0, 8px) scale(1.12, 0.86) rotate(-3deg); } /* anticipate */
  18%, 24% { transform: translate(0, 8px) scale(1.12, 0.86) rotate(-3deg); } /* HOLD crouch */
  36% { transform: translate(-22px, -22px) rotate(-14deg) scale(0.94, 1.1); }
  48% { transform: translate(20px, -30px) rotate(16deg) scale(1.1, 0.9); }
  58%, 64% { transform: translate(18px, -28px) rotate(14deg) scale(1.08, 0.92); } /* HOLD apex */
  76% { transform: translate(-8px, 6px) scale(1.1, 0.88) rotate(-4deg); } /* land squash */
  88% { transform: translate(4px, -6px) scale(0.98, 1.04) rotate(2deg); }
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); }
}

/* Sleep: yawn stretch → sink HOLD → dim nest */
@keyframes tg-anim-sleep {
  0% { transform: translateY(0) scale(1, 1) rotate(0); filter: brightness(1); }
  10% { transform: translateY(-12px) scale(1.08, 0.92) rotate(-3deg); filter: brightness(1.06); }
  18%, 26% { transform: translateY(-10px) scale(1.06, 0.94) rotate(-2deg); filter: brightness(1.04); }
  40% { transform: translateY(10px) scale(0.92, 1.1) rotate(4deg); filter: brightness(0.92); }
  55%, 68% { transform: translateY(18px) scale(1.05, 0.9) rotate(-5deg); filter: brightness(0.84); } /* HOLD nest */
  85% { transform: translateY(14px) scale(0.97, 1.02) rotate(1deg); filter: brightness(0.8); }
  100% { transform: translateY(12px) scale(0.97, 1.01) rotate(-1.5deg); filter: brightness(0.78); }
}

@keyframes tg-anim-sleep-loop {
  0%, 100% { transform: translateY(12px) scale(0.97, 1.02) rotate(-2deg); filter: brightness(0.78); }
  50% { transform: translateY(15px) scale(0.95, 1.05) rotate(1.5deg); filter: brightness(0.74); }
}

/* Wake: stretch HOLD → bright pop → settle */
@keyframes tg-anim-wake {
  0% { transform: translateY(12px) scale(0.96, 1.03) rotate(-2deg); filter: brightness(0.78); }
  14% { transform: translateY(18px) scale(1.12, 0.86) rotate(0); filter: brightness(0.88); }
  22%, 30% { transform: translateY(16px) scale(1.1, 0.88) rotate(0); filter: brightness(0.92); }
  44% { transform: translateY(-18px) scale(0.9, 1.14) rotate(5deg); filter: brightness(1.18); }
  54%, 62% { transform: translateY(-14px) scale(0.94, 1.1) rotate(3deg); filter: brightness(1.14); } /* HOLD stretch */
  78% { transform: translateY(4px) scale(1.08, 0.92) rotate(-2deg); filter: brightness(1.06); }
  100% { transform: translateY(0) scale(1) rotate(0); filter: brightness(1); }
}

/* Early wake: snap upright HOLD → upset shake */
@keyframes tg-anim-wake-early {
  0% { transform: translateY(12px) scale(0.97, 1.02) rotate(-1deg); filter: brightness(0.8); }
  8% { transform: translateY(-6px) scale(1.14, 0.84) rotate(0); filter: brightness(1.1); }
  14%, 20% { transform: translateY(-4px) scale(1.1, 0.88) rotate(0); filter: brightness(1.08); } /* HOLD shock */
  32% { transform: translate(-16px, 2px) scale(0.9, 1.14) rotate(-10deg); }
  44% { transform: translate(18px, -2px) scale(1.1, 0.9) rotate(12deg); }
  56% { transform: translate(-12px, 4px) scale(0.94, 1.1) rotate(-8deg); }
  70% { transform: translate(8px, -2px) scale(1.04, 0.96) rotate(5deg); }
  85% { transform: translate(-3px, 2px) scale(0.98, 1.02) rotate(-2deg); filter: brightness(0.95); }
  100% { transform: translateY(0) scale(1) rotate(0); filter: brightness(1); }
}

/* Wash: splash left/right HOLD → spin dry → settle */
@keyframes tg-anim-wash {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  8% { transform: translate(-14px, -4px) rotate(-10deg) scale(1.04, 0.96); }
  14%, 20% { transform: translate(-14px, -4px) rotate(-10deg) scale(1.04, 0.96); }
  28% { transform: translate(16px, -2px) rotate(12deg) scale(1.05, 0.95); }
  34%, 40% { transform: translate(16px, -2px) rotate(12deg) scale(1.05, 0.95); }
  52% { transform: translate(-4px, -18px) rotate(-200deg) scale(1.08, 0.94); }
  68% { transform: translate(2px, -8px) rotate(-360deg) scale(1.04, 0.98); }
  82% { transform: translate(0, 4px) rotate(-360deg) scale(1.06, 0.92); }
  100% { transform: translate(0, 0) rotate(-360deg) scale(1, 1); }
}

/* Teach: think HOLD → insight pop HOLD → nod settle */
@keyframes tg-anim-teach {
  0% { transform: translateY(0) rotate(0) scale(1, 1); }
  12% { transform: translateY(8px) rotate(-10deg) scale(0.96, 1.04); }
  22%, 34% { transform: translateY(8px) rotate(-10deg) scale(0.96, 1.04); } /* HOLD think */
  46% { transform: translateY(4px) rotate(4deg) scale(1); }
  58% { transform: translateY(-22px) rotate(0) scale(1.12, 0.9); filter: brightness(1.16); }
  66%, 76% { transform: translateY(-18px) scale(1.1, 0.92); filter: brightness(1.12); } /* HOLD insight */
  90% { transform: translateY(3px) scale(0.98, 1.02); filter: brightness(1); }
  100% { transform: translateY(0) scale(1); filter: brightness(1); }
}

/* Work: wind-up HOLD → strike → follow-through */
@keyframes tg-anim-work {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  12% { transform: translate(0, -12px) rotate(-10deg) scale(1.04, 0.96); }
  20%, 28% { transform: translate(0, -12px) rotate(-10deg) scale(1.04, 0.96); } /* HOLD raise */
  38% { transform: translate(0, 12px) rotate(6deg) scale(0.92, 1.12); } /* strike */
  48% { transform: translate(0, -8px) rotate(-6deg) scale(1.04, 0.96); }
  58% { transform: translate(0, 10px) rotate(5deg) scale(0.94, 1.1); }
  72% { transform: translate(0, -14px) rotate(-4deg) scale(1.08, 0.94); }
  86% { transform: translate(0, 3px) scale(0.99, 1.01); }
  100% { transform: translate(0, 0) scale(1, 1); }
}

/* Dance: beat accents with held peak poses */
@keyframes tg-anim-dance {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  8% { transform: translate(0, 6px) scale(1.12, 0.86) rotate(-4deg); }
  16% { transform: translate(-18px, -18px) rotate(-18deg) scale(0.94, 1.1); }
  22%, 28% { transform: translate(-16px, -16px) rotate(-16deg) scale(0.96, 1.08); }
  38% { transform: translate(20px, -10px) rotate(16deg) scale(1.08, 0.94); }
  48% { transform: translate(-10px, -32px) rotate(-8deg) scale(1.12, 0.88); }
  54%, 60% { transform: translate(0, -34px) rotate(0) scale(1.14, 0.88); filter: brightness(1.12); }
  72% { transform: translate(16px, -8px) scale(1.1, 0.9) rotate(12deg); }
  86% { transform: translate(-8px, 4px) scale(1.06, 0.94) rotate(-6deg); }
  100% { transform: translate(0, 0) rotate(0) scale(1, 1); filter: brightness(1); }
}

/* Discipline: stamp HOLD — unambiguous “scold” silhouette */
@keyframes tg-anim-discipline {
  0% { transform: translateY(0) scale(1, 1) rotate(0); }
  14% { transform: translateY(-10px) scale(1.06, 0.94) rotate(-5deg); }
  22%, 30% { transform: translateY(-8px) scale(1.05, 0.95) rotate(-4deg); }
  42% { transform: translateY(14px) scale(0.9, 1.14) rotate(4deg); } /* stamp */
  50%, 60% { transform: translateY(12px) scale(0.92, 1.1) rotate(3deg); } /* HOLD firm */
  78% { transform: translateY(-4px) scale(1.04, 0.96) rotate(-2deg); }
  100% { transform: translateY(0) scale(1, 1) rotate(0); }
}

@keyframes tg-anim-hatch {
  0% { transform: scale(0.12) rotate(-22deg); opacity: 0; filter: brightness(1.5); }
  22% { transform: scale(1.16) rotate(8deg); opacity: 1; filter: brightness(1.3); }
  32%, 40% { transform: scale(1.1) rotate(4deg); filter: brightness(1.18); }
  55% { transform: scale(0.94) rotate(-5deg); filter: brightness(1.05); }
  72% { transform: scale(1.08) rotate(3deg) translateY(-10px); }
  100% { transform: scale(1) rotate(0) translateY(0); opacity: 1; filter: brightness(1); }
}

@keyframes tg-anim-sparkle {
  0% { transform: scale(1) rotate(0); filter: brightness(1); }
  22% { transform: scale(1.1) rotate(-4deg); filter: brightness(1.22); }
  38%, 48% { transform: scale(1.08) rotate(-2deg); filter: brightness(1.16); }
  70% { transform: scale(0.97) rotate(3deg); filter: brightness(1.05); }
  100% { transform: scale(1) rotate(0); filter: brightness(1); }
}

@keyframes tg-anim-place {
  0% { transform: translateY(0) scale(1, 1); }
  28% { transform: translateY(-18px) scale(1.08, 0.94); }
  40%, 50% { transform: translateY(-16px) scale(1.06, 0.96); }
  72% { transform: translateY(5px) scale(0.96, 1.06); }
  100% { transform: translateY(0) scale(1, 1); }
}

@keyframes tg-anim-quest {
  0% { transform: translateY(0) scale(1, 1) rotate(0); }
  20% { transform: translateY(-24px) scale(1.14, 0.9) rotate(-5deg); filter: brightness(1.22); }
  32%, 44% { transform: translateY(-20px) scale(1.1, 0.92) rotate(-3deg); filter: brightness(1.16); }
  62% { transform: translateY(-6px) scale(1.04) rotate(4deg); }
  80% { transform: translateY(-12px) scale(1.08); }
  100% { transform: translateY(0) scale(1); filter: brightness(1); }
}

@keyframes tg-anim-event {
  0% { transform: scale(1); filter: brightness(1) hue-rotate(0deg); }
  28% { transform: scale(1.1) translateY(-12px); filter: brightness(1.28) hue-rotate(28deg); }
  40%, 52% { transform: scale(1.08) translateY(-10px); filter: brightness(1.2) hue-rotate(18deg); }
  78% { transform: scale(1.02) translateY(-3px); filter: brightness(1.08) hue-rotate(-8deg); }
  100% { transform: scale(1); filter: brightness(1) hue-rotate(0deg); }
}

@keyframes tg-anim-pet {
  0% { transform: translate(0, 0) scale(1, 1) rotate(0); }
  10% { transform: translate(0, 6px) scale(1.1, 0.88) rotate(-2deg); }
  22% { transform: translate(-8px, -8px) scale(0.94, 1.1) rotate(-5deg); }
  34%, 44% { transform: translate(10px, -14px) scale(1.1, 0.92) rotate(6deg); } /* HOLD affection */
  62% { transform: translate(-2px, -18px) scale(1.12, 0.9) rotate(-2deg); }
  82% { transform: translate(0, 4px) scale(1.04, 0.96); }
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); }
}

@keyframes tg-anim-tickle {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  8% { transform: translate(0, 5px) scale(1.12, 0.86); }
  18% { transform: translate(-14px, -8px) rotate(-12deg) scale(0.94, 1.1); }
  28% { transform: translate(16px, -14px) rotate(14deg) scale(1.1, 0.9); }
  38%, 46% { transform: translate(-12px, -4px) rotate(-14deg) scale(0.94, 1.1); }
  58% { transform: translate(14px, -20px) rotate(12deg) scale(1.12, 0.88); }
  72% { transform: translate(-6px, 4px) scale(1.08, 0.9) rotate(-6deg); }
  88% { transform: translate(4px, -4px) rotate(4deg); }
  100% { transform: translate(0, 0) rotate(0) scale(1, 1); }
}

@keyframes tg-anim-nuzzle {
  0% { transform: translate(0, 0) scale(1, 1); filter: brightness(1); }
  12% { transform: translate(0, 5px) scale(1.08, 0.9); filter: brightness(1.03); }
  28% { transform: translate(12px, 14px) scale(0.93, 1.08) rotate(8deg); filter: brightness(0.94); }
  40%, 58% { transform: translate(16px, 18px) scale(0.9, 1.12) rotate(11deg); filter: brightness(0.88); } /* HOLD snuggle */
  78% { transform: translate(4px, 4px) scale(0.98, 1.02) rotate(2deg); filter: brightness(1.04); }
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); filter: brightness(1); }
}

@keyframes tg-anim-wave {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  12% { transform: translate(0, 4px) scale(1.1, 0.88); }
  24% { transform: translate(14px, -12px) rotate(16deg) scale(1.06, 0.96); }
  34%, 48% { transform: translate(14px, -12px) rotate(16deg) scale(1.06, 0.96); } /* HOLD wave */
  62% { transform: translate(6px, -4px) rotate(-6deg); }
  78% { transform: translate(18px, -16px) rotate(20deg) scale(1.1, 0.92); }
  100% { transform: translate(0, 0) rotate(0) scale(1, 1); }
}

@keyframes tg-anim-cheer {
  0% { transform: translate(0, 0) scale(1, 1) rotate(0); }
  10% { transform: translate(0, 7px) scale(1.14, 0.84); }
  22% { transform: translate(-16px, -22px) rotate(-18deg) scale(0.94, 1.12); }
  36% { transform: translate(18px, -14px) rotate(16deg) scale(1.1, 0.92); }
  48%, 58% { transform: translate(0, -36px) scale(1.16, 0.88); filter: brightness(1.2); } /* HOLD peak */
  72% { transform: translate(-12px, -8px) rotate(-12deg) scale(1.04, 0.96); }
  88% { transform: translate(10px, -12px) rotate(10deg) scale(1.08, 0.94); }
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); filter: brightness(1); }
}

@keyframes tg-stroke-sway {
  0%, 100% { transform: translate(-3px, 2px) rotate(-2deg) scale(1.01); }
  50% { transform: translate(4px, -3px) rotate(3deg) scale(1.03); }
}

@keyframes tg-idle-soft {
  0% { transform: translateY(0) scale(1, 1); }
  40%, 55% { transform: translateY(-8px) scale(1.03, 0.98); }
  100% { transform: translateY(0) scale(1, 1); }
}

@keyframes tg-idle-look {
  0% { transform: translateX(0) rotate(0); }
  28%, 42% { transform: translateX(10px) rotate(6deg); }
  68% { transform: translateX(-5px) rotate(-4deg); }
  100% { transform: translateX(0) rotate(0); }
}

@keyframes tg-idle-yawn {
  0% { transform: scale(1, 1) translateY(0); }
  30%, 48% { transform: scale(1.06, 0.94) translateY(5px); }
  70% { transform: scale(0.97, 1.04) translateY(-3px); }
  100% { transform: scale(1, 1) translateY(0); }
}

@keyframes tg-idle-spark {
  0% { transform: scale(1); filter: brightness(1); }
  35%, 50% { transform: scale(1.08); filter: brightness(1.22); }
  100% { transform: scale(1); filter: brightness(1); }
}

@keyframes tg-idle-bounce {
  0% { transform: translateY(0) scale(1, 1); }
  30% { transform: translateY(-16px) scale(1.06, 0.96); }
  42%, 52% { transform: translateY(-14px) scale(1.05, 0.97); }
  70% { transform: translateY(3px) scale(0.97, 1.05); }
  100% { transform: translateY(0) scale(1, 1); }
}

@keyframes tg-idle-stretch {
  0% { transform: scale(1, 1) translateY(0); }
  28%, 40% { transform: scale(1.06, 0.92) translateY(5px); }
  58% { transform: scale(0.94, 1.12) translateY(-12px); }
  100% { transform: scale(1, 1) translateY(0); }
}

@keyframes tg-idle-wiggle {
  0%, 100% { transform: rotate(0) translateX(0); }
  18% { transform: rotate(-8deg) translateX(-5px); }
  36% { transform: rotate(9deg) translateX(6px); }
  54% { transform: rotate(-5deg) translateX(-3px); }
  72% { transform: rotate(4deg) translateX(3px); }
}

@keyframes tg-idle-preen {
  0%, 100% { transform: rotate(0) scale(1); }
  32%, 48% { transform: rotate(-10deg) scale(1.04); }
  70% { transform: rotate(5deg) scale(1.02); }
}

@keyframes tg-idle-spin {
  0% { transform: rotate(0) scale(1); }
  35%, 48% { transform: rotate(22deg) scale(1.06); }
  72% { transform: rotate(-10deg) scale(1.02); }
  100% { transform: rotate(0) scale(1); }
}

@keyframes tg-held-wiggle {
  0%, 100% { transform: rotate(-6deg) translateY(0); }
  50% { transform: rotate(8deg) translateY(-4px); }
}

@keyframes tg-held-nibble {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(4px, 2px) scale(0.92); }
}

.tg-layer--aura img {
  width: min(100%, 560px);
  opacity: 0.9;
  animation: tg-aura 4s ease-in-out infinite;
}

@keyframes tg-aura {
  0%, 100% { opacity: 0.55; transform: scale(0.98); }
  50% { opacity: 0.95; transform: scale(1.03); }
}

@keyframes tg-aura-spin {
  0% { opacity: 0.6; transform: scale(0.98) rotate(0deg); }
  50% { opacity: 1; transform: scale(1.04) rotate(180deg); }
  100% { opacity: 0.6; transform: scale(0.98) rotate(360deg); }
}

/* Hatch eggs */
.tg-egg[data-lineage="cosmos"] { --egg-glow: rgba(165, 180, 252, 0.45); }
.tg-egg[data-lineage="ocean"] { --egg-glow: rgba(45, 212, 191, 0.45); }
.tg-egg[data-lineage="forest"] { --egg-glow: rgba(74, 222, 128, 0.4); }
.tg-egg[data-lineage="ember"] { --egg-glow: rgba(251, 146, 60, 0.45); }
.tg-egg[data-lineage="cyber"] { --egg-glow: rgba(200, 245, 66, 0.45); }

.tg-egg.is-selected {
  box-shadow: 0 0 0 2px var(--egg-glow, var(--tg-lime)), 0 12px 28px rgba(0, 0, 0, 0.35);
  animation: tg-egg-pulse 1.6s ease-in-out infinite;
}

.tg-egg:hover {
  transform: translateY(-3px);
  transition: transform 0.2s ease;
}

@keyframes tg-egg-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.03); }
}

@media (prefers-reduced-motion: reduce) {
  .tg-pet,
  .tg-pet[data-anim],
  .tg-layer--aura img,
  .tg-egg.is-selected {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}