/* Orbit birds: motion and theme for the SVGs from js/orbit-birds.js.
   Everything is scoped to .ob-bird. Pivots are set inline on each part as
   transform-origin in viewBox units, so parts use transform-box: view-box.
   Per-instance variables (set inline by birdSvg): --ob-d (idle offset),
   --ob-bd (blink offset), --ob-blink (blink period).
   Modifiers: .is-static (no motion), .is-poke (one squash reaction, add it
   on tap and remove on animationend), .ob-on-dark (dark backdrop without a
   dark theme). */

.ob-bird { display: inline-block; overflow: visible; vertical-align: middle; flex: 0 0 auto; }
.ob-bird * { transform-box: view-box; }
.ob-bird .ob-shadow { transform-box: fill-box; transform-origin: 50% 50%; }
.ob-bird .ob-shadow { fill: var(--ob-ground, #13212A); fill-opacity: var(--ob-ground-a, 0.1); }

/* Dark theme: a deeper ground shadow and a faint rim light on dark-bodied birds. */
:root[data-theme="dark"] .ob-bird,
.ob-on-dark .ob-bird,
.ob-bird.ob-on-dark { --ob-ground: #000; --ob-ground-a: 0.34; }
:root[data-theme="dark"] .ob-bird.ob-dark .ob-rim,
.ob-on-dark .ob-bird.ob-dark .ob-rim,
.ob-bird.ob-dark.ob-on-dark .ob-rim { stroke-opacity: 0.2; }

/* ---------------------------------------------------------------- idle */
.ob-bird .ob-body { animation: ob-breathe 3.4s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-eye-open { animation: ob-blink var(--ob-blink, 4.6s) linear infinite; animation-delay: var(--ob-bd, 0s); }
.ob-bird .ob-eye-shut { animation: ob-shut var(--ob-blink, 4.6s) linear infinite; animation-delay: var(--ob-bd, 0s); }
.ob-bird.ob-dblink .ob-eye-open { animation-name: ob-blink2; }
.ob-bird.ob-dblink .ob-eye-shut { animation-name: ob-shut2; }
.ob-bird .ob-tuft { animation: ob-sway 3.2s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-tail { animation: ob-wag 2.6s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-crest { animation: ob-sway 3.8s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-fan { animation: ob-fan 4.4s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-wing-l { animation: ob-wing-idle-l 3.4s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-wing-r { animation: ob-wing-idle-r 3.4s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }

@keyframes ob-breathe { 0%, 100% { transform: scale(1, 1); } 50% { transform: scale(0.988, 1.022); } }
@keyframes ob-blink { 0%, 92%, 100% { transform: scaleY(1); } 94.5% { transform: scaleY(0.06); } 97% { transform: scaleY(1); } }
@keyframes ob-shut { 0%, 93.2%, 96%, 100% { opacity: 0; } 94%, 95.2% { opacity: 1; } }
@keyframes ob-blink2 { 0%, 86%, 100% { transform: scaleY(1); } 88% { transform: scaleY(0.06); } 90% { transform: scaleY(1); } 92% { transform: scaleY(0.06); } 94.5% { transform: scaleY(1); } }
@keyframes ob-shut2 { 0%, 87.2%, 89.2%, 91.2%, 93.4%, 100% { opacity: 0; } 87.8%, 88.6%, 91.8%, 92.8% { opacity: 1; } }
@keyframes ob-sway { 0%, 100% { transform: rotate(-5deg); } 50% { transform: rotate(6deg); } }
@keyframes ob-wag { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(5deg); } }
@keyframes ob-fan { 0%, 100% { transform: scale(1) rotate(0deg); } 50% { transform: scale(1.025) rotate(-1.5deg); } }
@keyframes ob-wing-idle-l { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(4deg); } }
@keyframes ob-wing-idle-r { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-4deg); } }

/* --------------------------------------------------------------- moods */

/* happy: a little hop every few seconds */
.ob-bird.ob-m-happy .ob-rig { animation: ob-hop-soft 3s cubic-bezier(.35, 0, .3, 1) infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-happy .ob-shadow { animation: ob-shadow-soft 3s cubic-bezier(.35, 0, .3, 1) infinite; animation-delay: var(--ob-d, 0s); }
@keyframes ob-hop-soft {
  0%, 62%, 100% { transform: translateY(0) scale(1, 1); }
  68% { transform: translateY(0) scale(1.06, 0.93); }
  78% { transform: translateY(-7px) scale(0.96, 1.05); }
  88% { transform: translateY(0) scale(1.05, 0.95); }
  94% { transform: translateY(0) scale(0.99, 1.01); }
}
@keyframes ob-shadow-soft { 0%, 66%, 90%, 100% { transform: scale(1); opacity: 1; } 78% { transform: scale(0.78, 0.9); opacity: 0.65; } }

/* calm: slow, deep breaths */
.ob-bird.ob-m-calm .ob-body { animation-duration: 4.8s; }

/* waving: one wing waves, the body sways along */
.ob-bird.ob-m-waving .ob-wing-r { animation: ob-wave 0.56s ease-in-out infinite alternate; }
.ob-bird.ob-m-waving .ob-rig { animation: ob-sway-body 1.12s ease-in-out infinite; }
@keyframes ob-wave { from { transform: rotate(-16deg); } to { transform: rotate(14deg); } }
@keyframes ob-sway-body { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2deg); } }

/* party: bouncing, flapping, confetti */
.ob-bird.ob-m-party .ob-rig { animation: ob-hop 0.84s cubic-bezier(.3, 0, .3, 1) infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-party .ob-shadow { animation: ob-shadow-hop 0.84s cubic-bezier(.3, 0, .3, 1) infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-party .ob-wing-l { animation: ob-flap-l 0.21s ease-in-out infinite alternate; }
.ob-bird.ob-m-party .ob-wing-r { animation: ob-flap-r 0.21s ease-in-out infinite alternate; }
.ob-bird.ob-m-party .ob-foot-l { animation: ob-kick-l 0.42s ease-in-out infinite alternate; }
.ob-bird.ob-m-party .ob-foot-r { animation: ob-kick-r 0.42s ease-in-out infinite alternate; }
.ob-bird.ob-m-party .ob-hat { animation: ob-hat 0.84s ease-in-out infinite; }
.ob-bird .ob-fx-confetti .ob-fx-i { animation: ob-confetti 1.6s ease-in infinite; }
.ob-bird .ob-fx-confetti .ob-fx-2 { animation-delay: -0.4s; }
.ob-bird .ob-fx-confetti .ob-fx-3 { animation-delay: -0.8s; }
.ob-bird .ob-fx-confetti .ob-fx-4 { animation-delay: -1.2s; }
@keyframes ob-hop {
  0%, 100% { transform: translateY(0) scale(1.05, 0.94); }
  30% { transform: translateY(-9px) scale(0.95, 1.06); }
  50% { transform: translateY(-11px) scale(0.98, 1.02); }
  80% { transform: translateY(0) scale(1.04, 0.96); }
}
@keyframes ob-shadow-hop { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(0.72, 0.85); opacity: 0.55; } }
@keyframes ob-flap-l { from { transform: rotate(-14deg); } to { transform: rotate(12deg); } }
@keyframes ob-flap-r { from { transform: rotate(14deg); } to { transform: rotate(-12deg); } }
@keyframes ob-kick-l { from { transform: rotate(-10deg); } to { transform: rotate(14deg); } }
@keyframes ob-kick-r { from { transform: rotate(10deg); } to { transform: rotate(-14deg); } }
@keyframes ob-hat { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(6deg); } }
@keyframes ob-confetti {
  0% { transform: translateY(-6px) rotate(0deg) scale(0.6); opacity: 0; }
  15% { opacity: 1; transform: translateY(-3px) rotate(40deg) scale(1); }
  100% { transform: translateY(16px) rotate(240deg) scale(0.9); opacity: 0; }
}

/* wow: a startled pop, sparkles */
.ob-bird.ob-m-wow .ob-rig { animation: ob-pop 2.4s cubic-bezier(.3, 1.6, .5, 1) infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-wow .ob-wing-l { animation: ob-flutter-l 0.6s ease-in-out infinite alternate; }
.ob-bird.ob-m-wow .ob-wing-r { animation: ob-flutter-r 0.6s ease-in-out infinite alternate; }
@keyframes ob-pop {
  0%, 100% { transform: translateY(0) scale(1, 1); }
  8% { transform: translateY(-5px) scale(0.94, 1.08); }
  18% { transform: translateY(0) scale(1.05, 0.95); }
  28% { transform: translateY(0) scale(1, 1); }
}
@keyframes ob-flutter-l { from { transform: rotate(-6deg); } to { transform: rotate(8deg); } }
@keyframes ob-flutter-r { from { transform: rotate(6deg); } to { transform: rotate(-8deg); } }
.ob-bird .ob-fx-sparkle .ob-fx-i,
.ob-bird .ob-fx-stars .ob-fx-i { animation: ob-twinkle 1.8s ease-in-out infinite; }
.ob-bird .ob-fx-sparkle .ob-fx-2, .ob-bird .ob-fx-stars .ob-fx-2 { animation-delay: -0.6s; }
.ob-bird .ob-fx-sparkle .ob-fx-3, .ob-bird .ob-fx-stars .ob-fx-3 { animation-delay: -1.2s; }
@keyframes ob-twinkle { 0%, 100% { transform: scale(0.55) rotate(0deg); opacity: 0.4; } 50% { transform: scale(1.1) rotate(45deg); opacity: 1; } }

/* sleepy: slow breaths, nodding, floating Z's */
.ob-bird.ob-m-sleepy .ob-body { animation-duration: 5s; }
.ob-bird.ob-m-sleepy .ob-head { animation: ob-nod 5s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-fx-zzz .ob-fx-i { animation: ob-z 3s ease-out infinite; opacity: 0; }
.ob-bird .ob-fx-zzz .ob-fx-2 { animation-delay: 1s; }
.ob-bird .ob-fx-zzz .ob-fx-3 { animation-delay: 2s; }
@keyframes ob-nod { 0%, 100% { transform: rotate(0deg) translateY(0); } 55% { transform: rotate(3deg) translateY(1.4px); } 70% { transform: rotate(-1deg) translateY(-0.4px); } }
@keyframes ob-z { 0% { transform: translate(-4px, 6px) scale(0.4); opacity: 0; } 25% { opacity: 1; } 100% { transform: translate(5px, -8px) scale(1.05); opacity: 0; } }

/* worried: a nervous shiver now and then, sweat slides */
.ob-bird.ob-m-worried .ob-rig { animation: ob-shiver 2.2s linear infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-fx-sweat .ob-fx-i { animation: ob-sweat 2.2s ease-in infinite; }
@keyframes ob-shiver {
  0%, 60%, 100% { transform: translateX(0); }
  63% { transform: translateX(-0.8px); } 66% { transform: translateX(0.8px); } 69% { transform: translateX(-0.8px); }
  72% { transform: translateX(0.8px); } 75% { transform: translateX(-0.5px); } 78% { transform: translateX(0); }
}
@keyframes ob-sweat { 0% { transform: translateY(-2px) scale(0.7); opacity: 0; } 20% { opacity: 1; transform: translateY(0) scale(1); } 85% { opacity: 1; } 100% { transform: translateY(8px) scale(0.9); opacity: 0; } }

/* focus: steady, a slow blink, a small determined nudge, ticks that pulse */
.ob-bird.ob-m-focus .ob-eye-open,
.ob-bird.ob-m-focus .ob-eye-shut { animation-duration: 7s; }
.ob-bird.ob-m-focus .ob-rig { animation: ob-nudge 2.6s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-fx-focus .ob-fx-i { animation: ob-tick 1.3s ease-in-out infinite; }
.ob-bird .ob-fx-focus .ob-fx-2 { animation-delay: 0.15s; }
.ob-bird .ob-fx-focus .ob-fx-3 { animation-delay: 0.3s; }
@keyframes ob-nudge { 0%, 70%, 100% { transform: translateY(0) scale(1); } 80% { transform: translateY(-1.5px) scale(1.015); } }
@keyframes ob-tick { 0%, 100% { transform: scale(0.6); opacity: 0.35; } 40% { transform: scale(1.1); opacity: 1; } }

/* sad: a heavy sway, a tear rolls */
.ob-bird.ob-m-sad .ob-body { animation-duration: 4.4s; }
.ob-bird.ob-m-sad .ob-head { animation: ob-sigh 4.4s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird .ob-fx-tear .ob-fx-i { animation: ob-tear 2.6s ease-in infinite; }
@keyframes ob-sigh { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(1.2px) rotate(-1.5deg); } }
@keyframes ob-tear { 0% { transform: translateY(-2px) scale(0.4); opacity: 0; } 18% { transform: translateY(0) scale(1); opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(14px) scale(0.85); opacity: 0; } }

/* love: swaying, hearts drift up, cheeks glow */
.ob-bird.ob-m-love .ob-rig { animation: ob-sway-body 2.2s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-love .ob-cheek { animation: ob-glow 1.1s ease-in-out infinite alternate; }
.ob-bird.ob-m-love .ob-pupil.is-heart { transform-box: fill-box; transform-origin: 50% 50%; }
.ob-bird.ob-m-love .ob-eye-open { animation: ob-beat 1.1s ease-in-out infinite; }
.ob-bird .ob-fx-hearts .ob-fx-i { animation: ob-heart 2.6s ease-out infinite; opacity: 0; }
.ob-bird .ob-fx-hearts .ob-fx-2 { animation-delay: 0.85s; }
.ob-bird .ob-fx-hearts .ob-fx-3 { animation-delay: 1.7s; }
@keyframes ob-glow { from { opacity: 0.55; } to { opacity: 0.95; } }
@keyframes ob-beat { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.14); } 30% { transform: scale(0.98); } 45% { transform: scale(1.08); } }
@keyframes ob-heart { 0% { transform: translateY(6px) scale(0.4); opacity: 0; } 20% { opacity: 1; transform: translateY(2px) scale(1); } 100% { transform: translateY(-12px) scale(0.85) rotate(-8deg); opacity: 0; } }

/* thinking: head rocks, the wing taps the chin, the thought dots build up */
.ob-bird.ob-m-thinking .ob-head { animation: ob-ponder 3.2s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-thinking .ob-wing-r { animation: ob-tap 1.6s ease-in-out infinite; }
.ob-bird .ob-fx-dots .ob-fx-i { animation: ob-dot 2.4s ease-in-out infinite; opacity: 0; }
.ob-bird .ob-fx-dots .ob-fx-2 { animation-delay: 0.3s; }
.ob-bird .ob-fx-dots .ob-fx-3 { animation-delay: 0.6s; }
@keyframes ob-ponder { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-3deg); } }
@keyframes ob-tap { 0%, 60%, 100% { transform: rotate(0deg); } 70% { transform: rotate(-7deg); } 80% { transform: rotate(0deg); } 90% { transform: rotate(-5deg); } }
@keyframes ob-dot { 0%, 10% { transform: scale(0.3); opacity: 0; } 25%, 75% { transform: scale(1); opacity: 1; } 90%, 100% { transform: scale(0.6); opacity: 0; } }

/* proud: chest puffs up, chin lifts, stars twinkle */
.ob-bird.ob-m-proud .ob-body { animation: ob-puff 2.8s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-m-proud .ob-head { animation: ob-chin 2.8s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
@keyframes ob-puff { 0%, 100% { transform: scale(1, 1); } 45%, 60% { transform: scale(1.035, 1.03); } }
@keyframes ob-chin { 0%, 100% { transform: rotate(0deg) translateY(0); } 45%, 60% { transform: rotate(-2deg) translateY(-1px); } }

/* hummingbirds always hover */
.ob-bird.ob-buzz .ob-wing-l { animation: ob-buzz-l 0.09s linear infinite alternate; }
.ob-bird.ob-buzz .ob-wing-r { animation: ob-buzz-r 0.09s linear infinite alternate; }
.ob-bird.ob-buzz .ob-rig { animation: ob-hover 1.4s ease-in-out infinite; animation-delay: var(--ob-d, 0s); }
.ob-bird.ob-buzz.ob-m-party .ob-rig { animation: ob-hop 0.84s cubic-bezier(.3, 0, .3, 1) infinite; }
@keyframes ob-buzz-l { from { transform: rotate(-12deg); } to { transform: rotate(14deg); } }
@keyframes ob-buzz-r { from { transform: rotate(12deg); } to { transform: rotate(-14deg); } }
@keyframes ob-hover { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

/* tap reaction. Not for a party bird: it is already bouncing, and swapping
   its hop for the squash mid-air made it jerk back to the ground. */
.ob-bird.is-poke:not(.ob-m-party) .ob-rig { animation: ob-poke 0.5s cubic-bezier(.3, 1.5, .5, 1) 1 !important; }
@keyframes ob-poke { 0% { transform: scale(1, 1); } 25% { transform: scale(1.12, 0.86); } 55% { transform: scale(0.94, 1.08) translateY(-3px); } 100% { transform: scale(1, 1); } }

/* ---------------------------------------------------------- off switches */
.ob-bird.is-static,
.ob-bird.is-static * { animation: none !important; }
.ob-bird.is-static .ob-fx-i { opacity: 1 !important; }
@media (prefers-reduced-motion: reduce) {
  .ob-bird, .ob-bird * { animation: none !important; }
  .ob-bird .ob-fx-i { opacity: 1 !important; }
}

/* Eyes that follow the cursor: set --ob-lx / --ob-ly (viewBox units, keep
   within about ±2.4) on the bird; js/landing-fun.js does it on the landing. */
.ob-bird .ob-look { transform: translate(calc(var(--ob-lx, 0) * 1px), calc(var(--ob-ly, 0) * 1px)); transition: transform 0.18s ease-out; }
@media (prefers-reduced-motion: reduce) { .ob-bird .ob-look { transition: none; } }