/* ============================================================================
   Kindred Rig — layered cut-out animation (LinePlay-style joint movement)
   The engine (anam-kindred-rig.js) turns a flat .kart sprite into stacked part
   layers when a rig is registered for that form. This file is the MOTION:
   per-archetype keyframes that swing legs from hips, flap wings from shoulders,
   wave fins, sway tails and blink eyes. Parts carry a class = their manifest
   `name` (legFrontL, wingR, tailFin, eyeL, …). All authored in a 512 canvas.
   ============================================================================ */

/* A rigged kart hides its flat background and hosts the scaled rig frame. */
.kart.kr-rig{background-image:none!important}
.kr-frame{position:absolute;left:50%;bottom:0;width:512px;height:512px;
  transform-origin:bottom center;pointer-events:none;
  animation:kr-breathe 3.6s ease-in-out infinite}
.kr-frame.kr-still{animation:none}
.kr-layer{position:absolute;inset:0;width:512px;height:512px;
  background-repeat:no-repeat;background-size:512px 512px;
  will-change:transform;backface-visibility:hidden}
/* Soft body silhouette behind the parts: when a limb swings off its socket, the
   gap reveals this gentle shadow instead of a hard cut edge / transparent hole.
   Kills most of the "chopped paper-puppet" look without any re-art. */
.kr-base{position:absolute;inset:0;width:512px;height:512px;
  background-repeat:no-repeat;background-size:512px 512px;
  filter:brightness(.34) blur(1px) saturate(.7);transform:scale(1);
  opacity:.8;pointer-events:none}
@keyframes kr-breathe{0%,100%{transform:translate(-50%,0) scale(var(--kr-s,1))}
  50%{transform:translate(-50%,-5px) scale(var(--kr-s,1))}}

/* SMOOTHNESS PRINCIPLE: the whole-frame breathe carries head + body + eyes
   together, so it never opens a seam. We deliberately do NOT animate eyes or
   head per-part — squashing a flat eye reads as a glitch (needs eyelid art),
   and rotating the head opens a neck seam. Only limbs whose joint is buried in
   the body (legs at hips, tail/wings/fins at their base) move independently. */

/* tails / signature movers — gentle sway from the base (joint hidden in body). */
.kr-rig .tail{animation:kr-tail 3.4s cubic-bezier(.45,0,.55,1) infinite}
.kr-rig .tailTuft,.kr-rig .crest,.kr-rig .mane{animation:kr-tail 3.4s cubic-bezier(.45,0,.55,1) infinite;animation-delay:.34s}
@keyframes kr-tail{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(5deg)}}

/* ── QUADRUPED ── legs swing in diagonal pairs (FL+BR vs FR+BL).
   Smooth pendulum arc with a small mid-swing paw lift + gentle easing so the
   reversal isn't abrupt. Back legs lag a hair for an organic, de-synced gait. */
.kr-quadruped .legFrontL{animation:kr-legA var(--kr-gait,2.8s) cubic-bezier(.37,0,.63,1) infinite}
.kr-quadruped .legBackR{animation:kr-legA var(--kr-gait,2.8s) cubic-bezier(.37,0,.63,1) infinite;animation-delay:-.06s}
.kr-quadruped .legFrontR{animation:kr-legB var(--kr-gait,2.8s) cubic-bezier(.37,0,.63,1) infinite}
.kr-quadruped .legBackL{animation:kr-legB var(--kr-gait,2.8s) cubic-bezier(.37,0,.63,1) infinite;animation-delay:-.06s}
.kr-quadruped.kr-walk{--kr-gait:1s;--kr-amp:10deg}
.kr-quadruped.kr-idle{--kr-gait:3.4s;--kr-amp:3deg}
@keyframes kr-legA{
  0%,100%{transform:rotate(var(--kr-amp,5deg))}
  25%{transform:rotate(calc(.35*var(--kr-amp,5deg))) translateY(-1.5px)}
  50%{transform:rotate(calc(-1*var(--kr-amp,5deg)))}
  75%{transform:rotate(calc(-.35*var(--kr-amp,5deg))) translateY(-1.5px)}}
