/*
 * Body Animation Library for SVG Characters
 *
 * Each animation is a CSS class applied to the active facing group.
 * Arms/legs rotate from their joint (0,0) via transform-origin.
 *
 * IMPORTANT: Base joint positions are set via CSS "translate" property
 * by EntityLayer.#convertLimbTransforms(). Keyframes specify ONLY
 * rotation + offset deltas in the "transform" property.
 * The CSS "translate" and "transform" properties compose independently,
 * so animations work regardless of each character's unique joint positions.
 *
 * Usage: entity.playBodyAnimation('wave', 2000);
 */

/* === Joint origin for all animated limbs === */
.arm-left, .arm-right, .leg-left, .leg-right,
.forearm-left, .forearm-right, .hand-left, .hand-right,
.shin-left, .shin-right {
  transform-origin: 0 0;
}

/* ─── GESTURES ─────────────────────────────────────────────── */

/* Wave — right arm raised high (head level), hand swings back and forth */
@keyframes anim-wave-arm {
  0%, 100% { transform: rotate(-120deg); }
  50%      { transform: rotate(-100deg); }
}
@keyframes anim-wave-forearm {
  0%, 100% { transform: rotate(-20deg); }
  50%      { transform: rotate(10deg); }
}
.wave .arm-right {
  animation: anim-wave-arm 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) 4;
}
.wave .forearm-right {
  animation: anim-wave-forearm 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) 4;
}

/* Point — right arm extends forward (rotate outward) */
@keyframes anim-point-arm {
  0%   { transform: rotate(0deg); }
  30%  { transform: rotate(-60deg); }
  100% { transform: rotate(-60deg); }
}
.point .arm-right {
  animation: anim-point-arm 0.5s ease-out forwards;
}

/* Shrug — both arms raise slightly, head tilts */
@keyframes anim-shrug-left {
  0%, 100% { transform: rotate(0deg); }
  30%, 70% { transform: translateY(-2px) rotate(15deg); }
}
@keyframes anim-shrug-right {
  0%, 100% { transform: rotate(0deg); }
  30%, 70% { transform: translateY(-2px) rotate(-15deg); }
}
.shrug .arm-left  { animation: anim-shrug-left 0.8s ease-in-out; }
.shrug .arm-right { animation: anim-shrug-right 0.8s ease-in-out; }

/* Bow — torso and head dip forward */
@keyframes anim-bow-skeleton {
  0%, 100% { transform: translateY(0); }
  30%, 70% { transform: translateY(3px); }
}
.bow .skeleton {
  animation: anim-bow-skeleton 1.2s ease-in-out;
}

