/* Motion — the brand's gentle looping animations (see readme.md "Motion").
   Keyframes are canonical, copied from the app prototype (ui_kits/app/index.html).
   Components reference these by name via inline `animation:` styles. */
@keyframes mo-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes mo-hop{0%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}45%{transform:translateY(0)}}
@keyframes mo-ring{0%{transform:scale(.55);opacity:.55}100%{transform:scale(1.7);opacity:0}}
@keyframes mo-note{0%{opacity:0;transform:translate(0,0) scale(.7)}15%{opacity:1}100%{opacity:0;transform:translate(14px,-40px) scale(1.15)}}
@keyframes mo-wave{0%,100%{height:5px}50%{height:14px}}
@media (prefers-reduced-motion:reduce){[style*="mo-"]{animation:none!important}}