M5-4任务拆解：动画与复杂交互场景

这份文档用于定义 M5-4 的具体任务拆解。本轮目标是在 M5-1、M5-2、M5-3 之后，补入一条围绕动画与复杂交互链路的扩展线。

本轮目标

新增一篇围绕动画状态、复杂交互链路和动画协调层的案例文档，并把它接入现有导航层与统一框架中。

本轮对象

本轮主要来源：

11Vue学习/program/vue-sell-app/src/components/shopcart/shopcart.vue
11Vue学习/program/vue-sell-app/src/components/food/food.vue
11Vue学习/program/vue-sell-app/src/components/header/header.vue

同时参考 motion-v 的动画组织思路。

拆解顺序

任务一：梳理交互链路

识别本轮真正的复杂度中心：

购物车下落动画
浮层进入离开
列表、详情与购物车联动
动画状态和业务状态的边界

任务二：形成详细设计

设计本轮案例将如何组织：

动画协调层
交互状态层
业务状态层
声明式动画与 transform 友好实现

任务三：案例开发

产出案例文档：

../动画与复杂交互链路重构.md

任务四：体系接入

更新这些入口：

../README.md
../笔记.md
../Vue重构案例导航图.md
../Vue练习项目重构统一框架.md
./00-里程碑规划.md

任务五：自测与复盘

检查 Markdown 链接
检查入口挂载是否完整
新增本轮开发记录文档

本轮完成标准

本轮完成时，应满足：

已有独立复杂交互案例文档
已更新导航与方法层
已补任务拆解、详细设计与开发记录
已完成自测
已完成提交与推送