dsh-drawai 0.4.2 → 0.4.3

package/lib/motion/shotcraft/upstream/references/shots/interaction/autolayout-gap-dial.md

@@ -1,60 +1,60 @@
----
-name: autolayout-gap-dial
-一句话: 间距拨盘驱动布局——一排链接块带框选描边+缝隙间距标注，徽章数字逐格跳动、块被参数实时推开再弹簧回弹归位；"参数驱动布局"的可视化
-适用: 设计工具/低代码产品的"改一个数、界面跟着动"卖点镜头；"用设计工具语义做包装"的品类语言
-时长: ~5s（150f：框选入场 + 预备回收 10f + 拉松 34f + 屏息 hold 20f + 弹簧回弹 + 落定 hold）
-能量: 中（工具理性型，爽点在数字与位移的锁定同步）
----
-
-## 意图
-"参数改了、UI 变了"是设计工具的核心承诺，但通常拍成"点面板→切
-结果"的前后对比，因果被剪掉了。本卡把因果拍成连续镜头：间距徽章
-数字逐格跳，链接块**同帧**被推开，测量线实时拉长——数字就是缰绳，
-布局就是马。框选描边+8 手柄+间距标注全是设计工具的母语，观众一眼
-认出"这是在工具里调参数"。回程故意用欠阻尼弹簧过冲（缩到比起点
-更紧再回稳），把"归位"做成一次有弹性的收尾。与 type-and-filter
-分工：那是"输入内容→列表收敛"的检索因果，本卡是"拨数值→几何
-重排"的参数因果。
-
-## 动效核心
-- **gap 一个参数管全部**：块位置由 gap 重算（整排保持居中）、测量
-  线宽=gap、徽章钉缝隙中心、顶部大读数与拨盘刻度尺——所有元素从同一数值派生，锁定同步
-  是本卡的全部说服力
-- 参数曲线：先预备回收 12→6（10f swift，"往回收再冲出去"）；去程 6→104 走 34f swift
-  （不对称 in-out：起步稍快、落点很软）；屏息 hold 20f；回程 spring(damping 9, stiffness 80,
-  mass 1.1) 故意过冲到起点以下再回稳（过冲段 ×0.45 压缩：104→约 7 再回 12，gap 永不为负）
-- 读数做主角：顶部 196px 细体 tabular 数值 + px 单位 + 760px 拨盘刻度尺（刻度随 gap 横滚过中心
-  金针）；拨动中读数由白转测量金（带 ~6f 余温），松手回稳后褪回白；数值步进 2 显示，
-  跳数 scale 脉冲 1+0.06·|sin| × 速度门限
-- 导航块按自身速度做横向运动模糊（块速度 = (i−2)·dgap/dt，外侧块拖影最长），静止为 0
-- 框选描边 spring 从外侧 26px 收拢，8 手柄 1.2f 错峰弹出，图层名旁实时显示整排尺寸；
-  间距标注 = 虚线延长线 ×2 + 测量线带端刺 + 跟随徽章，错峰升起
-- demo 美术：graphite 暗场，选择白 + 测量金两色语义（画面里只有被拨动的数是有颜色的）；
-  相机整段极缓推近 2.5%
-
-## 参数表
-| 参数 | 典型值 | 调节手感 |
-|------|--------|----------|
-| gap 幅度 | 12→104px（原片 20→24，demo 按裁决加大） | 原片幅度肉眼几乎不可感——可感性判例：看不出就加大做极端版；实战至少 4–5 倍行程 |
-| 预备 | 12→6，10f swift | 先收后放给主动作蓄力；回收 >30% 读作数值抖动 |
-| 去程时长 | 34f swift | 快了读作抽搐；慢过 60f 数字跳动和位移的绑定感松掉 |
-| 屏息 hold | 20f | 让观众读清"最松"的那一帧；<12f 读不到峰值 |
-| 回程弹簧 | damping 9 → 过冲到起点以下再回稳（过冲段 ×0.45，最紧约 7px） | 过冲是"松手回弹"的手感来源；damping ≥13 直落可惜 |
-| 数字步进 | 步进 2 + 跳数 scale 脉冲 0.06 × 速度门限 | 逐 1 跳太碎读作毫秒表；步进是"拨盘咔哒"的颗粒感 |
-| 运动模糊 | 横向 stdDeviation = min(9, |块速度|×0.5) | 只在拨动段出现；全程常驻会让块字读不清 |
-| 标注几何 | 延长线 58px、测量线钉块底 +74px、徽章钉缝隙中心 | 标注必须随 gap 实时重算——任何一处滞后即穿帮 |
-| 块宽 | 不等宽（252/206/278/268/220，高 120） | 等宽读作示意图；不等宽才像真导航 |
-
-## 已知坑
-- demo 在灰阶/占位素材上调校通过——参数是调校起点非实战定稿，
-  首次实战须以真实素材回验
-- 数字与位移必须同源同帧：徽章显示值和块坐标都从同一个 gap 派生，分开动画哪怕差 1f，"参数驱动"的信任即碎
-- demo 顶部大读数 + 拨盘刻度尺与布局同源同帧，实战里若画面已有真实工具面板（检查器数值框）就删掉大读数，别双重报数
-- 同族扩展：gap 只是一维，radius/padding/rotation 同语法可换参数——但一镜只拨一个参数，两个以上读作乱调
-- 框选描边+手柄是"设计工具语义"借用（figma/framer 母语），非设计工具受众的片子慎用，读不懂框选就只剩块在挪
-- 声音：徽章每跳一格一声极轻 tick（拨盘咔哒），回弹落定一声 pop；tick 密度跟步进走
-
-## 参考实现
-demos/interaction/autolayout-gap-dial/
-（AutolayoutGapDial.tsx）
-原片出处：framer-ai 4.5–5.5s
+---
+name: autolayout-gap-dial
+一句话: 间距拨盘驱动布局——一排链接块带框选描边+缝隙间距标注，徽章数字逐格跳动、块被参数实时推开再弹簧回弹归位；"参数驱动布局"的可视化
+适用: 设计工具/低代码产品的"改一个数、界面跟着动"卖点镜头；"用设计工具语义做包装"的品类语言
+时长: ~5s（150f：框选入场 + 预备回收 10f + 拉松 34f + 屏息 hold 20f + 弹簧回弹 + 落定 hold）
+能量: 中（工具理性型，爽点在数字与位移的锁定同步）
+---
+
+## 意图
+"参数改了、UI 变了"是设计工具的核心承诺，但通常拍成"点面板→切
+结果"的前后对比，因果被剪掉了。本卡把因果拍成连续镜头：间距徽章
+数字逐格跳，链接块**同帧**被推开，测量线实时拉长——数字就是缰绳，
+布局就是马。框选描边+8 手柄+间距标注全是设计工具的母语，观众一眼
+认出"这是在工具里调参数"。回程故意用欠阻尼弹簧过冲（缩到比起点
+更紧再回稳），把"归位"做成一次有弹性的收尾。与 type-and-filter
+分工：那是"输入内容→列表收敛"的检索因果，本卡是"拨数值→几何
+重排"的参数因果。
+
+## 动效核心
+- **gap 一个参数管全部**：块位置由 gap 重算（整排保持居中）、测量
+  线宽=gap、徽章钉缝隙中心、顶部大读数与拨盘刻度尺——所有元素从同一数值派生，锁定同步
+  是本卡的全部说服力
+- 参数曲线：先预备回收 12→6（10f swift，"往回收再冲出去"）；去程 6→104 走 34f swift
+  （不对称 in-out：起步稍快、落点很软）；屏息 hold 20f；回程 spring(damping 9, stiffness 80,
+  mass 1.1) 故意过冲到起点以下再回稳（过冲段 ×0.45 压缩：104→约 7 再回 12，gap 永不为负）
+- 读数做主角：顶部 196px 细体 tabular 数值 + px 单位 + 760px 拨盘刻度尺（刻度随 gap 横滚过中心
+  金针）；拨动中读数由白转测量金（带 ~6f 余温），松手回稳后褪回白；数值步进 2 显示，
+  跳数 scale 脉冲 1+0.06·|sin| × 速度门限
+- 导航块按自身速度做横向运动模糊（块速度 = (i−2)·dgap/dt，外侧块拖影最长），静止为 0
+- 框选描边 spring 从外侧 26px 收拢，8 手柄 1.2f 错峰弹出，图层名旁实时显示整排尺寸；
+  间距标注 = 虚线延长线 ×2 + 测量线带端刺 + 跟随徽章，错峰升起
+- demo 美术：graphite 暗场，选择白 + 测量金两色语义（画面里只有被拨动的数是有颜色的）；
+  相机整段极缓推近 2.5%
+
+## 参数表
+| 参数 | 典型值 | 调节手感 |
+|------|--------|----------|
+| gap 幅度 | 12→104px（原片 20→24，demo 按裁决加大） | 原片幅度肉眼几乎不可感——可感性判例：看不出就加大做极端版；实战至少 4–5 倍行程 |
+| 预备 | 12→6，10f swift | 先收后放给主动作蓄力；回收 >30% 读作数值抖动 |
+| 去程时长 | 34f swift | 快了读作抽搐；慢过 60f 数字跳动和位移的绑定感松掉 |
+| 屏息 hold | 20f | 让观众读清"最松"的那一帧；<12f 读不到峰值 |
+| 回程弹簧 | damping 9 → 过冲到起点以下再回稳（过冲段 ×0.45，最紧约 7px） | 过冲是"松手回弹"的手感来源；damping ≥13 直落可惜 |
+| 数字步进 | 步进 2 + 跳数 scale 脉冲 0.06 × 速度门限 | 逐 1 跳太碎读作毫秒表；步进是"拨盘咔哒"的颗粒感 |
+| 运动模糊 | 横向 stdDeviation = min(9, |块速度|×0.5) | 只在拨动段出现；全程常驻会让块字读不清 |
+| 标注几何 | 延长线 58px、测量线钉块底 +74px、徽章钉缝隙中心 | 标注必须随 gap 实时重算——任何一处滞后即穿帮 |
+| 块宽 | 不等宽（252/206/278/268/220，高 120） | 等宽读作示意图；不等宽才像真导航 |
+
+## 已知坑
+- demo 在灰阶/占位素材上调校通过——参数是调校起点非实战定稿，
+  首次实战须以真实素材回验
+- 数字与位移必须同源同帧：徽章显示值和块坐标都从同一个 gap 派生，分开动画哪怕差 1f，"参数驱动"的信任即碎
+- demo 顶部大读数 + 拨盘刻度尺与布局同源同帧，实战里若画面已有真实工具面板（检查器数值框）就删掉大读数，别双重报数
+- 同族扩展：gap 只是一维，radius/padding/rotation 同语法可换参数——但一镜只拨一个参数，两个以上读作乱调
+- 框选描边+手柄是"设计工具语义"借用（figma/framer 母语），非设计工具受众的片子慎用，读不懂框选就只剩块在挪
+- 声音：徽章每跳一格一声极轻 tick（拨盘咔哒），回弹落定一声 pop；tick 密度跟步进走
+
+## 参考实现
+demos/interaction/autolayout-gap-dial/
+（AutolayoutGapDial.tsx）
+原片出处：framer-ai 4.5–5.5s

