From a4830e9bd82f50cc25539bf1112226db9461698b Mon Sep 17 00:00:00 2001
From: Macbook <macbook@172-11-12-89.lightspeed.chrlnc.sbcglobal.net>
Date: Tue, 26 May 2026 17:15:09 +0900
Subject: [PATCH] =?UTF-8?q?=EC=9A=94=EC=95=BD=EB=B3=B5=20=EB=AA=A8?=
 =?UTF-8?q?=EB=93=9C=20=EC=A0=84=ED=99=98=EC=8B=9C=20=EC=B9=B4=EB=93=9C?=
 =?UTF-8?q?=EB=B0=95=EC=8A=A4=20=EB=86=92=EC=9D=B4=20=EC=A1=B0=EC=A0=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/virtual/VirtualTargetGrid.tsx  |  2 +-
 .../src/styles/virtualTradingDashboard.css    | 46 +++++++++++++++----
 2 files changed, 39 insertions(+), 9 deletions(-)

diff --git a/frontend/src/components/virtual/VirtualTargetGrid.tsx b/frontend/src/components/virtual/VirtualTargetGrid.tsx
index 30ae9cf..f38defe 100644
--- a/frontend/src/components/virtual/VirtualTargetGrid.tsx
+++ b/frontend/src/components/virtual/VirtualTargetGrid.tsx
@@ -131,7 +131,7 @@ const VirtualTargetGrid: React.FC<Props> = ({
           ticker={tickers?.get(focusTarget.market)}
         />
       ) : (
-        <div className="vtd-grid">
+        <div className={`vtd-grid vtd-grid--${viewMode}`}>
           {targets.map(t => {
             const strat = strategies.find(s => s.id === (t.strategyId ?? session.globalStrategyId));
             return (
diff --git a/frontend/src/styles/virtualTradingDashboard.css b/frontend/src/styles/virtualTradingDashboard.css
index 84ec100..8274b30 100644
--- a/frontend/src/styles/virtualTradingDashboard.css
+++ b/frontend/src/styles/virtualTradingDashboard.css
@@ -900,7 +900,7 @@
   width: 100%;
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr));
-  grid-auto-rows: minmax(520px, auto);
+  grid-auto-rows: auto;
   gap: 14px;
   padding: 4px 4px 12px;
   overflow-y: auto;
@@ -908,6 +908,12 @@
   overscroll-behavior: contain;
   -webkit-overflow-scrolling: touch;
   align-content: start;
+  align-items: start;
+}
+
+/* 상세보기 — 행 높이 통일·카드 stretch */
+.vtd-grid--detail {
+  grid-auto-rows: minmax(520px, auto);
   align-items: stretch;
 }
 
@@ -940,18 +946,32 @@
   display: flex;
   flex-direction: column;
   gap: 10px;
-  height: 100%;
-}
-
-.vtd-card:not(.vtd-card--chart-mode):not(.vtd-card--detail) {
-  min-height: 360px;
+  height: auto;
+  align-self: start;
 }
 
 .vtd-card > .vtd-sig-panel-wrap {
-  flex: 1;
+  flex: 0 0 auto;
   min-height: 0;
 }
 
+/* 요약보기 — 신호 패널만큼 카드 높이 축소 (실시간 지표 비교 테이블 미표시) */
+.vtd-card--summary:not(.vtd-card--chart-mode) > .vtd-sig-panel-wrap--summary {
+  flex: 0 0 auto;
+}
+
+.vtd-card--summary:not(.vtd-card--chart-mode) .vtd-sig-panel--summary {
+  flex: 0 0 auto;
+}
+
+.vtd-card--summary:not(.vtd-card--chart-mode) .vtd-card-foot {
+  margin-top: 0;
+}
+
+.vtd-card--detail .vtd-card-foot {
+  margin-top: auto;
+}
+
 /* 상세 카드 — 그리드 행 높이에 맞춰 동일 높이, 푸터는 카드 하단 고정 */
 .vtd-card.vtd-card--detail {
   height: 100%;
@@ -960,6 +980,11 @@
   min-height: 520px;
 }
 
+.vtd-card.vtd-card--detail > .vtd-sig-panel-wrap {
+  flex: 1;
+  min-height: 0;
+}
+
 .vtd-card.vtd-card--detail > .vtd-sig-panel-wrap--detail {
   flex: 1;
   min-height: 0;
@@ -1410,12 +1435,17 @@
   display: flex;
   flex-direction: column;
   gap: 10px;
+  flex: 0 0 auto;
+  min-height: 0;
+}
+
+.vtd-card--detail .vtd-sig-panel {
   flex: 1;
   min-height: 0;
 }
 
 .vtd-sig-panel--summary {
-  overflow-y: auto;
+  overflow: visible;
 }
 
 .vtd-sig-panel--detail-top {