/* Dashi — life (blink + idle breathing) and animations for the newer poses.
   Classic pose animations live in app.css. Everything here is gated on
   .dashi-live (set when dashi(..., { animate: true })). --dashi-d is a
   per-instance negative delay so several Dashis on a page don't sync up. */

/* ---- alive on every pose */
.dashi-live .dashi-eyes > * {
  transform-box: fill-box; transform-origin: center;
  animation: dashi-blink-eye 5.2s infinite; animation-delay: var(--dashi-d, 0s);
}
.dashi-live.dashi-anim-idle .dashi-body { animation: dashi-idle 4.2s ease-in-out infinite; animation-delay: var(--dashi-d, 0s); }

/* ---- body animations for the newer poses (transform-origin set in app.css: 100px 186px) */
.dashi-live.dashi-anim-sway .dashi-body { animation: dashi-sway 3.6s ease-in-out infinite; }
.dashi-live.dashi-anim-levitate .dashi-body { animation: dashi-levitate 4s ease-in-out infinite; }
.dashi-live.dashi-anim-levitate .dashi-shadow { transform-box: fill-box; transform-origin: center; animation: dashi-levitate-shadow 4s ease-in-out infinite; }
.dashi-live.dashi-anim-shake .dashi-body { animation: dashi-shake 1.6s ease-in-out infinite; }
.dashi-live.dashi-anim-tilt .dashi-body { animation: dashi-tilt 3.4s ease-in-out infinite; }
.dashi-live.dashi-anim-shrug .dashi-body { animation: dashi-shrug 2.4s ease-in-out infinite; }
.dashi-live.dashi-anim-run .dashi-body { animation: dashi-run .42s ease-in-out infinite; }
.dashi-live.dashi-anim-surf .dashi-body { animation: dashi-surf 2.8s ease-in-out infinite; }
.dashi-live.dashi-anim-sigh .dashi-body { animation: dashi-sigh 4.6s ease-in-out infinite; }

/* ---- props */
.dashi-live .dashi-spin { animation: dashi-spin 14s linear infinite; }
.dashi-live .dashi-spin-rev { animation: dashi-spin 9s linear infinite reverse; }
.dashi-live .dashi-steam path { animation: dashi-steam 2.4s ease-in-out infinite; }
.dashi-live .dashi-steam path:nth-child(2) { animation-delay: -1.2s; }
.dashi-live .dashi-twinkle2 > * { transform-box: fill-box; transform-origin: center; animation: dashi-twinkle2 2s ease-in-out infinite; }
.dashi-live .dashi-twinkle2 > *:nth-child(2) { animation-delay: -.7s; }
.dashi-live .dashi-twinkle2 > *:nth-child(3) { animation-delay: -1.3s; }
.dashi-live .dashi-twinkle2 > *:nth-child(4) { animation-delay: -.4s; }
.dashi-live .dashi-twinkle2 > *:nth-child(5) { animation-delay: -1.6s; }
.dashi-live .dashi-twinkle2 > *:nth-child(6) { animation-delay: -1s; }
.dashi-live .dashi-glint { animation: dashi-glint 3.2s ease-in-out infinite; }
.dashi-live .dashi-splash { animation: dashi-glow2 1.4s ease-in-out infinite; }
.dashi-live .dashi-flex { transform-origin: 158px 118px; animation: dashi-flex 1.5s ease-in-out infinite; }
.dashi-live .dashi-aura { transform-box: fill-box; transform-origin: center; animation: dashi-aura 4s ease-in-out infinite; }
.dashi-live .dashi-burst { transform-origin: 100px 10px; animation: dashi-burst 1.6s ease-in-out infinite; }
.dashi-live .dashi-sparks { transform-origin: 100px 6px; animation: dashi-sparks 1.6s ease-out infinite; }
.dashi-live .dashi-drops > *, .dashi-live path.dashi-drops { animation: dashi-drop 1.4s ease-in infinite; }
.dashi-live .dashi-drops > *:nth-child(2) { animation-delay: -.7s; }
.dashi-live .dashi-beat, .dashi-live .dashi-beat2 { transform-box: fill-box; transform-origin: center; animation: dashi-beat 1.2s ease-in-out infinite; }
.dashi-live .dashi-rise > * { animation: dashi-rise 3s ease-in-out infinite; }
.dashi-live .dashi-rise > *:nth-child(2) { animation-delay: -.8s; }
.dashi-live .dashi-rise > *:nth-child(3) { animation-delay: -1.6s; }
.dashi-live .dashi-rise > *:nth-child(4) { animation-delay: -2.3s; }
.dashi-live .dashi-shrug-hands { animation: dashi-shrug-hands 2.4s ease-in-out infinite; }
.dashi-live .dashi-float2 { animation: dashi-float 2.2s ease-in-out infinite; }
.dashi-live .dashi-leg-a { animation: dashi-leg .42s ease-in-out infinite; }
.dashi-live .dashi-leg-b { animation: dashi-leg .42s ease-in-out infinite reverse; }
.dashi-live .dashi-arm-a { animation: dashi-leg .42s ease-in-out infinite reverse; }
.dashi-live .dashi-arm-b { animation: dashi-leg .42s ease-in-out infinite; }
.dashi-live .dashi-speed > * { animation: dashi-speed .6s linear infinite; }
.dashi-live .dashi-speed > *:nth-child(2) { animation-delay: -.2s; }
.dashi-live .dashi-speed > *:nth-child(3) { animation-delay: -.4s; }
.dashi-live .dashi-drizzle > * { animation: dashi-drizzle 1.2s linear infinite; }
.dashi-live .dashi-drizzle > *:nth-child(2) { animation-delay: -.4s; }
.dashi-live .dashi-drizzle > *:nth-child(3) { animation-delay: -.8s; }
.dashi-live .dashi-pom-l { transform-origin: 40px 90px; animation: dashi-pom 0.6s ease-in-out infinite alternate; }
.dashi-live .dashi-pom-r { transform-origin: 160px 90px; animation: dashi-pom 0.6s ease-in-out infinite alternate-reverse; }
.dashi-live .dashi-rain > * { animation: dashi-rain 2.6s linear infinite; }
.dashi-live .dashi-page { transform-origin: 100px 156px; animation: dashi-page 4.5s ease-in-out infinite; }
.dashi-live .dashi-pump { transform-origin: 160px 128px; animation: dashi-pump 1.4s ease-in-out infinite; }
.dashi-live .dashi-glow2 { transform-box: fill-box; transform-origin: center; animation: dashi-glow2 1.6s ease-in-out infinite; }
.dashi-live .dashi-stroke { stroke-dasharray: 110; animation: dashi-paint-stroke 2.4s ease-in-out infinite; }
.dashi-live .dashi-brush { transform-origin: 160px 118px; animation: dashi-brush 2.4s ease-in-out infinite; }
.dashi-live .dashi-peek { transform-origin: 124px 116px; animation: dashi-peek 4s ease-in-out infinite; }
.dashi-live .dashi-tap { animation: dashi-tap .5s ease-in-out infinite; }
.dashi-live .dashi-press { animation: dashi-press 1s steps(1) infinite; }
.dashi-live .dashi-wobble { transform-origin: 158px 118px; animation: dashi-wobble 1.8s ease-in-out infinite; }
.dashi-live .dashi-sound > * { animation: dashi-sound 1.2s ease-out infinite; }
.dashi-live .dashi-sound > *:nth-child(2) { animation-delay: .2s; }
.dashi-live .dashi-sound > *:nth-child(3) { animation-delay: .4s; }
.dashi-live .dashi-swing { transform-origin: 100px 156px; animation: dashi-swing 2.6s ease-in-out infinite; }

