fix: nest material intake inside workbench rail

web/app/globals.css

@@ -573,6 +573,11 @@ nextjs-portal {
 }
 
 .skg-board-rail {
+  width: 397px;
+  min-height: 514px;
+}
+
+.skg-board-rail__strip {
   width: 65px;
   min-height: 514px;
   border: 1px solid #383838;

web/components/ad-recreation-board.tsx

@@ -2478,20 +2478,17 @@ export function AdRecreationBoard({
       <div className="skg-board-ambient pointer-events-none fixed inset-0" />
       <div className="relative z-10 mx-auto min-h-screen w-full min-w-[1280px] max-w-[1920px] px-4 py-4 xl:px-5">
         <div className="skg-board-shell flex gap-4 p-4">
-          <div className="flex shrink-0 gap-3 self-stretch">
-            <WorkbenchRail
-              job={job}
-              jobsCount={jobs.length}
-              audioReady={audioReady}
-              visualReady={visualReady}
-              subjectAssetCount={subjectAssetCount}
-              generatedVideoCount={generatedVideos.length}
-              onOpenLibrary={() => setLibraryOpen(true)}
-              onToggleTheme={toggleBoardTheme}
-              boardTheme={boardTheme}
-            />
-
-            <div className="w-[320px] shrink-0">
+          <WorkbenchRail
+            job={job}
+            jobsCount={jobs.length}
+            audioReady={audioReady}
+            visualReady={visualReady}
+            subjectAssetCount={subjectAssetCount}
+            generatedVideoCount={generatedVideos.length}
+            onOpenLibrary={() => setLibraryOpen(true)}
+            onToggleTheme={toggleBoardTheme}
+            boardTheme={boardTheme}
+            materialPanel={
               <MaterialColumn
                 data={data}
                 step={workflow.input}
@@ -2504,8 +2501,8 @@ export function AdRecreationBoard({
                 onSubmitUrl={submitUrl}
                 onStartProduction={startProduction}
               />
-            </div>
-          </div>
+            }
+          />
 
           <div className="flex min-w-0 flex-1 flex-col gap-3">
             <header className="skg-board-topbar flex items-center justify-between gap-4 rounded-[20px] border border-white/10 bg-white/[0.04] px-4 py-3">
@@ -2597,6 +2594,7 @@ function WorkbenchRail({
   onOpenLibrary,
   onToggleTheme,
   boardTheme,
+  materialPanel,
 }: {
   job: Job | null
   jobsCount: number
@@ -2607,6 +2605,7 @@ function WorkbenchRail({
   onOpenLibrary: () => void
   onToggleTheme: () => void
   boardTheme: BoardThemeMode
+  materialPanel: ReactNode
 }) {
   const railItems = [
     { key: "jobs", label: "素材任务", icon: <Link2 className="h-[18px] w-[18px]" />, active: jobsCount > 0 },
@@ -2617,42 +2616,48 @@ function WorkbenchRail({
     { key: "video", label: "视频候选", icon: <Film className="h-[18px] w-[18px]" />, active: generatedVideoCount > 0 },
   ]
   return (
-    <aside className="skg-board-rail sticky top-4 flex shrink-0 flex-col items-center py-5" aria-label="工作台导航">
-      <div className="skg-board-rail__logo mb-8 flex h-9 w-9 items-center justify-center rounded-full text-[12px] font-semibold" title="SKG Marketing Studio">
-        S
-      </div>
-      <nav className="flex flex-1 flex-col items-center gap-4">
-        {railItems.map((item) => (
+    <aside className="skg-board-rail sticky top-4 flex shrink-0 items-stretch gap-3" aria-label="工作台导航与素材输入">
+      <div className="skg-board-rail__strip flex shrink-0 flex-col items-center py-5" aria-label="工作台导航">
+        <div className="skg-board-rail__logo mb-8 flex h-9 w-9 items-center justify-center rounded-full text-[12px] font-semibold" title="SKG Marketing Studio">
+          S
+        </div>
+        <nav className="flex flex-1 flex-col items-center gap-4">
+          {railItems.map((item) => (
+            <button
+              key={item.key}
+              type="button"
+              className={`skg-board-rail__button inline-flex h-9 w-9 items-center justify-center rounded-full ${item.active ? "is-active" : ""}`}
+              title={item.label}
+              aria-label={item.label}
+            >
+              {item.icon}
+            </button>
+          ))}
+        </nav>
+        <div className="mt-8 flex flex-col items-center gap-3">
           <button
-            key={item.key}
             type="button"
-            className={`skg-board-rail__button inline-flex h-9 w-9 items-center justify-center rounded-full ${item.active ? "is-active" : ""}`}
-            title={item.label}
-            aria-label={item.label}
+            onClick={onOpenLibrary}
+            className="skg-board-rail__button inline-flex h-9 w-9 items-center justify-center rounded-full"
+            title="资源库"
+            aria-label="打开资源库"
           >
-            {item.icon}
+            <BookOpen className="h-[18px] w-[18px]" />
           </button>
-        ))}
-      </nav>
-      <div className="mt-8 flex flex-col items-center gap-3">
-        <button
-          type="button"
-          onClick={onOpenLibrary}
-          className="skg-board-rail__button inline-flex h-9 w-9 items-center justify-center rounded-full"
-          title="资源库"
-          aria-label="打开资源库"
-        >
-          <BookOpen className="h-[18px] w-[18px]" />
-        </button>
-        <button
-          type="button"
-          onClick={onToggleTheme}
-          className="skg-board-rail__button inline-flex h-9 w-9 items-center justify-center rounded-full"
-          title={boardTheme === "dark" ? "切换到明亮模式" : "切换到暗色模式"}
-          aria-label={boardTheme === "dark" ? "切换到明亮模式" : "切换到暗色模式"}
-        >
-          {boardTheme === "dark" ? <Sun className="h-[18px] w-[18px]" /> : <Moon className="h-[18px] w-[18px]" />}
-        </button>
+          <button
+            type="button"
+            onClick={onToggleTheme}
+            className="skg-board-rail__button inline-flex h-9 w-9 items-center justify-center rounded-full"
+            title={boardTheme === "dark" ? "切换到明亮模式" : "切换到暗色模式"}
+            aria-label={boardTheme === "dark" ? "切换到明亮模式" : "切换到暗色模式"}
+          >
+            {boardTheme === "dark" ? <Sun className="h-[18px] w-[18px]" /> : <Moon className="h-[18px] w-[18px]" />}
+          </button>
+        </div>
+      </div>
+
+      <div className="w-[320px] shrink-0">
+        {materialPanel}
       </div>
     </aside>
   )