/* Fist pump — right arm pumps upward */
@keyframes anim-fist-pump {
  0%   { transform: rotate(0deg); }
  40%  { transform: rotate(-90deg); }
  60%  { transform: rotate(-80deg); }
  80%  { transform: rotate(-95deg); }
  100% { transform: rotate(0deg); }
}
.fist-pump .arm-right {
  animation: anim-fist-pump 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Arms crossed — forearms fold across chest in U shape */
@keyframes anim-cross-left {
  0%   { transform: rotate(0deg); }
  40%, 100% { transform: rotate(-35deg); }
}
@keyframes anim-cross-right {
  0%   { transform: rotate(0deg); }
  40%, 100% { transform: rotate(35deg); }
}
@keyframes anim-cross-forearm-l {
  0%   { transform: rotate(0deg); }
  40%, 100% { transform: rotate(85deg); }
}
@keyframes anim-cross-forearm-r {
  0%   { transform: rotate(0deg); }
  40%, 100% { transform: rotate(-85deg); }
}
.arms-crossed .arm-left      { animation: anim-cross-left 0.5s ease-out forwards; }
.arms-crossed .arm-right     { animation: anim-cross-right 0.5s ease-out forwards; }
.arms-crossed .forearm-left  { animation: anim-cross-forearm-l 0.5s ease-out forwards; }
.arms-crossed .forearm-right { animation: anim-cross-forearm-r 0.5s ease-out forwards; }

/* Hands up — both arms raise (surrender/praise) */
@keyframes anim-hands-up-left {
  0%   { transform: rotate(0deg); }
  50%, 100% { transform: rotate(30deg); }
}
@keyframes anim-hands-up-right {
  0%   { transform: rotate(0deg); }
  50%, 100% { transform: rotate(-30deg); }
}
.hands-up .arm-left  { animation: anim-hands-up-left 0.5s ease-out forwards; }
.hands-up .arm-right { animation: anim-hands-up-right 0.5s ease-out forwards; }

/* Prayer hands — arms fold inward, hands meet at chest center.
 * Both arm AND forearm point inward (no horizontal reversal).
 * arm(-70) + forearm(+50) = net -20deg: smooth V converging at center. */
@keyframes anim-prayer-left {
  0%   { transform: rotate(0deg); }
  50%, 100% { transform: rotate(-70deg); }
}
@keyframes anim-prayer-right {
  0%   { transform: rotate(0deg); }
  50%, 100% { transform: rotate(70deg); }
}
@keyframes anim-prayer-forearm-l {
  0%   { transform: rotate(0deg); }
  50%, 100% { transform: rotate(50deg); }
}
@keyframes anim-prayer-forearm-r {
  0%   { transform: rotate(0deg); }
  50%, 100% { transform: rotate(-50deg); }
}
.prayer-hands .arm-left      { animation: anim-prayer-left 0.5s ease-out forwards; }
.prayer-hands .arm-right     { animation: anim-prayer-right 0.5s ease-out forwards; }
.prayer-hands .forearm-left  { animation: anim-prayer-forearm-l 0.5s ease-out forwards; }
.prayer-hands .forearm-right { animation: anim-prayer-forearm-r 0.5s ease-out forwards; }

/* ─── FULL BODY ────────────────────────────────────────────── */

/* Dance — arms swing alternating + body bob */
@keyframes anim-dance-left {
  0%, 100% { transform: rotate(20deg); }
  50%      { transform: rotate(-30deg); }
}
@keyframes anim-dance-right {
  0%, 100% { transform: rotate(-20deg); }
  50%      { transform: rotate(30deg); }
}
@keyframes anim-dance-bob {
  0%, 100% { transform: translateY(0); }
  25%      { transform: translateY(-2px) rotate(2deg); }
  75%      { transform: translateY(-2px) rotate(-2deg); }
}
.dance .arm-left  { animation: anim-dance-left 0.6s ease-in-out infinite; }
.dance .arm-right { animation: anim-dance-right 0.6s ease-in-out infinite; }
.dance .skeleton  { animation: anim-dance-bob 0.6s ease-in-out infinite; }

/* Jump — body bounces up */
@keyframes anim-jump {
  0%, 100% { transform: translateY(0); }
  30%      { transform: translateY(2px); }
  50%      { transform: translateY(-6px); }
  70%      { transform: translateY(-2px); }
}
.jump .skeleton { animation: anim-jump 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); }

/* Cower — body shrinks, arms come up defensively with forearms shielding */
@keyframes anim-cower-skeleton {
  0%       { transform: translateY(0) scaleY(1); }
  40%, 100% { transform: translateY(3px) scaleY(0.9); }
}
@keyframes anim-cower-left {
  0%       { transform: rotate(0deg); }
  40%, 100% { transform: translateY(-2px) rotate(40deg); }
}
@keyframes anim-cower-right {
  0%       { transform: rotate(0deg); }
  40%, 100% { transform: translateY(-2px) rotate(-40deg); }
}
@keyframes anim-cower-forearm-l {
  0%       { transform: rotate(0deg); }
  40%, 100% { transform: rotate(-60deg); }
}
@keyframes anim-cower-forearm-r {
  0%       { transform: rotate(0deg); }
  40%, 100% { transform: rotate(60deg); }
}
.cower .skeleton      { animation: anim-cower-skeleton 0.4s ease-out forwards; }
.cower .arm-left      { animation: anim-cower-left 0.4s ease-out forwards; }
.cower .arm-right     { animation: anim-cower-right 0.4s ease-out forwards; }
.cower .forearm-left  { animation: anim-cower-forearm-l 0.4s ease-out forwards; }
.cower .forearm-right { animation: anim-cower-forearm-r 0.4s ease-out forwards; }

