/* Motion lives on the body wrapper; the original coat/model and mood survive. */
.chao-avatar[data-action] .chao-art {
  transform-origin: 50% 85%;
  animation: var(--action-name, chao-greet) 800ms ease-in-out infinite;
  animation-delay: var(--action-offset, 0ms);
}
.chao-avatar[data-action="pet"] .chao-art { animation-name: var(--action-name, chao-pet); animation-duration: 1050ms; }
.chao-avatar[data-action="feed"] .chao-art { animation-name: var(--action-name, chao-nibble); animation-duration: 600ms; }
.chao-avatar[data-action="play"] .chao-art,
.chao-avatar[data-action="stroll"] .chao-art { animation-name: var(--action-name, chao-stroll); animation-duration: 2600ms; }
.chao-avatar[data-action="rest"] .chao-art { animation-name: var(--action-name, chao-breathe); animation-duration: 2000ms; }
.chao-avatar[data-action="dance"] .chao-art { animation-name: var(--action-name, chao-pet); animation-duration: 600ms; }
.chao-avatar[data-action="look"] .chao-art { animation-name: var(--action-name, chao-look); animation-duration: 1800ms; }
.chao-avatar[data-action="stretch"] .chao-art { animation-name: var(--action-name, chao-stretch); animation-duration: 1800ms; }
.chao-action-prop {
  position: absolute; z-index: 2; pointer-events: none; left: 18%; top: 25%;
  font: 900 max(14px, calc(var(--chao-size) * .19))/1 sans-serif;
  color: #df4775; text-shadow: 0 1px 2px #fff;
  animation: chao-hearts 1400ms ease-out infinite;
  animation-delay: var(--action-offset, 0ms);
}
[data-action="feed"] .chao-action-prop {
  left: 43%; top: 65%; color: #cb8e3c;
  animation-name: chao-chow; animation-duration: 1200ms;
}
[data-action="play"] .chao-action-prop {
  left: 48%; top: 78%; color: #5eacdf;
  animation-name: chao-ball; animation-duration: 1300ms;
}
[data-action="rest"] .chao-action-prop { color: #7194cc; left: 20%; top: 30%; animation-duration: 2000ms; }
[data-action="dance"] .chao-action-prop,
[data-action="greet"] .chao-action-prop { color: #9680dc; }
@keyframes chao-pet { 0%,100% { transform: rotate(-6deg) scale(1,.96); } 50% { transform: rotate(6deg) scale(1.03,1); } }
@keyframes chao-nibble { 0%,100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(3%) rotate(3deg) scale(1.03,.96); } }
@keyframes chao-stroll { 0%,100% { transform: translateX(-9%) rotate(-4deg); } 25%,75% { transform: translateY(-5%); } 50% { transform: translateX(9%) rotate(4deg); } }
@keyframes chao-breathe { 0%,100% { transform: translateY(4%) scale(1,.94); } 50% { transform: translateY(2%) scale(1.025,.98); } }
@keyframes chao-greet { 0%,100% { transform: translateY(0); } 35% { transform: translateY(-9%) rotate(-5deg); } 65% { transform: translateY(-4%) rotate(5deg); } }
@keyframes chao-look { 0%,100% { transform: rotate(0); } 30% { transform: rotate(-7deg); } 70% { transform: rotate(7deg); } }
@keyframes chao-stretch { 0%,100% { transform: scale(1); } 50% { transform: scale(.95,1.08) translateY(-3%); } }
@keyframes chao-hearts { 0% { opacity: 0; transform: translateY(5px) scale(.7); } 30% { opacity: 1; } 100% { opacity: 0; transform: translateY(-20px) scale(1.1); } }
@keyframes chao-chow { 0%,100% { transform: scale(1); } 50% { transform: translateY(-25%) scale(.82); } }
@keyframes chao-ball { 0%,100% { transform: translateX(-100%) rotate(-30deg); } 50% { transform: translateX(100%) translateY(-70%) rotate(60deg); } }
@media (prefers-reduced-motion: reduce) {
  .chao-avatar[data-action] .chao-art, .chao-action-prop { animation: none; }
  .chao-action-prop { display: none; }
}