diff --git a/web/src/components/RecordDetailModal.tsx b/web/src/components/RecordDetailModal.tsx
index 2f46613..f68cee9 100644
--- a/web/src/components/RecordDetailModal.tsx
+++ b/web/src/components/RecordDetailModal.tsx
@@ -44,14 +44,22 @@ export function RecordDetailModal({ record: r, onClose, showTeam, showCost }: Pr
             <button style={closeBtn} onClick={onClose}>✕</button>
           </div>
 
-          {/* Body — 左视频 / 右信息 双栏 */}
+          {/* Body — 左:视频+参考素材 / 右:信息+提示词 */}
           <div style={body}>
-            {/* ── 左:视频 ── */}
+            {/* ── 左侧:视频 + 参考素材 ── */}
             <div style={mediaPanel}>
               <MediaArea record={r} />
+              {refs.length > 0 && (
+                <>
+                  <div style={sectionTitle}>参考素材({refs.length})</div>
+                  <div style={refScrollBox}>
+                    <ReferenceList references={refs} />
+                  </div>
+                </>
+              )}
             </div>
 
-            {/* ── 右:信息(原有内容整体搬过来,排版不动)── */}
+            {/* ── 右侧:信息 + 提示词 ── */}
             <div style={infoPanel}>
               {/* Status */}
               <div style={{ marginBottom: 16 }}>
@@ -72,7 +80,7 @@ export function RecordDetailModal({ record: r, onClose, showTeam, showCost }: Pr
               )}
 
               {/* Info Grid */}
-              <div style={sectionTitle}>基本信息</div>
+              <div style={{ ...sectionTitle, marginTop: 0 }}>基本信息</div>
               <div style={infoGrid}>
                 {r.ark_task_id && <InfoItem label="任务ID" value={r.ark_task_id} />}
                 {r.username && <InfoItem label="用户" value={r.username} />}
@@ -92,14 +100,6 @@ export function RecordDetailModal({ record: r, onClose, showTeam, showCost }: Pr
               {/* Prompt */}
               <div style={sectionTitle}>提示词</div>
               <div style={promptBox}>{r.prompt || '(无提示词)'}</div>
-
-              {/* References */}
-              {refs.length > 0 && (
-                <>
-                  <div style={sectionTitle}>参考素材({refs.length})</div>
-                  <ReferenceList references={refs} />
-                </>
-              )}
             </div>
           </div>
         </div>
@@ -217,13 +217,23 @@ const body: React.CSSProperties = {
   minHeight: 0,
 };
 
-/* 左侧媒体区 — 固定 480 宽 */
+/* 左侧媒体区 — 固定 480 宽,视频 + 参考素材纵向排列 */
 const mediaPanel: React.CSSProperties = {
   width: 480,
   flexShrink: 0,
   display: 'flex',
   flexDirection: 'column',
-  alignItems: 'center',
+  alignItems: 'stretch',
+  minHeight: 0,    /* 给内部 flex 让出收缩空间 */
+};
+
+/* 参考素材区:max-height + 内部滚动,避免视频高度被推下去
+   Seedance 最多 9 张 → 80px thumb × 5/行 = 1-2 行,250px 给足兜底 */
+const refScrollBox: React.CSSProperties = {
+  maxHeight: 250,
+  overflowY: 'auto',
+  marginTop: 8,
+  paddingRight: 4,
 };
 
 const mediaFrame: React.CSSProperties = {
diff --git a/web/src/components/ReferenceList.tsx b/web/src/components/ReferenceList.tsx
index 4d7f702..c200aa8 100644
--- a/web/src/components/ReferenceList.tsx
+++ b/web/src/components/ReferenceList.tsx
@@ -40,7 +40,7 @@ export function ReferenceList({ references }: Props) {
           const hasUrl = fullUrl && !fullUrl.startsWith('asset://');
 
           return (
-            <div key={i} style={refItem}>
+            <div key={i} style={refItem} title={label}>
               {/* Thumbnail area */}
               <div style={thumbWrap}>
                 {isAudio ? (