release: Momentry Studio v0.1.0 Production Release

发布内容：
- Tauri Desktop App (.app bundle + DMG)
- Core API Binary (momentry-core)
- Proxy Binary (momentry-proxy)
- 完整文档（README, RELEASE_NOTES, 安装指南, 部署指南）

新功能：
- 批量 Deep Scan（并发控制 + 队列显示）
- 批量 Unregister
- Face Filter 自动保存（500ms 防抖）
- Registered 卡片 Checkbox 修复
- MarkBase Engine 健康检查修复
- FS Name 唯一性修复

发布包：
- 文件名: momentry-studio-v0.1.0-macos-aarch64.tar.gz
- 大小: 37MB
- SHA256: 154ef0e02a6199278ea6bc6a5073d11c631527f2825ba78ceeafcb5f486cf969

平台: macOS (Apple Silicon)
构建日期: 2026-10-08
Git Commit: 8e71996

.gitignore

@@ -0,0 +1,18 @@
+# Dependencies
+node_modules/
+
+# Build outputs
+dist/
+src-tauri/target/
+
+# Secrets
+.gitea_token
+
+# Backup files
+*.bak
+*.backup
+*.tar.gz
+
+# Database journals
+*.sqlite-journal
+*.sqlite-wal

.opencode/plans/multi_track_mark_system_design.md

@@ -0,0 +1,978 @@
+# 多轨 Mark 系统设计文档
+
+## 一、概述
+
+### 1.1 目标
+
+构建一个多轨道视频/音频编辑展示系统，支持：
+- 多轨 Video/Audio 同步播放
+- 每个轨道独立的 Mark 系统
+- 基于 Frame 的精确定位和对齐
+
+### 1.2 核心原则
+
+| 原则 | 说明 |
+|------|------|
+| **Frame 是唯一标准** | 所有定位、长度、对齐都用 Frame（整数） |
+| **Time 仅用于显示** | Frame / FPS 转换，不存储 |
+| **整数运算** | 所有 Frame 操作都是整数，避免浮点精度问题 |
+| **原点对齐** | Frame 0 = Time 0，所有轨道共享同一原点 |
+| **轨道独立** | 每个轨道有独立的 Mark 系统 |
+| **同步播放** | 全局播放头对齐所有轨道 |
+
+### 1.3 概念统一
+
+**核心洞察**：Trace 和 Segment 只是不同 tag 的 Marks
+
+```
+传统概念        →  统一概念
+────────────────────────────────
+Trace           →  Marks with tag='face'
+Segment         →  Marks with tag='segment'
+ASR 分析        →  Marks with tag='asr'
+Noise 检测      →  Marks with tag='noise'
+用户标记        →  Marks with tag='user'
+```
+
+**好处**：
+- 统一数据模型
+- 简化代码实现
+- 一致的交互行为
+- 灵活扩展新类型
+
+---
+
+## 二、架构设计
+
+### 2.1 层级架构
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                    应用层 (Application)                      │
+│  - 剪接工具                                                   │
+│  - 审核工具                                                   │
+│  - 播放器                                                     │
+└─────────────────────────────────────────────────────────────┘
+                            │
+                            ▼
+┌─────────────────────────────────────────────────────────────┐
+│                    项目层 (Project)                          │
+│  - 多轨道管理                                                 │
+│  - 全局播放状态                                               │
+│  - FPS / TotalFrames 元数据                                  │
+└─────────────────────────────────────────────────────────────┘
+                            │
+                            ▼
+┌─────────────────────────────────────────────────────────────┐
+│                    轨道层 (Track)                             │
+│  - Video Track (视频轨道 + Marks)                            │
+│  - Audio Track (音频轨道 + Marks)                            │
+│  - Mark Track  (纯 Mark 轨道)                                │
+└─────────────────────────────────────────────────────────────┘
+                            │
+                            ▼
+┌─────────────────────────────────────────────────────────────┐
+│                    Mark 层 (Mark)                             │
+│  - startFrame / endFrame (整数)                              │
+│  - tag / note / metadata                                     │
+│  - 属于特定 Track                                            │
+└─────────────────────────────────────────────────────────────┘
+```
+
+### 2.2 数据流
+
+```
+┌──────────────┐
+│  数据源       │
+│  - Face API  │
+│  - ASR API   │
+│  - Noise API │
+└──────┬───────┘
+       │ 获取数据
+       ▼
+┌──────────────┐
+│  转换层       │
+│  Time→Frame  │ (用 FPS)
+│  统一格式     │
+└──────┬───────┘
+       │ Mark 数据
+       ▼
+┌──────────────┐
+│  Project     │
+│  多轨道管理   │
+└──────┬───────┘
+       │ Track + Marks
+       ▼
+┌──────────────┐
+│  展示层       │
+│  - Timeline  │
+│  - 播放器     │
+└──────────────┘
+```
+
+---
+
+## 三、数据结构
+
+### 3.1 核心类型定义
+
+```typescript
+// ========== 基础类型 ==========
+
+type Frame = number  // 整数，绝对定位标准
+
+// ========== Mark ==========
+
+interface Mark {
+  id: string
+  trackId: string              // 所属轨道
+  
+  // 定位（Frame，整数）
+  startFrame: Frame
+  endFrame?: Frame
+  
+  // 分类与内容
+  tag: string                  // 'face' | 'asr' | 'noise' | 'user' | ...
+  note?: string
+  metadata?: any               // 原始数据（如 ASR text, noise dB）
+  
+  // 审核状态
+  status?: 'pending' | 'confirmed' | 'resolved' | 'ignored'
+  severity?: 'low' | 'medium' | 'high'
+}
+
+// ========== Clip ==========
+
+interface Clip {
+  id: string
+  
+  // 源文件范围
+  sourceStartFrame: Frame
+  sourceEndFrame: Frame
+  
+  // 时间轴位置（全局 Frame）
+  timelineStartFrame: Frame
+  timelineEndFrame: Frame
+}
+
+// ========== Track ==========
+
+interface Track {
+  id: string
+  type: 'video' | 'audio' | 'mark-only'
+  name: string
+  enabled: boolean             // 是否启用
+  
+  // 轨道内容
+  file_uuid?: string
+  clips?: Clip[]
+  
+  // 独立的 Mark 系统
+  marks: Mark[]
+}
+
+// ========== Project ==========
+
+interface Project {
+  id: string
+  name: string
+  
+  // 全局元数据（所有轨道共享）
+  fps: number                  // 帧率
+  totalFrames: Frame           // 总帧数（最长轨道）
+  duration: number             // 总时长（秒），仅用于显示
+  
+  // 多轨道
+  tracks: Track[]
+  
+  // 播放状态
+  playhead: Frame              // 当前播放位置（全局）
+  playing: boolean
+}
+```
+
+### 3.2 Frame 操作规范
+
+```typescript
+// 所有 Frame 操作都是整数
+
+// Frame → Time（仅显示用）
+function frameToTime(frame: Frame, fps: number): number {
+  return frame / fps
+}
+
+// Time → Frame（数据转换用）
+function timeToFrame(time: number, fps: number): Frame {
+  return Math.round(time * fps)
+}
+
+// 位置百分比（Timeline 显示）
+function frameToPercent(frame: Frame, totalFrames: Frame): number {
+  return (frame / totalFrames) * 100
+}
+
+// 格式化显示
+function formatFrame(frame: Frame, fps: number): string {
+  const sec = frame / fps
+  const m = Math.floor(sec / 60)
+  const s = Math.floor(sec % 60)
+  return `${m}:${s.toString().padStart(2, '0')}`
+}
+```
+
+---
+
+## 四、轨道系统
+
+### 4.1 轨道类型
+
+| 类型 | 说明 | 内容 | Marks |
+|------|------|------|-------|
+| **Video Track** | 视频轨道 | video clips + file_uuid | face, noise, blurry, user... |
+| **Audio Track** | 音频轨道 | audio clips + file_uuid | asr, silence, beat, noise... |
+| **Mark Track** | 纯标记轨道 | 无媒体内容 | user, comment, todo, review... |
+
+### 4.2 轨道 UI 布局
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│  Global Playhead: Frame 12345 (0:24.5)                      │
+│        ▼                                                    │
+│  ────────────────────────────────────────────────────────    │
+│                                                              │
+│  ☑ V1 (主视频)                                               │
+│  ├─ ████████████████████████████████                        │
+│  └─ marks:                                                   │
+│      ├─ [face] ████ F100-120                                │
+│      ├─ [face] ███████████ F500-650                         │
+│      └─ [noise]    ████ F800-900                            │
+│                                                              │
+│  ☑ A1 (原声)                                                 │
+│  ├─ ████████████████████████████████                        │
+│  └─ marks:                                                   │
+│      ├─ [asr] ████ F100-120 "你好"                          │
+│      └─ [noise]    ████ F800-900                            │
+│                                                              │
+│  ☑ M1 (审核标记)                                             │
+│  └─ marks:                                                   │
+│      ├─ [user] ▼ F500 "需要检查"                            │
+│      └─ [user] ▼ F1000 "待确认"                             │
+│                                                              │
+└─────────────────────────────────────────────────────────────┘
+```
+
+### 4.3 轨道操作
+
+```typescript
+interface TrackOperations {
+  // 播放控制
+  play(): void
+  pause(): void
+  seek(frame: Frame): void
+  
+  // Mark 操作
+  addMark(mark: Omit<Mark, 'id' | 'trackId'>): Mark
+  updateMark(id: string, updates: Partial<Mark>): void
+  deleteMark(id: string): void
+  
+  // 批量操作
+  batchUpdateMarks(filter: (m: Mark) => boolean, updates: Partial<Mark>): void
+  batchDeleteMarks(filter: (m: Mark) => boolean): void
+  
+  // 导航
+  nextMark(tag?: string): Mark | null
+  prevMark(tag?: string): Mark | null
+}
+```
+
+---
+
+## 五、Mark 系统
+
+### 5.1 Mark 类型与来源
+
+| Tag | 来源 | 数据格式 | 转换 |
+|-----|------|----------|------|
+| **face** | Face Trace API | first_frame, last_frame | 无需转换 |
+| **asr** | ASR API | start_time, end_time | Time → Frame |
+| **noise** | 噪声检测 | start_time, end_time | Time → Frame |
+| **silent** | 静音检测 | start_time, end_time | Time → Frame |
+| **user** | 用户创建 | frame | 无需转换 |
+| **comment** | 用户评论 | frame | 无需转换 |
+
+### 5.2 Mark 数据源转换
+
+```typescript
+// Face Trace → Mark
+function traceToMark(trace: FaceTrace, trackId: string): Mark {
+  return {
+    id: generateId(),
+    trackId,
+    startFrame: trace.first_frame,
+    endFrame: trace.last_frame,
+    tag: 'face',
+    note: trace.identity_name,
+    metadata: trace
+  }
+}
+
+// ASR → Mark
+function asrToMark(asr: AsrChunk, trackId: string, fps: number): Mark {
+  return {
+    id: generateId(),
+    trackId,
+    startFrame: timeToFrame(asr.start_time, fps),
+    endFrame: timeToFrame(asr.end_time, fps),
+    tag: 'asr',
+    note: asr.text,
+    metadata: asr
+  }
+}
+
+// Noise → Mark
+function noiseToMark(noise: NoiseSegment, trackId: string, fps: number): Mark {
+  return {
+    id: generateId(),
+    trackId,
+    startFrame: timeToFrame(noise.start_time, fps),
+    endFrame: timeToFrame(noise.end_time, fps),
+    tag: 'noise',
+    note: `${noise.db}dB`,
+    metadata: noise,
+    severity: noise.db > -30 ? 'high' : noise.db > -40 ? 'medium' : 'low'
+  }
+}
+```
+
+### 5.3 Mark 操作表
+
+| Tag | 操作 | 参数 |
+|-----|------|------|
+| **noise** | 删除片段 | padding: 5 frames |
+| **silent** | 静音处理 | fade: 10ms |
+| **blurry** | 标记忽略 | - |
+| **face** | 绑定身份 | identity_uuid |
+| **asr** | 编辑文本 | new_text |
+| **user** | 自定义 | - |
+
+---
+
+## 六、Mark 点击交互行为
+
+### 6.1 核心概念
+
+点击 Mark 时，根据**当前播放状态**和**全局 PlayMode** 决定行为。
+
+### 6.2 Sync Lock（同步锁）
+
+```typescript
+// 全局同步锁
+const syncLock = ref<boolean>(true)  // 默认锁定
+
+// 锁定 🔒：点击 Mark → 所有轨道跳转到同一 frame
+// 解锁 🔓：点击 Mark → 仅当前轨道跳转
+```
+
+**UI 控件**：
+```
+[🔒 Sync ON]  /  [🔓 Sync OFF]
+```
+
+### 6.3 PlayMode（全局播放模式）
+
+```typescript
+type PlayMode = 'normal' | 'continue' | 'loop'
+const globalPlayMode = ref<PlayMode>('normal')
+```
+
+| 模式 | 行为 |
+|------|------|
+| **Normal** | 播放到 Mark.endFrame 后停止 |
+| **Continue** | 播放到 Mark.endFrame 后继续播放 |
+| **Loop** | 循环播放 Mark.startFrame ~ endFrame |
+
+**UI 控件**：
+```
+[Normal]  [Continue]  [Loop]
+```
+
+### 6.4 点击逻辑流程
+
+```
+┌─────────────────────────────────────────────────────┐
+│           点击 Mark 触发                              │
+├─────────────────────────────────────────────────────┤
+│                                                      │
+│  1. Seek 到 Mark.startFrame                          │
+│     ├─ SyncLock ON  → 所有轨道同步跳转               │
+│     └─ SyncLock OFF → 仅当前轨道跳转                 │
+│                                                      │
+│  2. 检查当前播放状态                                   │
+│     ├─ Pause → 只跳转，不播放                         │
+│     └─ Play  → 跳转后根据 PlayMode 播放              │
+│                                                      │
+│  3. 根据 PlayMode 设置播放行为                        │
+│     ├─ Normal   → 设置 stopAtFrame                   │
+│     ├─ Continue → 清除 stopAtFrame                   │
+│     └─ Loop     → 设置 loopRange                     │
+│                                                      │
+└─────────────────────────────────────────────────────┘
+```
+
+### 6.5 代码实现
+
+```typescript
+// 播放状态
+const playhead = ref<Frame>(0)
+const isPlaying = ref<boolean>(false)
+const stopAtFrame = ref<Frame | null>(null)
+const loopRange = ref<{ start: Frame; end: Frame } | null>(null)
+
+// 点击 Mark
+function onMarkClick(mark: Mark) {
+  // 1. Seek
+  if (syncLock.value) {
+    seekAllTracks(mark.startFrame)  // 所有轨道同步
+  } else {
+    seekTrack(mark.trackId, mark.startFrame)  // 仅当前轨道
+  }
+  
+  // 2. Pause 状态：只跳转，不播放
+  if (!isPlaying.value) return
+  
+  // 3. Play 状态：设置播放行为
+  switch (globalPlayMode.value) {
+    case 'normal':
+      stopAtFrame.value = mark.endFrame || mark.startFrame
+      loopRange.value = null
+      break
+      
+    case 'continue':
+      stopAtFrame.value = null
+      loopRange.value = null
+      break
+      
+    case 'loop':
+      // 不退出 loop（点击其他 mark 不退出）
+      loopRange.value = {
+        start: mark.startFrame,
+        end: mark.endFrame || mark.startFrame
+      }
+      break
+  }
+  
+  play()
+}
+
+// PlayMode 切换
+function setPlayMode(mode: PlayMode) {
+  globalPlayMode.value = mode
+  
+  // 切换模式时退出 loop
+  if (mode !== 'loop') {
+    loopRange.value = null
+  }
+}
+
+// 播放控制器
+function tick() {
+  if (!isPlaying.value) return
+  
+  const currentFrame = playhead.value
+  
+  // 检查 Loop 模式
+  if (loopRange.value && currentFrame >= loopRange.value.end) {
+    seekToFrame(loopRange.value.start)
+    requestAnimationFrame(() => tick())
+    return
+  }
+  
+  // 检查 Normal 模式的停止点
+  if (stopAtFrame.value !== null && currentFrame >= stopAtFrame.value) {
+    pause()
+    return
+  }
+  
+  // Continue 模式：正常播放
+  playhead.value++
+  requestAnimationFrame(() => tick())
+}
+```
+
+### 6.6 Loop 退出条件
+
+| 操作 | 是否退出 Loop |
+|------|--------------|
+| 点击其他 Mark | ❌ 不退出 |
+| 切换 PlayMode | ✅ 退出 |
+| 手动暂停 | ✅ 退出 |
+| 关闭播放器 | ✅ 退出 |
+
+### 6.7 UI 控件设计
+
+```
+┌─────────────────────────────────────────────────────┐
+│  控制栏                                               │
+├─────────────────────────────────────────────────────┤
+│  [🔒 Sync]  |  [Normal] [Continue] [Loop]            │
+│                                                      │
+│  状态指示：                                           │
+│  - Sync: ON/OFF                                      │
+│  - Mode: Normal/Continue/Loop                        │
+│  - Loop Range: F100-200 (如果 looping)              │
+│  - Stop At: F300 (如果 normal mode)                  │
+└─────────────────────────────────────────────────────┘
+```
+
+---
+
+## 七、同步播放
+
+### 6.1 播放机制
+
+```typescript
+class PlaybackController {
+  private project: Project
+  private playhead: Frame = 0
+  private playing: boolean = false
+  private startTime: number = 0
+  private startFrame: Frame = 0
+  
+  play() {
+    this.playing = true
+    this.startTime = performance.now()
+    this.startFrame = this.playhead
+    
+    this.tick()
+  }
+  
+  private tick() {
+    if (!this.playing) return
+    
+    const elapsed = (performance.now() - this.startTime) / 1000
+    this.playhead = this.startFrame + Math.round(elapsed * this.project.fps)
+    
+    // 同步所有轨道
+    this.syncAllTracks(this.playhead)
+    
+    requestAnimationFrame(() => this.tick())
+  }
+  
+  private syncAllTracks(frame: Frame) {
+    this.project.tracks.forEach(track => {
+      if (!track.enabled) return
+      
+      // 更新媒体内容
+      if (track.type === 'video') {
+        this.syncVideo(track, frame)
+      } else if (track.type === 'audio') {
+        this.syncAudio(track, frame)
+      }
+      
+      // 高亮 Marks
+      this.highlightMarks(track.marks, frame)
+    })
+  }
+  
+  seek(frame: Frame) {
+    this.playhead = frame
+    this.startTime = performance.now()
+    this.startFrame = frame
+    this.syncAllTracks(frame)
+  }
+}
+```
+
+### 6.2 对齐保证
+
+```typescript
+// 验证原点对齐
+function validateAlignment(project: Project): boolean {
+  // 所有轨道共享原点
+  const globalPlayhead = project.playhead
+  
+  project.tracks.forEach(track => {
+    // 所有轨道的当前帧 = 全局播放头
+    const trackFrame = globalPlayhead
+    
+    // Mark 高亮基于同一 frame
+    track.marks.forEach(mark => {
+      const isActive = mark.startFrame <= trackFrame && 
+                       (mark.endFrame || mark.startFrame) >= trackFrame
+    })
+  })
+  
+  return true
+}
+```
+
+---
+
+## 八、Timeline 设计
+
+### 8.1 Timeline 对齐原则
+
+```
+所有 Timeline 共享同一基准：
+
+┌─────────────────────────────────────────────────────────────┐
+│  基准：Frame 0 ~ TotalFrames (65000)                        │
+├─────────────────────────────────────────────────────────────┤
+│                                                              │
+│  Main Timeline                                               │
+│  ██████████████░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░░  │
+│  ▲ Playhead: F12345                                         │
+│                                                              │
+│  V1 Timeline                                                 │
+│  ████████████████████████████████                           │
+│      [face] ████          [noise] ████                      │
+│                                                              │
+│  A1 Timeline                                                 │
+│  ████████████████████████████████                           │
+│      [asr] ████    [asr] ████                                │
+│                                                              │
+│  M1 Timeline                                                 │
+│      [user] ▼           [user] ▼                            │
+│                                                              │
+│  所有 Timeline 长度一致，位置百分比计算相同                  │
+└─────────────────────────────────────────────────────────────┘
+```
+
+### 8.2 Timeline 计算
+
+```typescript
+// 所有 Timeline 用相同公式
+const totalFrames = project.totalFrames
+
+// 位置（百分比）
+function getPosition(frame: Frame): number {
+  return (frame / totalFrames) * 100
+}
+
+// 宽度（百分比）
+function getWidth(startFrame: Frame, endFrame: Frame): number {
+  return ((endFrame - startFrame) / totalFrames) * 100
+}
+
+// 像素位置（用于精确渲染）
+function getPixelPosition(frame: Frame, width: number): number {
+  return Math.round((frame / totalFrames) * width)
+}
+```
+
+---
+
+## 九、API 设计
+
+### 9.1 Project API
+
+```typescript
+// 创建项目
+POST /api/v1/project
+{
+  name: string,
+  fps: number,
+  totalFrames: number,
+  tracks: TrackConfig[]
+}
+
+// 获取项目
+GET /api/v1/project/:id
+
+// 更新项目
+PUT /api/v1/project/:id
+
+// 添加轨道
+POST /api/v1/project/:id/track
+{
+  type: 'video' | 'audio' | 'mark-only',
+  name: string,
+  file_uuid?: string
+}
+```
+
+### 9.2 Track API
+
+```typescript
+// 获取轨道
+GET /api/v1/track/:id
+
+// 更新轨道
+PUT /api/v1/track/:id
+{
+  enabled?: boolean,
+  name?: string
+}
+
+// 删除轨道
+DELETE /api/v1/track/:id
+```
+
+### 9.3 Mark API
+
+```typescript
+// 获取轨道的所有 Marks
+GET /api/v1/track/:trackId/marks
+
+// 添加 Mark
+POST /api/v1/track/:trackId/mark
+{
+  startFrame: Frame,
+  endFrame?: Frame,
+  tag: string,
+  note?: string
+}
+
+// 更新 Mark
+PUT /api/v1/mark/:id
+{
+  startFrame?: Frame,
+  endFrame?: Frame,
+  tag?: string,
+  note?: string,
+  status?: string
+}
+
+// 删除 Mark
+DELETE /api/v1/mark/:id
+
+// 批量操作
+POST /api/v1/track/:trackId/marks/batch
+{
+  action: 'update' | 'delete',
+  filter: { tag?: string, status?: string },
+  updates?: Partial<Mark>
+}
+```
+
+---
+
+## 十、数据持久化
+
+### 10.1 SQLite 表结构
+
+```sql
+-- 项目表
+CREATE TABLE projects (
+  id TEXT PRIMARY KEY,
+  name TEXT NOT NULL,
+  fps INTEGER NOT NULL,
+  total_frames INTEGER NOT NULL,
+  created_at TEXT DEFAULT CURRENT_TIMESTAMP,
+  updated_at TEXT DEFAULT CURRENT_TIMESTAMP
+);
+
+-- 轨道表
+CREATE TABLE tracks (
+  id TEXT PRIMARY KEY,
+  project_id TEXT NOT NULL,
+  type TEXT NOT NULL,  -- 'video' | 'audio' | 'mark-only'
+  name TEXT NOT NULL,
+  file_uuid TEXT,
+  enabled INTEGER DEFAULT 1,
+  position INTEGER,  -- 轨道顺序
+  created_at TEXT DEFAULT CURRENT_TIMESTAMP,
+  FOREIGN KEY (project_id) REFERENCES projects(id)
+);
+
+-- Mark 表
+CREATE TABLE marks (
+  id TEXT PRIMARY KEY,
+  track_id TEXT NOT NULL,
+  start_frame INTEGER NOT NULL,
+  end_frame INTEGER,
+  tag TEXT NOT NULL,
+  note TEXT,
+  status TEXT DEFAULT 'pending',
+  severity TEXT,
+  metadata TEXT,  -- JSON
+  created_at TEXT DEFAULT CURRENT_TIMESTAMP,
+  updated_at TEXT DEFAULT CURRENT_TIMESTAMP,
+  FOREIGN KEY (track_id) REFERENCES tracks(id)
+);
+
+-- 索引
+CREATE INDEX idx_marks_track ON marks(track_id);
+CREATE INDEX idx_marks_frame ON marks(start_frame, end_frame);
+CREATE INDEX idx_marks_tag ON marks(tag);
+```
+
+---
+
+## 十一、UI 组件
+
+### 11.1 组件层级
+
+```
+App
+└─ ProjectEditor
+   ├─ Toolbar
+   │  ├─ PlayButton
+   │  ├─ FrameInput
+   │  └─ ZoomControl
+   ├─ TimelinePanel
+   │  ├─ PlayheadIndicator
+   │  ├─ TrackList
+   │  │  ├─ TrackItem (Video)
+   │  │  ├─ TrackItem (Audio)
+   │  │  └─ TrackItem (Mark-only)
+   │  └─ TimeScale
+   └─ VideoPlayer (可选)
+      └─ MarkOverlay
+```
+
+### 11.2 核心组件
+
+#### TimelinePanel
+
+```vue
+<template>
+  <div class="timeline-panel">
+    <div class="playhead" :style="{ left: playheadPct + '%' }"></div>
+    
+    <div v-for="track in tracks" :key="track.id" class="track-row">
+      <div class="track-header">
+        <input type="checkbox" v-model="track.enabled" />
+        <span>{{ track.name }}</span>
+      </div>
+      <div class="track-timeline" @click="onTimelineClick">
+        <div
+          v-for="mark in track.marks"
+          :key="mark.id"
+          class="mark"
+          :class="{ active: isMarkActive(mark) }"
+          :style="getMarkStyle(mark)"
+          @click.stop="onMarkClick(mark)"
+        >
+          {{ mark.tag }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+const playheadPct = computed(() => 
+  (project.playhead / project.totalFrames) * 100
+)
+
+function getMarkStyle(mark: Mark) {
+  return {
+    left: `${(mark.startFrame / project.totalFrames) * 100}%`,
+    width: `${((mark.endFrame || mark.startFrame) - mark.startFrame) / project.totalFrames * 100}%`
+  }
+}
+</script>
+```
+
+---
+
+## 十二、实现步骤
+
+### 12.1 Phase 1: 基础架构（P0）
+
+1. **数据结构定义**
+   - 定义 TypeScript 接口
+   - 实现 Frame 操作函数
+   
+2. **SQLite 存储**
+   - 创建表结构
+   - 实现 CRUD API
+   
+3. **单轨道 Mark 系统**
+   - Track + Mark 基础功能
+   - Timeline 展示
+
+### 12.2 Phase 2: 多轨播放（P1）
+
+1. **多轨道管理**
+   - Project 层实现
+   - Track 增删改
+   
+2. **同步播放**
+   - PlaybackController
+   - 全局 Playhead
+   
+3. **Timeline 对齐**
+   - 统一计算公式
+   - 视觉对齐
+
+### 12.3 Phase 3: 数据集成（P1）
+
+1. **数据源转换**
+   - Face Trace → Mark
+   - ASR → Mark
+   - Noise → Mark
+   
+2. **FPS 管理**
+   - 视频元数据获取
+   - Time ↔ Frame 转换
+
+### 12.4 Phase 4: 操作功能（P2）
+
+1. **Mark 操作**
+   - 批量更新
+   - 批量删除
+   
+2. **剪辑功能**
+   - 基于 Mark 的剪辑
+   - 片段操作
+
+---
+
+## 十三、测试计划
+
+### 13.1 单元测试
+
+- Frame 操作函数
+- Time ↔ Frame 转换
+- Mark 过滤/排序
+- Timeline 位置计算
+
+### 13.2 集成测试
+
+- 多轨同步播放
+- Playhead 对齐
+- Mark 高亮状态
+- 数据持久化
+
+### 13.3 E2E 测试
+
+- 创建项目
+- 添加轨道
+- 创建/编辑/删除 Mark
+- 播放和导航
+
+---
+
+## 十四、附录
+
+### 14.1 命名约定
+
+| 概念 | 变量名 | 类型 |
+|------|--------|------|
+| 帧 | `frame` | `Frame` (number) |
+| 起始帧 | `startFrame` | `Frame` |
+| 结束帧 | `endFrame` | `Frame` |
+| 总帧数 | `totalFrames` | `Frame` |
+| 帧率 | `fps` | `number` |
+| 播放头 | `playhead` | `Frame` |
+| 时间（秒） | `time` / `sec` | `number` |
+
+### 14.2 配置参数
+
+| 参数 | 默认值 | 说明 |
+|------|--------|------|
+| 默认 FPS | 30 | 无视频时使用 |
+| 最小 Mark 宽度 | 1px | 渲染时保证可见 |
+| Timeline 高度 | 24px | 每个轨道行高 |
+| Playhead 更新频率 | 60fps | requestAnimationFrame |
+
+---
+
+## 十五、版本历史
+
+| 版本 | 日期 | 变更 |
+|------|------|------|
+| 1.0 | 2026-07-24 | 初始设计文档 |
+| 1.1 | 2026-07-24 | 添加概念统一说明、Mark 点击交互行为章节 |

.opencode/plans/video_editing_positioning_standards_research.md

@@ -0,0 +1,281 @@
+# 视频编辑定位标准研究报告
+
+## 一、行业标准概览
+
+### 1.1 SMPTE Timecode（行业标准）
+
+**来源**: Society of Motion Picture and Television Engineers (SMPTE)  
+**标准**: SMPTE 12M (2008年修订为 SMPTE 12M-1, 12M-2, 12M-3)
+
+**核心原则**:
+- **Frame-based**: 以帧为单位，格式 `HH:MM:SS:FF`（小时:分钟:秒:帧）
+- **整数运算**: 所有帧号都是整数
+- **原点对齐**: Frame 0 = Time 0
+- **FPS 依赖**: 帧率决定显示时间，但帧数不变
+
+**支持的帧率**:
+| FPS | 用途 |
+|-----|------|
+| 23.98 (24÷1.001) | 北美 HDTV |
+| 24 | 电影、ATSC、2K/4K/6K |
+| 25 | PAL/SECAM（欧洲、澳大利亚）|
+| 29.97 (30÷1.001) | NTSC（北美、日本）|
+| 30 | ATSC |
+
+**Drop-Frame vs Non-Drop-Frame**:
+- **Drop-Frame (DF)**: 每 minute 跳过 frame 0,1（除第10分钟），用于补偿 29.97fps
+- **Non-Drop-Frame (NDF)**: 连续帧号
+- 表示法: DF 用分号 `HH;MM;SS;FF`，NDF 用冒号 `HH:MM:SS:FF`
+
+---
+
+### 1.2 EDL (Edit Decision List)
+
+**用途**: 剪辑决策列表，用于记录剪辑点
+
+**简单 EDL 格式**:
+
+**Time-based**:
+```
+[begin second] [end second] [action]
+5.3   7.1    0    # cut from 5.3s to 7.1s
+15    16.7   1    # mute from 15s to 16.7s
+```
+
+**Frame-based**:
+```
+#[begin frame] #[end frame] [action]
+#127   #170    0    # cut from frame 127 to 170
+#360   #400    1    # mute from frame 360 to 400
+```
+
+**关键点**:
+- 支持两种定位方式：time（浮点）和 frame（整数）
+- Action 类型：0=cut, 1=mute, 2=scene marker, 3=skip
+- **推荐使用 Frame-based** 以保证精度
+
+---
+
+### 1.3 AAF (Advanced Authoring Format)
+
+**来源**: Advanced Media Workflow Association (AMWA)  
+**标准化**: SMPTE
+
+**特点**:
+- 专业级跨平台数据交换格式
+- 包含 Essence Data（音频、视频等）和 Metadata
+- 支持复杂的对象关系描述
+- 追踪从源文件到最终产出的完整历史
+- 用于"进行中的作品"（works in progress）
+
+**与 MXF 的关系**:
+- AAF 用于编辑中的项目
+- MXF 用于交换完成的媒体产品
+- MXF 是 AAF 数据模型的子集
+
+---
+
+### 1.4 OpenTimelineIO
+
+**来源**: Pixar 开发，现由 Academy Software Foundation 维护  
+**状态**: 成熟框架，广泛应用于影视行业
+
+**核心设计**:
+- **OpenTime**: 无依赖的时间处理库
+- **数据模型**: Timeline → Track → Clip → Media Reference
+- **帧与时间分离**: 
+  - `RationalTime`: value + rate（精确的时间表示）
+  - `TimeRange`: start_time + duration
+  - 帧是整数，时间是 RationalTime
+
+**示例**:
+```python
+import opentimelineio as otio
+
+timeline = otio.adapters.read_from_file("project.aaf")
+for clip in timeline.find_clips():
+    print(clip.name, clip.duration())
+    # duration() 返回 RationalTime(value, rate)
+```
+
+**支持的格式**:
+- Final Cut Pro XML
+- AAF
+- CMX 3600 EDL
+- 原生 `.otio`, `.otioz`, `.otiod`
+
+---
+
+## 二、主流软件对比
+
+### 2.1 Adobe Premiere Pro
+
+**定位方式**:
+- 使用 SMPTE Timecode
+- 支持 Drop-Frame 和 Non-Drop-Frame
+- 内部用帧号定位，显示用时间码
+- 导出格式：EDL, XML, AAF
+
+### 2.2 Final Cut Pro
+
+**定位方式**:
+- 使用 Apple 时间码格式
+- Frame-based 内部处理
+- 导出格式：FCP XML（专有格式）
+- 时间以 frame + fps 存储
+
+### 2.3 DaVinci Resolve
+
+**定位方式**:
+- 支持多种时间码格式
+- 项目设置选择 FPS（全局）
+- Timeline 使用 frame 定位
+- 支持 EDL, AAF, OTIO 导出
+
+### 2.4 Avid Media Composer
+
+**定位方式**:
+- 专业级 SMPTE Timecode 实现
+- 支持 Drop-Frame 计数
+- 轨道级时间码管理
+- AAF 原生支持
+
+---
+
+## 三、核心设计原则总结
+
+### 3.1 行业共识
+
+| 原则 | 说明 |
+|------|------|
+| **Frame 是唯一标准** | 所有定位、剪辑、同步都用帧号 |
+| **整数运算** | 避免浮点精度问题 |
+| **FPS 是元数据** | 不改变帧数，只改变显示时间 |
+| **原点对齐** | Frame 0 = Time 0 |
+| **Time 仅用于显示** | Frame ÷ FPS = Time |
+
+### 3.2 数据流架构
+
+```
+┌─────────────────────────────────────────────┐
+│         Source Data (各种格式)               │
+│  - Video files (frame-based metadata)       │
+│  - Audio files (time-based or sample-based) │
+│  - Analysis results (various formats)       │
+└─────────────────────────────────────────────┘
+                    │
+                    ▼
+┌─────────────────────────────────────────────┐
+│         统一转换层 (标准化)                   │
+│  - Time → Frame (用 FPS)                    │
+│  - Sample → Frame (用 sample_rate)          │
+│  - 所有数据统一为 Frame                      │
+└─────────────────────────────────────────────┘
+                    │
+                    ▼
+┌─────────────────────────────────────────────┐
+│         内部数据模型 (Frame-based)           │
+│  - Mark.startFrame (integer)                │
+│  - Mark.endFrame (integer)                  │
+│  - Clip.timelineStartFrame (integer)        │
+│  - Project.fps (metadata)                   │
+└─────────────────────────────────────────────┘
+                    │
+                    ▼
+┌─────────────────────────────────────────────┐
+│         Timeline 展示层                      │
+│  - 位置：frame / totalFrames * 100%         │
+│  - 显示：frame / fps → "MM:SS"              │
+│  - 所有轨道对齐                              │
+└─────────────────────────────────────────────┘
+```
+
+---
+
+## 四、对 Momentry Studio 的启示
+
+### 4.1 遵循行业标准
+
+**推荐做法**:
+1. ✅ 采用 Frame 作为唯一定位标准
+2. ✅ 所有 Frame 操作使用整数
+3. ✅ FPS 作为项目元数据
+4. ✅ Time 仅用于显示转换
+5. ✅ 原点对齐：Frame 0 = Time 0
+
+### 4.2 数据格式建议
+
+```typescript
+// Mark 定义（符合行业标准）
+interface Mark {
+  id: string
+  startFrame: number    // integer, SMPTE-style
+  endFrame?: number     // integer
+  tag: string
+  note?: string
+}
+
+// Clip 定义（类似 OTIO）
+interface Clip {
+  sourceStartFrame: number    // integer
+  sourceEndFrame: number      // integer
+  timelineStartFrame: number  // integer
+  timelineEndFrame: number    // integer
+}
+
+// Project 定义
+interface Project {
+  fps: number           // 元数据
+  totalFrames: number   // integer
+  duration: number      // 仅用于显示，计算得出
+}
+```
+
+### 4.3 导出格式支持
+
+**优先级**:
+1. **P0 - 内部格式**: 自定义 JSON/SQLite（Frame-based）
+2. **P1 - EDL**: 简单 EDL（Frame-based）
+3. **P2 - OTIO**: OpenTimelineIO 格式（行业标准）
+4. **P3 - AAF/FCPXML**: 专业软件互操作
+
+---
+
+## 五、参考资料
+
+### 5.1 标准文档
+
+- [SMPTE ST 12-1:2008](https://ieeexplore.ieee.org/document/7289820/) - Time and Control Code
+- [CMX 3600 EDL Specification](http://xmil.biz/EDL-X/CMX3600.pdf)
+- [OpenTimelineIO Documentation](https://opentimelineio.readthedocs.io/)
+
+### 5.2 相关 Wikipedia 文章
+
+- [SMPTE timecode](https://en.wikipedia.org/wiki/SMPTE_timecode)
+- [Edit decision list](https://en.wikipedia.org/wiki/Edit_decision_list)
+- [Advanced Authoring Format](https://en.wikipedia.org/wiki/Advanced_Authoring_Format)
+
+### 5.3 开源项目
+
+- [OpenTimelineIO](https://github.com/AcademySoftwareFoundation/OpenTimelineIO) - Pixar 开源
+- [OpenTimelineIO Plugins](https://github.com/OpenTimelineIO) - 各种适配器
+
+---
+
+## 六、结论
+
+视频编辑行业的定位标准明确且统一：
+
+1. **Frame 是唯一标准** - 所有专业软件和行业标准都基于帧号
+2. **整数运算** - 避免浮点精度问题
+3. **FPS 作为元数据** - 不改变帧数，只影响显示时间
+4. **OpenTimelineIO 是最佳参考** - 现代、开源、行业标准
+
+Momentry Studio 的设计完全符合行业标准：
+- ✅ Frame-based 定位
+- ✅ 整数运算
+- ✅ FPS 作为元数据
+- ✅ 原点对齐
+- ✅ 多轨同步
+
+可以继续按照现有设计文档推进实现。

AGENTS.md

@@ -1,5 +1,20 @@
 # AGENTS.md
 
+## Important: File Path Convention
+
+**All file paths in this document and code references must use full absolute paths.**
+
+Examples:
+- ✅ `/Users/accusys/momentry_studio/src/views/PeopleView.vue`
+- ❌ `src/views/PeopleView.vue`
+- ✅ `/Users/accusys/momentry_studio/src-tauri/src/db.rs`
+- ❌ `src-tauri/src/db.rs`
+
+## Workflow
+
+**Before starting any task, always create a `todowrite` with all steps listed.**
+Mark items `in_progress` while working and `completed` when done.
+
 ## Stack
 - **Frontend**: Vue 3 + TypeScript + Vite (port 5173)
 - **Desktop**: Tauri 2 (Rust backend in `src-tauri/`)
@@ -7,23 +22,39 @@
 
 ## Commands
 ```
-npm run dev          # Vite dev server (port 5173)
+npm run proxy        # Start Rust proxy binary only (port 8888)
+npm run dev          # Start Rust proxy + Vite dev server (port 5173)
 npm run build        # vue-tsc --noEmit && vite build (typecheck + bundle)
 npm run preview      # Preview production build
 npm run tauri        # Alias for `cargo tauri`
 cargo tauri dev      # Full Tauri desktop dev (builds frontend + opens native window)
 cargo tauri build    # Full native app build (outputs to src-tauri/target/release/bundle/)
 ```
+- **Browser dev flow**: `npm run dev` → kills old proxy on 8888 → starts `momentry-proxy` → sleeps 2s → starts Vite. Vite proxy forwards `/api/v1/*` to Rust proxy at `localhost:8888` and `/api/v2/*` directly to MarkBase at `localhost:11438`. Rust proxy handles face-crop, cluster-results, identity-matches, search-history, bookmarks, profile images locally; proxies rest to Core API at `localhost:3002`.
+
+## Two-API Architecture (不可混淆)
+**Two independent backend APIs. `/api/v1/*` → Momentry Core API ONLY; `/api/v2/*` → MarkBase Core API ONLY. Never cross.**
+
+| API | Port | Namespace | Owner | Auth |
+|---|---|---|---|---|
+| **Momentry Core API** | `:3002` | `/api/v1/*` only (files, search, identities, faces, traces, agents, video-marks…) | `/Users/accusys/momentry_core` | `api_key` injected by Studio proxy |
+| **MarkBase Core API** | `:11438` | `/api/v2/*` only (admin, myfiles, service, auth, config, tree, products…) | `/Users/accusys/markbase/markbase-core` | Bearer token (`/api/v2/admin/login`) |
+
+**Routing rules** (`/Users/accusys/momentry_studio/src-tauri/src/proxy.rs`):
+- Studio proxy `:8888` is a v1/v2 gateway: `fallback_handler` routes `/api/v2/*` → `proxy_to(MARKBASE_API, inject_api_key=false)` and any other `/api/*` → `proxy_to(CORE_API, inject_api_key=true)`. MarkBase does NOT get `api_key` injected.
+- Vite dev proxy (`/Users/accusys/momentry_studio/vite.config.ts`): `/api/v1` → `localhost:8888`, `/api/v2` → `localhost:11438`.
+- **Admin data (`get_system_stats`/`list_admin_users`/`list_shares`) always comes from MarkBase `/api/v2/admin/*` in ALL modes** — these are forced to `httpCall()` in `src/api/index.ts` (no Tauri commands exist for them).
+- `ClientView` (`/Users/accusys/momentry_studio/src/views/ClientView.vue`) talks to MarkBase directly via `MARKBASE_URL + '/api/v2'` (bypasses Studio proxy). `start_service`/`stop_service` use `detectBaseUrl()` → MarkBase directly.
 
 ## Architecture
 - **Dual-mode API**: Frontend uses `apiCall()` from `src/api/index.ts` which detects `window.__TAURI__` and dispatches to either Tauri IPC (`invoke`) or HTTP to proxy at `http://0.0.0.0:8888`.
-- **Rust Tauri commands**: `src-tauri/src/main.rs` — 22 Tauri commands:
+- **Rust Tauri commands**: `src-tauri/src/main.rs` — 19 Tauri commands:
   - Core API: `search_llm_smart`, `search_agents`, `get_files`, `get_people`, `get_faces`, `get_traces`, `get_file_info`
   - Media: `get_thumbnail`, `get_face_thumbnail`, `get_identity_profile`
   - Identity: `update_identity_name`, `update_identity_status`, `update_identity_starred`, `delete_identity`, `search_identities`, `get_face_candidates`, `merge_identities`, `bind_face`, `unbind_face`
   - File ops: `register_file`, `process_file`, `unregister_file`
   - Local SQLite: `get_search_history`, `save_search_history`, `rename_search_history`, `pin_search_history`, `delete_search_history`, `get_bookmarks`, `save_bookmark`, `delete_bookmark`
-- **Rust HTTP proxy** (`src-tauri/src/proxy.rs`): Axum on port 8888. Forwards `/api/v1/*` to Core API (localhost:3002) with API key injection. Handles `/api/v1/search-history` and `/api/v1/bookmarks` locally via `db::` functions. Handles `/api/v1/identity/{uuid}/profile` (reads local filesystem) and `/api/v1/face-thumbnail` (downloads frame + crops bbox) locally — these mirror the Tauri IPC commands that can't be proxied to Core API.
+- **Rust HTTP proxy** (`src-tauri/src/proxy.rs`): Axum on port 8888. Routes `/api/v2/*` to MarkBase API (localhost:11438) and `/api/v1/*` to Core API (localhost:3002) with API key injection. Handles `/api/v1/search-history` and `/api/v1/bookmarks` locally via `db::` functions. Handles `/api/v1/identity/{uuid}/profile` (reads local filesystem) and `/api/v1/face-thumbnail` (downloads frame + crops bbox) locally — these mirror the Tauri IPC commands that can't be proxied to Core API.
 - **Per-user SQLite**: `src-tauri/src/db.rs` — Project-root `data/users/demo.sqlite` (outside `src-tauri/` to avoid dev watcher rebuilds). WAL mode enabled. Tables: `search_history`, `bookmarks`, `app_users`. `init_db()` called on app setup.
 - **Frontend routes**: `/search`, `/library`, `/people` (redirect `/` → `/search`)
 - **Frontend entry**: `src/main.ts` → `App.vue` → `router/index.ts`
@@ -38,7 +69,7 @@ cargo tauri build    # Full native app build (outputs to src-tauri/target/releas
 - **Full native build order**: `npm install` → `npm run build` → `cargo tauri build`
 - **Rust deps**: sqlx 0.8, rusqlite 0.32 (bundled), reqwest, tokio, tauri-plugin-shell, base64, chrono, uuid
 - **Core API**: `http://localhost:3002`, API key hardcoded in Rust only.
-- **Proxy**: `http://0.0.0.0:8888` — forwards `/api/v1/*` to Core API with auto-injected key; handles `/api/v1/search-history` and `/api/v1/bookmarks` locally.
+- **Proxy**: `http://0.0.0.0:8888` — v1/v2 gateway: `/api/v2/*` → MarkBase (11438, no key), `/api/v1/*` → Core API with auto-injected key; handles `/api/v1/search-history` and `/api/v1/bookmarks` locally.
 
 ## Patterns
 - **Search thumbnails**: Use `start_frame` for frame-accurate thumbnails. Cache key format: `${file_uuid}:${start_frame}`. Not a single `file_uuid` key because same file can appear in multiple search results at different time segments.
@@ -48,6 +79,8 @@ cargo tauri build    # Full native app build (outputs to src-tauri/target/releas
 - **v-observe directive**: Global directive (`v-observe`) registered in `main.ts`. Defined in `src/directives/vObserve.ts`. Uses `IntersectionObserver` with 200px rootMargin. Includes `requestAnimationFrame` fallback for elements already visible on mount.
 - **SearchView empty state**: When `messages.length === 0`, shows `.ms-hero` with "Momentry Studio" + "Turn Every Moment Into Intelligence" slogan. Chat area gets `.chat--empty` class (flex-column, justify-end) to position hero near the search bar. Once messages exist, hero disappears and `.ibar` stays fixed at bottom.
 - **No `console.log` in *.vue files**: All debug console.log statements have been removed. Use `console.error` only for actual errors.
+- **No dev residue allowed (`以後不再有 dev 殘留`)**: Never commit or leave scratch/dev files in the repo — this includes tracked backup snapshots (`*.bak`, `*.bak3`, `*.base`, `*.clean`, `*.work`, `*.backup_*`), standalone dev-only binaries/scripts (e.g. `gen_password.rs`), and unused dead code. Keep backups out of git (personal temp or gitignored); delete them when done. New dev features must not introduce `console.log` (even temporary — use `console.error` or remove before commit).
+- **Face settings owned by Core**: `src/api/index.ts` `register_file`/`process_file` and the Rust commands in `/Users/accusys/momentry_studio/src-tauri/src/main.rs` must NOT send or read `face_settings`/`FACE_MIN_*` env vars. Core API owns the face-detection defaults server-side (see Core guide `docs_v1.0/M4_workspace/2026-08-08_face_settings_studio_guide.md`).
 - **Search history & bookmarks**: Stored in per-user SQLite (`data/users/demo.sqlite`), not localStorage. History items have `id`, `query`, `title`, `chat_state` (JSON-serialized Vue messages), `mode`, `pinned`, timestamps. Max 30 items; pinned sorted first. Composable `useSearchHistory()` provides `loadHistory`, `saveToHistory`, `renameHistory`, `pinHistory`, `deleteHistory`, `restoreFromHistory`. Composable `useBookmarks()` provides `loadBookmarks`, `saveBookmark`, `deleteBookmark`.
 - **SearchView history panel**: Dropdown with ⋯ menu per item (Pin/Unpin, Rename, Delete). +New button clears chat. Click item → restores `chat_state` JSON or runs new search. Renames via modal dialog.
 - **SearchView bookmark panel**: Dropdown with items from SQLite. Click → runs search. Hover shows x button to delete.
@@ -55,4 +88,21 @@ cargo tauri build    # Full native app build (outputs to src-tauri/target/releas
 - **HistoryItem ID format**: `h_{timestamp}_{random}` e.g. `h_1718000000_abc123`.
 - **SQLite WAL mode + path outside src-tauri**: Database at project-root `data/users/demo.sqlite` (not inside `src-tauri/`). WAL journal mode prevents `-journal` file creation that triggers `cargo tauri dev` watcher rebuilds. Default path `../data/users/demo.sqlite` resolved from `src-tauri/` cwd.
 - **Video streaming**: `get_video_stream` is NOT a Tauri command. Both Tauri and browser modes use the proxy URL directly (`http://localhost:8888/api/v1/file/{uuid}/video?...`). The `<video>` element streams from the proxy, never via IPC. Proxy streams `video/*` and `octet-stream` responses (doesn't buffer entire body).
-- **Face thumbnail & identity profile in browser mode**: `/api/v1/face-thumbnail` and `/api/v1/identity/{uuid}/profile` are handled locally by the proxy (same logic as Tauri IPC commands). Core API doesn't support bbox cropping for face thumbnails or local filesystem for profiles.
+- **Face thumbnail & identity profile in browser mode**: `/api/v1/face-thumbnail` and `/api/v1/identity/{uuid}/profile` are handled locally by the proxy (same logic as Tauri IPC commands). Core API doesn't support bbox cropping for face thumbnails or local filesystem for profiles.
+- **Advanced Mode (🔒/🔓)**: Store at `/Users/accusys/momentry_studio/src/stores/advancedMode.ts`. Toggle button (🔒 closed / 🔓 open) in LibraryView toolbar persists to localStorage key `momentry_advanced_mode`. Controls visibility of advanced features:
+  - `LibraryView.vue:180` — Processor QC button `v-if="isAdvanced"`
+  - `VideoPlayer.vue:88,129,169,198` — Mark timelines, controls, panel, frame seek `v-if="isAdvanced"`
+  - `PeopleView.vue:19` — Data QC button `v-if="selectedFileUuid && isAdvanced"`
+  - `BuildVersion.vue:2` — Build version badge `v-if="isAdvanced"`
+  - Import: `import { useAdvancedMode } from '@/stores/advancedMode'`
+  - Usage: `const { isAdvanced } = useAdvancedMode()`
+- **File Status (Core API 單一來源)**: 6 個狀態 values 由 Core API 回傳，前端只負責顯示不過濾：
+  - `registered` → 📋 已註冊（剛註冊）
+  - `scanning` → 🔍 掃描中（處理中，顯示 progress bar）
+  - `keyword_ready` → 🔎 關鍵字可用（sentence chunks 完成）
+  - `semantic_ready` → 🧠 語意可用（embedded chunks 完成）
+  - `face_mgmt_ready` → 🎭 臉部管理可用（trace_profiles + tkg_nodes 完成）
+  - `agent_ready` → 🤖 Agent 可用（tkg_edges 完成，終端狀態）
+  - 前端不做任何本地 status promotion（已移除 `pollProgress`、`loadPipelineStats`、`refreshFileStatus` 中的 `f.status =` 賦值）
+  - 唯一寫入點：`syncFileStatus()` 將 Core API 回傳值寫入 `fileStatusCache` + `f.status`
+  - 顯示函數：`LibraryView.vue` line 1274 (`statusFromDB`), 1283 (`statusBadgeClass`), 1291 (`statusBadgeIcon`), 1299 (`statusBadgeLabel`)

CORE_TEAM_ACTION_ITEMS.md

@@ -0,0 +1,280 @@
+# Core Team Action Items - Pipeline Progress Issue
+
+## ✅ Studio Team 已完成修复
+
+**修复内容**：
+1. ✅ 权重配置已修正（基于 Core team 规格）
+2. ✅ 移除 identity_agent 过滤
+3. ✅ API 端点已验证正确
+
+**Commit**: `待推送`
+
+---
+
+## 🚨 问题摘要（已部分解决）
+
+**现象**：Library 卡片在 deep scan 时卡在 "Scanning..." 状态，没有进度百分比
+
+**前端已修复**：
+- ✅ 权重配置已修正（基于 Core team 规格）
+- ✅ 移除 identity_agent 过滤
+- ✅ API 端点已验证正确（无需修改）
+- ✅ `syncFileStatus()` 现在会加载进度数据
+- ✅ LibraryView 会启动轮询即使 pipeline 数据缺失
+
+**后端需要诊断**：3 项核心问题
+
+---
+
+## 📋 Core Team 需要检查的项目
+
+### 1. 🟡 Pipeline 进度计算逻辑（中优先级）
+
+**位置**: Core API pipeline 执行引擎
+
+**需要检查**：
+- 各处理阶段的进度追踪是否准确？
+- `overall_progress` 权重计算是否正确？
+- 阶段状态转换是否及时？
+
+**权重设置**（前端期望）：
+```typescript
+const WEIGHT_MAP = {
+  processors: 0.30,
+  rule1_ingestion: 0.10,
+  face_tracing: 0.10,
+  tkg_nodes: 0.20,
+  tkg_edges: 0.15,
+  rule2_ingestion: 0.15
+}
+```
+
+**需要验证**：
+- ✅ 后端权重是否与前端一致？
+- ✅ 各阶段进度是否正确追踪？
+- ✅ 阶段完成时是否立即更新状态？
+
+---
+
+### 4. 🟡 Pipeline stages 初始化（中优先级）
+
+**需要检查**：
+- 文件开始处理时，是否立即创建 stages 数据？
+- 所有必要的阶段是否都被追踪？
+- 阶段顺序是否正确？
+
+**可能的问题**：
+- 文件开始处理时，`stages` 数组为空
+- 导致前端无法判断是否有正在运行的阶段
+- `pollPipelineProgress()` 不会被启动
+
+**需要验证**：
+- ✅ 文件注册后，立即创建初始 stages？
+- ✅ 所有阶段都被包含在返回数据中？
+- ✅ 阶段顺序是否符合 pipeline 流程？
+
+---
+
+### 5. 🟡 文件处理异常处理（中优先级）
+
+**需要检查**：
+- 处理过程出错时，文件状态是否正确更新？
+- 是否有文件卡在 `processing` 状态无法完成？
+- 错误日志是否完整？
+
+**可能的问题**：
+- 文件处理出错，但状态未更新为 `failed`
+- 文件永远卡在 `processing` 状态
+- 前端无法判断文件是否完成
+
+**需要验证**：
+- ✅ 错误处理机制是否完善？
+- ✅ 失败文件是否有明确的 `failed` 状态？
+- ✅ 错误日志是否包含足够信息？
+
+---
+
+## 🧪 诊断步骤
+
+### Step 1: 检查 processing 文件的 pipeline stats
+
+```bash
+# 1. 获取 processing 文件列表
+curl -X GET "http://localhost:3002/api/v1/files?status=processing&per_page=10" \
+  -H "Authorization: Bearer {API_KEY}"
+
+# 2. 对每个 processing 文件，检查 pipeline stats
+for uuid in $(processing_files); do
+  echo "=== File: $uuid ==="
+  curl -X GET "http://localhost:3002/api/v1/pipeline-stats?file_uuid=$uuid" \
+    -H "Authorization: Bearer {API_KEY}"
+  echo ""
+done
+```
+
+**观察重点**：
+- `overall_progress` 是否为 0 或 null？
+- `stages` 数组是否为空？
+- 是否有 stage 的 `status === 'running'`？
+
+---
+
+### Step 2: 检查文件状态同步
+
+```bash
+# 对卡住的文件，手动调用 sync_file_status
+curl -X POST "http://localhost:3002/api/v1/sync-file-status" \
+  -H "Authorization: Bearer {API_KEY}" \
+  -H "Content-Type: application/json" \
+  -d '{"file_uuid": "{STUCK_FILE_UUID}"}'
+```
+
+**观察重点**：
+- API 是否返回正确的状态？
+- 状态是否从 `processing` 变为 `completed`？
+
+---
+
+### Step 3: 检查后端日志
+
+```bash
+# 查看最近的错误日志
+tail -f /path/to/core-api/logs/error.log | grep -E "pipeline|processing|file_uuid"
+```
+
+**观察重点**：
+- 是否有 pipeline 执行错误？
+- 是否有文件处理超时？
+- 是否有数据库连接错误？
+
+---
+
+## 📊 API 端点验证结果
+
+### ✅ 已验证正确（无需修改）
+
+**API 端点已是正确的**：
+- ✅ `get_pipeline_stats`: `/api/v1/stats/pipeline/:file_uuid` (src/api/index.ts:510)
+- ✅ `sync_file_status`: `/api/v1/file/:file_uuid/sync-status` (src/api/index.ts:582)
+
+**权重配置已修正**：
+```typescript
+const WEIGHT_MAP = {
+  processors: 0.30,
+  rule1_ingestion: 0.05,      // ✅ 已修正（was 0.10）
+  face_tracing: 0.05,         // ✅ 已修正（was 0.10）
+  identity_agent: 0.10,       // ✅ 已添加（was filtered out）
+  tkg_nodes: 0.20,
+  tkg_edges: 0.15,
+  rule2_ingestion: 0.15
+}
+```
+
+---
+
+## 📊 前端已修复的内容
+
+### 修复 1: `syncFileStatus()` 添加进度加载
+
+**文件**: `src/store.ts:888-891`
+
+**改动**：
+```typescript
+// 在 syncFileStatus() 中，当状态为 processing 时，加载进度数据
+if (newStatus === 'processing') {
+  await loadPipelineStats(fileUuid, true)
+}
+```
+
+**效果**：每 10 秒轮询时，会更新进度数据
+
+---
+
+### 修复 2: LibraryView 启动轮询（处理边缘情况）
+
+**文件**: `src/views/LibraryView.vue:789-790`
+
+**改动**：
+```typescript
+// 即使没有 pipeline 数据，如果状态是 processing，也启动轮询
+else if (!pipeline && f.status === 'processing') {
+  pollPipelineProgress(f.file_uuid)
+}
+```
+
+**效果**：不会因为 pipeline 数据缺失而无法启动轮询
+
+---
+
+### 修复 3: 权重配置修正
+
+**文件**: `src/store.ts:923-931`
+
+**改动**：
+```typescript
+const WEIGHT_MAP: Record<string, number> = {
+  processors: 0.30,
+  rule1_ingestion: 0.05,      // ✅ 修正（was 0.10）
+  face_tracing: 0.05,         // ✅ 修正（was 0.10）
+  identity_agent: 0.10,       // ✅ 添加（was filtered out）
+  tkg_nodes: 0.20,
+  tkg_edges: 0.15,
+  rule2_ingestion: 0.15
+}
+```
+
+**效果**：进度百分比计算准确
+
+---
+
+### 修复 4: 移除 identity_agent 过滤
+
+**文件**: `src/store.ts:919`
+
+**改动**：
+```typescript
+// 移除过滤，包含所有阶段
+const stages = data.stages || []
+```
+
+**效果**：identity_agent 阶段被正确追踪
+
+---
+
+## ✅ 修复验证清单
+
+修复后，前端期望看到：
+
+1. **进度条显示百分比**
+   - 不再只显示 "Scanning..."
+   - 显示具体进度（如 "45%"）
+
+2. **进度数据定期更新**
+   - 每 10 秒更新一次
+   - 进度条实时变化
+
+3. **文件状态正确转换**
+   - `processing` → `completed`
+   - 处理失败的文件显示 `failed`
+
+4. **无卡住现象**
+   - 文件不会永远卡在 `processing`
+   - 有明确的完成时间
+
+---
+
+## 📞 联系方式
+
+如有疑问，请联系 Studio team：
+
+- **前端修复 Commit**: `{COMMIT_HASH}`
+- **修复文件**:
+  - `src/store.ts:888-891`
+  - `src/views/LibraryView.vue:789-790`
+- **测试环境**: `http://localhost:5173`
+- **API 文档**: `AGENTS.md`
+
+---
+
+**生成时间**: 2026-07-25
+**优先级**: 🔴 高 - 影响用户体验

CORE_TEAM_RESPONSE.md

@@ -0,0 +1,180 @@
+# Core Team Response - Pipeline Progress Issue
+
+**Date**: 2026-07-25
+**Author**: Core Team (OpenCode)
+**Status**: ✅ Implemented
+
+---
+
+## Summary
+
+Core Team has implemented all 3 requested backend fixes:
+
+| # | Item | Status |
+|---|------|--------|
+| 1 | Add "running" stage tracking | ✅ Completed |
+| 2 | Initialize stages at registration | ✅ Completed |
+| 3 | sync-status TKG check | ✅ Completed |
+
+---
+
+## Changes Made
+
+### 1. "Running" Stage Tracking
+
+**Problem**: Stages only showed `pending` → `completed`, never `running`.
+
+**Solution**: Added `publish_pipeline_progress` calls at the start of each stage.
+
+**Files Modified**: `src/worker/job_worker.rs`
+
+| Stage | Line | Trigger |
+|-------|------|---------|
+| processors | ~472 | Job picked up |
+| rule1_ingestion | ~1885 | ASRX completed |
+| face_tracing | ~1991 | Face completed |
+| identity_agent | ~2223 | Seeds exist |
+| tkg_nodes + tkg_edges | ~2372 / ~2486 | Face + ASRX completed |
+| rule2_ingestion | ~2432 | TKG completed |
+
+**Example**:
+```rust
+// Mark face_tracing as running
+{
+    let mut pp = PipelineProgress::new(&uuid_clone);
+    pp.update_stage("face_tracing", 0.0, "running", None);
+    publish_pipeline_progress(redis_clone.as_ref(), &uuid_clone, &pp).await;
+}
+```
+
+---
+
+### 2. Initialize Stages at Registration
+
+**Problem**: Stages were empty when file started processing, frontend couldn't determine active stages.
+
+**Solution**: Initialize `PipelineProgress` immediately after `create_monitor_job`.
+
+**Files Modified**: `src/api/files.rs:866-874`
+
+```rust
+if let Ok(job) = auto_state.db.create_monitor_job(&auto_uuid, Some(vp)).await {
+    // Initialize pipeline progress with all stages pending
+    if let Ok(redis) = crate::core::db::RedisClient::new() {
+        let pp = PipelineProgress::new(&auto_uuid);
+        publish_pipeline_progress(&redis, &auto_uuid, &pp).await;
+    }
+    // ...
+}
+```
+
+---
+
+### 3. sync-status TKG Check
+
+**Problem**: `sync_file_status` only checked processors, not TKG or chunks.
+
+**Solution**: Check TKG nodes, edges, and sentence chunks before marking as `completed`.
+
+**Files Modified**: `src/api/files.rs:1762-1856`
+
+**New Response Format**:
+```json
+{
+  "success": true,
+  "file_uuid": "...",
+  "status": "completed",
+  "processors_complete": 5,
+  "processors_total": 5,
+  "tkg_nodes": 123,
+  "tkg_edges": 45,
+  "sentence_chunks": 67,
+  "is_music_only": false
+}
+```
+
+**Logic**:
+- `completed` = processors_done + tkg_nodes > 0 + sentence_chunks > 0
+- For music-only files: `tkg_edges == 0` is acceptable
+- `is_music_only` = processors_done + tkg_nodes > 0 + tkg_edges == 0
+
+---
+
+## API Changes
+
+### `/api/v1/file/:file_uuid/sync-status` Response Changes
+
+| Field | Type | Description |
+|-------|------|-------------|
+| `tkg_nodes` | i64 | TKG node count |
+| `tkg_edges` | i64 | TKG edge count |
+| `sentence_chunks` | i64 | Rule 1 sentence chunk count |
+| `is_music_only` | bool | True if music-only file (no faces) |
+
+---
+
+## Testing
+
+### Test Commands
+
+1. **Register new file and check initial stages**:
+   ```bash
+   # After registration, immediately check
+   curl http://localhost:3002/api/v1/stats/pipeline/{file_uuid}
+   
+   # Expected: stages array has 7 elements, all "pending"
+   ```
+
+2. **Check "running" status during processing**:
+   ```bash
+   # During processing, check stages
+   curl http://localhost:3002/api/v1/stats/pipeline/{file_uuid}
+   
+   # Expected: at least one stage shows "running"
+   ```
+
+3. **Check sync-status response**:
+   ```bash
+   curl -X POST http://localhost:3002/api/v1/file/{file_uuid}/sync-status
+   
+   # Expected: includes tkg_nodes, tkg_edges, sentence_chunks, is_music_only
+   ```
+
+---
+
+## Deployment
+
+**Environment**: Production (3002)
+**Status**: ✅ Deployed, running
+
+**Implemented Files**:
+- `src/worker/job_worker.rs`: 6 处 "running" 状态更新
+- `src/api/files.rs:866`: 注册时初始化 stages
+- `src/api/files.rs:1762`: sync-status 检查 TKG + chunks
+- `src/api/files.rs:16`: 新增 imports
+
+**Build**: 2026-07-24T18:43:52Z
+
+---
+
+## Notes
+
+### Music-Only Files
+
+For files with no faces (music-only):
+- `identity_agent`: marked as "completed (no faces)"
+- `tkg_edges`: marked as "completed (no faces)"
+- `rule2_ingestion`: marked as "completed (no faces)"
+
+This is handled in `src/api/scan.rs:1210-1216` and now correctly detected in `sync_file_status`.
+
+---
+
+## Commit
+
+Branch: main
+Commit: (pending - to be committed after verification)
+
+---
+
+**Contact**: Core Team (OpenCode)

DEPLOYMENT_TEST_REPORT.md

@@ -0,0 +1,50 @@
+# Admin + Client 部署到 201 测试报告
+
+## 部署时间：2026-06-26 16:25
+
+## 已部署文件
+
+| 文件 | 状态 | 大小 | 说明 |
+|------|------|------|------|
+| **LoginView.vue** | ✅ 已复制 | 3761 bytes | 登录界面 ⭐⭐⭐⭐⭐ |
+| **ClientView.vue** | ✅ 已复制 | 17240 bytes | 文件管理界面 ⭐⭐⭐⭐⭐ |
+| **router/index.ts** | ✅ 已更新 | - | 添加 /login 路由 |
+| **App.vue** | ⏳ 待更新 | - | 需添加路由守卫 |
+
+## 路由配置 ✅
+
+-  → LoginView.vue ✅
+-  → AdminView.vue ✅
+-  → ClientView.vue ✅
+
+## Tauri Commands ✅
+
+已存在：
+-  ✅
+-  ✅
+-  ✅
+-  ✅
+
+## 测试结果 ⚠️
+
+### Vite dev server
+- 状态：运行中
+- 问题：node 命令找不到
+- 解决方案：需要使用绝对路径
+
+### Proxy (port 8888)
+- 状态：运行中
+- 问题：前端路由返回 "Not found"
+- 原因：Vite dev server 未正确启动
+
+## 下一步 ⭐⭐⭐⭐⭐
+
+1. **修复 Vite 启动**：使用绝对路径 
+2. **添加 App.vue 路由守卫**：检查 token 并跳转
+3. **测试完整功能**：登录 + Client 文件管理
+4. **验证 Tauri commands**：文件列表/上传/下载
+
+---
+
+**最后更新**: 2026-06-26 16:25
+**状态**: 文件已部署，等待 Vite 重启 ⭐⭐⭐⭐

FACE_MOVE_DIAGNOSIS_REPORT.md

@@ -0,0 +1,292 @@
+# Face Move/Merge 功能诊断报告
+
+**日期**: 2026-07-25
+**状态**: 已完成显示文本改进，待验证数据流
+
+---
+
+## ✅ 已完成：显示文本改进
+
+### 改进内容
+
+**修改前**: `F{trace_id}`（如 `F13`）
+**修改后**: `Face{trace_id}`（如 `Face13`）
+
+### 修改位置
+
+| 行号 | 位置 | 修改前 | 修改后 |
+|------|------|--------|--------|
+| 143  | Face Detail Modal | `file_uuid:F13` | `file_uuid:Face13` |
+| 262  | Cluster Strip Fallback | `F13` | `Face13` |
+| 264  | Cluster Strip Label | `F13 GroupName` | `Face13 GroupName` |
+
+### 保留的位置
+
+**Line 105**: Frame range 显示
+```vue
+<span>F{{ t.start_frame }}–{{ t.end_frame }}</span>
+```
+- 保持不变，因为这是 Frame 编号范围
+- 示例：`F2219–2225`
+
+---
+
+## 🔍 数据流分析
+
+### 理想数据流
+
+```
+Core API
+  ↓
+返回: trace_ids = [13, 14, 15]  (i64[])
+  ↓
+前端存储
+  ↓
+clusterTracesMap["13"] = {trace_id: 13, ...}
+  ↓
+用户选择
+  ↓
+selectedFaces.push("file_uuid:13")
+  ↓
+API 调用
+  ↓
+merge_trace(file_uuid, source_id=13, target_id=...)
+```
+
+---
+
+### 关键检查点
+
+#### 检查点 1: 数据存储
+
+**代码位置**: PeopleView.vue Line 914-920
+```typescript
+clusterTracesMap.value = {}
+for (const t of allTraces) {
+  clusterTracesMap.value[String(t.trace_id)] = t
+}
+```
+
+**验证要点**:
+- ✅ `t.trace_id` 应该是 `integer`（如 13）
+- ✅ `String(t.trace_id)` 应该是 `"13"`（不是 `"Face13"`）
+
+---
+
+#### 检查点 2: 用户选择
+
+**代码位置**: PeopleView.vue Line 1507-1515
+```typescript
+function toggleFaceSelection(t: any) {
+  const key = `${t.file_uuid}:${t.trace_id}`
+  const idx = selectedFaces.value.indexOf(key)
+  if (idx >= 0) {
+    selectedFaces.value.splice(idx, 1)
+  } else {
+    selectedFaces.value.push(key)
+  }
+}
+```
+
+**验证要点**:
+- ✅ `t.trace_id` 应该是 `integer`（如 13）
+- ✅ `key` 应该是 `"file_uuid:13"`（不是 `"file_uuid:Face13"`）
+
+---
+
+#### 检查点 3: API 调用
+
+**代码位置**: PeopleView.vue Line 1810-1827
+```typescript
+const traceList: { file_uuid: string; trace_id: number }[] = []
+for (const key of selectedFaces.value) {
+  const [file_uuid, trace_id] = key.split(':')
+  traceList.push({ file_uuid, trace_id: parseInt(trace_id) })
+}
+
+for (const t of traceList) {
+  await apiCall('merge_trace', { 
+    file_uuid: t.file_uuid, 
+    source_id: t.trace_id, 
+    target_id: targetTraceId 
+  })
+}
+```
+
+**验证要点**:
+- ✅ `key.split(':')` 应该得到 `["file_uuid", "13"]`
+- ✅ `parseInt("13")` 应该是 `13`（不是 `NaN`）
+- ✅ API 参数应该正确
+
+---
+
+## 🧪 浏览器验证方案
+
+### 方案 1: 检查 selectedFaces 格式
+
+```javascript
+// 1. 打开 PeopleView 页面
+// 2. 选择一个 Face（如 Face13）
+// 3. 打开浏览器控制台，执行：
+
+const app = document.querySelector('#app').__vueParentComponent
+const peopleView = app.ctx.$root.$children[0]
+
+// 检查 selectedFaces
+console.log('=== selectedFaces 内容 ===')
+console.log('selectedFaces:', peopleView.selectedFaces)
+console.log('First key:', peopleView.selectedFaces[0])
+
+// 检查 key 格式
+const [file_uuid, trace_id_str] = peopleView.selectedFaces[0].split(':')
+console.log('file_uuid:', file_uuid)
+console.log('trace_id (string):', trace_id_str)
+console.log('trace_id (parsed):', parseInt(trace_id_str))
+
+// 预期结果：
+// selectedFaces = ["84d838f260e1881a0daa55fabbc8e434:13"]
+// trace_id (string) = "13"
+// trace_id (parsed) = 13
+```
+
+---
+
+### 方案 2: 检查数据源
+
+```javascript
+// 检查 clusterTracesMap
+console.log('=== clusterTracesMap ===')
+console.log('Keys:', Object.keys(peopleView.clusterTracesMap))
+const firstKey = Object.keys(peopleView.clusterTracesMap)[0]
+console.log('First key:', firstKey)
+console.log('Data:', peopleView.clusterTracesMap[firstKey])
+
+// 检查 trace_id 类型
+const trace = peopleView.clusterTracesMap[firstKey]
+console.log('trace_id:', trace.trace_id, typeof trace.trace_id)
+
+// 预期结果：
+// Keys = ["13", "14", "15"]
+// First key = "13"
+// trace_id = 13 (number)
+```
+
+---
+
+### 方案 3: 测试 Move 功能
+
+```javascript
+// 1. 选择几个 Faces
+// 2. 点击 Move 按钮
+// 3. 选择目标 Group
+// 4. 打开 Network 面板，观察请求
+
+// 预期结果：
+// URL: POST /api/v1/file/84d8.../trace/13/merge/142
+// 参数正确，API 调用成功
+```
+
+---
+
+## 📊 潜在问题假设
+
+### 假设 1: 数据源错误
+
+**问题**: Core API 返回的 `trace_id` 格式不正确
+
+**验证**: 检查 Core API 响应
+```bash
+curl "http://localhost:3002/api/v1/file/84d838f260e1881a0daa55fabbc8e434/face-groups"
+```
+
+**预期**: `trace_ids` 应该是 `[13, 14, 15]`（integer array）
+
+---
+
+### 假设 2: 显示文本污染数据
+
+**问题**: 显示文本 `"Face13"` 污染了数据层
+
+**验证**: 检查 `selectedFaces` 内容
+- 如果发现 `"file_uuid:Face13"`，说明数据被污染
+- 应该改为 `"file_uuid:13"`
+
+---
+
+### 假设 3: 前端转换错误
+
+**问题**: 前端某处错误地处理了 `trace_id`
+
+**验证**: 检查所有 `trace_id` 相关代码
+- 数据加载处
+- 用户选择处
+- API 调用处
+
+---
+
+## ✅ 已确认的正确实现
+
+### Core API 规格
+
+**Endpoint**: `POST /api/v1/file/:file_uuid/trace/:trace_id/merge/:target_trace_id`
+
+**参数类型**:
+- `file_uuid`: `string`（无连字符）
+- `trace_id`: `integer`
+- `target_trace_id`: `integer`
+
+**示例**:
+```bash
+POST /api/v1/file/c36f35685177c981aa139b66bbbccc5b/trace/142/merge/396
+```
+
+---
+
+### Face Group 数据结构
+
+**Endpoint**: `GET /api/v1/file/:file_uuid/face-groups`
+
+**响应**:
+```json
+{
+  "face_groups": [{
+    "group_id": 1,
+    "trace_ids": [13, 14, 15],  // i64[] - integer array
+    "trace_count": 3,
+    "representative_trace": 13
+  }]
+}
+```
+
+---
+
+## 📝 下一步行动
+
+### 立即执行
+
+1. **浏览器验证**: 使用上述验证方案检查 `selectedFaces` 格式
+2. **数据流追踪**: 如果发现问题，定位具体污染位置
+3. **API 测试**: 测试 Move 功能是否正常工作
+
+---
+
+### 如果发现问题
+
+1. **数据污染**: 修复数据存储逻辑
+2. **API 参数错误**: 修正 API 调用参数
+3. **其他问题**: 根据验证结果修复
+
+---
+
+## 📞 联系方式
+
+**Studio Team**: 已完成显示文本改进
+**Core Team**: 提供 API 规格确认
+
+**测试环境**: `http://localhost:5173`
+**API 环境**: `http://localhost:3002`
+
+---
+
+**生成时间**: 2026-07-25
+**状态**: 显示改进已完成，等待数据流验证

dist/index.html

@@ -1,13 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Momentry Studio</title>
-  <script type="module" crossorigin src="/assets/index-BXXbgmgw.js"></script>
-  <link rel="stylesheet" crossorigin href="/assets/index-B7dM6B6s.css">
-</head>
-<body>
-  <div id="app"></div>
-</body>
-</html>

docs/CLUSTER_AGENT_IMPLEMENTED.md

@@ -0,0 +1,50 @@
+# Cluster Agent Endpoint — 實作完成
+
+## 新增 Endpoint
+
+**`POST /api/v1/file/:file_uuid/cluster-agent`** — 對指定影片觸發 on-demand face clustering。
+
+## 實作邏輯
+
+1. 查 DB 拿 `file_path`、`fps`，從 `probe_json` 拿 `nb_frames`
+2. 執行 Python `fast_face_clustering_processor.py`（不接受 --frames）
+3. 將分組結果寫入 `tkg_nodes`（`label` = `cluster_id`）
+4. 回傳 Response
+
+## 前端消費流程（不變）
+
+```
+POST /api/v1/file/{uuid}/cluster-agent → 觸發 clustering
+GET  /api/v1/file/{uuid}/face-groups   → 輪詢結果
+```
+
+## Response (200)
+
+```json
+{
+  "success": true,
+  "file_uuid": "477b24d3...",
+  "message": "Clustering completed",
+  "clusters": 25,
+  "total_traces": 37
+}
+```
+
+## 狀態
+
+- ✅ Code 完成、已部署
+- ✅ 測試通過：`477b24d3...` → 25 clusters, 37 traces
+
+## 其他修復（同次部署）
+
+- OCR chunks 現在正確標為 `source_type: ocr`
+- Rule 1 重跑會先刪舊 chunks
+- `store_traced_faces.py` 失敗時寫入 fallback 避免 worker 卡住
+
+## 相關檔案
+
+- `src/api/cluster_agent.rs` — 新 endpoint handler
+- `src/api/server.rs` — route 註冊
+- `src/core/chunk/rule1_ingest.rs` — 先刪舊 chunks
+- `src/core/db/postgres_db.rs` — chunk_type 用 as_str()
+- `src/worker/job_worker.rs` — fallback face_traced.json

docs/DEEP_SCAN_QUEUE_FEATURE_REQUEST.md

@@ -0,0 +1,388 @@
+# Deep Scan 队列功能需求
+
+## 背景
+
+### 当前问题
+
+**前端临时解决方案：**
+- 使用 p-limit 控制并发数（maxConcurrent = 2）
+- 每个文件启动扫描后等待 2 秒
+- 勉强限制同时扫描的文件数量
+
+**存在的限制：**
+1. **不可靠**：前端无法准确控制后端资源使用
+2. **效率低**：固定延迟 2 秒可能不够或浪费时间
+3. **状态不同步**：前端和后端对"正在扫描"的理解不一致
+4. **无优先级**：所有文件按顺序处理，无法优先处理重要文件
+5. **无错误恢复**：如果某个文件处理失败，没有重试机制
+6. **无进度跟踪**：无法准确知道队列中每个文件的处理进度
+
+---
+
+## 需求说明
+
+### 核心需求
+
+**1. 后端队列管理**
+- 后端维护一个全局的扫描队列
+- 限制同时处理的文件数量（可配置，默认 2-4）
+- 自动排队等待，先进先出（FIFO）
+
+**2. 队列状态 API**
+- `/api/v1/queue/status` - 获取队列状态
+  ```json
+  {
+    "active_count": 2,
+    "max_concurrent": 2,
+    "pending_count": 3,
+    "total_processed": 10,
+    "queue": [
+      {
+        "file_uuid": "xxx",
+        "file_name": "video1.mp4",
+        "status": "processing",
+        "started_at": "2026-10-07T10:00:00Z",
+        "progress": 45
+      },
+      {
+        "file_uuid": "yyy",
+        "file_name": "video2.mp4",
+        "status": "pending",
+        "queued_at": "2026-10-07T10:01:00Z",
+        "position": 1
+      }
+    ]
+  }
+  ```
+
+**3. 队列控制 API**
+- `/api/v1/queue/pause` - 暂停队列
+- `/api/v1/queue/resume` - 恢复队列
+- `/api/v1/queue/clear` - 清空队列
+- `/api/v1/queue/prioritize/{file_uuid}` - 提升优先级
+
+**4. 动态并发控制**
+- 根据系统资源（CPU、内存、GPU）自动调整并发数
+- 或从配置文件/API 设置 `max_concurrent`
+
+**5. 错误处理与重试**
+- 自动重试失败的任务（可配置重试次数）
+- 记录失败原因
+- 提供手动重试 API
+
+---
+
+## API 设计建议
+
+### 1. 提交扫描任务
+
+**请求：**
+```http
+POST /api/v1/file/{file_uuid}/deep-scan
+Content-Type: application/json
+
+{
+  "processors": ["face", "asr", "ocr"],
+  "priority": "normal",  // low, normal, high
+  "retry_on_failure": true,
+  "callback_url": "http://..."  // 可选，完成后通知
+}
+```
+
+**响应：**
+```json
+{
+  "success": true,
+  "task_id": "task_xxx",
+  "status": "queued",
+  "position": 3,
+  "estimated_start": "2026-10-07T10:05:00Z"
+}
+```
+
+---
+
+### 2. 查询队列状态
+
+**请求：**
+```http
+GET /api/v1/queue/status
+```
+
+**响应：**
+```json
+{
+  "active_count": 2,
+  "max_concurrent": 2,
+  "pending_count": 3,
+  "paused": false,
+  "queue": [
+    {
+      "task_id": "task_xxx",
+      "file_uuid": "xxx",
+      "file_name": "video1.mp4",
+      "status": "processing",
+      "started_at": "2026-10-07T10:00:00Z",
+      "progress": 45,
+      "processors": ["face", "asr"]
+    },
+    {
+      "task_id": "task_yyy",
+      "file_uuid": "yyy",
+      "file_name": "video2.mp4",
+      "status": "pending",
+      "queued_at": "2026-10-07T10:01:00Z",
+      "position": 1,
+      "priority": "normal"
+    }
+  ],
+  "statistics": {
+    "total_processed": 10,
+    "total_failed": 2,
+    "average_time": 120.5
+  }
+}
+```
+
+---
+
+### 3. 任务优先级调整
+
+**请求：**
+```http
+PUT /api/v1/queue/task/{task_id}/priority
+Content-Type: application/json
+
+{
+  "priority": "high"
+}
+```
+
+**响应：**
+```json
+{
+  "success": true,
+  "position": 1
+}
+```
+
+---
+
+### 4. 取消任务
+
+**请求：**
+```http
+DELETE /api/v1/queue/task/{task_id}
+```
+
+**响应：**
+```json
+{
+  "success": true,
+  "message": "Task cancelled"
+}
+```
+
+---
+
+## 数据库设计
+
+### queue_tasks 表
+
+```sql
+CREATE TABLE queue_tasks (
+  task_id TEXT PRIMARY KEY,
+  file_uuid TEXT NOT NULL,
+  file_name TEXT,
+  status TEXT DEFAULT 'pending',  -- pending, processing, completed, failed
+  priority TEXT DEFAULT 'normal',
+  processors JSONB,
+  progress INTEGER DEFAULT 0,
+  queued_at TIMESTAMP DEFAULT NOW(),
+  started_at TIMESTAMP,
+  completed_at TIMESTAMP,
+  error_message TEXT,
+  retry_count INTEGER DEFAULT 0,
+  max_retries INTEGER DEFAULT 3,
+  created_at TIMESTAMP DEFAULT NOW(),
+  updated_at TIMESTAMP DEFAULT NOW()
+);
+
+CREATE INDEX idx_queue_status ON queue_tasks(status);
+CREATE INDEX idx_queue_priority ON queue_tasks(priority, queued_at);
+```
+
+---
+
+## 实现建议
+
+### 后端架构
+
+```
+Queue Manager (Singleton)
+├── Task Queue (Priority Queue)
+├── Worker Pool (2-4 workers)
+├── Resource Monitor
+│   ├── CPU Usage
+│   ├── Memory Usage
+│   └── GPU Usage
+└── Scheduler
+    ├── Dynamic Concurrency Adjustment
+    └── Task Retry Logic
+```
+
+### 核心组件
+
+**1. QueueManager**
+```rust
+pub struct QueueManager {
+    tasks: Arc<Mutex<VecDeque<QueueTask>>>,
+    active_tasks: Arc<Mutex<HashMap<TaskId, JoinHandle>>>,
+    max_concurrent: Arc<AtomicU32>,
+    worker_semaphore: Arc<Semaphore>,
+}
+
+impl QueueManager {
+    pub async fn submit_task(&self, task: QueueTask) -> Result<TaskId>;
+    pub async fn get_status(&self) -> QueueStatus;
+    pub async fn cancel_task(&self, task_id: TaskId) -> Result<()>;
+    pub async fn adjust_concurrency(&self, max: u32);
+}
+```
+
+**2. ResourceMonitor**
+```rust
+pub struct ResourceMonitor {
+    cpu_threshold: f64,  // 80%
+    memory_threshold: f64,  // 80%
+    gpu_threshold: f64,  // 90%
+}
+
+impl ResourceMonitor {
+    pub fn check_resources(&self) -> ResourceStatus;
+    pub fn suggest_concurrency(&self) -> u32;
+}
+```
+
+---
+
+## 前端集成
+
+### 简化后的前端代码
+
+```typescript
+async function batchDeepScan() {
+  const filesToProcess = selectedRegisteredFiles.value
+  
+  // 提交所有任务到后端队列
+  for (const f of filesToProcess) {
+    await apiCall('deep_scan', { 
+      fileUuid: f.file_uuid,
+      priority: 'normal'
+    })
+  }
+  
+  // 轮询队列状态
+  const interval = setInterval(async () => {
+    const status = await apiCall('get_queue_status')
+    actionMsg.value = `Processing: ${status.active_count} active, ${status.pending_count} queuing...`
+    
+    if (status.pending_count === 0 && status.active_count === 0) {
+      clearInterval(interval)
+      actionMsg.value = 'All tasks completed'
+    }
+  }, 2000)
+}
+```
+
+---
+
+## 预期效果
+
+### 用户体验改进
+
+**当前（前端队列）：**
+- ❌ 不准确的并发控制
+- ❌ 固定延迟效率低
+- ❌ 无法查看队列状态
+- ❌ 无法调整优先级
+- ❌ 无法恢复失败任务
+
+**改进后（后端队列）：**
+- ✅ 准确的并发控制
+- ✅ 自动资源管理
+- ✅ 实时队列状态查看
+- ✅ 灵活的优先级调整
+- ✅ 自动重试机制
+- ✅ 错误恢复能力
+
+---
+
+## 配置选项
+
+### momentry.toml
+
+```toml
+[queue]
+# 最大并发处理数
+max_concurrent = 2
+
+# 是否启用动态调整
+dynamic_concurrency = true
+
+# 资源阈值
+cpu_threshold = 80.0
+memory_threshold = 80.0
+gpu_threshold = 90.0
+
+# 重试配置
+max_retries = 3
+retry_delay = 10  # seconds
+
+# 任务超时
+task_timeout = 3600  # seconds
+```
+
+---
+
+## 里程碑
+
+### Phase 1: 基础队列功能
+- 队列数据结构和 API
+- 基本的并发控制
+- 任务状态跟踪
+
+### Phase 2: 高级功能
+- 优先级队列
+- 资源监控
+- 动态并发调整
+
+### Phase 3: 错误处理
+- 自动重试
+- 错误日志
+- 手动干预 API
+
+---
+
+## 参考实现
+
+**类似项目：**
+- Celery (Python)
+- Bull (Node.js)
+- Sidekiq (Ruby)
+
+**关键特性：**
+- 持久化队列
+- 优先级支持
+- 进度跟踪
+- 错误处理
+
+---
+
+## 联系方式
+
+**需求提出者：** Momentry Studio Team  
+**日期：** 2026-10-07  
+**优先级：** High  
+**预计工期：** 2-3 周
+

docs/FACE_CLUSTERING_AGENT_REQUEST.md

@@ -0,0 +1,68 @@
+# Face Clustering Agent Endpoint Request
+
+## 需求
+新增一個 on-demand face clustering endpoint，讓前端可以手動觸發 face trace 分組。
+
+## 背景
+Momentry Studio 的 People 頁面有「Face Deduplication」按鈕，目的是讓使用者可以對已處理 face 的影片執行 face 分組（clustering）。目前這個功能無法使用，因為對應的 API endpoint 不存在。
+
+## 需要的 Endpoint
+
+### `POST /api/v1/file/:file_uuid/cluster-agent`
+
+**用途**：對指定檔案觸發 face clustering，將相似的 face traces 分組。
+
+#### Request
+```
+POST /api/v1/file/{file_uuid}/cluster-agent
+Content-Type: application/json
+X-API-Key: {key}
+
+{}
+```
+
+| 參數 | 類型 | 必填 | 說明 |
+|------|------|------|------|
+| `file_uuid` | string | ✅ (URL path) | 檔案 UUID |
+
+#### Response (200)
+```json
+{
+  "success": true,
+  "file_uuid": "477b24d3...",
+  "message": "Clustering started for file",
+  "clusters": 0,
+  "total_traces": 2
+}
+```
+
+| 欄位 | 類型 | 說明 |
+|------|------|------|
+| `success` | boolean | 是否成功觸發 |
+| `file_uuid` | string | 檔案 UUID |
+| `message` | string | 狀態訊息 |
+| `clusters` | integer | 已分組數量（剛觸發時為 0） |
+| `total_traces` | integer | 該檔案總 face trace 數 |
+
+#### 實作邏輯（建議）
+1. 檢查檔案是否存在且 face 已處理完成
+2. 讀取 face detections / face embeddings
+3. 執行 face clustering（可參考 pipeline 中的 clustering 邏輯）
+4. 將分組結果寫入 TKG（更新 `face_trace` node 的 `label`）
+5. 回傳觸發結果（clustering 可非同步執行）
+
+### 前端消費流程
+```
+1. POST /api/v1/file/{uuid}/cluster-agent   → 觸發 clustering
+2. GET  /api/v1/file/{uuid}/face-groups      → 輪詢直到 face_groups 有資料
+3. 顯示 face groups 在 People 頁面
+```
+
+## 相關檔案
+- **前端按鈕**: `src/views/PeopleView.vue` line 14-18 (`runClusterAgent()`)
+- **API 映射**: `src/api/index.ts` line 369-371 (`run_cluster_agent`)
+- **現有 face-groups**: `GET /api/v1/file/:file_uuid/face-groups` (已存在，用於讀取結果)
+- **Pipeline 處理**: `docs_v1.0/doc_wasm/modules/05_process.md` (face 處理流程)
+
+## 優先級
+中優先級 — 目前有 2 個 unassigned traces 但無法分組，使用者無法有效的進行 face deduplication。

docs/SEARCH_IMPROVEMENTS_FOR_CORE_TEAM.md

@@ -0,0 +1,358 @@
+# Search Improvements for Core Team
+
+## Overview
+
+This document outlines the search improvements implemented in Studio that may require Core API support or coordination.
+
+---
+
+## 1. Keyword Search - Result Merging
+
+### Current Implementation (Studio-side)
+
+```typescript
+function mergeResults(results: any[]): any[] {
+  // Sort by start_frame
+  const sorted = [...results].sort((a, b) => (a.start_frame || 0) - (b.start_frame || 0))
+  
+  // Merge overlapping results (gap <= 30 frames)
+  for (const r of sorted) {
+    const last = merged[merged.length - 1]
+    if (last && last.file_uuid === r.file_uuid) {
+      const gap = r.start_frame - last.end_frame
+      if (gap <= 30) {
+        // Merge: extend end_frame, keep best summary
+        last.end_frame = Math.max(last.end_frame, r.end_frame)
+        if (r.similarity > last.similarity) {
+          last.summary = r.summary
+          last.similarity = r.similarity
+        }
+        continue
+      }
+    }
+    merged.push({ ...r })
+  }
+  return merged.slice(0, 10) // Top 10
+}
+```
+
+### Behavior
+
+| Before | After |
+|--------|-------|
+| 20 results, overlapping segments | 10 merged results |
+| Same content appears multiple times | Deduplicated by frame proximity |
+| Short segments (1-2 seconds) | Merged into longer segments |
+
+### Core API Considerations
+
+**Option A: Server-side Merging**
+- Add `merge=true` parameter to `/api/v1/search/smart`
+- Server returns pre-merged results
+- More efficient, less data transfer
+
+**Option B: Client-side (Current)**
+- Studio fetches 30 results, merges locally
+- More flexible, no Core API changes needed
+
+---
+
+## 2. Minimum Duration Enforcement
+
+### Problem
+
+Some search results are too short (1-2 seconds) to provide meaningful context.
+
+### Proposed Solution
+
+Add `min_duration` parameter to search endpoints:
+
+```bash
+POST /api/v1/search/smart
+{
+  "query": "Audrey Hepburn",
+  "min_duration": 10,  // Minimum 10 seconds
+  "limit": 10
+}
+```
+
+### Core API Impact
+
+| Endpoint | Change |
+|----------|--------|
+| `/api/v1/search/smart` | Add `min_duration` param |
+| `/api/v1/search/llm-smart` | Add `min_duration` param |
+
+**Implementation:**
+1. Filter results where `end_time - start_time < min_duration`
+2. Or expand short results by including adjacent chunks
+
+---
+
+## 3. Frame-based Range Adjustment
+
+### Current Studio Implementation
+
+Users can adjust playback range by frame number:
+
+```vue
+<div class="card-range">
+  <input type="number" v-model.number="r._startFrame">
+  <input type="number" v-model.number="r._endFrame">
+</div>
+```
+
+### Core API Requirements
+
+No changes needed - Studio uses existing `start_frame`/`end_frame` fields.
+
+**Display format:**
+```
+F100–F350 (4:10–14:35)
+```
+
+---
+
+## 4. Mark & Export Feature
+
+### Studio Implementation
+
+```typescript
+const markedResults = ref<any[]>([])
+
+function toggleMark(r: any) {
+  const key = `${r.file_uuid}:${r.start_frame}-${r.end_frame}`
+  const idx = markedResults.value.findIndex(m => 
+    `${m.file_uuid}:${m.start_frame}-${m.end_frame}` === key
+  )
+  if (idx >= 0) {
+    markedResults.value.splice(idx, 1)
+  } else {
+    markedResults.value.push({...r})
+  }
+}
+
+function exportMarked() {
+  const data = {
+    exportedAt: new Date().toISOString(),
+    count: markedResults.value.length,
+    results: markedResults.value
+  }
+  // Download as JSON
+}
+```
+
+### Export Format
+
+```json
+{
+  "exportedAt": "2026-07-20T12:00:00.000Z",
+  "count": 3,
+  "results": [
+    {
+      "file_uuid": "abc123",
+      "file_name": "Roman Holiday.mp4",
+      "start_frame": 100,
+      "end_frame": 350,
+      "start_time": 4.16,
+      "end_time": 14.58,
+      "summary": "Audrey Hepburn speaking...",
+      "similarity": 0.85
+    }
+  ]
+}
+```
+
+### Future Core API Integration
+
+**Possible endpoints:**
+
+```
+POST /api/v1/marks              # Save marked segment
+GET  /api/v1/marks              # List saved marks
+POST /api/v1/marks/export       # Export marks as EDL/JSON
+```
+
+---
+
+## 5. Vector/Keyword Weight Ratio
+
+### Current State
+
+`/api/v1/search/llm-smart` uses RRF (Reciprocal Rank Fusion):
+- Vector search: 50%
+- Keyword (BM25): 50%
+
+### Proposed Change
+
+Increase vector weight for semantic relevance:
+
+```python
+# Current
+score = 0.5 / (k + rank_vector) + 0.5 / (k + rank_keyword)
+
+# Proposed
+VECTOR_WEIGHT = 0.7
+KEYWORD_WEIGHT = 0.3
+score = VECTOR_WEIGHT / (k + rank_vector) + KEYWORD_WEIGHT / (k + rank_keyword)
+```
+
+### Core API Change Required
+
+Add `vector_weight` parameter:
+
+```bash
+POST /api/v1/search/llm-smart
+{
+  "query": "two people talking",
+  "vector_weight": 0.7,  # Default: 0.5
+  "limit": 10
+}
+```
+
+---
+
+## 6. Agent Search - Question Templates
+
+### Studio Implementation
+
+Pre-defined question templates shown below search input:
+
+```typescript
+const QUESTION_TEMPLATES = [
+  { 
+    category: '找檔案', 
+    examples: [
+      '找出包含 {人物} 的影片',
+      '找出 {年份} 年的影片'
+    ] 
+  },
+  { 
+    category: '找人物', 
+    examples: [
+      '{人物} 出現在哪些影片？',
+      '{人物} 和 {人物} 第一次同框'
+    ] 
+  },
+  { 
+    category: '找內容', 
+    examples: [
+      '找出討論 {主題} 的片段',
+      '找出 {時間點} 發生什麼事'
+    ] 
+  }
+]
+```
+
+### Core API Requirements
+
+No changes needed - templates are Studio-side UI.
+
+---
+
+## 7. VLM Search Integration (Future)
+
+### Proposal
+
+Add visual-language model search capability:
+
+```bash
+POST /api/v1/search/vlm
+{
+  "query": "person wearing red dress",
+  "file_uuid": "optional"
+}
+```
+
+### Response
+
+```json
+{
+  "results": [
+    {
+      "file_uuid": "abc123",
+      "start_frame": 1000,
+      "end_frame": 1050,
+      "description": "Woman in red dress walking",
+      "confidence": 0.92
+    }
+  ]
+}
+```
+
+### Core Team Considerations
+
+1. Model selection (CLIP, BLIP, etc.)
+2. GPU requirements
+3. Indexing strategy
+4. Latency expectations
+
+---
+
+## Summary of Core API Changes
+
+| Feature | Priority | Core API Changes |
+|---------|----------|------------------|
+| Result merging | Low | Optional: `merge=true` param |
+| Min duration | Medium | Add `min_duration` param |
+| Frame adjustment | None | No changes needed |
+| Mark/Export | Low | Future: marks endpoints |
+| Vector weight | Medium | Add `vector_weight` param |
+| Question templates | None | Studio-side only |
+| VLM search | Future | New endpoint |
+
+---
+
+## Testing Checklist for Core Team
+
+### 1. Search Endpoint Testing
+
+```bash
+# Test basic search
+curl -X POST http://localhost:3002/api/v1/search/smart \
+  -H "X-API-Key: $KEY" \
+  -H "Content-Type: application/json" \
+  -d '{"query": "test", "limit": 30}'
+
+# Test with min_duration (if implemented)
+curl -X POST http://localhost:3002/api/v1/search/smart \
+  -H "X-API-Key: $KEY" \
+  -H "Content-Type: application/json" \
+  -d '{"query": "test", "min_duration": 10}'
+
+# Test vector weight (if implemented)
+curl -X POST http://localhost:3002/api/v1/search/llm-smart \
+  -H "X-API-Key: $KEY" \
+  -H "Content-Type: application/json" \
+  -d '{"query": "test", "vector_weight": 0.7}'
+```
+
+### 2. Performance Testing
+
+| Metric | Target |
+|--------|--------|
+| Search latency | < 500ms |
+| Result count | Stable at limit=30 |
+| Memory usage | No significant increase |
+
+### 3. Integration Testing
+
+- [ ] Search with file_uuid filter
+- [ ] Search without file_uuid (global)
+- [ ] Verify start_frame/end_frame accuracy
+- [ ] Verify time/frame consistency (fps)
+
+---
+
+## Questions for Core Team
+
+1. Should result merging be server-side or client-side?
+2. What's the acceptable latency for search?
+3. Is `min_duration` parameter feasible?
+4. Can `vector_weight` be made configurable?
+5. Timeline for VLM search integration?
+
+---
+
+*Document created: 2026-07-20*
+*Author: Studio Team*

docs/SEARCH_SOURCE_TYPE_REQUEST.md

@@ -0,0 +1,117 @@
+# Search API Source Type Request
+
+## Problem
+
+Currently, the Search API (`/api/v1/search/keyword` and `/api/v1/search/semantic`) returns results without indicating the source type:
+
+```json
+{
+  "id": 0,
+  "file_uuid": "...",
+  "start_frame": 0,
+  "end_frame": 128,
+  "start_time": 0.0,
+  "end_time": 5.33,
+  "summary": "And speaking of storage and workflow...",
+  "text_content": "And speaking of storage and workflow...",
+  ...
+}
+```
+
+There's no field to distinguish between:
+- **OCR**: Text extracted from video frames (on-screen text, titles, credits)
+- **ASRX**: Speech-to-text transcription
+
+---
+
+## Request
+
+Add a `source_type` field to the `SearchResult` struct:
+
+```rust
+pub struct SearchResult {
+    pub id: i32,
+    pub file_uuid: Option<String>,
+    pub parent_id: i32,
+    pub scene_order: Option<i32>,
+    pub start_frame: i64,
+    pub end_frame: i64,
+    pub fps: f64,
+    pub start_time: f64,
+    pub end_time: f64,
+    pub raw_text: Option<String>,
+    pub summary: Option<String>,
+    pub text_content: Option<String>,
+    pub metadata: Option<serde_json::Value>,
+    pub similarity: Option<f64>,
+    pub file_name: Option<String>,
+    pub serve_url: Option<String>,
+    pub thumbnail_url: Option<String>,
+    pub source_type: Option<String>,  // NEW: "ocr" or "asrx"
+}
+```
+
+---
+
+## Expected Response
+
+```json
+{
+  "id": 0,
+  "file_uuid": "...",
+  "start_frame": 0,
+  "end_frame": 128,
+  "start_time": 0.0,
+  "end_time": 5.33,
+  "summary": "And speaking of storage and workflow...",
+  "text_content": "And speaking of storage and workflow...",
+  "source_type": "ocr",
+  ...
+}
+```
+
+---
+
+## Use Case
+
+Studio frontend needs to display source type tags on search result cards:
+
+```
+[OCR] And speaking of storage and workflow...
+F0–128 (0:00–0:05)
+```
+
+```
+[ASRX] Today we're talking about storage solutions...
+(0:10–0:20)
+```
+
+---
+
+## Implementation Notes
+
+1. The database already has `chunk_type` field with values like `'sentence'`, `'cut'`, etc.
+2. Need to map chunk types to source types:
+   - OCR chunks → `source_type: "ocr"`
+   - ASRX/sentence chunks → `source_type: "asrx"`
+3. Update `enrich_from_pg()` function to include source_type
+4. Update `SearchResult` struct serialization
+
+---
+
+## Affected Files
+
+- `/Users/accusys/momentry_core/src/api/search.rs`: `SearchResult` struct and enrichment
+- `/Users/accusys/momentry_core/src/core/db/postgres_db.rs`: `get_chunk_by_file_and_chunk_id()` query
+
+---
+
+## Priority
+
+Medium - Required for proper search result categorization and display
+
+---
+
+## Contact
+
+Studio Team

docs/VLM_AGENT_TOOL_REQUEST.md

@@ -0,0 +1,90 @@
+# VLM (Vision Language Model) Tool for Agent Search
+
+## Request
+Add a `vlm_describe` tool to the Agent system that can analyze video keyframes via VLM.
+
+## Background
+We have Ollama with LLaVA running locally (`http://localhost:11434`). The VLM can describe image content (people, objects, scenes, clothing, text, etc.). We want the Agent to be able to use this as a tool when users ask questions about visual content.
+
+## Use Cases
+- "What is the person wearing in this scene?"
+- "Find scenes where someone is wearing a red shirt"
+- "Describe the background of this video"
+- "What objects are visible in frame 1000?"
+
+## API Design
+
+### Agent Tool Registration
+Add a `vlm_describe` tool to the Agent's tool registry in Core API.
+
+### Tool Definition
+```json
+{
+  "name": "vlm_describe",
+  "description": "Analyze a video frame using Vision Language Model. Returns a description of the image content.",
+  "parameters": {
+    "file_uuid": "string - UUID of the video file",
+    "frame": "integer - Frame number to analyze",
+    "prompt": "string (optional) - Specific question about the image (default: 'Describe this image in 1-2 sentences.')"
+  }
+}
+```
+
+### Internal Implementation
+The Core API should call:
+```
+POST http://localhost:11434/api/generate
+{
+  "model": "llava",
+  "prompt": "<user prompt or default>",
+  "images": ["<base64 of frame thumbnail>"],
+  "stream": false,
+  "options": { "num_predict": 80 }
+}
+```
+
+To get the frame image, use the existing thumbnail API:
+```
+GET /api/v1/file/{file_uuid}/thumbnail?api_key={key}&frame={frame}
+```
+→ Returns JPEG bytes → resize to 480x270 → base64 encode → send to Ollama.
+
+### Result Format
+```json
+{
+  "tool": "vlm_describe",
+  "result": {
+    "file_uuid": "...",
+    "frame": 1234,
+    "description": "A man wearing a blue suit and red tie standing at a podium.",
+    "time_sec": 41.13
+  }
+}
+```
+
+### Performance (Benchmarked on M5 Max)
+
+**Model**: LLaVA 7B Q4_0 (Ollama), 1280x720 → 480x270 resize
+
+| Metric | Value |
+|--------|-------|
+| Avg per frame | **1.02s** |
+| Min | 0.81s |
+| Max | 1.60s |
+| Throughput | ~1 fps (sequential) |
+| Concurrent (4 workers) | No speedup — Ollama queues single-GPU |
+
+**Recommendations**:
+- Resize to 480x270 before sending reduces token count without quality loss
+- Batch processing doesn't help (Ollama queues requests to single model instance)
+- For large video indexing, process frames asynchronously in background
+- Consider a faster model if throughput becomes critical (e.g., LLaVA-Next 8B, Moondream 1.6B)
+
+## Frontend Changes (for reference)
+Once Core API returns `vlm_describe` in agent sources, the frontend will display:
+- Tool badge: "VLM"
+- Description text paired with the relevant video frame
+- Click to jump to that frame in the video player
+
+## Timeline
+Not urgent - this is an enhancement for visual search capabilities.

docs/core-api-fix-video-range.md

@@ -0,0 +1,186 @@
+# Core API Fix Request: Video Range Requests Support
+
+## Issue
+
+Video player in Studio cannot seek (跳轉) because Core API video endpoint does not support HTTP Range requests.
+
+## Current Behavior
+
+```bash
+$ curl -I "http://localhost:3002/api/v1/file/{uuid}/video?start_time=0&end_time=5"
+HTTP/1.1 200 OK
+content-type: video/mp4
+content-length: 1918410
+# Missing: Accept-Ranges header
+# Missing: 206 Partial Content support
+```
+
+## Expected Behavior
+
+```bash
+$ curl -I "http://localhost:3002/api/v1/file/{uuid}/video" -H "Range: bytes=0-1000"
+HTTP/1.1 206 Partial Content
+content-type: video/mp4
+content-range: bytes 0-1000/1918410
+accept-ranges: bytes
+content-length: 1001
+```
+
+## Why This Matters
+
+1. **Browser seeking requires Range support** - HTML5 `<video>` element uses Range requests to seek to different timestamps
+2. **Current workaround is inefficient** - Users must download entire video or use `start_time` param (re-downloads video)
+3. **High bitrate videos suffer most** - 4K/10Mbps videos cannot be quickly navigated
+
+## Implementation Requirements
+
+### 1. Add `Accept-Ranges: bytes` header to video endpoint
+
+```
+GET /api/v1/file/{uuid}/video
+Response Headers:
+  Accept-Ranges: bytes
+```
+
+### 2. Handle Range requests with 206 Partial Content
+
+```rust
+// Pseudo-code for Rust implementation
+if let Some(range_header) = request.headers().get("Range") {
+    let (start, end) = parse_range(range_header)?;
+    let file_chunk = read_file_range(file_path, start, end)?;
+    
+    Response::builder()
+        .status(206)
+        .header("Content-Range", format!("bytes {}-{}/{}", start, end, file_size))
+        .header("Accept-Ranges", "bytes")
+        .header("Content-Length", end - start + 1)
+        .body(file_chunk)
+} else {
+    // Full file response
+    Response::builder()
+        .status(200)
+        .header("Accept-Ranges", "bytes")
+        .body(full_file)
+}
+```
+
+### 3. Support multiple Range formats
+
+- `Range: bytes=0-999` (first 1000 bytes)
+- `Range: bytes=1000-` (from byte 1000 to end)
+- `Range: bytes=-500` (last 500 bytes)
+
+## Affected Files (Core API)
+
+- `src/api/files.rs` - Video streaming endpoint
+- Possibly `src/api/video.rs` if exists
+
+## Testing
+
+```bash
+# Test 1: Initial request should include Accept-Ranges
+curl -I "http://localhost:3002/api/v1/file/{uuid}/video"
+# Expect: Accept-Ranges: bytes
+
+# Test 2: Range request should return 206
+curl -I "http://localhost:3002/api/v1/file/{uuid}/video" -H "Range: bytes=0-1000"
+# Expect: HTTP/1.1 206 Partial Content
+# Expect: Content-Range: bytes 0-1000/{total}
+
+# Test 3: Browser seeking should work
+# Open Studio, play video, click on timeline
+# Video should seek without re-downloading
+```
+
+## Priority
+
+**High** - Critical for user experience when navigating long videos
+
+## Related Studio Files
+
+- `src/components/VideoPlayer.vue` - Uses `<video>` element with native controls
+- `src-tauri/src/proxy.rs` - Already streams video, will pass through Range headers
+
+## Notes
+
+- Studio proxy already supports streaming (lines 325-367 in proxy.rs)
+- Just need Core API to handle Range requests properly
+- This is standard HTTP behavior for video streaming
+
+---
+
+## Additional Request: Adaptive Bitrate / Resolution Selection
+
+### Problem
+
+High bitrate videos (4K, 10+ Mbps) cause playback lag in browser due to software decoding limitations.
+
+### Solution Options
+
+#### Option A: Resolution Parameter
+
+```bash
+GET /api/v1/file/{uuid}/video?start_time=0&end_time=60&resolution=720p
+GET /api/v1/file/{uuid}/video?start_time=0&end_time=60&resolution=480p
+```
+
+**Implementation:**
+- Use FFmpeg to transcode on-the-fly or pre-generate proxy versions
+- Store proxy videos at lower bitrates (720p @ 2Mbps, 480p @ 1Mbps)
+
+#### Option B: Quality Parameter (1-100)
+
+```bash
+GET /api/v1/file/{uuid}//video?start_time=0&end_time=60&quality=50
+```
+
+#### Option C: Max Bitrate Parameter
+
+```bash
+GET /api/v1/file/{uuid}/video?start_time=0&end_time=60&max_bitrate=2000
+```
+
+### Recommended Approach
+
+**Pre-generate proxy videos during processing:**
+
+```rust
+// During file processing, generate multiple versions:
+// - Original: {uuid}_original.mp4 (preserve original quality)
+// - 720p: {uuid}_720p.mp4 (2 Mbps)
+// - 480p: {uuid}_480p.mp4 (1 Mbps)
+```
+
+**Storage Impact:**
+- Original 100MB video → ~105MB total (5% overhead for proxies)
+
+**API Changes:**
+
+```rust
+pub fn get_video_stream(
+    file_uuid: String,
+    start_time: f64,
+    end_time: f64,
+    resolution: Option<String>,  // "original" | "720p" | "480p"
+) -> Result<VideoStream, Error>
+```
+
+### Frontend Integration
+
+Studio VideoPlayer can add quality selector:
+
+```vue
+<select v-model="selectedResolution">
+  <option value="original">Original (1080p)</option>
+  <option value="720p">HD (720p)</option>
+  <option value="480p">SD (480p)</option>
+</select>
+```
+
+### Benefits
+
+1. **Eliminates lag** on high bitrate videos
+2. **Faster loading** with smaller file sizes
+3. **Bandwidth savings** for remote access
+4. **Better UX** - smooth playback on all devices

docs/core-api-pose-appearance-endpoint.md

@@ -0,0 +1,290 @@
+# Pose & Appearance API Endpoints - Technical Specification
+
+## Overview
+
+This document specifies two new Core API endpoints needed for displaying pose skeleton and appearance colors in Momentry Studio's Face Detail Modal.
+
+---
+
+## Endpoints
+
+### 1. Get Pose
+
+```
+GET /api/v1/file/:file_uuid/pose?frame=:frame_no
+```
+
+**Response:**
+```json
+{
+  "frame": 100,
+  "keypoints": [
+    { "name": "nose", "x": 993, "y": 372, "confidence": 0.84 },
+    { "name": "left_eye", "x": 950, "y": 350, "confidence": 0.91 },
+    { "name": "right_eye", "x": 1030, "y": 352, "confidence": 0.89 },
+    { "name": "left_ear", "x": 920, "y": 360, "confidence": 0.75 },
+    { "name": "right_ear", "x": 1060, "y": 358, "confidence": 0.77 },
+    { "name": "left_shoulder", "x": 850, "y": 480, "confidence": 0.88 },
+    { "name": "right_shoulder", "x": 1100, "y": 475, "confidence": 0.90 },
+    { "name": "left_elbow", "x": 780, "y": 620, "confidence": 0.82 },
+    { "name": "right_elbow", "x": 1180, "y": 610, "confidence": 0.85 },
+    { "name": "left_wrist", "x": 720, "y": 750, "confidence": 0.78 },
+    { "name": "right_wrist", "x": 1240, "y": 740, "confidence": 0.80 },
+    { "name": "left_hip", "x": 900, "y": 720, "confidence": 0.86 },
+    { "name": "right_hip", "x": 1050, "y": 715, "confidence": 0.87 },
+    { "name": "left_knee", "x": 870, "y": 950, "confidence": 0.83 },
+    { "name": "right_knee", "x": 1080, "y": 945, "confidence": 0.84 },
+    { "name": "left_ankle", "x": 850, "y": 1150, "confidence": 0.79 },
+    { "name": "right_ankle", "x": 1100, "y": 1145, "confidence": 0.81 }
+  ],
+  "pose_class": "standing",
+  "confidence": 0.95
+}
+```
+
+**Fields:**
+- `frame` (int): Frame number
+- `keypoints` (array): 17 COCO keypoints
+  - `name` (string): Keypoint name (see list below)
+  - `x` (float): X coordinate in pixels
+  - `y` (float): Y coordinate in pixels
+  - `confidence` (float, optional): Detection confidence 0-1
+- `pose_class` (string): One of `standing`, `sitting`, `kneeling`, `lying`, `prone`, `unknown`
+- `confidence` (float, optional): Overall pose classification confidence
+
+**COCO-17 Keypoint Names:**
+```
+nose, left_eye, right_eye, left_ear, right_ear,
+left_shoulder, right_shoulder, left_elbow, right_elbow,
+left_wrist, right_wrist, left_hip, right_hip,
+left_knee, right_knee, left_ankle, right_ankle
+```
+
+---
+
+### 2. Get Appearance
+
+```
+GET /api/v1/file/:file_uuid/appearance?frame=:frame_no
+```
+
+**Response:**
+```json
+{
+  "frame": 100,
+  "dominant_colors": [
+    { "rgb": [255, 100, 50], "percentage": 0.35 },
+    { "rgb": [50, 150, 200], "percentage": 0.25 },
+    { "rgb": [100, 200, 100], "percentage": 0.15 }
+  ],
+  "hsv_histogram": [
+    [/* 30 bins for H */],
+    [/* 30 bins for S */],
+    [/* 30 bins for V */]
+  ]
+}
+```
+
+**Fields:**
+- `frame` (int): Frame number
+- `dominant_colors` (array, optional): Top 3-5 dominant colors
+  - `rgb` (array): [R, G, B] values 0-255
+  - `percentage` (float, optional): Proportion 0-1
+- `hsv_histogram` (array, optional): Raw HSV histogram for custom analysis
+
+---
+
+## Data Source
+
+### Option A: Read from JSON files
+
+**Pose file location:**
+```
+/momentry/output/{file_hash}/{file_hash}.pose.json
+```
+
+**Appearance file location:**
+```
+/momentry/output/{file_hash}/{file_hash}.appearance.json
+```
+
+**Expected JSON structure:**
+```json
+{
+  "frames": [
+    {
+      "frame": 0,
+      "keypoints": [...],
+      "pose_class": "standing"
+    },
+    {
+      "frame": 1,
+      "keypoints": [...],
+      "pose_class": "standing"
+    }
+  ]
+}
+```
+
+### Option B: Query from TKG
+
+If pose/appearance data is stored in TKG, implement Neo4j query:
+
+```cypher
+MATCH (p:Pose {file_uuid: $file_uuid, frame: $frame})
+RETURN p.keypoints, p.pose_class, p.confidence
+```
+
+---
+
+## Implementation Example (FastAPI)
+
+```python
+from fastapi import FastAPI, HTTPException
+import json
+from pathlib import Path
+
+app = FastAPI()
+
+OUTPUT_BASE = "/momentry/output"
+
+@app.get("/api/v1/file/{file_uuid}/pose")
+async def get_pose(file_uuid: str, frame: int):
+    pose_file = Path(f"{OUTPUT_BASE}/{file_uuid}/{file_uuid}.pose.json")
+    
+    if not pose_file.exists():
+        raise HTTPException(status_code=404, detail="Pose data not found")
+    
+    with open(pose_file) as f:
+        data = json.load(f)
+    
+    # Find frame
+    for frame_data in data.get("frames", []):
+        if frame_data.get("frame") == frame:
+            return {
+                "frame": frame,
+                "keypoints": frame_data.get("keypoints", []),
+                "pose_class": frame_data.get("pose_class", "unknown"),
+                "confidence": frame_data.get("confidence")
+            }
+    
+    raise HTTPException(status_code=404, detail="Frame not found")
+
+@app.get("/api/v1/file/{file_uuid}/appearance")
+async def get_appearance(file_uuid: str, frame: int):
+    appearance_file = Path(f"{OUTPUT_BASE}/{file_uuid}/{file_uuid}.appearance.json")
+    
+    if not appearance_file.exists():
+        raise HTTPException(status_code=404, detail="Appearance data not found")
+    
+    with open(appearance_file) as f:
+        data = json.load(f)
+    
+    for frame_data in data.get("frames", []):
+        if frame_data.get("frame") == frame:
+            return {
+                "frame": frame,
+                "dominant_colors": frame_data.get("dominant_colors", []),
+                "hsv_histogram": frame_data.get("hsv_histogram")
+            }
+    
+    raise HTTPException(status_code=404, detail="Frame not found")
+```
+
+---
+
+## Mock Data for Testing
+
+If real data is not yet available, use mock response:
+
+```python
+@app.get("/api/v1/file/{file_uuid}/pose")
+async def get_pose(file_uuid: str, frame: int):
+    return {
+        "frame": frame,
+        "keypoints": [
+            {"name": "nose", "x": 100, "y": 50},
+            {"name": "left_eye", "x": 90, "y": 45},
+            {"name": "right_eye", "x": 110, "y": 45},
+            {"name": "left_ear", "x": 80, "y": 50},
+            {"name": "right_ear", "x": 120, "y": 50},
+            {"name": "left_shoulder", "x": 60, "y": 100},
+            {"name": "right_shoulder", "x": 140, "y": 100},
+            {"name": "left_elbow", "x": 50, "y": 150},
+            {"name": "right_elbow", "x": 150, "y": 150},
+            {"name": "left_wrist", "x": 45, "y": 190},
+            {"name": "right_wrist", "x": 155, "y": 190},
+            {"name": "left_hip", "x": 70, "y": 200},
+            {"name": "right_hip", "x": 130, "y": 200},
+            {"name": "left_knee", "x": 65, "y": 280},
+            {"name": "right_knee", "x": 135, "y": 280},
+            {"name": "left_ankle", "x": 60, "y": 350},
+            {"name": "right_ankle", "x": 140, "y": 350}
+        ],
+        "pose_class": "standing"
+    }
+
+@app.get("/api/v1/file/{file_uuid}/appearance")
+async def get_appearance(file_uuid: str, frame: int):
+    return {
+        "frame": frame,
+        "dominant_colors": [
+            {"rgb": [255, 100, 50]},
+            {"rgb": [50, 150, 200]}
+        ]
+    }
+```
+
+---
+
+## Studio Integration Status
+
+**Phase 1 (Completed):**
+- ✅ TypeScript interfaces (`src/api/types.ts`)
+- ✅ API builder cases (`src/api/index.ts`)
+- ✅ Store functions (`src/store.ts`)
+- ✅ Canvas rendering utilities (`src/utils/poseRenderer.ts`)
+- ✅ Mock data for testing (`src/utils/mockPoseData.ts`)
+
+**Phase 2 (Pending - Core Team):**
+- ⏳ Implement pose endpoint
+- ⏳ Implement appearance endpoint
+
+**Phase 3-4 (After Phase 2):**
+- Studio Proxy handlers
+- UI integration in Face Detail Modal
+
+---
+
+## Testing
+
+### Manual Test
+
+```bash
+curl "http://localhost:3002/api/v1/file/{file_uuid}/pose?frame=100"
+curl "http://localhost:3002/api/v1/file/{file_uuid}/appearance?frame=100"
+```
+
+### Expected Response Time
+
+- Target: < 100ms per request
+- Cacheable: Yes (pose/appearance data doesn't change)
+
+---
+
+## Questions
+
+1. **Data location**: Confirm if `.pose.json` and `.appearance.json` files exist, or if data is in TKG?
+
+2. **Frame alignment**: Confirm that pose/appearance frame numbers align with face `best_face_frame`?
+
+3. **Pose classification**: Do you have pose classification (`standing`, `sitting`, etc.), or just keypoints?
+
+4. **Dominant colors**: Is color extraction already done, or need to implement?
+
+---
+
+## Contact
+
+Studio Team: Ready to integrate once endpoints are available.
+Expected Phase 3-4 completion: 1-2 hours after Phase 2 delivery.

docs/core-api-usage.md

@@ -0,0 +1,434 @@
+# Momentry Studio Core API 使用說明
+
+本文檔整理 Momentry Studio 使用的 Core API 端點及其使用時機。
+
+**Core API 地址**: `http://localhost:3002`
+**API Key**: 透過 `api_key` query parameter 注入（由 Rust proxy 自動處理）
+
+---
+
+## 一、搜尋相關 API
+
+### 1.1 智能搜尋
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/search/llm-smart` | POST | LLM 智能搜尋，結合關鍵字和語意搜尋 |
+| `/api/v1/search/keyword` | POST | 純關鍵字搜尋 |
+| `/api/v1/search/semantic` | POST | 純語意搜尋（向量相似度） |
+| `/api/v1/agents/search` | POST | Agent 搜尋（支援多輪對話） |
+
+**使用時機**:
+- `llm-smart`: 搜尋頁面預設搜尋
+- `keyword`: 快速關鍵字匹配
+- `semantic`: 概念搜尋
+- `agents/search`: 搜尋頁面對話模式（支援 `conversation_id` 多輪對話）
+
+**Request Body**:
+```json
+{
+  "query": "搜尋詞",
+  "limit": 20
+}
+```
+
+**Response**: 搜尋結果陣列，每個結果包含 `file_uuid`, `start_time`, `end_time`, `start_frame`, `end_frame`, `summary`, `similarity`
+
+---
+
+### 1.2 人物搜尋
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/identities/search` | GET | 搜尋人物名稱 |
+
+**使用時機**: 在人物詳情頁面搜尋要合併的目標人物
+
+**Query Params**: `q` (搜尋詞), `limit`
+
+---
+
+## 二、檔案管理 API
+
+### 2.1 檔案列表與詳情
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/files/scan` | GET | 掃描目錄，取得檔案列表 |
+| `/api/v1/file/:uuid` | GET | 取得檔案詳情（fps, duration, width, height 等） |
+| `/api/v1/file/:uuid/processor-counts` | GET | 取得檔案的處理器計數統計 |
+
+**使用時機**:
+- `files/scan`: 檔案庫頁面載入檔案列表
+- `file/:uuid`: 播放器需要影片參數、縮圖需要原始尺寸
+- `processor-counts`: 檔案詳情頁面顯示處理狀態
+
+---
+
+### 2.2 檔案註冊與處理
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/files/register` | POST | 註冊檔案到系統 |
+| `/api/v1/file/:uuid/process` | POST | 執行處理器（transcribe, ocr, face 等） |
+| `/api/v1/file/:uuid/checkin` | POST | 檔案入庫（ingest） |
+| `/api/v1/file/:uuid/checkout` | POST | 檔案出庫 |
+| `/api/v1/unregister` | POST | 取消註冊檔案 |
+
+**使用時機**:
+- `register`: 檔案庫頁面註冊新檔案
+- `process`: 檔案庫頁面觸發處理流程
+- `checkin/checkout`: 檔案版本控制
+- `unregister`: 檔案庫頁面刪除檔案
+
+---
+
+### 2.3 檔案狀態同步
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/sync-status` | POST | 從資料庫同步檔案處理狀態 |
+
+**使用時機**: 前端 polling 檢查處理中的檔案狀態（每 10 秒）
+
+---
+
+## 三、媒體 API
+
+### 3.1 縮圖
+
+| 端點 | 方法 | 說明 | 實作位置 |
+|------|------|------|----------|
+| `/api/v1/file/:uuid/thumbnail` | GET | 取得檔案縮圖 | Core API |
+| `/api/v1/face-thumbnail` | GET | 取得人臉縮圖（含 bbox crop） | **Studio 本地** |
+| `/api/v1/file/thumbnail` | GET | 依路徑取得縮圖（未註冊檔案） | **Studio 本地** |
+
+**使用時機**:
+- `file/:uuid/thumbnail`: 搜尋結果縮圖、影片時間軸縮圖
+- `face-thumbnail`: 人物詳情頁面人臉縮圖（含 bbox crop）
+- `file/thumbnail`: 檔案庫頁面未註冊檔案的縮圖
+
+**注意**: `face-thumbnail` 由 Studio 本地處理，因為 Core API 不支援 bbox crop
+
+---
+
+### 3.2 影片串流
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/video` | GET | 影片串流 |
+
+**使用時機**: 搜尋結果播放影片
+
+**注意**: Core API 已支援 HTTP Range requests，瀏覽器可透過 `<video>` 元素跳轉播放
+
+---
+
+### 3.3 影格提取
+
+| 端點 | 方法 | 說明 | 實作位置 |
+|------|------|------|----------|
+| `/api/v1/media/frame` | GET | 提取指定影格 | **Studio 本地** |
+
+**使用時機**: 人物詳情頁面顯示特定幀的圖片
+
+---
+
+## 四、人物（Identity）API
+
+### 4.1 人物列表
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/identities` | GET | 取得所有人物（分頁） |
+
+**使用時機**: 人物頁面載入人物列表
+
+**注意**: Studio 使用特殊邏輯（最多 10 頁 × 100 筆）避免 Core API timeout
+
+---
+
+### 4.2 人物詳情
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/identity/:uuid` | GET | 取得單一人物詳情 |
+| `/api/v1/identity/:uuid/faces` | GET | 取得人物的人臉列表 |
+| `/api/v1/identity/:uuid/traces` | GET | 取得人物的軌跡列表 |
+| `/api/v1/identity/:uuid/files` | GET | 取得人物出現的檔案列表 |
+
+**使用時機**:
+- `identity/:uuid`: 人物詳情頁面
+- `faces`: 人物詳情頁面人臉列表
+- `traces`: 人物詳情頁面軌跡列表
+- `files`: 人物詳情頁面檔案列表
+
+---
+
+### 4.3 人物更新
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/identity/:uuid` | PATCH | 更新人物名稱或 metadata |
+
+**使用時機**: 人物詳情頁面編輯名稱、狀態、星號
+
+**Request Body**:
+```json
+{
+  "name": "新名稱",
+  "metadata": {
+    "status": "confirmed",
+    "starred": true
+  }
+}
+```
+
+---
+
+### 4.4 人物大頭貼
+
+| 端點 | 方法 | 說明 | 實作位置 |
+|------|------|------|----------|
+| `/api/v1/identity/:uuid/profile` | GET | 取得人物大頭貼 | **Studio 本地** |
+| `/api/v1/identity/:uuid/profile-image` | POST | 上傳大頭貼 | Core API |
+| `/api/v1/identity/:uuid/profile-image/from-face` | POST | 從人臉設定大頭貼 | Core API |
+
+**使用時機**:
+- `profile`: 人物列表、人物詳情頁面顯示大頭貼（本地檔案系統）
+- `profile-image`: 上傳自訂大頭貼
+- `profile-image/from-face`: 從人臉截圖設定大頭貼
+
+**注意**: `profile` 由 Studio 本地處理，讀取 `output/identities/{uuid}/profile.jpg`
+
+---
+
+### 4.5 人物操作
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/identity/:uuid/bind` | POST | 綁定人臉到人物 |
+| `/api/v1/identity/:uuid/unbind` | POST | 解綁人臉 |
+| `/api/v1/identity/:uuid/mergeinto` | POST | 合併人物到另一個人物 |
+| `/api/v1/identity/:uuid` | DELETE | 刪除人物 |
+
+**使用時機**:
+- `bind`: 人物詳情頁面新增人臉
+- `unbind`: 人物詳情頁面移除人臉
+- `mergeinto`: 人物詳情頁面合併兩個人物
+- `delete`: 人物詳情頁面刪除人物
+
+---
+
+### 4.6 人物建立
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/pending-person` | POST | 從檔案建立待確認人物 |
+| `/api/v1/identities/pending` | POST | 建立待確認身份 |
+
+**使用時機**: 
+- `pending-person`: 從軌跡建立新人物
+- `pending`: 從軌跡/人臉建立待確認身份
+
+---
+
+### 4.7 Undo/Redo
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/identity/:uuid/undo` | POST | 復原人物操作 |
+| `/api/v1/identity/:uuid/redo` | POST | 重做人物操作 |
+| `/api/v1/identity/:uuid/history` | GET | 取得操作歷史 |
+| `/api/v1/identity/:uuid/bind/undo` | POST | 復原綁定操作 |
+| `/api/v1/identity/:uuid/bind/redo` | POST | 重做綁定操作 |
+| `/api/v1/identity/:uuid/bind/history` | GET | 取得綁定操作歷史 |
+| `/api/v1/identity/merge/:mergeId/undo` | POST | 復原合併 |
+| `/api/v1/identity/merge/:mergeId/redo` | POST | 重做合併 |
+| `/api/v1/identity/merge/history` | GET | 取得合併歷史 |
+
+**使用時機**: 人物詳情頁面 Undo/Redo 功能
+
+---
+
+## 五、人臉與軌跡 API
+
+### 5.1 人臉候選
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/faces/candidates` | GET | 取得未綁定的人臉候選 |
+
+**使用時機**: 人物詳情頁面顯示可綁定的人臉
+
+---
+
+### 5.2 軌跡管理
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/traces/unassigned` | GET | 取得未分配的軌跡 |
+| `/api/v1/file/:uuid/traces` | POST | 列出檔案的所有軌跡 |
+| `/api/v1/file/:uuid/trace/:traceId` | DELETE | 刪除軌跡 |
+| `/api/v1/file/:uuid/trace/:traceId/restore` | POST | 還原刪除的軌跡 |
+| `/api/v1/file/:uuid/trace/:sourceId/merge/:targetId` | POST | 合併軌跡 |
+
+**使用時機**: 
+- `unassigned`: 人物詳情頁面顯示未分配軌跡
+- 其他: 軌跡管理功能
+
+---
+
+### 5.3 軌跡 Profile
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/trace-profile` | GET | 取得軌跡 profile |
+| `/api/v1/trace-profile` | PUT | 更新軌跡 profile |
+| `/api/v1/trace-profile/group` | PUT | 批次更新軌跡 profile |
+
+**使用時機**: 軌跡標記、命名
+
+---
+
+### 5.4 檔案 Identity 列表
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/identities` | GET | 取得檔案中出現的人物 |
+| `/api/v1/file/:uuid/pending-persons` | GET | 取得檔案的待確認人物 |
+
+**使用時機**: 檔案詳情頁面顯示人物列表
+
+---
+
+## 六、處理器 API
+
+### 6.1 執行 Agent
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/identity-agent` | POST | 執行人物識別 Agent |
+| `/api/v1/file/:uuid/cluster-agent` | POST | 執行軌跡聚類 Agent |
+| `/api/v1/agents/identity/run-for-seed` | POST | 為種子人物執行識別 |
+| `/api/v1/agents/identity/match-from-photo` | POST | 從照片匹配人物 |
+
+**使用時機**:
+- `identity-agent`: 檔案庫頁面執行人物識別
+- `cluster-agent`: 檔案庫頁面執行軌跡聚類
+- `run-for-seed`: 為已知人物擴展識別
+- `match-from-photo`: 上傳照片比對人物
+
+---
+
+### 6.2 處理器結果
+
+| 端點 | 方法 | 說明 | 實作位置 |
+|------|------|------|----------|
+| `/api/v1/file/:uuid/face-groups` | GET | 取得人臉分組結果 | Core API |
+| `/api/v1/file/:uuid/json/:processor` | POST | 取得處理器 JSON 輸出 | Core API |
+| `/api/v1/cluster-results` | GET | 取得聚類結果 | Studio proxy |
+| `/api/v1/processor-json` | GET | 取得處理器 JSON | Studio proxy |
+| `/api/v1/identity-matches` | GET | 取得人物匹配結果 | Studio 本地檔案 |
+
+**使用時機**: 
+- `face-groups`: 取得人臉分組
+- `json/:processor`: 取得特定處理器的輸出（如 ocr, asr）
+- `cluster-results`, `processor-json`, `identity-matches`: QC 頁面
+
+---
+
+## 七、Profile API
+
+### 7.1 檔案 Profile
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file-profile` | GET | 取得檔案 profile |
+| `/api/v1/file-profile` | PUT | 更新檔案 profile |
+
+**使用時機**: 檔案元數據管理
+
+---
+
+## 八、統計 API
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/progress/:uuid` | POST | 取得處理進度 |
+| `/api/v1/stats/pipeline/:uuid` | GET | 取得 pipeline 統計 |
+| `/api/v1/stats/file/:uuid` | GET | 取得檔案統計 |
+
+**使用時機**: 檔案處理進度顯示
+
+---
+
+## 九、姿勢與外觀 API
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/pose` | GET | 取得指定幀的姿勢估計 |
+| `/api/v1/file/:uuid/appearance` | GET | 取得指定幀的外觀特徵 |
+
+**Query Params**: `frame`, `bbox_x`, `bbox_y`, `bbox_w`, `bbox_h`
+
+**使用時機**: 人物詳情頁面顯示姿勢/外觀分析
+
+---
+
+## 十、其他 API
+
+### 10.1 說話者綁定
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/file/:uuid/bind-speakers` | POST | 綁定說話者到人物 |
+
+**使用時機**: 將語音與人物關聯
+
+---
+
+### 10.2 本地 API（不經過 Core API）
+
+以下 API 由 Studio 本地處理，**不會**轉發到 Core API：
+
+| 端點 | 說明 | 資料來源 |
+|------|------|----------|
+| `/api/v1/auth/login` | 本地登入驗證 | SQLite `app_users` 表 |
+| `/api/v1/search-history` | 搜尋歷史 CRUD | SQLite `search_history` 表 |
+| `/api/v1/bookmarks` | 書籤 CRUD | SQLite `bookmarks` 表 |
+| `/api/v1/identity/:uuid/profile` | 人物大頭貼 | 本地檔案系統 |
+| `/api/v1/face-thumbnail` | 人臉縮圖（bbox crop） | Core API + 本地裁切 |
+| `/api/v1/media/frame` | 影格提取 | ffmpeg 本地執行 |
+| `/api/v1/file/thumbnail` | 依路徑縮圖 | ffmpeg 本地執行 |
+| `/api/v1/identity-matches` | 人物匹配結果 | 本地 JSON 檔案 |
+| `/api/v1/cluster-results` | 聚類結果 | Core API `/face-groups` |
+| `/api/v1/processor-json` | 處理器 JSON | Core API `/json/:processor` |
+
+---
+
+## 十一、已知問題與改進建議
+
+### 11.1 高畫質影片卡頓
+
+**問題**: 4K、10+ Mbps 影片在瀏覽器播放卡頓
+
+**建議**: Core API 實作 adaptive bitrate streaming（HLS/DASH）
+
+### 11.2 分頁限制
+
+**問題**: Core API 在 `per_page >= 100` 時可能 timeout
+
+**現行解法**: 前端限制 `perPage <= 20`，`get_people` 使用特殊分頁邏輯
+
+---
+
+## 十二、API Key 注入
+
+所有經由 Rust proxy 轉發的請求都會自動注入 `api_key` query parameter：
+
+```
+http://localhost:3002/api/v1/identities?api_key=muser_xxx&page=1&per_page=100
+```
+
+前端無需手動處理 API Key，由 proxy.rs 統一管理。

docs/face_filter_integration_guide.md

@@ -0,0 +1,543 @@
+# Face Filter Integration Guide for PeopleView
+
+**版本**: v1.0  
+**日期**: 2026-08-09  
+**狀態**: 可整合
+
+---
+
+## 概述
+
+本指南說明如何將 Face Filter 功能整合到 PeopleView 中。
+
+---
+
+## 已創建的檔案
+
+### 1. Composable
+**位置**: `src/composables/useFaceFilter.ts`
+
+**功能**:
+- 管理臉部過濾狀態
+- 提供三種過濾模式（instant, backend, hybrid）
+- 處理 API 呼叫
+- 儲存使用者偏好到 localStorage
+
+**主要 exports**:
+```typescript
+export function useFaceFilter() {
+  return {
+    mode,           // 'instant' | 'backend' | 'hybrid'
+    rules,          // QuickFilterRules
+    allFaces,       // FaceMetadata[]
+    filteredFaces,  // FaceMetadata[]
+    filterResult,   // FilterResult | null
+    filterStats,    // FilterStats | null
+    loading,        // boolean
+    error,          // string | null
+    stats,          // computed stats
+    
+    // Actions
+    initialize,
+    updateRules,
+    setMode,
+    applyBackendFilter,
+    getFaceReportData,
+    refreshStats,
+    resetToDefault,
+    applyLocalFilter
+  };
+}
+```
+
+---
+
+### 2. Components
+
+#### FaceFilterPanel.vue
+**位置**: `src/components/FaceFilterPanel.vue`
+
+**功能**:
+- 過濾面板 UI
+- 模式選擇（instant/backend/hybrid）
+- 過濾規則控制（confidence, bbox_size, source, backend_status）
+- 統計顯示
+
+**Props**:
+```typescript
+{
+  fileUuid: string  // 必需的檔案 UUID
+}
+```
+
+**使用範例**:
+```vue
+<FaceFilterPanel :fileUuid="selectedFileUuid" />
+```
+
+---
+
+#### FaceCard.vue
+**位置**: `src/components/FaceCard.vue`
+
+**功能**:
+- 臉部卡片顯示（純文字，無縮圖）
+- 狀態標示（accept/reject/review）
+- 來源徽章（AV/MP）
+- 選擇功能
+
+**Props**:
+```typescript
+{
+  face: FaceMetadata,
+  selected?: boolean,
+  showCheckbox?: boolean
+}
+```
+
+**Events**:
+```typescript
+{
+  click: [face: FaceMetadata],
+  select: [face: FaceMetadata]
+}
+```
+
+**使用範例**:
+```vue
+<FaceCard 
+  :face="face" 
+  :selected="selectedFaces.includes(face)"
+  @click="openFaceDetail(face)"
+  @select="toggleFaceSelection(face)"
+/>
+```
+
+---
+
+## 整合步驟
+
+### Step 1: 導入 Composable
+
+在 PeopleView.vue 中導入 useFaceFilter：
+
+```vue
+<script setup lang="ts">
+import { useFaceFilter } from '../composables/useFaceFilter';
+
+const {
+  mode,
+  rules,
+  allFaces,
+  filteredFaces,
+  filterStats,
+  loading: filterLoading,
+  error: filterError,
+  stats: filterStats,
+  initialize,
+  updateRules,
+  setMode,
+  applyBackendFilter,
+  resetToDefault
+} = useFaceFilter();
+
+// ... existing code ...
+</script>
+```
+
+---
+
+### Step 2: 添加 FaceFilterPanel 組件
+
+在 toolbar 區域添加 FaceFilterPanel：
+
+```vue
+<template>
+  <div class="people-view">
+    <div class="ms-ppl-control-area">
+      <!-- Existing toolbar -->
+      <div class="ms-ppl-toolbar">
+        <!-- ... existing controls ... -->
+      </div>
+      
+      <!-- NEW: Face Filter Panel -->
+      <FaceFilterPanel 
+        v-if="selectedFileUuid"
+        :fileUuid="selectedFileUuid"
+        ref="faceFilterPanel"
+      />
+    </div>
+    
+    <!-- ... rest of the view ... -->
+  </div>
+</template>
+
+<script setup lang="ts">
+import FaceFilterPanel from '../components/FaceFilterPanel.vue';
+
+const faceFilterPanel = ref();
+
+// ... existing code ...
+</script>
+```
+
+---
+
+### Step 3: 初始化過濾
+
+當選擇檔案時初始化過濾：
+
+```typescript
+// 在 onFileFilterChange 或 watch(selectedFileUuid) 中
+watch(selectedFileUuid, async (newUuid) => {
+  if (newUuid) {
+    await initialize(newUuid);
+  }
+});
+```
+
+---
+
+### Step 4: 使用過濾後的臉部
+
+使用 `filteredFaces` 替代原始的臉部列表：
+
+```vue
+<!-- 原本的臉部列表 -->
+<div v-for="face in allFaces" :key="face.face_id">
+  <!-- ... -->
+</div>
+
+<!-- 改為使用過濾後的臉部 -->
+<div v-for="face in filteredFaces" :key="face.face_id">
+  <FaceCard 
+    :face="face"
+    @click="openFaceDetail(face)"
+  />
+</div>
+```
+
+---
+
+### Step 5: 整合到現有 UI
+
+#### 選項 A: 獨立面板（推薦）
+
+FaceFilterPanel 作為獨立面板，放在 toolbar 下方：
+
+```vue
+<div class="ms-ppl-control-area">
+  <div class="ms-ppl-toolbar">
+    <!-- Existing controls -->
+  </div>
+  
+  <!-- Face Filter Panel -->
+  <FaceFilterPanel :fileUuid="selectedFileUuid" />
+  
+  <!-- Undo Banner -->
+  <div v-if="showUndoBanner" class="ms-undo-banner">
+    <!-- ... -->
+  </div>
+</div>
+```
+
+#### 選項 B: 整合到現有面板
+
+將過濾控制整合到現有的 Pending Faces 面板：
+
+```vue
+<div v-if="showUface" class="ms-ppl-section">
+  <div class="ms-ppl-section-toolbar">
+    <div class="ms-ppl-section-title">Pending Faces</div>
+    
+    <!-- Add filter controls -->
+    <div class="filter-controls-inline">
+      <select v-model="rules.source">
+        <option value="all">All</option>
+        <option value="apple_vision">AV</option>
+        <option value="mediapipe">MP</option>
+      </select>
+      <input 
+        type="number" 
+        v-model.number="rules.min_confidence"
+        placeholder="Min confidence"
+      />
+      <button @click="applyBackendFilter(selectedFileUuid)">
+        Apply Backend
+      </button>
+    </div>
+  </div>
+  
+  <!-- Face cards -->
+  <div class="ms-ppl-face-grid">
+    <FaceCard 
+      v-for="face in filteredFaces" 
+      :key="face.face_id"
+      :face="face"
+    />
+  </div>
+</div>
+```
+
+---
+
+## API 端點
+
+所有 API 呼叫都通過 composable 處理，使用 proxy 到 `http://localhost:8888/api/v1/...`
+
+**實際端點**：
+1. `GET /api/v1/file/{uuid}/faces` - 獲取臉部元數據
+2. `POST /api/v1/file/{uuid}/faces/filter` - 套用後端過濾
+3. `GET /api/v1/file/{uuid}/face/{faceId}/filter-report` - 獲取單臉報告
+4. `GET /api/v1/file/{uuid}/filter-stats` - 獲取統計
+5. `GET/POST /api/v1/file/{uuid}/filter-rules` - 規則 CRUD
+
+---
+
+## 資料結構
+
+### FaceMetadata
+
+```typescript
+interface FaceMetadata {
+  face_id: string;
+  frame: number;
+  primary_source: 'apple_vision' | 'mediapipe';
+  primary_confidence: number;
+  detection_sources: Array<{
+    source_type: string;
+    confidence: number;
+  }>;
+  filter_features: {
+    face_id: string;
+    frame: number;
+    bbox_size: number;              // min(width, height)
+    apple_vision_confidence: number;
+    mediapipe_confidence?: number;
+    eye_ratio?: number;
+    nose_ratio?: number;
+    pose_score?: number;
+    mediapipe_detected?: boolean;
+    mediapipe_iou?: number;
+    embedding_similarity?: number;
+    consecutive_frames?: number;
+    total_frames_detected?: number;
+    backend_filter_status?: 'accept' | 'reject' | 'review';
+  };
+}
+```
+
+---
+
+## 過濾模式
+
+### Instant Mode
+- **效能**: 5-10ms
+- **邏輯**: Client 端即時過濾
+- **適用**: 快速調整規則
+
+### Backend Mode
+- **效能**: 100-200ms（API 呼叫）
+- **邏輯**: 後端複雜過濾（landmark, embedding, temporal）
+- **適用**: 高品質過濾
+
+### Hybrid Mode
+- **效能**: 5-10ms（前端）+ 後端預先計算
+- **邏輯**: 後端標示 + 前端即時過濾（AND）
+- **適用**: 最佳使用者體驗
+
+---
+
+## 使用者偏好
+
+偏好儲存在 `localStorage`：
+
+**Key**: `momentry_face_filter_preferences`
+
+**結構**:
+```json
+{
+  "mode": "instant",
+  "rules": {
+    "min_confidence": 0.5,
+    "min_bbox_size": 80,
+    "source": "all",
+    "backend_status": "accept"
+  }
+}
+```
+
+---
+
+## 效能優化
+
+### 分頁
+- `page_size ≤ 50`（防 hang）
+- 虛擬滾動（可選）
+
+### 快取
+- 臉部元數據快取在 composable
+- 偏好儲存在 localStorage
+
+### 懶載入
+- JPG 縮圖懶載入（未來擴展）
+- 當前使用純文字卡片
+
+---
+
+## 錯誤處理
+
+Composable 提供 error 狀態：
+
+```typescript
+if (error.value) {
+  console.error('Face filter error:', error.value);
+  // 顯示錯誤訊息給使用者
+}
+```
+
+---
+
+## 測試
+
+### 單元測試
+```typescript
+import { useFaceFilter } from '../composables/useFaceFilter';
+
+describe('useFaceFilter', () => {
+  it('should filter faces by confidence', () => {
+    const { updateRules, filteredFaces } = useFaceFilter();
+    
+    // Setup test data
+    // ...
+    
+    updateRules({ min_confidence: 0.7 });
+    expect(filteredFaces.value.length).toBeLessThan(allFaces.value.length);
+  });
+});
+```
+
+### 整合測試
+1. 選擇檔案
+2. 驗證臉部載入
+3. 調整過濾規則
+4. 驗證過濾結果
+5. 切換模式
+6. 驗證模式切換
+
+---
+
+## 未來擴展
+
+### 1. 縮圖支援
+當 Core 實作 `/face/{id}/thumbnail` 端點後：
+
+```vue
+<FaceCard :face="face" showThumbnail />
+```
+
+### 2. 規則管理 UI
+當需要規則 CRUD 時：
+
+```vue
+<RuleManager 
+  :fileUuid="selectedFileUuid"
+  @rule-change="handleRuleChange"
+/>
+```
+
+### 3. 批量操作
+```typescript
+const selectedFaces = ref<FaceMetadata[]>([]);
+
+const batchAction = async (action: 'accept' | 'reject') => {
+  await fetch('/api/v1/file/.../faces/batch', {
+    method: 'POST',
+    body: JSON.stringify({
+      face_ids: selectedFaces.value.map(f => f.face_id),
+      action
+    })
+  });
+};
+```
+
+### 4. 匯出功能
+```typescript
+const exportFilteredFaces = () => {
+  const csv = filteredFaces.value.map(face => 
+    `${face.face_id},${face.frame},${face.primary_confidence},${face.filter_features.bbox_size}`
+  ).join('\n');
+  
+  // Download CSV
+};
+```
+
+---
+
+## 疑難排解
+
+### 問題 1: 臉部未載入
+**檢查**:
+- `selectedFileUuid` 是否正確
+- API 端點是否可達
+- 網路請求是否成功
+
+**解決**:
+```typescript
+console.log('File UUID:', selectedFileUuid);
+console.log('API Response:', await fetchFaces(selectedFileUuid));
+```
+
+### 問題 2: 過濾未生效
+**檢查**:
+- `mode` 是否正確
+- `rules` 是否正確
+- `filteredFaces` 是否更新
+
+**解決**:
+```typescript
+console.log('Mode:', mode.value);
+console.log('Rules:', rules.value);
+console.log('Filtered:', filteredFaces.value.length);
+```
+
+### 問題 3: 偏好未儲存
+**檢查**:
+- `localStorage` 是否可寫
+- Key 是否正確
+
+**解決**:
+```typescript
+console.log('LocalStorage:', localStorage.getItem('momentry_face_filter_preferences'));
+```
+
+---
+
+## 總結
+
+**整合步驟**：
+1. ✅ 導入 useFaceFilter composable
+2. ✅ 添加 FaceFilterPanel 組件
+3. ✅ 初始化過濾（watch selectedFileUuid）
+4. ✅ 使用 filteredFaces 顯示
+5. ✅ 處理錯誤和載入狀態
+
+**預期效果**：
+- 即時過濾（5-10ms）
+- 三種模式切換
+- 使用者偏好儲存
+- 純文字卡片（無縮圖）
+
+**未來擴展**：
+- 縮圖支援
+- 規則管理 UI
+- 批量操作
+- 匯出功能
+
+---
+
+**文件版本**: v1.0  
+**最後更新**: 2026-08-09  
+**相關文件**: 
+- `/Users/accusys/momentry_core/docs_v1.0/STUDIO_TEAM/face_filter_usage_guide.md`
+- `/Users/accusys/momentry_core/docs_v1.0/STUDIO_TEAM/face_filter_hybrid_mode_guide.md`

docs/issues/corrupted-video-seek-issue.md

@@ -0,0 +1,147 @@
+# 影片 Seek 異常問題
+
+## 問題描述
+
+**影片檔案**: `Gamma 8-Director Chih-Lin Yang Shares His Experience:楊智麟導演經驗分享.mp4`
+**UUID**: `d3f9ae8e471a1fc4d47022c66091b920`
+**大小**: 219.0 MB
+**時長**: 298.67 秒（約 5 分鐘）
+
+**症狀**:
+- 3 分鐘後 seek 異常
+- 異常行為：
+  1. 回到影片開頭
+  2. 跳到影片結尾
+
+## 診斷結果
+
+### ffprobe 檢測錯誤
+
+```
+[h264 @ 0x7ad048e00] Invalid NAL unit size (49912 > 22668).
+[h264 @ 0x7ad048a80] missing picture in access unit with size 22672
+[h264 @ 0x7ad048a80] Error splitting the input into NAL units.
+```
+
+### 影片結構分析
+
+| 項目 | 數值 | 狀態 |
+|------|------|------|
+| Codec | H.264 High Profile | ✅ |
+| 解析度 | 1920x1080 | ✅ |
+| 幀率 | 29.97 fps (30000/1001) | ✅ |
+| Keyframe 間距 | ~28 幀 (~1 秒) | ✅ |
+| moov atom 位置 | 28 bytes | ✅ 正確（在開頭） |
+| stss seek table | 存在 | ✅ |
+| NAL units | **損壞** | ❌ |
+
+### Range Requests 測試
+
+Core API Range requests 運作正常：
+
+```
+curl -I -H "Range: bytes=150000000-150001000" ...
+HTTP/1.1 206 Partial Content
+content-range: bytes 150000000-150001000/229638144
+```
+
+## 根本原因
+
+**影片檔案本身有損壞的 NAL units**，非 Studio 或 Core API 問題。
+
+瀏覽器的 H.264 解碼器在遇到損壞的 NAL units 時會：
+1. 無法正確解碼目標幀
+2. 嘔試從最近的 keyframe 恢復
+3. 若恢復失敗，跳回開頭或結尾
+
+## 解決方案
+
+### 方案 1: 重新封裝（Remux）
+
+不重新編碼，僅重新打包容器：
+
+```bash
+ffmpeg -i "/Users/accusys/momentry/var/sftpgo/data/demo/Gamma 8-Director Chih-Lin Yang Shares His Experience:楊智麟導演經驗分享.mp4" \
+  -c copy \
+  "/Users/accusys/momentry/var/sftpgo/data/demo/Gamma 8-Director Chih-Lin Yang Shares His Experience_fixed.mp4"
+```
+
+優點：快速、不損失畫質
+缺點：可能無法修復損壞的幀
+
+### 方案 2: 重新編碼（Transcode）
+
+完整重新編碼：
+
+```bash
+ffmpeg -i "/Users/accusys/momentry/var/sftpgo/data/demo/Gamma 8-Director Chih-Lin Yang Shares His Experience:楊智麟導演經驗分享.mp4" \
+  -c:v libx264 -crf 18 \
+  -c:a aac -b:a 128k \
+  "/Users/accusys/momentry/var/sftpgo/data/demo/Gamma 8-Director Chih-Lin Yang Shares His Experience_reencoded.mp4"
+```
+
+優點：完整修復損壞的幀
+缺點：耗時、些微畫質損失
+
+### 方案 3: 重新註冊
+
+修復後需重新註冊到系統：
+
+```bash
+# 取消註冊舊檔案
+curl -X POST http://localhost:8888/api/v1/unregister \
+  -H "Content-Type: application/json" \
+  -d '{"file_uuid": "d3f9ae8e471a1fc4d47022c66091b920"}'
+
+# 註冊新檔案
+curl -X POST http://localhost:8888/api/v1/files/register \
+  -H "Content-Type: application/json" \
+  -d '{"file_path": "/path/to/fixed_video.mp4"}'
+```
+
+## 預防措施
+
+### 上傳時驗證
+
+可在檔案註冊時加入驗證：
+
+```bash
+ffprobe -v error -count_frames -select_streams v:0 \
+  -show_entries stream=codec_name \
+  -of default=noprint_wrappers=1 input.mp4
+```
+
+若有錯誤輸出，標記檔案為「需要檢查」或自動嘗試修復。
+
+### 定期檢查腳本
+
+```bash
+#!/bin/bash
+# check_videos.sh
+for file in /path/to/videos/*.mp4; do
+  errors=$(ffprobe -v error -count_frames "$file" 2>&1 | grep -i "invalid\|error\|corrupt")
+  if [ -n "$errors" ]; then
+    echo "ISSUE: $file"
+    echo "$errors"
+  fi
+done
+```
+
+## 其他影片測試
+
+測試其他影片均正常，確認問題僅限於此特定檔案。
+
+## 狀態
+
+- [x] 問題診斷完成
+- [ ] 嘗試 remux 修復
+- [ ] 嘗試 transcode 修復（若 remux 失敗）
+- [ ] 重新註冊檔案
+- [ ] 驗證 seek 功能正常
+
+---
+
+**建立日期**: 2026-07-22
+**相關文件**: 
+- `/Users/accusys/momentry_studio/docs/core-api-usage.md`
+- `/Users/accusys/momentry_studio/docs/core-api-fix-video-range.md`

docs/proposals/core-api-face-groups-endpoint.md

@@ -0,0 +1,451 @@
+# Core API Face Groups Endpoint - 技術建議書
+
+**日期**: 2026-07-19  
+**提出團隊**: Momentry Studio  
+**狀態**: 建議中
+
+---
+
+## 一、背景
+
+### 1.1 問題描述
+
+Momentry Studio Proxy 當前實現以下 endpoints：
+
+| Endpoint | 當前行為 | 用途 |
+|----------|---------|------|
+| `/api/v1/processor-json` | 讀取本地 `{file_hash}.{processor}.json` | 返回 processor 輸出（asrx, ocr, face 等）|
+| `/api/v1/cluster-results` | 讀取本地 `{file_hash}.cluster_result.json` | 返回 face 分組結果 |
+
+**問題**：
+- 遠端瀏覽器訪問 `studio.momentry.ddns.net` 時，無法獲取本地文件數據
+- Proxy 應該作為 forward 層，將請求轉發到 Core API
+
+### 1.2 現有 Core API Endpoints
+
+| Endpoint | 狀態 | 說明 |
+|----------|------|------|
+| `POST /api/v1/file/:file_uuid/json/:processor` | ✅ 已存在 | 返回 processor JSON 數據 |
+| `POST /api/v1/file/:file_uuid/tkg/nodes` | ✅ 已存在 | 查詢 TKG nodes |
+| `GET /api/v1/trace-profile` | ✅ 已存在 | 查詢單一 trace profile |
+| `PUT /api/v1/trace-profile` | ✅ 已存在 | 更新 trace profile（含名稱）|
+| `PUT /api/v1/trace-profile/group` | ✅ 已存在 | 批量更新 trace 名稱 |
+| `GET /api/v1/file/:file_uuid/cluster-results` | ❌ 不存在 | 需要新增 |
+
+---
+
+## 二、架構理解
+
+### 2.1 Face Group 概念
+
+**定義**：
+- Face Group = 多個 face traces 共享同一個名稱（label）
+- 名稱來自 TKG `face_trace` node 的 `label` 欄位
+- 名稱可被用戶覆蓋（overridable）
+
+**技術實現**：
+```json
+{
+  "node_type": "face_trace",
+  "label": "Cary Grant",  // ← 可被用戶覆蓋
+  "properties": {
+    "trace_id": 9,
+    "face_count": 142,
+    "avg_confidence": 0.87
+  }
+}
+```
+
+### 2.2 Cluster 與 Face Group 的關係
+
+**核心觀點**：
+- **Cluster 是技術手段**：用於將多個 face traces 分組
+- **Face Group 是語義概念**：多個 traces 共享同一個名稱
+- **Cluster ID 是技術編號**：無業務語義，僅用於識別分組
+
+**命名流程**：
+```
+用戶修改名稱 
+  → Studio Frontend
+  → Studio Proxy
+  → Core API: PUT /api/v1/trace-profile
+  → 更新 TKG node 的 label
+```
+
+---
+
+## 三、建議方案
+
+### 3.1 Processor JSON Endpoint
+
+**建議**：使用 Core API 現有 endpoint
+
+**Studio Proxy 實現**：
+```
+GET /api/v1/processor-json?file_hash={uuid}&processor={name}
+  → Forward to Core API:
+POST /api/v1/file/{uuid}/json/{name}?api_key={API_KEY}
+```
+
+**Core API 需要做的**：無需修改
+
+---
+
+### 3.2 Face Groups Endpoint（建議新增）
+
+#### 選項 A：以 Cluster 格式返回
+
+**Endpoint**：
+```
+GET /api/v1/file/:file_uuid/cluster-results
+```
+
+**響應格式**：
+```json
+{
+  "success": true,
+  "file_uuid": "d3f9ae8e471a1fc4d47022c66091b920",
+  "clusters": [
+    {
+      "cluster_id": 1,
+      "name": "Cary Grant",
+      "trace_ids": [9, 6, 8],
+      "trace_count": 3,
+      "representative_trace": 9
+    },
+    {
+      "cluster_id": 2,
+      "name": "Audrey Hepburn",
+      "trace_ids": [1, 11, 4, 10],
+      "trace_count": 4,
+      "representative_trace": 1
+    }
+  ],
+  "total_clusters": 2
+}
+```
+
+---
+
+#### 選項 B：以 Face Groups 格式返回（推薦）
+
+**Endpoint**：
+```
+GET /api/v1/file/:file_uuid/face-groups
+```
+
+**響應格式**：
+```json
+{
+  "success": true,
+  "file_uuid": "d3f9ae8e471a1fc4d47022c66091b920",
+  "face_groups": [
+    {
+      "group_id": 1,
+      "name": "Cary Grant",
+      "trace_ids": [9, 6, 8],
+      "trace_count": 3,
+      "representative_trace": 9,
+      "editable": true,
+      "total_face_count": 425
+    },
+    {
+      "group_id": 2,
+      "name": "Audrey Hepburn",
+      "trace_ids": [1, 11, 4, 10],
+      "trace_count": 4,
+      "representative_trace": 1,
+      "editable": true,
+      "total_face_count": 380
+    }
+  ],
+  "total_groups": 2,
+  "unassigned_traces": [5, 7]
+}
+```
+
+**推薦理由**：
+- 語義更清晰（Face Group vs Cluster）
+- 與命名機制對應
+- 擴展性更好（可加入 `editable`, `total_face_count` 等屬性）
+- 可區分已命名和未命名的 traces
+
+---
+
+### 3.3 實現邏輯（建議）
+
+```python
+# Pseudocode
+def get_face_groups(file_uuid: str):
+    # 1. 查詢 TKG nodes
+    response = post(
+        f"{CORE_API}/api/v1/file/{file_uuid}/tkg/nodes",
+        json={"node_type": "face_trace", "page_size": 500}
+    )
+    nodes = response.json()["nodes"]
+    
+    # 2. 按 label 分組
+    groups = {}
+    unassigned = []
+    
+    for node in nodes:
+        trace_id = node["properties"]["trace_id"]
+        label = node["label"]
+        face_count = node["properties"].get("face_count", 0)
+        
+        # 判斷是否為預設名稱（未命名）
+        if label.startswith("Face Trace ") or label.startswith("Trace "):
+            unassigned.append(trace_id)
+            continue
+        
+        if label not in groups:
+            groups[label] = {
+                "trace_ids": [],
+                "total_face_count": 0
+            }
+        
+        groups[label]["trace_ids"].append(trace_id)
+        groups[label]["total_face_count"] += face_count
+    
+    # 3. 轉換為輸出格式
+    result = []
+    for idx, (name, data) in enumerate(sorted(groups.items()), 1):
+        result.append({
+            "group_id": idx,
+            "name": name,
+            "trace_ids": data["trace_ids"],
+            "trace_count": len(data["trace_ids"]),
+            "representative_trace": data["trace_ids"][0],
+            "editable": True,
+            "total_face_count": data["total_face_count"]
+        })
+    
+    return {
+        "success": True,
+        "file_uuid": file_uuid,
+        "face_groups": result,
+        "total_groups": len(result),
+        "unassigned_traces": unassigned
+    }
+```
+
+---
+
+## 四、設計決策問題
+
+### 4.1 Endpoint 命名
+
+**問題**：
+- 使用 `/cluster-results`（現有概念）？
+- 使用 `/face-groups`（語義更清晰）？
+
+**建議**：使用 `/face-groups`，理由：
+- 語義更準確（名稱可被覆蓋，不是固定的 cluster）
+- 與 `trace-profile` endpoint 命名一致
+- 未來可以擴展（如 `/face-groups/:name` 查詢單一 group）
+
+---
+
+### 4.2 未命名 Traces 處理
+
+**場景**：
+- 新創建的 face_trace，`label` 為預設值（如 `"Face Trace 9"`）
+- 用戶尚未命名
+
+**建議選項**：
+
+| 選項 | 處理方式 | 優點 | 缺點 |
+|------|---------|------|------|
+| A | 歸類為 `unassigned_traces` 列表 | 清晰區分已命名/未命名 | 需要額外欄位 |
+| B | 每個未命名 trace 作為獨立 group | 格式統一 | 可能產生大量 group |
+| C | 不返回未命名 traces | 響應簡潔 | 遺失數據 |
+
+**建議**：選項 A，返回 `unassigned_traces` 列表
+
+---
+
+### 4.3 Cluster ID / Group ID 的必要性
+
+**問題**：
+- `cluster_id` 或 `group_id` 是否需要？
+- 如果只是順序編號，每次查詢可能不同
+
+**建議選項**：
+
+| 選項 | 實現方式 | 優點 | 缺點 |
+|------|---------|------|------|
+| A | 使用 `name` 作為唯一標識 | 語義清晰，無需額外 ID | 名稱變更時引用會失效 |
+| B | 生成固定的 `group_id`（如 UUID） | ID 固定，不受名稱變更影響 | 需要額外存儲 |
+| C | 每次查詢時動態生成順序編號 | 實現簡單 | 編號可能變化 |
+
+**建議**：選項 C，動態生成順序編號（因為 Cluster ID 只是技術手段）
+
+---
+
+### 4.4 分頁支持
+
+**問題**：
+- 如果一個文件有大量 face traces（如超過 500），如何處理？
+
+**建議**：
+- 支持分頁參數 `page` 和 `page_size`
+- 默認 `page_size=100`，最大 `500`
+
+---
+
+### 4.5 性能考慮
+
+**問題**：
+- TKG nodes 查詢是否需要緩存？
+
+**建議**：
+- Core API 可以在內部緩存 TKG nodes 查詢結果
+- 緩存時效：5-10 分鐘（或直到有 trace-profile 更新）
+
+---
+
+## 五、Studio Proxy 職責
+
+### 5.1 Processor JSON Handler
+
+**修改前**：
+```rust
+// 讀取本地文件
+let path = format!("{}/{}.{}.json", output_dir, file_hash, processor);
+let content = std::fs::read_to_string(&path)?;
+```
+
+**修改後**：
+```rust
+// Forward 到 Core API
+let url = format!("{}/api/v1/file/{}/json/{}?api_key={}", 
+    CORE_API, file_hash, processor, API_KEY);
+let response = client.post(&url).send().await?;
+```
+
+---
+
+### 5.2 Cluster Results / Face Groups Handler
+
+**修改前**：
+```rust
+// 讀取本地文件
+let path = format!("{}/{}/{}.cluster_result.json", base, file_hash, file_hash);
+let content = std::fs::read_to_string(&path)?;
+```
+
+**修改後**：
+```rust
+// Forward 到 Core API
+let url = format!("{}/api/v1/file/{}/face-groups?api_key={}", 
+    CORE_API, file_hash, API_KEY);
+let response = client.get(&url).send().await?;
+```
+
+---
+
+### 5.3 共享邏輯
+
+**建議抽取共享函數**：
+```rust
+async fn call_core_api(url: &str, method: Method, body: Option<Value>) -> Response {
+    let client = reqwest::Client::new();
+    // 統一的錯誤處理
+    // 統一的響應轉換
+}
+```
+
+---
+
+## 六、數據流向
+
+### 6.1 當前流程（本地文件）
+
+```
+Studio Frontend
+    ↓
+Studio Proxy
+    ↓
+本地文件系統 → {file_hash}.{processor}.json
+    ↓
+返回數據
+
+問題：遠端瀏覽器無法訪問本地文件
+```
+
+---
+
+### 6.2 建議流程（Forward 到 Core API）
+
+```
+Studio Frontend
+    ↓
+Studio Proxy (forward)
+    ↓
+Core API
+    ├── POST /file/{uuid}/json/{processor}  (已有)
+    └── GET /file/{uuid}/face-groups         (新增)
+    ↓
+返回數據
+
+優點：遠端瀏覽器可正常訪問
+```
+
+---
+
+## 七、請求反饋
+
+### 7.1 請 Core API 團隊確認
+
+1. **Endpoint 選擇**：
+   - `/cluster-results` 或 `/face-groups`？
+
+2. **未命名 traces**：
+   - 是否同意返回 `unassigned_traces` 列表？
+
+3. **Group ID**：
+   - 是否同意使用動態生成的順序編號？
+   - 或需要固定的 UUID？
+
+4. **分頁**：
+   - 是否需要支持？
+
+5. **性能**：
+   - 是否需要內部緩存？
+
+---
+
+### 7.2 Studio 團隊負責
+
+1. 修改 Proxy handlers：
+   - `get_processor_json_handler` → Forward 到 Core API
+   - `get_cluster_results_handler` → Forward 到 Core API
+
+2. 抽取共享邏輯：
+   - 統一 Core API 客戶端
+   - 統一錯誤處理
+
+---
+
+## 八、附錄
+
+### A. 相關 Core API Endpoints
+
+| Endpoint | 文檔位置 |
+|----------|---------|
+| Processor JSON | `docs_v1.0/doc_wasm/modules/04_lookup.md` |
+| TKG Nodes | `docs_v1.0/doc_wasm/modules/15_tkg.md` |
+| Trace Profile | `docs_v1.0/doc_wasm/modules/18_profile.md` |
+| Progress | `docs_v1.0/doc_wasm/modules/17_progress.md` |
+
+### B. Studio 相關代碼
+
+| 文件 | 說明 |
+|------|------|
+| `src-tauri/src/proxy.rs` | Proxy handlers |
+| `src/views/PeopleView.vue` | Face 頁面 |
+| `src/store.ts` | 數據加載邏輯 |
+
+---
+
+**以上為 Studio 團隊提出的技術建議，歡迎 Core API 團隊討論與反饋。**

docs/proposals/face-group-naming-issue.md

@@ -0,0 +1,285 @@
+# Face Group 命名持久化問題 - 技術分析報告
+
+**日期**: 2026-07-19  
+**提出團隊**: Momentry Studio  
+**狀態**: 待 Core Team 討論
+
+---
+
+## 一、問題現象
+
+### 1.1 用戶操作流程
+
+1. 選擇影片檔案
+2. 建立 face group 並命名（如 "test group"）
+3. 將 trace 移入該 group
+4. 成功顯示新 group，可播放影片
+5. 跳轉到其他頁面
+6. 返回 Face 頁面
+7. **"test group" 消失**
+
+### 1.2 影響範圍
+
+| 功能 | 影響 |
+|------|------|
+| 新建 face group | ❌ 無法持久化 |
+| 重新命名 face group | ❌ 無法持久化 |
+| 移動 trace 到 group | ❌ 無法持久化 |
+| 系統自動生成的 group | ✅ 正常 |
+
+---
+
+## 二、技術分析
+
+### 2.1 數據流追蹤
+
+```
+Frontend                          Core API                    TKG
+   │                                 │                          │
+   │ updateTraceProfileGroup(        │                          │
+   │   fileUuid, traceIds,           │                          │
+   │   { name: "test group" }        │                          │
+   │ )                               │                          │
+   ├─────────────────────────────────►│                          │
+   │                                 │ PUT /trace-profile/group │
+   │                                 │ { name: "test group" }   │
+   │                                 ├─────────────────────────►│
+   │                                 │                          │
+   │                                 │              存入 face_trace.label
+   │                                 │                          │
+   │ loadClusterResults()            │                          │
+   ├─────────────────────────────────►│                          │
+   │                                 │ GET /file/{uuid}/        │
+   │                                 │     face-groups          │
+   │                                 ├─────────────────────────►│
+   │                                 │                          │
+   │                                 │              從 TKG 讀取 label
+   │                                 │◄─────────────────────────┤
+   │                                 │                          │
+   │ ◄───────────────────────────────┤ { face_groups: [...] }   │
+   │                                 │                          │
+```
+
+### 2.2 Bug 定位
+
+**文件位置**: `/Users/accusys/momentry_studio/src/api/index.ts`  
+**行號**: 379
+
+**問題代碼**:
+```javascript
+case 'update_trace_profile_group': {
+  return { 
+    url: '/api/v1/trace-profile/group', 
+    method: 'PUT', 
+    body: { 
+      file_uuid: a.fileUuid, 
+      trace_ids: a.traceIds, 
+      name: a.group_name || a.label,  // ← BUG: 忽略 a.name
+      key_frame: a.keyFrame, 
+      key_face: a.keyFace 
+    } 
+  }
+}
+```
+
+**Frontend 調用分析**:
+
+| 行號 | 文件 | 調用方式 | 參數 |
+|------|------|---------|------|
+| 430 | PeopleView.vue | `updateTraceProfileGroup(..., { name })` | `name` ✅ |
+| 864 | PeopleView.vue | `updateTraceProfileGroup(..., { label: name })` | `label` ⚠️ |
+| 928 | PeopleView.vue | `updateTraceProfileGroup(..., { name: ... })` | `name` ✅ |
+| 971 | PeopleView.vue | `updateTraceProfileGroup(..., { name })` | `name` ✅ |
+
+**結果**: 
+- API Builder 期望 `group_name` 或 `label`
+- Frontend 大部分傳入 `name`
+- 導致 Core API 收到 `name: undefined`
+
+---
+
+## 三、命名不一致問題
+
+### 3.1 各層級欄位對照
+
+| 層級 | 欄位名稱 | 說明 |
+|------|---------|------|
+| TKG `face_trace` node | `label` | 根本存儲位置 |
+| Core API `/trace-profile` (GET) | `name` | 返回給前端 |
+| Core API `/trace-profile/group` (PUT) | `name` | 接受前端參數 |
+| Frontend 大部分調用 | `name` | ✅ 正確 |
+| Frontend line 864 | `label` | ⚠️ 不一致 |
+| API Builder 期望 | `group_name \|\| label` | ❌ 不匹配 |
+
+### 3.2 Core API 文檔定義
+
+**`PUT /api/v1/trace-profile/group`**
+
+| 參數 | 類型 | 必填 | 說明 |
+|------|------|------|------|
+| `file_uuid` | string | Yes | File UUID |
+| `trace_ids` | integer[] | Yes | Trace IDs |
+| `name` | string | Yes | 新群組名稱 |
+
+**Core API 明確接受 `name` 參數。**
+
+---
+
+## 四、架構設計問題
+
+### 4.1 TKG Label 類型混淆
+
+**現狀**: TKG `label` 欄位可能代表不同意圖：
+
+| 來源 | 值範例 | 說明 |
+|------|-------|------|
+| 用戶命名 | "Peter", "Cary Grant" | 用戶主動指定 |
+| 系統生成 | "Trace_1", "Face Trace 9" | 自動生成 |
+| 其他 | 可能還有其他類型 | 待確認 |
+
+**問題**: 無法區分 label 的來源/類型
+
+### 4.2 建議方案
+
+#### 選項 A：增加 `label_type` 欄位
+
+```javascript
+// TKG face_trace node
+{
+  "node_type": "face_trace",
+  "label": "Peter",
+  "label_type": "face_name",  // 新增欄位
+  "properties": {
+    "trace_id": 9,
+    "face_count": 142,
+    ...
+  }
+}
+```
+
+**`label_type` 可能值**:
+
+| 值 | 說明 |
+|----|------|
+| `face_name` | 用戶定義的名稱 |
+| `system` | 系統自動生成 |
+| `tmdb` | 來自 TMDB 識別 |
+
+#### 選項 B：使用 `labels` 陣列（支援多標籤）
+
+```javascript
+{
+  "node_type": "face_trace",
+  "labels": [
+    { "value": "Peter", "type": "face_name", "source": "user" },
+    { "value": "Trace_9", "type": "system", "source": "auto" }
+  ],
+  ...
+}
+```
+
+#### 選項 C：維持現狀
+
+- TKG 保持 `label` 單一欄位
+- Core API 翻譯：`label` ↔ `name`
+- Frontend 統一使用 `name`
+
+---
+
+## 五、修復方案
+
+### 5.1 方案 A：前端統一使用 `name`（最小改動）
+
+**修改點**:
+
+| 文件 | 行號 | 原代碼 | 新代碼 |
+|------|------|--------|--------|
+| `src/api/index.ts` | 379 | `name: a.group_name \|\| a.label` | `name: a.name` |
+| `src/views/PeopleView.vue` | 864 | `{ label: name }` | `{ name }` |
+
+**優點**:
+- 改動少
+- 符合 Core API 文檔
+- 立即解決問題
+
+**缺點**:
+- 未處理 TKG label 類型問題
+- 未來可能有類似問題
+
+**預計工作量**: 0.5 小時
+
+### 5.2 方案 B：TKG 增加 `label_type`（完整方案）
+
+**需要修改**:
+
+1. **TKG Schema**
+   - 增加 `label_type` 欄位
+
+2. **Core API**
+   - `/trace-profile/group` 增加 `label_type` 參數（默認 `face_name`）
+   - 更新 TKG node 時設定 `label_type`
+
+3. **Frontend**
+   - 傳遞 `{ name: "...", label_type: "face_name" }`
+
+**優點**:
+- 完整解決命名類型問題
+- 支援未來擴展
+
+**缺點**:
+- 需要改動 TKG 和 Core API
+- 工作量較大
+
+**預計工作量**: 2-4 小時（跨團隊）
+
+---
+
+## 六、討論議題
+
+### 6.1 短期決策
+
+1. **是否先執行方案 A**，讓功能正常運作？
+2. **方案 A 的風險評估**？
+
+### 6.2 長期設計
+
+1. **TKG 是否需要 `label_type` 欄位**？
+2. **如果需要，`label_type` 應該有哪些值**？
+3. **Core API 是否需要同時支援 `name` 和 `label_type` 參數**？
+
+### 6.3 命名規範
+
+**建議建立正式對照表**:
+
+| 層級 | 欄位 | 類型 | 說明 |
+|------|------|------|------|
+| TKG | `label` | string | 根本存儲 |
+| TKG | `label_type` | string | 類型標識（新增？） |
+| Core API | `name` | string | API 參數/返回 |
+| Frontend | `name` | string | 統一使用 |
+
+---
+
+## 七、附錄
+
+### A. 相關代碼位置
+
+| 文件 | 說明 |
+|------|------|
+| `/Users/accusys/momentry_studio/src/api/index.ts:379` | API Builder |
+| `/Users/accusys/momentry_studio/src/store.ts:252` | updateTraceProfileGroup |
+| `/Users/accusys/momentry_studio/src/views/PeopleView.vue:430,864,928,971` | 調用點 |
+| `/Users/accusys/momentry_core/docs_v1.0/doc_wasm/modules/18_profile.md` | Core API 文檔 |
+
+### B. Core API 端點
+
+| 端點 | 方法 | 說明 |
+|------|------|------|
+| `/api/v1/trace-profile` | GET | 獲取單一 trace profile |
+| `/api/v1/trace-profile` | PUT | 更新單一 trace profile |
+| `/api/v1/trace-profile/group` | PUT | 批量更新 trace profile |
+| `/api/v1/file/{uuid}/face-groups` | GET | 獲取 face groups |
+
+---
+
+**以上問題請 Core Team 確認後，再決定修復方向。**

index.html

@@ -1,8 +1,9 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en" translate="no">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta name="google" content="notranslate">
   <title>Momentry Studio</title>
 </head>
 <body>

momentry-studio-v0.1.0-macos-aarch64.tar.gz.sha256

@@ -0,0 +1 @@
+154ef0e02a6199278ea6bc6a5073d11c631527f2825ba78ceeafcb5f486cf969  momentry-studio-v0.1.0-macos-aarch64.tar.gz

node_modules/.package-lock.json

@@ -67,6 +67,50 @@
         "node": ">=18"
       }
     },
+    "node_modules/@intlify/core-base": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.14.5.tgz",
+      "integrity": "sha512-5ah5FqZG4pOoHjkvs8mjtv+gPKYU0zCISaYNjBNNqYiaITxW8ZtVih3GS/oTOqN8d9/mDLyrjD46GBApNxmlsA==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/message-compiler": "9.14.5",
+        "@intlify/shared": "9.14.5"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/message-compiler": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.14.5.tgz",
+      "integrity": "sha512-IHzgEu61/YIpQV5Pc3aRWScDcnFKWvQA9kigcINcCBXN8mbW+vk9SK+lDxA6STzKQsVJxUPg9ACC52pKKo3SVQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/shared": "9.14.5",
+        "source-map-js": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/shared": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.14.5.tgz",
+      "integrity": "sha512-9gB+E53BYuAEMhbCAxVgG38EZrk59sxBtv3jSizNL2hEWlgjBjAw1AwpLHtNaeda12pe6W20OGEa0TwuMSRbyQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
     "node_modules/@jridgewell/sourcemap-codec": {
       "version": "1.5.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
@@ -104,6 +148,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.21",
+      "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.21.tgz",
+      "integrity": "sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "5.2.4",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
@@ -289,6 +339,44 @@
       "integrity": "sha512-FTW0AFZNaK5/mOqvGBwVfUlNLU38TiQn4+DQgIFUnrBBJQ1crMJ82yeGQLV5jyKFsO8yRukpbuP7x+nRbH6aug==",
       "license": "MIT"
     },
+    "node_modules/@vueuse/core": {
+      "version": "14.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-14.3.0.tgz",
+      "integrity": "sha512-aHfz47g0ZhMtTVHmIzMVpJy8ePhhOy68GY5bv110+5DVtZ+W7BsOx+m61UNQqfrWyPztIHIanWa3E2tib3NFIw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.21",
+        "@vueuse/metadata": "14.3.0",
+        "@vueuse/shared": "14.3.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "14.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-14.3.0.tgz",
+      "integrity": "sha512-BwxmbAzwAVF50+MW57GXOUEV61nFBGnlBvrTqj49PqWJu3uw7hdu72ztXeZ33RdZtDY6kO+bfCAE1PCn88Tktw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared": {
+      "version": "14.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-14.3.0.tgz",
+      "integrity": "sha512-bZpge9eSXwa4ToSiqJ7j6KRwhAsneMFoSz3LMWKQDkqimm3D/tbFlrklrs/IOqC8tEcYmXQZJ6N0UrjhBirVCg==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
     "node_modules/alien-signals": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/alien-signals/-/alien-signals-1.0.13.tgz",
@@ -721,6 +809,27 @@
         }
       }
     },
+    "node_modules/vue-i18n": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.14.5.tgz",
+      "integrity": "sha512-0jQ9Em3ymWngyiIkj0+c/k7WgaPO+TNzjKSNq9BvBQaKJECqn9cd9fL4tkDhB5G1QBskGl9YxxbDAhgbFtpe2g==",
+      "deprecated": "v9 and v10 no longer supported. please migrate to v11. about maintenance status, see https://vue-i18n.intlify.dev/guide/maintenance.html",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/core-base": "9.14.5",
+        "@intlify/shared": "9.14.5",
+        "@vue/devtools-api": "^6.5.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
     "node_modules/vue-router": {
       "version": "4.6.4",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.4.tgz",

node_modules/.vite/deps/_metadata.json

@@ -1,29 +1,44 @@
 {
-  "hash": "4fedd820",
-  "configHash": "912a7b44",
-  "lockfileHash": "8417729c",
-  "browserHash": "686c2332",
+  "hash": "813ccdf0",
+  "configHash": "5b9e4b03",
+  "lockfileHash": "ac269d47",
+  "browserHash": "2eabb9c1",
   "optimized": {
     "@tauri-apps/api/core": {
       "src": "../../@tauri-apps/api/core.js",
       "file": "@tauri-apps_api_core.js",
-      "fileHash": "e45d7d78",
+      "fileHash": "3969e853",
       "needsInterop": false
     },
     "vue": {
       "src": "../../vue/dist/vue.runtime.esm-bundler.js",
       "file": "vue.js",
-      "fileHash": "7f9396bc",
+      "fileHash": "b283492a",
       "needsInterop": false
     },
     "vue-router": {
       "src": "../../vue-router/dist/vue-router.mjs",
       "file": "vue-router.js",
-      "fileHash": "d8343f48",
+      "fileHash": "0528c0df",
+      "needsInterop": false
+    },
+    "vue-i18n": {
+      "src": "../../vue-i18n/dist/vue-i18n.mjs",
+      "file": "vue-i18n.js",
+      "fileHash": "b2bd439f",
+      "needsInterop": false
+    },
+    "@vueuse/core": {
+      "src": "../../@vueuse/core/dist/index.js",
+      "file": "@vueuse_core.js",
+      "fileHash": "db16229f",
       "needsInterop": false
     }
   },
   "chunks": {
+    "chunk-YFT6OQ5R": {
+      "file": "chunk-YFT6OQ5R.js"
+    },
     "chunk-5G6OTI3J": {
       "file": "chunk-5G6OTI3J.js"
     }

node_modules/.vite/deps/vue-router.js

@@ -1,3 +1,6 @@
+import {
+  setupDevtoolsPlugin
+} from "./chunk-YFT6OQ5R.js";
 import {
   computed,
   defineComponent,
@@ -18,164 +21,6 @@ import {
   watchEffect
 } from "./chunk-5G6OTI3J.js";
 
-// node_modules/@vue/devtools-api/lib/esm/env.js
-function getDevtoolsGlobalHook() {
-  return getTarget().__VUE_DEVTOOLS_GLOBAL_HOOK__;
-}
-function getTarget() {
-  return typeof navigator !== "undefined" && typeof window !== "undefined" ? window : typeof globalThis !== "undefined" ? globalThis : {};
-}
-var isProxyAvailable = typeof Proxy === "function";
-
-// node_modules/@vue/devtools-api/lib/esm/const.js
-var HOOK_SETUP = "devtools-plugin:setup";
-var HOOK_PLUGIN_SETTINGS_SET = "plugin:settings:set";
-
-// node_modules/@vue/devtools-api/lib/esm/time.js
-var supported;
-var perf;
-function isPerformanceSupported() {
-  var _a;
-  if (supported !== void 0) {
-    return supported;
-  }
-  if (typeof window !== "undefined" && window.performance) {
-    supported = true;
-    perf = window.performance;
-  } else if (typeof globalThis !== "undefined" && ((_a = globalThis.perf_hooks) === null || _a === void 0 ? void 0 : _a.performance)) {
-    supported = true;
-    perf = globalThis.perf_hooks.performance;
-  } else {
-    supported = false;
-  }
-  return supported;
-}
-function now() {
-  return isPerformanceSupported() ? perf.now() : Date.now();
-}
-
-// node_modules/@vue/devtools-api/lib/esm/proxy.js
-var ApiProxy = class {
-  constructor(plugin, hook) {
-    this.target = null;
-    this.targetQueue = [];
-    this.onQueue = [];
-    this.plugin = plugin;
-    this.hook = hook;
-    const defaultSettings = {};
-    if (plugin.settings) {
-      for (const id in plugin.settings) {
-        const item = plugin.settings[id];
-        defaultSettings[id] = item.defaultValue;
-      }
-    }
-    const localSettingsSaveId = `__vue-devtools-plugin-settings__${plugin.id}`;
-    let currentSettings = Object.assign({}, defaultSettings);
-    try {
-      const raw = localStorage.getItem(localSettingsSaveId);
-      const data = JSON.parse(raw);
-      Object.assign(currentSettings, data);
-    } catch (e) {
-    }
-    this.fallbacks = {
-      getSettings() {
-        return currentSettings;
-      },
-      setSettings(value) {
-        try {
-          localStorage.setItem(localSettingsSaveId, JSON.stringify(value));
-        } catch (e) {
-        }
-        currentSettings = value;
-      },
-      now() {
-        return now();
-      }
-    };
-    if (hook) {
-      hook.on(HOOK_PLUGIN_SETTINGS_SET, (pluginId, value) => {
-        if (pluginId === this.plugin.id) {
-          this.fallbacks.setSettings(value);
-        }
-      });
-    }
-    this.proxiedOn = new Proxy({}, {
-      get: (_target, prop) => {
-        if (this.target) {
-          return this.target.on[prop];
-        } else {
-          return (...args) => {
-            this.onQueue.push({
-              method: prop,
-              args
-            });
-          };
-        }
-      }
-    });
-    this.proxiedTarget = new Proxy({}, {
-      get: (_target, prop) => {
-        if (this.target) {
-          return this.target[prop];
-        } else if (prop === "on") {
-          return this.proxiedOn;
-        } else if (Object.keys(this.fallbacks).includes(prop)) {
-          return (...args) => {
-            this.targetQueue.push({
-              method: prop,
-              args,
-              resolve: () => {
-              }
-            });
-            return this.fallbacks[prop](...args);
-          };
-        } else {
-          return (...args) => {
-            return new Promise((resolve) => {
-              this.targetQueue.push({
-                method: prop,
-                args,
-                resolve
-              });
-            });
-          };
-        }
-      }
-    });
-  }
-  async setRealTarget(target) {
-    this.target = target;
-    for (const item of this.onQueue) {
-      this.target.on[item.method](...item.args);
-    }
-    for (const item of this.targetQueue) {
-      item.resolve(await this.target[item.method](...item.args));
-    }
-  }
-};
-
-// node_modules/@vue/devtools-api/lib/esm/index.js
-function setupDevtoolsPlugin(pluginDescriptor, setupFn) {
-  const descriptor = pluginDescriptor;
-  const target = getTarget();
-  const hook = getDevtoolsGlobalHook();
-  const enableProxy = isProxyAvailable && descriptor.enableEarlyProxy;
-  if (hook && (target.__VUE_DEVTOOLS_PLUGIN_API_AVAILABLE__ || !enableProxy)) {
-    hook.emit(HOOK_SETUP, pluginDescriptor, setupFn);
-  } else {
-    const proxy = enableProxy ? new ApiProxy(descriptor, hook) : null;
-    const list = target.__VUE_DEVTOOLS_PLUGINS__ = target.__VUE_DEVTOOLS_PLUGINS__ || [];
-    list.push({
-      pluginDescriptor: descriptor,
-      setupFn,
-      proxy
-    });
-    if (proxy) {
-      setupFn(proxy.proxiedTarget);
-    }
-  }
-}
-
 // node_modules/vue-router/dist/devtools-EWN81iOl.mjs
 var isBrowser = typeof document !== "undefined";
 function isRouteComponent(component) {

package-lock.json

@@ -9,7 +9,9 @@
       "version": "0.1.0",
       "dependencies": {
         "@tauri-apps/api": "^2.11.0",
+        "@vueuse/core": "^14.3.0",
         "vue": "^3.5.13",
+        "vue-i18n": "^9.14.5",
         "vue-router": "^4.5.0"
       },
       "devDependencies": {
@@ -507,6 +509,50 @@
         "node": ">=18"
       }
     },
+    "node_modules/@intlify/core-base": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.14.5.tgz",
+      "integrity": "sha512-5ah5FqZG4pOoHjkvs8mjtv+gPKYU0zCISaYNjBNNqYiaITxW8ZtVih3GS/oTOqN8d9/mDLyrjD46GBApNxmlsA==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/message-compiler": "9.14.5",
+        "@intlify/shared": "9.14.5"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/message-compiler": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.14.5.tgz",
+      "integrity": "sha512-IHzgEu61/YIpQV5Pc3aRWScDcnFKWvQA9kigcINcCBXN8mbW+vk9SK+lDxA6STzKQsVJxUPg9ACC52pKKo3SVQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/shared": "9.14.5",
+        "source-map-js": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@intlify/shared": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.14.5.tgz",
+      "integrity": "sha512-9gB+E53BYuAEMhbCAxVgG38EZrk59sxBtv3jSizNL2hEWlgjBjAw1AwpLHtNaeda12pe6W20OGEa0TwuMSRbyQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
     "node_modules/@jridgewell/sourcemap-codec": {
       "version": "1.5.5",
       "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
@@ -919,6 +965,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/web-bluetooth": {
+      "version": "0.0.21",
+      "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.21.tgz",
+      "integrity": "sha512-oIQLCGWtcFZy2JW77j9k8nHzAOpqMHLQejDA48XXMWH6tjCQHz5RCFz1bzsmROyL6PUm+LLnUiI4BCn221inxA==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-vue": {
       "version": "5.2.4",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-5.2.4.tgz",
@@ -1104,6 +1156,44 @@
       "integrity": "sha512-FTW0AFZNaK5/mOqvGBwVfUlNLU38TiQn4+DQgIFUnrBBJQ1crMJ82yeGQLV5jyKFsO8yRukpbuP7x+nRbH6aug==",
       "license": "MIT"
     },
+    "node_modules/@vueuse/core": {
+      "version": "14.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-14.3.0.tgz",
+      "integrity": "sha512-aHfz47g0ZhMtTVHmIzMVpJy8ePhhOy68GY5bv110+5DVtZ+W7BsOx+m61UNQqfrWyPztIHIanWa3E2tib3NFIw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/web-bluetooth": "^0.0.21",
+        "@vueuse/metadata": "14.3.0",
+        "@vueuse/shared": "14.3.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
+    "node_modules/@vueuse/metadata": {
+      "version": "14.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-14.3.0.tgz",
+      "integrity": "sha512-BwxmbAzwAVF50+MW57GXOUEV61nFBGnlBvrTqj49PqWJu3uw7hdu72ztXeZ33RdZtDY6kO+bfCAE1PCn88Tktw==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@vueuse/shared": {
+      "version": "14.3.0",
+      "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-14.3.0.tgz",
+      "integrity": "sha512-bZpge9eSXwa4ToSiqJ7j6KRwhAsneMFoSz3LMWKQDkqimm3D/tbFlrklrs/IOqC8tEcYmXQZJ6N0UrjhBirVCg==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "vue": "^3.5.0"
+      }
+    },
     "node_modules/alien-signals": {
       "version": "1.0.13",
       "resolved": "https://registry.npmjs.org/alien-signals/-/alien-signals-1.0.13.tgz",
@@ -1536,6 +1626,27 @@
         }
       }
     },
+    "node_modules/vue-i18n": {
+      "version": "9.14.5",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.14.5.tgz",
+      "integrity": "sha512-0jQ9Em3ymWngyiIkj0+c/k7WgaPO+TNzjKSNq9BvBQaKJECqn9cd9fL4tkDhB5G1QBskGl9YxxbDAhgbFtpe2g==",
+      "deprecated": "v9 and v10 no longer supported. please migrate to v11. about maintenance status, see https://vue-i18n.intlify.dev/guide/maintenance.html",
+      "license": "MIT",
+      "dependencies": {
+        "@intlify/core-base": "9.14.5",
+        "@intlify/shared": "9.14.5",
+        "@vue/devtools-api": "^6.5.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
     "node_modules/vue-router": {
       "version": "4.6.4",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.6.4.tgz",

package.json

@@ -3,14 +3,17 @@
   "version": "0.1.0",
   "description": "Momentry Studio - Video Analysis Platform",
   "scripts": {
-    "dev": "vite",
+    "proxy": "lsof -ti :8888 | xargs kill -9 2>/dev/null; MOMENTRY_API_KEY=muser_68600856036340bcafc01930eb4bd839_1774418104_97221b69 MOMENTRY_DATA_DIR=$(pwd)/data/users ./src-tauri/target/debug/momentry-proxy",
+    "dev": "lsof -ti :8888 | xargs kill -9 2>/dev/null; MOMENTRY_API_KEY=muser_68600856036340bcafc01930eb4bd839_1774418104_97221b69 MOMENTRY_DATA_DIR=$(pwd)/data/users ./src-tauri/target/debug/momentry-proxy > /tmp/momentry_proxy.log 2>&1 & sleep 2 && vite",
     "build": "vue-tsc --noEmit && vite build",
     "preview": "vite preview",
     "tauri": "cargo tauri"
   },
   "dependencies": {
     "@tauri-apps/api": "^2.11.0",
+    "@vueuse/core": "^14.3.0",
     "vue": "^3.5.13",
+    "vue-i18n": "^9.14.5",
     "vue-router": "^4.5.0"
   },
   "devDependencies": {

release/ADMIN_DEPLOYMENT_GUIDE.md

@@ -0,0 +1,345 @@
+# Momentry Studio v0.1.0 - Admin Team 部署指南
+
+**发布日期：** 2026-10-08  
+**构建版本：** 8e71996  
+**目标环境：** 生产环境
+
+---
+
+## 📦 发布包信息
+
+**文件名：** `momentry-studio-v0.1.0-macos-aarch64.tar.gz`  
+**文件大小：** 37MB  
+**SHA256：** 
+```
+154ef0e02a6199278ea6bc6a5073d11c631527f2825ba78ceeafcb5f486cf969
+```
+
+---
+
+## 🔐 验证发布包
+
+```bash
+# 下载发布包后验证校验和
+shasum -a 256 -c momentry-studio-v0.1.0-macos-aarch64.tar.gz.sha256
+```
+
+---
+
+## 📋 部署前检查清单
+
+### 1. 系统要求
+- [ ] macOS 12.0+ (Monterey 或更高版本)
+- [ ] Apple Silicon (M1/M2/M3)
+- [ ] 4GB RAM minimum (推荐 8GB)
+- [ ] 1GB 可用磁盘空间
+
+### 2. 依赖服务
+- [ ] PostgreSQL 14+ 已安装并运行
+- [ ] Qdrant 1.7+ 已安装并运行
+- [ ] MarkBase Core API 2.3+ 已配置
+- [ ] MarkBase Engine 1.0+ 已配置
+
+### 3. 网络配置
+- [ ] 端口 3002 可用（Core API）
+- [ ] 端口 8888 可用（Proxy）
+- [ ] 端口 5432 可用（PostgreSQL）
+- [ ] 端口 6333 可用（Qdrant）
+
+---
+
+## 🚀 部署步骤
+
+### 步骤 1: 准备发布包
+
+```bash
+# 1. 解压发布包
+tar -xzf momentry-studio-v0.1.0-macos-aarch64.tar.gz
+
+# 2. 验证内容
+ls -l
+# 应该看到：
+# - Momentry Studio.app
+# - Momentry Studio_0.1.0_aarch64.dmg
+# - momentry-core
+# - momentry-proxy
+# - install.sh
+# - README.md
+# - RELEASE_NOTES.md
+# - VERSION.json
+```
+
+### 步骤 2: 部署 Studio App
+
+**选项 A: 使用 DMG（推荐）**
+```bash
+# 打开 DMG 文件
+open "Momentry Studio_0.1.0_aarch64.dmg"
+
+# 在 Finder 中拖拽到 Applications
+# 或使用命令行：
+cp -r "/Volumes/Momentry Studio/Momentry Studio.app" /Applications/
+```
+
+**选项 B: 使用 .app**
+```bash
+# 直接复制到 Applications
+cp -r "Momentry Studio.app" /Applications/
+
+# 如果需要，授权运行
+xattr -d com.apple.quarantine "/Applications/Momentry Studio.app"
+```
+
+**选项 C: 使用安装脚本**
+```bash
+# 运行安装脚本
+./install.sh
+```
+
+### 步骤 3: 部署 Backend Services
+
+**安装 binaries：**
+```bash
+# 复制到系统 bin 目录
+sudo cp momentry-core /usr/local/bin/
+sudo cp momentry-proxy /usr/local/bin/
+
+# 设置权限
+sudo chmod +x /usr/local/bin/momentry-core
+sudo chmod +x /usr/local/bin/momentry-proxy
+```
+
+### 步骤 4: 配置服务
+
+**创建配置文件：**
+```bash
+# 创建配置目录
+mkdir -p /opt/momentry/config
+
+# 创建配置文件
+cat > /opt/momentry/config/momentry.toml << 'TOML'
+[server]
+host = "0.0.0.0"
+port = 3002
+
+[database]
+url = "postgres://momentry:password@localhost:5432/momentry"
+
+[face_settings]
+min_confidence = 0.5
+min_bbox_size = 80
+TOML
+```
+
+**设置环境变量：**
+```bash
+# 在 ~/.zshrc 或 ~/.bash_profile 中添加
+export MOMENTRY_API_KEY="your_production_api_key"
+export MOMENTRY_DATA_DIR="/opt/momentry/data"
+export MOMENTRY_CONFIG="/opt/momentry/config/momentry.toml"
+```
+
+### 步骤 5: 启动服务
+
+**手动启动：**
+```bash
+# 1. 启动 Core API
+momentry-core server --config /opt/momentry/config/momentry.toml
+
+# 2. 在另一个终端启动 Studio
+open "/Applications/Momentry Studio.app"
+```
+
+**创建 launchd 服务（可选）：**
+```bash
+# 创建 Core API 服务
+sudo cat > /Library/LaunchDaemons/com.momentry.core.plist << 'PLIST'
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+    <key>Label</key>
+    <string>com.momentry.core</string>
+    <key>ProgramArguments</key>
+    <array>
+        <string>/usr/local/bin/momentry-core</string>
+        <string>server</string>
+        <string>--config</string>
+        <string>/opt/momentry/config/momentry.toml</string>
+    </array>
+    <key>RunAtLoad</key>
+    <true/>
+    <key>KeepAlive</key>
+    <true/>
+</dict>
+</plist>
+PLIST
+
+# 加载服务
+sudo launchctl load /Library/LaunchDaemons/com.momentry.core.plist
+```
+
+---
+
+## ✅ 验证部署
+
+### 1. 验证 Core API
+
+```bash
+# 检查服务状态
+curl http://localhost:3002/api/v1/health
+
+# 预期响应：
+# {"status":"ok","version":"1.0.0",...}
+```
+
+### 2. 验证 Proxy
+
+```bash
+# 检查 proxy 状态
+curl http://localhost:8888/health
+
+# 预期响应：
+# ok
+```
+
+### 3. 验证 Studio App
+
+```bash
+# 打开应用
+open "/Applications/Momentry Studio.app"
+
+# 检查进程
+ps aux | grep "Momentry Studio"
+```
+
+### 4. 功能测试
+
+在 Studio 中测试以下功能：
+
+- [ ] 登录功能
+- [ ] Library 文件浏览
+- [ ] Search 功能
+- [ ] People 页面
+- [ ] Admin 设置页面
+  - [ ] MarkBase Engine 状态显示为 `online`
+  - [ ] 批量 Deep Scan 功能
+  - [ ] 批量 Unregister 功能
+
+---
+
+## 🔄 更新流程
+
+### 从旧版本升级
+
+```bash
+# 1. 停止旧服务
+sudo launchctl unload /Library/LaunchDaemons/com.momentry.core.plist 2>/dev/null || true
+pkill -f momentry-core
+pkill -f "Momentry Studio"
+
+# 2. 备份数据（重要！）
+pg_dump momentry > momentry_backup_$(date +%Y%m%d).sql
+
+# 3. 安装新版本
+# （按照上面的部署步骤）
+
+# 4. 启动新服务
+sudo launchctl load /Library/LaunchDaemons/com.momentry.core.plist
+```
+
+---
+
+## 🐛 故障排查
+
+### 问题 1: 应用无法启动
+
+**症状：** 双击 .app 后无反应
+
+**解决方案：**
+```bash
+# 移除隔离属性
+xattr -d com.apple.quarantine "/Applications/Momentry Studio.app"
+
+# 检查控制台日志
+log stream --predicate 'process == "momentry-studio"' --level debug
+```
+
+### 问题 2: 无法连接到 Core API
+
+**症状：** Studio 显示连接错误
+
+**解决方案：**
+```bash
+# 检查 Core API 是否运行
+ps aux | grep momentry-core
+
+# 检查端口是否监听
+lsof -i :3002
+
+# 检查防火墙
+# 确保端口 3002 和 8888 已开放
+```
+
+### 问题 3: MarkBase Engine 显示 offline
+
+**症状：** Admin 页面显示 MarkBase Engine 为 offline
+
+**解决方案：**
+```bash
+# 检查 MarkBase Engine 是否运行
+curl http://localhost:8080/health
+
+# 如果正常返回 {"status":"ok"}，但 Studio 仍显示 offline
+# 确认使用的是最新版本的 Studio（v0.1.0+）
+```
+
+---
+
+## 📊 监控和日志
+
+### 日志位置
+
+- **Core API:** `/opt/momentry/logs/core.log`
+- **Proxy:** `/opt/momentry/logs/proxy.log`
+- **Studio:** `~/Library/Logs/Momentry Studio/`
+
+### 性能监控
+
+```bash
+# 检查资源使用
+top -pid $(pgrep momentry-core)
+
+# 检查内存使用
+ps aux | grep momentry-core | awk '{print $6/1024 "MB"}'
+```
+
+---
+
+## 📞 支持联系
+
+**技术支持：**
+- Email: tech@momentry.ai
+- Slack: #momentry-support
+
+**紧急联系：**
+- On-call: +886-xxx-xxx-xxx
+
+**文档：**
+- 详细发布说明: RELEASE_NOTES.md
+- 用户手册: https://docs.momentry.ai
+
+---
+
+## 📝 部署记录
+
+**部署日期：** _________  
+**部署人员：** _________  
+**部署环境：** _________  
+**验证结果：** [ ] 通过 [ ] 失败  
+**备注：** _________
+
+---
+
+**部署完成后，请将此文档归档并通知开发团队。**
+

release/README.md

@@ -0,0 +1,69 @@
+# Momentry Studio v0.1.0
+
+## 快速开始
+
+### 安装
+
+**方法 1: DMG 安装（推荐）**
+```bash
+# 打开 DMG 文件
+open "Momentry Studio_0.1.0_aarch64.dmg"
+# 拖拽到 Applications 文件夹
+```
+
+**方法 2: 使用安装脚本**
+```bash
+./install.sh
+```
+
+**方法 3: 手动安装**
+```bash
+cp -r "Momentry Studio.app" /Applications/
+```
+
+### 启动服务
+
+1. **启动 Core API：**
+```bash
+export MOMENTRY_API_KEY=your_api_key
+./momentry-core server --host 0.0.0.0 --port 3002
+```
+
+2. **启动 Studio：**
+```bash
+open "/Applications/Momentry Studio.app"
+```
+
+## 包含内容
+
+- `Momentry Studio.app` - macOS 桌面应用
+- `Momentry Studio_0.1.0_aarch64.dmg` - DMG 安装包
+- `momentry-core` - Core API server
+- `momentry-proxy` - HTTP proxy server
+- `install.sh` - 安装脚本
+- `RELEASE_NOTES.md` - 详细发布说明
+
+## 系统要求
+
+- macOS 12.0+ (Apple Silicon)
+- PostgreSQL 14+
+- 4GB RAM minimum
+
+## 新功能
+
+- ✅ 批量 Deep Scan（并发控制）
+- ✅ 批量 Unregister
+- ✅ Face Filter 自动保存
+- ✅ MarkBase Engine 健康检查修复
+- ✅ FS Name 唯一性修复
+
+## 文档
+
+- 详细发布说明：`RELEASE_NOTES.md`
+- 配置示例：运行 `install.sh` 后创建在 `~/.momentry/momentry.toml`
+
+## 支持
+
+- 技术支持：tech@momentry.ai
+- Bug 报告：https://github.com/momentry/studio/issues
+

release/RELEASE_NOTES.md

@@ -0,0 +1,250 @@
+# Momentry Studio v0.1.0 Release Notes
+
+**发布日期：** 2026-10-08  
+**构建类型：** Production Release  
+**平台：** macOS (Apple Silicon)
+
+---
+
+## 📦 发布包内容
+
+### 1. Tauri Desktop Application
+- **Momentry Studio.app** - macOS 原生桌面应用
+- **Momentry Studio_0.1.0_aarch64.dmg** - DMG 安装包
+
+### 2. Backend Services
+- **momentry-core** - Core API server binary
+- **momentry-proxy** - HTTP proxy server binary
+
+---
+
+## ✨ 新功能
+
+### 1. 批量操作增强
+
+**批量 Deep Scan：**
+- 在 Registered 和 Completed section 添加批量 Deep Scan 按钮
+- 使用 p-limit 控制并发（maxConcurrent = 2）
+- 超过并发的文件自动排队
+- 实时显示队列状态：`Processing 1/5 (3 queuing, 2 active)...`
+
+**批量 Unregister：**
+- 在 Registered 和 Completed section 添加批量 Unregister 按钮
+- 支持确认对话框
+- 显示成功/失败统计
+
+### 2. Face Filter 自动保存
+
+**实时自动保存（500ms 防抖）：**
+- 修改后自动保存到后端数据库
+- 离开页面时自动保存未保存的修改
+- 组件卸载时清理定时器
+- 显示自动保存状态：`✓ Auto-saved` 或 `⏳ Saving...`
+
+### 3. Registered 卡片 Checkbox 修复
+
+**修复问题：**
+- toggleSelect 函数使用正确的 key（file_uuid）
+- 修复 HTML 缩进问题
+- 确保勾选功能正常工作
+
+---
+
+## 🐛 Bug 修复
+
+### 1. MarkBase Engine 健康检查修复
+
+**问题：**
+- Admin 页面显示 MarkBase Engine 为 `offline`
+- 实际服务正在运行
+
+**修复：**
+- 支持 JSON 和纯文本格式的健康检查响应
+- 根据 Content-Type 判断响应格式
+- 从 JSON 提取 version 和 uptime 信息
+
+### 2. FS Name 唯一性问题修复
+
+**问题：**
+- 两个自动命名源导致名称混乱
+- Person_X 和 Face Trace X 格式并存
+
+**修复：**
+- 移除所有自动命名逻辑
+- 新 traces 默认为 "Unassigned"
+- 统一 trace_profiles.name 为唯一名称来源
+
+### 3. 性能优化
+
+**并发控制：**
+- thumbnail 并发数从 32 降到 10
+- search_agents API timeout 提升到 90s
+
+**排序优化：**
+- scanning/preparing 文件优先显示
+- 改进用户体验
+
+---
+
+## 📋 系统要求
+
+### macOS
+- macOS 12.0 (Monterey) 或更高版本
+- Apple Silicon (M1/M2/M3) 或 Intel (需单独构建)
+- 4GB RAM minimum, 8GB recommended
+- 1GB 可用磁盘空间
+
+### 依赖服务
+- PostgreSQL 14+
+- Qdrant (v1.7+)
+- MarkBase Core API (v2.3+)
+- MarkBase Engine (v1.0+)
+
+---
+
+## 🚀 安装指南
+
+### 方法 1: DMG 安装（推荐）
+
+1. 下载 `Momentry Studio_0.1.0_aarch64.dmg`
+2. 双击打开 DMG 文件
+3. 拖拽 "Momentry Studio.app" 到 Applications 文件夹
+4. 从 Applications 启动应用
+
+### 方法 2: 直接使用 .app
+
+1. 复制 "Momentry Studio.app" 到 Applications 文件夹
+2. 首次运行可能需要在"系统偏好设置 > 安全性与隐私"中允许运行
+
+---
+
+## ⚙️ 配置
+
+### 环境变量
+
+**Momentry Core API：**
+```bash
+export MOMENTRY_API_KEY=your_api_key_here
+export DATABASE_URL=postgres://user:password@localhost:5432/momentry
+```
+
+**Momentry Proxy：**
+```bash
+export MOMENTRY_API_KEY=your_api_key_here
+export MOMENTRY_DATA_DIR=/path/to/data/users
+```
+
+### 配置文件
+
+**momentry.toml (Core API)：**
+```toml
+[server]
+host = "0.0.0.0"
+port = 3002
+
+[database]
+url = "postgres://user:password@localhost:5432/momentry"
+
+[face_settings]
+min_confidence = 0.5
+min_bbox_size = 80
+```
+
+---
+
+## 🔧 部署指南
+
+### 1. 启动 Core API
+
+```bash
+./momentry-core server --host 0.0.0.0 --port 3002
+```
+
+### 2. 启动 Proxy（如果需要独立部署）
+
+```bash
+./momentry-proxy
+```
+
+### 3. 启动 Tauri 应用
+
+- 双击 "Momentry Studio.app" 启动
+- 或从终端运行：`open "Momentry Studio.app"`
+
+---
+
+## 📊 服务架构
+
+```
+┌─────────────────────────────────────────┐
+│      Momentry Studio (Tauri App)        │
+│  ┌─────────────┐    ┌────────────────┐ │
+│  │   Frontend  │───▶│   Proxy (Rust) │ │
+│  │   (Vue 3)   │    │   Port 8888    │ │
+│  └─────────────┘    └────────────────┘ │
+└─────────────────────────────────────────┘
+                          │
+                          ▼
+          ┌───────────────────────────┐
+          │   Momentry Core API       │
+          │   Port 3002               │
+          │   - Files                 │
+          │   - Faces                 │
+          │   - Search                │
+          └───────────────────────────┘
+                          │
+          ┌───────────────┴───────────────┐
+          ▼                               ▼
+    ┌──────────┐                   ┌──────────┐
+    │PostgreSQL│                   │  Qdrant  │
+    │ Port 5432│                   │Port 6333 │
+    └──────────┘                   └──────────┘
+```
+
+---
+
+## 🎯 已知问题
+
+1. **批量 Deep Scan 队列**
+   - 当前前端临时实现，未来需要后端队列支持
+   - 参考：`docs/DEEP_SCAN_QUEUE_FEATURE_REQUEST.md`
+
+2. **System Stats Validation**
+   - 已暂时禁用，待后续修复
+
+---
+
+## 📝 版本历史
+
+**v0.1.0 (2026-10-08)**
+- 初始正式发布版本
+- 包含所有核心功能
+- 批量操作增强
+- Face Filter 自动保存
+- 多项 Bug 修复
+
+---
+
+## 🛠️ 技术栈
+
+- **Frontend**: Vue 3 + TypeScript + Vite
+- **Desktop**: Tauri 2 (Rust backend)
+- **Backend**: Rust (Axum, SQLx)
+- **Database**: PostgreSQL 14+
+- **Search Engine**: Qdrant
+- **Build**: Cargo + npm
+
+---
+
+## 📞 支持联系
+
+- **技术支持**: tech@momentry.ai
+- **Bug 报告**: https://github.com/momentry/studio/issues
+- **文档**: https://docs.momentry.ai
+
+---
+
+## 📜 许可证
+
+Proprietary Software - All Rights Reserved
+

release/VERSION.json

@@ -0,0 +1,46 @@
+{
+  "version": "0.1.0",
+  "build_date": "2026-10-08",
+  "build_type": "release",
+  "platform": "macos-aarch64",
+  "git_commit": "8e71996",
+  "components": {
+    "studio_app": {
+      "name": "Momentry Studio.app",
+      "version": "0.1.0",
+      "size": "28MB"
+    },
+    "dmg": {
+      "name": "Momentry Studio_0.1.0_aarch64.dmg",
+      "size": "9.4MB"
+    },
+    "core_api": {
+      "name": "momentry-core",
+      "version": "1.0.0",
+      "size": "44MB"
+    },
+    "proxy": {
+      "name": "momentry-proxy",
+      "version": "0.1.0",
+      "size": "7.6MB"
+    }
+  },
+  "features": [
+    "batch_deep_scan",
+    "batch_unregister",
+    "face_filter_autosave",
+    "markbase_health_check_fix",
+    "fs_name_uniqueness_fix"
+  ],
+  "requirements": {
+    "macos": "12.0+",
+    "architecture": "arm64",
+    "ram": "4GB minimum",
+    "dependencies": [
+      "PostgreSQL 14+",
+      "Qdrant 1.7+",
+      "MarkBase Core API 2.3+",
+      "MarkBase Engine 1.0+"
+    ]
+  }
+}

release/install.sh

@@ -0,0 +1,107 @@
+#!/bin/bash
+
+# Momentry Studio v0.1.0 Installation Script
+# Usage: ./install.sh
+
+set -e
+
+echo "========================================="
+echo "  Momentry Studio v0.1.0 Installation  "
+echo "========================================="
+echo ""
+
+# 检查操作系统
+if [[ "$(uname)" != "Darwin" ]]; then
+    echo "❌ Error: This script only supports macOS"
+    exit 1
+fi
+
+# 检查架构
+ARCH=$(uname -m)
+if [[ "$ARCH" != "arm64" ]]; then
+    echo "⚠️  Warning: This build is optimized for Apple Silicon (arm64)"
+    echo "   Current architecture: $ARCH"
+    echo "   Some features may not work correctly."
+fi
+
+# 设置安装目录
+INSTALL_DIR="${INSTALL_DIR:-/Applications}"
+BIN_DIR="${BIN_DIR:-/usr/local/bin}"
+
+echo "📋 Installation Settings:"
+echo "   App Location: $INSTALL_DIR/Momentry Studio.app"
+echo "   Binary Location: $BIN_DIR"
+echo ""
+
+# 询问确认
+read -p "Continue with installation? (y/n) " -n 1 -r
+echo
+if [[ ! $REPLY =~ ^[Yy]$ ]]; then
+    echo "Installation cancelled."
+    exit 1
+fi
+
+# 检查 .app 是否存在
+if [[ ! -d "Momentry Studio.app" ]]; then
+    echo "❌ Error: Momentry Studio.app not found in current directory"
+    echo "   Please run this script from the release directory"
+    exit 1
+fi
+
+# 安装 .app
+echo ""
+echo "📦 Installing Momentry Studio.app..."
+cp -r "Momentry Studio.app" "$INSTALL_DIR/"
+echo "✅ App installed to $INSTALL_DIR/Momentry Studio.app"
+
+# 安装 binary（可选）
+if [[ -f "momentry-core" ]] && [[ -f "momentry-proxy" ]]; then
+    echo ""
+    read -p "Install backend binaries to $BIN_DIR? (y/n) " -n 1 -r
+    echo
+    if [[ $REPLY =~ ^[Yy]$ ]]; then
+        echo "📦 Installing binaries..."
+        sudo cp momentry-core "$BIN_DIR/"
+        sudo cp momentry-proxy "$BIN_DIR/"
+        sudo chmod +x "$BIN_DIR/momentry-core"
+        sudo chmod +x "$BIN_DIR/momentry-proxy"
+        echo "✅ Binaries installed to $BIN_DIR"
+    fi
+fi
+
+# 创建配置示例
+echo ""
+echo "📝 Creating example configuration..."
+mkdir -p ~/.momentry
+cat > ~/.momentry/momentry.toml << 'TOML'
+# Momentry Studio Configuration Example
+
+[server]
+host = "0.0.0.0"
+port = 3002
+
+[database]
+url = "postgres://user:password@localhost:5432/momentry"
+
+[face_settings]
+min_confidence = 0.5
+min_bbox_size = 80
+TOML
+echo "✅ Configuration example created at ~/.momentry/momentry.toml"
+
+# 完成
+echo ""
+echo "========================================="
+echo "  ✅ Installation Complete!             "
+echo "========================================="
+echo ""
+echo "🚀 Next Steps:"
+echo "   1. Configure database connection in ~/.momentry/momentry.toml"
+echo "   2. Set environment variable: export MOMENTRY_API_KEY=your_key"
+echo "   3. Start Core API: momentry-core server"
+echo "   4. Launch Studio: open \"$INSTALL_DIR/Momentry Studio.app\""
+echo ""
+echo "📖 Documentation: See RELEASE_NOTES.md"
+echo "📞 Support: tech@momentry.ai"
+echo ""
+

setup-gitea-ci.sh

@@ -0,0 +1,73 @@
+#!/bin/bash
+set -e
+
+GITEA_URL="http://localhost:3000"
+REPO_NAME="momentry_studio"
+
+echo "========================================="
+echo "  設定 Gitea CI/CD"
+echo "========================================="
+
+# 檢查 Token
+if [ -z "$LOCAL_GITEA_TOKEN" ]; then
+    echo "❌ 請先設定 LOCAL_GITEA_TOKEN"
+    echo "   export LOCAL_GITEA_TOKEN=\"your-token\""
+    exit 1
+fi
+
+echo "✅ Token 已設定"
+
+# 1. 建立倉庫
+echo ""
+echo "📁 Step 1: 建立 Gitea 倉庫..."
+REPO_EXISTS=$(curl -s -H "Authorization: token $LOCAL_GITEA_TOKEN" "$GITEA_URL/api/v1/repos/admin/$REPO_NAME" 2>/dev/null | python3 -c "import sys,json; d=json.load(sys.stdin); print(d.get('id',''))" 2>/dev/null || echo "")
+
+if [ -z "$REPO_EXISTS" ]; then
+    curl -s -X POST "$GITEA_URL/api/v1/user/repos" \
+        -H "Authorization: token $LOCAL_GITEA_TOKEN" \
+        -H "Content-Type: application/json" \
+        -d "{\"name\":\"$REPO_NAME\",\"private\":false,\"auto_init\":false}"
+    echo "✅ 倉庫已建立"
+else
+    echo "倉庫已存在"
+fi
+
+# 2. 設定 Git 遠端
+echo ""
+echo "🔗 Step 2: 設定 Git 遠端..."
+git remote remove gitea 2>/dev/null || true
+git remote add gitea "$GITEA_URL/admin/$REPO_NAME.git"
+echo "✅ 遠端已設定"
+
+# 3. 推送程式碼
+echo ""
+echo "📤 Step 3: 推送程式碼..."
+git push -u gitea main -f 2>&1 | tail -3
+echo "✅ 程式碼已推送"
+
+# 4. 建立 Webhook
+echo ""
+echo "🔔 Step 4: 建立 Webhook..."
+curl -s -X POST "$GITEA_URL/api/v1/repos/admin/$REPO_NAME/hooks" \
+    -H "Authorization: token $LOCAL_GITEA_TOKEN" \
+    -H "Content-Type: application/json" \
+    -d "{
+        \"type\": \"gitea\",
+        \"active\": true,
+        \"config\": {
+            \"content_type\": \"json\",
+            \"url\": \"http://localhost:8080/webhook\",
+            \"is_insecure_ssl\": false
+        },
+        \"events\": [\"push\"]
+    }" 2>/dev/null | python3 -c "import sys,json; d=json.load(sys.stdin); print(f'Webhook ID: {d.get(\"id\",\"?\")}' 2>/dev/null || echo 'Webhook 建立失敗')" || echo "Webhook 需要 CI Server"
+
+echo ""
+echo "========================================="
+echo "  ✅ Gitea CI/CD 設定完成"
+echo "========================================="
+echo ""
+echo "倉庫網址: $GITEA_URL/admin/$REPO_NAME"
+echo ""
+echo "手動觸發 CI/CD:"
+echo "  ./ci-cd.sh"

src-tauri/Cargo.lock

@@ -3509,6 +3509,15 @@ dependencies = [
  "serde_json",
 ]
 
+[[package]]
+name = "kamadak-exif"
+version = "0.6.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1130d80c7374efad55a117d715a3af9368f0fa7a2c54573afc15a188cd984837"
+dependencies = [
+ "mutate_once",
+]
+
 [[package]]
 name = "keccak"
 version = "0.2.0"
@@ -3581,9 +3590,9 @@ dependencies = [
 
 [[package]]
 name = "libc"
-version = "0.2.186"
+version = "0.2.189"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "68ab91017fe16c622486840e4c83c9a37afeff978bd239b5293d61ece587de66"
+checksum = "3eaf3ede3fee6db1a4c2ee091bf8a8b4dccdc6d17f656fb07896ee72867612f2"
 
 [[package]]
 name = "libdbus-sys"
@@ -3704,6 +3713,15 @@ dependencies = [
  "hashbrown 0.16.1",
 ]
 
+[[package]]
+name = "lz4_flex"
+version = "0.11.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "373f5eceeeab7925e0c1098212f2fbc4d416adec9d35051a6ab251e824c1854a"
+dependencies = [
+ "twox-hash",
+]
+
 [[package]]
 name = "lz4_flex"
 version = "0.13.1"
@@ -3713,6 +3731,18 @@ dependencies = [
  "twox-hash",
 ]
 
+[[package]]
+name = "macmon"
+version = "0.8.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5df04a421e292536cc4dde4c1b0d783084d7aed8e7151aacc9aadee629473556"
+dependencies = [
+ "core-foundation 0.10.1",
+ "libc",
+ "serde",
+ "serde_json",
+]
+
 [[package]]
 name = "markbase-core"
 version = "0.2.0"
@@ -3747,6 +3777,7 @@ dependencies = [
  "http 1.4.2",
  "lazy_static",
  "log",
+ "lz4_flex 0.11.6",
  "md5 0.8.0",
  "nix 0.29.0",
  "once_cell",
@@ -3768,18 +3799,21 @@ dependencies = [
  "smb2",
  "ssh-key",
  "ssh2",
+ "sysinfo",
  "tar",
  "tempfile",
  "tokio",
  "tokio-postgres",
  "tokio-util",
  "toml 0.8.2",
+ "tower-http 0.5.2",
  "tracing",
  "tracing-subscriber",
  "ureq",
  "url",
  "uuid",
  "x25519-dalek",
+ "xattr",
  "xmltree",
  "zip",
  "zstd 0.13.3",
@@ -3933,14 +3967,18 @@ dependencies = [
 name = "momentry-studio"
 version = "0.1.0"
 dependencies = [
+ "argon2 0.5.3",
  "axum",
  "base64 0.22.1",
  "chrono",
  "dirs 5.0.1",
  "futures",
  "image",
+ "kamadak-exif",
  "lru 0.12.5",
+ "macmon",
  "markbase-core",
+ "rand 0.8.6",
  "reqwest 0.11.27",
  "rusqlite",
  "serde",
@@ -3992,6 +4030,12 @@ dependencies = [
  "version_check",
 ]
 
+[[package]]
+name = "mutate_once"
+version = "0.1.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "13d2233c9842d08cfe13f9eac96e207ca6a2ea10b80259ebe8ad0268be27d2af"
+
 [[package]]
 name = "native-tls"
 version = "0.2.18"
@@ -4063,6 +4107,15 @@ dependencies = [
  "libc",
 ]
 
+[[package]]
+name = "ntapi"
+version = "0.4.3"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "c3b335231dfd352ffb0f8017f3b6027a4917f7df785ea2143d8af2adc66980ae"
+dependencies = [
+ "winapi",
+]
+
 [[package]]
 name = "nu-ansi-term"
 version = "0.50.3"
@@ -6102,9 +6155,9 @@ dependencies = [
 
 [[package]]
 name = "serde"
-version = "1.0.228"
+version = "1.0.229"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9a8e94ea7f378bd32cbbd37198a4a91436180c5bb472411e48b5ec2e2124ae9e"
+checksum = "4148590afebada386688f18773da617792bf2ef03ffc1e4cbd2b1d45b023e0ba"
 dependencies = [
  "serde_core",
  "serde_derive",
@@ -6134,22 +6187,22 @@ dependencies = [
 
 [[package]]
 name = "serde_core"
-version = "1.0.228"
+version = "1.0.229"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "41d385c7d4ca58e59fc732af25c3983b67ac852c1a25000afe1175de458b67ad"
+checksum = "67dca2c9c51e58a4791a4b1ed58308b39c64224d349a935ab5039aa360942a48"
 dependencies = [
  "serde_derive",
 ]
 
 [[package]]
 name = "serde_derive"
-version = "1.0.228"
+version = "1.0.229"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d540f220d3187173da220f885ab66608367b6574e925011a9353e4badda91d79"
+checksum = "e7a5d71263a5a7d47b41f6b3f06ba276f10cc18b0931f1799f710578e2309348"
 dependencies = [
  "proc-macro2",
  "quote",
- "syn 2.0.117",
+ "syn 3.0.4",
 ]
 
 [[package]]
@@ -6165,9 +6218,9 @@ dependencies = [
 
 [[package]]
 name = "serde_json"
-version = "1.0.150"
+version = "1.0.151"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e8014e44b4736ed0538adeecded0fce2a272f22dc9578a7eb6b2d9993c74cfb9"
+checksum = "c841b55ecdae098c80dcae9cf767f6f8a0c2cdb3416bbef72181df4d0fe73f14"
 dependencies = [
  "itoa",
  "memchr",
@@ -6509,7 +6562,7 @@ dependencies = [
  "getrandom 0.4.2",
  "hmac 0.13.0",
  "log",
- "lz4_flex",
+ "lz4_flex 0.13.1",
  "md-5 0.11.0",
  "md4",
  "num_enum",
@@ -7001,6 +7054,17 @@ dependencies = [
  "unicode-ident",
 ]
 
+[[package]]
+name = "syn"
+version = "3.0.4"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e6275cddf4610d1775e6d1fe9469b2e77d0f39fd98fb7450901b821e0c53649f"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "unicode-ident",
+]
+
 [[package]]
 name = "sync_wrapper"
 version = "0.1.2"
@@ -7027,6 +7091,20 @@ dependencies = [
  "syn 2.0.117",
 ]
 
+[[package]]
+name = "sysinfo"
+version = "0.32.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "4c33cd241af0f2e9e3b5c32163b873b29956890b5342e6745b917ce9d490f4af"
+dependencies = [
+ "core-foundation-sys",
+ "libc",
+ "memchr",
+ "ntapi",
+ "rayon",
+ "windows 0.57.0",
+]
+
 [[package]]
 name = "system-configuration"
 version = "0.5.1"
@@ -8530,6 +8608,16 @@ dependencies = [
  "windows-version",
 ]
 
+[[package]]
+name = "windows"
+version = "0.57.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "12342cb4d8e3b046f3d80effd474a7a02447231330ef77d71daa6fbc40681143"
+dependencies = [
+ "windows-core 0.57.0",
+ "windows-targets 0.52.6",
+]
+
 [[package]]
 name = "windows"
 version = "0.58.0"
@@ -8583,6 +8671,18 @@ dependencies = [
  "windows-core 0.62.2",
 ]
 
+[[package]]
+name = "windows-core"
+version = "0.57.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d2ed2439a290666cd67ecce2b0ffaad89c2a56b976b736e6ece670297897832d"
+dependencies = [
+ "windows-implement 0.57.0",
+ "windows-interface 0.57.0",
+ "windows-result 0.1.2",
+ "windows-targets 0.52.6",
+]
+
 [[package]]
 name = "windows-core"
 version = "0.58.0"
@@ -8644,6 +8744,17 @@ dependencies = [
  "windows-threading 0.2.1",
 ]
 
+[[package]]
+name = "windows-implement"
+version = "0.57.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9107ddc059d5b6fbfbffdfa7a7fe3e22a226def0b2608f72e9d552763d3e1ad7"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn 2.0.117",
+]
+
 [[package]]
 name = "windows-implement"
 version = "0.58.0"
@@ -8666,6 +8777,17 @@ dependencies = [
  "syn 2.0.117",
 ]
 
+[[package]]
+name = "windows-interface"
+version = "0.57.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "29bee4b38ea3cde66011baa44dba677c432a78593e202392d1e9070cf2a7fca7"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn 2.0.117",
+]
+
 [[package]]
 name = "windows-interface"
 version = "0.58.0"
@@ -8720,6 +8842,15 @@ dependencies = [
  "windows-link 0.2.1",
 ]
 
+[[package]]
+name = "windows-result"
+version = "0.1.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5e383302e8ec8515204254685643de10811af0ed97ea37210dc26fb0032647f8"
+dependencies = [
+ "windows-targets 0.52.6",
+]
+
 [[package]]
 name = "windows-result"
 version = "0.2.0"

src-tauri/Cargo.toml

@@ -30,14 +30,20 @@ base64 = "0.22"
 lru = "0.12"
 futures = "0.3"
 image = { version = "0.24", default-features = false, features = ["jpeg"] }
+kamadak-exif = "0.6"
 axum = "0.7"
 tower-http = { version = "0.5", features = ["cors", "fs"] }
 rusqlite = { version = "0.32", features = ["bundled"] }
 chrono = { version = "0.4", features = ["serde"] }
 uuid = { version = "1", features = ["v4"] }
+argon2 = "0.5"
+rand = "0.8"
 # MarkBase Core for Admin/Client GUI
 markbase-core = { path = "../../markbase/markbase-core" }
 
+[target.'cfg(target_arch = "aarch64")'.dependencies]
+macmon = { version = "0.8", default-features = false }
+
 [build-dependencies]
 tauri-build = { version = "2", features = [] }
 

src-tauri/src/bin/proxy.rs

@@ -1,11 +1,13 @@
-// Standalone proxy binary for testing/development
-// Re-exports the proxy module from main crate
+#[path = "../proxy.rs"]
+mod proxy;
 
-fn main() {
-    // We can't import from the main crate as a library easily,
-    // so instead we'll just call through the Tauri binary mechanism.
-    // For now, the full Tauri binary must be used to run the proxy.
-    eprintln!("Use `cargo tauri dev` to start the full application with proxy.");
-    eprintln!("For standalone proxy testing, the proxy runs as part of the Tauri binary.");
-    std::process::exit(1);
+#[path = "../db.rs"]
+mod db;
+
+pub use proxy::SystemStatsResponse;
+
+#[tokio::main]
+async fn main() {
+    let _ = db::init_db();
+    proxy::start_proxy_server().await;
 }

src-tauri/src/db.rs

@@ -2,6 +2,8 @@ use rusqlite::Connection;
 use serde::{Deserialize, Serialize};
 use std::path::PathBuf;
 use std::sync::Mutex;
+use argon2::{self, Algorithm, Argon2, Params, PasswordHash, PasswordHasher, PasswordVerifier, Version};
+use argon2::password_hash::{SaltString, rand_core::OsRng};
 
 const APP_TABLES: &str = "
 CREATE TABLE IF NOT EXISTS search_history (
@@ -22,9 +24,20 @@ CREATE TABLE IF NOT EXISTS bookmarks (
     created_at TEXT DEFAULT (datetime('now'))
 );
 
+CREATE TABLE IF NOT EXISTS video_marks (
+    id INTEGER PRIMARY KEY AUTOINCREMENT,
+    file_uuid TEXT NOT NULL,
+    tag TEXT NOT NULL,
+    start_frame INTEGER NOT NULL,
+    end_frame INTEGER,
+    note TEXT,
+    created_at TEXT DEFAULT (datetime('now'))
+);
+
 CREATE TABLE IF NOT EXISTS app_users (
     id TEXT PRIMARY KEY,
     username TEXT NOT NULL UNIQUE,
+    password_hash TEXT,
     display_name TEXT,
     role TEXT DEFAULT 'user',
     created_at TEXT DEFAULT (datetime('now')),
@@ -33,6 +46,7 @@ CREATE TABLE IF NOT EXISTS app_users (
 
 CREATE INDEX IF NOT EXISTS idx_search_history_sort ON search_history(pinned DESC, updated_at DESC);
 CREATE INDEX IF NOT EXISTS idx_bookmarks_created ON bookmarks(created_at DESC);
+CREATE INDEX IF NOT EXISTS idx_video_marks_file ON video_marks(file_uuid);
 ";
 
 static DB_CONN: Mutex<Option<Connection>> = Mutex::new(None);
@@ -49,19 +63,27 @@ pub fn init_db() -> Result<(), String> {
     conn.execute_batch("PRAGMA journal_mode=WAL;").map_err(|e| format!("WAL mode error: {}", e))?;
     conn.execute_batch(APP_TABLES).map_err(|e| format!("Failed to create tables: {}", e))?;
 
+    // Add password_hash column if not exists (migration)
+    conn.execute("ALTER TABLE app_users ADD COLUMN password_hash TEXT", []).ok();
+
     let default_id = "demo";
     let default_user = "demo";
-    let count: i64 = conn
+    let default_password = "demo123";
+    
+    // Check if demo user exists and has password
+    let password_hash: Option<String> = conn
         .query_row(
-            "SELECT COUNT(*) FROM app_users WHERE id = ?1",
+            "SELECT password_hash FROM app_users WHERE id = ?1",
             [default_id],
             |row| row.get(0),
         )
-        .unwrap_or(0);
-    if count == 0 {
+        .unwrap_or(None);
+
+    if password_hash.is_none() || password_hash.as_ref().map_or(true, |h| h.is_empty()) {
+        let password_hash = hash_password(default_password);
         conn.execute(
-            "INSERT OR IGNORE INTO app_users (id, username, display_name, role) VALUES (?1, ?2, ?3, 'admin')",
-            rusqlite::params![default_id, default_user, "Demo User"],
+            "INSERT OR REPLACE INTO app_users (id, username, password_hash, display_name, role) VALUES (?1, ?2, ?3, ?4, 'admin')",
+            rusqlite::params![default_id, default_user, password_hash, "Demo User"],
         )
         .map_err(|e| format!("Failed to insert default user: {}", e))?;
     }
@@ -98,6 +120,39 @@ pub struct BookmarkItem {
     pub created_at: Option<String>,
 }
 
+#[derive(Debug, Serialize, Deserialize, Clone)]
+pub struct User {
+    pub id: String,
+    pub username: String,
+    pub display_name: Option<String>,
+    pub role: String,
+}
+
+#[derive(Debug, Serialize, Deserialize)]
+pub struct LoginResult {
+    pub success: bool,
+    pub user: Option<User>,
+    pub token: Option<String>,
+    pub error: Option<String>,
+}
+
+fn hash_password(password: &str) -> String {
+    let salt = SaltString::generate(&mut OsRng);
+    let argon2 = Argon2::new(Algorithm::Argon2id, Version::V0x13, Params::default());
+    argon2.hash_password(password.as_bytes(), &salt).unwrap().to_string()
+}
+
+fn verify_password(hash: &str, password: &str) -> bool {
+    let parsed_hash = PasswordHash::new(hash);
+    match parsed_hash {
+        Ok(h) => {
+            let argon2 = Argon2::default();
+            argon2.verify_password(password.as_bytes(), &h).is_ok()
+        }
+        Err(_) => false,
+    }
+}
+
 #[tauri::command(rename_all = "camelCase")]
 pub fn get_search_history(limit: Option<u32>) -> Result<Vec<HistoryItem>, String> {
     let limit = limit.unwrap_or(30).min(30);
@@ -235,4 +290,127 @@ pub fn delete_bookmark(id: i64) -> Result<(), String> {
     conn.execute("DELETE FROM bookmarks WHERE id = ?1", [id])
         .map_err(|e| format!("Delete error: {}", e))?;
     Ok(())
+}
+
+#[derive(Debug, Serialize, Deserialize, Clone)]
+pub struct VideoMark {
+    pub id: i64,
+    pub file_uuid: String,
+    pub tag: String,
+    pub start_frame: i64,
+    pub end_frame: Option<i64>,
+    pub note: Option<String>,
+    pub created_at: Option<String>,
+}
+
+#[tauri::command(rename_all = "camelCase")]
+pub fn get_video_marks(file_uuid: String) -> Result<Vec<VideoMark>, String> {
+    let conn = get_conn()?;
+    let mut stmt = conn
+        .prepare("SELECT id, file_uuid, tag, start_frame, end_frame, note, created_at FROM video_marks WHERE file_uuid = ?1 ORDER BY start_frame ASC")
+        .map_err(|e| format!("Prepare error: {}", e))?;
+    let items = stmt
+        .query_map([file_uuid], |row| {
+            Ok(VideoMark {
+                id: row.get(0)?,
+                file_uuid: row.get(1)?,
+                tag: row.get(2)?,
+                start_frame: row.get(3)?,
+                end_frame: row.get(4)?,
+                note: row.get(5)?,
+                created_at: row.get(6)?,
+            })
+        })
+        .map_err(|e| format!("Query error: {}", e))?
+        .filter_map(|r| r.ok())
+        .collect();
+    Ok(items)
+}
+
+#[tauri::command(rename_all = "camelCase")]
+pub fn save_video_mark(
+    file_uuid: String,
+    tag: String,
+    start_frame: i64,
+    end_frame: Option<i64>,
+    note: Option<String>,
+) -> Result<VideoMark, String> {
+    let conn = get_conn()?;
+    conn.execute(
+        "INSERT INTO video_marks (file_uuid, tag, start_frame, end_frame, note) VALUES (?1, ?2, ?3, ?4, ?5)",
+        rusqlite::params![file_uuid, tag, start_frame, end_frame, note],
+    )
+    .map_err(|e| format!("Insert error: {}", e))?;
+    let id = conn.last_insert_rowid();
+    Ok(VideoMark {
+        id,
+        file_uuid,
+        tag,
+        start_frame,
+        end_frame,
+        note,
+        created_at: None,
+    })
+}
+
+#[tauri::command(rename_all = "camelCase")]
+pub fn delete_video_mark(id: i64) -> Result<(), String> {
+    let conn = get_conn()?;
+    conn.execute("DELETE FROM video_marks WHERE id = ?1", [id])
+        .map_err(|e| format!("Delete error: {}", e))?;
+    Ok(())
+}
+
+pub fn verify_user(username: &str, password: &str) -> Result<Option<User>, String> {
+    let conn = get_conn()?;
+    let mut stmt = conn
+        .prepare("SELECT id, username, password_hash, display_name, role FROM app_users WHERE username = ?1")
+        .map_err(|e| format!("Prepare error: {}", e))?;
+    
+    let result = stmt
+        .query_row([username], |row| {
+            let id: String = row.get(0)?;
+            let username: String = row.get(1)?;
+            let password_hash: Option<String> = row.get(2)?;
+            let display_name: Option<String> = row.get(3)?;
+            let role: String = row.get(4)?;
+            Ok((id, username, password_hash, display_name, role))
+        });
+
+    match result {
+        Ok((id, uname, password_hash, display_name, role)) => {
+            if let Some(hash) = password_hash {
+                if verify_password(&hash, password) {
+                    Ok(Some(User { id, username: uname, display_name, role }))
+                } else {
+                    Ok(None)
+                }
+            } else {
+                Ok(None)
+            }
+        }
+        Err(_) => Ok(None),
+    }
+}
+
+pub fn get_user_by_username(username: &str) -> Result<Option<User>, String> {
+    let conn = get_conn()?;
+    let mut stmt = conn
+        .prepare("SELECT id, username, display_name, role FROM app_users WHERE username = ?1")
+        .map_err(|e| format!("Prepare error: {}", e))?;
+    
+    let result = stmt
+        .query_row([username], |row| {
+            Ok(User {
+                id: row.get(0)?,
+                username: row.get(1)?,
+                display_name: row.get(2)?,
+                role: row.get(3)?,
+            })
+        });
+
+    match result {
+        Ok(user) => Ok(Some(user)),
+        Err(_) => Ok(None),
+    }
 }

src-tauri/src/main.rs

@@ -4,16 +4,31 @@ use dirs;
 use markbase_core::vfs::VfsBackend;
 mod proxy;
 mod db;
+mod validate;
 
 use serde::Serialize;
 use base64::{Engine as _, engine::general_purpose::STANDARD};
-use std::sync::Mutex;
+use std::collections::HashMap;
+use std::sync::{Arc, Mutex};
 use std::num::NonZeroUsize;
 use lru::LruCache;
 use image::GenericImageView;
+use tokio::sync::Semaphore;
 
 static THUMB_CACHE: Mutex<Option<LruCache<String, String>>> = Mutex::new(None);
 static PROFILE_CACHE: Mutex<Option<LruCache<String, String>>> = Mutex::new(None);
+static RAW_DIM_CACHE: Mutex<Option<HashMap<String, (u32, u32)>>> = Mutex::new(None);
+/// Per-file semaphore: only one thumbnail extraction per file at a time,
+/// preventing ffmpeg storms when many traces hit the same file concurrently.
+static THUMB_SEM_MAP: Mutex<Option<HashMap<String, Arc<Semaphore>>>> = Mutex::new(None);
+
+fn acquire_thumb_semaphore(uuid: &str) -> Arc<Semaphore> {
+    let mut map = THUMB_SEM_MAP.lock().unwrap();
+    let map = map.get_or_insert_with(HashMap::new);
+    map.entry(uuid.to_string())
+        .or_insert_with(|| Arc::new(Semaphore::new(1)))
+        .clone()
+}
 
 fn get_client() -> reqwest::Client {
     reqwest::Client::builder()
@@ -59,6 +74,8 @@ struct PersonInfo {
     status: String,
     metadata: serde_json::Value,
     file_uuids: Vec<String>,
+    source: String,
+    tmdb_id: Option<i64>,
 }
 
 #[derive(Serialize)]
@@ -91,6 +108,8 @@ struct FileDetail {
     file_name: String,
     fps: f64,
     duration: f64,
+    width: u32,
+    height: u32,
 }
 
 #[derive(Serialize)]
@@ -223,7 +242,7 @@ async fn get_files(args: GetFilesArgs) -> Result<Vec<FileInfo>, String> {
                 modified_time: f["modified_time"].as_str().unwrap_or("").to_string(),
                 is_registered: is_reg,
                 registration_time: f["registration_time"].as_str().map(|s| s.to_string()),
-                ingested: status == "completed",
+                ingested: matches!(status.as_str(), "completed" | "keyword_ready" | "semantic_ready" | "face_mgmt_ready" | "agent_ready"),
                 status,
             })
         })
@@ -355,7 +374,7 @@ async fn unregister_file(file_uuid: String, delete_output_files: Option<bool>) -
 async fn get_people(_page: usize, _per_page: usize) -> Result<Vec<PersonInfo>, String> {
     eprintln!("[get_people] called");
     let mut people = Vec::new();
-    for page in 1u32..=2 {
+    for page in 1u32..=10 {
         let url = format!("{}/api/v1/identities?api_key={}&page={}&per_page=100", CORE_API, API_KEY, page);
         let resp = match get_client().get(&url).send().await {
             Ok(r) => r,
@@ -398,6 +417,8 @@ async fn get_people(_page: usize, _per_page: usize) -> Result<Vec<PersonInfo>, S
                 status: i["status"].as_str().unwrap_or_else(|| i["metadata"]["status"].as_str().unwrap_or("pending")).to_string(),
                 metadata: i["metadata"].clone(),
                 file_uuids: i["file_uuids"].as_array().map(|arr| arr.iter().filter_map(|v| v.as_str().map(String::from)).collect()).unwrap_or_default(),
+                source: i["source"].as_str().unwrap_or("").to_string(),
+                tmdb_id: i["tmdb_id"].as_i64(),
             });
         }
     }
@@ -499,9 +520,12 @@ async fn get_traces(uuid: String, per_page: usize, page: Option<u32>) -> Result<
 }
 
 #[tauri::command(rename_all = "camelCase")]
-async fn get_unassigned_traces(page: usize, per_page: usize) -> Result<serde_json::Value, String> {
+async fn get_unassigned_traces(page: usize, per_page: usize, file_uuid: Option<String>) -> Result<serde_json::Value, String> {
     let page_size = per_page.min(100);
-    let url = format!("{}/api/v1/traces/unassigned?api_key={}&page={}&page_size={}", CORE_API, API_KEY, page, page_size);
+    let mut url = format!("{}/api/v1/traces/unassigned?api_key={}&page={}&page_size={}", CORE_API, API_KEY, page, page_size);
+    if let Some(ref uuid) = file_uuid {
+        url.push_str(&format!("&file_uuid={}", uuid));
+    }
     let resp = get_client().get(&url).send().await
         .map_err(|e| format!("Unassigned traces request failed: {}", e))?;
     let json: serde_json::Value = resp.json().await
@@ -521,9 +545,42 @@ async fn get_file_info(uuid: String) -> Result<FileDetail, String> {
         file_name: json["file_name"].as_str().unwrap_or("").to_string(),
         fps: json["fps"].as_f64().unwrap_or(24.0),
         duration: json["duration"].as_f64().unwrap_or(0.0),
+        width: json["width"].as_u64().unwrap_or(0) as u32,
+        height: json["height"].as_u64().unwrap_or(0) as u32,
     })
 }
 
+/// Read EXIF orientation and physically rotate pixels, stripping orientation tag.
+/// This ensures all browsers see the same pixel dimensions regardless of EXIF handling.
+fn apply_orientation(bytes: &[u8]) -> Result<Vec<u8>, String> {
+    use std::io::{Cursor, BufReader};
+    // Read EXIF orientation tag
+    let orientation = {
+        let cursor = Cursor::new(bytes);
+        let mut reader = BufReader::new(cursor);
+        match exif::Reader::new().read_from_container(&mut reader) {
+            Ok(exif) => exif.get_field(exif::Tag::Orientation, exif::In::PRIMARY)
+                .and_then(|f| f.value.get_uint(0))
+                .unwrap_or(1),
+            Err(_) => 1,
+        }
+    };
+    let img = image::load_from_memory(bytes).map_err(|e| format!("Image decode: {}", e))?;
+    let img = match orientation {
+        2 => img.fliph(),
+        3 => img.rotate180(),
+        4 => img.fliph().rotate180(),
+        5 => img.rotate90().flipv(),
+        6 => img.rotate270(),
+        7 => img.rotate90().fliph(),
+        8 => img.rotate90(),
+        _ => img,
+    };
+    let mut buf = Cursor::new(Vec::new());
+    img.write_to(&mut buf, image::ImageFormat::Jpeg).map_err(|e| format!("JPEG encode: {}", e))?;
+    Ok(buf.into_inner())
+}
+
 #[tauri::command(rename_all = "camelCase")]
 async fn get_thumbnail(uuid: String, frame: u32) -> Result<String, String> {
     let key = format!("{}:{}", uuid, frame);
@@ -535,23 +592,8 @@ async fn get_thumbnail(uuid: String, frame: u32) -> Result<String, String> {
             }
         }
     }
-    let url = format!("{}/api/v1/file/{}/thumbnail?api_key={}&frame={}", CORE_API, uuid, API_KEY, frame);
-    let bytes = get_client().get(&url).send().await
-        .map_err(|e| format!("Thumbnail request failed: {}", e))?
-        .bytes().await
-        .map_err(|e| format!("Thumbnail read failed: {}", e))?;
-    let result = format!("data:image/jpeg;base64,{}", STANDARD.encode(&bytes));
-    {
-        let mut cache = THUMB_CACHE.lock().unwrap();
-        let cache = cache.get_or_insert_with(|| LruCache::new(NonZeroUsize::new(500).unwrap()));
-        cache.put(key, result.clone());
-    }
-    Ok(result)
-}
-
-#[tauri::command(rename_all = "camelCase")]
-async fn get_face_thumbnail(uuid: String, frame: u32, bbox_x: Option<f64>, bbox_y: Option<f64>, bbox_w: Option<f64>, bbox_h: Option<f64>) -> Result<String, String> {
-    let key = format!("face:{}:{}:{:?}:{:?}:{:?}:{:?}", uuid, frame, bbox_x, bbox_y, bbox_w, bbox_h);
+    let _permit = acquire_thumb_semaphore(&uuid).acquire_owned().await.unwrap();
+    // Double-check cache after acquiring semaphore
     {
         let mut cache = THUMB_CACHE.lock().unwrap();
         if let Some(cache) = cache.as_mut() {
@@ -565,15 +607,138 @@ async fn get_face_thumbnail(uuid: String, frame: u32, bbox_x: Option<f64>, bbox_
         .map_err(|e| format!("Thumbnail request failed: {}", e))?
         .bytes().await
         .map_err(|e| format!("Thumbnail read failed: {}", e))?;
+    let corrected = apply_orientation(&bytes)?;
+    let result = format!("data:image/jpeg;base64,{}", STANDARD.encode(&corrected));
+    {
+        let mut cache = THUMB_CACHE.lock().unwrap();
+        let cache = cache.get_or_insert_with(|| LruCache::new(NonZeroUsize::new(500).unwrap()));
+        cache.put(key, result.clone());
+    }
+    Ok(result)
+}
 
+#[tauri::command(rename_all = "camelCase")]
+async fn get_file_thumbnail_by_path(path: String, frame: u32) -> Result<String, String> {
+    if !std::path::Path::new(&path).exists() {
+        return Err("File not found".into());
+    }
+
+    let ext = path.rsplit('.').next().unwrap_or("").to_lowercase();
+    let is_image = matches!(ext.as_str(), "jpg" | "jpeg" | "png" | "gif" | "webp");
+
+    if is_image {
+        let bytes = std::fs::read(&path).map_err(|e| format!("Read failed: {}", e))?;
+        let mime = match ext.as_str() {
+            "png" => "image/png",
+            "gif" => "image/gif",
+            "webp" => "image/webp",
+            _ => "image/jpeg",
+        };
+        Ok(format!("data:{};base64,{}", mime, STANDARD.encode(&bytes)))
+    } else {
+        let time_sec = frame as f64 / 24.0;
+        let output = tokio::process::Command::new("ffmpeg")
+            .args([
+                "-ss", &time_sec.to_string(),
+                "-i", &path,
+                "-vframes", "1",
+                "-q:v", "2",
+                "-f", "mjpeg",
+                "-"
+            ])
+            .output()
+            .await
+            .map_err(|e| format!("ffmpeg failed: {}", e))?;
+
+        if output.status.success() {
+            Ok(format!("data:image/jpeg;base64,{}", STANDARD.encode(&output.stdout)))
+        } else {
+            Err("Thumbnail extraction failed".into())
+        }
+    }
+}
+
+/// Fetch raw video dimensions from Core API with in-memory cache.
+/// Returns `None` if the request fails or dimensions are 0.
+async fn fetch_raw_dimensions(uuid: &str) -> Option<(u32, u32)> {
+    {
+        let cache = RAW_DIM_CACHE.lock().unwrap();
+        if let Some(cache) = cache.as_ref() {
+            if let Some(dims) = cache.get(uuid) {
+                return Some(*dims);
+            }
+        }
+    }
+    let url = format!("{}/api/v1/file/{}?api_key={}", CORE_API, uuid, API_KEY);
+    let result = get_client().get(&url).send().await.ok()?
+        .json::<serde_json::Value>().await.ok()?;
+    let w = result["width"].as_u64().unwrap_or(0) as u32;
+    let h = result["height"].as_u64().unwrap_or(0) as u32;
+    if w == 0 || h == 0 {
+        return None;
+    }
+    {
+        let mut cache = RAW_DIM_CACHE.lock().unwrap();
+        let cache = cache.get_or_insert_with(HashMap::new);
+        cache.insert(uuid.to_string(), (w, h));
+    }
+    Some((w, h))
+}
+
+#[tauri::command(rename_all = "camelCase")]
+async fn get_face_thumbnail(uuid: String, frame: u32, bbox_x: Option<f64>, bbox_y: Option<f64>, bbox_w: Option<f64>, bbox_h: Option<f64>) -> Result<String, String> {
+    let key = format!("face:{}:{}:{:?}:{:?}:{:?}:{:?}", uuid, frame, bbox_x, bbox_y, bbox_w, bbox_h);
+    {
+        let mut cache = THUMB_CACHE.lock().unwrap();
+        if let Some(cache) = cache.as_mut() {
+            if let Some(cached) = cache.get(&key) {
+                return Ok(cached.clone());
+            }
+        }
+    }
+    let _permit = acquire_thumb_semaphore(&uuid).acquire_owned().await.unwrap();
+    // Double-check cache after acquiring semaphore
+    {
+        let mut cache = THUMB_CACHE.lock().unwrap();
+        if let Some(cache) = cache.as_mut() {
+            if let Some(cached) = cache.get(&key) {
+                return Ok(cached.clone());
+            }
+        }
+    }
+    let url = format!("{}/api/v1/file/{}/thumbnail?api_key={}&frame={}", CORE_API, uuid, API_KEY, frame);
+    let bytes = get_client().get(&url).send().await
+        .map_err(|e| format!("Thumbnail request failed: {}", e))?
+        .bytes().await
+        .map_err(|e| format!("Thumbnail read failed: {}", e))?;
     let result = if let (Some(bx), Some(by), Some(bw), Some(bh)) = (bbox_x, bbox_y, bbox_w, bbox_h) {
         let img = image::load_from_memory(&bytes).map_err(|e| format!("Image decode failed: {}", e))?;
         let (w, h) = img.dimensions();
+        // Determine if CCW rotation is needed by comparing raw video dimensions
+        // against thumbnail dimensions. If raw != thumb, Core API rotated the frame
+        // and bbox is in raw space. Fall back to aspect ratio if raw dims unavailable.
+        let raw_dims = fetch_raw_dimensions(&uuid).await;
+        let needs_ccw = match raw_dims {
+            Some((rw, rh)) => (rw, rh) != (w, h),
+            None => w < h && (w as f64) / (h as f64) < 0.62,
+        };
+        let (bx, by, bw, bh) = if !(bx <= 1.0 && by <= 1.0 && bw <= 1.0 && bh <= 1.0) && needs_ccw {
+            let _rw = h as f64;
+            let rh = w as f64;
+            (rh - by - bh, bx, bh, bw)
+        } else {
+            (bx, by, bw, bh)
+        };
         let (px, py, pw, ph) = if bx <= 1.0 && by <= 1.0 && bw <= 1.0 && bh <= 1.0 {
             ((bx * w as f64) as u32, (by * h as f64) as u32, (bw * w as f64) as u32, (bh * h as f64) as u32)
         } else {
             (bx as u32, by as u32, bw as u32, bh as u32)
         };
+        eprintln!("[get_face_thumbnail] {} frame={} img={}x{} bbox={},{},{},{} -> pixel={},{},{},{} crop={},{},{},{}",
+            uuid, frame, w, h, bx, by, bw, bh, px, py, pw, ph,
+            px.min(w.saturating_sub(1)), py.min(h.saturating_sub(1)),
+            pw.min(w.saturating_sub(px.min(w.saturating_sub(1)))).max(1),
+            ph.min(h.saturating_sub(py.min(h.saturating_sub(1)))).max(1));
         let cx = px.min(w.saturating_sub(1));
         let cy = py.min(h.saturating_sub(1));
         let cw = pw.min(w.saturating_sub(cx)).max(1);
@@ -594,13 +759,6 @@ async fn get_face_thumbnail(uuid: String, frame: u32, bbox_x: Option<f64>, bbox_
     Ok(result)
 }
 
-const PROFILE_DIRS: &[&str] = &[
-    "/Users/accusys/momentry/output/identities",
-    "/Users/accusys/momentry/output_dev/identities",
-    "/Volumes/external/momentry/output/identities",
-    "/Volumes/external/momentry/output_dev/identities",
-];
-
 #[tauri::command(rename_all = "camelCase")]
 async fn get_identity_profile(uuid: String) -> Result<String, String> {
     let uuid_display = uuid.clone();
@@ -616,13 +774,13 @@ async fn get_identity_profile(uuid: String) -> Result<String, String> {
     }
     let t = std::time::Instant::now();
     let result = (|| -> Option<String> {
-        for dir in PROFILE_DIRS {
-            for candidate in [&no_dash, &uuid_display] {
-                let path = format!("{}/{}/profile.jpg", dir, candidate);
-                if std::path::Path::new(&path).exists() {
-                    let bytes = std::fs::read(&path).ok()?;
-                    return Some(format!("data:image/jpeg;base64,{}", STANDARD.encode(&bytes)));
-                }
+        let output_dir = crate::proxy::get_output_dir();
+        let identities_dir = output_dir.join("identities");
+        for candidate in [&no_dash, &uuid_display] {
+            let path = identities_dir.join(candidate).join("profile.jpg");
+            if path.exists() {
+                let bytes = std::fs::read(&path).ok()?;
+                return Some(format!("data:image/jpeg;base64,{}", STANDARD.encode(&bytes)));
             }
         }
         None
@@ -834,14 +992,17 @@ struct CreateIdentityFromFaceResult {
 }
 
 #[tauri::command(rename_all = "camelCase")]
-async fn create_identity_from_face(name: String, _face_id: Option<String>, _face_row_id: Option<i64>, file_uuid: String) -> Result<CreateIdentityFromFaceResult, String> {
+async fn create_identity_from_face(name: String, _face_id: Option<String>, _face_row_id: Option<i64>, file_uuid: String, trace_ids: Option<Vec<i64>>) -> Result<CreateIdentityFromFaceResult, String> {
     let client = get_client();
     
     // Use POST /api/v1/file/:file_uuid/pending-person to create pending identity
     let url = format!("{}/api/v1/file/{}/pending-person?api_key={}", CORE_API, file_uuid, API_KEY);
-    let body = serde_json::json!({
+    let mut body = serde_json::json!({
         "name": name
     });
+    if let Some(tids) = &trace_ids {
+        body["trace_ids"] = serde_json::json!(tids);
+    }
     
     let resp = client.post(&url)
         .json(&body)
@@ -1124,48 +1285,152 @@ async fn merge_history(source_uuid: Option<String>, target_uuid: Option<String>,
 }
 
 
+// === Service Management ===
+
+#[tauri::command(rename_all = "camelCase")]
+async fn stop_service(name: String) -> Result<String, String> {
+    if name == "Worker" || name == "worker" {
+        // Worker has no port — stop via pidfile / pkill
+        let output = std::process::Command::new("sh")
+            .arg("-c")
+            .arg("sleep 0.5; WPID=$(cat /Users/accusys/momentry_core/logs/worker_3002.pid 2>/dev/null); if [ -n \"$WPID\" ]; then pkill -P $WPID 2>/dev/null; kill -9 $WPID 2>/dev/null; fi; pkill -9 -f 'target/release/momentry worker' 2>/dev/null; rm -f /Users/accusys/momentry_core/logs/worker_3002.pid; echo 'stopped'")
+            .output()
+            .map_err(|e| format!("Failed to stop worker: {}", e))?;
+        let stdout = String::from_utf8_lossy(&output.stdout).to_string();
+        return Ok(stdout.trim().to_string());
+    }
+    let port = match name.as_str() {
+        "Core API" | "core" => 3002,
+        "MarkBase" | "markbase" => 11438,
+        "Proxy" | "proxy" => 8888,
+        "MarkBaseEngine" | "mbe" => 8080,
+        "SFTP" => 2024,
+        "SMB" => 4445,
+        _ => return Err(format!("Unknown service: {}", name)),
+    };
+    let output = std::process::Command::new("sh")
+        .arg("-c")
+        .arg(format!("lsof -ti :{} | xargs kill -9 2>/dev/null; echo 'stopped'", port))
+        .output()
+        .map_err(|e| format!("Failed to stop service: {}", e))?;
+    let stdout = String::from_utf8_lossy(&output.stdout).to_string();
+    Ok(stdout.trim().to_string())
+}
+
+#[tauri::command(rename_all = "camelCase")]
+async fn start_service(name: String) -> Result<String, String> {
+    if name == "Worker" || name == "worker" {
+        // Worker has no port — verify via pidfile instead of lsof
+        let output = std::process::Command::new("sh")
+            .arg("-c")
+            .arg("cd /Users/accusys/momentry_core && nohup bash run-worker-3002.sh > /tmp/momentry_worker.log 2>&1 &")
+            .output()
+            .map_err(|e| format!("Failed to start worker: {}", e))?;
+        if !output.status.success() {
+            let stderr = String::from_utf8_lossy(&output.stderr);
+            return Err(format!("Worker start failed: {}", stderr));
+        }
+        tokio::time::sleep(std::time::Duration::from_secs(3)).await;
+        let check = std::process::Command::new("sh")
+            .arg("-c")
+            .arg("WPID=$(cat /Users/accusys/momentry_core/logs/worker_3002.pid 2>/dev/null); [ -n \"$WPID\" ] && kill -0 $WPID 2>/dev/null && echo alive")
+            .output()
+            .map_err(|e| format!("Worker check failed: {}", e))?;
+        if String::from_utf8_lossy(&check.stdout).contains("alive") {
+            return Ok("started".to_string());
+        }
+        return Err("Worker failed to start".to_string());
+    }
+    let cmd = match name.as_str() {
+        "MarkBase" | "markbase" => {
+            "mkdir -p /Users/accusys/markbase/data && cd /Users/accusys/markbase && nohup ./target/release/markbase-core web-start --port 11438 > /tmp/markbase_web.log 2>&1 &"
+        }
+        "Core API" | "core" => {
+            "cd /Users/accusys/momentry_core && nohup bash run-server-3002.sh > /tmp/momentry_start.log 2>&1 &"
+        }
+        "Proxy" | "proxy" => {
+            "cd /Users/accusys/momentry_studio/src-tauri && nohup ./target/debug/momentry-proxy > /tmp/momentry_proxy.log 2>&1 &"
+        }
+        "MarkBaseEngine" | "mbe" => {
+            "cd /Users/accusys/MarkBaseEngine && nohup .build/debug/MarkBaseServer > /tmp/markbase_engine.log 2>&1 &"
+        }
+        "SFTP" => {
+            "cd /Users/accusys/markbase && nohup cargo run --bin markbase-core -- ssh-start --port 2024 > /tmp/markbase_ssh.log 2>&1 &"
+        }
+        "SMB" => {
+            "cd /Users/accusys/markbase && nohup cargo run --bin markbase-core --features smb-server -- smb-start --port 4445 --share-name markbase --root /Users/accusys/momentry/var/sftpgo/data --user demo:demo123 > /tmp/markbase_smb.log 2>&1 &"
+        }
+        _ => return Err(format!("Unknown service: {}", name)),
+    };
+    let output = std::process::Command::new("sh")
+        .arg("-c")
+        .arg(cmd)
+        .output()
+        .map_err(|e| format!("Failed to start service: {}", e))?;
+    if !output.status.success() {
+        let stderr = String::from_utf8_lossy(&output.stderr);
+        return Err(format!("Start failed: {}", stderr));
+    }
+    let port = match name.as_str() {
+        "MarkBase" | "markbase" => 11438,
+        "Core API" | "core" => 3002,
+        "Proxy" | "proxy" => 8888,
+        "MarkBaseEngine" | "mbe" => 8080,
+        "SFTP" => 2024,
+        "SMB" => 4445,
+        _ => 0,
+    };
+    if port > 0 {
+        // MarkBaseEngine takes 5-10s to load the model; skip port check
+        if port == 8080 {
+            return Ok("started".to_string());
+        }
+        // Wait a moment then check if port is up
+        tokio::time::sleep(std::time::Duration::from_secs(2)).await;
+        let check = std::process::Command::new("sh")
+            .arg("-c")
+            .arg(format!("lsof -ti :{} 2>/dev/null", port))
+            .output()
+            .map_err(|e| format!("Check failed: {}", e))?;
+        if check.stdout.is_empty() {
+            return Err(format!("Service {} failed to start on port {}", name, port));
+        }
+    }
+    Ok("started".to_string())
+}
+
 // === Admin Commands ===
 
 #[tauri::command(rename_all = "camelCase")]
-async fn list_admin_users() -> Result<serde_json::Value, String> {
-    let home = dirs::home_dir().unwrap_or_else(|| std::path::PathBuf::from("/Users/accusys"));
-    let db_path = home.join("momentry/data/auth.sqlite");
-    
-    let conn = rusqlite::Connection::open(&db_path)
-        .map_err(|e| format!("Failed to open database: {}", e))?;
-    
-    let mut stmt = conn.prepare("SELECT username, home_dir, status FROM sftpgo_users")
-        .map_err(|e| format!("Failed to prepare query: {}", e))?;
-    
-    let users = stmt.query_map([], |row| {
-        Ok(serde_json::json!({
-            "username": row.get::<_, String>(0)?,
-            "homeDir": row.get::<_, String>(1)?,
-            "status": row.get::<_, i32>(2)?
-        }))
-    }).map_err(|e| format!("Failed to query: {}", e))?;
-    
-    let result: Vec<serde_json::Value> = users.filter_map(|u| u.ok()).collect();
-    Ok(serde_json::Value::Array(result))
+async fn login_user(username: String, password: String) -> Result<db::LoginResult, String> {
+    match db::verify_user(&username, &password) {
+        Ok(Some(user)) => {
+            let token = uuid::Uuid::new_v4().to_string();
+            Ok(db::LoginResult {
+                success: true,
+                user: Some(user),
+                token: Some(token),
+                error: None,
+            })
+        }
+        Ok(None) => Ok(db::LoginResult {
+            success: false,
+            user: None,
+            token: None,
+            error: Some("Invalid username or password".to_string()),
+        }),
+        Err(e) => Ok(db::LoginResult {
+            success: false,
+            user: None,
+            token: None,
+            error: Some(e),
+        }),
+    }
 }
 
 #[tauri::command(rename_all = "camelCase")]
-async fn get_system_stats() -> Result<serde_json::Value, String> {
-    let mut stats = serde_json::Map::new();
-    stats.insert("cpu".to_string(), serde_json::Value::Number(25.into()));
-    stats.insert("memory".to_string(), serde_json::Value::Number(60.into()));
-    stats.insert("disk".to_string(), serde_json::Value::Number(45.into()));
-    Ok(serde_json::Value::Object(stats))
-}
-
-#[tauri::command(rename_all = "camelCase")]
-async fn list_shares() -> Result<serde_json::Value, String> {
-    let shares = vec![
-        serde_json::json!({"name": "SMB", "port": 4445, "status": "running"}),
-        serde_json::json!({"name": "SFTP", "port": 2024, "status": "running"}),
-        serde_json::json!({"name": "WebDAV", "port": 11438, "status": "running"}),
-    ];
-    Ok(serde_json::Value::Array(shares))
+async fn get_current_user(username: String) -> Result<Option<db::User>, String> {
+    db::get_user_by_username(&username)
 }
 
 // === Client Commands ===
@@ -1230,6 +1495,29 @@ fn main() {
         rt.block_on(proxy::start_proxy_server());
     });
 
+    fn ensure_markbase_running() {
+        let check = std::process::Command::new("sh")
+            .arg("-c")
+            .arg("lsof -ti :11438")
+            .output();
+        
+        if let Ok(output) = check {
+            if output.stdout.is_empty() {
+                let cmd = "mkdir -p /Users/accusys/markbase/data && \
+                    cd /Users/accusys/markbase && \
+                    nohup ./target/release/markbase-core web-start --port 11438 \
+                    > /tmp/markbase_web.log 2>&1 &";
+                let _ = std::process::Command::new("sh")
+                    .arg("-c")
+                    .arg(cmd)
+                    .spawn();
+                eprintln!("[startup] MarkBase started on port 11438");
+            } else {
+                eprintln!("[startup] MarkBase already running on port 11438");
+            }
+        }
+    }
+
     tauri::Builder::default()
         .plugin(tauri_plugin_shell::init())
         .setup(|app| {
@@ -1238,6 +1526,7 @@ fn main() {
             if let Err(e) = db::init_db() {
                 eprintln!("Failed to init database: {}", e);
             }
+            ensure_markbase_running();
             Ok(())
         })
 .invoke_handler(tauri::generate_handler![
@@ -1256,6 +1545,7 @@ fn main() {
             get_file_info,
             get_thumbnail,
             get_face_thumbnail,
+            get_file_thumbnail_by_path,
             get_identity_profile,
             update_identity_name,
             update_identity_status,
@@ -1288,12 +1578,16 @@ fn main() {
             db::get_bookmarks,
             db::save_bookmark,
             db::delete_bookmark,
-            list_admin_users,
-            get_system_stats,
-            list_shares,
+            db::get_video_marks,
+            db::save_video_mark,
+            db::delete_video_mark,
+            login_user,
+            get_current_user,
             list_client_files,
             mkdir_client,
-            rm_client
+            rm_client,
+            stop_service,
+            start_service
         ])
         .run(tauri::generate_context!())
         .expect("error while running tauri application");

src-tauri/src/validate.rs

@@ -0,0 +1,449 @@
+use serde::{Deserialize, Serialize};
+use std::fs::{self, OpenOptions};
+use std::io::Write;
+use std::path::Path;
+use std::process::Command;
+use std::time::{SystemTime, UNIX_EPOCH};
+
+use super::proxy::SystemStatsResponse;
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub enum ValidationStatus {
+    Pass,
+    Warn,
+    Fail,
+    Unverified,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct MetricValidation {
+    pub macmon_value: f64,
+    pub reference_value: f64,
+    pub diff_pct: f64,
+    pub status: ValidationStatus,
+    pub tolerance: f64,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct LayerValidation {
+    pub name: String,
+    pub requires_sudo: bool,
+    pub metrics: std::collections::HashMap<String, MetricValidation>,
+    pub summary: ValidationSummary,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct ValidationSummary {
+    pub total: u32,
+    pub passed: u32,
+    pub failed: u32,
+    pub unverified: u32,
+}
+
+#[derive(Debug, Clone, Serialize, Deserialize)]
+pub struct ValidationResult {
+    pub timestamp: String,
+    pub layers: std::collections::HashMap<String, Option<LayerValidation>>,
+    pub overall_summary: ValidationSummary,
+}
+
+impl ValidationStatus {
+    fn from_diff(diff_pct: f64, tolerance: f64) -> Self {
+        if diff_pct <= tolerance {
+            ValidationStatus::Pass
+        } else if diff_pct <= tolerance * 2.0 {
+            ValidationStatus::Warn
+        } else {
+            ValidationStatus::Fail
+        }
+    }
+}
+
+fn get_timestamp() -> String {
+    let now = SystemTime::now()
+        .duration_since(UNIX_EPOCH)
+        .unwrap()
+        .as_secs();
+    let dt = chrono::DateTime::from_timestamp(now as i64, 0).unwrap();
+    dt.format("%Y-%m-%dT%H:%M:%SZ").to_string()
+}
+
+fn write_log(message: &str) {
+    let log_dir = std::env::var("MOMENTRY_DATA_DIR")
+        .unwrap_or_else(|_| ".".to_string());
+    let log_path = Path::new(&log_dir).join("logs").join("validation.log");
+    
+    if let Some(parent) = log_path.parent() {
+        let _ = fs::create_dir_all(parent);
+    }
+    
+    let timestamp = get_timestamp();
+    let log_line = format!("{} {}\n", timestamp, message);
+    
+    if let Ok(mut file) = OpenOptions::new()
+        .create(true)
+        .append(true)
+        .open(&log_path)
+    {
+        let _ = file.write_all(log_line.as_bytes());
+    }
+}
+
+// ==================== Layer 1: Activity Monitor Validation ====================
+
+// CPU formula decision (2026-08-31):
+// - macmon uses `cpu_scaled_ratio` (frequency-weighted: E-core work counts less due to lower freq)
+// - `top` uses simple user+sys ratio (no frequency weighting)
+// - These are intentionally different formulas; macmon's approach is more accurate for "actual work done"
+// - Therefore, CPU validation is marked as Unverified (different formula, not comparable)
+pub fn validate_cpu_usage_scaled_ratio() -> Option<MetricValidation> {
+    write_log("[INFO] Layer 1: CPU uses cpu_scaled_ratio (frequency-weighted) - not comparable to top");
+    
+    let macmon_value = 0.0; // Will be filled by caller
+    
+    write_log(&format!(
+        "[INFO] Layer 1 CPU: macmon cpu_scaled_ratio={:.1}% (frequency-weighted formula)",
+        macmon_value
+    ));
+    
+    Some(MetricValidation {
+        macmon_value,
+        reference_value: 0.0,
+        diff_pct: 0.0,
+        status: ValidationStatus::Unverified,
+        tolerance: 0.0,
+    })
+}
+
+// Memory formula decision (2026-08-31):
+// - macmon uses its own memory calculation (ram_usage from crate)
+// - Activity Monitor uses: wired + active + inactive + speculative - purgeable
+// - These formulas are intentionally different; macmon's approach is chosen as the baseline
+// - Therefore, Memory Used validation is marked as Unverified (different formula, not comparable)
+pub fn validate_memory_used_macmon_formula() -> Option<MetricValidation> {
+    write_log("[INFO] Layer 1: Memory uses macmon formula - not comparable to Activity Monitor");
+    
+    let macmon_value = 0.0; // Will be filled by caller
+    
+    write_log(&format!(
+        "[INFO] Layer 1 Memory Used: macmon={:.1}% (macmon formula)",
+        macmon_value
+    ));
+    
+    Some(MetricValidation {
+        macmon_value,
+        reference_value: 0.0,
+        diff_pct: 0.0,
+        status: ValidationStatus::Unverified,
+        tolerance: 0.0,
+    })
+}
+
+pub fn validate_swap_via_sysctl() -> Option<MetricValidation> {
+    write_log("[INFO] Layer 1: Validating Swap via sysctl");
+    
+    let output = Command::new("sysctl")
+        .args(["-n", "vm.swapusage"])
+        .output()
+        .ok()?;
+    
+    let stdout = String::from_utf8_lossy(&output.stdout);
+    
+    // Parse: total = 9216.00M  used = 8420.00M  free = 796.00M  (encrypted)
+    let parts: Vec<&str> = stdout.split_whitespace().collect();
+    
+    let total_mb: f64 = parts.get(2)
+        .and_then(|v| v.trim_end_matches('M').parse().ok())
+        .unwrap_or(0.0);
+    let used_mb: f64 = parts.get(5)
+        .and_then(|v| v.trim_end_matches('M').parse().ok())
+        .unwrap_or(0.0);
+    
+    let used_pct = if total_mb > 0.0 {
+        (used_mb / total_mb) * 100.0
+    } else {
+        0.0
+    };
+    
+    let macmon_value = 0.0; // Will be filled by caller
+    let tolerance = 1.0;
+    let diff_pct = (macmon_value - used_pct).abs();
+    
+    write_log(&format!(
+        "[INFO] Layer 1 Swap: macmon={:.1}%, sysctl={:.1}%, diff={:.2}%",
+        macmon_value, used_pct, diff_pct
+    ));
+    
+    Some(MetricValidation {
+        macmon_value,
+        reference_value: used_pct,
+        diff_pct,
+        status: ValidationStatus::from_diff(diff_pct, tolerance),
+        tolerance,
+    })
+}
+
+pub fn validate_memory_total_via_sysctl() -> Option<MetricValidation> {
+    write_log("[INFO] Layer 1: Validating Memory Total via sysctl");
+    
+    let output = Command::new("sysctl")
+        .args(["-n", "hw.memsize"])
+        .output()
+        .ok()?;
+    
+    let stdout = String::from_utf8_lossy(&output.stdout);
+    let total_bytes: u64 = stdout.trim().parse().ok()?;
+    let total_mb = total_bytes as f64 / (1024.0 * 1024.0);
+    
+    let macmon_value = 0.0; // Will be filled by caller
+    let tolerance = 0.0; // Exact match expected
+    let diff_pct = (macmon_value - total_mb).abs();
+    
+    write_log(&format!(
+        "[INFO] Layer 1 Memory Total: macmon={:.0}MB, sysctl={:.0}MB, diff={:.0}MB",
+        macmon_value, total_mb, diff_pct
+    ));
+    
+    Some(MetricValidation {
+        macmon_value,
+        reference_value: total_mb,
+        diff_pct,
+        status: ValidationStatus::from_diff(diff_pct, 0.1), // Very small tolerance
+        tolerance: 0.1,
+    })
+}
+
+// ==================== Layer 2: System API Validation ====================
+
+pub fn validate_cpu_temp_via_ioreg() -> Option<MetricValidation> {
+    write_log("[INFO] Layer 2: Validating CPU Temp via ioreg");
+    
+    let output = Command::new("ioreg")
+        .args(["-r", "-n", "AppleSMC"])
+        .output()
+        .ok()?;
+    
+    let stdout = String::from_utf8_lossy(&output.stdout);
+    
+    // Look for temperature values
+    let temp = stdout
+        .lines()
+        .find(|line| line.contains("temperature") || line.contains("TC0P") || line.contains("TC0H"))
+        .and_then(|line| {
+            // Extract numeric value
+            let num_str: String = line
+                .chars()
+                .filter(|c| c.is_numeric() || *c == '.' || *c == '-')
+                .collect();
+            num_str.parse::<f64>().ok()
+        })
+        .unwrap_or(0.0);
+    
+    let macmon_value = 0.0; // Will be filled by caller
+    let tolerance = 1.0;
+    let diff_pct = (macmon_value - temp).abs();
+    
+    write_log(&format!(
+        "[INFO] Layer 2 CPU Temp: macmon={:.1}°C, ioreg={:.1}°C, diff={:.1}°C",
+        macmon_value, temp, diff_pct
+    ));
+    
+    Some(MetricValidation {
+        macmon_value,
+        reference_value: temp,
+        diff_pct,
+        status: ValidationStatus::from_diff(diff_pct, tolerance),
+        tolerance,
+    })
+}
+
+pub fn validate_thermal_state_via_pmset() -> Option<MetricValidation> {
+    write_log("[INFO] Layer 2: Validating Thermal State via pmset");
+    
+    let output = Command::new("pmset")
+        .args(["-g", "therm"])
+        .output()
+        .ok()?;
+    
+    let stdout = String::from_utf8_lossy(&output.stdout);
+    
+    // Parse thermal state
+    let state = if stdout.contains("CPU Power Load") {
+        "Nominal"
+    } else if stdout.contains("Warning") {
+        "Warning"
+    } else {
+        "Nominal"
+    };
+    
+    // For thermal state, we just log the result (it's a string comparison)
+    write_log(&format!("[INFO] Layer 2 Thermal State: {}", state));
+    
+    None // Return None for string-based metrics
+}
+
+// ==================== Main Validation Function ====================
+
+pub fn run_validation(layers: &[u32], macmon_stats: &SystemStatsResponse) -> ValidationResult {
+    write_log(&format!("[INFO] Validation started: layers={:?}", layers));
+    
+    let mut result = ValidationResult {
+        timestamp: get_timestamp(),
+        layers: std::collections::HashMap::new(),
+        overall_summary: ValidationSummary {
+            total: 0,
+            passed: 0,
+            failed: 0,
+            unverified: 0,
+        },
+    };
+    
+    // Layer 1: Activity Monitor
+    if layers.contains(&1) {
+        let mut layer1 = LayerValidation {
+            name: "Activity Monitor".to_string(),
+            requires_sudo: false,
+            metrics: std::collections::HashMap::new(),
+            summary: ValidationSummary {
+                total: 0,
+                passed: 0,
+                failed: 0,
+                unverified: 0,
+            },
+        };
+        
+        // CPU - Unverified (different formula)
+        if let Some(mut val) = validate_cpu_usage_scaled_ratio() {
+            val.macmon_value = macmon_stats.cpu_used_percent;
+            layer1.metrics.insert("cpu_usage".to_string(), val);
+        }
+        
+        // Memory Used - Unverified (different formula)
+        if let Some(mut val) = validate_memory_used_macmon_formula() {
+            val.macmon_value = macmon_stats.memory_used_percent;
+            layer1.metrics.insert("memory_used_percent".to_string(), val);
+        }
+        
+        // Memory Total
+        if let Some(mut val) = validate_memory_total_via_sysctl() {
+            val.macmon_value = macmon_stats.memory_total_mb as f64;
+            val.diff_pct = (val.macmon_value - val.reference_value).abs();
+            val.status = ValidationStatus::from_diff(val.diff_pct, val.tolerance);
+            layer1.metrics.insert("memory_total_mb".to_string(), val);
+        }
+        
+        // Swap
+        if macmon_stats.swap_total_mb > 0 {
+            if let Some(mut val) = validate_swap_via_sysctl() {
+                val.macmon_value = macmon_stats.swap_used_percent;
+                val.diff_pct = (val.macmon_value - val.reference_value).abs();
+                val.status = ValidationStatus::from_diff(val.diff_pct, val.tolerance);
+                layer1.metrics.insert("swap_used_percent".to_string(), val);
+            }
+        }
+        
+        // Calculate summary
+        for (_, metric) in &layer1.metrics {
+            layer1.summary.total += 1;
+            result.overall_summary.total += 1;
+            match metric.status {
+                ValidationStatus::Pass => {
+                    layer1.summary.passed += 1;
+                    result.overall_summary.passed += 1;
+                }
+                ValidationStatus::Warn | ValidationStatus::Fail => {
+                    layer1.summary.failed += 1;
+                    result.overall_summary.failed += 1;
+                }
+                ValidationStatus::Unverified => {
+                    layer1.summary.unverified += 1;
+                    result.overall_summary.unverified += 1;
+                }
+            }
+        }
+        
+        result.layers.insert("layer1".to_string(), Some(layer1));
+    }
+    
+    // Layer 2: System API
+    if layers.contains(&2) {
+        let mut layer2 = LayerValidation {
+            name: "System API".to_string(),
+            requires_sudo: false,
+            metrics: std::collections::HashMap::new(),
+            summary: ValidationSummary {
+                total: 0,
+                passed: 0,
+                failed: 0,
+                unverified: 0,
+            },
+        };
+        
+        // CPU Temp
+        if let Some(temp) = macmon_stats.cpu_temp {
+            if let Some(mut val) = validate_cpu_temp_via_ioreg() {
+                val.macmon_value = temp;
+                val.diff_pct = (val.macmon_value - val.reference_value).abs();
+                val.status = ValidationStatus::from_diff(val.diff_pct, val.tolerance);
+                layer2.metrics.insert("cpu_temp".to_string(), val);
+            }
+        }
+        
+        // Calculate summary
+        for (_, metric) in &layer2.metrics {
+            layer2.summary.total += 1;
+            result.overall_summary.total += 1;
+            match metric.status {
+                ValidationStatus::Pass => {
+                    layer2.summary.passed += 1;
+                    result.overall_summary.passed += 1;
+                }
+                ValidationStatus::Warn | ValidationStatus::Fail => {
+                    layer2.summary.failed += 1;
+                    result.overall_summary.failed += 1;
+                }
+                ValidationStatus::Unverified => {
+                    layer2.summary.unverified += 1;
+                    result.overall_summary.unverified += 1;
+                }
+            }
+        }
+        
+        result.layers.insert("layer2".to_string(), Some(layer2));
+    }
+    
+    // Layer 3: Requires sudo (not implemented in this phase)
+    if layers.contains(&3) {
+        result.layers.insert("layer3".to_string(), None);
+        write_log("[INFO] Layer 3 validation not implemented yet");
+    }
+    
+    // Layer 4: Unverified
+    if layers.contains(&4) {
+        let layer4 = LayerValidation {
+            name: "Unverified".to_string(),
+            requires_sudo: false,
+            metrics: std::collections::HashMap::new(),
+            summary: ValidationSummary {
+                total: 3,
+                passed: 0,
+                failed: 0,
+                unverified: 3,
+            },
+        };
+        
+        result.layers.insert("layer4".to_string(), Some(layer4));
+        result.overall_summary.total += 3;
+        result.overall_summary.unverified += 3;
+    }
+    
+    write_log(&format!(
+        "[INFO] Validation completed: {}/{} passed, {} failed, {} unverified",
+        result.overall_summary.passed,
+        result.overall_summary.total,
+        result.overall_summary.failed,
+        result.overall_summary.unverified
+    ));
+    
+    result
+}

src/App.vue

@@ -1,10 +1,66 @@
 <script setup lang="ts">
-import { onMounted, onUnmounted, ref } from 'vue'
+import { onMounted, onUnmounted, ref, watch } from 'vue'
 import { useRouter } from 'vue-router'
-import { isTauri } from '@/api/config'
+import AgentTip from './components/AgentTip.vue'
+import BuildVersion from './components/BuildVersion.vue'
+import { loadUserBehavior } from '@/stores/agentStore'
+import { useI18n } from 'vue-i18n'
+import { changeLanguage, getCurrentLanguage } from './locales'
+import { useAdvancedMode } from '@/stores/advancedMode'
+import { useTheme } from '@/stores/themeStore'
 
+const { t } = useI18n()
 const router = useRouter()
+const { isAdvanced, toggleAdvanced } = useAdvancedMode()
+const { theme, toggleTheme } = useTheme()
+
 const appZoom = ref(100)
+const loggedInUser = ref(localStorage.getItem('username') || '')
+const currentLanguage = ref(getCurrentLanguage())
+
+const sidebarWidth = ref(240)
+const isDragging = ref(false)
+const sidebarCollapsed = ref(true)
+const isMobile = ref(window.innerWidth < 768)
+const mobileOpen = ref(false)
+
+function toggleSidebar() {
+  if (isMobile.value) {
+    mobileOpen.value = !mobileOpen.value
+  } else {
+    sidebarCollapsed.value = !sidebarCollapsed.value
+    localStorage.setItem('sidebar_collapsed', String(sidebarCollapsed.value))
+  }
+}
+
+function closeMobileDrawer() {
+  mobileOpen.value = false
+}
+
+function handleResize() {
+  isMobile.value = window.innerWidth < 768
+  if (!isMobile.value) mobileOpen.value = false
+}
+
+function refreshUser() {
+  const user = localStorage.getItem('username') || ''
+  loggedInUser.value = user
+}
+
+function handleLogout() {
+  if (!confirm('Are you sure you want to logout?')) return
+  localStorage.removeItem('token')
+  localStorage.removeItem('username')
+  localStorage.removeItem('expires_at')
+  loggedInUser.value = ''
+  router.push('/login')
+}
+
+function onChangeLanguage() {
+  changeLanguage(currentLanguage.value)
+}
+
+let systemMedia: MediaQueryList | null = null
 
 function handleKeydown(e: KeyboardEvent) {
   if ((e.metaKey || e.ctrlKey)) {
@@ -24,102 +80,249 @@ function handleKeydown(e: KeyboardEvent) {
   }
 }
 
+function startDrag(e: MouseEvent) {
+  isDragging.value = true
+  document.body.style.cursor = 'col-resize'
+  document.body.style.userSelect = 'none'
+}
+
+function handleDrag(e: MouseEvent) {
+  if (!isDragging.value) return
+  const newWidth = e.clientX - 28
+  sidebarWidth.value = Math.max(180, Math.min(400, newWidth))
+}
+
+function stopDrag() {
+  isDragging.value = false
+  document.body.style.cursor = ''
+  document.body.style.userSelect = ''
+}
+
 onMounted(() => {
   document.addEventListener('keydown', handleKeydown)
+  document.addEventListener('mousemove', handleDrag)
+  document.addEventListener('mouseup', stopDrag)
+  window.addEventListener('resize', handleResize)
+  
+  refreshUser()
+  loadUserBehavior()
 
-  if (isTauri) return
-
-  const token = localStorage.getItem('token')
-  const expiresAt = localStorage.getItem('expires_at')
-  const currentPath = router.currentRoute.value.path
-
-  if (currentPath !== '/login') {
-    if (!token || !expiresAt) {
-      router.push('/login')
-    } else {
-      const now = new Date()
-      const expires = new Date(expiresAt)
-      if (now >= expires) {
-        localStorage.removeItem('token')
-        localStorage.removeItem('username')
-        localStorage.removeItem('expires_at')
-        router.push('/login')
-      }
-    }
-  }
+  window.addEventListener('ms-login', () => {
+    refreshUser()
+    loadUserBehavior()
+  })
 })
 
-onUnmounted(() => document.removeEventListener('keydown', handleKeydown))
+watch(() => router.currentRoute.value.path, () => {
+  refreshUser()
+  closeMobileDrawer()
+})
+
+onUnmounted(() => {
+  document.removeEventListener('keydown', handleKeydown)
+  document.removeEventListener('mousemove', handleDrag)
+  document.removeEventListener('mouseup', stopDrag)
+  window.removeEventListener('resize', handleResize)
+})
 </script>
 <template>
-  <div id="app" class="ms-app" :data-current-login="'guest'">
-    <aside class="ms-side">
-      <div class="gs-logo">Workspace</div>
+  <BuildVersion />
+  <div id="app" class="ms-app" :class="{ 'ms-app-mobile': isMobile }" :data-current-login="'guest'">
+    <div v-if="isMobile && mobileOpen" class="ms-overlay" @click="closeMobileDrawer"></div>
+    <aside class="ms-side" :class="{ collapsed: !isMobile && sidebarCollapsed, 'mobile-open': isMobile && mobileOpen }" :style="isMobile ? {} : { width: sidebarCollapsed ? '62px' : sidebarWidth + 'px', minWidth: sidebarCollapsed ? '62px' : sidebarWidth + 'px' }">
+      <div class="gs-sidebar-toggle" @click="toggleSidebar">
+        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+          :style="{ transform: sidebarCollapsed ? 'rotate(0deg)' : 'rotate(180deg)' }">
+          <polyline points="9 18 15 12 9 6"/>
+        </svg>
+      </div>
+      <div class="gs-logo" :class="{ 'gs-logo-collapsed': sidebarCollapsed }">{{ sidebarCollapsed ? 'WS' : 'Workspace' }}</div>
       <nav class="gs-nav">
         <router-link to="/search" class="gs-nav-item" active-class="active">
-          <img class="gs-nav-icon" src="/icons/Search.png" alt="">
-          <span>Search</span>
+          <svg class="gs-nav-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="11" cy="11" r="8"/>
+            <path d="M21 21l-4.35-4.35"/>
+          </svg>
+          <span class="gs-nav-label">{{ t('nav.search') }}</span>
         </router-link>
         <router-link to="/library" class="gs-nav-item" active-class="active">
-          <img class="gs-nav-icon" src="/icons/Library.png" alt="">
-          <span>Library</span>
-        </router-link>
-        <router-link to="/people" class="gs-nav-item" active-class="active">
-          <img class="gs-nav-icon" src="/icons/People.png" alt="">
-          <span>People</span>
+          <svg class="gs-nav-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <rect x="3" y="3" width="7" height="7" rx="1"/>
+            <rect x="14" y="3" width="7" height="7" rx="1"/>
+            <rect x="3" y="14" width="7" height="7" rx="1"/>
+            <rect x="14" y="14" width="7" height="7" rx="1"/>
+          </svg>
+          <span class="gs-nav-label">{{ t('nav.library') }}</span>
         </router-link>
         <router-link to="/admin" class="gs-nav-item" active-class="active">
           <svg class="gs-nav-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
             <circle cx="12" cy="12" r="3"/>
             <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/>
           </svg>
-          <span>Admin</span>
+          <span class="gs-nav-label">{{ t('nav.admin') }}</span>
         </router-link>
         <router-link to="/client" class="gs-nav-item" active-class="active">
           <svg class="gs-nav-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
             <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>
           </svg>
-          <span>Client</span>
+          <span class="gs-nav-label">{{ t('nav.client') }}</span>
         </router-link>
       </nav>
-      <div class="gs-divider"></div>
-      <div class="gs-footer">
-        <div class="gs-theme-switcher">
-          <button class="gs-theme-btn active">☀️</button>
-          <button class="gs-theme-btn">🌙</button>
-          <button class="gs-theme-btn">🌗</button>
+    <div class="gs-divider" :class="{ 'gs-hidden': sidebarCollapsed }"></div>
+      <div class="gs-footer" :class="{ 'gs-hidden': sidebarCollapsed }">
+        <div class="gs-controls">
+          <select v-model="currentLanguage" @change="onChangeLanguage" class="gs-lang-select">
+            <option value="en">{{ $t('language.en') }}</option>
+            <option value="zh-TW">{{ $t('language.zh-TW') }}</option>
+            <option value="ja">{{ $t('language.ja') }}</option>
+            <option value="auto">{{ $t('language.auto') }}</option>
+          </select>
+          <button class="gs-control-btn" :class="{ 'gs-control-active': isAdvanced }" :title="isAdvanced ? 'Advanced Mode: ON' : 'Advanced Mode: OFF'" @click="toggleAdvanced">
+            <svg v-if="isAdvanced" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 7.9-2"/></svg>
+            <svg v-else width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="4" y="11" width="16" height="10" rx="2"/><path d="M8 11V7a4 4 0 0 1 8 0v4"/></svg>
+          </button>
+          <button class="gs-control-btn" :title="theme === 'dark' ? 'Switch to Light' : 'Switch to Dark'" @click="toggleTheme">{{ theme === 'dark' ? '☀️' : '🌙' }}</button>
         </div>
-        <div class="gs-account"><span class="gs-account-name">Demo</span></div>
+        <div class="gs-account-row">
+          <template v-if="loggedInUser">
+            <span class="gs-account-name">{{ loggedInUser }}</span>
+            <button class="gs-logout-btn" @click="handleLogout" title="Logout">⏻ {{ t('common.logout') }}</button>
+          </template>
+          <template v-else>
+            <router-link to="/login" class="gs-login-link">{{ t('common.login') }}</router-link>
+          </template>
+        </div>
+      </div>
+      <div class="gs-footer-compact">
+        <template v-if="loggedInUser">
+          <button class="gs-logout-btn-compact" @click="handleLogout" title="Logout">⏻</button>
+        </template>
+        <template v-else>
+          <router-link to="/login" class="gs-login-link-compact" title="Login">⏻</router-link>
+        </template>
       </div>
     </aside>
-    <main class="ms-main">
-      <div class="ms-content"><router-view /></div>
+    <div class="ms-divider" :class="{ 'ms-divider-hidden': sidebarCollapsed }" @mousedown="startDrag"></div>
+<main class="ms-main">
+      <div v-if="isMobile" class="ms-mobile-header">
+        <button class="ms-mobile-hamburger" @click="toggleSidebar" aria-label="Menu">
+          <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
+        </button>
+        <span class="ms-mobile-title">Momentry Studio</span>
+      </div>
+      <router-view />
     </main>
+    <nav v-if="isMobile" class="ms-bottom-nav">
+      <router-link to="/search" class="ms-bottom-nav-item" active-class="active" @click="closeMobileDrawer">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.35-4.35"/></svg>
+        <span>Search</span>
+      </router-link>
+      <router-link to="/library" class="ms-bottom-nav-item" active-class="active" @click="closeMobileDrawer">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg>
+        <span>Library</span>
+      </router-link>
+      <router-link to="/admin" class="ms-bottom-nav-item" active-class="active" @click="closeMobileDrawer">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
+        <span>Admin</span>
+      </router-link>
+      <router-link to="/client" class="ms-bottom-nav-item" active-class="active" @click="closeMobileDrawer">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="14" rx="2"/><path d="M8 21h8"/><path d="M12 17v4"/></svg>
+        <span>Client</span>
+      </router-link>
+      <router-link v-if="!loggedInUser" to="/login" class="ms-bottom-nav-item" active-class="active" @click="closeMobileDrawer">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4"/><polyline points="10 17 15 12 10 7"/><line x1="15" y1="12" x2="3" y2="12"/></svg>
+        <span>Login</span>
+      </router-link>
+      <button v-else class="ms-bottom-nav-item ms-bottom-nav-btn-logout" @click="handleLogout">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/><polyline points="16 17 21 12 16 7"/><line x1="21" y1="12" x2="9" y2="12"/></svg>
+        <span>Logout</span>
+      </button>
+    </nav>
+    <AgentTip v-if="loggedInUser" />
   </div>
 </template>
 
 <style>
 @import './assets/wordpress-exact.css';
+html, body { height: 100%; margin: 0; }
 </style>
 
 <style scoped>
 * { margin: 0; padding: 0; box-sizing: border-box; }
-body { font-family: 'DM Sans', 'Noto Sans TC', -apple-system, BlinkMacSystemFont, sans-serif; background: #fff; color: #202124; }
-#app { display: flex; max-width: 1400px; margin: 0 auto; padding: 28px; gap: 28px; min-height: 100vh; box-sizing: border-box; align-items: stretch; }
-.ms-side { width: 240px; min-width: 240px; flex-shrink: 0; background: #fff; border-radius: 18px; padding: 18px 14px; box-shadow: 0 16px 38px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.06); display: flex; flex-direction: column; position: relative; height: calc(100vh - 125px); align-self: flex-start; overflow: visible; }
-.gs-logo { font-size: 15px; font-weight: 600; color: #202124; padding: 8px 12px 16px 12px; flex-shrink: 0; }
+#app, .ms-app { background: var(--background-color) !important; display: flex; max-width: 1400px; margin: 0 auto; padding: 28px; gap: 0; height: 100vh; box-sizing: border-box; }
+.ms-side { width: 240px; min-width: 240px; background: var(--card-background) !important; border-radius: 18px; padding: 18px 14px; box-shadow: var(--shadow); display: flex; flex-direction: column; position: relative; overflow: visible; height: 100%; }
+.ms-side.collapsed { align-items: center; padding: 18px 8px; }
+.ms-side.collapsed .gs-nav { align-items: center; width: 100%; }
+.ms-side.collapsed .gs-nav-item { justify-content: center; padding: 0; width: 44px; }
+.ms-side.collapsed .gs-nav-label { display: none; }
+.ms-side.collapsed .gs-nav-icon { width: 22px; height: 22px; }
+.gs-footer-compact { display: none; }
+.ms-side.collapsed .gs-footer-compact { display: flex; flex-direction: column; align-items: center; margin-top: auto; padding: 10px 0; }
+.gs-logout-btn-compact, .gs-login-link-compact { background: none; border: 1px solid var(--border-color); cursor: pointer; font-size: 16px; color: var(--text-secondary); width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; text-decoration: none; transition: all .15s; }
+.gs-logout-btn-compact:hover { color: var(--danger-color); border-color: var(--danger-color); background: var(--danger-background); }
+.gs-login-link-compact:hover { color: var(--text-primary); border-color: var(--text-primary); }
+.gs-hidden { display: none !important; }
+.gs-sidebar-toggle { display: flex; align-items: center; justify-content: flex-end; padding: 0 4px 12px 4px; cursor: pointer; color: var(--text-secondary); flex-shrink: 0; }
+.gs-sidebar-toggle svg { transition: transform 0.2s; }
+.ms-side.collapsed .gs-sidebar-toggle { justify-content: center; width: 100%; }
+.gs-logo-collapsed { text-align: center; padding: 8px 4px 16px 4px; font-size: 14px; }
+.ms-divider { width: 28px; flex-shrink: 0; cursor: col-resize; display: flex; align-items: center; justify-content: center; }
+.ms-divider-hidden { cursor: default; pointer-events: none; opacity: 0; }
+.ms-divider::after { content: ''; width: 4px; height: 40px; background: var(--border-color); border-radius: 2px; transition: background 0.2s, height 0.2s; }
+.ms-divider:hover::after { background: var(--primary-color); height: 60px; }
+.gs-logo { font-size: 15px; font-weight: 600; color: var(--text-primary); padding: 8px 12px 16px 12px; flex-shrink: 0; }
 .gs-nav { display: flex; flex-direction: column; gap: 4px; flex-shrink: 0; }
-.gs-nav-item { display: flex; align-items: center; gap: 12px; height: 48px; padding: 0 12px; border-radius: 10px; text-decoration: none; color: #3c4043; font-weight: 600; font-size: 18px; line-height: 1; background: transparent; box-sizing: border-box; }
-.gs-nav-item:hover { background: var(--ms-accent-soft); color: var(--ms-accent-text); }
-.gs-nav-item.active { background: var(--ms-accent-soft) !important; color: var(--ms-accent-text) !important; font-weight: 600; }
-.gs-nav-icon { width: 24px; height: 24px; object-fit: contain; flex-shrink: 0; }
-.gs-divider { height: 1px; background: #eee; margin: 14px 8px; flex-shrink: 0; }
-.gs-footer { margin-top: auto; padding: 10px 12px; border-radius: 12px; display: flex; align-items: center; gap: 10px; background: #f8f9fa; flex-shrink: 0; }
-.gs-theme-switcher { display: flex; gap: 5px; }
-.gs-theme-btn { width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(0,0,0,.08); background: #f3f3f3; cursor: pointer; padding: 0; }
-.gs-theme-btn:hover { transform: scale(1.08); }
-.gs-theme-btn.active { box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(0,0,0,.16); }
-.gs-account-name { font-size: 12px; color: #5f6368; }
-.ms-main { flex: 1; min-width: 0; background: #fff; border-radius: 18px; padding: 36px 42px; overflow-y: auto; overflow-x: hidden; }
+.gs-nav-item { display: flex; align-items: center; gap: 12px; height: 48px; padding: 0 12px; border-radius: 10px; text-decoration: none; color: var(--text-primary) !important; font-weight: 500; font-size: 16px; line-height: 1; background: transparent !important; box-sizing: border-box; transition: all 0.15s; }
+.gs-nav-item:hover { background: var(--hover-background) !important; color: var(--primary-color) !important; }
+.gs-nav-item.active { background: var(--hover-background) !important; color: var(--primary-color) !important; font-weight: 600; }
+.gs-nav-icon { width: 22px; height: 22px; flex-shrink: 0; }
+.gs-divider { height: 1px; background: var(--border-light); margin: 14px 8px; flex-shrink: 0; }
+.gs-footer { margin-top: auto; padding: 10px 8px; border-radius: 12px; background: var(--hover-background); flex-shrink: 0; display: flex; flex-direction: column; gap: 8px; }
+.gs-controls { display: flex; align-items: center; gap: 6px; }
+.gs-control-btn { width: 28px; height: 28px; border: 1px solid var(--border-color); border-radius: 6px; background: var(--card-background); cursor: pointer; font-size: 14px; display: flex; align-items: center; justify-content: center; transition: all 0.15s; color: #888; flex-shrink: 0; filter: grayscale(1); }
+.gs-control-btn:hover { background: var(--border-light); border-color: var(--text-secondary); filter: grayscale(0); }
+.gs-control-active { color: var(--primary-color); border-color: var(--primary-color); background: var(--primary-color-light, rgba(66,133,244,0.1)); filter: grayscale(0); }
+.gs-lang-switcher { width: 100%; }
+.gs-lang-select { width: 100%; padding: 6px 8px; border: 1px solid var(--border-color); border-radius: 6px; background: var(--card-background); font-size: 12px; font-family: inherit; color: var(--text-secondary); cursor: pointer; outline: none; }
+.gs-lang-select:focus { border-color: var(--text-primary); }
+.gs-account-row { display: flex; align-items: center; justify-content: center; gap: 8px; }
+.gs-account-name { font-size: 12px; color: var(--text-secondary); }
+.gs-logout-btn { background: none; border: 1px solid var(--border-color); cursor: pointer; font-size: 13px; color: var(--text-secondary); padding: 3px 8px; border-radius: 6px; transition: all .15s; margin-left: 6px; }
+.gs-logout-btn:hover { color: var(--danger-color); border-color: var(--danger-color); background: var(--danger-background); }
+.gs-login-link { font-size: 12px; color: var(--text-secondary); text-decoration: none; }
+.gs-login-link:hover { color: var(--text-primary); }
+.ms-main { flex: 1; min-width: 0; background: var(--card-background) !important; border-radius: 18px; padding: 36px 42px; overflow-y: auto; overflow-x: hidden; height: 100%; }
 .ms-content { max-width: 1200px; }
+
+/* Mobile overlay */
+.ms-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 999; }
+
+/* Mobile header */
+.ms-mobile-header { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; }
+.ms-mobile-hamburger { background: none; border: none; cursor: pointer; color: var(--text-primary); padding: 4px; }
+.ms-mobile-title { font-size: 15px; font-weight: 600; color: var(--text-primary); }
+
+/* Bottom nav */
+.ms-bottom-nav { display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 998;
+  background: var(--card-background); border-top: 1px solid var(--border-light);
+  justify-content: space-around; padding: 6px 0 env(safe-area-inset-bottom, 6px) 0;
+  box-shadow: 0 -2px 8px rgba(0,0,0,0.06); }
+.ms-bottom-nav-item { display: flex; flex-direction: column; align-items: center; gap: 2px;
+  text-decoration: none; color: var(--text-secondary); font-size: 10px; padding: 2px 8px; }
+.ms-bottom-nav-item.active { color: var(--primary-color); }
+.ms-bottom-nav-item svg { width: 20px; height: 20px; }
+.ms-bottom-nav-btn-logout { background: none; border: none; cursor: pointer; }
+
+@media (max-width: 767px) {
+  .ms-app { padding: 0; max-width: 100%; height: 100dvh; }
+  .ms-app.ms-app-mobile { padding: 0; }
+  .ms-side { position: fixed; left: 0; top: 0; bottom: 0; z-index: 1000;
+    transform: translateX(-100%); transition: transform 0.25s ease;
+    width: 260px !important; min-width: 260px !important; border-radius: 0 18px 18px 0; }
+  .ms-side.mobile-open { transform: translateX(0); }
+  .ms-side .gs-sidebar-toggle { display: none; }
+  .ms-divider { display: none; }
+  .ms-main { padding: 12px 12px 60px; border-radius: 0; height: 100dvh; }
+  .gs-footer-compact { display: none !important; }
+}
 </style>

src/App.vue.backup_final

@@ -0,0 +1,99 @@
+<template>
+  <div id="app" class="ms-app" :data-current-login="'guest'">
+    <aside class="ms-side">
+      <div class="gs-logo">Workspace</div>
+      <nav class="gs-nav">
+        <router-link to="/search" class="gs-nav-item" active-class="active">
+          <img class="gs-nav-icon" src="/icons/Search.png" alt="">
+          <span>Search</span>
+        </router-link>
+        <router-link to="/library" class="gs-nav-item" active-class="active">
+          <img class="gs-nav-icon" src="/icons/Library.png" alt="">
+          <span>Library</span>
+        </router-link>
+        <router-link to="/people" class="gs-nav-item" active-class="active">
+          <img class="gs-nav-icon" src="/icons/People.png" alt="">
+          <span>People</span>
+        </router-link>
+        <router-link to="/admin" class="gs-nav-item" active-class="active">
+          <svg class="gs-nav-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <circle cx="12" cy="12" r="3"/>
+            <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/>
+          </svg>
+          <span>Admin</span>
+        </router-link>
+        <router-link to="/client" class="gs-nav-item" active-class="active">
+          <svg class="gs-nav-icon" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/>
+          </svg>
+          <span>Client</span>
+        </router-link>
+      </nav>
+      <div class="gs-divider"></div>
+      <div class="gs-footer">
+        <div class="gs-theme-switcher">
+          <button class="gs-theme-btn active">☀️</button>
+          <button class="gs-theme-btn">🌙</button>
+          <button class="gs-theme-btn">🌗</button>
+        </div>
+        <div class="gs-account"><span class="gs-account-name">Demo</span></div>
+      </div>
+    </aside>
+    <main class="ms-main">
+      <div class="ms-content"><router-view /></div>
+    </main>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { onMounted, onUnmounted, ref } from 'vue'
+
+const appZoom = ref(100)
+
+function handleKeydown(e: KeyboardEvent) {
+  if ((e.metaKey || e.ctrlKey)) {
+    if (e.key === '=' || e.key === '+') {
+      e.preventDefault()
+      appZoom.value = Math.min(appZoom.value + 10, 300)
+      document.documentElement.style.zoom = appZoom.value + '%'
+    } else if (e.key === '-') {
+      e.preventDefault()
+      appZoom.value = Math.max(appZoom.value - 10, 50)
+      document.documentElement.style.zoom = appZoom.value + '%'
+    } else if (e.key === '0') {
+      e.preventDefault()
+      appZoom.value = 100
+      document.documentElement.style.zoom = '100%'
+    }
+  }
+}
+
+onMounted(() => document.addEventListener('keydown', handleKeydown))
+onUnmounted(() => document.removeEventListener('keydown', handleKeydown))
+</script>
+
+<style>
+@import './assets/wordpress-exact.css';
+</style>
+
+<style scoped>
+* { margin: 0; padding: 0; box-sizing: border-box; }
+body { font-family: 'DM Sans', 'Noto Sans TC', -apple-system, BlinkMacSystemFont, sans-serif; background: #fff; color: #202124; }
+#app { display: flex; max-width: 1400px; margin: 0 auto; padding: 28px; gap: 28px; min-height: 100vh; box-sizing: border-box; align-items: stretch; }
+.ms-side { width: 240px; min-width: 240px; flex-shrink: 0; background: #fff; border-radius: 18px; padding: 18px 14px; box-shadow: 0 16px 38px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.06); display: flex; flex-direction: column; position: relative; height: calc(100vh - 125px); align-self: flex-start; overflow: visible; }
+.gs-logo { font-size: 15px; font-weight: 600; color: #202124; padding: 8px 12px 16px 12px; flex-shrink: 0; }
+.gs-nav { display: flex; flex-direction: column; gap: 4px; flex-shrink: 0; }
+.gs-nav-item { display: flex; align-items: center; gap: 12px; height: 48px; padding: 0 12px; border-radius: 10px; text-decoration: none; color: #3c4043; font-weight: 600; font-size: 18px; line-height: 1; background: transparent; box-sizing: border-box; }
+.gs-nav-item:hover { background: var(--ms-accent-soft); color: var(--ms-accent-text); }
+.gs-nav-item.active { background: var(--ms-accent-soft) !important; color: var(--ms-accent-text) !important; font-weight: 600; }
+.gs-nav-icon { width: 24px; height: 24px; object-fit: contain; flex-shrink: 0; }
+.gs-divider { height: 1px; background: #eee; margin: 14px 8px; flex-shrink: 0; }
+.gs-footer { margin-top: auto; padding: 10px 12px; border-radius: 12px; display: flex; align-items: center; gap: 10px; background: #f8f9fa; flex-shrink: 0; }
+.gs-theme-switcher { display: flex; gap: 5px; }
+.gs-theme-btn { width: 14px; height: 14px; border-radius: 50%; border: 1px solid rgba(0,0,0,.08); background: #f3f3f3; cursor: pointer; padding: 0; }
+.gs-theme-btn:hover { transform: scale(1.08); }
+.gs-theme-btn.active { box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(0,0,0,.16); }
+.gs-account-name { font-size: 12px; color: #5f6368; }
+.ms-main { flex: 1; min-width: 0; background: #fff; border-radius: 18px; padding: 36px 42px; overflow-y: auto; overflow-x: hidden; }
+.ms-content { max-width: 1200px; }
+</style>

src/api/config.ts

@@ -2,5 +2,10 @@ export const isTauri = typeof window !== 'undefined' && !!(window as any).__TAUR
 
 export function getApiBase(): string {
   if (isTauri) return 'http://localhost:8888'
-  return localStorage.getItem('proxy_url') || window.location.origin
+  const stored = localStorage.getItem('proxy_url')
+  if (stored) return stored
+  const hostname = typeof window !== 'undefined' ? window.location.hostname : ''
+  const isLocal = hostname === 'localhost' || hostname === '127.0.0.1'
+  if (isLocal) return ''  // 走 Vite proxy → Rust proxy (8888)
+  return window.location.origin
 }

src/api/index.ts

@@ -1,6 +1,31 @@
 import { invoke } from '@tauri-apps/api/core'
 import { isTauri, getApiBase } from './config'
 
+// Detect base URL: use current origin when remote, fallback to localStorage or localhost
+function detectBaseUrl(): string {
+  const hostname = typeof window !== 'undefined' ? window.location.hostname : ''
+  const isLocal = hostname === 'localhost' || hostname === '127.0.0.1'
+  if (!isLocal && typeof window !== 'undefined') {
+    return window.location.origin
+  }
+  return localStorage.getItem('markbase_url') || 'http://localhost:11438'
+}
+
+// Poll command status until completed or failed
+export async function pollCommandStatus(commandId: string, intervalMs: number = 2000, maxAttempts: number = 150): Promise<any> {
+  for (let attempt = 0; attempt < maxAttempts; attempt++) {
+    const status = await apiCall('get_command_status', { commandId })
+    if (status?.status === 'completed') {
+      return status
+    }
+    if (status?.status === 'failed') {
+      throw new Error(status.last_error || 'Command failed')
+    }
+    await new Promise(resolve => setTimeout(resolve, intervalMs))
+  }
+  throw new Error('Command polling timeout')
+}
+
 // API proxy: Tauri IPC or HTTP fetch
 export async function apiCall(cmd: string, args: Record<string, any>): Promise<any> {
   if (cmd === 'get_video_stream') {
@@ -31,6 +56,61 @@ export async function apiCall(cmd: string, args: Record<string, any>): Promise<a
     }
     return httpCall('update_identity', { uuid: args.uuid, metadataJson: JSON.stringify(metadata) })
   }
+  // run_cluster_agent 也沒有 Tauri command
+  if (cmd === 'run_cluster_agent') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // get_cluster_results 也沒有 Tauri command
+  if (cmd === 'get_cluster_results') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // get_similar_face_groups 也沒有 Tauri command
+  if (cmd === 'get_similar_face_groups') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // create_pending_identity 也沒有 Tauri command
+  if (cmd === 'create_pending_identity') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // bind_speakers 也沒有 Tauri command
+  if (cmd === 'bind_speakers') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // get_processor_json 也沒有 Tauri command
+  if (cmd === 'get_processor_json') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // get_trace_profile / get_trace_profile_file 也沒有 Tauri command
+  if (cmd === 'get_trace_profile' || cmd === 'get_trace_profile_file') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
+  // get_file_traces 也沒有 Tauri command
+  if (cmd === 'get_file_traces') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data, args)
+  }
+  // search_file_faces 也沒有 Tauri command
+  if (cmd === 'search_file_faces') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data, args)
+  }
+  // get_face_landmarks 也沒有 Tauri command
+  if (cmd === 'get_face_landmarks') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data, args)
+  }
+  // Admin data comes from MarkBase API (/api/v2/admin/*) in all modes — no Tauri command
+  if (cmd === 'get_system_stats' || cmd === 'list_admin_users' || cmd === 'list_shares' || cmd === 'validate_system_stats') {
+    const data = await httpCall(cmd, args)
+    return transformResponse(cmd, data)
+  }
   if (isTauri) {
     try {
       const data = await invoke(cmd, args)
@@ -47,36 +127,91 @@ export async function apiCall(cmd: string, args: Record<string, any>): Promise<a
   return transformResponse(cmd, data)
 }
 
+const DEFAULT_TIMEOUT = 30000
+const UNREGISTER_TIMEOUT = 200000  // 200s for large file unregister (was timing out at 30s)
+
+export enum ApiErrorType {
+  NETWORK = 'network',
+  TIMEOUT = 'timeout',
+  SERVER = 'server',
+  VALIDATION = 'validation',
+  NOT_FOUND = 'not_found',
+}
+
+export class ApiError extends Error {
+  type: ApiErrorType
+  status?: number
+  constructor(type: ApiErrorType, message: string, status?: number) {
+    super(message)
+    this.type = type
+    this.status = status
+  }
+}
+
 async function httpCall(cmd: string, args: Record<string, any>, retries = 3): Promise<any> {
   const base = getApiBase()
-  const { url, method, body } = buildHttpRequest(cmd, args)
-  const fullUrl = `${base}${url}`
+  const { url, method, body, timeout: requestTimeout } = buildHttpRequest(cmd, args)
+  const fullUrl = url.startsWith('http://') || url.startsWith('https://') ? url : `${base}${url}`
+
+  const controller = new AbortController()
+  const timeout = setTimeout(() => controller.abort(), requestTimeout ?? DEFAULT_TIMEOUT)
 
   let response: Response | null = null
-  for (let i = 0; i < retries; i++) {
-    try {
-      response = await fetch(fullUrl, {
-        method,
-        headers: body ? { 'Content-Type': 'application/json' } : {},
-        body: body ? JSON.stringify(body) : undefined,
-      })
-      if (response.ok || response.status < 500) break
-    } catch (e: any) {
-      if (i < retries - 1) {
-        await new Promise(r => setTimeout(r, 1000 * (i + 1)))
-        continue
+  try {
+    for (let i = 0; i < retries; i++) {
+      try {
+        response = await fetch(fullUrl, {
+          method,
+          headers: body ? { 'Content-Type': 'application/json' } : {},
+          body: body ? JSON.stringify(body) : undefined,
+          signal: controller.signal,
+        })
+        if (response.ok) break
+        if (response.status >= 500 && i < retries - 1) {
+          await new Promise(r => setTimeout(r, 1000 * Math.pow(2, i)))
+          response = null
+          continue
+        }
+        break
+      } catch (e: any) {
+        if (e.name === 'AbortError') {
+          throw new ApiError(ApiErrorType.TIMEOUT, `Request timeout: ${cmd}`)
+        }
+        if (i < retries - 1) {
+          await new Promise(r => setTimeout(r, 1000 * Math.pow(2, i)))
+          continue
+        }
+        throw new ApiError(ApiErrorType.NETWORK, `Network error: ${e.message}`)
       }
-      throw e
     }
+  } finally {
+    clearTimeout(timeout)
+  }
+
+  if (!response) throw new ApiError(ApiErrorType.NETWORK, 'No response')
+
+  if (!response.ok) {
+    const status = response.status
+    const errorText = await response.text().catch(() => 'Unknown error')
+    if (status === 404) {
+      throw new ApiError(ApiErrorType.NOT_FOUND, errorText, status)
+    }
+    if (status >= 400 && status < 500) {
+      throw new ApiError(ApiErrorType.VALIDATION, errorText, status)
+    }
+    throw new ApiError(ApiErrorType.SERVER, errorText, status)
+  }
+
+  if (response.status === 204) {
+    return { success: true }
   }
-  if (!response) throw new Error('No response')
 
   const contentType = response.headers.get('content-type') || ''
 
   if (contentType.includes('image/') || contentType.includes('video/') || contentType.includes('octet-stream')) {
     const buffer = await response.arrayBuffer()
     const bytes = new Uint8Array(buffer)
-    if (cmd === 'get_identity_profile' || cmd === 'get_thumbnail' || cmd === 'get_face_thumbnail') {
+    if (cmd === 'get_identity_profile' || cmd === 'get_thumbnail' || cmd === 'get_face_thumbnail' || cmd === 'get_file_thumbnail_by_path') {
       const ext = contentType.includes('png') ? 'png' : 'jpeg'
       const blob = new Blob([bytes], { type: `image/${ext}` })
       return new Promise<string>((resolve, reject) => {
@@ -103,7 +238,7 @@ async function httpCall(cmd: string, args: Record<string, any>, retries = 3): Pr
   }
 }
 
-function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string; method: string; body?: any } {
+function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string; method: string; body?: any; timeout?: number } {
   const a = args
 
   switch (cmd) {
@@ -115,6 +250,12 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
     case 'get_people': {
       return { url: `/api/v1/identities?page=${a.page || 1}&per_page=${a.perPage || 100}`, method: 'GET' }
     }
+    case 'get_file_identities': {
+      return { url: `/api/v1/file/${a.fileUuid}/identities?page=${a.page || 1}&page_size=${a.pageSize || 50}`, method: 'GET' }
+    }
+    case 'get_identity_files': {
+      return { url: `/api/v1/identity/${a.uuid}/files?page=${a.page || 1}&page_size=${a.pageSize || 20}`, method: 'GET' }
+    }
     case 'get_faces': {
       return { url: `/api/v1/identity/${a.uuid}/faces?page_size=${a.perPage || 100}`, method: 'GET' }
     }
@@ -124,7 +265,9 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
       return { url, method: 'GET' }
     }
     case 'get_face_candidates': {
-      return { url: `/api/v1/faces/candidates?page=${a.page || 1}&page_size=${a.perPage || 100}`, method: 'GET' }
+      let url = `/api/v1/faces/candidates?page=${a.page || 1}&page_size=${a.perPage || 100}`
+      if (a.fileUuid) url += `&file_uuid=${a.fileUuid}`
+      return { url, method: 'GET' }
     }
     case 'get_unassigned_traces': {
       let url = `/api/v1/traces/unassigned?page=${a.page || 1}&page_size=${a.perPage || 20}`
@@ -139,16 +282,26 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
     }
 
     // --- Search APIs ---
+case 'search_keyword': {
+      return { url: '/api/v1/search/keyword', method: 'POST', body: { query: a.query, limit: a.limit || 20 } }
+    }
+    case 'search_semantic': {
+      return { url: '/api/v1/search/semantic', method: 'POST', body: { query: a.query, limit: a.limit || 20 } }
+    }
     case 'search_llm_smart': {
       return { url: '/api/v1/search/llm-smart', method: 'POST', body: { query: a.query, limit: a.limit || 20 } }
     }
+    case 'search_people': {
+      const params = new URLSearchParams()
+      if (a.query) params.set('query', a.query)
+      if (a.fileUuid) params.set('file_uuid', a.fileUuid)
+      if (a.limit) params.set('limit', String(a.limit))
+      return { url: `/api/v1/search/people?${params.toString()}`, method: 'GET' }
+    }
     case 'search_agents': {
       const body: any = { query: a.query }
       if (a.conversationId) body.conversation_id = a.conversationId
-      return { url: '/api/v1/agents/search', method: 'POST', body }
-    }
-    case 'search_identities': {
-      return { url: `/api/v1/identities/search?q=${encodeURIComponent(a.query)}&limit=${a.limit || 50}`, method: 'GET' }
+      return { url: '/api/v1/agents/search', method: 'POST', body, timeout: 180000 }
     }
 
     // --- Image APIs ---
@@ -166,12 +319,21 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
       if (a.bboxH != null) url += `&bbox_h=${a.bboxH}`
       return { url, method: 'GET' }
     }
+    case 'get_file_thumbnail_by_path': {
+      return { url: `/api/v1/file/thumbnail?path=${encodeURIComponent(a.path)}&frame=${a.frame || 30}`, method: 'GET' }
+    }
+    case 'regenerate_trace_thumbnail': {
+      return { url: `/api/v1/file/${a.fileUuid}/trace/${a.traceId}/regenerate-thumbnail`, method: 'POST' }
+    }
 
     // --- Video API ---
     case 'get_video_stream': {
-      let url = `/api/v1/file/${a.uuid}/video?start_time=${a.startTime}&end_time=${a.endTime}`
-      if (a.startFrame != null) url += `&start_frame=${a.startFrame}`
-      if (a.endFrame != null) url += `&end_frame=${a.endFrame}`
+      let url = `/api/v1/file/${a.uuid}/video`
+      const params: string[] = []
+      if (a.startFrame != null) params.push(`start_frame=${a.startFrame}`)
+      if (a.endFrame != null) params.push(`end_frame=${a.endFrame}`)
+      if (a.original === true) params.push('original=true')
+      if (params.length) url += '?' + params.join('&')
       return { url, method: 'GET' }
     }
 
@@ -195,6 +357,14 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
     case 'upload_profile_image': {
       return { url: `/api/v1/identity/${a.uuid}/profile-image`, method: 'POST' }
     }
+    case 'set_profile_from_face': {
+      const body: any = { file_uuid: a.fileUuid }
+      if (a.faceId) body.face_id = a.faceId
+      if (a.id) body.id = a.id
+      if (a.traceId) body.trace_id = a.traceId
+      if (a.frameNumber) body.frame_number = a.frameNumber
+      return { url: `/api/v1/identity/${a.uuid}/profile-image/from-face`, method: 'POST', body }
+    }
     case 'delete_identity': {
       return { url: `/api/v1/identity/${a.uuid}`, method: 'DELETE' }
     }
@@ -208,6 +378,75 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
     case 'merge_identities': {
       return { url: `/api/v1/identity/${a.uuid}/mergeinto`, method: 'POST', body: { into_uuid: a.intoUuid } }
     }
+
+    // --- Trace Management ---
+    case 'list_traces': {
+      return { url: `/api/v1/file/${a.file_uuid}/traces`, method: 'POST' }
+    }
+    case 'get_file_traces': {
+      const fu = a.fileUuid ?? a.file_uuid
+      return { url: `/api/v1/file/${fu}/traces`, method: 'POST', body: { page: a.page || 1, page_size: a.page_size || 3000, limit: a.limit || 3000 } }
+    }
+    case 'search_file_faces': {
+      const fu = a.fileUuid ?? a.file_uuid
+      const params = new URLSearchParams()
+      if (a.q) params.set('q', a.q)
+      params.set('page', String(a.page || 1))
+      params.set('page_size', String(a.perPage || 20))
+      if (a.binding) params.set('binding', a.binding)
+      if (a.minConfidence != null) params.set('min_confidence', String(a.minConfidence))
+      return { url: `/api/v1/file/${fu}/faces/search?${params.toString()}`, method: 'GET' }
+    }
+    case 'get_trace_profile': {
+      const params = new URLSearchParams()
+      const fu = a.file_uuid ?? a.fileUuid
+      const tid = a.trace_id ?? a.traceId
+      if (fu) params.set('file_uuid', fu)
+      if (tid != null) params.set('trace_id', String(tid))
+      return { url: `/api/v1/trace-profile?${params.toString()}`, method: 'GET' }
+    }
+    case 'get_trace_profile_file': {
+      const params = new URLSearchParams()
+      const fu = a.file_uuid ?? a.fileUuid
+      const tid = a.trace_id ?? a.traceId
+      if (fu) params.set('file_uuid', fu)
+      if (tid != null) params.set('trace_id', String(tid))
+      return { url: `/api/v1/trace-profile-file?${params.toString()}`, method: 'GET' }
+    }
+    case 'update_trace_profile': {
+      const body = a.body ?? {
+        file_uuid: a.file_uuid ?? a.fileUuid,
+        trace_id: a.trace_id ?? a.traceId,
+        ...Object.fromEntries(Object.entries(a).filter(([k]) => !['fileUuid','traceId','file_uuid','trace_id','body'].includes(k)))
+      }
+      return { url: '/api/v1/trace-profile', method: 'PUT', body }
+    }
+    case 'delete_trace': {
+      const body: any = { mode: a.mode ?? 'ungroup' }
+      if (a.mode === 'delete') {
+        if (a.hard_delete !== undefined) body.hard_delete = a.hard_delete
+      } else {
+        body.hard_delete = a.hard_delete ?? true
+      }
+      return { url: `/api/v1/file/${a.file_uuid}/trace/${a.trace_id}`, method: 'DELETE', body }
+    }
+    case 'restore_trace': {
+      return { url: `/api/v1/file/${a.file_uuid}/trace/${a.trace_id}/restore`, method: 'POST' }
+    }
+    case 'merge_trace': {
+      return { url: `/api/v1/file/${a.file_uuid}/trace/${a.source_id}/merge/${a.target_id}`, method: 'POST' }
+    }
+    case 'merge_groups': {
+      return {
+        url: `/api/v1/file/${a.fileUuid}/groups/merge`,
+        method: 'POST',
+        body: {
+          file_uuid: a.fileUuid,
+          source_groups: a.sourceGroups,
+          target_group_name: a.targetGroupName
+        }
+      }
+    }
     case 'bind_face': {
       const bindBody: any = { file_uuid: a.fileUuid }
       if (a.faceId) bindBody.face_id = a.faceId
@@ -222,6 +461,11 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
       return { url: `/api/v1/identity/${a.uuid}/unbind`, method: 'POST', body: unbindBody }
     }
 
+    // --- Trace Operations ---
+    case 'merge_traces': {
+      return { url: `/api/v1/file/${a.file_uuid}/trace/${a.source_trace_id}/merge/${a.target_trace_id}`, method: 'POST' }
+    }
+
     // --- Identity Undo/Redo ---
     case 'identity_undo': {
       const body: any = {}
@@ -277,16 +521,67 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
     }
 
     // --- File Operations ---
+    case 'get_health': {
+      return { url: '/api/v1/health', method: 'GET' }
+    }
+    case 'list_jobs': {
+      return { url: '/api/v1/jobs', method: 'POST', body: {} }
+    }
     case 'register_file': {
       return { url: '/api/v1/files/register', method: 'POST', body: { file_path: a.filePath } }
     }
+    case 'get_command_status': {
+      return { url: `/api/v1/command/${a.commandId}`, method: 'GET' }
+    }
     case 'process_file': {
       return { url: `/api/v1/file/${a.fileUuid}/process`, method: 'POST', body: { processors: a.processors } }
     }
+    case 're_scan_file': {
+      return { url: `/api/v1/re-scan`, method: 'POST', body: { file_uuid: a.fileUuid, auto_pipeline: a.autoPipeline ?? true } }
+    }
+    case 'get_identity_matches': {
+      return { url: `/api/v1/identity-matches?file_hash=${a.fileHash}`, method: 'GET' }
+    }
+    case 'run_cluster_agent': {
+      return { url: `/api/v1/file/${a.fileUuid}/cluster-agent`, method: 'POST', body: { confirm: true }, timeout: 600000 }
+    }
+    case 'get_cluster_results': {
+      return { url: `/api/v1/file/${a.fileHash}/json/face_cluster`, method: 'POST', body: {} }
+    }
+    case 'get_similar_face_groups': {
+      const params = new URLSearchParams()
+      if (a.traceIds) params.set('trace_ids', String(a.traceIds))
+      if (a.topK) params.set('top_k', String(a.topK))
+      if (a.minScore) params.set('min_score', String(a.minScore))
+      return { url: `/api/v1/file/${a.fileUuid}/face-groups/similar?${params.toString()}`, method: 'GET' }
+    }
+    case 'update_trace_profile_group': {
+      return { url: '/api/v1/trace-profile/group', method: 'PUT', body: { file_uuid: a.fileUuid, trace_ids: a.traceIds, name: a.name, key_frame: a.keyFrame, key_face: a.keyFace } }
+    }
+    case 'get_file_profile': {
+      return { url: `/api/v1/file-profile?file_uuid=${a.fileUuid}`, method: 'GET' }
+    }
+    case 'update_file_profile': {
+      const body: any = { file_uuid: a.fileUuid, file_path: a.filePath, file_name: a.fileName }
+      if (a.faceFilter != null) body.face_filter = a.faceFilter
+      return { url: '/api/v1/file-profile', method: 'PUT', body }
+    }
+    case 'get_processor_json': {
+      return { url: `/api/v1/processor-json?file_hash=${a.fileHash}&processor=${a.processor}`, method: 'GET' }
+    }
+    case 'get_file_processor_json': {
+      return { url: `/api/v1/file/${a.fileUuid}/json/${a.processor}`, method: 'POST', body: {} }
+    }
+    case 'create_pending_identity': {
+      return { url: '/api/v1/identities/pending', method: 'POST', body: { file_uuid: a.fileUuid, trace_id: a.traceId, face_id: a.faceId, cluster_id: a.clusterId, trace_count: a.traceCount } }
+    }
+    case 'bind_speakers': {
+      return { url: `/api/v1/file/${a.fileUuid}/bind-speakers`, method: 'POST' }
+    }
     case 'unregister_file': {
       const body: any = { file_uuid: a.fileUuid }
       if (a.deleteOutputFiles != null) body.delete_output_files = a.deleteOutputFiles
-      return { url: '/api/v1/unregister', method: 'POST', body }
+      return { url: '/api/v1/unregister', method: 'POST', body, timeout: UNREGISTER_TIMEOUT }
     }
     case 'ingest_file': {
       return { url: `/api/v1/file/${a.fileUuid}/checkin`, method: 'POST' }
@@ -305,6 +600,12 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
     case 'get_progress': {
       return { url: `/api/v1/progress/${a.fileUuid}`, method: 'POST', body: {} }
     }
+    case 'get_pipeline_stats': {
+      return { url: `/api/v1/stats/pipeline/${a.fileUuid}`, method: 'GET' }
+    }
+    case 'get_file_stats': {
+      return { url: `/api/v1/stats/file/${a.fileUuid}`, method: 'GET' }
+    }
 
     // --- Search History ---
     case 'get_search_history': {
@@ -335,6 +636,70 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
       return { url: `/api/v1/bookmarks/${a.id}`, method: 'DELETE' }
     }
 
+    // --- Video Marks ---
+    case 'get_video_marks': {
+      return { url: `/api/v1/video-marks?file_uuid=${encodeURIComponent(a.fileUuid)}`, method: 'GET' }
+    }
+    case 'save_video_mark': {
+      return { url: '/api/v1/video-marks', method: 'POST', body: { file_uuid: a.fileUuid, tag: a.tag, start_frame: a.startFrame, end_frame: a.endFrame, note: a.note } }
+    }
+    case 'delete_video_mark': {
+      return { url: `/api/v1/video-mark/${a.id}`, method: 'DELETE' }
+    }
+
+    // --- Service Management ---
+    case 'stop_service': {
+      const mbUrl = detectBaseUrl()
+      return { url: `${mbUrl}/api/v2/service/stop`, method: 'POST', body: { name: a.name } }
+    }
+    case 'start_service': {
+      const mbUrl = detectBaseUrl()
+      return { url: `${mbUrl}/api/v2/service/start`, method: 'POST', body: { name: a.name } }
+    }
+
+    // --- Admin Panel ---
+    case 'get_system_stats':
+      return { url: '/api/v2/admin/system-stats', method: 'GET' }
+    case 'validate_system_stats': {
+      let url = '/api/v1/system-stats/validate'
+      if (a.layers) url += `?layers=${a.layers}`
+      return { url, method: 'GET' }
+    }
+    case 'list_admin_users':
+      return { url: '/api/v2/admin/users', method: 'GET' }
+    case 'list_shares':
+      return { url: '/api/v2/admin/shares', method: 'GET' }
+
+    // --- Pose & Appearance ---
+    case 'get_pose': {
+      let url = `/api/v1/file/${a.fileUuid}/pose?frame=${a.frame}`
+      if (a.bboxX != null) url += `&bbox_x=${a.bboxX}`
+      if (a.bboxY != null) url += `&bbox_y=${a.bboxY}`
+      if (a.bboxW != null) url += `&bbox_w=${a.bboxW}`
+      if (a.bboxH != null) url += `&bbox_h=${a.bboxH}`
+      return { url, method: 'GET' }
+    }
+    case 'get_appearance': {
+      let url = `/api/v1/file/${a.fileUuid}/appearance?frame=${a.frame}`
+      if (a.bboxX != null) url += `&bbox_x=${a.bboxX}`
+      if (a.bboxY != null) url += `&bbox_y=${a.bboxY}`
+      if (a.bboxW != null) url += `&bbox_w=${a.bboxW}`
+      if (a.bboxH != null) url += `&bbox_h=${a.bboxH}`
+      return { url, method: 'GET' }
+    }
+    case 'get_face_landmarks': {
+      let url = `/api/v1/file/${a.fileUuid}/face-landmarks?frame=${a.frame}`
+      if (a.bboxX != null) url += `&bbox_x=${a.bboxX}`
+      if (a.bboxY != null) url += `&bbox_y=${a.bboxY}`
+      if (a.bboxW != null) url += `&bbox_w=${a.bboxW}`
+      if (a.bboxH != null) url += `&bbox_h=${a.bboxH}`
+      return { url, method: 'GET' }
+    }
+
+    case 'sync_file_status': {
+      return { url: `/api/v1/file/${a.fileUuid}/sync-status`, method: 'POST' }
+    }
+
     default:
       throw new Error(`Unknown command: ${cmd}`)
   }
@@ -342,7 +707,7 @@ function buildHttpRequest(cmd: string, args: Record<string, any>): { url: string
 
 // Transform HTTP response to match Tauri invoke format
 // Some endpoints need data reshaping to match what the Rust commands return
-export function transformResponse(cmd: string, data: any): any {
+export function transformResponse(cmd: string, data: any, args?: Record<string, any>): any {
   switch (cmd) {
     case 'get_files': {
       const files = data.files || data.data || data || []
@@ -354,8 +719,9 @@ export function transformResponse(cmd: string, data: any): any {
         modified_time: f.modified_time || '',
         isRegistered: f.isRegistered ?? f.is_registered ?? false,
         status: f.status || '',
+        status_updated_at: f.status_updated_at || null,
         registrationTime: f.registration_time || null,
-        ingested: f.ingested ?? (f.status === 'completed'),
+        ingested: f.ingested ?? ['completed','keyword_ready','semantic_ready','face_mgmt_ready','agent_ready'].includes(f.status),
       }))
     }
     case 'get_people': {
@@ -367,8 +733,13 @@ export function transformResponse(cmd: string, data: any): any {
         status: p.status || p.metadata?.status || 'pending',
         metadata: p.metadata || {},
         file_uuids: p.file_uuids || [],
+        source: p.source || '',
+        tmdb_id: p.tmdb_id ?? null,
       }))
     }
+    case 'get_file_identities': {
+      return data
+    }
     case 'get_faces': {
       const faces = data.data || data.faces || data || []
       return faces.map((f: any) => ({
@@ -409,7 +780,7 @@ export function transformResponse(cmd: string, data: any): any {
         bbox: c.bbox ? { x: c.bbox.x, y: c.bbox.y, width: c.bbox.width, height: c.bbox.height } : null,
       }))
     }
-case 'get_unassigned_traces': {
+ case 'get_unassigned_traces': {
       const traces = data.traces || data.data || []
       return {
         total: data.total || traces.length || 0,
@@ -423,6 +794,10 @@ case 'get_unassigned_traces': {
           best_face_frame: t.best_face_frame || 1,
           best_face_confidence: t.best_face_confidence || 1,
           best_face_bbox: t.best_face_bbox ? { x: t.best_face_bbox.x, y: t.best_face_bbox.y, width: t.best_face_bbox.width, height: t.best_face_bbox.height } : null,
+          best_face_capture_quality: t.best_capture_quality ?? null,
+          best_face_eye_ratio: t.best_face_eye_ratio ?? null,
+          best_face_nose_ratio: t.best_face_nose_ratio ?? null,
+          best_face_pose_score: t.best_face_pose_score ?? null,
         })),
       }
     }
@@ -435,6 +810,52 @@ case 'get_unassigned_traces': {
         })),
       }
     }
+    case 'get_file_traces': {
+      const traces = data.traces || data.data || []
+      const fu = args?.fileUuid ?? args?.file_uuid ?? ''
+      return {
+        total: data.total_traces || traces.length || 0,
+        traces: traces.map((t: any) => ({
+          trace_id: t.trace_id,
+          file_uuid: t.file_uuid || fu,
+          face_count: t.face_count || 0,
+          frame_count: t.face_count || 0,
+          start_frame: t.start_frame || 0,
+          end_frame: t.end_frame || 1,
+          start_time: t.start_time || 0,
+          end_time: t.end_time || 0,
+          duration_sec: t.duration_sec || 0,
+          avg_confidence: t.avg_confidence || 0,
+          best_face_id: t.best_face_id ?? null,
+          best_face_frame: t.best_face_frame || 0,
+          best_face_confidence: t.best_face_confidence || 0,
+          best_face_bbox: t.best_face_bbox || null,
+          best_face_capture_quality: t.best_face_capture_quality ?? null,
+          avg_capture_quality: t.avg_capture_quality ?? null,
+          thumbnail_url: t.thumbnail_url || '',
+        })),
+      }
+    }
+    case 'search_file_faces': {
+      const items = data.data || data.traces || []
+      const fu = args?.fileUuid ?? args?.file_uuid ?? ''
+      return {
+        total: data.total || items.length || 0,
+        page: data.page || 1,
+        page_size: data.page_size || 20,
+        traces: items.map((t: any) => ({
+          trace_id: t.trace_id ?? 0,
+          file_uuid: t.file_uuid || fu,
+          name: t.name ?? null,
+          start_frame: t.start_frame || 0,
+          end_frame: t.end_frame || 1,
+          frame_count: t.frame_count || 0,
+          avg_confidence: t.avg_confidence || 0,
+          best_face_bbox: t.best_face_bbox ?? null,
+          thumbnail_url: t.thumbnail_url || '',
+        })),
+      }
+    }
     case 'search_llm_smart': {
       const results = data.results || data.data || data || []
       return results.map((r: any) => {
@@ -444,19 +865,19 @@ case 'get_unassigned_traces': {
         const asrLangProb = asr?.language_probability || 0
         
         let asrStatus: 'no_audio_track' | 'silent_audio' | 'has_transcript' | 'processing' = 'processing'
-        let asrMessage = '處理中'
+        let asrMessage = 'Processing'
         
         if (asrSegments.length === 0) {
           if (asrLang === '' && asrLangProb === 0) {
             asrStatus = 'no_audio_track'
-            asrMessage = '無音軌'
+            asrMessage = 'No Audio Track'
           } else {
             asrStatus = 'silent_audio'
-            asrMessage = asrLang ? `無語音 (${asrLang})` : '無語音'
+            asrMessage = asrLang ? `No Speech (${asrLang})` : 'No Speech'
           }
         } else {
           asrStatus = 'has_transcript'
-          asrMessage = `${asrSegments.length} 段語音 (${asrLang || 'unknown'})`
+          asrMessage = `${asrSegments.length} segments (${asrLang || 'unknown'})`
         }
         
         return {
@@ -475,6 +896,37 @@ case 'get_unassigned_traces': {
         }
       })
     }
+    case 'search_keyword': {
+      const results = data.results || data.data || data || []
+      return results.map((r: any) => ({
+        file_uuid: r.file_uuid || '',
+        start_time: r.start_time ?? 0,
+        end_time: r.end_time ?? 0,
+        start_frame: r.start_frame ?? 0,
+        end_frame: r.end_frame ?? 0,
+        summary: r.summary || r.raw_text || '',
+        similarity: r.similarity || 0,
+        file_name: r.file_name || null,
+        source_type: r.source_type || null,
+      }))
+    }
+    case 'search_semantic': {
+      const results = data.results || data.data || data || []
+      return results.map((r: any) => ({
+        file_uuid: r.file_uuid || '',
+        start_time: r.start_time ?? 0,
+        end_time: r.end_time ?? 0,
+        start_frame: r.start_frame ?? 0,
+        end_frame: r.end_frame ?? 0,
+        summary: r.summary || r.raw_text || '',
+        similarity: r.similarity || 0,
+        file_name: r.file_name || null,
+        source_type: r.source_type || null,
+      }))
+    }
+    case 'search_people': {
+      return data || { people: [] }
+    }
     case 'search_identities': {
       const results = data.results || data.data || data || []
       return results.map((r: any) => ({
@@ -493,11 +945,16 @@ case 'get_unassigned_traces': {
     case 'register_file': {
       return {
         success: data.success ?? false,
+        command_id: data.command_id ?? '',
+        status: data.status ?? '',
         file_uuid: data.file_uuid ?? '',
         file_name: data.file_name ?? '',
         message: data.message ?? '',
       }
     }
+    case 'get_command_status': {
+      return data || null
+    }
     case 'process_file': {
       return {
         success: data.success ?? false,
@@ -505,7 +962,53 @@ case 'get_unassigned_traces': {
         message: data.message ?? '',
       }
     }
-    case 'unregister_file':
+    case 'run_cluster_agent': {
+      return {
+        success: data.success ?? false,
+        file_uuid: data.file_uuid ?? '',
+        message: data.message ?? '',
+        clusters: data.clusters ?? 0,
+        total_traces: data.total_traces ?? 0,
+      }
+    }
+    case 'get_cluster_results': {
+      return data || null
+    }
+    case 'get_similar_face_groups': {
+      return data || null
+    }
+    case 'get_trace_profile': { return data || null }
+    case 'get_trace_profile_file': { return data || null }
+    case 'update_trace_profile': { return data || { success: true } }
+    case 'update_trace_profile_group': { return data || { success: true } }
+    case 'get_file_profile': { return data || null }
+    case 'update_file_profile': { return data || { success: true } }
+    case 'get_processor_json': {
+      return data || null
+    }
+    case 'bind_speakers': {
+      return {
+        success: data.success ?? false,
+        bindings: data.bindings ?? 0,
+        message: data.message ?? '',
+      }
+    }
+    case 'create_pending_identity': {
+      return {
+        success: data.success ?? false,
+        identity_uuid: data.identity_uuid ?? '',
+        identity_id: data.identity_id ?? 0,
+        message: data.message ?? '',
+      }
+    }
+    case 'unregister_file': {
+      return {
+        success: data.success ?? false,
+        command_id: data.command_id ?? '',
+        file_uuid: data.file_uuid ?? '',
+        message: data.message ?? '',
+      }
+    }
     case 'ingest_file':
     case 'checkout_file': {
       return {
@@ -518,6 +1021,7 @@ case 'get_unassigned_traces': {
     case 'upload_profile_image':
     case 'get_identity_profile':
     case 'get_face_thumbnail':
+    case 'get_file_thumbnail_by_path':
     case 'get_search_history':
     case 'save_search_history':
     case 'rename_search_history':
@@ -544,6 +1048,25 @@ case 'get_unassigned_traces': {
         name: respData.name ?? '',
       }
     }
+    case 'get_pipeline_stats':
+    case 'get_file_stats': {
+      return data
+    }
+    case 'get_pose':
+    case 'get_appearance':
+    case 'get_face_landmarks':
+      return data
+    case 'get_system_stats':
+    case 'list_shares':
+      return data
+    case 'list_admin_users': {
+      const users = data.users || data.data || data || []
+      return users.map((u: any) => ({
+        username: u.username || '',
+        homeDir: u.home_dir ?? u.homeDir ?? '',
+        status: u.status ?? 1,
+      }))
+    }
     default:
       return data
   }

src/api/params.ts

@@ -0,0 +1,33 @@
+export const PARAM_MAP: Record<string, string> = {
+  pageSize: 'page_size',
+  perPage: 'per_page',
+  fileUuid: 'file_uuid',
+  startTime: 'start_time',
+  endTime: 'end_time',
+  startFrame: 'start_frame',
+  endFrame: 'end_frame',
+  bboxX: 'bbox_x',
+  bboxY: 'bbox_y',
+  bboxW: 'bbox_w',
+  bboxH: 'bbox_h',
+  conversationId: 'conversation_id',
+  historyId: 'history_id',
+  mergeId: 'merge_id',
+  traceId: 'trace_id',
+  faceId: 'face_id',
+}
+
+export function toSnakeCase(key: string): string {
+  if (PARAM_MAP[key]) return PARAM_MAP[key]
+  return key.replace(/[A-Z]/g, (letter) => `_${letter.toLowerCase()}`)
+}
+
+export function mapParams(params: Record<string, any>): Record<string, any> {
+  const result: Record<string, any> = {}
+  for (const [key, value] of Object.entries(params)) {
+    if (value !== undefined && value !== null) {
+      result[toSnakeCase(key)] = value
+    }
+  }
+  return result
+}

src/api/types.ts

@@ -0,0 +1,59 @@
+export interface PoseKeypoint {
+  name: string
+  x: number
+  y: number
+  confidence?: number
+}
+
+export type PoseClass = 'standing' | 'sitting' | 'kneeling' | 'lying' | 'prone' | 'unknown'
+
+export interface PoseResponse {
+  frame: number
+  keypoints: PoseKeypoint[]
+  pose_class: PoseClass
+  confidence?: number
+}
+
+export interface DominantColor {
+  rgb: [number, number, number]
+  percentage?: number
+}
+
+export interface AppearanceResponse {
+  frame: number
+  dominant_colors: DominantColor[]
+  hsv_histogram?: number[][][]
+}
+
+export interface FaceBBox {
+  x: number
+  y: number
+  width: number
+  height: number
+  confidence: number
+}
+
+export interface FaceLandmarksResponse {
+  frame: number
+  x: number
+  y: number
+  width: number
+  height: number
+  confidence: number
+  pose_angle?: {
+    angle?: string
+    yaw?: number
+    pitch?: number
+    roll?: number
+  } | null
+  landmarks: {
+    left_eye?: number[][]
+    right_eye?: number[][]
+    nose?: number[][]
+  } | null
+  lips?: {
+    outer_lips?: number[][]
+    inner_lips?: number[][]
+  } | null
+  faces?: FaceBBox[]
+}

src/assets/momentry-base.css

@@ -1,15 +1,62 @@
+html, body {
+    background-color: var(--background-color) !important;
+    color: var(--text-primary);
+    font-family: 'DM Sans', 'Noto Sans TC', -apple-system, BlinkMacSystemFont, sans-serif;
+    margin: 0;
+}
+
 :root {
     --primary-color: #2563eb;
+    --primary-color-rgb: 37, 99, 235;
     --secondary-color: #64748b;
     --success-color: #22c55e;
     --warning-color: #f59e0b;
     --error-color: #ef4444;
-    --background-color: #f8fafc;
-    --card-background: #ffffff;
+    --background-color: #e8eaed;
+    --card-background: rgba(255, 255, 255, 0.92);
     --text-primary: #1e293b;
     --text-secondary: #64748b;
+    --border-color: rgba(0, 0, 0, 0.12);
+    --border-light: rgba(0, 0, 0, 0.08);
+    --border-dark: rgba(0, 0, 0, 0.16);
+    --hover-background: rgba(0, 0, 0, 0.06);
+    --input-background: rgba(255, 255, 255, 0.95);
+    --input-border: rgba(0, 0, 0, 0.1);
+    --danger-color: #d93025;
+    --danger-hover: #c5221f;
+    --danger-background: rgba(217, 48, 37, 0.08);
+    --success-text: #1e8e3e;
+    --warning-text: #e37400;
+    --muted-text: #9aa0a6;
     --border-radius: 8px;
-    --shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
+    --shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+[data-theme="dark"] {
+    --primary-color: #3b82f6;
+    --primary-color-rgb: 59, 130, 246;
+    --secondary-color: #94a3b8;
+    --success-color: #22c55e;
+    --warning-color: #f59e0b;
+    --error-color: #ef4444;
+    --background-color: #0f172a;
+    --card-background: rgba(30, 41, 59, 0.92);
+    --text-primary: #e2e8f0;
+    --text-secondary: #94a3b8;
+    --border-color: rgba(51, 65, 85, 0.5);
+    --border-light: rgba(51, 65, 85, 0.3);
+    --border-dark: #475569;
+    --hover-background: rgba(51, 65, 85, 0.4);
+    --input-background: rgba(30, 41, 59, 0.95);
+    --input-border: rgba(71, 85, 105, 0.5);
+    --danger-color: #ef4444;
+    --danger-hover: #dc2626;
+    --danger-background: rgba(69, 10, 10, 0.4);
+    --success-text: #22c55e;
+    --warning-text: #f59e0b;
+    --muted-text: #64748b;
+    --border-radius: 8px;
+    --shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
 }
 
 body {

src/assets/momentry-full.css

@@ -929,7 +929,7 @@ padding:0 14px 0 32px !important;  margin:2px 0 !important;
 .ms-ppl-strip-wrap { display: flex; align-items: center; gap: 10px; margin-bottom: 28px; }
 .ms-ppl-strip-add-btn { width: 52px; height: 52px; border-radius: 12px; border: 1.5px dashed #bdc1c6; background: #fff; font-size: 20px; color: #bdc1c6; display: grid; place-items: center; cursor: pointer; outline: none; flex-shrink: 0; transition: border-color .15s, color .15s; }
 .ms-ppl-strip-add-btn:hover { border-color: #202124; color: #202124; }
-.ms-ppl-face-strip { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; flex: 1; }
+.ms-ppl-face-strip { display: flex; gap: 10px; padding-bottom: 4px; scrollbar-width: thin; flex: 1; min-width: 0; overflow-x: auto; }
 .ms-ppl-strip-face { position: relative; flex-shrink: 0; cursor: pointer; }
 .ms-ppl-strip-face-img { width: 52px; height: 52px; border-radius: 12px; border: 2px solid transparent; background: #e8eaed; overflow: hidden; transition: border-color .15s; position: relative; }
 .ms-ppl-strip-face-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
@@ -984,7 +984,12 @@ padding:0 14px 0 32px !important;  margin:2px 0 !important;
 .ms-merge-footer { display: flex; justify-content: flex-end; gap: 10px; }
 
 .ms-modal-video { max-width: 720px; width: 95%; padding: 20px 24px 24px; text-align: left; background: #1a1a1a; }
-.ms-modal-video-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
+.ms-modal-video-header { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
+.ms-video-header-row { display: flex; align-items: center; justify-content: space-between; }
+.ms-video-file-name { font-size: 12px; font-weight: 500; color: var(--text-secondary); margin: 0; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ms-video-frame-info { font-size: 12px; color: var(--text-secondary); white-space: nowrap; flex-shrink: 0; }
+.ms-video-title-row { gap: 10px; }
+.ms-modal-video-close { border: none; background: transparent; font-size: 18px; color: #9aa0a6; cursor: pointer; padding: 0; line-height: 1; flex-shrink: 0; }
 .ms-modal-video-title { font-size: 14px; font-weight: 600; color: #e8eaed; }
 .ms-modal-video-close { border: none; background: transparent; font-size: 18px; color: #9aa0a6; cursor: pointer; padding: 0; line-height: 1; }
 .ms-modal-video-close:hover { color: #fff; }

src/assets/wordpress-exact.css

@@ -925,7 +925,11 @@ padding:0 14px 0 32px !important;  margin:2px 0 !important;
 .ms-ppl-strip-wrap { display: flex; align-items: center; gap: 10px; margin-bottom: 28px; }
 .ms-ppl-strip-add-btn { width: 52px; height: 52px; border-radius: 12px; border: 1.5px dashed #bdc1c6; background: #fff; font-size: 20px; color: #bdc1c6; display: grid; place-items: center; cursor: pointer; outline: none; flex-shrink: 0; transition: border-color .15s, color .15s; }
 .ms-ppl-strip-add-btn:hover { border-color: #202124; color: #202124; }
-.ms-ppl-face-strip { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; flex: 1; }
+.ms-ppl-face-strip { display: flex; gap: 10px; padding-bottom: 8px; scrollbar-width: thin; scrollbar-color: #b8bec6 transparent; flex: 1; min-width: 0; overflow-x: auto; }
+.ms-ppl-face-strip::-webkit-scrollbar { height: 8px; }
+.ms-ppl-face-strip::-webkit-scrollbar-track { background: transparent; }
+.ms-ppl-face-strip::-webkit-scrollbar-thumb { background: #b8bec6; border-radius: 999px; }
+.ms-ppl-face-strip::-webkit-scrollbar-thumb:hover { background: #8a919b; }
 .ms-ppl-strip-face { position: relative; flex-shrink: 0; cursor: pointer; }
 .ms-ppl-strip-face-img { width: 52px; height: 52px; border-radius: 12px; border: 2px solid transparent; background: #e8eaed; overflow: hidden; transition: border-color .15s; position: relative; }
 .ms-ppl-strip-face-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
@@ -980,7 +984,12 @@ padding:0 14px 0 32px !important;  margin:2px 0 !important;
 .ms-merge-footer { display: flex; justify-content: flex-end; gap: 10px; }
 
 .ms-modal-video { max-width: 720px; width: 95%; padding: 20px 24px 24px; text-align: left; background: #1a1a1a; }
-.ms-modal-video-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
+.ms-modal-video-header { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
+.ms-video-header-row { display: flex; align-items: center; justify-content: space-between; }
+.ms-video-file-name { font-size: 12px; font-weight: 500; color: var(--text-secondary); margin: 0; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.ms-video-frame-info { font-size: 12px; color: var(--text-secondary); white-space: nowrap; flex-shrink: 0; }
+.ms-video-title-row { gap: 10px; }
+.ms-modal-video-close { border: none; background: transparent; font-size: 18px; color: #9aa0a6; cursor: pointer; padding: 0; line-height: 1; flex-shrink: 0; }
 .ms-modal-video-title { font-size: 14px; font-weight: 600; color: #e8eaed; }
 .ms-modal-video-close { border: none; background: transparent; font-size: 18px; color: #9aa0a6; cursor: pointer; padding: 0; line-height: 1; }
 .ms-modal-video-close:hover { color: #fff; }

src/components/AgentTip.vue

@@ -0,0 +1,216 @@
+<template>
+  <transition name="slide-up">
+    <div class="agent-tip" v-if="showAgentTip">
+      <div class="agent-avatar">🤖</div>
+      <div class="agent-message">{{ agentTip }}</div>
+      <button class="agent-close" @click="showAgentTip = false">×</button>
+    </div>
+  </transition>
+  
+  <transition name="fade">
+    <div class="discovery-tip" v-if="discoveryTip">
+      <span class="discovery-icon">✨</span>
+      <span class="discovery-message">{{ discoveryTip }}</span>
+    </div>
+  </transition>
+  
+</template>
+
+<script setup lang="ts">
+import { showAgentTip, agentTip, discoveryTip } from '@/stores/agentStore'
+</script>
+
+<style scoped>
+.agent-tip {
+  position: fixed;
+  bottom: 20px;
+  right: 20px;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: white;
+  padding: 12px 20px;
+  border-radius: 12px;
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  max-width: 400px;
+  box-shadow: 0 4px 20px rgba(102, 126, 234, 0.3);
+  z-index: 9999;
+  animation: slideInUp 0.3s ease-out;
+}
+
+.agent-avatar {
+  font-size: 24px;
+}
+
+.agent-message {
+  flex: 1;
+  font-size: 14px;
+  line-height: 1.4;
+}
+
+.agent-close {
+  background: none;
+  border: none;
+  color: white;
+  font-size: 18px;
+  cursor: pointer;
+  opacity: 0.7;
+  transition: opacity 0.2s;
+}
+
+.agent-close:hover {
+  opacity: 1;
+}
+
+.discovery-tip {
+  position: fixed;
+  top: 80px;
+  right: 20px;
+  background: #f0f9ff;
+  border: 1px solid #0ea5e9;
+  color: #0c4a6e;
+  padding: 10px 16px;
+  border-radius: 8px;
+  font-size: 13px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  z-index: 9998;
+  animation: fadeIn 0.3s ease-out;
+}
+
+.discovery-icon {
+  font-size: 16px;
+}
+
+.welcome-guide {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 10000;
+  animation: fadeIn 0.3s ease-out;
+}
+
+.guide-content {
+  background: white;
+  padding: 32px 40px;
+  border-radius: 16px;
+  max-width: 500px;
+  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.2);
+}
+
+.guide-content h2 {
+  margin: 0 0 12px 0;
+  font-size: 24px;
+  color: #1f2937;
+}
+
+.guide-content > p {
+  color: #6b7280;
+  margin-bottom: 24px;
+}
+
+.guide-items {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+  margin-bottom: 24px;
+}
+
+.guide-item {
+  display: flex;
+  align-items: flex-start;
+  gap: 16px;
+}
+
+.guide-icon {
+  font-size: 32px;
+  flex-shrink: 0;
+}
+
+.guide-content-text h4 {
+  margin: 0 0 4px 0;
+  font-size: 16px;
+  color: #1f2937;
+}
+
+.guide-content-text p {
+  margin: 0;
+  color: #6b7280;
+  font-size: 14px;
+}
+
+.guide-actions {
+  display: flex;
+  justify-content: center;
+}
+
+.guide-btn {
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  color: white;
+  border: none;
+  padding: 12px 32px;
+  border-radius: 8px;
+  font-size: 16px;
+  cursor: pointer;
+  transition: transform 0.2s, box-shadow 0.2s;
+}
+
+.guide-btn:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
+}
+
+.slide-up-enter-active {
+  animation: slideInUp 0.3s ease-out;
+}
+
+.slide-up-leave-active {
+  animation: slideOutDown 0.3s ease-in;
+}
+
+.fade-enter-active, .fade-leave-active {
+  transition: opacity 0.3s;
+}
+
+.fade-enter-from, .fade-leave-to {
+  opacity: 0;
+}
+
+@keyframes slideInUp {
+  from {
+    transform: translateY(20px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+@keyframes slideOutDown {
+  from {
+    transform: translateY(0);
+    opacity: 1;
+  }
+  to {
+    transform: translateY(20px);
+    opacity: 0;
+  }
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+</style>

src/components/BuildVersion.vue

@@ -0,0 +1,70 @@
+<template>
+  <div v-if="isAdvanced" class="build-version" @click="copyInfo" :title="tooltip">{{ displayText }}</div>
+</template>
+
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
+import { useAdvancedMode } from '@/stores/advancedMode'
+import pkg from '../../package.json'
+
+const router = useRouter()
+const { isAdvanced } = useAdvancedMode()
+const build = __BUILD_VERSION__
+const shortDate = build.slice(0, 8)
+const appVersion = pkg.version
+
+const pageName = computed(() => {
+  const name = router.currentRoute.value.name
+  return typeof name === 'string' ? name : router.currentRoute.value.path
+})
+
+const displayText = computed(() => `v${appVersion}-${shortDate} | ${pageName.value}`)
+
+const tooltip = computed(() =>
+  `App: ${appVersion}\nBuild: ${build}\nPage: ${pageName.value}`
+)
+
+function copyInfo() {
+  const lines = [
+    '=== MOMENTRY STUDIO ===',
+    `App Version: ${appVersion}`,
+    `Build: ${build}`,
+    `Page: ${pageName.value}`,
+    `Route: ${router.currentRoute.value.path}`,
+    `Timestamp: ${new Date().toISOString()}`
+  ]
+  const text = lines.join('\n')
+  const ta = document.createElement('textarea')
+  ta.value = text
+  ta.style.position = 'fixed'
+  ta.style.left = '0'
+  ta.style.top = '0'
+  ta.style.width = '0'
+  ta.style.height = '0'
+  ta.style.opacity = '0'
+  document.body.appendChild(ta)
+  ta.focus()
+  ta.setSelectionRange(0, text.length)
+  const ok = document.execCommand('copy')
+  document.body.removeChild(ta)
+  if (!ok) window.prompt('Copy (Ctrl+C, Enter):', text)
+}
+</script>
+
+<style scoped>
+.build-version {
+  position: fixed;
+  top: 8px;
+  right: 8px;
+  font-size: 10px;
+  color: var(--text-secondary, #9aa0a6);
+  background: var(--bg-secondary, rgba(0,0,0,0.1));
+  padding: 2px 8px;
+  border-radius: 3px;
+  z-index: 9999;
+  font-family: monospace;
+  cursor: pointer;
+  white-space: nowrap;
+}
+</style>

src/components/FaceCard.vue

@@ -0,0 +1,195 @@
+<template>
+  <div 
+    class="face-card"
+    :class="{ 
+      'face-card-selected': selected,
+      'status-accept': face.filter_features.backend_filter_status === 'accept',
+      'status-reject': face.filter_features.backend_filter_status === 'reject',
+      'status-review': face.filter_features.backend_filter_status === 'review'
+    }"
+    @click="$emit('click', face)"
+  >
+    <!-- Status Badge -->
+    <div v-if="face.filter_features.backend_filter_status" class="status-badge" :class="face.filter_features.backend_filter_status">
+      {{ face.filter_features.backend_filter_status }}
+    </div>
+    
+    <!-- Face Info -->
+    <div class="face-info">
+      <div class="info-row">
+        <span class="info-label">Face ID:</span>
+        <span class="info-value">{{ face.face_id }}</span>
+      </div>
+      
+      <div class="info-row">
+        <span class="info-label">Frame:</span>
+        <span class="info-value">{{ face.frame }}</span>
+      </div>
+      
+      <div class="info-row">
+        <span class="info-label">Confidence:</span>
+        <span class="info-value">{{ (face.primary_confidence * 100).toFixed(1) }}%</span>
+      </div>
+      
+      <div class="info-row">
+        <span class="info-label">Size:</span>
+        <span class="info-value">{{ face.filter_features.bbox_size }}px</span>
+      </div>
+      
+      <div class="info-row">
+        <span class="info-label">Source:</span>
+        <span class="info-value source-badge" :class="face.primary_source">
+          {{ face.primary_source === 'apple_vision' ? 'AV' : 'MP' }}
+        </span>
+      </div>
+    </div>
+    
+    <!-- Checkbox for selection -->
+    <div v-if="showCheckbox" class="face-checkbox" @click.stop="$emit('select', face)">
+      <span v-if="selected">✓</span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { FaceMetadata } from '../composables/useFaceFilter';
+
+defineProps<{
+  face: FaceMetadata;
+  selected?: boolean;
+  showCheckbox?: boolean;
+}>();
+
+defineEmits<{
+  click: [face: FaceMetadata];
+  select: [face: FaceMetadata];
+}>();
+</script>
+
+<style scoped>
+.face-card {
+  position: relative;
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  padding: 10px;
+  background: var(--bg-color, #fff);
+  cursor: pointer;
+  transition: all 0.2s;
+  min-height: 120px;
+}
+
+.face-card:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+  border-color: var(--primary-color, #007bff);
+}
+
+.face-card-selected {
+  border-color: var(--primary-color, #007bff);
+  background: var(--selected-bg, #e3f2fd);
+}
+
+/* Status-based styling */
+.status-accept {
+  border-left: 3px solid #4caf50;
+}
+
+.status-reject {
+  border-left: 3px solid #f44336;
+  opacity: 0.7;
+}
+
+.status-review {
+  border-left: 3px solid #ff9800;
+}
+
+.status-badge {
+  position: absolute;
+  top: 8px;
+  right: 8px;
+  padding: 2px 8px;
+  border-radius: 12px;
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+}
+
+.status-badge.accept {
+  background: #e8f5e9;
+  color: #2e7d32;
+}
+
+.status-badge.reject {
+  background: #ffebee;
+  color: #c62828;
+}
+
+.status-badge.review {
+  background: #fff3e0;
+  color: #e65100;
+}
+
+.face-info {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.info-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 13px;
+}
+
+.info-label {
+  color: #666;
+  font-weight: 500;
+}
+
+.info-value {
+  color: #333;
+  font-weight: 600;
+}
+
+.source-badge {
+  padding: 2px 6px;
+  border-radius: 3px;
+  font-size: 11px;
+  font-weight: 700;
+}
+
+.source-badge.apple_vision {
+  background: #e3f2fd;
+  color: #1976d2;
+}
+
+.source-badge.mediapipe {
+  background: #f3e5f5;
+  color: #7b1fa2;
+}
+
+.face-checkbox {
+  position: absolute;
+  top: 8px;
+  left: 8px;
+  width: 20px;
+  height: 20px;
+  border: 2px solid var(--border-color, #ddd);
+  border-radius: 3px;
+  background: var(--bg-color, #fff);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+
+.face-checkbox:hover {
+  border-color: var(--primary-color, #007bff);
+}
+
+.face-checkbox span {
+  color: var(--primary-color, #007bff);
+  font-weight: bold;
+}
+</style>

src/components/FaceFilterPanel.vue

@@ -0,0 +1,575 @@
+<template>
+  <div class="face-filter-panel">
+    <!-- Toolbar Toggle -->
+    <div class="face-filter-toolbar">
+      <button 
+        class="face-filter-toggle-btn" 
+        :class="{ active: showPanel }"
+        @click="togglePanel"
+      >
+        🔍 Face Filter
+        <span class="toggle-dot" :class="{ on: showPanel }"></span>
+      </button>
+      
+      <!-- Stats Summary -->
+      <div v-if="stats" class="face-filter-stats-inline">
+        <span>Total: {{ stats.total }}</span>
+        <span>Filtered: {{ stats.filtered }}</span>
+        <span v-if="stats.removed > 0" class="removed">Removed: {{ stats.removed }}</span>
+      </div>
+    </div>
+    
+    <!-- Filter Panel -->
+    <div v-if="showPanel" class="face-filter-content">
+      <!-- Mode Selection -->
+      <div class="filter-row">
+        <label>Mode:</label>
+        <div class="mode-buttons">
+          <button 
+            class="mode-btn" 
+            :class="{ active: mode === 'instant' }"
+            @click="setMode('instant')"
+            title="Instant client-side filtering (5-10ms)"
+          >
+            Instant
+          </button>
+          <button 
+            class="mode-btn" 
+            :class="{ active: mode === 'backend' }"
+            @click="setMode('backend')"
+            title="Backend complex filtering (landmark, embedding, temporal)"
+          >
+            Backend
+          </button>
+          <button 
+            class="mode-btn" 
+            :class="{ active: mode === 'hybrid' }"
+            @click="setMode('hybrid')"
+            title="Hybrid: backend + instant filtering"
+          >
+            Hybrid
+          </button>
+        </div>
+      </div>
+      
+      <!-- Filter Controls -->
+      <div class="filter-row">
+        <label>Confidence:</label>
+        <input 
+          type="number" 
+          v-model.number="rules.min_confidence"
+          @change="onRuleChange"
+          min="0" 
+          max="1" 
+          step="0.05"
+          class="filter-input"
+          placeholder="Min confidence"
+        />
+        <span class="filter-hint">(0-1)</span>
+      </div>
+      
+      <div class="filter-row">
+        <label>Bbox Size:</label>
+        <input 
+          type="number" 
+          v-model.number="rules.min_bbox_size"
+          @change="onRuleChange"
+          min="0" 
+          step="10"
+          class="filter-input"
+          placeholder="Min size (px)"
+        />
+        <span class="filter-hint">(px)</span>
+      </div>
+      
+      <div class="filter-row">
+        <label>Source:</label>
+        <select v-model="rules.source" @change="onRuleChange" class="filter-select">
+          <option value="all">All</option>
+          <option value="apple_vision">Apple Vision</option>
+          <option value="mediapipe">MediaPipe</option>
+        </select>
+      </div>
+      
+      <div class="filter-row">
+        <label>Backend Status:</label>
+        <select v-model="rules.backend_status" @change="onRuleChange" class="filter-select">
+          <option value="all">All</option>
+          <option value="accept">Accept</option>
+          <option value="review">Review</option>
+          <option value="reject">Reject</option>
+        </select>
+      </div>
+      
+      <div class="filter-section">
+        <div class="section-title">Single Frame FS Settings</div>
+        
+        <div class="filter-row checkbox-row">
+          <label class="checkbox-label">
+            <input 
+              type="checkbox" 
+              v-model="singleFrameSettings.single_frame_trace_vlm_enabled"
+              @change="markModified"
+            />
+            VLM Processing
+          </label>
+          <div class="hint">Enable VLM for single-frame traces</div>
+        </div>
+        
+        <div class="filter-row checkbox-row">
+          <label class="checkbox-label">
+            <input 
+              type="checkbox" 
+              v-model="singleFrameSettings.single_frame_trace_group_enabled"
+              @change="markModified"
+            />
+            Face Groups
+          </label>
+          <div class="hint">Include single-frame traces in groups</div>
+        </div>
+        
+        <div class="filter-row checkbox-row">
+          <label class="checkbox-label">
+            <input 
+              type="checkbox" 
+              v-model="singleFrameSettings.single_frame_trace_unassigned_enabled"
+              @change="markModified"
+            />
+            Unassigned List
+          </label>
+          <div class="hint">Show single-frame traces in unassigned</div>
+        </div>
+        
+        <div class="filter-row checkbox-row">
+          <label class="checkbox-label">
+            <input 
+              type="checkbox" 
+              v-model="singleFrameSettings.single_trace_group_filter_enabled"
+              @change="markModified"
+            />
+            Single Trace Groups
+          </label>
+          <div class="hint">Filter auto-generated Person_N groups</div>
+        </div>
+        
+        <div class="section-actions">
+          <div class="auto-save-hint">
+            {{ singleFrameSettingsLoading ? '⏳ Saving...' : '✓ Auto-saved' }}
+          </div>
+          <button 
+            class="action-btn"
+            @click="handleResetSingleFrame"
+            :disabled="singleFrameSettingsLoading"
+          >
+            Reset to Default
+          </button>
+        </div>
+        
+        <div v-if="singleFrameSettingsError" class="error-message">
+          ❌ {{ singleFrameSettingsError }}
+        </div>
+      </div>
+      
+      <!-- Action Buttons -->
+      <div class="filter-actions">
+        <button 
+          class="action-btn action-btn-primary"
+          @click="handleApplyBackend"
+          :disabled="loading || mode === 'instant'"
+        >
+          {{ loading ? 'Applying...' : 'Apply Backend Rules' }}
+        </button>
+        <button 
+          class="action-btn"
+          @click="handleReset"
+        >
+          Reset
+        </button>
+      </div>
+      
+      <!-- Error Message -->
+      <div v-if="error" class="error-message">
+        ❌ {{ error }}
+      </div>
+      
+      <!-- Filter Stats (Backend Mode) -->
+      <div v-if="filterStats && (mode === 'backend' || mode === 'hybrid')" class="filter-stats">
+        <h4>Filter Statistics</h4>
+        <div class="stats-grid">
+          <div class="stat-item">
+            <label>Total Faces:</label>
+            <span>{{ filterStats.total_faces }}</span>
+          </div>
+          <div class="stat-item">
+            <label>Apple Vision:</label>
+            <span>{{ filterStats.by_category?.by_source?.apple_vision || 0 }}</span>
+          </div>
+          <div class="stat-item">
+            <label>MediaPipe:</label>
+            <span>{{ filterStats.by_category?.by_source?.mediapipe || 0 }}</span>
+          </div>
+          <div class="stat-item">
+            <label>MediaPipe Verified:</label>
+            <span>{{ filterStats.by_category?.by_quality?.mediapipe_verified || 0 }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref, watch, onBeforeUnmount } from 'vue';
+import { useFaceFilter, type QuickFilterRules } from '../composables/useFaceFilter';
+
+const props = defineProps<{
+  fileUuid: string;
+}>();
+
+const emit = defineEmits<{
+  (e: 'settings-updated'): void;
+}>();
+
+const {
+  mode,
+  rules,
+  filterResult,
+  filterStats,
+  loading,
+  error,
+  stats,
+  setMode,
+  updateRules,
+  applyBackendFilter,
+  resetToDefault,
+  singleFrameSettings,
+  singleFrameSettingsLoading,
+  singleFrameSettingsError,
+  singleFrameSettingsModified,
+  loadSingleFrameSettings,
+  resetSingleFrameSettings,
+  markSingleFrameSettingsModified,
+  cleanupAutoSave
+} = useFaceFilter();
+
+const showPanel = ref(false);
+
+function togglePanel() {
+  showPanel.value = !showPanel.value;
+}
+
+function onRuleChange() {
+  updateRules(rules.value);
+}
+
+async function handleApplyBackend() {
+  if (!props.fileUuid) return;
+  await applyBackendFilter(props.fileUuid, null);
+}
+
+function handleReset() {
+  resetToDefault();
+}
+
+function markModified() {
+  markSingleFrameSettingsModified();
+}
+
+function handleResetSingleFrame() {
+  resetSingleFrameSettings();
+}
+
+watch(() => props.fileUuid, (newUuid) => {
+  if (newUuid && showPanel.value) {
+    loadSingleFrameSettings(newUuid);
+  }
+}, { immediate: true });
+
+watch(showPanel, (show) => {
+  if (show && props.fileUuid) {
+    loadSingleFrameSettings(props.fileUuid);
+  }
+});
+
+watch(singleFrameSettingsModified, (newVal, oldVal) => {
+  if (oldVal === true && newVal === false) {
+    emit('settings-updated');
+  }
+});
+
+onBeforeUnmount(() => {
+  cleanupAutoSave();
+});
+
+// Expose for parent
+defineExpose({
+  showPanel,
+  stats
+});
+</script>
+
+<style scoped>
+.face-filter-panel {
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  background: var(--bg-color, #fff);
+  margin-bottom: 10px;
+}
+
+.face-filter-toolbar {
+  display: flex;
+  align-items: center;
+  gap: 15px;
+  padding: 8px 12px;
+  border-bottom: 1px solid var(--border-color, #ddd);
+}
+
+.face-filter-toggle-btn {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 12px;
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  background: var(--bg-color, #fff);
+  cursor: pointer;
+  font-size: 14px;
+  transition: all 0.2s;
+}
+
+.face-filter-toggle-btn:hover {
+  background: var(--hover-bg, #f5f5f5);
+}
+
+.face-filter-toggle-btn.active {
+  background: var(--primary-color, #007bff);
+  color: white;
+  border-color: var(--primary-color, #007bff);
+}
+
+.toggle-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: #ccc;
+  transition: background 0.2s;
+}
+
+.toggle-dot.on {
+  background: #4caf50;
+}
+
+.face-filter-stats-inline {
+  display: flex;
+  gap: 10px;
+  font-size: 13px;
+  color: #666;
+}
+
+.face-filter-stats-inline .removed {
+  color: #f44336;
+}
+
+.face-filter-content {
+  padding: 12px;
+}
+
+.filter-row {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 10px;
+}
+
+.filter-row label {
+  min-width: 120px;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.mode-buttons {
+  display: flex;
+  gap: 5px;
+}
+
+.mode-btn {
+  padding: 6px 12px;
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  background: var(--bg-color, #fff);
+  cursor: pointer;
+  font-size: 13px;
+  transition: all 0.2s;
+}
+
+.mode-btn:hover {
+  background: var(--hover-bg, #f5f5f5);
+}
+
+.mode-btn.active {
+  background: var(--primary-color, #007bff);
+  color: white;
+  border-color: var(--primary-color, #007bff);
+}
+
+.filter-input {
+  width: 100px;
+  padding: 4px 8px;
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  font-size: 14px;
+}
+
+.filter-select {
+  padding: 4px 8px;
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  font-size: 14px;
+  background: var(--bg-color, #fff);
+}
+
+.filter-hint {
+  font-size: 12px;
+  color: #999;
+}
+
+.filter-actions {
+  display: flex;
+  gap: 10px;
+  margin-top: 15px;
+  padding-top: 15px;
+  border-top: 1px solid var(--border-color, #ddd);
+}
+
+.action-btn {
+  padding: 8px 16px;
+  border: 1px solid var(--border-color, #ddd);
+  border-radius: 4px;
+  background: var(--bg-color, #fff);
+  cursor: pointer;
+  font-size: 14px;
+  transition: all 0.2s;
+}
+
+.action-btn:hover:not(:disabled) {
+  background: var(--hover-bg, #f5f5f5);
+}
+
+.action-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+.action-btn-primary {
+  background: var(--primary-color, #007bff);
+  color: white;
+  border-color: var(--primary-color, #007bff);
+}
+
+.action-btn-primary:hover:not(:disabled) {
+  background: var(--primary-hover, #0056b3);
+}
+
+.error-message {
+  margin-top: 10px;
+  padding: 8px 12px;
+  background: #ffebee;
+  border: 1px solid #f44336;
+  border-radius: 4px;
+  color: #c62828;
+  font-size: 13px;
+}
+
+.filter-stats {
+  margin-top: 15px;
+  padding-top: 15px;
+  border-top: 1px solid var(--border-color, #ddd);
+}
+
+.filter-stats h4 {
+  margin: 0 0 10px 0;
+  font-size: 14px;
+  font-weight: 600;
+}
+
+.stats-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  gap: 10px;
+}
+
+.stat-item {
+  display: flex;
+  justify-content: space-between;
+  padding: 6px 10px;
+  background: var(--hover-bg, #f5f5f5);
+  border-radius: 4px;
+  font-size: 13px;
+}
+
+.stat-item label {
+  color: #666;
+}
+
+.stat-item span {
+  font-weight: 600;
+}
+
+.filter-section {
+  margin-top: 16px;
+  padding-top: 16px;
+  border-top: 1px solid var(--border-color, #ddd);
+}
+
+.section-title {
+  font-size: 14px;
+  font-weight: 600;
+  margin-bottom: 12px;
+  color: var(--text-primary, #333);
+}
+
+.checkbox-row {
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 4px;
+  margin-bottom: 12px;
+}
+
+.checkbox-label {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.checkbox-label input[type="checkbox"] {
+  width: 16px;
+  height: 16px;
+  cursor: pointer;
+}
+
+.hint {
+  font-size: 12px;
+  color: #999;
+  margin-left: 24px;
+}
+
+.section-actions {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-top: 12px;
+}
+
+.auto-save-hint {
+  flex: 1;
+  font-size: 13px;
+  color: var(--text-muted, #666);
+  padding: 6px 12px;
+  background: var(--bg-color, #f9f9f9);
+  border-radius: 4px;
+  border: 1px solid var(--border-color, #e0e0e0);
+}
+</style>

src/composables/useDragSelect.ts

@@ -0,0 +1,149 @@
+import { ref, type Ref } from 'vue'
+
+export interface DragSelectBox {
+  x1: number
+  y1: number
+  x2: number
+  y2: number
+}
+
+export interface DragSelectOptions {
+  getSelected: () => string[]
+  setSelected: (keys: string[]) => void
+  keyOf?: (el: HTMLElement) => string
+  onBox?: (box: DragSelectBox | null) => void
+}
+
+const DRAG_THRESHOLD = 4
+
+function overlaps(ax1: number, ay1: number, ax2: number, ay2: number, bx1: number, by1: number, bx2: number, by2: number) {
+  return ax1 < bx2 && ax2 > bx1 && ay1 < by2 && ay2 > by1
+}
+
+export function useDragSelect(containerRef: Ref<HTMLElement | null>, opts: DragSelectOptions) {
+  const box = ref<DragSelectBox | null>(null)
+
+  function setBox(b: DragSelectBox | null) {
+    box.value = b
+    opts.onBox?.(b)
+  }
+
+  let startX = 0
+  let startY = 0
+  let curX = 0
+  let curY = 0
+  let moved = false
+  let lastWasDrag = false
+
+  function onMousedown(e: MouseEvent) {
+    if (e.button !== 0) return
+    if (e.ctrlKey || e.metaKey || e.shiftKey) return
+    const target = e.target as HTMLElement
+    if (target.closest('button, a, input, textarea, select, .ms-ppl-card-checkbox, .ms-fm-play-btn')) return
+
+    startX = curX = e.clientX
+    startY = curY = e.clientY
+    moved = false
+    lastWasDrag = false
+    setBox({ x1: startX, y1: startY, x2: startX, y2: startY })
+
+    window.addEventListener('mousemove', onMousemove)
+    window.addEventListener('mouseup', onMouseup)
+  }
+
+  function onMousemove(e: MouseEvent) {
+    curX = e.clientX
+    curY = e.clientY
+    if (!moved && Math.abs(curX - startX) < DRAG_THRESHOLD && Math.abs(curY - startY) < DRAG_THRESHOLD) {
+      setBox({ x1: startX, y1: startY, x2: startX, y2: startY })
+      return
+    }
+    if (!moved) {
+      moved = true
+      document.body.style.userSelect = 'none'
+    }
+    setBox({
+      x1: Math.min(startX, curX),
+      y1: Math.min(startY, curY),
+      x2: Math.max(startX, curX),
+      y2: Math.max(startY, curY),
+    })
+  }
+
+  function onMouseup(e: MouseEvent) {
+    window.removeEventListener('mousemove', onMousemove)
+    window.removeEventListener('mouseup', onMouseup)
+
+    if (!moved) {
+      setBox(null)
+      return
+    }
+    lastWasDrag = true
+    const rect = box.value
+    setBox(null)
+    if (document.body.style.userSelect === 'none') {
+      document.body.style.userSelect = ''
+    }
+
+    const container = containerRef.value
+    if (!container || !rect) {
+      return
+    }
+
+    const bx1 = rect.x1
+    const by1 = rect.y1
+    const bx2 = rect.x2
+    const by2 = rect.y2
+
+    const keyOf = opts.keyOf ?? ((el: HTMLElement) => el.dataset.dragKey || '')
+    const intersecting = new Set<string>()
+
+    const cards = container.querySelectorAll<HTMLElement>('[data-drag-key]')
+    cards.forEach((card) => {
+      const r = card.getBoundingClientRect()
+      if (overlaps(r.left, r.top, r.right, r.bottom, bx1, by1, bx2, by2)) {
+        const key = keyOf(card)
+        if (key) intersecting.add(key)
+      }
+    })
+
+    const prev = opts.getSelected()
+    if (e.shiftKey) {
+      const next = new Set(prev)
+      intersecting.forEach((k) => next.add(k))
+      opts.setSelected(Array.from(next))
+    } else if (e.ctrlKey || e.metaKey) {
+      const next = new Set(prev)
+      intersecting.forEach((k) => {
+        if (next.has(k)) next.delete(k)
+        else next.add(k)
+      })
+      opts.setSelected(Array.from(next))
+    } else {
+      opts.setSelected(Array.from(intersecting))
+    }
+  }
+
+  function onClickCapture(e: MouseEvent) {
+    if (lastWasDrag) {
+      e.preventDefault()
+      e.stopPropagation()
+      lastWasDrag = false
+    }
+  }
+
+  return {
+    box,
+    onMousedown,
+    onClickCapture,
+  }
+}
+
+export function dragSelectRectStyle(b: DragSelectBox) {
+  return {
+    left: b.x1 + 'px',
+    top: b.y1 + 'px',
+    width: Math.max(0, b.x2 - b.x1) + 'px',
+    height: Math.max(0, b.y2 - b.y1) + 'px',
+  }
+}

src/composables/useFaceFilter.ts

@@ -0,0 +1,527 @@
+import { ref, computed } from 'vue';
+
+// Types
+export interface FaceMetadata {
+  face_id: string;
+  frame: number;
+  primary_source: 'apple_vision' | 'mediapipe';
+  primary_confidence: number;
+  detection_sources: Array<{
+    source_type: string;
+    confidence: number;
+  }>;
+  filter_features: {
+    face_id: string;
+    frame: number;
+    bbox_size: number;
+    apple_vision_confidence: number;
+    mediapipe_confidence?: number;
+    eye_ratio?: number;
+    nose_ratio?: number;
+    pose_score?: number;
+    mediapipe_detected?: boolean;
+    mediapipe_iou?: number;
+    embedding_similarity?: number;
+    consecutive_frames?: number;
+    total_frames_detected?: number;
+    backend_filter_status?: 'accept' | 'reject' | 'review';
+  };
+}
+
+export interface QuickFilterRules {
+  min_confidence?: number;
+  max_confidence?: number;
+  min_bbox_size?: number;
+  max_bbox_size?: number;
+  source?: 'apple_vision' | 'mediapipe' | 'all';
+  backend_status?: 'accept' | 'reject' | 'review' | 'all';
+}
+
+export interface FilterResult {
+  total_faces: number;
+  passed: number;
+  filtered: number;
+  passed_faces: Array<{
+    face_id: string;
+    frame: number;
+    filter_result: {
+      overall_confidence: number;
+      recommendation: 'accept' | 'review' | 'reject';
+      reasons: string[];
+    };
+  }>;
+  filtered_faces: Array<{
+    face_id: string;
+    frame: number;
+    filter_result: {
+      overall_confidence: number;
+      recommendation: 'accept' | 'review' | 'reject';
+      reasons: string[];
+    };
+  }>;
+  filter_stats: {
+    landmark?: number;
+    mediapipe?: number;
+    embedding?: number;
+    temporal?: number;
+  };
+}
+
+export interface FilterStats {
+  total_faces: number;
+  by_category: {
+    total_faces: number;
+    by_source: {
+      apple_vision: number;
+      mediapipe: number;
+    };
+    by_quality: {
+      avg_eye_ratio?: number;
+      avg_nose_ratio?: number;
+      avg_pose_score?: number;
+      mediapipe_verified: number;
+      avg_embedding_similarity?: number;
+      avg_consecutive_frames?: number;
+    };
+  };
+}
+
+export interface SingleFrameFSSettings {
+  single_frame_trace_vlm_enabled: boolean;
+  single_frame_trace_group_enabled: boolean;
+  single_frame_trace_unassigned_enabled: boolean;
+  single_trace_group_filter_enabled: boolean;
+}
+
+export interface FileProfileResponse {
+  file_uuid: string;
+  file_name: string;
+  file_path: string;
+  status: string;
+  duration: number;
+  width: number;
+  height: number;
+  fps: number;
+  total_frames: number;
+  face_filter: SingleFrameFSSettings;
+}
+
+// Default rules
+const defaultRules: QuickFilterRules = {
+  min_confidence: 0.5,
+  min_bbox_size: 80,
+  source: 'all',
+  backend_status: 'accept'
+};
+
+const STORAGE_KEY = 'momentry_face_filter_preferences';
+
+// API helpers
+const apiBase = '/api/v1';
+
+async function fetchFaces(fileUuid: string, params?: { page?: number; page_size?: number; source?: string }) {
+  const queryParams = new URLSearchParams();
+  if (params?.page) queryParams.set('page', params.page.toString());
+  if (params?.page_size) queryParams.set('page_size', params.page_size.toString());
+  if (params?.source) queryParams.set('source', params.source);
+  
+  const response = await fetch(`${apiBase}/file/${fileUuid}/face-filter/faces?${queryParams}`);
+  if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+  return response.json();
+}
+
+async function applyFilter(fileUuid: string, rules?: any) {
+  const response = await fetch(`${apiBase}/file/${fileUuid}/face-filter/apply`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ rules: rules || null })
+  });
+  if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+  return response.json();
+}
+
+async function getFilterStats(fileUuid: string) {
+  const response = await fetch(`${apiBase}/file/${fileUuid}/face-filter/stats`);
+  if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+  return response.json();
+}
+
+async function getFaceReport(fileUuid: string, faceId: string) {
+  const response = await fetch(`${apiBase}/file/${fileUuid}/face-filter/${faceId}/report`);
+  if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+  return response.json();
+}
+
+async function getFileProfile(fileUuid: string): Promise<FileProfileResponse> {
+  const response = await fetch(`${apiBase}/file-profile?file_uuid=${fileUuid}`);
+  if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+  return response.json();
+}
+
+async function updateFileProfile(fileUuid: string, faceFilter: Partial<SingleFrameFSSettings>): Promise<boolean> {
+  const response = await fetch(`${apiBase}/file-profile`, {
+    method: 'PUT',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ file_uuid: fileUuid, face_filter: faceFilter })
+  });
+  return response.ok;
+}
+
+// Quick filter function (client-side)
+function quickFilter(faces: FaceMetadata[], rules: QuickFilterRules): FaceMetadata[] {
+  return faces.filter(face => {
+    // 1. Confidence 過濾
+    if (rules.min_confidence && face.primary_confidence < rules.min_confidence) {
+      return false;
+    }
+    if (rules.max_confidence && face.primary_confidence > rules.max_confidence) {
+      return false;
+    }
+    
+    // 2. Bbox size 過濾
+    if (rules.min_bbox_size && face.filter_features.bbox_size < rules.min_bbox_size) {
+      return false;
+    }
+    if (rules.max_bbox_size && face.filter_features.bbox_size > rules.max_bbox_size) {
+      return false;
+    }
+    
+    // 3. Source 過濾
+    if (rules.source && rules.source !== 'all' && face.primary_source !== rules.source) {
+      return false;
+    }
+    
+    // 4. Backend status 過濾
+    if (rules.backend_status && rules.backend_status !== 'all' && 
+        face.filter_features.backend_filter_status !== rules.backend_status) {
+      return false;
+    }
+    
+    return true;
+  });
+}
+
+// Hybrid filter function (backend + frontend)
+function hybridFilter(faces: FaceMetadata[], rules: QuickFilterRules): FaceMetadata[] {
+  // 1. 前端過濾
+  const frontendFiltered = quickFilter(faces, rules);
+  
+  // 2. 後端已標示 backend_filter_status
+  // 3. 兩條件 AND
+  return frontendFiltered.filter(face => 
+    face.filter_features.backend_filter_status === 'accept'
+  );
+}
+
+// Main composable
+export function useFaceFilter() {
+  const mode = ref<'instant' | 'backend' | 'hybrid'>('instant');
+  const rules = ref<QuickFilterRules>({ ...defaultRules });
+  const allFaces = ref<FaceMetadata[]>([]);
+  const filteredFaces = ref<FaceMetadata[]>([]);
+  const filterResult = ref<FilterResult | null>(null);
+  const filterStats = ref<FilterStats | null>(null);
+  const loading = ref(false);
+  const error = ref<string | null>(null);
+  
+  const singleFrameSettings = ref<SingleFrameFSSettings>({
+    single_frame_trace_vlm_enabled: true,
+    single_frame_trace_group_enabled: true,
+    single_frame_trace_unassigned_enabled: true,
+    single_trace_group_filter_enabled: true,
+  });
+  const singleFrameSettingsLoading = ref(false);
+  const singleFrameSettingsError = ref<string | null>(null);
+  const singleFrameSettingsModified = ref(false);
+  
+  const currentFileUuid = ref<string | null>(null);
+  let autoSaveTimer: ReturnType<typeof setTimeout> | null = null;
+  
+  // Computed stats
+  const stats = computed(() => ({
+    total: allFaces.value.length,
+    filtered: filteredFaces.value.length,
+    removed: allFaces.value.length - filteredFaces.value.length
+  }));
+  
+  // Load preferences from localStorage
+  function loadPreferences() {
+    try {
+      const stored = localStorage.getItem(STORAGE_KEY);
+      if (stored) {
+        const prefs = JSON.parse(stored);
+        mode.value = prefs.mode || 'instant';
+        rules.value = prefs.rules || { ...defaultRules };
+      }
+    } catch (err) {
+      console.error('Failed to load preferences:', err);
+    }
+  }
+  
+  // Save preferences to localStorage
+  function savePreferences() {
+    try {
+      localStorage.setItem(STORAGE_KEY, JSON.stringify({
+        mode: mode.value,
+        rules: rules.value
+      }));
+    } catch (err) {
+      console.error('Failed to save preferences:', err);
+    }
+  }
+  
+  // Initialize: load faces and apply filter
+  async function initialize(fileUuid: string) {
+    loading.value = true;
+    error.value = null;
+    
+    try {
+      // 1. 載入臉部元數據
+      const data = await fetchFaces(fileUuid, { page: 1, page_size: 1000 });
+      allFaces.value = data.data?.faces || data.faces || [];
+      
+      // 2. 載入後端過濾結果（混合模式需要）
+      if (mode.value === 'hybrid' || mode.value === 'backend') {
+        const result = await applyFilter(fileUuid, null);
+        filterResult.value = result;
+        
+        // 合併後端過濾結果到元數據
+        mergeBackendResults(result);
+      }
+      
+      // 3. 載入統計
+      filterStats.value = await getFilterStats(fileUuid);
+      
+      // 4. 套用過濾
+      applyLocalFilter();
+      
+      // 5. 載入偏好
+      loadPreferences();
+    } catch (err: any) {
+      error.value = err.message || 'Failed to initialize';
+      console.error('Failed to initialize face filter:', err);
+    } finally {
+      loading.value = false;
+    }
+  }
+  
+  // Merge backend filter results into metadata
+  function mergeBackendResults(result: FilterResult) {
+    result.passed_faces.forEach(face => {
+      const metadata = allFaces.value.find(f => f.face_id === face.face_id);
+      if (metadata) {
+        metadata.filter_features.backend_filter_status = face.filter_result.recommendation as any;
+      }
+    });
+    
+    result.filtered_faces.forEach(face => {
+      const metadata = allFaces.value.find(f => f.face_id === face.face_id);
+      if (metadata) {
+        metadata.filter_features.backend_filter_status = face.filter_result.recommendation as any;
+      }
+    });
+  }
+  
+  // Apply local filter based on mode
+  function applyLocalFilter() {
+    switch (mode.value) {
+      case 'instant':
+        filteredFaces.value = quickFilter(allFaces.value, rules.value);
+        break;
+      case 'backend':
+        filteredFaces.value = allFaces.value.filter(face => 
+          face.filter_features.backend_filter_status === 'accept'
+        );
+        break;
+      case 'hybrid':
+        filteredFaces.value = hybridFilter(allFaces.value, rules.value);
+        break;
+    }
+  }
+  
+  // Update rules and re-filter
+  function updateRules(newRules: Partial<QuickFilterRules>) {
+    rules.value = { ...rules.value, ...newRules };
+    applyLocalFilter();
+    savePreferences();
+  }
+  
+  // Change mode and re-filter
+  function setMode(newMode: 'instant' | 'backend' | 'hybrid') {
+    mode.value = newMode;
+    applyLocalFilter();
+    savePreferences();
+  }
+  
+  // Apply backend filter
+  async function applyBackendFilter(fileUuid: string, customRules?: any) {
+    loading.value = true;
+    error.value = null;
+    
+    try {
+      const result = await applyFilter(fileUuid, customRules);
+      filterResult.value = result;
+      
+      // 合併後端過濾結果到元數據
+      mergeBackendResults(result);
+      
+      // 重新套用過濾
+      applyLocalFilter();
+      
+      return result;
+    } catch (err: any) {
+      error.value = err.message || 'Failed to apply backend filter';
+      console.error('Failed to apply backend filter:', err);
+      return null;
+    } finally {
+      loading.value = false;
+    }
+  }
+  
+  // Get face report
+  async function getFaceReportData(fileUuid: string, faceId: string) {
+    try {
+      return await getFaceReport(fileUuid, faceId);
+    } catch (err: any) {
+      console.error('Failed to get face report:', err);
+      return null;
+    }
+  }
+  
+  // Refresh stats
+  async function refreshStats(fileUuid: string) {
+    try {
+      filterStats.value = await getFilterStats(fileUuid);
+    } catch (err: any) {
+      console.error('Failed to refresh stats:', err);
+    }
+  }
+  
+  // Reset to default
+  function resetToDefault() {
+    rules.value = { ...defaultRules };
+    applyLocalFilter();
+    savePreferences();
+  }
+  
+  async function loadSingleFrameSettings(fileUuid: string) {
+    singleFrameSettingsLoading.value = true;
+    singleFrameSettingsError.value = null;
+    
+    try {
+      currentFileUuid.value = fileUuid;
+      const profile = await getFileProfile(fileUuid);
+      singleFrameSettings.value = {
+        single_frame_trace_vlm_enabled: profile.face_filter.single_frame_trace_vlm_enabled ?? true,
+        single_frame_trace_group_enabled: profile.face_filter.single_frame_trace_group_enabled ?? true,
+        single_frame_trace_unassigned_enabled: profile.face_filter.single_frame_trace_unassigned_enabled ?? true,
+        single_trace_group_filter_enabled: profile.face_filter.single_trace_group_filter_enabled ?? true,
+      };
+      singleFrameSettingsModified.value = false;
+    } catch (err: any) {
+      singleFrameSettingsError.value = err.message || 'Failed to load settings';
+      console.error('Failed to load single frame settings:', err);
+    } finally {
+      singleFrameSettingsLoading.value = false;
+    }
+  }
+  
+  async function saveSingleFrameSettings(fileUuid: string): Promise<boolean> {
+    singleFrameSettingsLoading.value = true;
+    singleFrameSettingsError.value = null;
+    
+    try {
+      const success = await updateFileProfile(fileUuid, singleFrameSettings.value);
+      if (success) {
+        singleFrameSettingsModified.value = false;
+      }
+      return success;
+    } catch (err: any) {
+      singleFrameSettingsError.value = err.message || 'Failed to save settings';
+      console.error('Failed to save single frame settings:', err);
+      return false;
+    } finally {
+      singleFrameSettingsLoading.value = false;
+    }
+  }
+  
+  function autoSaveSettings() {
+    if (autoSaveTimer) {
+      clearTimeout(autoSaveTimer);
+    }
+    
+    autoSaveTimer = setTimeout(async () => {
+      if (currentFileUuid.value && singleFrameSettingsModified.value) {
+        const success = await saveSingleFrameSettings(currentFileUuid.value);
+        if (!success) {
+          console.error('Auto-save failed for single frame settings');
+        }
+      }
+      autoSaveTimer = null;
+    }, 500);
+  }
+  
+  function cleanupAutoSave() {
+    if (autoSaveTimer) {
+      clearTimeout(autoSaveTimer);
+      autoSaveTimer = null;
+    }
+  }
+  
+  function resetSingleFrameSettings() {
+    singleFrameSettings.value = {
+      single_frame_trace_vlm_enabled: true,
+      single_frame_trace_group_enabled: true,
+      single_frame_trace_unassigned_enabled: true,
+      single_trace_group_filter_enabled: true,
+    };
+    singleFrameSettingsModified.value = true;
+    autoSaveSettings();
+  }
+  
+  function markSingleFrameSettingsModified() {
+    singleFrameSettingsModified.value = true;
+    autoSaveSettings();
+  }
+  
+  return {
+    // State
+    mode,
+    rules,
+    allFaces,
+    filteredFaces,
+    filterResult,
+    filterStats,
+    loading,
+    error,
+    stats,
+    singleFrameSettings,
+    singleFrameSettingsLoading,
+    singleFrameSettingsError,
+    singleFrameSettingsModified,
+    currentFileUuid,
+    
+    // Actions
+    initialize,
+    updateRules,
+    setMode,
+    applyBackendFilter,
+    getFaceReportData,
+    refreshStats,
+    resetToDefault,
+    applyLocalFilter,
+    loadSingleFrameSettings,
+    saveSingleFrameSettings,
+    resetSingleFrameSettings,
+    markSingleFrameSettingsModified,
+    cleanupAutoSave,
+    
+    // API helpers (exposed for direct use)
+    fetchFaces,
+    applyFilter,
+    getFilterStats,
+    getFaceReport,
+    quickFilter,
+    hybridFilter
+  };
+}

src/composables/useTheme.ts

@@ -0,0 +1,12 @@
+import { useDark, useToggle } from '@vueuse/core'
+
+export const isDark = useDark({
+  selector: 'html',
+  attribute: 'data-theme',
+  valueDark: 'dark',
+  valueLight: 'light',
+})
+
+export const toggleDark = () => {
+  isDark.value = !isDark.value
+}

src/composables/useUndoRedo.ts

@@ -1,4 +1,5 @@
 import { reactive } from 'vue'
+import { useI18n } from 'vue-i18n'
 import { apiCall } from '@/api'
 import { invalidatePeople, ensurePeople } from '@/store'
 
@@ -29,6 +30,7 @@ interface ActionHistoryItem {
 }
 
 export function useUndoRedo() {
+  const { t } = useI18n()
   const counts = reactive<Record<string, HistoryCounts>>({})
   const mergeHistory = reactive<MergeHistoryItem[]>([])
   const recentActions = reactive<ActionHistoryItem[]>([])
@@ -82,7 +84,7 @@ export function useUndoRedo() {
       const patchItems = patchHist?.history || patchHist?.records || []
       for (const r of Array.isArray(patchItems) ? patchItems : []) {
         const op = r.operation ?? r.op ?? ''
-        const label = op === 'delete' ? '刪除人物' : op === 'update' ? '更新人物' : op
+        const label = op === 'delete' ? t('people.action.delete_person') : op === 'update' ? t('people.action.update_person') : op
         actions.push({
           type: op === 'delete' ? 'delete' : 'patch',
           label,
@@ -95,7 +97,7 @@ export function useUndoRedo() {
       const bindItems = bindHist?.history || bindHist?.records || []
       for (const r of Array.isArray(bindItems) ? bindItems : []) {
         const op = r.operation ?? r.op ?? ''
-        const label = op === 'bind' ? '綁定面部' : op === 'unbind' ? '解綁面部' : op === 'bind_trace' ? '綁定軌跡' : op
+        const label = op === 'bind' ? t('people.action.bind_face') : op === 'unbind' ? t('people.action.unbind_face') : op === 'bind_trace' ? t('people.action.bind_trace') : op
         actions.push({
           type: 'bind',
           label,

src/composables/useZIndex.ts

@@ -0,0 +1,35 @@
+import { ref, computed } from 'vue'
+
+let baseZIndex = 10000
+const stack = ref<string[]>([])
+
+export function useZIndex() {
+  const push = (id: string): number => {
+    if (!stack.value.includes(id)) {
+      stack.value.push(id)
+    }
+    return baseZIndex + stack.value.indexOf(id) * 10
+  }
+
+  const pop = (id: string) => {
+    const idx = stack.value.indexOf(id)
+    if (idx >= 0) {
+      stack.value.splice(idx, 1)
+    }
+  }
+
+  const current = computed(() => baseZIndex + stack.value.length * 10)
+
+  return { push, pop, current }
+}
+
+let globalZIndex = 10000
+
+export function getNextZIndex(): number {
+  globalZIndex += 10
+  return globalZIndex
+}
+
+export function resetZIndex() {
+  globalZIndex = 10000
+}

src/locales/en.json

@@ -0,0 +1,454 @@
+{
+  "common": {
+    "loading": "Loading...",
+    "error": "Error",
+    "success": "Success",
+    "cancel": "Cancel",
+    "confirm": "Confirm",
+    "delete": "Delete",
+    "save": "Save",
+    "edit": "Edit",
+    "search": "Search",
+    "back": "Back",
+    "close": "Close",
+    "play": "Play",
+    "logout": "Logout",
+    "login": "Login"
+  },
+  "library": {
+    "sort": {
+      "title": "Sort By",
+      "time_desc": "Time (Newest First)",
+      "time_asc": "Time (Oldest First)",
+      "size_desc": "Size (Largest First)",
+      "size_asc": "Size (Smallest First)",
+      "name_asc": "Name (A to Z)",
+      "name_desc": "Name (Z to A)"
+    },
+    "filter": {
+      "title": "Filter By",
+      "unregistered": "Unregistered",
+      "registered": "Registered",
+      "pending": "Pending",
+      "completed": "Completed",
+      "videos_only": "Videos Only",
+      "photos_only": "Photos Only"
+    },
+    "size": {
+      "title": "Size",
+      "min_mb": "Min MB",
+      "max_mb": "Max MB"
+    },
+    "duration": {
+      "title": "Video Duration",
+      "min_minutes": "Min Minutes",
+      "max_minutes": "Max Minutes"
+    },
+    "status": {
+      "files": "{count} files",
+      "registered": "Registered",
+      "unregistered": "Unregistered",
+      "pending": "Pending",
+      "preparing": "Preparing",
+      "processing": "Processing",
+      "completed": "Completed",
+      "scanning": "Scanning",
+      "ready": "Ready",
+      "keyword_ready": "Keyword Ready",
+      "semantic_ready": "Semantic Ready",
+      "face_mgmt_ready": "Face Mgmt Ready",
+      "agent_ready": "Agent Ready"
+    },
+    "thumbnail": {
+      "register_to_preview": "Register to see preview"
+    },
+    "context": {
+      "register_file": "Register File",
+      "process_file": "Process File",
+      "reprocess": "Reprocess",
+      "unregister": "Unregister",
+      "play_video": "Play Video",
+      "processor_selection": "Processor Selection",
+      "overall_progress": "Overall Progress",
+      "missing_file_path": "Missing file path",
+      "file_not_registered": "File not registered",
+      "select_processor": "Please select at least one processor",
+      "file_must_be_completed": "File must be completed first",
+      "face_deduplication": "Face Deduplication",
+      "qc_check": "QC Check"
+    },
+    "pipeline": {
+      "processors": "Processors",
+      "rule1_ingestion": "Rule1 Ingestion",
+      "face_tracing": "Face Tracing",
+      "tkg_nodes": "TKG Nodes",
+      "tkg_edges": "TKG Edges",
+      "rule2_ingestion": "Rule2 Ingestion"
+    },
+    "phase": {
+      "processor_output": "Rule1: Processor Output",
+      "postgresql_ingestion": "Rule1: PostgreSQL Ingestion",
+      "qdrant_ingestion": "Rule1: Qdrant Ingestion"
+    },
+    "action": {
+      "registering": "Registering...",
+      "registered": "Registered: {name}",
+      "registration_failed": "Registration failed: {message}",
+      "registration_error": "Registration error: {error}",
+      "processing": "Processing...",
+      "processing_started": "Processing started: {name}",
+      "processing_failed": "Processing failed: {message}",
+      "processing_error": "Processing error: {error}",
+      "removing": "Removing...",
+      "removed": "Removed: {name}",
+      "removal_failed": "Removal failed: {message}",
+      "removal_error": "Removal error: {error}",
+      "clear_filters": "Clear Filters"
+    },
+    "qc": {
+      "audio_info": "Audio Info",
+      "audio_track": "Audio Track",
+      "has_audio": "✓ Has Audio",
+      "no_audio": "✗ No Audio",
+      "speech": "Speech",
+      "has_speech": "✓ Has Speech",
+      "no_speech": "🔇 No Speech",
+      "language": "Language",
+      "sample_rate": "Sample Rate",
+      "uuid_label": "UUID:",
+      "track_processor_output": "Phase 1: Processor Output",
+      "track_ingestion": "Phase 2: Data Ingestion",
+      "track_status_change": "Final: Status Change",
+      "output_ingestion_done": "📥 Output + Ingestion Complete",
+      "items": "{count} items"
+    },
+    "refresh": "Refresh",
+    "refresh_status": "Refresh Status",
+    "confirm": {
+      "title_register": "📥 Register",
+      "title_process": "🔍 Deep Scan",
+      "title_rescan": "🔄 Re-scan",
+      "message_register": "File will be registered and processed with default settings.",
+      "message_register_no_scan": "Register only, no automatic scan.",
+      "message_process": "Processing will run on the selected processors using default settings.",
+      "message_rescan": "This will unregister → register → deep scan the file using selected processors.",
+      "cancel": "Cancel",
+      "proceed": "Proceed",
+      "rerun_processor": "Re-run {processor} for this file?",
+      "run_processor": "Run {processor} on {filename}?",
+      "unregister_title": "Unregister",
+      "unregister_message": "Unregister \"{filename}\"?\n\nThis will remove the file and its output data.",
+      "batch_unregister_message": "Unregister {count} files?\n\nThis will remove the files and their output data."
+    },
+    "processor": {
+      "started": "{processor} started",
+      "failed": "Failed: {message}",
+      "error": "Error: {message}",
+      "no_file": "Error: No file selected",
+      "vlm_failed": "Failed to trigger VLM summary: {message}",
+      "pipeline_qc": "Pipeline QC"
+    },
+    "settings": {
+      "auto_scan": "Auto deep scan after registration"
+    }
+  },
+  "people": {
+    "toolbar": {
+      "all_files": "All Files",
+      "view_all_people": "View All People",
+      "view_starred_people": "View Starred People",
+      "refresh": "Refresh",
+      "pending_people": "People",
+      "skipped_people": "Skipped People",
+      "pending_faces": "Faces",
+      "face_group": "Face Group"
+    },
+    "section": {
+      "known_people": "Known People",
+      "pending_people": "People",
+      "skipped_people": "Skipped People",
+      "pending_faces": "Faces",
+      "face_group": "Face Group",
+      "unassigned": "Unassigned"
+    },
+    "sort": {
+      "title": "Sort By",
+      "recent": "Recently Viewed",
+      "file_name": "File Name",
+      "name_az": "Name (A to Z)",
+      "name_za": "Name (Z to A)",
+      "time_desc": "Time (Newest First)",
+      "time_asc": "Time (Oldest First)"
+    },
+    "search": {
+      "known_people": "Search known people",
+      "pending_people": "Search pending people",
+      "person_name": "Search person name..."
+    },
+    "action_history": {
+      "title": "Action History · {name}",
+      "undo_all": "Undo All",
+      "redo_all": "Redo All",
+      "delete_person": "Delete This Person",
+      "no_history": "No action history"
+    },
+    "expand": {
+      "collapse": "Collapse",
+      "expand": "Expand",
+      "view_faces": "View Faces",
+      "appears_in": "Appears in:",
+      "faces": "{count} faces",
+      "set_as_profile": "Set as Profile",
+      "no_face_data": "No face data"
+    },
+    "context": {
+      "star_person": "★ Mark as Important",
+      "unstar_person": "☆ Remove Important",
+      "details": "📋 Details",
+      "confirm_person": "✓ Confirm Person",
+      "pending": "Pending",
+      "edit_name": "✎ Edit Name",
+      "merge_person": "⇄ Already Have This Person",
+      "skip_person": "✕ Skip This Person",
+      "undo": "↩ Undo",
+      "redo": "↪ Redo",
+      "delete_person": "🗑 Delete This Person"
+    },
+    "face_context": {
+      "details": "📋 Details",
+      "assign_existing": "⇄ Assign to Existing Person",
+      "skip_face": "✕ Skip This Face"
+    },
+    "assign": {
+      "title": "Assign to Existing Person",
+      "search_placeholder": "Search person name...",
+      "no_results": "No matching people found",
+      "confirm_assign": "Confirm Assignment"
+    },
+    "face_detail": {
+      "title": "Pending Face Details",
+      "file": "File:",
+      "trace_id": "Trace ID:",
+      "frame_number": "Frame Number:",
+      "confidence": "Confidence:",
+      "face_id": "Face ID:",
+      "play_segment": "Play Video Segment",
+      "new_identity": "Create as New Person",
+      "enter_name": "Enter person name...",
+      "add": "Add",
+      "close": "Close"
+    },
+    "detail": {
+      "back": "Back",
+      "edit": "Edit",
+      "role": "Role",
+      "description": "Description",
+      "enter_name": "Enter name",
+      "enter_alias": "Enter alias and press Enter",
+      "add_alias": "＋ Alias",
+      "collapse": "Collapse",
+      "role_name": "Role name",
+      "custom_description": "Custom description",
+      "saving": "Saving...",
+      "save_changes": "✓ Save Changes",
+      "cancel": "Cancel",
+      "add_same_person": "Add same person",
+      "play": "▶ Play",
+      "unbind": "✕ Unbind",
+      "segments": "{count} segments",
+      "traces": "{count} traces",
+      "all_segments": "All segments",
+      "mode_trace": "Trace",
+      "mode_segment": "Segment",
+      "mode_continuous": "Continuous",
+      "status": "Status:",
+      "confirm": "✓ Confirm",
+      "skip": "Skip",
+      "bind_face": "+ Bind Face",
+      "merge_other": "⇄ Merge to Other Person",
+      "delete_person": "Delete This Person",
+      "bind_face_title": "Bind Face",
+      "merge_title": "⇄ Merge to Other Person",
+      "unbind_trace": "Unbind trace T{trace_id} (face_id: {face_id})?",
+      "no_face_id": "This trace has no face_id, cannot unbind",
+      "unbind_failed": "Unbind failed: {error}",
+      "merge_confirm": "Merge \"{source}\" into \"{target}\"?",
+      "not_this_person": "Not This Person",
+      "delete_confirm": "Delete \"{name}\"?",
+      "delete_confirm_message": "Delete \"{name}\"? This action cannot be undone.",
+      "delete_failed": "Delete failed: {error}",
+      "create_identity_failed": "Failed to create person: API did not return identity_uuid",
+      "create_identity_error": "Failed to create person: {error}",
+      "assign_failed": "Assignment failed: {error}"
+    },
+    "action": {
+      "delete_person": "Delete Person",
+      "update_person": "Update Person",
+      "bind_face": "Bind Face",
+      "unbind_face": "Unbind Face",
+      "bind_trace": "Bind Trace"
+    }
+  },
+  "agent": {
+    "welcome": {
+      "title": "👋 Welcome to Momentry Studio",
+      "intro": "I'll help you make better use of the system. Let me introduce the main features:",
+      "smart_search": {
+        "title": "Smart Search",
+        "desc": "Keyword, semantic, and people search modes"
+      },
+      "people_management": {
+        "title": "People Management",
+        "desc": "Identify people in videos, build people database"
+      },
+      "file_management": {
+        "title": "File Management",
+        "desc": "Manage and process your video and photo files"
+      },
+      "got_it": "Got it, start using"
+    }
+  },
+  "login": {
+    "title": "Momentry Studio",
+    "subtitle": "Login to continue",
+    "username": "Username",
+    "password": "Password",
+    "username_placeholder": "Enter username",
+    "password_placeholder": "Enter password",
+    "login_button": "Login",
+    "logging_in": "Logging in...",
+    "login_success": "Login successful!",
+    "default_credentials": "Default credentials: demo / demo123"
+  },
+  "nav": {
+    "search": "Search",
+    "library": "Library",
+    "people": "People",
+    "admin": "Admin",
+    "client": "Client"
+  },
+  "time": {
+    "just_now": "Just now",
+    "minutes_ago": "{count} min ago",
+    "hours_ago": "{count} hr ago"
+  },
+  "video": {
+    "prev": "Previous",
+    "next": "Next",
+    "key_frame": "Key Frame"
+  },
+  "language": {
+    "en": "English",
+    "zh-TW": "Traditional Chinese",
+    "zh-CN": "Simplified Chinese",
+    "ja": "Japanese",
+    "ko": "Korean",
+    "auto": "Auto Detect"
+  },
+  "client": {
+    "title": "File Manager",
+    "search": {
+      "placeholder": "Search files..."
+    },
+    "table": {
+      "name": "Name",
+      "size": "Size",
+      "type": "Type",
+      "modified": "Modified"
+    },
+    "button": {
+      "upload": "Upload",
+      "newFolder": "New Folder",
+      "refresh": "Refresh",
+      "create": "Create",
+      "cancel": "Cancel",
+      "delete": "Delete",
+      "rename": "Rename",
+      "move": "Move",
+      "preview": "Preview",
+      "download": "Download"
+    },
+    "dialog": {
+      "createFolder": "Create New Folder",
+      "folderName": "Folder name",
+      "deleteTitle": "Delete \"{name}\"",
+      "deleteMessage": "Are you sure you want to delete this {type}? This action cannot be undone.",
+      "renameTitle": "Rename \"{name}\"",
+      "newName": "New name",
+      "previewTitle": "File Preview: {name}",
+      "uploadTitle": "Upload File{s}",
+      "moveTitle": "Move {type} \"{name}\"",
+      "selectFiles": "Select files"
+    },
+    "type": {
+      "file": "file",
+      "folder": "folder",
+      "files": "files"
+    },
+    "status": {
+      "uploading": "Uploading...",
+      "success": "Success",
+      "error": "Error"
+    }
+  },
+  "admin": {
+    "title": "Admin Panel",
+    "tab": {
+      "dashboard": "Dashboard",
+      "users": "Users",
+      "shares": "Shares",
+      "config": "Config",
+      "settings": "Settings"
+    },
+    "section": {
+      "systemResources": "System Resources",
+      "validation": "Validation",
+      "configuration": "Admin Configuration",
+      "vlmPrompts": "VLM Prompts",
+      "languagePacks": "Language Packs",
+      "llmConfig": "LLM Configuration",
+      "processorConfig": "Processor Configuration",
+      "filterConfig": "Filter Configuration",
+      "searchConfig": "Search Configuration",
+      "systemConfig": "System Configuration",
+      "uploadPath": "Upload Path",
+      "serviceUrls": "Service URLs"
+    },
+    "resource": {
+      "cpu": "CPU",
+      "memory": "Memory",
+      "swap": "Swap",
+      "gpu": "GPU",
+      "gpuFreq": "GPU Freq",
+      "systemPower": "System Power"
+    },
+    "table": {
+      "username": "Username",
+      "homeDir": "Home Dir",
+      "status": "Status",
+      "name": "Name",
+      "port": "Port",
+      "filter": "Filter",
+      "parameters": "Parameters"
+    },
+    "config": {
+      "systemPrompt": "System Prompt",
+      "prompt": "Prompt",
+      "userPrompt": "User Prompt",
+      "maxTokens": "Max Tokens",
+      "url": "URL",
+      "model": "Model",
+      "availableLanguages": "Available Languages",
+      "importLanguagePack": "Import Language Pack",
+      "tools": "Tools"
+    },
+    "stat": {
+      "users": "Users",
+      "shares": "Shares"
+    }
+  },
+  "app": {
+    "productName": "Momentry Studio",
+    "tagline": "Turn Every Moment Into Intelligence"
+  }
+}

src/locales/index.ts

@@ -0,0 +1,79 @@
+import { createI18n } from 'vue-i18n'
+import en from './en.json'
+import zhTW from './zh-TW.json'
+import ja from './ja.json'
+
+export type MessageSchema = typeof en
+
+const supportedLanguages = {
+  'en': en,
+  'zh-TW': zhTW,
+  'ja': ja,
+}
+
+function detectInitialLanguage(): string {
+  const saved = localStorage.getItem('app_language')
+  if (saved && saved in supportedLanguages) {
+    return saved
+  }
+  
+  if (saved === 'auto') {
+    return detectOSLanguage()
+  }
+  
+  return 'en'
+}
+
+function detectOSLanguage(): string {
+  let osLang = 'en'
+  
+  try {
+    if ((window as any).__TAURI__) {
+      const locale = (window as any).__TAURI__?.os?.getLocale?.()
+      if (locale) osLang = locale
+    } else {
+      osLang = navigator.language || 'en'
+    }
+  } catch (e) {
+    console.error('Language detection failed:', e)
+  }
+  
+  if (osLang.startsWith('zh-TW') || osLang.startsWith('zh-Hant')) {
+    return 'zh-TW'
+  } else if (osLang.startsWith('zh-CN') || osLang.startsWith('zh-Hans')) {
+    return 'zh-CN'
+  } else if (osLang.startsWith('ja')) {
+    return 'ja'
+  } else if (osLang.startsWith('ko')) {
+    return 'ko'
+  }
+  
+  return 'en'
+}
+
+const i18n = createI18n<[MessageSchema], 'en' | 'zh-TW' | 'ja'>({
+  legacy: false,
+  locale: detectInitialLanguage(),
+  fallbackLocale: 'en',
+  messages: supportedLanguages as any,
+  missingWarn: false,
+  fallbackWarn: false,
+})
+
+export function changeLanguage(lang: string) {
+  if (lang === 'auto') {
+    localStorage.setItem('app_language', 'auto')
+    const detected = detectOSLanguage()
+    i18n.global.locale = detected as any
+  } else {
+    localStorage.setItem('app_language', lang)
+    i18n.global.locale = lang as any
+  }
+}
+
+export function getCurrentLanguage(): string {
+  return i18n.global.locale as string
+}
+
+export { detectOSLanguage }
+export default i18n

src/locales/ja.json

@@ -0,0 +1,454 @@
+{
+  "common": {
+    "loading": "読み込み中...",
+    "error": "エラー",
+    "success": "成功",
+    "cancel": "キャンセル",
+    "confirm": "確認",
+    "delete": "削除",
+    "save": "保存",
+    "edit": "編集",
+    "search": "検索",
+    "back": "戻る",
+    "close": "閉じる",
+    "play": "再生",
+    "logout": "ログアウト",
+    "login": "ログイン"
+  },
+  "library": {
+    "sort": {
+      "title": "並べ替え",
+      "time_desc": "時間（新しい順）",
+      "time_asc": "時間（古い順）",
+      "size_desc": "サイズ（大きい順）",
+      "size_asc": "サイズ（小さい順）",
+      "name_asc": "名前（A-Z）",
+      "name_desc": "名前（Z-A）"
+    },
+    "filter": {
+      "title": "フィルター",
+      "unregistered": "未登録",
+      "registered": "登録済み",
+      "pending": "保留中",
+      "completed": "完了",
+      "videos_only": "動画のみ",
+      "photos_only": "写真のみ"
+    },
+    "size": {
+      "title": "サイズ",
+      "min_mb": "最小 MB",
+      "max_mb": "最大 MB"
+    },
+    "duration": {
+      "title": "動画の長さ",
+      "min_minutes": "最小 分",
+      "max_minutes": "最大 分"
+    },
+    "status": {
+      "files": "{count} ファイル",
+      "registered": "登録済み",
+      "unregistered": "未登録",
+      "pending": "保留中",
+      "preparing": "準備中",
+      "processing": "処理中",
+      "completed": "完了",
+      "scanning": "スキャン中",
+      "ready": "準備完了",
+      "keyword_ready": "キーワード準備完了",
+      "semantic_ready": "意味検索準備完了",
+      "face_mgmt_ready": "顔管理準備完了",
+      "agent_ready": "エージェント準備完了"
+    },
+    "thumbnail": {
+      "register_to_preview": "プレビューを表示するには登録してください"
+    },
+    "context": {
+      "register_file": "ファイルを登録",
+      "process_file": "ファイルを処理",
+      "reprocess": "再処理",
+      "unregister": "登録解除",
+      "play_video": "ビデオを再生",
+      "processor_selection": "プロセッサー選択",
+      "overall_progress": "全体の進捗",
+      "missing_file_path": "ファイルパスがありません",
+      "file_not_registered": "ファイルが登録されていません",
+      "select_processor": "少なくとも1つのプロセッサーを選択してください",
+      "file_must_be_completed": "ファイルが完了している必要があります",
+      "face_deduplication": "顔の重複排除",
+      "qc_check": "品質チェック"
+    },
+    "pipeline": {
+      "processors": "プロセッサー",
+      "rule1_ingestion": "Rule1 取り込み",
+      "face_tracing": "顔追跡",
+      "tkg_nodes": "TKG ノード",
+      "tkg_edges": "TKG エッジ",
+      "rule2_ingestion": "Rule2 取り込み"
+    },
+    "phase": {
+      "processor_output": "Rule1: プロセッサー出力",
+      "postgresql_ingestion": "Rule1: PostgreSQL 取り込み",
+      "qdrant_ingestion": "Rule1: Qdrant 取り込み"
+    },
+    "action": {
+      "registering": "登録中...",
+      "registered": "登録済み: {name}",
+      "registration_failed": "登録失敗: {message}",
+      "registration_error": "登録エラー: {error}",
+      "processing": "処理中...",
+      "processing_started": "処理開始: {name}",
+      "processing_failed": "処理失敗: {message}",
+      "processing_error": "処理エラー: {error}",
+      "removing": "削除中...",
+      "removed": "削除済み: {name}",
+      "removal_failed": "削除失敗: {message}",
+      "removal_error": "削除エラー: {error}",
+      "clear_filters": "フィルターをクリア"
+    },
+    "qc": {
+      "audio_info": "オーディオ情報",
+      "audio_track": "オーディオトラック",
+      "has_audio": "✓ オーディオあり",
+      "no_audio": "✗ オーディオなし",
+      "speech": "音声",
+      "has_speech": "✓ 音声あり",
+      "no_speech": "🔇 音声なし",
+      "language": "言語",
+      "sample_rate": "サンプリングレート",
+      "uuid_label": "UUID:",
+      "track_processor_output": "フェーズ1: プロセッサー出力",
+      "track_ingestion": "フェーズ2: データ取り込み",
+      "track_status_change": "最終: ステータス変更",
+      "output_ingestion_done": "📥 出力 + 取り込み完了",
+      "items": "{count} アイテム"
+    },
+    "refresh": "更新",
+    "refresh_status": "ステータスを更新",
+    "confirm": {
+      "title_register": "📥 登録",
+      "title_process": "🔍 詳細スキャン",
+      "title_rescan": "🔄 再スキャン",
+      "message_register": "ファイルがデフォルト設定で登録・処理されます。",
+      "message_register_no_scan": "登録のみ、自動スキャンなし。",
+      "message_process": "選択したプロセッサーでデフォルト設定を使用して処理します。",
+      "message_rescan": "登録解除 → 登録 → ディープスキャンを実行します（選択したプロセッサを使用）。",
+      "cancel": "キャンセル",
+      "proceed": "続行",
+      "rerun_processor": "{processor} を再実行しますか？",
+      "run_processor": "{filename} で {processor} を実行しますか？",
+      "unregister_title": "登録解除",
+      "unregister_message": "「{filename}」を登録解除しますか？\n\nファイルとその出力データが削除されます。",
+      "batch_unregister_message": "{count} ファイルを登録解除しますか？\n\nファイルとその出力データが削除されます。"
+    },
+    "processor": {
+      "started": "{processor} が開始されました",
+      "failed": "失敗：{message}",
+      "error": "エラー：{message}",
+      "no_file": "エラー：ファイルが選択されていません",
+      "vlm_failed": "VLM サマリーの開始に失敗：{message}",
+      "pipeline_qc": "パイプライン品質チェック"
+    },
+    "settings": {
+      "auto_scan": "登録後に自動的に詳細スキャン"
+    }
+  },
+  "people": {
+    "toolbar": {
+      "all_files": "全ファイル",
+      "view_all_people": "全人物を表示",
+      "view_starred_people": "スター付き人物を表示",
+      "refresh": "更新",
+      "pending_people": "人物",
+      "skipped_people": "スキップされた人物",
+      "pending_faces": "顔",
+      "face_group": "顔グループ"
+    },
+    "section": {
+      "known_people": "既知の人物",
+      "pending_people": "人物",
+      "skipped_people": "スキップされた人物",
+      "pending_faces": "顔",
+      "face_group": "顔グループ",
+      "unassigned": "未割り当て"
+    },
+    "sort": {
+      "title": "並べ替え",
+      "recent": "最近表示",
+      "file_name": "ファイル名",
+      "name_az": "名前（A-Z）",
+      "name_za": "名前（Z-A）",
+      "time_desc": "時間（新しい順）",
+      "time_asc": "時間（古い順）"
+    },
+    "search": {
+      "known_people": "既知の人物を検索",
+      "pending_people": "保留中の人物を検索",
+      "person_name": "人物名を検索..."
+    },
+    "action_history": {
+      "title": "操作履歴 · {name}",
+      "undo_all": "すべて元に戻す",
+      "redo_all": "すべてやり直し",
+      "delete_person": "この人物を削除",
+      "no_history": "操作履歴なし"
+    },
+    "expand": {
+      "collapse": "折りたたむ",
+      "expand": "展開",
+      "view_faces": "顔を表示",
+      "appears_in": "登場:",
+      "faces": "{count} 顔",
+      "set_as_profile": "プロフィールに設定",
+      "no_face_data": "顔データなし"
+    },
+    "context": {
+      "star_person": "★ 重要としてマーク",
+      "unstar_person": "☆ 重要マークを削除",
+      "details": "📋 詳細",
+      "confirm_person": "✓ 人物を確認",
+      "pending": "保留中",
+      "edit_name": "✎ 名前を編集",
+      "merge_person": "⇄ 既にこの人物が存在",
+      "skip_person": "✕ この人物をスキップ",
+      "undo": "↩ 元に戻す",
+      "redo": "↪ やり直し",
+      "delete_person": "🗑 この人物を削除"
+    },
+    "face_context": {
+      "details": "📋 詳細",
+      "assign_existing": "⇄ 既存の人物に割り当て",
+      "skip_face": "✕ この顔をスキップ"
+    },
+    "assign": {
+      "title": "既存の人物に割り当て",
+      "search_placeholder": "人物名を検索...",
+      "no_results": "一致する人物が見つかりません",
+      "confirm_assign": "割り当てを確認"
+    },
+    "face_detail": {
+      "title": "保留中の顔の詳細",
+      "file": "ファイル:",
+      "trace_id": "トレースID:",
+      "frame_number": "フレーム番号:",
+      "confidence": "信頼度:",
+      "face_id": "顔ID:",
+      "play_segment": "動画セグメントを再生",
+      "new_identity": "新しい人物として作成",
+      "enter_name": "人物名を入力...",
+      "add": "追加",
+      "close": "閉じる"
+    },
+    "detail": {
+      "back": "戻る",
+      "edit": "編集",
+      "role": "役割",
+      "description": "説明",
+      "enter_name": "名前を入力",
+      "enter_alias": "エイリアスを入力してEnter",
+      "add_alias": "＋ エイリアス",
+      "collapse": "折りたたむ",
+      "role_name": "役割名",
+      "custom_description": "カスタム説明",
+      "saving": "保存中...",
+      "save_changes": "✓ 変更を保存",
+      "cancel": "キャンセル",
+      "add_same_person": "同じ人物を追加",
+      "play": "▶ 再生",
+      "unbind": "✕ バインド解除",
+      "segments": "{count} セグメント",
+      "traces": "{count} トレース",
+      "all_segments": "全セグメント",
+      "mode_trace": "トレース",
+      "mode_segment": "セグメント",
+      "mode_continuous": "連続",
+      "status": "ステータス:",
+      "confirm": "✓ 確認",
+      "skip": "スキップ",
+      "bind_face": "+ 顔をバインド",
+      "merge_other": "⇄ 他の人物にマージ",
+      "delete_person": "この人物を削除",
+      "bind_face_title": "顔をバインド",
+      "merge_title": "⇄ 他の人物にマージ",
+      "unbind_trace": "トレース T{trace_id} のバインドを解除（顔ID: {face_id}）？",
+      "no_face_id": "このトレースには顔IDがありません。バインド解除できません",
+      "unbind_failed": "バインド解除失敗: {error}",
+      "merge_confirm": "「{source}」を「{target}」にマージしますか？",
+      "not_this_person": "この人物ではない",
+      "delete_confirm": "「{name}」を削除しますか？",
+      "delete_confirm_message": "「{name}」を削除しますか？この操作は元に戻せません。",
+      "delete_failed": "削除失敗: {error}",
+      "create_identity_failed": "人物の作成に失敗: APIがidentity_uuidを返しませんでした",
+      "create_identity_error": "人物の作成に失敗: {error}",
+      "assign_failed": "割り当て失敗: {error}"
+    },
+    "action": {
+      "delete_person": "人物を削除",
+      "update_person": "人物を更新",
+      "bind_face": "顔をバインド",
+      "unbind_face": "顔のバインド解除",
+      "bind_trace": "トレースをバインド"
+    }
+  },
+  "agent": {
+    "welcome": {
+      "title": "👋 Momentry Studioへようこそ",
+      "intro": "システムをより効果的に活用できるようサポートします。主な機能を紹介します：",
+      "smart_search": {
+        "title": "スマート検索",
+        "desc": "キーワード、意味、人物検索モード"
+      },
+      "people_management": {
+        "title": "人物管理",
+        "desc": "動画内の人物を識別し、人物データベースを構築"
+      },
+      "file_management": {
+        "title": "ファイル管理",
+        "desc": "動画・写真ファイルの管理と処理"
+      },
+      "got_it": "了解しました、使用開始"
+    }
+  },
+  "login": {
+    "title": "Momentry Studio",
+    "subtitle": "続行するにはログインしてください",
+    "username": "ユーザー名",
+    "password": "パスワード",
+    "username_placeholder": "ユーザー名を入力",
+    "password_placeholder": "パスワードを入力",
+    "login_button": "ログイン",
+    "logging_in": "ログイン中...",
+    "login_success": "ログイン成功！",
+    "default_credentials": "デフォルト認証情報: demo / demo123"
+  },
+  "nav": {
+    "search": "検索",
+    "library": "ライブラリ",
+    "people": "人物",
+    "admin": "管理",
+    "client": "クライアント"
+  },
+  "time": {
+    "just_now": "たった今",
+    "minutes_ago": "{count} 分前",
+    "hours_ago": "{count} 時間前"
+  },
+  "video": {
+    "prev": "前へ",
+    "next": "次へ",
+    "key_frame": "キーフレーム"
+  },
+  "language": {
+    "en": "英語",
+    "zh-TW": "繁体字中国語",
+    "zh-CN": "簡体字中国語",
+    "ja": "日本語",
+    "ko": "韓国語",
+    "auto": "自動検出"
+  },
+  "client": {
+    "title": "ファイルマネージャー",
+    "search": {
+      "placeholder": "ファイルを検索..."
+    },
+    "table": {
+      "name": "名前",
+      "size": "サイズ",
+      "type": "タイプ",
+      "modified": "更新日時"
+    },
+    "button": {
+      "upload": "アップロード",
+      "newFolder": "新しいフォルダ",
+      "refresh": "更新",
+      "create": "作成",
+      "cancel": "キャンセル",
+      "delete": "削除",
+      "rename": "名前変更",
+      "move": "移動",
+      "preview": "プレビュー",
+      "download": "ダウンロード"
+    },
+    "dialog": {
+      "createFolder": "新しいフォルダを作成",
+      "folderName": "フォルダ名",
+      "deleteTitle": "「{name}」を削除",
+      "deleteMessage": "この{type}を削除してもよろしいですか？この操作は取り消せません。",
+      "renameTitle": "「{name}」の名前を変更",
+      "newName": "新しい名前",
+      "previewTitle": "ファイルプレビュー：{name}",
+      "uploadTitle": "ファイルをアップロード{s}",
+      "moveTitle": "{type}「{name}」を移動",
+      "selectFiles": "ファイルを選択"
+    },
+    "type": {
+      "file": "ファイル",
+      "folder": "フォルダ",
+      "files": "ファイル"
+    },
+    "status": {
+      "uploading": "アップロード中...",
+      "success": "成功",
+      "error": "エラー"
+    }
+  },
+  "admin": {
+    "title": "管理パネル",
+    "tab": {
+      "dashboard": "ダッシュボード",
+      "users": "ユーザー",
+      "shares": "共有",
+      "config": "設定",
+      "settings": "設定"
+    },
+    "section": {
+      "systemResources": "システムリソース",
+      "validation": "検証",
+      "configuration": "管理設定",
+      "vlmPrompts": "VLM プロンプト",
+      "languagePacks": "言語パック",
+      "llmConfig": "LLM 設定",
+      "processorConfig": "プロセッサ設定",
+      "filterConfig": "フィルタ設定",
+      "searchConfig": "検索設定",
+      "systemConfig": "システム設定",
+      "uploadPath": "アップロードパス",
+      "serviceUrls": "サービス URL"
+    },
+    "resource": {
+      "cpu": "CPU",
+      "memory": "メモリ",
+      "swap": "スワップ",
+      "gpu": "GPU",
+      "gpuFreq": "GPU 周波数",
+      "systemPower": "システム電力"
+    },
+    "table": {
+      "username": "ユーザー名",
+      "homeDir": "ホームディレクトリ",
+      "status": "ステータス",
+      "name": "名前",
+      "port": "ポート",
+      "filter": "フィルタ",
+      "parameters": "パラメータ"
+    },
+    "config": {
+      "systemPrompt": "システムプロンプト",
+      "prompt": "プロンプト",
+      "userPrompt": "ユーザープロンプト",
+      "maxTokens": "最大トークン数",
+      "url": "URL",
+      "model": "モデル",
+      "availableLanguages": "利用可能な言語",
+      "importLanguagePack": "言語パックをインポート",
+      "tools": "ツール"
+    },
+    "stat": {
+      "users": "ユーザー",
+      "shares": "共有"
+    }
+  },
+  "app": {
+    "productName": "Momentry Studio",
+    "tagline": "Turn Every Moment Into Intelligence"
+  }
+}

src/locales/zh-TW.json

@@ -0,0 +1,454 @@
+{
+  "common": {
+    "loading": "載入中...",
+    "error": "錯誤",
+    "success": "成功",
+    "cancel": "取消",
+    "confirm": "確認",
+    "delete": "刪除",
+    "save": "儲存",
+    "edit": "編輯",
+    "search": "搜尋",
+    "back": "返回",
+    "close": "關閉",
+    "play": "播放",
+    "logout": "登出",
+    "login": "登入"
+  },
+  "library": {
+    "sort": {
+      "title": "排序方式",
+      "time_desc": "依時間・由近到遠",
+      "time_asc": "依時間・由遠到近",
+      "size_desc": "依大小・由大到小",
+      "size_asc": "依大小・由小到大",
+      "name_asc": "依檔名・由 A 到 Z",
+      "name_desc": "依檔名・由 Z 到 A"
+    },
+    "filter": {
+      "title": "過濾方式",
+      "unregistered": "未註冊",
+      "registered": "已註冊",
+      "pending": "待處理",
+      "completed": "已完成",
+      "videos_only": "僅顯示影片",
+      "photos_only": "僅顯示照片"
+    },
+    "size": {
+      "title": "大小",
+      "min_mb": "最小 MB",
+      "max_mb": "最大 MB"
+    },
+    "duration": {
+      "title": "影片時長",
+      "min_minutes": "最小分鐘",
+      "max_minutes": "最大分鐘"
+    },
+    "status": {
+      "files": "{count} 個檔案",
+      "registered": "已註冊",
+      "unregistered": "未註冊",
+      "pending": "等待中",
+      "preparing": "準備中",
+      "processing": "處理中",
+      "completed": "已完成",
+      "scanning": "掃描中",
+      "ready": "就緒",
+      "keyword_ready": "關鍵字可用",
+      "semantic_ready": "語意可用",
+      "face_mgmt_ready": "臉部管理可用",
+      "agent_ready": "Agent 可用"
+    },
+    "thumbnail": {
+      "register_to_preview": "註冊以預覽"
+    },
+    "context": {
+      "register_file": "註冊檔案",
+      "process_file": "處理檔案",
+      "reprocess": "重新處理",
+      "unregister": "取消註冊",
+      "play_video": "播放影片",
+      "processor_selection": "處理器選擇",
+      "overall_progress": "整體進度",
+      "missing_file_path": "缺少檔案路徑",
+      "file_not_registered": "檔案未註冊",
+      "select_processor": "請選擇至少一個處理器",
+      "file_must_be_completed": "檔案必須先完成處理",
+      "face_deduplication": "人臉去重",
+      "qc_check": "品質檢查"
+    },
+    "pipeline": {
+      "processors": "處理器",
+      "rule1_ingestion": "Rule1 入庫",
+      "face_tracing": "Face Tracing",
+      "tkg_nodes": "TKG Nodes",
+      "tkg_edges": "TKG Edges",
+      "rule2_ingestion": "Rule2 入庫"
+    },
+    "phase": {
+      "processor_output": "Rule1: 處理器輸出",
+      "postgresql_ingestion": "Rule1: PostgreSQL 入庫",
+      "qdrant_ingestion": "Rule1: Qdrant 入庫"
+    },
+    "action": {
+      "registering": "註冊中...",
+      "registered": "註冊成功：{name}",
+      "registration_failed": "註冊失敗：{message}",
+      "registration_error": "註冊錯誤：{error}",
+      "processing": "處理中...",
+      "processing_started": "處理已觸發：{name}",
+      "processing_failed": "處理失敗：{message}",
+      "processing_error": "處理錯誤：{error}",
+      "removing": "移除中...",
+      "removed": "移除成功：{name}",
+      "removal_failed": "移除失敗：{message}",
+      "removal_error": "移除錯誤：{error}",
+      "clear_filters": "清除篩選"
+    },
+    "qc": {
+      "audio_info": "音軌資訊",
+      "audio_track": "音軌",
+      "has_audio": "✓ 有音軌",
+      "no_audio": "✗ 無音軌",
+      "speech": "語音",
+      "has_speech": "✓ 有語音",
+      "no_speech": "🔇 無語音",
+      "language": "語言",
+      "sample_rate": "取樣率",
+      "uuid_label": "UUID：",
+      "track_processor_output": "路徑一：處理器輸出",
+      "track_ingestion": "路徑二：資料入庫",
+      "track_status_change": "終點：狀態改變",
+      "output_ingestion_done": "📥 輸出 + 入庫 完成",
+      "items": "{count} 筆"
+    },
+    "refresh": "重新整理",
+    "refresh_status": "重新整理狀態",
+    "confirm": {
+      "title_register": "📥 註冊",
+      "title_process": "🔍 深度掃描",
+      "title_rescan": "🔄 重新掃描",
+      "message_register": "檔案將以預設設定註冊並處理。",
+      "message_register_no_scan": "僅註冊，不自動掃描。",
+      "message_process": "將使用預設設定對選定的處理器執行處理。",
+      "message_rescan": "將執行取消註冊 → 註冊 → 深度掃描（使用選擇的處理器）。",
+      "cancel": "取消",
+      "proceed": "開始",
+      "rerun_processor": "重新執行 {processor}？",
+      "run_processor": "在 {filename} 上執行 {processor}？",
+      "unregister_title": "取消註冊",
+      "unregister_message": "取消註冊「{filename}」？\n\n這將移除檔案及其輸出資料。",
+      "batch_unregister_message": "取消註冊 {count} 個檔案？\n\n這將移除檔案及其輸出資料。"
+    },
+    "processor": {
+      "started": "{processor} 已開始",
+      "failed": "失敗：{message}",
+      "error": "錯誤：{message}",
+      "no_file": "錯誤：未選擇檔案",
+      "vlm_failed": "無法觸發 VLM 摘要：{message}",
+      "pipeline_qc": "管道品質檢查"
+    },
+    "settings": {
+      "auto_scan": "註冊後自動深度掃描"
+    }
+  },
+  "people": {
+    "toolbar": {
+      "all_files": "全部檔案",
+      "view_all_people": "查看所有人物",
+      "view_starred_people": "查看重要人物",
+      "refresh": "重新整理",
+      "pending_people": "人物",
+      "skipped_people": "已略過",
+      "pending_faces": "人臉",
+      "face_group": "人臉群組"
+    },
+    "section": {
+      "known_people": "已知人物",
+      "pending_people": "人物",
+      "skipped_people": "已略過",
+      "pending_faces": "人臉",
+      "face_group": "人臉群組",
+      "unassigned": "未分組"
+    },
+    "sort": {
+      "title": "排序方式",
+      "recent": "最近瀏覽",
+      "file_name": "依檔案名稱",
+      "name_az": "依檔名・由 A 到 Z",
+      "name_za": "依檔名・由 Z 到 A",
+      "time_desc": "依時間・由近到遠",
+      "time_asc": "依時間・由遠到近"
+    },
+    "search": {
+      "known_people": "搜尋已知人物",
+      "pending_people": "搜尋待定人物",
+      "person_name": "搜尋人物名稱..."
+    },
+    "action_history": {
+      "title": "操作記錄 · {name}",
+      "undo_all": "全部復原",
+      "redo_all": "全部重做",
+      "delete_person": "刪除此人物",
+      "no_history": "尚無操作記錄"
+    },
+    "expand": {
+      "collapse": "收起",
+      "expand": "展開",
+      "view_faces": "查看面孔",
+      "appears_in": "出現檔案：",
+      "faces": "{count} 面孔",
+      "set_as_profile": "設為大頭貼",
+      "no_face_data": "無面孔資料"
+    },
+    "context": {
+      "star_person": "★ 標為重要人物",
+      "unstar_person": "☆ 取消重要人物",
+      "details": "📋 詳情",
+      "confirm_person": "✓ 確認人物",
+      "pending": "待定",
+      "edit_name": "✎ 編輯名稱",
+      "merge_person": "⇄ 已有此人物",
+      "skip_person": "✕ 略過此人物",
+      "undo": "↩ 復原",
+      "redo": "↪ 重做",
+      "delete_person": "🗑 刪除此人物"
+    },
+    "face_context": {
+      "details": "📋 詳情",
+      "assign_existing": "⇄ 指派給現有人物",
+      "skip_face": "✕ 略過此人臉"
+    },
+    "assign": {
+      "title": "指派給現有人物",
+      "search_placeholder": "搜尋人物名稱...",
+      "no_results": "沒有找到符合的人物",
+      "confirm_assign": "確認指派"
+    },
+    "face_detail": {
+      "title": "待定人臉詳情",
+      "file": "檔案：",
+      "trace_id": "Trace ID：",
+      "frame_number": "帧號：",
+      "confidence": "置信度：",
+      "face_id": "Face ID：",
+      "play_segment": "播放影片片段",
+      "new_identity": "新增為新人物",
+      "enter_name": "輸入人物名稱...",
+      "add": "新增",
+      "close": "關閉"
+    },
+    "detail": {
+      "back": "返回",
+      "edit": "編輯",
+      "role": "角色",
+      "description": "描述",
+      "enter_name": "加入人名",
+      "enter_alias": "輸入別名後按 Enter",
+      "add_alias": "＋ 別名",
+      "collapse": "收起",
+      "role_name": "角色名稱",
+      "custom_description": "自訂描述",
+      "saving": "儲存中...",
+      "save_changes": "✓ 儲存更改",
+      "cancel": "取消",
+      "add_same_person": "加入相同人物",
+      "play": "▶ 播放",
+      "unbind": "✕ 解綁",
+      "segments": "{count} 個片段",
+      "traces": "{count} 個追蹤",
+      "all_segments": "所有片段",
+      "mode_trace": "追蹤",
+      "mode_segment": "片段",
+      "mode_continuous": "連續",
+      "status": "狀態：",
+      "confirm": "✓ 確認",
+      "skip": "略過",
+      "bind_face": "+ 綁定人臉",
+      "merge_other": "⇄ 合併到其他人物",
+      "delete_person": "刪除此人物",
+      "bind_face_title": "Bind Face",
+      "merge_title": "⇄ 合併到其他人物",
+      "unbind_trace": "解綁 trace T{trace_id}（face_id: {face_id}）？",
+      "no_face_id": "此 trace 沒有 face_id，無法解綁",
+      "unbind_failed": "解綁失敗：{error}",
+      "merge_confirm": "合併「{source}」到「{target}」？",
+      "not_this_person": "不是此人物",
+      "delete_confirm": "刪除「{name}」？",
+      "delete_confirm_message": "刪除「{name}」？此操作無法復原。",
+      "delete_failed": "刪除失敗：{error}",
+      "create_identity_failed": "新增人物失敗：API 未返回 identity_uuid",
+      "create_identity_error": "新增人物失敗：{error}",
+      "assign_failed": "指派失敗：{error}"
+    },
+    "action": {
+      "delete_person": "刪除人物",
+      "update_person": "更新人物",
+      "bind_face": "綁定面部",
+      "unbind_face": "解綁面部",
+      "bind_trace": "綁定軌跡"
+    }
+  },
+  "agent": {
+    "welcome": {
+      "title": "👋 歡迎使用 Momentry Studio",
+      "intro": "我會幫助你更好地使用系統。讓我介紹一下主要功能：",
+      "smart_search": {
+        "title": "智能搜索",
+        "desc": "關鍵詞、語義、人物三種搜索模式"
+      },
+      "people_management": {
+        "title": "人物管理",
+        "desc": "識別視頻中的人物，建立人物庫"
+      },
+      "file_management": {
+        "title": "文件管理",
+        "desc": "管理和處理你的視頻、照片文件"
+      },
+      "got_it": "知道了，開始使用"
+    }
+  },
+  "login": {
+    "title": "Momentry Studio",
+    "subtitle": "Login to continue",
+    "username": "Username",
+    "password": "Password",
+    "username_placeholder": "Enter username",
+    "password_placeholder": "Enter password",
+    "login_button": "Login",
+    "logging_in": "Logging in...",
+    "login_success": "Login successful!",
+    "default_credentials": "Default credentials: demo / demo123"
+  },
+  "nav": {
+    "search": "Search",
+    "library": "Library",
+    "people": "People",
+    "admin": "Admin",
+    "client": "Client"
+  },
+  "time": {
+    "just_now": "剛剛",
+    "minutes_ago": "{count} 分鐘前",
+    "hours_ago": "{count} 小時前"
+  },
+  "video": {
+    "prev": "上一個",
+    "next": "下一個",
+    "key_frame": "定位關鍵影格"
+  },
+  "language": {
+    "en": "English",
+    "zh-TW": "繁體中文",
+    "zh-CN": "简体中文",
+    "ja": "日本語",
+    "ko": "한국어",
+    "auto": "自動偵測"
+  },
+  "client": {
+    "title": "檔案管理器",
+    "search": {
+      "placeholder": "搜尋檔案..."
+    },
+    "table": {
+      "name": "名稱",
+      "size": "大小",
+      "type": "類型",
+      "modified": "修改時間"
+    },
+    "button": {
+      "upload": "上傳",
+      "newFolder": "新建資料夾",
+      "refresh": "刷新",
+      "create": "創建",
+      "cancel": "取消",
+      "delete": "刪除",
+      "rename": "重命名",
+      "move": "移動",
+      "preview": "預覽",
+      "download": "下載"
+    },
+    "dialog": {
+      "createFolder": "創建新資料夾",
+      "folderName": "資料夾名稱",
+      "deleteTitle": "刪除「{name}」",
+      "deleteMessage": "確定要刪除此{type}嗎？此操作無法撤銷。",
+      "renameTitle": "重命名「{name}」",
+      "newName": "新名稱",
+      "previewTitle": "檔案預覽：{name}",
+      "uploadTitle": "上傳檔案{s}",
+      "moveTitle": "移動{type}「{name}」",
+      "selectFiles": "選擇檔案"
+    },
+    "type": {
+      "file": "檔案",
+      "folder": "資料夾",
+      "files": "個檔案"
+    },
+    "status": {
+      "uploading": "上傳中...",
+      "success": "成功",
+      "error": "錯誤"
+    }
+  },
+  "admin": {
+    "title": "管理面板",
+    "tab": {
+      "dashboard": "儀表板",
+      "users": "用戶",
+      "shares": "共享",
+      "config": "配置",
+      "settings": "設定"
+    },
+    "section": {
+      "systemResources": "系統資源",
+      "validation": "驗證",
+      "configuration": "管理配置",
+      "vlmPrompts": "VLM 提示詞",
+      "languagePacks": "語言包",
+      "llmConfig": "LLM 配置",
+      "processorConfig": "處理器配置",
+      "filterConfig": "過濾器配置",
+      "searchConfig": "搜索配置",
+      "systemConfig": "系統配置",
+      "uploadPath": "上傳路徑",
+      "serviceUrls": "服務 URL"
+    },
+    "resource": {
+      "cpu": "CPU",
+      "memory": "記憶體",
+      "swap": "交換空間",
+      "gpu": "GPU",
+      "gpuFreq": "GPU 頻率",
+      "systemPower": "系統功耗"
+    },
+    "table": {
+      "username": "用戶名",
+      "homeDir": "主目錄",
+      "status": "狀態",
+      "name": "名稱",
+      "port": "端口",
+      "filter": "過濾器",
+      "parameters": "參數"
+    },
+    "config": {
+      "systemPrompt": "系統提示詞",
+      "prompt": "提示詞",
+      "userPrompt": "用戶提示詞",
+      "maxTokens": "最大 Token 數",
+      "url": "URL",
+      "model": "模型",
+      "availableLanguages": "可用語言",
+      "importLanguagePack": "導入語言包",
+      "tools": "工具"
+    },
+    "stat": {
+      "users": "用戶",
+      "shares": "共享"
+    }
+  },
+  "app": {
+    "productName": "Momentry Studio",
+    "tagline": "Turn Every Moment Into Intelligence"
+  }
+}

src/main.ts

@@ -2,8 +2,11 @@ import { createApp } from 'vue'
 import App from './App.vue'
 import router from './router'
 import vObserve from './directives/vObserve'
+import i18n from './locales'
+import './assets/momentry-base.css'
 
 const app = createApp(App)
 app.use(router)
+app.use(i18n)
 app.directive('observe', vObserve)
 app.mount('#app')

src/main.ts.backup_local

@@ -0,0 +1,19 @@
+import { createApp } from 'vue'
+import { createRouter, createWebHistory } from 'vue-router'
+import App from './App.vue'
+import LoginView from './views/LoginView.vue'
+import ClientView from './views/ClientView.vue'
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [
+    { path: '/', redirect: '/login' },
+    { path: '/login', name: 'Login', component: LoginView },
+    { path: '/client', name: 'Client', component: ClientView },
+    { path: '/search', name: 'Search', component: { template: '<div>Search Page (Coming Soon)</div>' } },
+  ],
+})
+
+const app = createApp(App)
+app.use(router)
+app.mount('#app')

src/router/index.ts

@@ -12,8 +12,8 @@ const routes: RouteRecordRaw[] = [
   { path: '/login', name: 'Login', component: LoginView },
   { path: '/search', name: 'Search', component: SearchView },
   { path: '/library', name: 'Library', component: LibraryView },
-  { path: '/people', name: 'People', component: PeopleView },
-  { path: '/people/:uuid', name: 'PersonDetail', component: PersonDetailView },
+  { path: '/face', name: 'Face', component: PeopleView },
+  { path: '/face/:uuid', name: 'FaceDetail', component: PersonDetailView },
   { path: '/admin', name: 'Admin', component: AdminView },
   { path: '/client', name: 'Client', component: ClientView }
 ]
@@ -23,4 +23,23 @@ const router = createRouter({
   routes
 })
 
+router.beforeEach((to, _from, next) => {
+  const token = localStorage.getItem('token')
+  const isLoggedIn = !!token
+  
+  if (to.path === '/login') {
+    if (isLoggedIn) {
+      next('/search')
+    } else {
+      next()
+    }
+  } else {
+    if (isLoggedIn) {
+      next()
+    } else {
+      next('/login')
+    }
+  }
+})
+
 export default router

src/stores/advancedMode.ts

@@ -0,0 +1,28 @@
+// Advanced Mode Store - controls visibility of advanced features
+import { ref, computed } from 'vue'
+
+const ADVANCED_KEY = 'momentry_advanced_mode'
+
+// Load initial state
+const savedAdvanced = localStorage.getItem(ADVANCED_KEY)
+const isAdvancedMode = ref(savedAdvanced === 'true')
+
+export function useAdvancedMode() {
+  const isAdvanced = computed(() => isAdvancedMode.value)
+  
+  function toggleAdvanced() {
+    isAdvancedMode.value = !isAdvancedMode.value
+    localStorage.setItem(ADVANCED_KEY, isAdvancedMode.value.toString())
+  }
+  
+  function setAdvanced(value: boolean) {
+    isAdvancedMode.value = value
+    localStorage.setItem(ADVANCED_KEY, value.toString())
+  }
+  
+  return {
+    isAdvanced,
+    toggleAdvanced,
+    setAdvanced
+  }
+}

src/stores/agentStore.ts

@@ -0,0 +1,48 @@
+import { ref } from 'vue'
+
+export const agentTip = ref<string>('')
+export const showAgentTip = ref(false)
+export const agentSuggestions = ref<string[]>([])
+export const discoveryTip = ref<string>('')
+export const userBehavior = ref({
+  hasUsedKeywordSearch: false,
+  hasUsedSemanticSearch: false,
+  hasUsedPeopleSearch: false,
+  hasUsedFileFilter: false,
+  hasUsedContextMenu: false,
+  hasViewedPersonDetails: false,
+  hasBindedFace: false,
+  hasUsedSearchHistory: false,
+  hasUsedBookmark: false
+})
+
+export function showTip(message: string, duration = 5000) {
+  agentTip.value = message
+  showAgentTip.value = true
+  setTimeout(() => {
+    showAgentTip.value = false
+  }, duration)
+}
+
+export function showDiscovery(message: string, duration = 8000) {
+  discoveryTip.value = message
+  setTimeout(() => {
+    discoveryTip.value = ''
+  }, duration)
+}
+
+export function trackBehavior(action: keyof typeof userBehavior.value) {
+  userBehavior.value[action] = true
+  localStorage.setItem('momentry_user_behavior', JSON.stringify(userBehavior.value))
+}
+
+export function loadUserBehavior() {
+  const saved = localStorage.getItem('momentry_user_behavior')
+  if (saved) {
+    try {
+      userBehavior.value = JSON.parse(saved)
+    } catch (e) {
+      console.error('Failed to load user behavior:', e)
+    }
+  }
+}

src/stores/autoScan.ts

@@ -0,0 +1,28 @@
+// Auto Scan Store - controls whether registering a file triggers an automatic deep scan
+import { ref, computed } from 'vue'
+
+const AUTO_SCAN_KEY = 'momentry_auto_scan_after_register'
+
+// Load initial state (default OFF: pure registration, no auto deep scan)
+const savedAutoScan = localStorage.getItem(AUTO_SCAN_KEY)
+const autoScanEnabled = ref(savedAutoScan === 'true')
+
+export function useAutoScan() {
+  const autoScanAfterRegister = computed(() => autoScanEnabled.value)
+
+  function toggleAutoScan() {
+    autoScanEnabled.value = !autoScanEnabled.value
+    localStorage.setItem(AUTO_SCAN_KEY, autoScanEnabled.value.toString())
+  }
+
+  function setAutoScan(value: boolean) {
+    autoScanEnabled.value = value
+    localStorage.setItem(AUTO_SCAN_KEY, value.toString())
+  }
+
+  return {
+    autoScanAfterRegister,
+    toggleAutoScan,
+    setAutoScan,
+  }
+}

src/stores/themeStore.ts

@@ -0,0 +1,32 @@
+import { ref, watch, onMounted } from 'vue'
+
+const THEME_KEY = 'momentry_theme'
+const saved = localStorage.getItem(THEME_KEY) || 'auto'
+const theme = ref(saved)
+
+function applyTheme(t: string) {
+  if (t === 'auto') {
+    const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches
+    document.documentElement.setAttribute('data-theme', prefersDark ? 'dark' : 'light')
+  } else {
+    document.documentElement.setAttribute('data-theme', t)
+  }
+}
+
+watch(theme, (v) => {
+  localStorage.setItem(THEME_KEY, v)
+  applyTheme(v)
+})
+
+export function useTheme() {
+  onMounted(() => applyTheme(theme.value))
+
+  function toggleTheme() {
+    const current = theme.value === 'auto' 
+      ? (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
+      : theme.value
+    theme.value = current === 'dark' ? 'light' : 'dark'
+  }
+
+  return { theme, toggleTheme }
+}

src/utils/asrStatus.ts

@@ -29,10 +29,10 @@ export function getAsrStatus(asr: AsrData | null | undefined): AsrStatus {
 
 export function getAsrStatusLabel(status: AsrStatus): string {
   const labels: Record<AsrStatus, string> = {
-    'no_audio_track': '無音軌',
-    'silent_audio': '無語音',
-    'has_transcript': '有語音',
-    'processing': '處理中'
+    'no_audio_track': 'No Audio Track',
+    'silent_audio': 'No Speech',
+    'has_transcript': 'Has Speech',
+    'processing': 'Processing'
   }
   return labels[status]
 }

src/utils/faceLandmarkScoring.ts

@@ -0,0 +1,122 @@
+import type { FaceLandmarksResponse } from '@/api/types'
+
+export type LandmarkVerdict = 'PASS' | 'REVIEW' | 'FAIL'
+
+export interface LandmarkScoreResult {
+  score: number
+  verdict: LandmarkVerdict
+  reasons: string[]
+}
+
+function pts(arr?: number[][] | null): [number, number][] {
+  return (arr || []).map((p) => [p[0], p[1]] as [number, number])
+}
+
+function centroid(arr?: number[][] | null): [number, number] | null {
+  const a = pts(arr)
+  if (a.length === 0) return null
+  const cx = a.reduce((s, p) => s + p[0], 0) / a.length
+  const cy = a.reduce((s, p) => s + p[1], 0) / a.length
+  return [cx, cy]
+}
+
+export function scoreFaceLandmarks(fa: FaceLandmarksResponse): LandmarkScoreResult {
+  const lm = fa.landmarks || {}
+  const lips = fa.lips || {}
+  const reasons: string[] = []
+
+  // Dimension A: completeness (20)
+  let a = 20
+  for (const k of ['left_eye', 'right_eye', 'nose'] as const) {
+    const v = lm[k] || []
+    if (v.length === 0) {
+      a -= 20 / 3
+      reasons.push(`missing ${k}`)
+    } else if (![6, 8].includes(v.length)) {
+      reasons.push(`${k} pts=${v.length}`)
+    }
+  }
+  if (lips.outer_lips && ![0, 14].includes(lips.outer_lips.length)) {
+    reasons.push(`outer_lips pts=${lips.outer_lips.length}`)
+  }
+  if (lips.inner_lips && ![0, 6].includes(lips.inner_lips.length)) {
+    reasons.push(`inner_lips pts=${lips.inner_lips.length}`)
+  }
+
+  // Dimension B: geometry (50)
+  let b = 50
+  const faceSize = Math.max(fa.width, fa.height, 1)
+  const le = centroid(lm.left_eye)
+  const re = centroid(lm.right_eye)
+  const no = centroid(lm.nose)
+
+  if (le && re && faceSize > 0) {
+    const eyeDist = Math.hypot(le[0] - re[0], le[1] - re[1])
+    const eyeRatio = eyeDist / faceSize
+    if (eyeRatio < 0.25) {
+      const pen = Math.min(20, (0.25 - eyeRatio) * 200)
+      b -= pen
+      reasons.push(`eye_ratio=${eyeRatio.toFixed(2)} too small`)
+    } else if (eyeRatio > 0.55) {
+      const pen = Math.min(20, (eyeRatio - 0.55) * 100)
+      b -= pen
+      reasons.push(`eye_ratio=${eyeRatio.toFixed(2)} too large`)
+    }
+
+    const eyeDy = Math.abs(le[1] - re[1]) / faceSize
+    if (eyeDy > 0.15) {
+      const pen = Math.min(15, (eyeDy - 0.15) * 100)
+      b -= pen
+      reasons.push(`eye_dy=${eyeDy.toFixed(2)} asymmetric`)
+    }
+
+    if (no) {
+      const noseBelow = (no[1] - Math.max(le[1], re[1])) / faceSize
+      if (noseBelow < 0.03) {
+        const pen = Math.min(15, (0.03 - noseBelow) * 50)
+        b -= pen
+        reasons.push(`nose_below=${noseBelow.toFixed(2)}`)
+      } else if (noseBelow > 0.35) {
+        const pen = Math.min(15, (noseBelow - 0.35) * 50)
+        b -= pen
+        reasons.push(`nose_below=${noseBelow.toFixed(2)} too low`)
+      }
+
+      const off = eyeDist > 0 ? (no[0] - (le[0] + re[0]) / 2) / eyeDist : 0
+      if (Math.abs(off) > 0.4) {
+        const pen = Math.min(15, (Math.abs(off) - 0.4) * 20)
+        b -= pen
+        reasons.push(`nose_off_center=${off.toFixed(2)}`)
+      }
+    }
+  } else {
+    b -= 30
+    reasons.push('no eye centroids')
+  }
+
+  for (const k of ['left_eye', 'right_eye', 'nose'] as const) {
+    for (const p of pts(lm[k])) {
+      if (!(fa.x - 5 <= p[0] && p[0] <= fa.x + fa.width + 5 && fa.y - 5 <= p[1] && p[1] <= fa.y + fa.height + 5)) {
+        b -= 10
+        reasons.push(`${k} outside bbox`)
+        break
+      }
+    }
+  }
+  if (Math.min(fa.width, fa.height) < 64) {
+    b -= 10
+    reasons.push('face < 64px')
+  }
+
+  // Dimension C: confidence & pose (30)
+  let c = fa.confidence * 30
+  const pa = fa.pose_angle
+  const maxPose = Math.max(Math.abs(pa?.yaw || 0), Math.abs(pa?.roll || 0), Math.abs(pa?.pitch || 0))
+  if (maxPose > 1.5) {
+    reasons.push(`pose=${maxPose.toFixed(1)}`)
+  }
+
+  const score = Math.max(0, Math.min(100, a + b + c))
+  const verdict: LandmarkVerdict = score >= 70 ? 'PASS' : score >= 40 ? 'REVIEW' : 'FAIL'
+  return { score: Math.round(score * 10) / 10, verdict, reasons }
+}

src/utils/mockPoseData.ts

@@ -0,0 +1,60 @@
+import type { PoseResponse, AppearanceResponse } from '@/api/types'
+
+export const mockPose: PoseResponse = {
+  frame: 100,
+  keypoints: [
+    { name: 'nose', x: 100, y: 50, confidence: 0.9 },
+    { name: 'left_eye', x: 90, y: 45, confidence: 0.95 },
+    { name: 'right_eye', x: 110, y: 45, confidence: 0.95 },
+    { name: 'left_ear', x: 80, y: 50, confidence: 0.85 },
+    { name: 'right_ear', x: 120, y: 50, confidence: 0.85 },
+    { name: 'left_shoulder', x: 60, y: 100, confidence: 0.9 },
+    { name: 'right_shoulder', x: 140, y: 100, confidence: 0.9 },
+    { name: 'left_elbow', x: 50, y: 150, confidence: 0.85 },
+    { name: 'right_elbow', x: 150, y: 150, confidence: 0.85 },
+    { name: 'left_wrist', x: 45, y: 190, confidence: 0.8 },
+    { name: 'right_wrist', x: 155, y: 190, confidence: 0.8 },
+    { name: 'left_hip', x: 70, y: 200, confidence: 0.9 },
+    { name: 'right_hip', x: 130, y: 200, confidence: 0.9 },
+    { name: 'left_knee', x: 65, y: 280, confidence: 0.85 },
+    { name: 'right_knee', x: 135, y: 280, confidence: 0.85 },
+    { name: 'left_ankle', x: 60, y: 350, confidence: 0.8 },
+    { name: 'right_ankle', x: 140, y: 350, confidence: 0.8 },
+  ],
+  pose_class: 'standing',
+  confidence: 0.92
+}
+
+export const mockAppearance: AppearanceResponse = {
+  frame: 100,
+  dominant_colors: [
+    { rgb: [255, 100, 50], percentage: 0.35 },
+    { rgb: [50, 150, 200], percentage: 0.25 },
+    { rgb: [100, 200, 100], percentage: 0.15 },
+  ]
+}
+
+export const mockSittingPose: PoseResponse = {
+  frame: 200,
+  keypoints: [
+    { name: 'nose', x: 100, y: 60, confidence: 0.88 },
+    { name: 'left_eye', x: 90, y: 55, confidence: 0.92 },
+    { name: 'right_eye', x: 110, y: 55, confidence: 0.92 },
+    { name: 'left_ear', x: 80, y: 60, confidence: 0.82 },
+    { name: 'right_ear', x: 120, y: 60, confidence: 0.82 },
+    { name: 'left_shoulder', x: 60, y: 110, confidence: 0.88 },
+    { name: 'right_shoulder', x: 140, y: 110, confidence: 0.88 },
+    { name: 'left_elbow', x: 55, y: 140, confidence: 0.83 },
+    { name: 'right_elbow', x: 145, y: 140, confidence: 0.83 },
+    { name: 'left_wrist', x: 50, y: 160, confidence: 0.78 },
+    { name: 'right_wrist', x: 150, y: 160, confidence: 0.78 },
+    { name: 'left_hip', x: 70, y: 180, confidence: 0.88 },
+    { name: 'right_hip', x: 130, y: 180, confidence: 0.88 },
+    { name: 'left_knee', x: 90, y: 200, confidence: 0.83 },
+    { name: 'right_knee', x: 110, y: 200, confidence: 0.83 },
+    { name: 'left_ankle', x: 85, y: 240, confidence: 0.78 },
+    { name: 'right_ankle', x: 115, y: 240, confidence: 0.78 },
+  ],
+  pose_class: 'sitting',
+  confidence: 0.87
+}

src/utils/poseRenderer.ts

@@ -0,0 +1,264 @@
+import type { PoseResponse, AppearanceResponse } from '@/api/types'
+
+const SKELETON_CONNECTIONS: [string, string][] = [
+  ['nose', 'left_eye'],
+  ['nose', 'right_eye'],
+  ['left_eye', 'left_ear'],
+  ['right_eye', 'right_ear'],
+  ['left_shoulder', 'right_shoulder'],
+  ['left_shoulder', 'left_elbow'],
+  ['left_elbow', 'left_wrist'],
+  ['right_shoulder', 'right_elbow'],
+  ['right_elbow', 'right_wrist'],
+  ['left_shoulder', 'left_hip'],
+  ['right_shoulder', 'right_hip'],
+  ['left_hip', 'right_hip'],
+  ['left_hip', 'left_knee'],
+  ['left_knee', 'left_ankle'],
+  ['right_hip', 'right_knee'],
+  ['right_knee', 'right_ankle'],
+]
+
+function transformKeypoints(
+  keypoints: Array<{ name: string; x: number; y: number; confidence?: number }>,
+  canvasWidth: number,
+  canvasHeight: number
+): Map<string, { x: number; y: number; confidence: number }> {
+  console.log('[transformKeypoints] input keypoints:', keypoints?.length)
+
+  const validKeypoints = keypoints.filter(kp => {
+    const conf = kp.confidence ?? 0
+    return conf > 0 && kp.x > 0 && kp.y > 0
+  })
+
+  console.log('[transformKeypoints] valid keypoints:', validKeypoints.length)
+
+  if (validKeypoints.length === 0) {
+    return new Map()
+  }
+
+  let minX = Infinity, maxX = -Infinity
+  let minY = Infinity, maxY = -Infinity
+  for (const kp of validKeypoints) {
+    minX = Math.min(minX, kp.x)
+    maxX = Math.max(maxX, kp.x)
+    minY = Math.min(minY, kp.y)
+    maxY = Math.max(maxY, kp.y)
+  }
+
+  const width = maxX - minX || 1
+  const height = maxY - minY || 1
+
+  console.log('[transformKeypoints] bounding box:', minX, minY, 'to', maxX, maxY)
+  console.log('[transformKeypoints] bbox size:', width, 'x', height)
+
+  const padding = 20
+  const availableWidth = canvasWidth - 2 * padding
+  const availableHeight = canvasHeight - 2 * padding
+
+  const scaleX = availableWidth / width
+  const scaleY = availableHeight / height
+  const scale = Math.min(scaleX, scaleY)
+
+  const scaledWidth = width * scale
+  const scaledHeight = height * scale
+  const offsetX = (canvasWidth - scaledWidth) / 2 - minX * scale
+  const offsetY = (canvasHeight - scaledHeight) / 2 - minY * scale
+
+  console.log('[transformKeypoints] scale:', scale, 'offset:', offsetX, offsetY)
+
+  const keypointMap = new Map<string, { x: number; y: number; confidence: number }>()
+  for (const kp of keypoints) {
+    const conf = kp.confidence ?? 0
+    keypointMap.set(kp.name, {
+      x: kp.x * scale + offsetX,
+      y: kp.y * scale + offsetY,
+      confidence: conf
+    })
+  }
+
+  console.log('[transformKeypoints] First 3 transformed:', 
+    [...keypointMap.entries()].slice(0, 3).map(([k, v]) => ({ name: k, ...v })))
+
+  return keypointMap
+}
+
+export function drawPoseSkeleton(
+  canvas: HTMLCanvasElement,
+  pose: PoseResponse,
+  options?: {
+    lineWidth?: number
+    pointRadius?: number
+    lineColor?: string
+    pointColor?: string
+    videoWidth?: number
+    videoHeight?: number
+    noTransform?: boolean
+  }
+) {
+  console.log('[drawPoseSkeleton] canvas size:', canvas.width, 'x', canvas.height)
+  console.log('[drawPoseSkeleton] pose:', pose)
+
+  const ctx = canvas.getContext('2d')
+  if (!ctx) {
+    console.error('[drawPoseSkeleton] No context')
+    return
+  }
+
+  const {
+    lineWidth = 2,
+    pointRadius = 4,
+    lineColor = '#00ff00',
+    pointColor = '#ff0000',
+    noTransform = false
+  } = options || {}
+
+  ctx.clearRect(0, 0, canvas.width, canvas.height)
+
+  // 不轉換，直接畫原始座標（用於 debug）
+  if (noTransform) {
+    console.log('[drawPoseSkeleton] Drawing raw keypoints (no transform)')
+    
+    const validKeypoints = pose.keypoints.filter(kp => kp.confidence > 0 && kp.x > 0 && kp.y > 0)
+    
+    if (validKeypoints.length === 0) {
+      ctx.fillStyle = '#9aa0a6'
+      ctx.font = '12px sans-serif'
+      ctx.textAlign = 'center'
+      ctx.fillText('No valid keypoints', canvas.width / 2, canvas.height / 2)
+      return
+    }
+
+    // 找 bounding box
+    let minX = Infinity, maxX = -Infinity
+    let minY = Infinity, maxY = -Infinity
+    for (const kp of validKeypoints) {
+      minX = Math.min(minX, kp.x)
+      maxX = Math.max(maxX, kp.x)
+      minY = Math.min(minY, kp.y)
+      maxY = Math.max(maxY, kp.y)
+    }
+    
+    console.log('[drawPoseSkeleton] Raw bbox:', minX, minY, 'to', maxX, maxY)
+    
+    // 繪製
+    ctx.fillStyle = pointColor
+    for (const kp of validKeypoints) {
+      ctx.beginPath()
+      ctx.arc(kp.x, kp.y, pointRadius, 0, Math.PI * 2)
+      ctx.fill()
+    }
+    return
+  }
+
+  const keypointMap = transformKeypoints(pose.keypoints, canvas.width, canvas.height)
+
+  console.log('[drawPoseSkeleton] transformed keypoints:', keypointMap.size)
+
+  if (keypointMap.size === 0) {
+    console.log('[drawPoseSkeleton] No valid keypoints')
+    ctx.fillStyle = '#9aa0a6'
+    ctx.font = '12px sans-serif'
+    ctx.textAlign = 'center'
+    ctx.fillText('No pose detected', canvas.width / 2, canvas.height / 2)
+    return
+  }
+
+  ctx.strokeStyle = lineColor
+  ctx.lineWidth = lineWidth
+  for (const [from, to] of SKELETON_CONNECTIONS) {
+    const fromPt = keypointMap.get(from)
+    const toPt = keypointMap.get(to)
+    if (fromPt && toPt && fromPt.confidence > 0 && toPt.confidence > 0) {
+      ctx.beginPath()
+      ctx.moveTo(fromPt.x, fromPt.y)
+      ctx.lineTo(toPt.x, toPt.y)
+      ctx.stroke()
+    }
+  }
+
+  ctx.fillStyle = pointColor
+  for (const kp of pose.keypoints) {
+    const transformed = keypointMap.get(kp.name)
+    if (transformed && transformed.confidence > 0) {
+      ctx.beginPath()
+      ctx.arc(transformed.x, transformed.y, pointRadius, 0, Math.PI * 2)
+      ctx.fill()
+    }
+  }
+}
+
+export function drawAppearanceOverlay(
+  canvas: HTMLCanvasElement,
+  appearance: AppearanceResponse,
+  pose?: PoseResponse
+) {
+  const ctx = canvas.getContext('2d')
+  if (!ctx) return
+
+  ctx.clearRect(0, 0, canvas.width, canvas.height)
+
+  if (!appearance.dominant_colors?.length) {
+    if (appearance.hsv_histogram && appearance.hsv_histogram.length > 0) {
+      ctx.fillStyle = '#f8f9fa'
+      ctx.fillRect(0, 0, canvas.width, canvas.height)
+      ctx.fillStyle = '#5f6368'
+      ctx.font = '12px sans-serif'
+      ctx.textAlign = 'center'
+      ctx.fillText('HSV histogram', canvas.width / 2, canvas.height / 2 - 10)
+      ctx.fillText(`(${appearance.hsv_histogram.length} channels)`, canvas.width / 2, canvas.height / 2 + 10)
+    }
+    return
+  }
+
+  if (!pose) {
+    const swatchWidth = canvas.width / appearance.dominant_colors.length
+    appearance.dominant_colors.forEach((color, i) => {
+      ctx.fillStyle = `rgb(${color.rgb.join(',')})`
+      ctx.fillRect(i * swatchWidth, 0, swatchWidth, canvas.height)
+      if (color.percentage) {
+        ctx.fillStyle = '#fff'
+        ctx.font = '12px sans-serif'
+        ctx.fillText(`${Math.round(color.percentage * 100)}%`, i * swatchWidth + 4, canvas.height - 8)
+      }
+    })
+    return
+  }
+
+  const keypointMap = transformKeypoints(pose.keypoints, canvas.width, canvas.height)
+
+  if (keypointMap.size === 0) return
+
+  ctx.globalAlpha = 0.4
+
+  const upperBodyPts = ['left_shoulder', 'right_shoulder', 'left_elbow', 'right_elbow']
+  const lowerBodyPts = ['left_hip', 'right_hip', 'left_knee', 'right_knee']
+
+  if (appearance.dominant_colors[0]) {
+    const color = appearance.dominant_colors[0]
+    ctx.fillStyle = `rgb(${color.rgb.join(',')})`
+    for (const name of upperBodyPts) {
+      const pt = keypointMap.get(name)
+      if (pt && pt.confidence > 0) {
+        ctx.beginPath()
+        ctx.arc(pt.x, pt.y, 15, 0, Math.PI * 2)
+        ctx.fill()
+      }
+    }
+  }
+
+  if (appearance.dominant_colors[1]) {
+    const color = appearance.dominant_colors[1]
+    ctx.fillStyle = `rgb(${color.rgb.join(',')})`
+    for (const name of lowerBodyPts) {
+      const pt = keypointMap.get(name)
+      if (pt && pt.confidence > 0) {
+        ctx.beginPath()
+        ctx.arc(pt.x, pt.y, 15, 0, Math.PI * 2)
+        ctx.fill()
+      }
+    }
+  }
+
+  ctx.globalAlpha = 1.0
+}

src/views/LoginView.vue

@@ -20,9 +20,6 @@
         <div v-if="error" class="error-message">{{ error }}</div>
         <div v-if="success" class="success-message">Login successful!</div>
       </form>
-      <div class="login-footer">
-        <p>Default credentials: momentry / demo123</p>
-      </div>
     </div>
   </div>
 </template>
@@ -30,6 +27,7 @@
 <script setup lang="ts">
 import { ref } from 'vue'
 import { useRouter } from 'vue-router'
+import { isTauri } from '@/api/config'
 
 const router = useRouter()
 const username = ref('')
@@ -44,33 +42,57 @@ async function handleLogin() {
   success.value = false
 
   try {
-    const response = await fetch('http://localhost:11438/api/v2/auth/login', {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify({
+    if (isTauri) {
+      const { invoke } = await import('@tauri-apps/api/core')
+      const result: any = await invoke('login_user', {
         username: username.value,
-        password: password.value,
-      }),
-    })
-
-    const data = await response.json()
-
-    if (response.ok && data.token) {
-      success.value = true
-      localStorage.setItem('token', data.token)
-      localStorage.setItem('username', username.value)
-      localStorage.setItem('expires_at', data.expires_at)
+        password: password.value
+      })
       
-      setTimeout(() => {
-        router.push('/search')
-      }, 1000)
+      if (result.success && result.token) {
+        success.value = true
+        localStorage.setItem('token', result.token)
+        localStorage.setItem('username', username.value)
+        
+        window.dispatchEvent(new CustomEvent('ms-login', { detail: { username: username.value } }))
+        
+        setTimeout(() => {
+          router.push('/search')
+        }, 500)
+      } else {
+        error.value = result.error || 'Login failed'
+      }
     } else {
-      error.value = data.error || 'Login failed'
+      const apiBase = localStorage.getItem('proxy_url') || ''
+      const response = await fetch(apiBase + '/api/v1/auth/login', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          username: username.value,
+          password: password.value,
+        }),
+      })
+
+      const data = await response.json()
+
+      if (response.ok && data.success && data.token) {
+        success.value = true
+        localStorage.setItem('token', data.token)
+        localStorage.setItem('username', username.value)
+        
+        window.dispatchEvent(new CustomEvent('ms-login', { detail: { username: username.value } }))
+        
+        setTimeout(() => {
+          router.push('/search')
+        }, 500)
+      } else {
+        error.value = data.error || 'Login failed'
+      }
     }
   } catch (e: any) {
-    error.value = 'Network error: ' + e.message
+    error.value = 'Login error: ' + (e.message || 'Unknown error')
   } finally {
     loading.value = false
   }
@@ -172,11 +194,4 @@ async function handleLogin() {
   text-align: center;
   font-size: 14px;
 }
-
-.login-footer {
-  margin-top: 20px;
-  text-align: center;
-  color: #999;
-  font-size: 12px;
-}
 </style>

src/views/PersonDetailView.vue

@@ -5,10 +5,10 @@
         <svg width="14" height="14" viewBox="0 0 24 24" fill="none">
           <path d="M15 18l-6-6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
         </svg>
-        返回
+        Back
       </button>
       <button v-if="!isEditing" class="ms-ppl-edit-text-btn" @click="startEditing">
-        編輯
+        Edit
         <svg width="13" height="13" viewBox="0 0 24 24" fill="none" style="margin-left:4px;">
           <path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
           <path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
@@ -24,7 +24,7 @@
       <div class="ms-ppl-detail-header">
         <div style="display:flex;flex-direction:column;align-items:center;gap:8px;flex-shrink:0;">
           <div class="ms-ppl-detail-avatar" :class="{ 'ms-ppl-avatar-editable': isEditing }" @click="isEditing && triggerAvatarUpload()">
-            <img v-if="profile" :src="profile" alt="" style="width:100%;height:100%;object-fit:cover;">
+            <img v-if="profile" :src="profile" alt="" style="width:100%;height:100%;object-fit:contain;">
             <svg v-else class="ms-silhouette" viewBox="0 0 120 120" fill="none">
               <circle cx="60" cy="45" r="25" fill="#d1d5db"/>
               <ellipse cx="60" cy="105" rx="40" ry="25" fill="#d1d5db"/>
@@ -45,25 +45,39 @@
               <button class="ms-ppl-star-btn" :class="{ starred: person.starred }" @click="toggleStar">{{ person.starred ? '★' : '☆' }}</button>
               <div class="ms-ppl-view-box ms-ppl-view-name-box">{{ person.name || '—' }}</div>
             </div>
+            <div style="text-align:center;margin-top:2px;">
+              <span class="ms-ppl-source-badge" :class="detailSourceClass">{{ detailSourceLabel }}</span>
+            </div>
             <div class="ms-ppl-detail-aliases" v-if="person.metadata?.aliases?.length">
               <span v-for="(a, i) in person.metadata.aliases" :key="i" class="ms-ppl-alias-chip">{{ a.name }}</span>
             </div>
             <div class="ms-ppl-edit-fields" style="margin-top:4px;">
               <div class="ms-ppl-edit-field-row">
-                <span class="ms-ppl-edit-label">角色</span>
+                <span class="ms-ppl-edit-label">Role</span>
                 <div class="ms-ppl-view-box ms-ppl-view-field-box">{{ person.metadata?.role || '—' }}</div>
               </div>
               <div class="ms-ppl-edit-field-row ms-ppl-edit-field-row--top">
-                <span class="ms-ppl-edit-label">描述</span>
+                <span class="ms-ppl-edit-label">Description</span>
                 <div class="ms-ppl-view-box ms-ppl-view-notes-box">{{ person.metadata?.notes || '—' }}</div>
               </div>
+              <div class="ms-ppl-edit-field-row" v-if="person.file_uuids?.length">
+                <span class="ms-ppl-edit-label">Appears in</span>
+                <div class="ms-ppl-files-list">
+                  <div v-for="fu in person.file_uuids" :key="fu" class="ms-ppl-file-chip" :title="fu">
+                    <template v-if="isTmdb">
+                      <span class="ms-keyword-label">Keyword</span>
+                    </template>
+                    {{ getFileName(fu) }}<span class="ms-ppl-file-chip-uuid">{{ fu }}</span>
+                  </div>
+                </div>
+              </div>
             </div>
           </div>
           <!-- Edit mode -->
           <div v-else id="msPplInfoEdit">
             <div class="ms-ppl-edit-row ms-ppl-edit-name-row">
               <button class="ms-ppl-star-btn" :class="{ starred: person.starred }" @click="toggleStar">{{ person.starred ? '★' : '☆' }}</button>
-              <input v-model="editName" class="ms-ppl-edit-input ms-ppl-edit-name-input" placeholder="加入人名">
+              <input v-model="editName" class="ms-ppl-edit-input ms-ppl-edit-name-input" placeholder="Enter name">
             </div>
             <div class="ms-ppl-edit-row ms-ppl-edit-alias-row">
               <div class="ms-ppl-alias-wrap-inner">
@@ -74,30 +88,30 @@
               </div>
               <template v-if="showAliasInput">
                 <select v-model="aliasLocale" class="ms-ppl-alias-locale-select">
-                  <option value="en">English</option>
-                  <option value="zh-TW">繁體中文</option>
-                  <option value="zh-CN">简体中文</option>
-                  <option value="ja">日本語</option>
-                  <option value="ko">한국어</option>
+                  <option value="en">{{ $t('language.en') }}</option>
+                  <option value="zh-TW">{{ $t('language.zh-TW') }}</option>
+                  <option value="zh-CN">{{ $t('language.zh-CN') }}</option>
+                  <option value="ja">{{ $t('language.ja') }}</option>
+                  <option value="ko">{{ $t('language.ko') }}</option>
                 </select>
-                <input v-model="aliasName" class="ms-ppl-alias-inline-input" placeholder="輸入別名後按 Enter" @keyup.enter="addAlias">
+                <input v-model="aliasName" class="ms-ppl-alias-inline-input" placeholder="Enter alias and press Enter" @keyup.enter="addAlias">
               </template>
-              <button v-if="!showAliasInput" class="ms-ppl-alias-add-btn" @click="showAliasInput = true; aliasName = ''">＋ 別名</button>
-              <button v-else class="ms-ppl-alias-add-btn" @click="showAliasInput = false">收起</button>
+              <button v-if="!showAliasInput" class="ms-ppl-alias-add-btn" @click="showAliasInput = true; aliasName = ''">{{ $t('people.detail.add_alias') }}</button>
+              <button v-else class="ms-ppl-alias-add-btn" @click="showAliasInput = false">Collapse</button>
             </div>
             <div class="ms-ppl-edit-fields">
               <div class="ms-ppl-edit-field-row">
-                <label class="ms-ppl-edit-label">角色</label>
-                <input v-model="editRole" class="ms-ppl-edit-input ms-ppl-edit-field-input" placeholder="角色名稱">
+                <label class="ms-ppl-edit-label">Role</label>
+                <input v-model="editRole" class="ms-ppl-edit-input ms-ppl-edit-field-input" placeholder="Role name">
               </div>
               <div class="ms-ppl-edit-field-row ms-ppl-edit-field-row--top">
-                <label class="ms-ppl-edit-label">描述</label>
-                <textarea v-model="editNotes" class="ms-ppl-edit-textarea ms-ppl-edit-field-input" placeholder="自訂描述"></textarea>
+                <label class="ms-ppl-edit-label">Description</label>
+                <textarea v-model="editNotes" class="ms-ppl-edit-textarea ms-ppl-edit-field-input" placeholder="Custom description"></textarea>
               </div>
             </div>
             <div class="ms-ppl-edit-actions">
-              <button class="ms-fm-btn ms-fm-btn-primary" @click="saveEdit" :disabled="saving">{{ saving ? '儲存中...' : '✓ 儲存更改' }}</button>
-              <button class="ms-fm-btn" @click="cancelEditing">取消</button>
+              <button class="ms-fm-btn ms-fm-btn-primary" @click="saveEdit" :disabled="saving">{{ saving ? 'Saving...' : '✓ Save Changes' }}</button>
+              <button class="ms-fm-btn" @click="cancelEditing">Cancel</button>
             </div>
           </div>
         </div>
@@ -105,14 +119,14 @@
 
       <!-- Trace strip (face_traces from get_traces) -->
       <div class="ms-ppl-strip-wrap" :class="{ 'ms-ppl-edit-mode': isEditing }">
-        <button class="ms-ppl-strip-add-btn" @click="showCandidates = true" title="加入相同人物">＋</button>
+        <button class="ms-ppl-strip-add-btn" @click="showCandidates = true" title="Add same person">＋</button>
         <button class="ms-ppl-strip-arrow" :disabled="faceStripPage === 1" @click="prevFacePage">‹</button>
         <div class="ms-ppl-face-strip">
-          <div v-if="loadingTraces" style="padding:10px;color:#999;font-size:12px;">Loading traces...</div>
-          <div v-else-if="allTraces.length === 0" style="padding:10px;color:#999;font-size:12px;">No traces found</div>
+          <div v-if="loadingTraces" style="padding:10px;color:#999;font-size:12px;">Loading FS...</div>
+          <div v-else-if="allTraces.length === 0" style="padding:10px;color:#999;font-size:12px;">No FS found</div>
           <div v-for="(t, i) in paginatedTraces" :key="t.trace_id" class="ms-ppl-strip-face ms-ppl-strip-face-clickable" :class="{ selected: selectedTrace?.trace_id === t.trace_id }" @click="selectTrace(t)" @contextmenu.prevent="showTraceCtxMenu($event, t)">
             <div class="ms-ppl-strip-face-img">
-              <img v-if="traceThumbs[thumbKey(t.file_uuid, t.first_frame)]" :src="traceThumbs[thumbKey(t.file_uuid, t.first_frame)]" alt="" loading="lazy" style="width:100%;height:100%;object-fit:cover;border-radius:8px;">
+              <img v-if="traceThumbs[thumbKey(t.file_uuid, t.first_frame)]" :src="traceThumbs[thumbKey(t.file_uuid, t.first_frame)]" alt="" loading="lazy" style="width:100%;height:100%;object-fit:contain;border-radius:8px;">
               <div v-else style="width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#eef2ff;color:#6366f1;font-size:10px;font-weight:600;border-radius:8px;">T{{ t.trace_id }}</div>
             </div>
             <div class="ms-ppl-strip-trace-label">T{{ t.trace_id }} {{ t.face_id ? 'F' + t.face_id.slice(-4) : '' }}</div>
@@ -126,8 +140,8 @@
       <!-- Trace detail card -->
       <div v-if="selectedTrace" class="ms-ppl-face-card-detail">
         <button class="ms-ppl-face-card-close" @click="selectedTrace = null">×</button>
-        <div class="ms-ppl-face-card-img-wrap">
-          <img v-if="traceThumbs[thumbKey(selectedTrace.file_uuid, selectedTrace.first_frame)]" :src="traceThumbs[thumbKey(selectedTrace.file_uuid, selectedTrace.first_frame)]" alt="" style="width:100%;height:100%;object-fit:cover;border-radius:12px;">
+        <div class="ms-ppl-face-card-img-wrap" @click="showEnlargedFace = true" style="cursor:pointer;">
+          <img v-if="traceThumbs[thumbKey(selectedTrace.file_uuid, selectedTrace.first_frame)]" :src="traceThumbs[thumbKey(selectedTrace.file_uuid, selectedTrace.first_frame)]" alt="" style="width:100%;height:100%;object-fit:contain;border-radius:12px;">
           <div v-else class="face-placeholder">?</div>
         </div>
         <div class="ms-ppl-face-card-info">
@@ -137,23 +151,33 @@
             {{ (selectedTrace.first_sec || 0).toFixed(1) }}s ~ {{ (selectedTrace.last_sec || 0).toFixed(1) }}s
             <span class="ms-ppl-face-card-dur">({{ traceDuration(selectedTrace).toFixed(1) }}s)</span>
           </div>
+          <div class="ms-ppl-face-card-frame-range">
+            Frame: #{{ selectedTrace.first_frame }} ~ #{{ selectedTrace.last_frame }}
+          </div>
           <div class="ms-ppl-face-card-fps" v-if="traceFps(selectedTrace)">
             {{ traceFps(selectedTrace) }} fps · {{ selectedTrace.last_frame - selectedTrace.first_frame }} frames
           </div>
-          <div class="ms-ppl-face-card-conf">#{{ selectedTrace.first_frame }}–#{{ selectedTrace.last_frame }} · {{ selectedTrace.file_uuid?.slice(0, 8) }}...</div>
           <div class="ms-ppl-face-card-actions">
-            <button class="ms-fm-btn" @click="playTrace(selectedTrace)">▶ 播放</button>
-            <button v-if="isEditing && selectedTrace.face_id" class="ms-fm-btn ms-fm-btn-danger" @click="unbindFace(selectedTrace); selectedTrace = null">✕ 解綁</button>
+            <button class="ms-fm-btn" @click="playTrace(selectedTrace)">▶ Play</button>
+            <button v-if="isEditing && selectedTrace.face_id" class="ms-fm-btn ms-fm-btn-danger" @click="unbindFace(selectedTrace); selectedTrace = null">✕ Unbind</button>
           </div>
         </div>
       </div>
 
+      <!-- Enlarged face image modal -->
+      <div v-if="showEnlargedFace && selectedTrace" class="ms-modal-overlay show" @click.self="showEnlargedFace = false" style="z-index:10000;">
+        <div class="ms-enlarged-face-modal">
+          <button class="ms-modal-video-close" @click="showEnlargedFace = false">&times;</button>
+          <img v-if="traceThumbs[thumbKey(selectedTrace.file_uuid, selectedTrace.first_frame)]" :src="traceThumbs[thumbKey(selectedTrace.file_uuid, selectedTrace.first_frame)]" alt="" style="max-width:90vw;max-height:90vh;object-fit:contain;border-radius:12px;">
+        </div>
+      </div>
+
       <!-- Single segment card (entry point to player with all traces) -->
       <div v-if="loadingTraces" class="ms-ppl-media-label" style="margin-bottom:20px;">Loading segments...</div>
       <div v-else-if="loadingMoreTraces" class="ms-ppl-media-label" style="margin-bottom:20px;color:#9aa0a6;">Loading more segments...</div>
       <div v-if="allSegCard" class="ms-ppl-media-item segment-card" @click="playAllSegments">
         <div class="ms-ppl-media-thumb">
-          <img v-if="thumbs[allSegCard.thumbKey]" :src="thumbs[allSegCard.thumbKey]" alt="" loading="lazy" style="width:100%;height:100%;object-fit:cover;">
+          <img v-if="thumbs[allSegCard.thumbKey]" :src="thumbs[allSegCard.thumbKey]" alt="" loading="lazy" style="width:100%;height:100%;object-fit:contain;">
           <div class="ms-thumb-play-circle">
             <svg width="20" height="20" viewBox="0 0 24 24"><polygon points="6,4 20,12 6,20" fill="white"/></svg>
           </div>
@@ -161,26 +185,26 @@
           <span v-if="allSegCard.avg_confidence" class="ms-ppl-media-badge-conf">{{ (allSegCard.avg_confidence * 100).toFixed(0) }}%</span>
         </div>
         <div class="ms-ppl-media-info">
-          <div class="ms-ppl-media-title">{{ allSegCard.count }} 個片段 · {{ allTraces.length }} 個追蹤</div>
-          <div class="ms-ppl-media-sub">所有片段 · {{ formatTime(allSegCard.start) }}</div>
+          <div class="ms-ppl-media-title">{{ allSegCard.count }} segments · {{ allTraces.length }} FS</div>
+          <div class="ms-ppl-media-sub">All segments · {{ formatTime(allSegCard.start) }}</div>
         </div>
       </div>
-      <div v-else-if="!loadingTraces" class="ms-ppl-media-label" style="margin-bottom:20px;">No trace segments available for this person</div>
+      <div v-else-if="!loadingTraces" class="ms-ppl-media-label" style="margin-bottom:20px;">No FS segments available for this person</div>
 
       <!-- Tabs -->
       <div v-show="activeTab === 'actions'">
         <div class="ms-ppl-actions-section">
           <div class="ms-ppl-actions-status">
-            <span class="ms-ppl-actions-label">狀態：</span>
+            <span class="ms-ppl-actions-label">Status:</span>
             <span class="ms-ppl-actions-value">{{ person.status || 'confirmed' }}</span>
-            <button v-if="person.status !== 'confirmed'" class="ms-fm-btn ms-fm-btn-primary" @click="updateStatus('confirmed')">✓ 確認</button>
-            <button v-if="person.status !== 'pending'" class="ms-fm-btn" @click="updateStatus('pending')">待定</button>
-            <button v-if="person.status !== 'skipped'" class="ms-fm-btn" @click="updateStatus('skipped')">略過</button>
+            <button v-if="person.status !== 'confirmed'" class="ms-fm-btn ms-fm-btn-primary" @click="updateStatus('confirmed')">✓ Confirm</button>
+            <button v-if="person.status !== 'pending'" class="ms-fm-btn" @click="updateStatus('pending')">Pending</button>
+            <button v-if="person.status !== 'skipped'" class="ms-fm-btn" @click="updateStatus('skipped')">Skip</button>
           </div>
         </div>
         <div class="ms-ppl-actions-section" style="margin-top:16px;">
-          <button class="ms-fm-btn ms-fm-btn-primary" @click="showCandidates = true" style="margin-bottom:8px;">+ 綁定人臉</button>
-          <button class="ms-fm-btn ms-fm-btn-blue" @click="showMerge = true" style="margin-bottom:8px;">⇄ 合併到其他人物</button>
+          <button class="ms-fm-btn ms-fm-btn-primary" @click="showCandidates = true" style="margin-bottom:8px;">+ Bind Face</button>
+          <button class="ms-fm-btn ms-fm-btn-blue" @click="showMerge = true" style="margin-bottom:8px;">⇄ Merge to Other Person</button>
         </div>
 
         <div class="ms-ppl-delete-zone">
@@ -191,7 +215,7 @@
               <path d="M19 6l-1 14H6L5 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
               <path d="M10 11v6M14 11v6" stroke="currentColor" stroke-width="2" stroke-linecap="round"></path>
             </svg>
-            刪除此人物
+            Delete This Person
           </button>
         </div>
       </div>
@@ -221,10 +245,10 @@
     <div v-if="showMerge" class="ms-modal-overlay show" @click.self="showMerge = false">
       <div class="ms-modal ms-modal-merge">
         <button class="ms-fm-icon-btn close-btn" @click="showMerge = false">×</button>
-        <h2 class="ms-ppl-section-title">⇄ 合併到其他人物</h2>
+        <h2 class="ms-ppl-section-title">⇄ Merge to Other Person</h2>
         <div class="ms-merge-search-wrap">
           <span class="ms-merge-search-icon">🔍</span>
-          <input v-model="mergeSearchQuery" class="ms-merge-search-input" placeholder="搜尋人物名稱..." @input="onMergeSearch" />
+          <input v-model="mergeSearchQuery" class="ms-merge-search-input" placeholder="Search person name..." @input="onMergeSearch" />
         </div>
         <div class="ms-merge-grid">
           <div v-for="r in mergeSearchResults" :key="r.identity_id" class="ms-merge-face-card" @click="confirmMergeTarget(r)">
@@ -241,16 +265,16 @@
           </div>
         </div>
         <div class="ms-merge-footer">
-          <button class="ms-fm-btn" @click="showMerge = false">取消</button>
+          <button class="ms-fm-btn" @click="showMerge = false">Cancel</button>
         </div>
       </div>
     </div>
 
-    <VideoPlayer v-if="playing" :file-uuid="currentVideo.fileUuid" :start-time="currentVideo.startTime" :end-time="currentVideo.endTime" :all-traces="allTraces" :merged-segments="mergedSegments" :initial-trace-idx="currentVideo.traceIdx" :title="currentVideo.title" @close="playing = false" />
+    <VideoPlayer v-if="playing" :file-uuid="currentVideo.fileUuid" :start-frame="currentVideo.startFrame" :end-frame="currentVideo.endFrame" :all-traces="allTraces" :merged-segments="mergedSegments" :initial-trace-idx="currentVideo.traceIdx" :title="currentVideo.title" :show-face="true" :show-asrx="false" :show-ocr="false" :show-pose="false" @close="playing = false" />
 
     <!-- Trace strip context menu -->
     <div v-if="traceCtxMenu.show" class="ms-ctx-menu" :style="{ left: traceCtxMenu.x + 'px', top: traceCtxMenu.y + 'px', display: 'block' }" @click.stop @mousedown.stop @pointerdown.stop>
-      <button class="ms-ctx-item ms-ctx-danger" @click="traceCtxAction('unbind')">不是此人物</button>
+      <button class="ms-ctx-item ms-ctx-danger" @click="traceCtxAction('unbind')">Not This Person</button>
     </div>
   </div>
 </template>
@@ -260,7 +284,7 @@ import { ref, computed, onMounted, onUnmounted, watch, nextTick } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { apiCall } from '@/api'
 import { isTauri } from '@/api/config'
-import { ensurePeople, peopleCache, peopleLoaded, profilesCache, loadProfile as storeLoadProfile, faceThumbsCache, loadFaceThumb as storeLoadFaceThumb, thumbnailsCache, loadThumbnail, invalidatePeople, invalidateProfile } from '@/store'
+import { ensurePeople, peopleCache, peopleLoaded, profilesCache, loadProfile as storeLoadProfile, faceThumbsCache, loadFaceThumb as storeLoadFaceThumb, thumbnailsCache, loadThumbnail, invalidatePeople, invalidateProfile, filesCache, ensureFiles } from '@/store'
 import VideoPlayer from '@/components/VideoPlayer.vue'
 
 const route = useRoute()
@@ -276,7 +300,7 @@ const allPeople = ref<any[]>([])
 const allTraces = ref<any[]>([])
 const mergedSegments = ref<any[]>([])
 const playing = ref(false)
-const currentVideo = ref({ fileUuid: '', startTime: 0, endTime: 0, traceIdx: 0, title: '' })
+const currentVideo = ref({ fileUuid: '', startFrame: 0, endFrame: 0, traceIdx: 0, title: '' })
 const showCandidates = ref(false)
 const showMerge = ref(false)
 const mergeSearchQuery = ref('')
@@ -286,6 +310,26 @@ const thumbs = thumbnailsCache
 const traceThumbs = thumbnailsCache
 const faceThumbs = faceThumbsCache
 
+const isTmdb = computed(() => {
+  const p = person.value
+  return !!(p && (p.source === 'tmdb' || p.tmdb_id || p.metadata?.role))
+})
+const detailSourceLabel = computed(() => {
+  const p = person.value
+  if (!p) return ''
+  if (p.source === 'tmdb' || p.tmdb_id) return 'TMDB'
+  if (p.source === 'user') return 'User'
+  if (p.metadata?.role) return 'TMDB'
+  return 'Auto'
+})
+const detailSourceClass = computed(() => {
+  const p = person.value
+  if (!p) return ''
+  if (p.source === 'tmdb' || p.tmdb_id || p.metadata?.role) return 'ms-source-tmdb'
+  if (p.source === 'user') return 'ms-source-user'
+  return 'ms-source-auto'
+})
+
 const allSegCard = computed(() => {
   const m = mergedSegments.value
   if (!m.length) return null
@@ -317,6 +361,7 @@ const avatarUploading = ref(false)
 const activeTab = ref<'faces' | 'actions'>('faces')
 const traceCtxMenu = ref({ show: false, x: 0, y: 0, trace: null as any })
 const selectedTrace = ref<any>(null)
+const showEnlargedFace = ref(false)
 const fileInput = ref<HTMLInputElement | null>(null)
 const loadingMoreTraces = ref(false)
 const faceStripPage = ref(1)
@@ -329,15 +374,27 @@ const faceStripTotalPages = computed(() => Math.ceil(allTraces.value.length / fa
 function prevFacePage() { if (faceStripPage.value > 1) faceStripPage.value-- }
 function nextFacePage() { if (faceStripPage.value < faceStripTotalPages.value) faceStripPage.value++ }
 
+function getFileName(fileUuid: string): string {
+  const f = filesCache.value.find((f: any) => f.file_uuid?.replace(/-/g, '') === fileUuid)
+  return f?.file_name || fileUuid
+}
+
 onMounted(async () => {
   const uuid = route.params.uuid as string
   try {
-    await ensurePeople()
+    await Promise.all([ensurePeople(), ensureFiles()])
     peopleCount.value = peopleCache.value.length
     allPeople.value = peopleCache.value
     const found = allPeople.value.find((p: any) => p.identity_uuid === uuid)
     if (found) {
       person.value = { ...found, status: found.status || 'confirmed' }
+      if (!person.value.file_uuids?.length) {
+        try {
+          const result: any = await apiCall('get_identity_files', { uuid, pageSize: 20 })
+          const files = result?.data || []
+          person.value.file_uuids = files.map((f: any) => f.file_uuid)
+        } catch (e) { /* ignore */ }
+      }
       loadProfile(uuid)
       loadMedia(uuid)
     }
@@ -381,10 +438,13 @@ function playTrace(t: any) {
   if (!t) return
   const idx = allTraces.value.indexOf(t)
   if (idx < 0) return
+  const fps = traceFps(t) || 24
+  const startFrame = Math.max(0, (t.first_frame || 0) - 10)
+  const endFrame = (t.last_frame || 0) + 10
   currentVideo.value = {
     fileUuid: t.file_uuid || '',
-    startTime: t.first_sec || t.start_time || 0,
-    endTime: t.last_sec || t.end_time || 0,
+    startFrame: startFrame,
+    endFrame: endFrame,
     traceIdx: idx,
     title: `${person.value?.name} · T${t.trace_id}`,
   }
@@ -498,8 +558,10 @@ function loadThumb(uuid: string, frame: number) {
 }
 
 async function loadCandidates() {
+  const fileUuid = person.value?.file_uuids?.[0]
+  if (!fileUuid) { candidates.value = []; return }
   try {
-    const result: any = await apiCall('get_face_candidates', { page: 1, perPage: 20 })
+    const result: any = await apiCall('get_face_candidates', { page: 1, perPage: 20, fileUuid })
     candidates.value = (Array.isArray(result) ? result : []).map((c: any) => ({
       ...c,
       thumbKey: `cand_${c.id}`
@@ -632,8 +694,8 @@ async function unbindFace(t: any) {
   if (!person.value) return
   const uuid = person.value.identity_uuid
   const fid = t.face_id || t.faceId || null
-  if (!fid) { alert('此 trace 沒有 face_id，無法解綁'); return }
-  if (!confirm(`解綁 trace T${t.trace_id}（face_id: ${fid}）？`)) return
+  if (!fid) { alert('This trace has no face_id, cannot unbind'); return }
+  if (!confirm(`Unbind trace T${t.trace_id} (face_id: ${fid})?`)) return
   try {
     await apiCall('unbind_face', {
       uuid,
@@ -653,7 +715,7 @@ async function unbindFace(t: any) {
     }
   } catch (e) {
     console.error('Unbind failed:', e)
-    alert('解綁失敗：' + (e instanceof Error ? e.message : String(e)))
+    alert('Unbind failed: ' + (e instanceof Error ? e.message : String(e)))
   }
 }
 
@@ -672,10 +734,10 @@ function playAllSegments() {
   const t = allTraces.value[0]
   currentVideo.value = {
     fileUuid: t.file_uuid || '',
-    startTime: t.first_sec || t.start_time || 0,
-    endTime: t.last_sec || t.end_time || 0,
+    startFrame: t.first_frame || 0,
+    endFrame: t.last_frame || (t.first_frame || 0) + 30,
     traceIdx: 0,
-    title: `${person.value?.name} · ${card.count} 個片段`,
+    title: `F${t.first_frame || 0}-F${t.last_frame || 0} (${formatTime(t.first_sec || 0)}-${formatTime(t.last_sec || 0)})`,
   }
   playing.value = true
 }
@@ -685,10 +747,10 @@ function playMerged(m: any) {
   if (!t) return
   currentVideo.value = {
     fileUuid: t.file_uuid || '',
-    startTime: t.first_sec || t.start_time || 0,
-    endTime: t.last_sec || t.end_time || 0,
+    startFrame: t.first_frame || 0,
+    endFrame: t.last_frame || (t.first_frame || 0) + 30,
     traceIdx: m._startIdx,
-    title: `${person.value?.name} · #${m.start_frame}–#${m.end_frame}`,
+    title: `F${t.first_frame || 0}-F${t.last_frame || 0} (${formatTime(t.first_sec || 0)}-${formatTime(t.last_sec || 0)})`,
   }
   playing.value = true
 }
@@ -735,7 +797,7 @@ async function onMergeSearch() {
 
 async function confirmMergeTarget(target: any) {
   if (!person.value) return
-  if (!confirm(`合併「${person.value.name}」到「${target.name}」？`)) return
+  if (!confirm(`Merge "${person.value.name}" into "${target.name}"?`)) return
   try {
     await apiCall('merge_identities', { uuid: person.value.identity_uuid, intoUuid: target.identity_uuid })
     showMerge.value = false
@@ -749,96 +811,110 @@ let mergeSearchTimer: any
 <style scoped>
 .people-view { max-width: 1200px; padding-top: 20px; }
 .ms-ppl-topbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; margin-top: 20px; }
-.ms-ppl-edit-text-btn { border: none; background: transparent; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13px; color: #5f6368; cursor: pointer; outline: none; padding: 4px 10px; display: flex; align-items: center; gap: 4px; transition: color .15s; }
-.ms-ppl-edit-text-btn:hover { color: #202124; }
-.loading-state, .empty { text-align: center; padding: 60px 0; color: #5f6368; }
-.spinner-lg { width: 24px; height: 24px; border: 3px solid #e8eaed; border-top-color: #202124; border-radius: 50%; animation: spin 0.7s linear infinite; margin: 0 auto 12px; }
+.ms-ppl-edit-text-btn { border: none; background: transparent; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13px; color: var(--text-secondary); cursor: pointer; outline: none; padding: 4px 10px; display: flex; align-items: center; gap: 4px; transition: color .15s; }
+.ms-ppl-edit-text-btn:hover { color: var(--text-primary); }
+.loading-state, .empty { text-align: center; padding: 60px 0; color: var(--text-secondary); }
+.spinner-lg { width: 24px; height: 24px; border: 3px solid var(--border-light); border-top-color: var(--text-primary); border-radius: 50%; animation: spin 0.7s linear infinite; margin: 0 auto 12px; }
 @keyframes spin { to { transform: rotate(360deg); } }
 .close-btn { position: absolute; top: 16px; right: 16px; }
 .ms-ppl-detail-header { display: flex; align-items: flex-start; gap: 22px; margin-bottom: 28px; position: relative; margin-top: 20px; }
-.ms-ppl-detail-avatar { width: 120px; height: 120px; border-radius: 20px; background: #e0e0e0; flex-shrink: 0; overflow: hidden; position: relative; }
-.ms-ppl-detail-avatar img { width: 100%; height: 100%; object-fit: cover; border-radius: 20px; }
+.ms-ppl-detail-avatar { width: 120px; height: 120px; border-radius: 20px; background: var(--border-light); flex-shrink: 0; overflow: hidden; position: relative; }
+.ms-ppl-detail-avatar img { width: 100%; height: 100%; object-fit: contain; border-radius: 20px; }
 .ms-ppl-avatar-editable { cursor: pointer; }
 .ms-ppl-avatar-upload-hint { position: absolute; inset: 0; border-radius: 20px; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .15s; pointer-events: none; }
 .ms-ppl-avatar-editable:hover .ms-ppl-avatar-upload-hint { opacity: 1; }
 .ms-ppl-avatar-upload-hint svg { color: #fff; }
 .ms-silhouette { width: 100%; height: 100%; }
 .ms-ppl-detail-name-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
-.ms-ppl-star-btn { font-size: 20px; background: transparent; border: none; cursor: pointer; outline: none; line-height: 1; color: #d1d5db; transition: color .15s; padding: 0; flex-shrink: 0; }
-.ms-ppl-star-btn.starred { color: #f59e0b; }
-.ms-ppl-detail-aliases { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 12px; }
-.ms-ppl-alias-chip { display: inline-flex; align-items: center; background: #f0f0f0; border-radius: 999px; padding: 3px 10px; font-size: 11.5px; color: #5f6368; }
+.ms-ppl-star-btn { font-size: 20px; background: transparent; border: none; cursor: pointer; outline: none; line-height: 1; color: var(--text-secondary); transition: color .15s; padding: 0; flex-shrink: 0; }
+.ms-ppl-star-btn.starred { color: var(--warning-color); }
+.ms-ppl-alias-chip { display: inline-flex; align-items: center; background: var(--hover-background); border-radius: 999px; padding: 3px 10px; font-size: 11.5px; color: var(--text-secondary); }
+.ms-keyword-label { display: inline-flex; align-items: center; background: rgba(var(--primary-color-rgb), 0.1); border-radius: 4px; padding: 1px 6px; margin-right: 4px; font-size: 10px; color: var(--primary-color); font-weight: 500; }
+.ms-ppl-source-badge { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
+.ms-source-tmdb { color: #1a73e8; }
+.ms-source-user { color: #188038; }
+.ms-source-auto { color: #9aa0a6; }
+.ms-ppl-files-list { display: flex; flex-wrap: wrap; gap: 4px; }
+.ms-ppl-file-chip { background: rgba(var(--primary-color-rgb), 0.1); border-radius: 4px; padding: 2px 8px; font-size: 11px; color: var(--primary-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; cursor: default; display: inline-flex; align-items: center; gap: 6px; }
+.ms-ppl-file-chip-uuid { font-size: 9px; color: var(--text-secondary); font-family: monospace; }
 .ms-ppl-edit-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
 .ms-ppl-edit-name-row { margin-bottom: 8px; }
 .ms-ppl-edit-alias-row { padding-left: 32px; margin-bottom: 16px; gap: 6px; align-items: center; }
 .ms-ppl-alias-wrap-inner { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
-.ms-ppl-alias-tag { display: inline-flex; align-items: center; gap: 5px; background: #e8eaed; border-radius: 999px; padding: 4px 10px; font-size: 12.5px; color: #202124; }
-.ms-ppl-alias-tag button { border: none; background: transparent; cursor: pointer; color: #5f6368; font-size: 14px; line-height: 1; padding: 0; display: flex; align-items: center; }
-.ms-ppl-alias-add-btn { border: 1.5px dashed #bbb; background: transparent; border-radius: 999px; padding: 4px 10px; font-size: 12px; color: #5f6368; cursor: pointer; outline: none; }
-.ms-ppl-alias-add-btn:hover { border-color: #202124; color: #202124; }
+.ms-ppl-alias-tag { display: inline-flex; align-items: center; gap: 5px; background: var(--hover-background); border-radius: 999px; padding: 4px 10px; font-size: 12.5px; color: var(--text-primary); }
+.ms-ppl-alias-tag button { border: none; background: transparent; cursor: pointer; color: var(--text-secondary); font-size: 14px; line-height: 1; padding: 0; display: flex; align-items: center; }
+.ms-ppl-alias-add-btn { border: 1.5px dashed var(--border-color); background: transparent; border-radius: 999px; padding: 4px 10px; font-size: 12px; color: var(--text-secondary); cursor: pointer; outline: none; }
+.ms-ppl-alias-add-btn:hover { border-color: var(--text-primary); color: var(--text-primary); }
 .ms-ppl-alias-inline-wrap { display: flex; align-items: center; }
-.ms-ppl-alias-inline-input { border: 1.5px solid #1a56db; border-radius: 999px; padding: 4px 12px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 12.5px; color: #202124; outline: none; background: #fff; min-width: 140px; transition: border-color .15s; }
-.ms-ppl-alias-inline-input:focus { border-color: #1a56db; }
-.ms-ppl-alias-locale-select { border: 1.5px solid #1a56db; border-radius: 999px; padding: 4px 10px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 12px; color: #202124; background: #fff; outline: none; cursor: pointer; height: 30px; }
+.ms-ppl-alias-inline-input { border: 1.5px solid var(--primary-color); border-radius: 999px; padding: 4px 12px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 12.5px; color: var(--text-primary); outline: none; background: var(--card-background); min-width: 140px; transition: border-color .15s; }
+.ms-ppl-alias-inline-input:focus { border-color: var(--primary-color); }
+.ms-ppl-alias-locale-select { border: 1.5px solid var(--primary-color); border-radius: 999px; padding: 4px 10px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 12px; color: var(--text-primary); background: var(--card-background); outline: none; cursor: pointer; height: 30px; }
 .ms-ppl-edit-fields { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
 .ms-ppl-edit-field-row { display: flex; align-items: center; gap: 12px; }
 .ms-ppl-edit-field-row--top { align-items: flex-start; }
-.ms-ppl-edit-label { font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 12px; font-weight: 700; color: #202124; letter-spacing: .03em; min-width: 30px; text-align: right; flex-shrink: 0; padding-top: 2px; }
-.ms-ppl-edit-input { border: 1.5px solid #e8eaed; border-radius: 12px; padding: 9px 14px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13.5px; color: #202124; outline: none; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.06); transition: border-color .15s, box-shadow .15s; min-width: 0; box-sizing: border-box; width: 100%; }
-.ms-ppl-edit-input:focus { border-color: #1a56db; box-shadow: 0 0 0 3px rgba(26,86,219,.1); }
+.ms-ppl-edit-label { font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 12px; font-weight: 700; color: var(--text-primary); letter-spacing: .03em; min-width: 30px; text-align: right; flex-shrink: 0; padding-top: 2px; }
+.ms-ppl-edit-input { border: 1.5px solid var(--border-color); border-radius: 12px; padding: 9px 14px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13.5px; color: var(--text-primary); outline: none; background: var(--card-background); box-shadow: var(--shadow); transition: border-color .15s, box-shadow .15s; min-width: 0; box-sizing: border-box; width: 100%; }
+.ms-ppl-edit-input:focus { border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(var(--primary-color-rgb), 0.1); }
 .ms-ppl-edit-name-input { font-size: 16px !important; font-weight: 700 !important; flex: 1; min-width: 160px; }
-.ms-ppl-edit-textarea { width: 100%; border: 1.5px solid #e8eaed; border-radius: 12px; padding: 9px 14px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13px; color: #202124; outline: none; resize: vertical; min-height: 72px; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.06); transition: border-color .15s, box-shadow .15s; box-sizing: border-box; }
-.ms-ppl-edit-textarea:focus { border-color: #1a56db; box-shadow: 0 0 0 3px rgba(26,86,219,.1); }
+.ms-ppl-edit-textarea { width: 100%; border: 1.5px solid var(--border-color); border-radius: 12px; padding: 9px 14px; font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13px; color: var(--text-primary); outline: none; resize: vertical; min-height: 72px; background: var(--card-background); box-shadow: var(--shadow); transition: border-color .15s, box-shadow .15s; box-sizing: border-box; }
+.ms-ppl-edit-textarea:focus { border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(var(--primary-color-rgb), 0.1); }
 .ms-ppl-edit-actions { display: flex; gap: 8px; padding-left: 42px; }
 .ms-ppl-edit-field-input { flex: 1; min-width: 0; }
-.ms-ppl-view-box { font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13.5px; color: #202124; min-height: 24px; display: flex; align-items: center; word-break: break-word; padding: 2px 0; }
+.ms-ppl-view-box { font-family: 'DM Sans', 'Noto Sans TC', sans-serif; font-size: 13.5px; color: var(--text-primary); min-height: 24px; display: flex; align-items: center; word-break: break-word; padding: 2px 0; }
 .ms-ppl-view-name-box { font-size: 20px; font-weight: 700; flex: 1; min-width: 0; }
-.ms-ppl-view-field-box { flex: 1; min-width: 0; color: #3c4043; }
-.ms-ppl-view-notes-box { flex: 1; min-width: 0; min-height: 24px; align-items: flex-start; color: #9aa0a6; font-size: 13px; white-space: pre-wrap; }
+.ms-ppl-view-field-box { flex: 1; min-width: 0; color: var(--text-primary); }
+.ms-ppl-view-notes-box { flex: 1; min-width: 0; min-height: 24px; align-items: flex-start; color: var(--text-secondary); font-size: 13px; white-space: pre-wrap; }
 .ms-ppl-strip-wrap { display: flex; align-items: center; gap: 10px; margin-bottom: 28px; }
-.ms-ppl-strip-add-btn { width: 52px; height: 52px; border-radius: 12px; border: 1.5px dashed #bdc1c6; background: #fff; font-size: 20px; color: #bdc1c6; display: grid; place-items: center; cursor: pointer; outline: none; flex-shrink: 0; transition: border-color .15s, color .15s; }
-.ms-ppl-strip-add-btn:hover { border-color: #202124; color: #202124; }
-.ms-ppl-face-strip { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; flex: 1; }
+.ms-ppl-strip-add-btn { width: 52px; height: 52px; border-radius: 12px; border: 1.5px dashed var(--border-color); background: var(--card-background); font-size: 20px; color: var(--text-secondary); display: grid; place-items: center; cursor: pointer; outline: none; flex-shrink: 0; transition: border-color .15s, color .15s; }
+.ms-ppl-strip-add-btn:hover { border-color: var(--text-primary); color: var(--text-primary); }
+.ms-ppl-face-strip { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; scrollbar-width: thin; scrollbar-color: #b8bec6 transparent; flex: 1; min-width: 0; }
+.ms-ppl-face-strip::-webkit-scrollbar { height: 8px; }
+.ms-ppl-face-strip::-webkit-scrollbar-track { background: transparent; }
+.ms-ppl-face-strip::-webkit-scrollbar-thumb { background: #b8bec6; border-radius: 999px; }
+.ms-ppl-face-strip::-webkit-scrollbar-thumb:hover { background: #8a919b; }
 .ms-ppl-strip-face { position: relative; flex-shrink: 0; cursor: pointer; }
-.ms-ppl-strip-face-clickable.selected { outline: 2px solid #1a56db; outline-offset: 2px; border-radius: 14px; }
-.ms-ppl-strip-face-img { width: 52px; height: 52px; border-radius: 12px; border: 2px solid transparent; background: #e8eaed; overflow: hidden; transition: border-color .15s; }
-.ms-ppl-strip-face:hover .ms-ppl-strip-face-img { border-color: #202124; }
-.ms-ppl-face-card-detail { display: flex; gap: 16px; align-items: flex-start; background: #fff; border: 1px solid #e0e0e0; border-radius: 16px; padding: 16px; margin: 12px 0; position: relative; box-shadow: 0 4px 16px rgba(0,0,0,.08); }
-.ms-ppl-face-card-close { position: absolute; top: 8px; right: 10px; background: none; border: none; font-size: 20px; cursor: pointer; color: #9aa0a6; line-height: 1; padding: 2px 6px; border-radius: 6px; }
-.ms-ppl-face-card-close:hover { background: #f3f4f6; color: #202124; }
-.ms-ppl-face-card-img-wrap { width: 120px; height: 120px; border-radius: 12px; overflow: hidden; flex-shrink: 0; background: #e8eaed; }
-.ms-ppl-face-card-info { flex: 1; min-width: 0; }
-.ms-ppl-face-card-file { font-size: 13px; color: #5f6368; font-family: monospace; }
-.ms-ppl-face-card-frame { font-size: 13px; color: #3c4043; margin-top: 2px; }
-.ms-ppl-face-card-time { font-size: 13px; color: #3c4043; margin-top: 4px; }
-.ms-ppl-face-card-dur { color: #9aa0a6; margin-left: 4px; }
-.ms-ppl-face-card-fps { font-size: 12px; color: #5f6368; margin-top: 2px; }
-.ms-ppl-face-card-conf { font-size: 12px; color: #9aa0a6; margin-top: 2px; }
+.ms-ppl-strip-face-clickable.selected { outline: 2px solid var(--primary-color); outline-offset: 2px; border-radius: 14px; }
+.ms-ppl-strip-face-img { width: 52px; height: 52px; border-radius: 12px; border: 2px solid transparent; background: var(--border-light); overflow: hidden; transition: border-color .15s; }
+.ms-ppl-strip-face:hover .ms-ppl-strip-face-img { border-color: var(--text-primary); }
+.ms-ppl-face-card-detail { display: flex; gap: 16px; align-items: flex-start; background: var(--card-background); border: 1px solid var(--border-color); border-radius: 16px; padding: 16px; margin: 12px 0; position: relative; box-shadow: var(--shadow); }
+.ms-ppl-face-card-close { position: absolute; top: 8px; right: 10px; background: none; border: none; font-size: 20px; cursor: pointer; color: var(--text-secondary); line-height: 1; padding: 2px 6px; border-radius: 6px; z-index: 10; }
+.ms-ppl-face-card-close:hover { background: var(--hover-background); color: var(--text-primary); }
+.ms-ppl-face-card-img-wrap { width: 120px; height: 120px; border-radius: 12px; overflow: hidden; flex-shrink: 0; background: var(--border-light); }
+.ms-ppl-face-card-info { flex: 1; min-width: 0; padding-top: 4px; }
+.ms-ppl-face-card-file { font-size: 13px; color: var(--text-secondary); font-family: monospace; }
+.ms-ppl-face-card-frame { font-size: 13px; color: var(--text-primary); margin-top: 2px; }
+.ms-ppl-face-card-frame-range { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }
+.ms-ppl-face-card-time { font-size: 13px; color: var(--text-primary); margin-top: 4px; }
+.ms-ppl-face-card-dur { color: var(--text-secondary); margin-left: 4px; }
+.ms-ppl-face-card-fps { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }
+.ms-ppl-face-card-conf { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }
 .ms-ppl-face-card-actions { display: flex; gap: 8px; margin-top: 10px; }
-.ms-ppl-strip-arrow { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid #d1d5db; background: #fff; font-size: 18px; display: grid; place-items: center; cursor: pointer; color: #5f6368; outline: none; flex-shrink: 0; transition: background .15s; }
-.ms-ppl-strip-arrow:hover:not(:disabled) { background: #f3f4f6; color: #202124; }
+.ms-enlarged-face-modal { display: flex; align-items: center; justify-content: center; background: var(--card-background); border-radius: 16px; padding: 20px; position: relative; max-width: 95vw; max-height: 95vh; }
+.ms-enlarged-face-modal .ms-modal-video-close { position: absolute; top: 8px; right: 12px; background: none; border: none; font-size: 24px; cursor: pointer; color: var(--text-secondary); line-height: 1; }
+.ms-ppl-strip-arrow { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--border-color); background: var(--card-background); font-size: 18px; display: grid; place-items: center; cursor: pointer; color: var(--text-secondary); outline: none; flex-shrink: 0; transition: background .15s; }
+.ms-ppl-strip-arrow:hover:not(:disabled) { background: var(--hover-background); color: var(--text-primary); }
 .ms-ppl-strip-arrow:disabled { opacity: 0.35; cursor: default; }
-.ms-ppl-strip-page { font-size: 11px; color: #9aa0a6; min-width: 32px; text-align: center; flex-shrink: 0; }
-.ms-ppl-media-label { font-size: 13px; color: #5f6368; margin-bottom: 16px; }
-.ms-ppl-media-item { cursor: pointer; border-radius: 12px; overflow: visible; background: #f0f0f0; transition: transform .15s, box-shadow .15s; border: 1px solid #eee; }
-.ms-ppl-media-item:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.1); }
-.ms-ppl-media-thumb { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: #e8eaed; border-radius: 12px 12px 0 0; }
+.ms-ppl-strip-page { font-size: 11px; color: var(--text-secondary); min-width: 32px; text-align: center; flex-shrink: 0; }
+.ms-ppl-media-label { font-size: 13px; color: var(--text-secondary); margin-bottom: 16px; }
+.ms-ppl-media-item { cursor: pointer; border-radius: 12px; overflow: visible; background: var(--hover-background); transition: transform .15s, box-shadow .15s; border: 1px solid var(--border-color); }
+.ms-ppl-media-item:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
+.ms-ppl-media-thumb { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: var(--border-light); border-radius: 12px 12px 0 0; }
 .ms-ppl-thumb-play-circle { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.18); border-radius: 12px 12px 0 0; }
 .ms-ppl-thumb-play-circle svg { width: 38px; height: 38px; opacity: .7; transition: opacity .15s, transform .15s; }
 .ms-ppl-media-item:hover .ms-ppl-thumb-play-circle svg { opacity: 1; transform: scale(1.08); }
 .ms-ppl-media-dur { position: absolute; bottom: 5px; right: 7px; background: rgba(0,0,0,.5); color: #fff; font-size: 10px; padding: 1px 5px; border-radius: 3px; }
-.ms-ppl-media-info { padding: 8px 10px 10px; background: #fff; }
-.ms-ppl-media-title { font-size: 12px; font-weight: 600; color: #202124; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 2px; }
-.ms-ppl-media-sub { font-size: 10.5px; color: #9aa0a6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.ms-ppl-media-info { padding: 8px 10px 10px; background: var(--card-background); }
+.ms-ppl-media-title { font-size: 12px; font-weight: 600; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 2px; }
+.ms-ppl-media-sub { font-size: 10.5px; color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .ms-ppl-delete-zone { margin-top: 48px; padding-bottom: 32px; }
-.ms-ppl-delete-hr { border: none; border-top: 1.5px solid #f3f4f6; margin: 0 0 20px; }
-.ms-ppl-delete-zone-btn { color: #d93025; border-color: #fecaca; background: #fff; }
-.ms-ppl-delete-zone-btn:hover { background: #fef2f2; border-color: #d93025; }
-.face-placeholder { font-size: 0.6rem; color: #5f6368; }
+.ms-ppl-delete-hr { border: none; border-top: 1.5px solid var(--border-light); margin: 0 0 20px; }
+.ms-ppl-delete-zone-btn { color: var(--danger-color); border-color: var(--danger-color); background: var(--card-background); }
+.ms-ppl-delete-zone-btn:hover { background: var(--danger-background); border-color: var(--danger-color); }
+.face-placeholder { font-size: 0.6rem; color: var(--text-secondary); }
 .ms-ppl-actions-section { display: flex; flex-direction: column; gap: 8px; }
-.ms-ppl-actions-status { display: flex; align-items: center; gap: 10px; padding: 12px; background: #f8f9fa; border-radius: 10px; font-size: 13px; }
-.ms-ppl-actions-label { color: #5f6368; font-weight: 500; }
-.ms-ppl-actions-value { color: #202124; font-weight: 600; text-transform: capitalize; }
+.ms-ppl-actions-status { display: flex; align-items: center; gap: 10px; padding: 12px; background: var(--hover-background); border-radius: 10px; font-size: 13px; }
+.ms-ppl-actions-label { color: var(--text-secondary); font-weight: 500; }
+.ms-ppl-actions-value { color: var(--text-primary); font-weight: 600; text-transform: capitalize; }
 .ms-ppl-media-badge-conf { position: absolute; top: 5px; left: 7px; background: rgba(0,0,0,.5); color: #fff; font-size: 10px; padding: 1px 5px; border-radius: 3px; }
 .segment-card { max-width: 320px; margin-bottom: 20px; }
 
@@ -853,4 +929,12 @@ let mergeSearchTimer: any
 /* Remove button for face strip */
 .ms-ppl-strip-remove-btn { display: none; position: absolute; top: -6px; right: -6px; width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 1.5px solid #d1d5db; font-size: 11px; color: #5f6368; line-height: 1; cursor: pointer; outline: none; place-items: center; }
 .ms-ppl-edit-mode .ms-ppl-strip-remove-btn { display: grid; }
+
+@media (max-width: 767px) {
+  .people-view { padding-top: 8px; }
+  .ms-ppl-strip-wrap { gap: 6px; margin-bottom: 16px; }
+  .ms-ppl-strip-face-img { width: 40px; height: 40px; }
+  .ms-ppl-detail-name { font-size: 16px; }
+  .ms-ppl-detail-info { flex-direction: column; align-items: flex-start; }
+}
 </style>

src/vite-env.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="vite/client" />
+
+declare const __BUILD_VERSION__: string
+
+interface ImportMetaEnv {
+  readonly VITE_APP_TITLE: string
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}

vite.config.ts

@@ -1,19 +1,39 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import { resolve } from 'path'
+import { execSync } from 'child_process'
+
+const gitHash = execSync('git log --format="%h" -1', { encoding: 'utf-8' }).trim()
+const buildTime = new Date().toISOString().slice(0, 19).replace(/[-:T]/g, '')
+const buildVersion = `${buildTime}-${gitHash}`
 
 export default defineConfig({
   plugins: [vue()],
+  define: {
+    __BUILD_VERSION__: JSON.stringify(buildVersion)
+  },
   resolve: {
     alias: {
       '@': resolve(__dirname, 'src')
     }
   },
   server: {
+    host: '0.0.0.0',
     port: 5173,
+    strictPort: true,
+    allowedHosts: [
+      'studio.momentry.ddns.net',
+      'localhost',
+      '127.0.0.1',
+      '.ddns.net'
+    ],
     proxy: {
-      '/api': {
+      '/api/v1': {
         target: 'http://localhost:8888',
+        changeOrigin: true,
+      },
+      '/api/v2': {
+        target: 'http://localhost:11438',
         changeOrigin: true
       }
     }

vlm_search.py

@@ -0,0 +1,247 @@
+#!/usr/bin/env python3
+"""
+VLM-based semantic search for video keyframes.
+Architecture:
+  1. Extract keyframes from video at configurable interval
+  2. Send each keyframe to VLM (Ollama LLaVA) for description
+  3. Store frame descriptions in SQLite with embedding
+  4. Search via text similarity using embedding model
+
+Usage:
+  python3 vlm_search.py index <file_uuid>    # Index a video
+  python3 vlm_search.py search <query>        # Search indexed frames
+  python3 vlm_search.py status                # Show index status
+  python3 vlm_search.py benchmark <file_uuid> # Benchmark VLM speed
+"""
+import sys, os, json, time, sqlite3, argparse, base64, io, struct
+from pathlib import Path
+
+import urllib.request
+import urllib.parse
+
+# ─── Configuration ───
+CORE_API = "http://localhost:3002"
+PROXY = "http://localhost:8888"
+API_KEY = "muser_68600856036340bcafc01930eb4bd839_1774418104_97221b69"
+DB_PATH = Path(__file__).parent / "data" / "vlm_index.sqlite"
+FRAME_INTERVAL = 120  # every N frames (default ~5s at 24fps)
+VLM_MODEL = "llava"
+EMBED_MODEL = "mxbai-embed-large"
+
+def api_get(path):
+    url = f"{CORE_API}{path}?api_key={API_KEY}"
+    with urllib.request.urlopen(url) as r:
+        return json.loads(r.read())
+
+def api_post(path, body):
+    url = f"{CORE_API}{path}?api_key={API_KEY}"
+    data = json.dumps(body).encode()
+    req = urllib.request.Request(url, data=data, headers={"Content-Type": "application/json"})
+    with urllib.request.urlopen(req) as r:
+        return json.loads(r.read())
+
+def get_thumbnail_proxy(file_uuid, frame):
+    url = f"{PROXY}/api/v1/file/{file_uuid}/thumbnail?frame={frame}"
+    with urllib.request.urlopen(url) as r:
+        return r.read()
+
+# ─── SQLite Index ───
+def init_db():
+    DB_PATH.parent.mkdir(parents=True, exist_ok=True)
+    conn = sqlite3.connect(str(DB_PATH))
+    conn.execute("PRAGMA journal_mode=WAL")
+    conn.execute("""
+        CREATE TABLE IF NOT EXISTS frames (
+            id INTEGER PRIMARY KEY AUTOINCREMENT,
+            file_uuid TEXT NOT NULL,
+            frame INTEGER NOT NULL,
+            time_sec REAL,
+            description TEXT,
+            embedding BLOB,
+            created_at REAL DEFAULT (julianday('now'))
+        )""")
+    conn.execute("CREATE INDEX IF NOT EXISTS idx_frames_desc ON frames(description)")
+    conn.execute("CREATE INDEX IF NOT EXISTS idx_frames_file ON frames(file_uuid)")
+    conn.commit()
+    return conn
+
+def get_embedding(text):
+    """Use Ollama embedding model to get vector."""
+    payload = json.dumps({"model": EMBED_MODEL, "prompt": text}).encode()
+    req = urllib.request.Request(
+        "http://localhost:11434/api/embeddings",
+        data=payload,
+        headers={"Content-Type": "application/json"}
+    )
+    try:
+        with urllib.request.urlopen(req, timeout=30) as r:
+            data = json.loads(r.read())
+            return data.get("embedding")
+    except Exception as e:
+        print(f"  Embedding error: {e}")
+        return None
+
+def cosine_similarity(a, b):
+    dot = sum(x*y for x,y in zip(a,b))
+    na = sum(x*x for x in a)**0.5
+    nb = sum(x*x for x in b)**0.5
+    return dot / (na * nb) if na and nb else 0
+
+# ─── VLM Inference ───
+def vlm_describe(image_bytes, prompt="Describe this image in 1-2 sentences. Focus on what is happening, people, objects, and scene."):
+    b64 = base64.b64encode(image_bytes).decode()
+    payload = json.dumps({
+        "model": VLM_MODEL,
+        "prompt": prompt,
+        "images": [b64],
+        "stream": False,
+        "options": {"num_predict": 128}
+    }).encode()
+    req = urllib.request.Request(
+        "http://localhost:11434/api/generate",
+        data=payload,
+        headers={"Content-Type": "application/json"}
+    )
+    with urllib.request.urlopen(req, timeout=120) as r:
+        data = json.loads(r.read())
+    return data.get("response", "").strip()
+
+# ─── Commands ───
+def cmd_index(file_uuid, interval=FRAME_INTERVAL, limit=None):
+    conn = init_db()
+    info = api_get(f"/api/v1/file/{file_uuid}")
+    if not info.get("file_uuid"):
+        print(f"File not found: {file_uuid}")
+        return
+    file_name = info.get("file_name", "?")
+    fps = info.get("fps", 24)
+    duration = info.get("duration", 0)
+    total = 0
+    frame = 0
+    times = []
+    print(f"Indexing: {file_name} ({duration:.1f}s @ {fps:.2f}fps)")
+    while True:
+        if limit and total >= limit:
+            break
+        try:
+            img = get_thumbnail_proxy(file_uuid, frame)
+        except Exception as e:
+            if "404" in str(e):
+                break  # no more frames
+            print(f"  Error frame {frame}: {e}")
+            frame += interval
+            continue
+        t0 = time.time()
+        try:
+            desc = vlm_describe(img, "Describe this image briefly. What are people doing? What are they wearing? What objects/scene?")
+        except Exception as e:
+            print(f"  VLM error frame {frame}: {e}")
+            frame += interval
+            continue
+        elapsed = time.time() - t0
+        times.append(elapsed)
+        # Get embedding
+        emb = get_embedding(desc)
+        emb_blob = struct.pack(f"{len(emb)}d", *emb) if emb else None
+        conn.execute(
+            "INSERT INTO frames (file_uuid, frame, time_sec, description, embedding) VALUES (?,?,?,?,?)",
+            (file_uuid, frame, frame/fps, desc, emb_blob)
+        )
+        conn.commit()
+        total += 1
+        print(f"  F{frame} ({frame/fps:.1f}s) [{elapsed:.1f}s] {desc[:80]}")
+        frame += interval
+    avg = sum(times)/len(times) if times else 0
+    print(f"\nDone: {total} frames indexed, avg {avg:.2f}s per VLM call")
+
+def cmd_status():
+    conn = init_db()
+    rows = conn.execute("""
+        SELECT file_uuid, COUNT(*), MIN(frame), MAX(frame), MIN(created_at)
+        FROM frames GROUP BY file_uuid
+    """).fetchall()
+    total = conn.execute("SELECT COUNT(*) FROM frames").fetchone()[0]
+    print(f"Total indexed frames: {total}")
+    for r in rows:
+        print(f"  {r[0][:12]}: {r[1]} frames (F{r[2]}–F{r[3]})")
+
+def cmd_search(query, top_k=10):
+    conn = init_db()
+    # Get query embedding
+    q_emb = get_embedding(query)
+    if not q_emb:
+        # Fallback to keyword search
+        print("Embedding failed, using keyword search fallback")
+        rows = conn.execute(
+            "SELECT file_uuid, frame, time_sec, description FROM frames WHERE description LIKE ? LIMIT ?",
+            (f"%{query}%", top_k)
+        ).fetchall()
+        if not rows:
+            print("No results")
+            return
+        for r in rows:
+            print(f"  [{r[0][:12]}] F{r[1]} ({r[2]:.1f}s): {r[3][:100]}")
+        return
+    # Cosine similarity search
+    rows = conn.execute("SELECT id, file_uuid, frame, time_sec, description, embedding FROM frames").fetchall()
+    scored = []
+    for r in rows:
+        emb_blob = r[5]
+        if not emb_blob or len(emb_blob) < 8:
+            continue
+        emb = struct.unpack(f"{len(emb_blob)//8}d", emb_blob)
+        sim = cosine_similarity(q_emb, emb)
+        scored.append((sim, r[1], r[2], r[3], r[4]))
+    scored.sort(key=lambda x: -x[0])
+    print(f"Top {min(top_k, len(scored))} results for '{query}':")
+    for sim, fu, fr, ts, desc in scored[:top_k]:
+        print(f"  [{sim:.3f}] [{fu[:12]}] F{fr} ({ts:.1f}s): {desc[:100]}")
+
+def cmd_benchmark(file_uuid, count=5):
+    """Benchmark VLM speed by processing N frames."""
+    times = []
+    for i in range(count):
+        frame = i * 120
+        try:
+            img = get_thumbnail_proxy(file_uuid, frame)
+        except:
+            print(f"  Frame {frame}: not available")
+            continue
+        t0 = time.time()
+        desc = vlm_describe(img)
+        elapsed = time.time() - t0
+        times.append(elapsed)
+        print(f"  F{frame}: {elapsed:.2f}s — {desc[:60]}")
+    if times:
+        print(f"\nAvg: {sum(times)/len(times):.2f}s, Min: {min(times):.2f}s, Max: {max(times):.2f}s, Total: {sum(times):.1f}s")
+
+# ─── Main ───
+if __name__ == "__main__":
+    parser = argparse.ArgumentParser(description="VLM Semantic Search for Video Keyframes")
+    sub = parser.add_subparsers(dest="cmd")
+    p_idx = sub.add_parser("index", help="Index a video's keyframes")
+    p_idx.add_argument("file_uuid")
+    p_idx.add_argument("--interval", type=int, default=FRAME_INTERVAL)
+    p_idx.add_argument("--limit", type=int)
+
+    p_search = sub.add_parser("search", help="Search indexed frames")
+    p_search.add_argument("query")
+    p_search.add_argument("--top-k", type=int, default=10)
+
+    sub.add_parser("status", help="Show index status")
+
+    p_bench = sub.add_parser("benchmark", help="Benchmark VLM speed")
+    p_bench.add_argument("file_uuid")
+    p_bench.add_argument("--count", type=int, default=5)
+
+    args = parser.parse_args()
+    if args.cmd == "index":
+        cmd_index(args.file_uuid, args.interval, args.limit)
+    elif args.cmd == "search":
+        cmd_search(args.query, args.top_k)
+    elif args.cmd == "status":
+        cmd_status()
+    elif args.cmd == "benchmark":
+        cmd_benchmark(args.file_uuid, args.count)
+    else:
+        parser.print_help()