feat: 完善视频传播、标注编辑和拆帧闭环

- 接入 SAM2 视频传播能力：新增 /api/ai/propagate，支持用当前帧 mask/polygon/bbox 作为 seed，通过 SAM2 video predictor 向前、向后或双向传播，并可保存为真实 annotation。
- 接入 SAM3 video tracker：通过独立 Python 3.12 external worker 调用 SAM3 video predictor/tracker，使用本地 checkpoint 与 bbox seed 执行视频级跟踪，并在模型状态中标记 video_track 能力。
- 完善 SAM 模型分发：sam_registry 按 model_id 明确区分 sam2 propagation 与 sam3 video_track，避免两个模型链路混用。
- 打通前端“传播片段”：VideoWorkspace 使用当前选中 mask 和当前 AI 模型调用后端传播接口，传播结果回写并刷新工作区已保存标注。
- 增强 SAM3 本地 checkpoint 配置：新增 sam3_checkpoint_path 配置和 .env.example 示例，状态检查改为基于本地 checkpoint/独立环境/模型包可用性。
- 完善视频拆帧参数：/api/media/parse 支持 parse_fps、max_frames、target_width，后端任务保存帧时间戳、源帧号和 frame_sequence 元数据。
- 增加运行时 schema 兼容处理：启动时为旧 frames 表补充 timestamp_ms 和 source_frame_number 列，避免旧库升级后缺字段。
- 强化 Canvas 标注编辑：补齐多边形闭合、点工具、顶点拖拽、边中点插入、Delete/Backspace 删除、区域合并和重叠去除等交互。
- 增强语义分类联动：选中 mask 后可通过右侧语义分类树更新标签、颜色和 class metadata，并同步到保存/导出链路。
- 增加关键帧时间轴体验：FrameTimeline 显示具体时间信息，并支持键盘左右方向键切换关键帧。
- 完善 AI 交互分割参数：前端保留正向点、反向点、框选和 interactive prompt 的调用状态，支持 SAM2 细化候选区域与 SAM3 bbox 入口。
- 扩展后端/前端 API 类型：新增 propagateMasks、传播请求/响应 schema，并补齐 annotation、导出、模型状态和任务接口的测试覆盖。
- 更新项目文档：同步 README、AGENTS、接口契约、需求冻结、设计冻结、前端元素审计、实施计划和测试计划，标明真实功能边界与剩余风险。
- 增加测试覆盖：补充 SAM2/SAM3 传播、SAM3 状态、媒体拆帧参数、Canvas 编辑、语义标签切换、时间轴、工作区传播和 API 合约测试。
- 加强仓库安全边界：将 sam3权重/ 加入 .gitignore，避免本地模型权重被误提交。

验证：npm run test:run；pytest backend/tests；npm run lint；npm run build；python -m py_compile；git diff --check。

src/components/FrameTimeline.tsx

@@ -16,6 +16,20 @@ export function FrameTimeline() {
     const fps = currentProject?.parse_fps || currentProject?.original_fps || 12;
     return Math.min(Math.max(fps, 1), 30);
   }, [currentProject?.original_fps, currentProject?.parse_fps]);
+  const timeBaseFps = useMemo(() => {
+    const fps = currentProject?.parse_fps || currentProject?.original_fps || 12;
+    return Math.max(fps, 1);
+  }, [currentProject?.original_fps, currentProject?.parse_fps]);
+  const currentSeconds = totalFrames > 0 ? currentFrameIndex / timeBaseFps : 0;
+  const totalSeconds = totalFrames > 0 ? Math.max(totalFrames - 1, 0) / timeBaseFps : 0;
+
+  const formatTime = (seconds: number) => {
+    const safeSeconds = Math.max(0, seconds);
+    const minutes = Math.floor(safeSeconds / 60);
+    const wholeSeconds = Math.floor(safeSeconds % 60);
+    const centiseconds = Math.floor((safeSeconds % 1) * 100);
+    return `${minutes.toString().padStart(2, '0')}:${wholeSeconds.toString().padStart(2, '0')}.${centiseconds.toString().padStart(2, '0')}`;
+  };
 
   useEffect(() => {
     if (!isPlaying || totalFrames <= 1) return;
@@ -38,6 +52,30 @@ export function FrameTimeline() {
     }
   }, [totalFrames]);
 
+  useEffect(() => {
+    const isEditableTarget = (target: EventTarget | null) => {
+      if (!(target instanceof HTMLElement)) return false;
+      const tagName = target.tagName.toLowerCase();
+      return target.isContentEditable || ['input', 'textarea', 'select'].includes(tagName);
+    };
+
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (isEditableTarget(event.target) || totalFrames <= 1) return;
+      if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') return;
+
+      event.preventDefault();
+      setIsPlaying(false);
+      const direction = event.key === 'ArrowRight' ? 1 : -1;
+      const nextIndex = Math.min(Math.max(currentFrameIndex + direction, 0), totalFrames - 1);
+      if (nextIndex !== currentFrameIndex) {
+        setCurrentFrame(nextIndex);
+      }
+    };
+
+    window.addEventListener('keydown', handleKeyDown);
+    return () => window.removeEventListener('keydown', handleKeyDown);
+  }, [currentFrameIndex, setCurrentFrame, totalFrames]);
+
   // show frames around current frame
   const frameWindow = 20;
   const displayIndices = totalFrames > 0
@@ -47,6 +85,12 @@ export function FrameTimeline() {
   return (
     <div className="h-32 bg-[#111] border-t border-white/5 flex flex-col shrink-0 z-20">
       <div className="h-4 bg-[#0d0d0d] flex items-center group relative">
+        <div className="absolute left-3 -top-5 text-[10px] font-mono text-gray-500 pointer-events-none">
+          {formatTime(currentSeconds)}
+        </div>
+        <div className="absolute right-3 -top-5 text-[10px] font-mono text-gray-500 pointer-events-none">
+          {formatTime(totalSeconds)}
+        </div>
         <input 
           type="range" 
           min="1" 
@@ -65,6 +109,12 @@ export function FrameTimeline() {
              className="w-3 h-3 bg-white rounded-full absolute top-1/2 -translate-y-1/2 -ml-1.5 shadow-sm transform scale-0 group-hover:scale-100 transition-transform shadow-cyan-500/50"
              style={{ left: `${totalFrames > 0 ? (currentFrame / totalFrames) * 100 : 0}%` }}
           />
+          <div
+            className="absolute -top-7 -translate-x-1/2 rounded bg-black/80 border border-white/10 px-2 py-0.5 text-[10px] font-mono text-cyan-300 opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none"
+            style={{ left: `${totalFrames > 0 ? (currentFrame / totalFrames) * 100 : 0}%` }}
+          >
+            {formatTime(currentSeconds)}
+          </div>
         </div>
       </div>
       
@@ -129,6 +179,9 @@ export function FrameTimeline() {
 
         <div className="w-48 text-right shrink-0">
           <div className="text-2xl font-mono text-white">{currentFrame}<span className="text-xs text-gray-500"> / {totalFrames}</span></div>
+          <div className="text-xs font-mono text-cyan-300 mt-1">
+            {formatTime(currentSeconds)} <span className="text-gray-600">/</span> {formatTime(totalSeconds)}
+          </div>
           <div className="text-[10px] text-gray-500 uppercase tracking-widest mt-1">底层时序视频图层截帧导航轴</div>
         </div>
       </div>