package/lib/motion/shotcraft/upstream/references/shots/interaction/canvas-materialize-moves.md

@@ -1,57 +1,57 @@
----
-name: canvas-materialize-moves
-一句话: 内容"物化上画布"两式——panel-to-canvas 行倒卡（面板表格行沿弧线飞出、跨容器变形成画布卡片）与 diagram-cascade 级联生成树（prompt 打字后节点逐层弹出、连线先于节点生长）
-适用: AI/协作工具"生成结果落到画布上"的叙事段落；A 式讲"已有内容换了个存在形态"，B 式讲"从一句话长出一棵结构"
-时长: A ~5s（150f）/ B ~6s（180f）
-能量: 中
-标签: ui-entrance
----
-
-## 意图
-库内生成叙事只有"窗口内逐字写出"（document-typewriter-reveal 文档自己写出来）
-和"图表自己活起来"（chart-live-moves），没有词管**内容离开容器、在
-开放画布上物化成新实体**。本卡补这一块：画布是舞台，生成物是登台的
-演员。A 式的命门是跨容器形态迁移——同一条内容从"行"变成"卡"，位置
-/宽高/圆角/内容布局在一条 spring 上同步插值，观众读到"是它飞过去
-变的"而不是"删一个加一个"；B 式的命门是级联时序——线牵出节点、层
-喂出层，结构感来自先后而非同时。
-
-## 两式选型
-| 式 | 做法 | 适用 |
-|----|------|------|
-| A panel-to-canvas 行倒卡 | 光标逐个点复选框打勾→按钮按下→三行先拔起再沿上抛弧线错峰飞出，途中行形态与卡形态交叉淡化，落位带倾角与落地压扁；面板行槽塌陷成虚线留白 | 批量导入/一键上板：内容从列表态迁移为空间态 |
-| B diagram-cascade 级联生成树 | prompt 逐字敲出（敲完描边确认、提交后描边流光=生成中）→prompt 底部滴线接根（渐变描边主角）→2 子→4 孙逐层从顶端口拉出，折角连线带彗星头先行 10f，相机从 prompt 特写拉远揭示全树，成树后整棵呼吸一拍 | AI 生成结构图/脑图/ER 图：一句话长出一棵树 |
-
-## 参数表
-| 参数 | 典型值 | 调节手感 |
-|------|--------|----------|
-| A 打勾 | 14/24/34f 逐个（光标 swift 弧线逐个点中），spring(damping 11, stiffness 300) pop + 勾线 7f 描出 | 打勾是"预告"，全删观众不知道要飞谁；同帧齐勾读作静态已选 |
-| A 起飞错峰 | 按钮 52f 按下，三行 56/62/68f 拔起（4f：放大 2% + 阴影加深）后起飞（错峰 6f） | 同帧齐飞读作复制粘贴；错峰 >12f 尾行像掉队；不拔起直接飞读作被删除 |
-| A 飞行插值 | spring(damping 17, stiffness 95, mass 0.9)；位置走二次贝塞尔，中点上抬 220px；宽高晚 3f 收敛 | 直线飞读作平移不读作"倒出来"；中点抬 <100px 弧线感消失；尺寸与位置同步则少了"父先子后"的重量 |
-| A 形态迁移 | 行 626×104 → 卡 486×300，圆角 18→24，rowOp 在 us 0.08→0.4 灭、cardOp 在 0.5→0.8 亮 | 两套内容交叉淡化必须错开——中段两态同显即穿帮 |
-| A 落位倾角 | −2.5 / 1.8 / −1.2°，落地 6f scaleY 0.97 压扁回弹 | 全正读作网格排版；>4° 读作散落故障 |
-| A 速度模糊 | SpeedBlur amount 0.32、max 14（按弧线速度方向） | 只在飞行段；落定后归零 |
-| B 打字 | 每字 0.95–1.2f 不均匀、空格停 1.7f；敲完 prompt 条描边转紫确认，+4f 按下提交键 | 匀速打字读作机器；无确认态则"敲完"与"开始生成"之间没有因果扣 |
-| B 相机 | 开场 1.3× 推近 prompt 居中；提交后 72f smooth 拉远到 1.0 | 不推近则前 2s 画面下半空着；拉远要与级联同时进行，树长在镜头"退"出来的空间里 |
-| B 级联时序 | 根 = 提交 +14f，层间隔 22f、同层兄弟错峰 5f；节点 spring(damping 14, stiffness 190)，缩放原点 = 顶边中点（从端口拉出） | 层间隔 <12f 读作一次性全出；兄弟同帧读作复制；中心缩放读作弹窗 |
-| B 连线先行 | SVG 圆弧折角 path（父底端口→中线→子顶端口）描线 16f ease-out，比子节点早 10f；线头一颗彗星光点 | "线牵出节点"是因果感来源；线晚于节点就成了补笔 |
-| B 收尾呼吸 | 末节点 +22f 起，以树心为原点 scale 1→1.03→1（smooth，28f），背后极光同步亮一档 | 呼吸是"成树"的句号；>1.06 读作缩放故障 |
-
-## 已知坑
-- demo 在灰阶/占位素材上调校通过——参数是调校起点非实战定稿，
-  首次实战须以真实素材回验
-- 与 chart-live-moves 分工：那卡是数据图表自身的活性（流线/点阵/爆轴），
-  B 式是结构图的**诞生过程**——图活着≠图正在被生成，别拿 B 式去演已有图表
-- A 式行槽必须塌陷成虚线留白——行飞走后原位完好如初，"迁移"就退化成
-  "复制"，语义全失
-- A 式交叉淡化窗口（rowOp 灭于 u≈0.45 前、cardOp 亮于其后）是防穿帮的
-  命门；spring 有过冲，u 可能短暂 >1，内容 opacity 都要 clamp
-- B 式呼吸原点必须是树的视觉重心（demo 960,620）而非画面中心，
-  不然读作整屏 zoom
-- B 式彗星头靠路径弧长取点：折角用 SVG 圆弧（A 命令）而非二次贝塞尔，长度才能解析算准，
-  线头与描线端点不脱节
-
-## 参考实现
-demos/interaction/canvas-materialize-moves/
-（DiagramCascadeBuild.tsx / PanelToCanvasMaterialize.tsx）
-原片出处：miro-promo 84–92s（A 式）/ 104–116s（B 式）
+---
+name: canvas-materialize-moves
+一句话: 内容"物化上画布"两式——panel-to-canvas 行倒卡（面板表格行沿弧线飞出、跨容器变形成画布卡片）与 diagram-cascade 级联生成树（prompt 打字后节点逐层弹出、连线先于节点生长）
+适用: AI/协作工具"生成结果落到画布上"的叙事段落；A 式讲"已有内容换了个存在形态"，B 式讲"从一句话长出一棵结构"
+时长: A ~5s（150f）/ B ~6s（180f）
+能量: 中
+标签: ui-entrance
+---
+
+## 意图
+库内生成叙事只有"窗口内逐字写出"（document-typewriter-reveal 文档自己写出来）
+和"图表自己活起来"（chart-live-moves），没有词管**内容离开容器、在
+开放画布上物化成新实体**。本卡补这一块：画布是舞台，生成物是登台的
+演员。A 式的命门是跨容器形态迁移——同一条内容从"行"变成"卡"，位置
+/宽高/圆角/内容布局在一条 spring 上同步插值，观众读到"是它飞过去
+变的"而不是"删一个加一个"；B 式的命门是级联时序——线牵出节点、层
+喂出层，结构感来自先后而非同时。
+
+## 两式选型
+| 式 | 做法 | 适用 |
+|----|------|------|
+| A panel-to-canvas 行倒卡 | 光标逐个点复选框打勾→按钮按下→三行先拔起再沿上抛弧线错峰飞出，途中行形态与卡形态交叉淡化，落位带倾角与落地压扁；面板行槽塌陷成虚线留白 | 批量导入/一键上板：内容从列表态迁移为空间态 |
+| B diagram-cascade 级联生成树 | prompt 逐字敲出（敲完描边确认、提交后描边流光=生成中）→prompt 底部滴线接根（渐变描边主角）→2 子→4 孙逐层从顶端口拉出，折角连线带彗星头先行 10f，相机从 prompt 特写拉远揭示全树，成树后整棵呼吸一拍 | AI 生成结构图/脑图/ER 图：一句话长出一棵树 |
+
+## 参数表
+| 参数 | 典型值 | 调节手感 |
+|------|--------|----------|
+| A 打勾 | 14/24/34f 逐个（光标 swift 弧线逐个点中），spring(damping 11, stiffness 300) pop + 勾线 7f 描出 | 打勾是"预告"，全删观众不知道要飞谁；同帧齐勾读作静态已选 |
+| A 起飞错峰 | 按钮 52f 按下，三行 56/62/68f 拔起（4f：放大 2% + 阴影加深）后起飞（错峰 6f） | 同帧齐飞读作复制粘贴；错峰 >12f 尾行像掉队；不拔起直接飞读作被删除 |
+| A 飞行插值 | spring(damping 17, stiffness 95, mass 0.9)；位置走二次贝塞尔，中点上抬 220px；宽高晚 3f 收敛 | 直线飞读作平移不读作"倒出来"；中点抬 <100px 弧线感消失；尺寸与位置同步则少了"父先子后"的重量 |
+| A 形态迁移 | 行 626×104 → 卡 486×300，圆角 18→24，rowOp 在 us 0.08→0.4 灭、cardOp 在 0.5→0.8 亮 | 两套内容交叉淡化必须错开——中段两态同显即穿帮 |
+| A 落位倾角 | −2.5 / 1.8 / −1.2°，落地 6f scaleY 0.97 压扁回弹 | 全正读作网格排版；>4° 读作散落故障 |
+| A 速度模糊 | SpeedBlur amount 0.32、max 14（按弧线速度方向） | 只在飞行段；落定后归零 |
+| B 打字 | 每字 0.95–1.2f 不均匀、空格停 1.7f；敲完 prompt 条描边转紫确认，+4f 按下提交键 | 匀速打字读作机器；无确认态则"敲完"与"开始生成"之间没有因果扣 |
+| B 相机 | 开场 1.3× 推近 prompt 居中；提交后 72f smooth 拉远到 1.0 | 不推近则前 2s 画面下半空着；拉远要与级联同时进行，树长在镜头"退"出来的空间里 |
+| B 级联时序 | 根 = 提交 +14f，层间隔 22f、同层兄弟错峰 5f；节点 spring(damping 14, stiffness 190)，缩放原点 = 顶边中点（从端口拉出） | 层间隔 <12f 读作一次性全出；兄弟同帧读作复制；中心缩放读作弹窗 |
+| B 连线先行 | SVG 圆弧折角 path（父底端口→中线→子顶端口）描线 16f ease-out，比子节点早 10f；线头一颗彗星光点 | "线牵出节点"是因果感来源；线晚于节点就成了补笔 |
+| B 收尾呼吸 | 末节点 +22f 起，以树心为原点 scale 1→1.03→1（smooth，28f），背后极光同步亮一档 | 呼吸是"成树"的句号；>1.06 读作缩放故障 |
+
+## 已知坑
+- demo 在灰阶/占位素材上调校通过——参数是调校起点非实战定稿，
+  首次实战须以真实素材回验
+- 与 chart-live-moves 分工：那卡是数据图表自身的活性（流线/点阵/爆轴），
+  B 式是结构图的**诞生过程**——图活着≠图正在被生成，别拿 B 式去演已有图表
+- A 式行槽必须塌陷成虚线留白——行飞走后原位完好如初，"迁移"就退化成
+  "复制"，语义全失
+- A 式交叉淡化窗口（rowOp 灭于 u≈0.45 前、cardOp 亮于其后）是防穿帮的
+  命门；spring 有过冲，u 可能短暂 >1，内容 opacity 都要 clamp
+- B 式呼吸原点必须是树的视觉重心（demo 960,620）而非画面中心，
+  不然读作整屏 zoom
+- B 式彗星头靠路径弧长取点：折角用 SVG 圆弧（A 命令）而非二次贝塞尔，长度才能解析算准，
+  线头与描线端点不脱节
+
+## 参考实现
+demos/interaction/canvas-materialize-moves/
+（DiagramCascadeBuild.tsx / PanelToCanvasMaterialize.tsx）
+原片出处：miro-promo 84–92s（A 式）/ 104–116s（B 式）