/* Celebrate — arms up + bounce + alternating tilt */
@keyframes anim-celebrate-left {
  0%, 100% { transform: rotate(25deg); }
  50%      { transform: translateY(-2px) rotate(35deg); }
}
@keyframes anim-celebrate-right {
  0%, 100% { transform: rotate(-25deg); }
  50%      { transform: translateY(-2px) rotate(-35deg); }
}
@keyframes anim-celebrate-bounce {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-3px); }
}
.celebrate .arm-left  { animation: anim-celebrate-left 0.4s ease-in-out infinite; }
.celebrate .arm-right { animation: anim-celebrate-right 0.4s ease-in-out infinite; }
.celebrate .skeleton  { animation: anim-celebrate-bounce 0.4s ease-in-out infinite; }

/* Kneel — legs compress, torso drops */
@keyframes anim-kneel-skeleton {
  0%       { transform: translateY(0); }
  60%, 100% { transform: translateY(6px); }
}
@keyframes anim-kneel-legs-l {
  0%       { transform: scaleY(1); }
  60%, 100% { transform: scaleY(0.3); }
}
@keyframes anim-kneel-legs-r {
  0%       { transform: scaleY(1); }
  60%, 100% { transform: scaleY(0.3); }
}
.kneel .skeleton  { animation: anim-kneel-skeleton 0.6s ease-out forwards; }
.kneel .leg-left  { animation: anim-kneel-legs-l 0.6s ease-out forwards; }
.kneel .leg-right { animation: anim-kneel-legs-r 0.6s ease-out forwards; }

/* ─── SUBTLE / AMBIENT ─────────────────────────────────────── */

/* Fidget — small arm movement, restless */
@keyframes anim-fidget-right {
  0%, 70%, 100% { transform: rotate(0deg); }
  80%           { transform: rotate(-8deg); }
  90%           { transform: rotate(5deg); }
}
.fidget .arm-right {
  animation: anim-fidget-right 2s ease-in-out infinite;
}

/* Tremble — whole body shakes slightly */
@keyframes anim-tremble {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(-1px); }
  75%      { transform: translateX(1px); }
}
.tremble .skeleton {
  animation: anim-tremble 0.15s ease-in-out infinite;
}

/* Recoil — step back in shock */
@keyframes anim-recoil {
  0%       { transform: translateY(0) translateX(0); }
  30%      { transform: translateY(-1px) translateX(2px); }
  100%     { transform: translateY(0) translateX(0); }
}
.recoil .skeleton {
  animation: anim-recoil 0.4s ease-out;
}

/* ─── FACE-TOUCHING GESTURES (multi-joint arms) ──────────── */
/*
 * These animations require the multi-joint arm structure:
 *   arm-left/right → forearm-left/right → hand-left/right
 * Characters without forearm/hand sub-groups gracefully degrade
 * (only the shoulder rotation applies).
 *
 * Keyframes use only rotation/offset deltas — base joint positions
 * are set via CSS translate property by EntityLayer.
 */

/* Cover eyes — both hands cover eyes (embarrassment/shame)
 * IK solution: arm(-140) + forearm(+70) places hand at eye level.
 * Left arm: negative = counterclockwise = swings INWARD toward face.
 * Right arm: positive = clockwise = swings INWARD toward face. */
@keyframes anim-cover-eyes-arm-l {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-140deg); }
}
@keyframes anim-cover-eyes-arm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(140deg); }
}
@keyframes anim-cover-eyes-forearm-l {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(70deg); }
}
@keyframes anim-cover-eyes-forearm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-70deg); }
}
.cover-eyes .arm-left      { animation: anim-cover-eyes-arm-l 0.5s ease-out forwards; }
.cover-eyes .arm-right     { animation: anim-cover-eyes-arm-r 0.5s ease-out forwards; }
.cover-eyes .forearm-left  { animation: anim-cover-eyes-forearm-l 0.5s ease-out forwards; }
.cover-eyes .forearm-right { animation: anim-cover-eyes-forearm-r 0.5s ease-out forwards; }

