/* AI_TAG: FRONTEND_GRAPHICS | Canonical pigeon animation constants + rules (app + debug) */
:root{
  /* Wing timings */
  --wing-flap-duration: 1.2s;
  --wing-flap-ease: ease-in-out;

  /* Wing transform origins (SVG px coordinates) */
  /* Original working pivots from first implementation */
  --wing-left-origin: 68px 60px;
  --wing-right-origin: 76px 66px;

  /* Wing geometry scales (applied before rotation in keyframes) */
  /* Length ~ X axis, Thickness ~ Y axis for front/side SVGs */
  --wing-scale-x: 1;
  --wing-scale-y: 1;

  /* Wing angles: rest 0, sweep ±25deg (original working values) */
  --wing-left-rest: 0deg;
  --wing-left-down: -13.5deg;
  --wing-right-rest: 0deg;
  --wing-right-down: 12deg;

  /* Beak transform */
  --beak-translate-x: 0px;
  --beak-tilt: 6deg;

  /* Toe grip amplitude (reduced for subtle motion) */
  --toe-grip-angle: -0.35deg;
}

/* CRITICAL: Apply working elder-style right wing to ALL contexts including debug */
#pWrap .wing-right,
.flyby-pigeon .wing-right,
.sidePigeon .wing-right,
#incomingLeft .wing-right,
#incomingRight .wing-right,
.backgroundPigeon .wing-right,
#fxLayer .wing-right,
main#page-hub .wing-right,
#page-hub.page.active .wing-right,
.pigeon-instance .wing-right{
  animation: wingFlapRight15 1.2s ease-in-out infinite !important;
  transform-origin: 76px 66px !important;
  transform-box: view-box !important;
  /* AI_TAG: FRONTEND_RENDER | Ensure animation isn't paused by global rules */
  animation-play-state: running !important;
}

/* CRITICAL: Apply working left wing to ALL contexts including debug */
#pWrap .wing-left,
.flyby-pigeon .wing-left,
.sidePigeon .wing-left,
#incomingLeft .wing-left,
#incomingRight .wing-left,
#fxLayer .wing-left,
main#page-hub .wing-left,
#page-hub.page.active .wing-left,
.pigeon-instance .wing-left{
  animation: wingFlapLeft15 1.2s ease-in-out infinite !important;
  transform-origin: 48px 60px !important;
  transform-box: view-box !important;
}

/* Background pigeon gets faster animation */
.backgroundPigeon .wing-left{
  animation: wingFlapLeft15 0.72s ease-in-out infinite !important;
  transform-origin: 68px 60px !important;
  transform-box: view-box !important;
}
.backgroundPigeon .wing-right{
  animation: wingFlapRight15 0.72s ease-in-out infinite !important;
  transform-origin: 76px 66px !important;
  transform-box: view-box !important;
}

/* Hub pigeon (front view) - CRITICAL: Override dist CSS with ultra-high specificity */
main#page-hub #pWrap #myPigeon .wing-left,
#page-hub.page.active #pWrap #myPigeon .wing-left,
#pWrap #myPigeon .wing-left{
  /* Apply calmer side-adult debug flap on hub (tempo + amplitude) */
  animation-name: wingFlapLeft15 !important;
  animation-duration: 1.2s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  /* Original working pivot for LEFT wing (front view) */
  transform-origin: 48px 74px !important;
  transform-box: view-box !important;
}
main#page-hub #pWrap #myPigeon .wing-right,
#page-hub.page.active #pWrap #myPigeon .wing-right,
#pWrap #myPigeon .wing-right{
  /* Apply calmer side-adult debug flap on hub (tempo + amplitude) */
  animation-name: wingFlapRight15 !important;
  animation-duration: 1.2s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  /* Hub/front-view hinge differs slightly from elder side */
  transform-origin: 80px 74px !important;
  transform-box: view-box !important;
  /* AI_TAG: FRONTEND_RENDER | Prevent accidental pause */
  animation-play-state: running !important;
}

/* Side symbols (adult + juvenile) – use elder side pivots and slower 2.2s amplitude */
/* Include both inline side symbols and potential .sidePigeon wrapper variants */
.pigeon-instance.age-stage-sym-body .wing-left,
.pigeon-instance.age-stage-sym-juvenile .wing-left,
.sidePigeon .wing-left{
  /* Use debug side (old) left-wing flap */
  animation-name: oldWingLeft !important;
  animation-duration: 2.2s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  transform-origin: 46px 66px !important; /* elder side pivot */
  transform-box: view-box !important;
}
.pigeon-instance.age-stage-sym-body .wing-right,
.pigeon-instance.age-stage-sym-juvenile .wing-right,
.sidePigeon .wing-right{
  /* Use debug side (old) right-wing flap */
  animation-name: oldWingRight !important;
  animation-duration: 2.2s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  transform-origin: 76px 66px !important; /* elder side pivot */
  transform-box: view-box !important;
}

/* Elder side wings use same animation as other side views but with proper scales */
.pigeon-instance.age-stage-sym-old .wing-left{
  animation-name: wingFlapLeft15 !important;
  animation-duration: 2.2s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  transform-origin: 46px 66px !important;
  transform-box: view-box !important;
}
.pigeon-instance.age-stage-sym-old .wing-right{
  animation-name: wingFlapRight15 !important;
  animation-duration: 2.2s !important;
  animation-timing-function: ease-in-out !important;
  animation-iteration-count: infinite !important;
  transform-origin: 76px 66px !important;
  transform-box: view-box !important;
}

/* Restore elder wing scales removed from SVG */
.pigeon-instance.age-stage-sym-old .wing-left,
.pigeon-instance.age-stage-sym-old .wing-right {
  --wing-scale-x: 1;
  --wing-scale-y: 0.9;
}