package/lib/motion/shotcraft/upstream/references/shots/interaction/chip-grid-single-select-blackout.md

@@ -1,51 +1,51 @@
----
-name: chip-grid-single-select-blackout
-一句话: 五个选项 chip 以 3+2 居中排布逐个淡入；选中帧先插一帧灰色按压块，紧接数帧内底色变墨黑、文字变白并做 1→1.04→1 极轻回弹，其余 chip 淡到 18% 但位置锁死；随后余项归零，黑 chip 上移收窄，下方升起结算价格
-适用: 单选/套餐/档位选择的交互演示；"选了它之后会怎样"的因果镜头；价格/参数结算类链路
-时长: 约5.5s（165f@30fps）
-能量: 中低（唯一的爆点是那一帧灰闪，其余都在收）
----
-
-## 意图
-一帧灰闪 + 三帧反黑，是把真实 UI 的 `:active → :selected` 两级状态
-拆开演。观众看到的是"手指按下"再"系统确认"，而不是一次渐变。其余
-chip 降到 18% 而**位置绝不移动**：一旦重排，观众会以为页面刷新了，
-"单选"的语义就丢了。
-
-## 动效核心
-- 5 个 chip 分 3+2 两行居中（1080p 原生：高 96、圆角 48、gap 22、36px 字，固定宽 346/364/476/236/330），
-  8f 起按 3f 间隔 snappy 升起；上方眉题 + 84px 问句先到
-- 光标 26–54f 从右下走 swift 弧线移到目标 chip（因果预告），56f 按下
-- **1 帧按压灰闪**：仅 FS=56 这一帧，`rgba(120,128,146,.5)` 覆盖层
-- **反黑**：57→62f linear（5 帧）驱动背景 白→墨黑 `#0b1020`、描边、文字 墨→白，同时 ✓ 从 0 宽长出
-- **按压回弹**：`sc = 1 + sin(pr·π)*0.04`，pr 走 57→66f——正弦保证起止都精确回到 1
-- **余项降级**：57→66f outQuad 把 opacity 压到 18%，`transform` 恒为 `none`
-- 主角光：反黑后 chip 底下亮一圈极淡钴蓝落地光（只给主角一次），阴影随抬升变深变大
-- **收束**：101f 起（选中后≈1.5s）余项 9f 归零；黑 chip 18f smooth 上移到 y=330、scale→0.88、
-  横向回中线（几何由固定宽算出，不运行时测量）；问句同时上移淡出让位
-- 结算：108f 原价 $42.00 升起 → 118f 一道划线划掉并退灰 → 116f 起现价 $34.44 逐字升起（180px）
-  → 128f 钴蓝「Save 18% · billed $413.28 yearly」overshoot 弹出；134–165f hold
-
-## 参数表
-| 参数 | 典型值 | 调节手感 |
-|------|--------|----------|
-| 入场 | 8f 起、间隔 3f、各 16f snappy | 5 个 chip 在 1s 内铺完，把时间留给选中段 |
-| 选中时刻 | FS = 56f（约全片 1/3） | 前段读题、后段看结果；早于 40f 观众还没读完选项 |
-| 灰闪 | 1 帧，rgba(120,128,146,.5) | **就一帧**：给 2 帧以上就读作 hover 高亮，不是按下 |
-| 反黑 | 57→62f linear（5f） | linear 是故意的：加 ease 会让"变黑"这件事有过程感，太软 |
-| 按压回弹 | 1 + sin(pr·π)·0.04，跨 9f | 0.04 是极轻；到 0.1 就成了弹跳按钮，抢戏 |
-| 余项降级 | 降到 18%，位置 transform:none | **位置锁死是命门**：降到 18% 仍在原位，才读作"没被选中"而非"消失了" |
-| 收束时刻 | 101f（选中后≈1.5s）起，18f smooth in-out | 1.5s 是让观众看清选中态的最短驻留；缩到 0.5s 就赶 |
-| 上移收窄 | 到 y=330、scale→0.88，横向补回中线 | 不补中线的话上移后会偏在左边，读作"被拖走"；缩过 0.85 字低于 32px |
-| 结算顺序 | 原价 → 划线 → 现价 → 省额胶囊，间隔 8–10f | 先给旧价再划掉，观众才读得到"变便宜了"的因果 |
-
-## 已知坑
-- 选中 chip 的回中线位移由固定 chip 宽算出（不运行时测量 offsetWidth）——改文案时要同步改宽度表，
-  否则字溢出或上移后偏离中线
-- 其余 chip 的 `transform` 必须显式写 `'none'`，不能靠 flex 自动重排，否则余项归零时会横向滑动
-- 占位内容：5 条计费周期选项名（Annual billing … Nonprofit rate）+ 结算「$42.00 → $34.44/mo、Save 18%」，
-  落地全部替换；选项名过长会撑破固定宽（第三条 "Two-year commitment" 是长名压力测试）
-
-## 参考实现
-demos/interaction/chip-grid-single-select-blackout/
-（ChipGridSingleSelectBlackout.tsx）
+---
+name: chip-grid-single-select-blackout
+一句话: 五个选项 chip 以 3+2 居中排布逐个淡入；选中帧先插一帧灰色按压块，紧接数帧内底色变墨黑、文字变白并做 1→1.04→1 极轻回弹，其余 chip 淡到 18% 但位置锁死；随后余项归零，黑 chip 上移收窄，下方升起结算价格
+适用: 单选/套餐/档位选择的交互演示；"选了它之后会怎样"的因果镜头；价格/参数结算类链路
+时长: 约5.5s（165f@30fps）
+能量: 中低（唯一的爆点是那一帧灰闪，其余都在收）
+---
+
+## 意图
+一帧灰闪 + 三帧反黑，是把真实 UI 的 `:active → :selected` 两级状态
+拆开演。观众看到的是"手指按下"再"系统确认"，而不是一次渐变。其余
+chip 降到 18% 而**位置绝不移动**：一旦重排，观众会以为页面刷新了，
+"单选"的语义就丢了。
+
+## 动效核心
+- 5 个 chip 分 3+2 两行居中（1080p 原生：高 96、圆角 48、gap 22、36px 字，固定宽 346/364/476/236/330），
+  8f 起按 3f 间隔 snappy 升起；上方眉题 + 84px 问句先到
+- 光标 26–54f 从右下走 swift 弧线移到目标 chip（因果预告），56f 按下
+- **1 帧按压灰闪**：仅 FS=56 这一帧，`rgba(120,128,146,.5)` 覆盖层
+- **反黑**：57→62f linear（5 帧）驱动背景 白→墨黑 `#0b1020`、描边、文字 墨→白，同时 ✓ 从 0 宽长出
+- **按压回弹**：`sc = 1 + sin(pr·π)*0.04`，pr 走 57→66f——正弦保证起止都精确回到 1
+- **余项降级**：57→66f outQuad 把 opacity 压到 18%，`transform` 恒为 `none`
+- 主角光：反黑后 chip 底下亮一圈极淡钴蓝落地光（只给主角一次），阴影随抬升变深变大
+- **收束**：101f 起（选中后≈1.5s）余项 9f 归零；黑 chip 18f smooth 上移到 y=330、scale→0.88、
+  横向回中线（几何由固定宽算出，不运行时测量）；问句同时上移淡出让位
+- 结算：108f 原价 $42.00 升起 → 118f 一道划线划掉并退灰 → 116f 起现价 $34.44 逐字升起（180px）
+  → 128f 钴蓝「Save 18% · billed $413.28 yearly」overshoot 弹出；134–165f hold
+
+## 参数表
+| 参数 | 典型值 | 调节手感 |
+|------|--------|----------|
+| 入场 | 8f 起、间隔 3f、各 16f snappy | 5 个 chip 在 1s 内铺完，把时间留给选中段 |
+| 选中时刻 | FS = 56f（约全片 1/3） | 前段读题、后段看结果；早于 40f 观众还没读完选项 |
+| 灰闪 | 1 帧，rgba(120,128,146,.5) | **就一帧**：给 2 帧以上就读作 hover 高亮，不是按下 |
+| 反黑 | 57→62f linear（5f） | linear 是故意的：加 ease 会让"变黑"这件事有过程感，太软 |
+| 按压回弹 | 1 + sin(pr·π)·0.04，跨 9f | 0.04 是极轻；到 0.1 就成了弹跳按钮，抢戏 |
+| 余项降级 | 降到 18%，位置 transform:none | **位置锁死是命门**：降到 18% 仍在原位，才读作"没被选中"而非"消失了" |
+| 收束时刻 | 101f（选中后≈1.5s）起，18f smooth in-out | 1.5s 是让观众看清选中态的最短驻留；缩到 0.5s 就赶 |
+| 上移收窄 | 到 y=330、scale→0.88，横向补回中线 | 不补中线的话上移后会偏在左边，读作"被拖走"；缩过 0.85 字低于 32px |
+| 结算顺序 | 原价 → 划线 → 现价 → 省额胶囊，间隔 8–10f | 先给旧价再划掉，观众才读得到"变便宜了"的因果 |
+
+## 已知坑
+- 选中 chip 的回中线位移由固定 chip 宽算出（不运行时测量 offsetWidth）——改文案时要同步改宽度表，
+  否则字溢出或上移后偏离中线
+- 其余 chip 的 `transform` 必须显式写 `'none'`，不能靠 flex 自动重排，否则余项归零时会横向滑动
+- 占位内容：5 条计费周期选项名（Annual billing … Nonprofit rate）+ 结算「$42.00 → $34.44/mo、Save 18%」，
+  落地全部替换；选项名过长会撑破固定宽（第三条 "Two-year commitment" 是长名压力测试）
+
+## 参考实现
+demos/interaction/chip-grid-single-select-blackout/
+（ChipGridSingleSelectBlackout.tsx）