@keyframes kr-legB{
  0%,100%{transform:rotate(calc(-1*var(--kr-amp,5deg)))}
  25%{transform:rotate(calc(-.35*var(--kr-amp,5deg))) translateY(-1.5px)}
  50%{transform:rotate(var(--kr-amp,5deg))}
  75%{transform:rotate(calc(.35*var(--kr-amp,5deg))) translateY(-1.5px)}}

/* ── WINGED ── wings flap from the shoulder, feet take small steps ─────────── */
.kr-winged .wingL{animation:kr-flapL var(--kr-flap,1.6s) ease-in-out infinite}
.kr-winged .wingR{animation:kr-flapR var(--kr-flap,1.6s) ease-in-out infinite}
.kr-winged .legL,.kr-winged .footL{animation:kr-legA 1.2s ease-in-out infinite}
.kr-winged .legR,.kr-winged .footR{animation:kr-legB 1.2s ease-in-out infinite}
.kr-winged.kr-walk{--kr-flap:.7s;--kr-amp:8deg}
.kr-winged.kr-idle{--kr-flap:1.8s;--kr-amp:3deg}
@keyframes kr-flapL{0%,100%{transform:rotate(-13deg)}50%{transform:rotate(19deg)}}
@keyframes kr-flapR{0%,100%{transform:rotate(13deg)}50%{transform:rotate(-19deg)}}

/* ── AQUATIC ── pectoral fins waver, tail-fin sculls, whole body undulates ── */
.kr-aquatic .finL{animation:kr-flapL 1.9s ease-in-out infinite}
.kr-aquatic .finR{animation:kr-flapR 1.9s ease-in-out infinite}
.kr-aquatic .pelvicL{animation:kr-flapL 2.2s ease-in-out infinite}
.kr-aquatic .pelvicR{animation:kr-flapR 2.2s ease-in-out infinite}
.kr-aquatic .tailFin{animation:kr-scull var(--kr-scull,1.6s) ease-in-out infinite}
.kr-aquatic.kr-walk{--kr-scull:.9s}
@keyframes kr-scull{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(12deg)}}

/* ── BIPED / MAGIC ── arms swing opposite legs, tail sways ─────────────────── */
.kr-biped .armL,.kr-magic .armL{animation:kr-legB 1.1s ease-in-out infinite}
.kr-biped .armR,.kr-magic .armR{animation:kr-legA 1.1s ease-in-out infinite}
.kr-biped .legL,.kr-magic .legL{animation:kr-legA 1.1s ease-in-out infinite}
.kr-biped .legR,.kr-magic .legR{animation:kr-legB 1.1s ease-in-out infinite}
.kr-biped.kr-idle,.kr-magic.kr-idle{--kr-amp:4deg}
.kr-biped.kr-walk,.kr-magic.kr-walk{--kr-amp:13deg}

/* ── WINGED-QUADRUPED (dragons) ── quadruped gait + flapping wings ─────────── */
.kr-wingedquad .legFrontL,.kr-wingedquad .legBackR{animation:kr-legA var(--kr-gait,2.6s) ease-in-out infinite}
.kr-wingedquad .legFrontR,.kr-wingedquad .legBackL{animation:kr-legB var(--kr-gait,2.6s) ease-in-out infinite}
.kr-wingedquad .wingL{animation:kr-flapL 2s ease-in-out infinite}
.kr-wingedquad .wingR{animation:kr-flapR 2s ease-in-out infinite}
.kr-wingedquad.kr-walk{--kr-gait:1s;--kr-amp:13deg}
.kr-wingedquad.kr-idle{--kr-gait:2.8s;--kr-amp:5deg}

@media (prefers-reduced-motion: reduce){
  .kr-frame,.kr-layer{animation:none!important}
}