auto-save 2026-05-14 00:02 (+3, ~4)

web/components/nodes/index.tsx

@@ -103,7 +103,7 @@ export function InputNode({ data, selected }: NodeProps<{ data: NodeData }> | an
   const inputLocked = isDownloading || d.submitting
 
   return (
-    <div className="relative" style={{ width: 320 }}>
+    <div className="relative" style={{ width: "100%" }}>
       {/* 多视频缩略图浮条 — 「+」在最左，job 按时间倒序（最新靠左高亮），统一高度 64，宽度按视频原比例，一行横滚 */}
       {!videoExpanded && d.jobs.length > 0 && (
         <div
@@ -371,7 +371,7 @@ export function KeyframeNode({ data, selected }: any) {
   const aspectStr = d.job && d.job.height > 0 ? `${d.job.width}/${d.job.height}` : "9/16"
 
   return (
-    <div className="relative" style={{ width: KEYFRAME_WIDTH }}>
+    <div className="relative" style={{ width: "100%" }}>
       {/* 缩略图浮条（节点上方，最多 5 个一行，多行向上扩展） */}
       {frames.length > 0 && jobId && (
         <div
@@ -840,7 +840,7 @@ export function StoryboardNode({ data, selected }: any) {
   const aspect = job && job.height > 0 ? `${job.width}/${job.height}` : "9/16"
 
   return (
-    <div className="relative" style={{ width: IMAGEGEN_WIDTH }}>
+    <div className="relative" style={{ width: "100%" }}>
       {/* 节点上方：所有元素 crop 图（编排输入素材）· 跟 keyframe 节点样式一致 */}
       {elementCrops.length > 0 && job && (
         <div
@@ -976,7 +976,7 @@ export function VideoGenNode({ data, selected }: any) {
     return e
   }
   return (
-    <div className="relative" style={{ width: 280 }}>
+    <div className="relative" style={{ width: "100%" }}>
       {videos.length > 0 && (
         <div
           className="absolute left-0 right-0 grid grid-cols-3 gap-1.5"

web/components/nodes/node-shell.tsx

@@ -2,6 +2,7 @@
 import { type ReactNode } from "react"
 import { Handle, Position } from "@xyflow/react"
 import { CheckCircle2, Loader2, AlertCircle } from "lucide-react"
+import { ResizeRight } from "./resize-handle"
 
 export type NodeKind = "input" | "process" | "ai" | "output"
 export type NodeStatus = "pending" | "running" | "done" | "failed"
@@ -74,6 +75,7 @@ export function NodeShell({
       </div>
 
       {hasSource && <Handle type="source" position={Position.Right} />}
+      <ResizeRight />
     </div>
   )
 }

web/components/nodes/resize-handle.tsx

@@ -0,0 +1,27 @@
+"use client"
+import { NodeResizeControl } from "@xyflow/react"
+
+/** 节点右边缘 resize 把手：高度跟随节点，宽度可拖（240–1200px）。平时透明，hover 显紫色细条。 */
+export function ResizeRight({ minWidth = 240, maxWidth = 1200 }: { minWidth?: number; maxWidth?: number }) {
+  return (
+    <NodeResizeControl
+      position="right"
+      minWidth={minWidth}
+      maxWidth={maxWidth}
+      style={{
+        background: "transparent",
+        border: "none",
+        width: 8,
+        height: "100%",
+        right: 0,
+        top: 0,
+        transform: "translateX(50%)",
+      }}
+    >
+      <div
+        className="w-full h-full hover:bg-violet-400/50 active:bg-violet-400/80 transition rounded-r"
+        style={{ cursor: "ew-resize" }}
+      />
+    </NodeResizeControl>
+  )
+}