package/lib/motion/shotcraft/upstream/references/shots/interaction/collab-cursor-moves.md

@@ -1,41 +1,41 @@
----
-name: collab-cursor-moves
-一句话: 协作光标当演员——cast-ensemble 五光标群演氛围层（错峰飞入+正弦漂移+打字 cameo+聚拢围观）
-适用: 协作/多人主题的画布场景，给画面铺"团队在场"体温
-时长: A ~5.2s（156f）
-能量: A 低中（氛围层，可垫任何时长）
----
-
-## 意图
-库内光标一直是"操作工具"（cursor-flyover 的光标
-是单光标点击导览）。本卡把带身份名牌的协作光标升格成**演员**：
-五枚光标错峰入场后持续漂移当氛围粒子，"团队在场"感全靠它，其中一枚
-还能停下来打字（cameo 戏份）。SVG 光标+名牌 chip 成本极低、叙事密度
-极高，是"协作"主题最便宜的视觉论证。
-
-## 式
-| 式 | 做法 | 适用 |
-|----|------|------|
-| A cast-ensemble | 5 枚具名彩色光标错峰 spring 飞入 video-shotcraft 的分镜白板（头像组同帧弹出、便签带作者色）→双频正弦漂移驻场→一枚挂在插入点上打出简报卡标题→结尾全员 smooth 聚拢围观 | 画布/白板类产品全片氛围层；主内容之外需要"别人也在"的背景活性 |
-
-## 参数表
-| 参数 | 典型值 | 调节手感 |
-|------|--------|----------|
-| A 入场 | 5 枚 delay 2/7/11/16/22f 错峰，spring(damping 15, stiffness 80)；名牌晚 10f 淡入+上浮 12px；右上头像组同帧弹出（槽宽随弹出长） | 名牌跟光标同帧出现读作贴纸；随减速淡入才是"人到了自报家门" |
-| A 漂移 | 双频正弦叠加（0.055/0.021 rad/f，每枚相位不同），幅度 ±40/26px | 单频正弦读作钟摆；双频不同相才是"人手的随机" |
-| A 打字 cameo | 48–104f 打 29 字（1.6–2.4f/字确定性抖动，空格后多停 0.9f）；光标箭头挂在行内插入点锚点上，换行也跟着走；打字时手稳（漂移压到 0） | 箭头和插入点分开算位置必错位；行内零宽锚点让浏览器排版替你算 |
-| A 聚拢 | 98f 起 28f smooth 到卡片四周围观位（不压标题和眉题），漂移幅度衰减到 25% 保留 | 聚拢后漂移不能归零——完全静止的光标群读作死机 |
-
-## 已知坑
-- demo 在手搓画面上调校通过（瓷白白板 + 便签 + 简报卡，板名挂 video-shotcraft 标志，标题 "Ship a launch film by Friday."）——参数是调校起点非实战定稿，
-  首次实战须以真实素材回验
-- 名牌颜色=身份编码，全片必须一致（蓝=Designer 就一直蓝）；中途换色观众会以为换了人
-- 换标题文案时保持字数与空格数，打字节奏（每字抖动按下标取、空格多停）与收尾帧才不变
-- 漂移光标永远不许盖住正在阅读的主内容——氛围层要让戏，漂移范围避开主体安全区
-- 与 cursor-flyover 分工：那是光标"操作 UI"（点击有 payload），本卡光标"表演给你看"（位移即剧情）；光标要点东西时回那张卡
-- 声音：入场每枚一声极轻 pop，漂移段静，打字段 keyboard 轻声
-
-## 参考实现
-demos/interaction/collab-cursor-moves/
-（CursorCastEnsemble.tsx）
-原片出处：figma-devmode 0:05 + miro-promo 全片 + pitch-app 82–90s 打字 cameo
+---
+name: collab-cursor-moves
+一句话: 协作光标当演员——cast-ensemble 五光标群演氛围层（错峰飞入+正弦漂移+打字 cameo+聚拢围观）
+适用: 协作/多人主题的画布场景，给画面铺"团队在场"体温
+时长: A ~5.2s（156f）
+能量: A 低中（氛围层，可垫任何时长）
+---
+
+## 意图
+库内光标一直是"操作工具"（cursor-flyover 的光标
+是单光标点击导览）。本卡把带身份名牌的协作光标升格成**演员**：
+五枚光标错峰入场后持续漂移当氛围粒子，"团队在场"感全靠它，其中一枚
+还能停下来打字（cameo 戏份）。SVG 光标+名牌 chip 成本极低、叙事密度
+极高，是"协作"主题最便宜的视觉论证。
+
+## 式
+| 式 | 做法 | 适用 |
+|----|------|------|
+| A cast-ensemble | 5 枚具名彩色光标错峰 spring 飞入 video-shotcraft 的分镜白板（头像组同帧弹出、便签带作者色）→双频正弦漂移驻场→一枚挂在插入点上打出简报卡标题→结尾全员 smooth 聚拢围观 | 画布/白板类产品全片氛围层；主内容之外需要"别人也在"的背景活性 |
+
+## 参数表
+| 参数 | 典型值 | 调节手感 |
+|------|--------|----------|
+| A 入场 | 5 枚 delay 2/7/11/16/22f 错峰，spring(damping 15, stiffness 80)；名牌晚 10f 淡入+上浮 12px；右上头像组同帧弹出（槽宽随弹出长） | 名牌跟光标同帧出现读作贴纸；随减速淡入才是"人到了自报家门" |
+| A 漂移 | 双频正弦叠加（0.055/0.021 rad/f，每枚相位不同），幅度 ±40/26px | 单频正弦读作钟摆；双频不同相才是"人手的随机" |
+| A 打字 cameo | 48–104f 打 29 字（1.6–2.4f/字确定性抖动，空格后多停 0.9f）；光标箭头挂在行内插入点锚点上，换行也跟着走；打字时手稳（漂移压到 0） | 箭头和插入点分开算位置必错位；行内零宽锚点让浏览器排版替你算 |
+| A 聚拢 | 98f 起 28f smooth 到卡片四周围观位（不压标题和眉题），漂移幅度衰减到 25% 保留 | 聚拢后漂移不能归零——完全静止的光标群读作死机 |
+
+## 已知坑
+- demo 在手搓画面上调校通过（瓷白白板 + 便签 + 简报卡，板名挂 video-shotcraft 标志，标题 "Ship a launch film by Friday."）——参数是调校起点非实战定稿，
+  首次实战须以真实素材回验
+- 名牌颜色=身份编码，全片必须一致（蓝=Designer 就一直蓝）；中途换色观众会以为换了人
+- 换标题文案时保持字数与空格数，打字节奏（每字抖动按下标取、空格多停）与收尾帧才不变
+- 漂移光标永远不许盖住正在阅读的主内容——氛围层要让戏，漂移范围避开主体安全区
+- 与 cursor-flyover 分工：那是光标"操作 UI"（点击有 payload），本卡光标"表演给你看"（位移即剧情）；光标要点东西时回那张卡
+- 声音：入场每枚一声极轻 pop，漂移段静，打字段 keyboard 轻声
+
+## 参考实现
+demos/interaction/collab-cursor-moves/
+（CursorCastEnsemble.tsx）
+原片出处：figma-devmode 0:05 + miro-promo 全片 + pitch-app 82–90s 打字 cameo

