用途
ss-motion 是 StyleSeed 体系中的一个动效应用技能，用于把一套命名动效（motion）套用到 React 组件上。它面向使用 framer-motion 的项目，帮助开发者按统一的「个性」和「动作」来添加交互动效，而不是每次手写参数。
主要能力
五套个性种子（Seeds）
技能内置五套种子，每套代表一种动效性格：
- Spring：bouncy、springy、playful、energetic、alive
- Silk：smooth、silky、fluid、elegant、composed、continuous
- Snap：snappy、quick、instant、decisive、sharp、precise
- Float：floaty、gentle、weightless、dreamy、ambient、drifting
- Pulse：rhythmic、punchy、pulsing、heartbeat、beat
技能会先把用户的描述词或品牌名映射到其中一套种子。例如「Toss style」「Arc style」对应 Spring，「Stripe style」「Notion style」对应 Silk，「Linear style」「Raycast style」「Vercel style」对应 Snap。若用户明确说出种子名，则按原样采用。
关键词动作库（Named motion keywords）
除种子外，动作库还提供带唯一关键词的专属动作，每个关键词都有可直接运行的代码片段：
- toggle-flip：3D Y 轴卡片翻转
- toggle-slide：滑动堆叠切换
- toggle-morph：胶囊 ⇄ 圆形形变
- toggle-curtain：自上而下 clip-path 擦除
- reveal-blur：blur(12px)→0 聚焦进入
- reveal-rise：遮罩 clip-path 文字上升
- reveal-unfold：从顶边 scaleY 展开
- pop-in：从 0 弹性过冲
- press-squish：缩小 + 倾斜
- tap-ripple：点击处径向涟漪
- pulse-beat：循环缩放脉冲
- wiggle：快速水平抖动
- shimmer：骨架屏加载扫光
- stagger-cascade：子元素依次淡入上升
使用场景推荐（Recommend mode）
当用户描述的是「这是什么」（如点赞按钮、弹窗、加载状态、信息流条目）而非感觉时，技能会从使用场景映射表中推荐动效，例如：主按钮/CTA 按下用 spring·press；弹窗/对话框进入用 silk·entrance；下拉/弹出菜单用 snap·entrance；列表/信息流条目出现用 stagger-cascade；点赞/收藏用 like-burst；加载/骨架屏用 shimmer；成功/确认用 pop-in；开关/标签切换用 toggle-flip；页面/路由切换用 silk·entrance；数字/余额/KPI/价格展示则不做动画。
两条反规则
- 一个产品只用一套种子：若项目已使用某套种子，应保持一致，不引入第二种性格。
- 绝不延迟内容：不要给余额、价格或搜索结果加进入动画；动效用于可感知的交互提示，而非内容本身。
使用方式
技能按以下步骤应用动效：
- 读取目标文件，定位用户所指的 JSX 元素（通常是 button、div、Card 等）。
- 确认导入路径：组件文件需能从 "framer-motion" 导入 motion（退出动效还需 AnimatePresence），并从 "@engine/motion" 导入所选种子；若项目未使用 @engine/* 别名，则用指向 engine/motion 的相对路径。
- 把目标标签替换为 <motion.X> 并展开种子的配方，例如：
// hover 示例
<motion.button {...spring.hover}>Save</motion.button>
// press + hover 组合
<motion.button {...spring.press} {...spring.hover}>Save</motion.button>
// entrance（挂载）
<motion.div {...silk.entrance}>...</motion.div>
// exit（需在树上某处有 AnimatePresence 包裹）
<AnimatePresence>
{open && <motion.div {...silk.entrance} {...silk.exit} />}
</AnimatePresence>
// layout（FLIP）
<motion.div {...snap.layout}>...</motion.div>
注意：不要把参数内联展开，始终以展开（spread）方式引用配方。
- 在长时间运行的界面上尊重 prefers-reduced-motion：一次性交互（hover/press）framer-motion 已做节流；对于长驻页面的挂载/退出/布局序列，从 @engine/motion 导入 usePrefersReducedMotion 和 REDUCED_TRANSITION，在开启减弱动效时覆盖 transition。
- 重新读取文件校验 JSX 仍可解析（括号匹配、motion 标签闭合、若用了 exit 则 AnimatePresence 就位）。
- 告知用户所应用的种子与上下文，并推荐一个可能想接着加的关联上下文。
上下文检测
技能会从提示中推断五种上下文之一：hover（悬停）、press（按下/点击）、entrance（出现/挂载）、exit（离开/关闭，需 AnimatePresence）、layout（布局变化/FLIP）。若含糊则默认 entrance；若多种合理（如按钮同时需要 hover 和 press），则两者都应用。
注册表优先的产物边界
当 .styleseed/project.json 与 .styleseed/artifacts/index.json 存在时，先解析请求的 artifact ID，然后只读取 .styleseed/bundles/<artifact-id>.md 和 .styleseed/manifests/<artifact-id>.json。注册表项目绝不回退到全局旧版 bundle。仅当不存在注册表时，旧版项目才可使用 .styleseed/effective-rules.md。
默认处理
- 未给文件 → 询问「哪个文件？」
- 无感觉词 → 询问「有感觉词、品牌或种子名吗？」
- 感觉为「natural」或「像真实应用」→ 默认 Silk（五套中最稳妥）
- 元素是 CTA 按钮 → 同时应用 press
适用场景
适用于使用 framer-motion 的 React 项目，需要为单个组件添加统一风格的进入、悬停、按下、退出或布局动效时。也适用于用户给出感觉词、品牌名或具体动作关键词，希望快速套用一致动效的场景。
限制
- 不适用于通用 framer-motion 文档或学习，请访问 framer-motion 官网。
- 不处理非 React 动效（纯 CSS 过渡、GSAP）。本技能只针对 motion.X JSX。
- 不处理完整滚动联动时间线或视差效果（超出范围）。这类效果在营销/落地/品牌页允许（DESIGN-LANGUAGE §43 Cinematic tier），但需用滚动库直接构建，而非本技能；在应用/数据界面则禁止。
- 不用于微调已有的 FadeIn/FadeUp/Stagger 包装器，那应直接编辑 engine/components/ui/motion.tsx。
- 禁止发明新种子名（恰好只有五套）。
- 禁止从本技能编辑 engine/motion/seeds/*.ts（这些是手工校准的）。
- 禁止引入第三方动画库（gsap、anime.js）。StyleSeed 只针对 framer-motion。
- 禁止通过本技能添加滚动联动、视差或无限动画（骨架脉冲除外）。
- 若用户说的关键词不存在，应建议表中最近的真实关键词，绝不发明关键词。
其他说明
使用本工作流前，需先执行每会话一次的更新预检（update preflight）。