diff --git a/.memory/worklog.json b/.memory/worklog.json
index f870514..5e29d00 100644
--- a/.memory/worklog.json
+++ b/.memory/worklog.json
@@ -1815,6 +1815,19 @@
       "message": "auto-save 2026-05-13 15:39 (~2)",
       "hash": "5c3da23",
       "files_changed": 2
+    },
+    {
+      "ts": "2026-05-13T15:44:57+08:00",
+      "type": "commit",
+      "message": "auto-save 2026-05-13 15:44 (~2)",
+      "hash": "7125f04",
+      "files_changed": 2
+    },
+    {
+      "ts": "2026-05-13T07:47:40Z",
+      "type": "session-heartbeat",
+      "message": "Claude 会话活跃 · 最近命令：claude · 2 项未提交变更 · 最近提交：auto-save 2026-05-13 15:44 (~2)",
+      "files_changed": 2
     }
   ]
 }
diff --git a/web/components/storyboard-bar.tsx b/web/components/storyboard-bar.tsx
index 3065d8b..6cc8841 100644
--- a/web/components/storyboard-bar.tsx
+++ b/web/components/storyboard-bar.tsx
@@ -186,6 +186,16 @@ export function StoryboardBar({ job, selectedFrames, focusedFrame, onFocusFrame,
                   >
                     <button
                       onClick={() => onFocusFrame(p.frame_idx)}
+                      onMouseEnter={(ev) => {
+                        if (!url) return
+                        setHover({
+                          src: url,
+                          topLabel: p.label || (p.kind === "keyframe" ? "关键帧" : "元素"),
+                          subLabel: `分镜 #${seq}`,
+                          rect: (ev.currentTarget as HTMLElement).getBoundingClientRect(),
+                        })
+                      }}
+                      onMouseLeave={() => setHover(null)}
                       title={`${p.label || p.kind} · 来自分镜 #${seq} · 点击聚焦该分镜`}
                       className="absolute inset-0 w-full h-full"
                     >
@@ -218,13 +228,12 @@ export function StoryboardBar({ job, selectedFrames, focusedFrame, onFocusFrame,
         </div>
       )}
 
-      {/* Hover 预览 · 浮在缩略图正下方（bar 在顶部，下方是 DAG 画布区） */}
+      {/* Hover 预览 · 浮在缩略图正下方（bar 在顶部 fixed，下方是 DAG 画布区） */}
       {mounted && hover && (() => {
         const vidAspect = job.height > 0 ? job.height / job.width : 16 / 9
         const w = 280
         const h = w * vidAspect
         const gap = 10
-        // 水平居中到缩略图，clamp 视口内
         const centerX = hover.rect.left + hover.rect.width / 2
         const left = Math.max(12, Math.min(window.innerWidth - w - 12, centerX - w / 2))
         const top = hover.rect.bottom + gap
@@ -236,16 +245,16 @@ export function StoryboardBar({ job, selectedFrames, focusedFrame, onFocusFrame,
               animation: "drawer-in 0.18s cubic-bezier(0.32, 0.72, 0, 1)",
             }}
           >
-            <div className="rounded-lg overflow-hidden border-2 border-violet-300/50 bg-black shadow-2xl">
+            <div className="rounded-lg overflow-hidden border-2 border-violet-300/50 bg-white shadow-2xl">
               <img
-                src={effectiveFrameUrl(job.id, hover.frame)}
-                alt={`preview ${hover.frame.index}`}
+                src={hover.src}
+                alt="preview"
                 className="block"
                 style={{ width: w, height: h, objectFit: "cover" }}
               />
-              <div className="px-2 py-1 bg-black/80 text-white text-[10.5px] flex items-center justify-between">
-                <span>分镜 {hover.seq}</span>
-                <span className="text-white/60 font-mono">{hover.frame.timestamp.toFixed(2)}s</span>
+              <div className="px-2 py-1 bg-black/80 text-white text-[10.5px] flex items-center justify-between gap-2">
+                <span className="truncate">{hover.topLabel}</span>
+                <span className="text-white/60 font-mono shrink-0">{hover.subLabel}</span>
               </div>
             </div>
           </div>,