package/lib/motion/shotcraft/upstream/references/shots/interaction/glass-pill-dictation-typing.md

@@ -1,53 +1,53 @@
----
-name: glass-pill-dictation-typing
-一句话: 一条定宽玻璃胶囊以约 1.25 倍略大弹出后缓落到位，内部自左淡到右浓铺一层强调色暖光；光标先行、随后匀速打出听写句，光（连同胶囊背后的环境光）随打字进度渐渐退去，收尾成一条中性的磨砂玻璃条
-适用: 语音/AI 输入框的登场；"跟它说话"的交互提示镜头；高能段之间的一个安静过渡拍
-时长: 约3.3s（100f@30fps）
-能量: 低（全片最安静的一拍，只有光在退）
----
-
-## 意图
-用"光随输入熄灭"讲一件很小的事：待命时它在发光（等你说话），你一开口
-它就把光让给文字。3.3s 里只做三件事——弹出、打字、光退。任何额外动作
-（弹跳、色变、图标动画）都会让这一拍不再是休止符。
-
-## 动效核心
-- 胶囊 1240×132、圆角 66、`padding: 0 20px 0 58px`，**定宽**（不随打字伸缩）；
-  听写字 56px、右端 92px 圆形声波按钮
-- 出场 `scale 1.25→1`，snappy（强 ease-out）20f；opacity 前 2f 就满——先"在了"再落位；
-  落位前 14f 带 6px→0 的景深虚化（放大段读作"离镜头更近"）
-- 材质：`backdrop-filter: blur(26px) saturate(1.3)` 真磨砂（背后的暖色光斑被它晕开），
-  上亮下暗白色体积渐变 + 1.5px 白描边 + 顶沿两端渐隐高光线 + 底缘内暗边 + 暖色两层落地影
-- 内嵌强调色光：`linear-gradient(90deg, α0 → α.18 @38% → α.62 @78% → 杏色 α.95 @100%)` 左淡右浓，
-  外加右下角一团 screen 叠加的高光——光在胶囊**内部**
-- 打字：光标 f2 先行，字符 f8 起匀速 2f/字铺完 28 字；光标 f66–74 撤掉
-- 光熄灭 `g = 1 − smooth(f10→f72)`，与打字同窗口；`g` 同时驱动四处：胶囊内渐层、胶囊背后那轮暖色"太阳"、
-  胶囊下方地面反光、声波按钮（实心暖色 → 描边中性），外泛光 `60g px`
-- 声波 5 根竖条基准高 `[30,16,24,13,20]`（左高右低），叠 `±2.4·sin(f·0.5 + i·1.7)` 极轻呼吸
-
-## 参数表
-| 参数 | 典型值 | 调节手感 |
-|------|--------|----------|
-| 胶囊定宽 | 1240px（≈整句宽度 1.8 倍） | **定宽是关键**：随字伸缩会读作 chip 而不是输入条 |
-| 出场缩放 | scale 1.25→1，snappy 20f | 1.25 倍是"从观众面前落回去"的量；1.5 倍就成了 pop 弹窗 |
-| opacity 时序 | 前 2f 跳满（早于缩放落位） | 同步淡入会让它像"渐渐出现"，失掉那一下轻微的实感 |
-| 内嵌光 | 90deg、0 → .18@38% → .62@78% → .95@100% | 光必须在胶囊内部；改成外 glow 就成了"待通知"而不是"待输入" |
-| 打字 | 28 字符，f8 起 2f/字匀速 | 加 ease 就读作"有人在犹豫"；听写是匀速的 |
-| 光熄灭 | 1 → 0，f10→f72 smooth | 与打字同窗口是全片唯一的因果：光让位给文字 |
-| 环境光跟随 | 背后暖光 0.15+0.6g、地面反光 0.22g | 只熄胶囊、环境不变，亮场里"光退"会读不出来 |
-| 声波竖条 | 5 根、±2.4px | 幅度到 6px 就成了"正在录音"的活跃态，与"待命"矛盾 |
-| 光标 | f2 先行、f66–74 撤 | 光标先于文字出现，是"输入框已就绪"的信号 |
-
-## 已知坑
-- backdrop-filter 只晕它**背后**的层：暖色光斑必须放在胶囊之下（同一层叠上下文里先画），
-  光斑离胶囊太远时磨砂看起来就是一块平白板
-- 亮场里光的明暗对比远小于暗场：内嵌光要给到杏色 .95 的饱和度，并让背后环境光一起退，否则"光退"不成立；
-  要做暗场版，把舞台换回近黑、光色降饱和即可，曲线不用动
-- 声波竖条是持续呼吸（不受 g 控制），首尾帧高度不同——用作 loop 素材时把频率调成 2π/时长 的整数倍
-- 打字进度 `floor(p·len + 1e-6)`，那个 epsilon 是防止末字符在整点因浮点误差不出现，别删
-- WARM / APRICOT 两个变量是内嵌光、外泛光、环境光、按钮共用的品牌色，换项目只改这两个
-- 句子长度变了要同步调胶囊定宽（保持 ≈ 句宽 1.8–2 倍）与打字窗口
-
-## 参考实现
-demos/interaction/glass-pill-dictation-typing/
-（GlassPillDictationTyping.tsx）
+---
+name: glass-pill-dictation-typing
+一句话: 一条定宽玻璃胶囊以约 1.25 倍略大弹出后缓落到位，内部自左淡到右浓铺一层强调色暖光；光标先行、随后匀速打出听写句，光（连同胶囊背后的环境光）随打字进度渐渐退去，收尾成一条中性的磨砂玻璃条
+适用: 语音/AI 输入框的登场；"跟它说话"的交互提示镜头；高能段之间的一个安静过渡拍
+时长: 约3.3s（100f@30fps）
+能量: 低（全片最安静的一拍，只有光在退）
+---
+
+## 意图
+用"光随输入熄灭"讲一件很小的事：待命时它在发光（等你说话），你一开口
+它就把光让给文字。3.3s 里只做三件事——弹出、打字、光退。任何额外动作
+（弹跳、色变、图标动画）都会让这一拍不再是休止符。
+
+## 动效核心
+- 胶囊 1240×132、圆角 66、`padding: 0 20px 0 58px`，**定宽**（不随打字伸缩）；
+  听写字 56px、右端 92px 圆形声波按钮
+- 出场 `scale 1.25→1`，snappy（强 ease-out）20f；opacity 前 2f 就满——先"在了"再落位；
+  落位前 14f 带 6px→0 的景深虚化（放大段读作"离镜头更近"）
+- 材质：`backdrop-filter: blur(26px) saturate(1.3)` 真磨砂（背后的暖色光斑被它晕开），
+  上亮下暗白色体积渐变 + 1.5px 白描边 + 顶沿两端渐隐高光线 + 底缘内暗边 + 暖色两层落地影
+- 内嵌强调色光：`linear-gradient(90deg, α0 → α.18 @38% → α.62 @78% → 杏色 α.95 @100%)` 左淡右浓，
+  外加右下角一团 screen 叠加的高光——光在胶囊**内部**
+- 打字：光标 f2 先行，字符 f8 起匀速 2f/字铺完 28 字；光标 f66–74 撤掉
+- 光熄灭 `g = 1 − smooth(f10→f72)`，与打字同窗口；`g` 同时驱动四处：胶囊内渐层、胶囊背后那轮暖色"太阳"、
+  胶囊下方地面反光、声波按钮（实心暖色 → 描边中性），外泛光 `60g px`
+- 声波 5 根竖条基准高 `[30,16,24,13,20]`（左高右低），叠 `±2.4·sin(f·0.5 + i·1.7)` 极轻呼吸
+
+## 参数表
+| 参数 | 典型值 | 调节手感 |
+|------|--------|----------|
+| 胶囊定宽 | 1240px（≈整句宽度 1.8 倍） | **定宽是关键**：随字伸缩会读作 chip 而不是输入条 |
+| 出场缩放 | scale 1.25→1，snappy 20f | 1.25 倍是"从观众面前落回去"的量；1.5 倍就成了 pop 弹窗 |
+| opacity 时序 | 前 2f 跳满（早于缩放落位） | 同步淡入会让它像"渐渐出现"，失掉那一下轻微的实感 |
+| 内嵌光 | 90deg、0 → .18@38% → .62@78% → .95@100% | 光必须在胶囊内部；改成外 glow 就成了"待通知"而不是"待输入" |
+| 打字 | 28 字符，f8 起 2f/字匀速 | 加 ease 就读作"有人在犹豫"；听写是匀速的 |
+| 光熄灭 | 1 → 0，f10→f72 smooth | 与打字同窗口是全片唯一的因果：光让位给文字 |
+| 环境光跟随 | 背后暖光 0.15+0.6g、地面反光 0.22g | 只熄胶囊、环境不变，亮场里"光退"会读不出来 |
+| 声波竖条 | 5 根、±2.4px | 幅度到 6px 就成了"正在录音"的活跃态，与"待命"矛盾 |
+| 光标 | f2 先行、f66–74 撤 | 光标先于文字出现，是"输入框已就绪"的信号 |
+
+## 已知坑
+- backdrop-filter 只晕它**背后**的层：暖色光斑必须放在胶囊之下（同一层叠上下文里先画），
+  光斑离胶囊太远时磨砂看起来就是一块平白板
+- 亮场里光的明暗对比远小于暗场：内嵌光要给到杏色 .95 的饱和度，并让背后环境光一起退，否则"光退"不成立；
+  要做暗场版，把舞台换回近黑、光色降饱和即可，曲线不用动
+- 声波竖条是持续呼吸（不受 g 控制），首尾帧高度不同——用作 loop 素材时把频率调成 2π/时长 的整数倍
+- 打字进度 `floor(p·len + 1e-6)`，那个 epsilon 是防止末字符在整点因浮点误差不出现，别删
+- WARM / APRICOT 两个变量是内嵌光、外泛光、环境光、按钮共用的品牌色，换项目只改这两个
+- 句子长度变了要同步调胶囊定宽（保持 ≈ 句宽 1.8–2 倍）与打字窗口
+
+## 参考实现
+demos/interaction/glass-pill-dictation-typing/
+（GlassPillDictationTyping.tsx）