fix: 修复预览播放器三个问题 - 素材静音+自动连播+标题显示 (#1431)

1. video 标签添加 muted 属性，静音素材原声只播放配音
2. 片段切换后自动调用 play() 实现连续播放
3. 移除 .xx-preview-video 的 display:grid 并添加 isolation:isolate 修复标题遮挡

apps/web/src/pages/generate/components/FrontendPreviewPlayer.tsx

@@ -256,6 +256,7 @@ const FrontendPreviewPlayer: React.FC<FrontendPreviewPlayerProps> = ({
       {/* ✅ 不再创建 .xx-preview-video 容器，直接渲染 video + 覆盖层 */}
       {/* video 元素 — 由父组件 .xx-preview-video 容器提供定位和尺寸 */}
       <video
+        muted
         ref={videoRef}
         preload="auto"
         style={{

apps/web/src/pages/generate/generate.css

@@ -895,13 +895,12 @@
   max-height: 400px;
   border-radius: var(--radius-md);
   background: linear-gradient(135deg, var(--color-gray-900), var(--color-primary-900));
-  display: grid;
-  place-items: center;
   color: var(--text-inverse);
   font-size: 36px;
   position: relative;
   overflow: hidden;
   margin-bottom: 16px;
+  isolation: isolate;
 }
 
 .xx-preview-video::before {

apps/web/src/pages/generate/hooks/useSegmentScheduler.ts

@@ -254,7 +254,14 @@ export function useSegmentScheduler(segments: PlaybackSegment[]): SegmentSchedul
     if (video.currentTime >= seg.endTime - 0.15) {
       const nextIndex = currentSegmentIndex + 1
       if (nextIndex < segments.length) {
-        switchToSegment(nextIndex)
+        switchToSegment(nextIndex).then(() => {
+          const v = videoRef.current
+          if (v) {
+            v.play().catch((e) =>
+              console.warn("[useSegmentScheduler] auto-play next segment failed:", e),
+            )
+          }
+        })
         const accumulatedTime =
           (timelineStarts[currentSegmentIndex] || 0) + (seg.endTime - seg.startTime)
         setCurrentTime(accumulatedTime)