/* Cover mouth — both hands cover mouth (shock/gasp)
 * Mouth is at shoulder height, so arms swing ~90 inward horizontally. */
@keyframes anim-cover-mouth-arm-l {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-95deg); }
}
@keyframes anim-cover-mouth-arm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(95deg); }
}
@keyframes anim-cover-mouth-forearm-l {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(10deg); }
}
@keyframes anim-cover-mouth-forearm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-10deg); }
}
.cover-mouth .arm-left      { animation: anim-cover-mouth-arm-l 0.4s ease-out forwards; }
.cover-mouth .arm-right     { animation: anim-cover-mouth-arm-r 0.4s ease-out forwards; }
.cover-mouth .forearm-left  { animation: anim-cover-mouth-forearm-l 0.4s ease-out forwards; }
.cover-mouth .forearm-right { animation: anim-cover-mouth-forearm-r 0.4s ease-out forwards; }

/* Cover one eye — right hand peeks over right eye (cute/shy) */
@keyframes anim-peek-arm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(140deg); }
}
@keyframes anim-peek-forearm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-70deg); }
}
.cover-one-eye .arm-right     { animation: anim-peek-arm-r 0.5s ease-out forwards; }
.cover-one-eye .forearm-right { animation: anim-peek-forearm-r 0.5s ease-out forwards; }

/* Face palm — right hand smacks forehead (exasperation) */
@keyframes anim-facepalm-arm-r {
  0%        { transform: rotate(0deg); }
  60%       { transform: rotate(155deg); }
  70%, 100% { transform: rotate(150deg); }
}
@keyframes anim-facepalm-forearm-r {
  0%        { transform: rotate(0deg); }
  60%       { transform: rotate(-80deg); }
  70%, 100% { transform: rotate(-75deg); }
}
@keyframes anim-facepalm-head {
  0%        { transform: rotate(0deg); }
  70%, 100% { transform: rotate(-3deg); }
}
.face-palm .arm-right     { animation: anim-facepalm-arm-r 0.6s ease-out forwards; }
.face-palm .forearm-right { animation: anim-facepalm-forearm-r 0.6s ease-out forwards; }
.face-palm .head          { animation: anim-facepalm-head 0.6s ease-out forwards; }

/* Chin rest — right hand props up chin (thinking/bored) */
@keyframes anim-chin-arm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(100deg); }
}
@keyframes anim-chin-forearm-r {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-70deg); }
}
@keyframes anim-chin-head {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-5deg); }
}
.chin-rest .arm-right     { animation: anim-chin-arm-r 0.6s ease-out forwards; }
.chin-rest .forearm-right { animation: anim-chin-forearm-r 0.6s ease-out forwards; }
.chin-rest .head          { animation: anim-chin-head 0.6s ease-out forwards; }