@keyframes dashi-blink-eye { 0%, 93%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(.12); } }
@keyframes dashi-idle { 0%, 100% { transform: translateY(0) scale(1, 1); } 50% { transform: translateY(-1.5px) scale(1.012, .988); } }
@keyframes dashi-sway { 0%, 100% { transform: rotate(-2deg); } 50% { transform: rotate(2deg); } }
@keyframes dashi-levitate { 0%, 100% { transform: translateY(-4px); } 50% { transform: translateY(-12px); } }
@keyframes dashi-levitate-shadow { 0%, 100% { transform: translateY(4px) scale(.85); opacity: .22; } 50% { transform: translateY(12px) scale(.7); opacity: .14; } }
@keyframes dashi-shake { 0%, 60%, 100% { transform: translateX(0) rotate(0); } 64% { transform: translateX(-3px) rotate(-2deg); } 70% { transform: translateX(3px) rotate(2deg); } 76% { transform: translateX(-2px) rotate(-1deg); } 82% { transform: translateX(2px) rotate(1deg); } }
@keyframes dashi-tilt { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-3deg); } }
@keyframes dashi-shrug { 0%, 55%, 100% { transform: translateY(0); } 25% { transform: translateY(-4px) scale(1.02, .98); } }
@keyframes dashi-shrug-hands { 0%, 55%, 100% { transform: translateY(0); } 25% { transform: translateY(-7px); } }
@keyframes dashi-run { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes dashi-surf { 0%, 100% { transform: translate(0, 0) rotate(0); } 50% { transform: translate(3px, -7px) rotate(-2deg); } }
@keyframes dashi-sigh { 0%, 100% { transform: scale(1, 1); } 40% { transform: scale(1.02, .98) translateY(1px); } 60% { transform: scale(.985, 1.015); } }
@keyframes dashi-spin { to { transform: rotate(360deg); } }
@keyframes dashi-steam { 0% { transform: translateY(6px); opacity: 0; } 30% { opacity: .9; } 100% { transform: translateY(-10px); opacity: 0; } }
@keyframes dashi-twinkle2 { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(.55); opacity: .45; } }
@keyframes dashi-glint { 0%, 70%, 100% { opacity: 0; transform: translateX(-4px); } 80% { opacity: .9; transform: translateX(3px); } }
@keyframes dashi-flex { 0%, 100% { transform: rotate(0) scale(1); } 50% { transform: rotate(-6deg) scale(1.06); } }
@keyframes dashi-aura { 0%, 100% { transform: scale(.94); opacity: .08; } 50% { transform: scale(1.03); opacity: .16; } }
@keyframes dashi-burst { 0%, 100% { transform: scale(.9) rotate(0); } 50% { transform: scale(1.08) rotate(8deg); } }
@keyframes dashi-sparks { 0% { transform: scale(.8); opacity: 0; } 30% { opacity: 1; } 100% { transform: scale(1.15); opacity: 0; } }
@keyframes dashi-drop { 0% { transform: translateY(-4px); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(16px); opacity: 0; } }
@keyframes dashi-beat { 0%, 60%, 100% { transform: scale(1); } 15% { transform: scale(1.15); } 30% { transform: scale(.97); } 45% { transform: scale(1.08); } }
@keyframes dashi-rise { 0% { transform: translateY(8px); opacity: 0; } 25%, 70% { opacity: 1; } 100% { transform: translateY(-16px); opacity: 0; } }
@keyframes dashi-leg { 0%, 100% { transform: translateX(-6px); } 50% { transform: translateX(7px); } }
@keyframes dashi-speed { 0% { transform: translateX(10px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateX(-14px); opacity: 0; } }
@keyframes dashi-drizzle { 0% { transform: translateY(-3px); opacity: 0; } 30% { opacity: 1; } 100% { transform: translateY(10px); opacity: 0; } }
@keyframes dashi-pom { from { transform: rotate(-9deg); } to { transform: rotate(9deg); } }
@keyframes dashi-rain { 0% { transform: translateY(-18px) rotate(-8deg); opacity: 0; } 15% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(40px) rotate(12deg); opacity: 0; } }
@keyframes dashi-page { 0%, 45%, 100% { transform: scaleX(1); } 60%, 85% { transform: scaleX(-1); } }
@keyframes dashi-pump { 0%, 100% { transform: translateY(0) rotate(0); } 40% { transform: translateY(-5px) rotate(-6deg); } }
@keyframes dashi-glow2 { 0%, 100% { opacity: .55; transform: scale(.95); } 50% { opacity: 1; transform: scale(1.06); } }
@keyframes dashi-paint-stroke { 0% { stroke-dashoffset: 110; } 45%, 80% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes dashi-brush { 0%, 100% { transform: rotate(-8deg); } 45%, 80% { transform: rotate(6deg); } }
@keyframes dashi-peek { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-5deg); } }
@keyframes dashi-tap { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
@keyframes dashi-press { 0%, 49% { fill: #FF7AB6; } 50%, 100% { fill: #3CCF91; } }
@keyframes dashi-wobble { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-10deg); } }
@keyframes dashi-sound { 0% { opacity: 0; transform: translateX(-6px); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateX(6px); } }
@keyframes dashi-swing { 0%, 100% { transform: rotate(-6deg); } 50% { transform: rotate(6deg); } }

@media (prefers-reduced-motion: reduce) {
  .dashi, .dashi *, .dashi .dashi-body { animation: none !important; }
}

/* The 'wave' pose's root <svg> carries class dashi-wave, which also matched the
   arm animation in app.css and rocked the whole mascot. Keep it on the arm only. */
svg.dashi.dashi-wave { animation: none; }

/* ---- loading ("Dashi is studying your posts…"): bounce, tilt, quick blinks, cycling dots */
.dashi-live.dashi-anim-think .dashi-body { animation: dashi-think 2.4s ease-in-out infinite; }
.dashi-live.dashi-anim-think .dashi-eyes > * { animation-duration: 3.2s; }
.dashi-anim-think .dashi-dots > * { animation: dashi-think-dot 1.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.dashi-anim-think .dashi-dots > *:nth-child(2) { animation-delay: .22s; }
.dashi-anim-think .dashi-dots > *:nth-child(3) { animation-delay: .44s; }
@keyframes dashi-think {
  0%, 100% { transform: translateY(0) rotate(0) scale(1, 1); }
  10% { transform: translateY(0) rotate(0) scale(1.06, .94); }
  28% { transform: translateY(-13px) rotate(-6deg) scale(.97, 1.03); }
  46% { transform: translateY(0) rotate(0) scale(1.05, .95); }
  56% { transform: translateY(0) rotate(0) scale(1, 1); }
  74% { transform: translateY(-9px) rotate(6deg) scale(.98, 1.02); }
  90% { transform: translateY(0) rotate(0) scale(1.03, .97); }
}
@keyframes dashi-think-dot {
  0%, 60%, 100% { opacity: .25; transform: translateY(0) scale(.8); }
  30% { opacity: 1; transform: translateY(-7px) scale(1.2); }
}
.loading-overlay .dashi { filter: drop-shadow(0 10px 24px rgba(124, 92, 255, .25)); }
.loading-msg.swap { animation: loading-msg-in .4s ease-out; }
@keyframes loading-msg-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }