帮助产品、设计和研发共同判断什么时候使用动效、使用什么动效，以及如何一致地实现和验收。这不是单纯的动画展示库，而是一套服务于团队决策、设计、实现和验收的金融交互动效规范。
先按用户意图归类，再映射到统一的时长、曲线和代码实现。
按实际使用场景组织，不按创建时间排序；保留原始矢量动画与实现文件，不计入标准动效模式数量。
默认直接使用基准值，只有在容器尺寸和运动距离明显变化时才允许调整。
统一节奏，避免每个业务分别使用 260 / 280 / 340ms。
100ms160ms180ms220ms240ms280ms320ms400ms180ms260ms420ms900ms1500ms按交互语义选择，而不是按设计师个人偏好选择。
动效不是为了让界面看起来更活跃，而是帮助用户理解反馈、状态和层级关系。金融产品的动效应保持稳定、克制、清晰、连续和高效。
运动路径和终点明确，减少弹跳、回弹和无意义的尺寸变化。
动效提供必要反馈，但不抢夺金额、状态和操作内容的注意力。
每个动作都应解释操作反馈、状态变化或空间关系。
前后状态之间应具有可追踪的关系，手势过程需要跟手且可中断。
动效不能延迟用户完成任务，高频操作应短且轻量。
prefers-reduced-motion，关闭位移与缩放后仍通过颜色、描边或透明度传达状态。先判断动效是否解决真实的交互问题，再选择具体模式。
已经确认需要动效？使用 Motion Advisor 查找对应的标准模式。
前往 Motion Advisor →当交互问题已经明确，但还不能确定应该选择哪个标准模式时使用。
通过操作反馈、连续拖动、加载状态、容器层级和页面导航等意图，辅助定位现有 Pattern。它是决策辅助工具，不替代前面的原则判断、基础参数和标准模式。
点击任意动效卡片，可查看 CSS / Web、iOS / SwiftUI 和 Android / Compose 的实现参考；复杂 Web 动效继续保留 GSAP 与 React 示例。
产品代码优先引用语义 Token，不在业务页面中直接散落毫秒值和贝塞尔参数。
:root {
--motion-duration-instant: 100ms;
--motion-duration-fast: 160ms;
--motion-duration-focus: 180ms;
--motion-duration-standard: 220ms;
--motion-duration-exit: 240ms;
--motion-duration-depth: 280ms;
--motion-duration-container: 320ms;
--motion-duration-emphasis: 400ms;
--motion-duration-semantic-quick: 180ms;
--motion-duration-semantic-standard: 260ms;
--motion-duration-semantic-emphasis: 420ms;
--motion-duration-loading-loop: 900ms;
--motion-duration-skeleton-shimmer: 1500ms;
--motion-ease-change: cubic-bezier(.2, 0, 0, 1);
--motion-ease-enter: cubic-bezier(.32, .72, 0, 1);
--motion-ease-exit: cubic-bezier(.4, 0, 1, 1);
--motion-ease-toast-enter: cubic-bezier(.2, .78, .2, 1);
--motion-ease-semantic-enter: cubic-bezier(.25, .8, .25, 1);
--motion-ease-semantic-change: cubic-bezier(.4, 0, .2, 1);
--motion-ease-linear: linear;
}