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

@@ -45,7 +45,11 @@ const buildTitleStyle = (settings: TitleSettings): React.CSSProperties => {
     textAlign: "center",
     lineHeight: 1.4,
     wordBreak: "break-word",
+    overflowWrap: "break-word",
     padding: "0 12px",
+    display: "block",
+    width: "100%",
+    boxSizing: "border-box",
   }
   if (settings.stroke) {
     style.WebkitTextStroke = "1px rgba(0,0,0,0.6)"
@@ -138,16 +142,16 @@ export const PreviewVideoPanel: React.FC<PreviewVideoPanelProps> = ({
                 pointerEvents: "none",
               }}
             >
-              <span style={buildTitleStyle(titleSettings!)}>
+              <div style={buildTitleStyle(titleSettings!)}>
                 {titleText && titleText.trim() ? titleText : "请选择或输入标题"}
-              </span>
+              </div>
             </div>
           )}
         </div>
       )}
 
-      {/* 无视频时的标题预览（idle/loading/error 状态下仍然显示标题预览） */}
-      {!hasPreview && showTitlePreview && (
+      {/* 无视频时的标题预览（idle/loading 状态下显示，error 状态下隐藏） */}
+      {!hasPreview && !isError && showTitlePreview && (
         <div
           style={{
             background: "rgba(0,0,0,0.3)",
@@ -159,9 +163,9 @@ export const PreviewVideoPanel: React.FC<PreviewVideoPanelProps> = ({
             justifyContent: "center",
           }}
         >
-          <span style={buildTitleStyle(titleSettings!)}>
+          <div style={buildTitleStyle(titleSettings!)}>
             {titleText && titleText.trim() ? titleText : "请选择或输入标题"}
-          </span>
+          </div>
         </div>
       )}