用途：为界面添加微交互、动效设计、状态过渡与用户反馈，提升可用性与体验。适用场景包括：添加微交互反馈、实现页面与组件平滑过渡、设计加载状态与骨架屏、创建手势交互、构建通知与 toast 系统、实现拖拽界面、添加滚动触发动画、设计悬停与聚焦状态。
核心原则：动效应传达信息而非装饰，包括反馈（确认操作发生）、方向（元素来源与去向）、聚焦（引导注意重要变化）、连续性（过渡中保持上下文）。时长建议：100-150ms 用于微反馈（悬停、点击），200-300ms 用于小过渡（开关、下拉），300-500ms 用于中等过渡（模态、页面切换），500ms+ 用于复杂编排动画。缓动函数提供 ease-out、ease-in、ease-in-out、spring 等 CSS 变量。
主要能力与模式：按钮微交互（whileHover/whileTap 缩放配合 spring 过渡）；加载状态（骨架屏 animate-pulse、进度条）；状态过渡（开关切换、页面过渡使用 AnimatePresence）；反馈模式（点击涟漪效果）；手势交互（拖拽滑动关闭）；CSS 关键帧动画（fadeIn、pulse、spin）与 CSS 过渡。
使用方式：基于 Framer Motion 的 motion 组件与 AnimatePresence，配合 Tailwind 类名；CSS 部分使用 @keyframes 与 transition 属性。
无障碍与最佳实践：通过 prefers-reduced-motion 媒体查询和 matchMedia 尊重用户动效偏好；优先使用 transform 和 opacity 保证 60fps；统一时长尺度；优先 spring 物理动画；允许中断长动画；渐进增强；多设备测试。
常见问题：避免动画 width、height、top、left 导致卡顿；避免过度动画；动画期间不应阻止用户输入；卸载时清理监听器；谨慎使用 will-change。
限制：资料未提供具体收费、价格、平台支持范围及安装命令等信息。