/* Rub eyes — hands over eyes with small cycling motion (crying/tired) */
@keyframes anim-rub-eyes-arm-l {
  0%   { transform: rotate(0deg); }
  30%, 100% { transform: rotate(-140deg); }
}
@keyframes anim-rub-eyes-arm-r {
  0%   { transform: rotate(0deg); }
  30%, 100% { transform: rotate(140deg); }
}
@keyframes anim-rub-eyes-hand-l {
  0%, 30% { transform: rotate(0deg); }
  50%     { transform: translate(1px, -1px) rotate(-8deg); }
  70%     { transform: translate(-1px, 1px) rotate(8deg); }
  90%     { transform: translate(1px, -1px) rotate(-5deg); }
  100%    { transform: rotate(0deg); }
}
@keyframes anim-rub-eyes-hand-r {
  0%, 30% { transform: rotate(0deg); }
  50%     { transform: translate(-1px, 1px) rotate(8deg); }
  70%     { transform: translate(1px, -1px) rotate(-8deg); }
  90%     { transform: translate(-1px, 1px) rotate(5deg); }
  100%    { transform: rotate(0deg); }
}
.rub-eyes .arm-left      { animation: anim-rub-eyes-arm-l 0.5s ease-out forwards; }
.rub-eyes .arm-right     { animation: anim-rub-eyes-arm-r 0.5s ease-out forwards; }
.rub-eyes .forearm-left  { animation: anim-cover-eyes-forearm-l 0.5s ease-out forwards; }
.rub-eyes .forearm-right { animation: anim-cover-eyes-forearm-r 0.5s ease-out forwards; }
.rub-eyes .hand-left     { animation: anim-rub-eyes-hand-l 0.8s ease-in-out 0.5s infinite; }
.rub-eyes .hand-right    { animation: anim-rub-eyes-hand-r 0.8s ease-in-out 0.5s infinite; }

/* ─── ENHANCED LEG ANIMATIONS (knee joint) ───────────────── */

/* Improved kneel — actual knee bend instead of scaleY hack */
@keyframes anim-kneel2-skeleton {
  0%       { transform: translateY(0); }
  60%, 100% { transform: translateY(5px); }
}
@keyframes anim-kneel2-leg-l {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(-40deg); }
}
@keyframes anim-kneel2-leg-r {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(40deg); }
}
@keyframes anim-kneel2-shin-l {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(80deg); }
}
@keyframes anim-kneel2-shin-r {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(-80deg); }
}
.kneel2 .skeleton   { animation: anim-kneel2-skeleton 0.6s ease-out forwards; }
.kneel2 .leg-left   { animation: anim-kneel2-leg-l 0.6s ease-out forwards; }
.kneel2 .leg-right  { animation: anim-kneel2-leg-r 0.6s ease-out forwards; }
.kneel2 .shin-left  { animation: anim-kneel2-shin-l 0.6s ease-out forwards; }
.kneel2 .shin-right { animation: anim-kneel2-shin-r 0.6s ease-out forwards; }

/* Sit — legs bend at knees for sitting pose */
@keyframes anim-sit-skeleton {
  0%       { transform: translateY(0); }
  60%, 100% { transform: translateY(4px); }
}
@keyframes anim-sit-leg-l {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(-70deg); }
}
@keyframes anim-sit-leg-r {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(70deg); }
}
@keyframes anim-sit-shin-l {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(90deg); }
}
@keyframes anim-sit-shin-r {
  0%       { transform: rotate(0deg); }
  60%, 100% { transform: rotate(-90deg); }
}
.sit .skeleton   { animation: anim-sit-skeleton 0.5s ease-out forwards; }
.sit .leg-left   { animation: anim-sit-leg-l 0.5s ease-out forwards; }
.sit .leg-right  { animation: anim-sit-leg-r 0.5s ease-out forwards; }
.sit .shin-left  { animation: anim-sit-shin-l 0.5s ease-out forwards; }
.sit .shin-right { animation: anim-sit-shin-r 0.5s ease-out forwards; }

/* Stomp — one leg lifts and comes down (anger/emphasis) */
@keyframes anim-stomp-leg-r {
  0%, 100% { transform: rotate(0deg); }
  30%      { transform: rotate(-30deg); }
  50%      { transform: rotate(5deg); }
}
@keyframes anim-stomp-shin-r {
  0%, 100% { transform: rotate(0deg); }
  30%      { transform: rotate(40deg); }
  50%      { transform: rotate(-5deg); }
}
@keyframes anim-stomp-skeleton {
  0%, 100% { transform: translateY(0); }
  45%      { transform: translateY(-1px); }
  55%      { transform: translateY(1px); }
}
.stomp .leg-right  { animation: anim-stomp-leg-r 0.5s ease-in-out; }
.stomp .shin-right { animation: anim-stomp-shin-r 0.5s ease-in-out; }
.stomp .skeleton   { animation: anim-stomp-skeleton 0.5s ease-in-out; }