/* Restore juvenile wing scales removed from SVG */
.pigeon-instance.age-stage-sym-juvenile .wing-left,
.pigeon-instance.age-stage-sym-juvenile .wing-right {
  --wing-scale-x: 0.9;
  --wing-scale-y: 1;
}

/* Restore elder wing scales for sidePigeon */
.sidePigeon .wing-left,
.sidePigeon .wing-right {
  --wing-scale-x: 1;
  --wing-scale-y: 1;
}

/* Side symbol pivots: use original working values */
.pigeon-instance.age-stage-sym-juvenile{
  --wing-left-origin: 76px 66px;
  --wing-right-origin: 76px 66px;
  --wing-left-rest: 0deg;
  --wing-left-down: -15deg;
  --wing-right-rest: 0deg;
  --wing-right-down: 15deg;
}
.pigeon-instance.age-stage-sym-body{
  --wing-left-origin: 76px 66px;
  --wing-right-origin: 76px 66px;
  --wing-left-rest: 0deg;
  --wing-left-down: -15deg;
  --wing-right-rest: 0deg;
  --wing-right-down: 15deg;
}

/* Original production flaps (keep for background bird) with scalable geometry */
@keyframes wingFlapLeft{
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(0deg); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(-25deg); }
}
@keyframes wingFlapRight{
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(0deg); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(25deg); }
}

/* Calmer flaps matching elder amplitude for hub + side body with scalable geometry */
@keyframes wingFlapLeft15{
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(0deg); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(-13.5deg); }
}
@keyframes wingFlapRight15{
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(0deg); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(13.5deg); }
}

/* Elder-style wing flaps with slower timing and full amplitude */
@keyframes oldWingLeft{
  /* Match debug side amplitude */
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(0deg); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(-13.5deg); }
}
@keyframes oldWingRight{
  /* Match debug side amplitude */
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(0deg); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(13.5deg); }
}

/* Legacy variable-based keyframes kept for compatibility */
@keyframes pigeonWingLeft{
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(var(--wing-left-rest)); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(var(--wing-left-down)); }
}
@keyframes pigeonWingRight{
  0%,100%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(var(--wing-right-rest)); }
  50%{ transform: translateX(var(--wing-translate-x, 0px)) scale(var(--wing-scale-x), var(--wing-scale-y)) rotate(var(--wing-right-down)); }
}

@keyframes footGrip{
  0%,100%{ transform: rotate(0deg); }
  50%{ transform: rotate(var(--toe-grip-angle)); }
}

#pWrap #myPigeon .beak,
.backgroundPigeon .beak,
.pigeon-instance .beak{
  transform-box: fill-box;
  transform-origin: 10% 50%;
  transform: translateX(var(--beak-translate-x)) rotate(var(--beak-tilt)) !important;
}

#pWrap #myPigeon .front-toes,
.pigeon-instance .front-toes,
.enc-pigeon .front-toes{
  /* The root group stays static; per-foot groups animate for a natural grip. */
  animation: none !important;
  transform: none !important;
  transform-box: view-box;
}

/* Animate each foot subtly around its own ankle to prevent sliding/jitter */
#pWrap #myPigeon .front-toes .foot-left,
.pigeon-instance .front-toes .foot-left,
.enc-pigeon .front-toes .foot-left{
  animation: footGrip 3.2s var(--wing-flap-ease) infinite !important;
  transform-origin: 65.1px 110.2px; /* left ankle ellipse center */
  transform-box: view-box;
}
#pWrap #myPigeon .front-toes .foot-right,
.pigeon-instance .front-toes .foot-right,
.enc-pigeon .front-toes .foot-right{
  animation: footGrip 3.2s var(--wing-flap-ease) infinite reverse !important; /* slight contra-phase for stability */
  transform-origin: 73.9px 110.8px; /* right ankle ellipse center */
  transform-box: view-box;
}

/* Individually flex inner toes around their base points instead of moving the whole toe */
#pWrap #myPigeon .toe-left.toe-2,
.pigeon-instance .toe-left.toe-2,
.enc-pigeon .toe-left.toe-2{
  transform-origin: 65.62px 110.26px;
  transform-box: view-box;
  animation: toeFlexL 3.2s var(--wing-flap-ease) infinite !important;
}
#pWrap #myPigeon .toe-left.toe-3,
.pigeon-instance .toe-left.toe-3,
.enc-pigeon .toe-left.toe-3{
  transform-origin: 66.42px 110.26px;
  transform-box: view-box;
  animation: toeFlexL 3.2s var(--wing-flap-ease) infinite !important;
}
#pWrap #myPigeon .toe-right.toe-2,
.pigeon-instance .toe-right.toe-2,
.enc-pigeon .toe-right.toe-2{
  transform-origin: 73.85px 110.76px;
  transform-box: view-box;
  animation: toeFlexR 3.2s var(--wing-flap-ease) infinite !important;
}
#pWrap #myPigeon .toe-right.toe-3,
.pigeon-instance .toe-right.toe-3,
.enc-pigeon .toe-right.toe-3{
  transform-origin: 74.75px 110.76px;
  transform-box: view-box;
  animation: toeFlexR 3.2s var(--wing-flap-ease) infinite !important;
}

/* Notes:
   - !important is used here intentionally to guarantee consistency against dist CSS and debug overrides.
   - Prefer tweaking the CSS variables above instead of redefining animations per environment.
 */

/* Hatchling wing animations from debug */
@keyframes hatchlingWingLeft{0%,100%{transform:rotate(192deg)}50%{transform:rotate(200deg)}}
@keyframes hatchlingWingRight{0%,100%{transform:rotate(-192deg)}50%{transform:rotate(-200deg)}}

/* Feet swing animation */
@keyframes feetSwing {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(1deg); }
}
