ai-shifu

当 cook-web 需要调整 Next.js App Router 全局或路由级错误兜底页时使用本技能。错误页应直接展示错误名称、message、digest、cause、URL 和可用 stack，避免只提示用户查看控制台。

当修复 ai-shifu 聊天页在移动端与桌面端布局判定不一致的问题时使用本技能。基于真实可见视口宽度而不是仅 `#root.clientWidth` 计算 `frameLayout`，在 `resize` 与 `visualViewport.resize` 时同步，并在断点纠正后关闭过期的移动端抽屉状态。

当处理听课模式的流式音频、buffering、TTS 请求门禁与播放连续性问题时使用本技能。统一音频来源选择、分段合并策略和请求触发时机。

当 ai-shifu 聊天流从 block 粒度向 element 粒度演进，或历史记录与 SSE 渲染一致性出现问题时使用本技能。统一 element_bid 渲染键、兼容旧字段并收敛 AskBlock 归并逻辑。

当 learner 端听课模式需要接入 markdown-flow-ui 的移动端播放器新能力时使用本技能。覆盖横竖屏状态透传、自定义横屏 header、以及播放器文案国际化接入。

当 cook-web 页面在浏览器 fullscreen 场景下需要展示基于 Dialog 的支付弹窗、设置弹窗或业务弹层时，使用本技能排查 portal 容器是否落在全屏节点外。

当 cook-web 需要新增共享 loading 动画时，使用本技能统一公共组件目录、非破坏性导出方式，以及圆点序列动画的可配置实现。

当调整聊天操作栏、追问入口和 AskBlock 锚点时使用本技能。确保内容与操作入口同步出现，避免双输入框、空菜单和错位展示。

当 cook-web 的确认弹窗会触发重修、删除、恢复等异步请求时，使用本技能保证按钮防重复点击、loading 状态与弹窗关闭时机和请求完成保持一致。

当 ai-shifu 以受控方式接入 MarkdownFlowEditor，并出现变量中间态、临时标签或本地输入回灌问题时使用本技能。

当 cook-web 需要按 URL 深链定位课节并保持学习端与后台端行为一致时使用本技能。统一使用 lessonid 参数、复用目录点击拦截链路，并覆盖登录/付费/无效课节兜底。

当 TypeScript 对子路径导出出现类型丢失或声明冲突时使用本技能。通过规范的 module augmentation 写法避免覆盖上游导出。

Use when changing the backend MDF proxy, request validation, timeout handling, or frontend/backend ownership for MDF conversion. Keep the external service hidden from the browser.

Use when changing backend shifu authoring, draft history, publish, outline structure, or import/export behavior. Keep draft and publish flows consistent and protect outline integrity.

Use when changing backend user auth, verification codes, token persistence, temp-user behavior, or auth-provider integration. Keep provider dispatch and credential state centralized.

当重构 hook 返回字段或参数契约时使用本技能。统一同步调用方解构与参数对象，避免大面积 TS 属性错误。

当 ai-shifu 与 markdown-flow-ui 之间需要同步交互式 markdown 状态时使用本技能。将原始 `user_input` 持久化在应用状态中，把 `userInput` 传给 `ContentRender` 或 `MarkdownFlow`，并让 markdown-flow-ui 负责推导按钮、输入框和已选项默认值，避免在业务代码重复解析。

当 cook-web 执行 npm run build 出现 SyntaxError Unexpected token '?' 或 next/dist/compiled 报错时使用本技能，优先排查 Node 运行时版本不一致问题。