/* ─── QUADRUPED ANIMATIONS (fox, cat) ─────────────────────── */
/*
 * Quadruped characters have .leg-front-left, .leg-front-right,
 * .leg-back-left, .leg-back-right, .tail, .ear-left, .ear-right
 * instead of biped .leg-left / .leg-right / .arm-left / .arm-right.
 */

.leg-front-left, .leg-front-right,
.leg-back-left, .leg-back-right,
.tail, .ear-left, .ear-right {
  transform-origin: 0 0;
}

/* Tail wag — happy fox/cat */
@keyframes anim-tail-wag {
  0%, 100% { transform: rotate(0deg); }
  25%      { transform: rotate(15deg); }
  75%      { transform: rotate(-10deg); }
}
.tail-wag .tail {
  animation: anim-tail-wag 0.4s ease-in-out infinite;
  transform-origin: bottom left;
}

/* Crouch — fear/submission: body lowers, legs compress */
@keyframes anim-crouch-skeleton {
  0%       { transform: translateY(0); }
  40%, 100% { transform: translateY(3px) scaleY(0.85); }
}
@keyframes anim-crouch-ears {
  0%       { transform: rotate(0deg); }
  40%, 100% { transform: rotate(-30deg); }
}
.crouch .skeleton   { animation: anim-crouch-skeleton 0.4s ease-out forwards; }
.crouch .ear-left   { animation: anim-crouch-ears 0.4s ease-out forwards; transform-origin: bottom center; }
.crouch .ear-right  { animation: anim-crouch-ears 0.4s ease-out forwards; transform-origin: bottom center; }

/* Pounce — playful leap forward */
@keyframes anim-pounce-skeleton {
  0%   { transform: translateY(0); }
  30%  { transform: translateY(2px); }
  50%  { transform: translateY(-4px); }
  100% { transform: translateY(0); }
}
@keyframes anim-pounce-front-legs {
  0%   { transform: rotate(0deg); }
  50%  { transform: rotate(-20deg); }
  100% { transform: rotate(0deg); }
}
.pounce .skeleton        { animation: anim-pounce-skeleton 0.5s cubic-bezier(0.34, 1.56, 0.64, 1); }
.pounce .leg-front-left  { animation: anim-pounce-front-legs 0.5s ease-out; }
.pounce .leg-front-right { animation: anim-pounce-front-legs 0.5s ease-out; }

/* Ear flatten — fear/alertness: ears pin back */
@keyframes anim-ear-flatten-l {
  0%       { transform: rotate(0deg); }
  30%, 100% { transform: rotate(-40deg); }
}
@keyframes anim-ear-flatten-r {
  0%       { transform: rotate(0deg); }
  30%, 100% { transform: rotate(40deg); }
}
.ear-flatten .ear-left  { animation: anim-ear-flatten-l 0.3s ease-out forwards; transform-origin: bottom center; }
.ear-flatten .ear-right { animation: anim-ear-flatten-r 0.3s ease-out forwards; transform-origin: bottom center; }

/* Quadruped tremble — all four legs + skeleton shake */
@keyframes anim-quad-tremble {
  0%, 100% { transform: translateX(0); }
  25%      { transform: translateX(-1px); }
  75%      { transform: translateX(1px); }
}
.quad-tremble .skeleton { animation: anim-quad-tremble 0.15s ease-in-out infinite; }

/* Quadruped sit — back legs fold, front legs stay */
@keyframes anim-quad-sit-skeleton {
  0%       { transform: translateY(0); }
  50%, 100% { transform: translateY(3px); }
}
@keyframes anim-quad-sit-back {
  0%       { transform: scaleY(1); }
  50%, 100% { transform: scaleY(0.4); }
}
.quad-sit .skeleton        { animation: anim-quad-sit-skeleton 0.5s ease-out forwards; }
.quad-sit .leg-back-left   { animation: anim-quad-sit-back 0.5s ease-out forwards; }
.quad-sit .leg-back-right  { animation: anim-quad-sit-back 0.5s ease-out forwards; }