2026-05-18-19-37-10 调整原始视频与结果同级分栏

frontend/styles.css

@@ -62,10 +62,10 @@ button {
 .top-actions,
 .section-title,
 .field-head,
-.viewer-head,
 .results-toolbar,
 .card-top,
-.dialog-head {
+.dialog-head,
+.pane-head {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -363,7 +363,23 @@ input[type="range"] {
   padding: 16px;
 }
 
-.viewer-head {
+.viewer-split {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+  gap: 14px;
+  align-items: start;
+}
+
+.workspace-pane {
+  min-height: 690px;
+  padding: 14px;
+  border: 1px solid var(--line);
+  border-radius: 8px;
+  background: rgba(16, 20, 17, 0.58);
+}
+
+.pane-head {
+  min-height: 48px;
   margin-bottom: 14px;
 }
 
@@ -392,7 +408,7 @@ input[type="range"] {
 .preview-stage {
   display: grid;
   place-items: center;
-  min-height: 320px;
+  min-height: 590px;
   border: 1px solid var(--line);
   border-radius: 8px;
   background:
@@ -414,7 +430,7 @@ input[type="range"] {
 #imagePreview {
   display: block;
   width: 100%;
-  max-height: 520px;
+  max-height: 590px;
   object-fit: contain;
   background: #050605;
 }
@@ -459,7 +475,7 @@ input[type="range"] {
 
 .summary-strip {
   display: grid;
-  grid-template-columns: repeat(4, 1fr);
+  grid-template-columns: repeat(2, 1fr);
   gap: 1px;
   margin-top: 14px;
   overflow: hidden;
@@ -486,12 +502,8 @@ input[type="range"] {
   font-size: 18px;
 }
 
-.results-toolbar {
-  margin: 18px 0 12px;
-}
-
 .empty {
-  min-height: 180px;
+  min-height: 590px;
   display: grid;
   place-items: center;
   border: 1px solid var(--line);
@@ -501,8 +513,10 @@ input[type="range"] {
 
 .result-grid {
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
   gap: 12px;
+  max-height: 590px;
+  overflow: auto;
 }
 
 .result-card {
@@ -668,4 +682,17 @@ dd {
   .detail-images {
     grid-template-columns: 1fr;
   }
+
+  .viewer-split {
+    grid-template-columns: 1fr;
+  }
+
+  .workspace-pane {
+    min-height: auto;
+  }
+
+  .preview-stage,
+  .empty {
+    min-height: 320px;
+  }
 }