From dacd01e6b98a202054ecb46787bcf875b23aef93 Mon Sep 17 00:00:00 2001
From: gahusb <bgg8988@gmail.com>
Date: Sun, 31 May 2026 18:13:32 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=A1=9C=EB=98=90=20=EB=B0=B1=ED=85=8C?=
 =?UTF-8?q?=EC=8A=A4=ED=8A=B8=20=ED=83=AD=20UI=20=ED=8F=B4=EB=A6=AC?=
 =?UTF-8?q?=EC=8B=9C=20(1=C2=B72=EB=93=B1=20=EC=BB=AC=EB=9F=BC=C2=B7?=
 =?UTF-8?q?=EB=B9=88=20=EC=83=81=ED=83=9C=C2=B7=EC=B0=A8=ED=8A=B8=20?=
 =?UTF-8?q?=EB=B0=95=EC=8A=A4=20CSS)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/pages/lotto/Evolver.css                   |  3 +
 src/pages/lotto/evolver/TrackRecordCard.jsx   | 69 +++++++++++--------
 .../lotto/evolver/WinnerAnalysisCard.jsx      |  2 +-
 3 files changed, 43 insertions(+), 31 deletions(-)

diff --git a/src/pages/lotto/Evolver.css b/src/pages/lotto/Evolver.css
index 77bd977..2fec4ff 100644
--- a/src/pages/lotto/Evolver.css
+++ b/src/pages/lotto/Evolver.css
@@ -58,6 +58,9 @@
 .winner-card .winner-meta strong { color: #f1f5f9; font-weight: 600; }
 .winner-card .winner-chart { background: rgba(0,0,0,0.15); border-radius: 8px; padding: 8px; }
 
+/* Backtest — WinnerAnalysisCard chart wrapper (standalone, not inside .winner-card) */
+.backtest-winner-chart { background: rgba(0,0,0,0.15); border-radius: 8px; padding: 8px; }
+
 /* TrialsGrid */
 .trials-grid .grid {
     display: grid; grid-template-columns: repeat(6, 1fr);
diff --git a/src/pages/lotto/evolver/TrackRecordCard.jsx b/src/pages/lotto/evolver/TrackRecordCard.jsx
index 82db1cc..72600c7 100644
--- a/src/pages/lotto/evolver/TrackRecordCard.jsx
+++ b/src/pages/lotto/evolver/TrackRecordCard.jsx
@@ -7,41 +7,50 @@ export default function TrackRecordCard({ byStrategy }) {
     if (!byStrategy) return null;
 
     const rows = STRATEGY_ORDER.filter((s) => byStrategy[s]);
-    if (rows.length === 0) return null;
 
     return (
         <div className="evolver-card backtest-track-record">
             <h2>누적 성적표</h2>
-            <table className="backtest-table">
-                <thead>
-                    <tr>
-                        <th>전략</th>
-                        <th>누적 장수</th>
-                        <th>회차수</th>
-                        <th>3등</th>
-                        <th>4등</th>
-                        <th>5등</th>
-                    </tr>
-                </thead>
-                <tbody>
-                    {rows.map((s) => {
-                        const a = byStrategy[s];
-                        return (
-                            <tr key={s}>
-                                <td>{STRATEGY_LABEL[s] || s}</td>
-                                <td>{(a.n_tickets || 0).toLocaleString()}</td>
-                                <td>{a.draws || 0}</td>
-                                <td>{a['3rd'] || 0}</td>
-                                <td>{a['4th'] || 0}</td>
-                                <td>{a['5th'] || 0}</td>
+            {rows.length === 0 ? (
+                <p className="backtest-note">아직 백테스트 데이터가 없습니다.</p>
+            ) : (
+                <>
+                    <table className="backtest-table">
+                        <thead>
+                            <tr>
+                                <th>전략</th>
+                                <th>누적 장수</th>
+                                <th>회차수</th>
+                                <th>1등</th>
+                                <th>2등</th>
+                                <th>3등</th>
+                                <th>4등</th>
+                                <th>5등</th>
                             </tr>
-                        );
-                    })}
-                </tbody>
-            </table>
-            <p className="backtest-note">
-                엔진이 무작위를 넘지 못하면 분석에 통계적 우위가 없다는 정직한 증거입니다.
-            </p>
+                        </thead>
+                        <tbody>
+                            {rows.map((s) => {
+                                const a = byStrategy[s];
+                                return (
+                                    <tr key={s}>
+                                        <td>{STRATEGY_LABEL[s] || s}</td>
+                                        <td>{(a.n_tickets || 0).toLocaleString()}</td>
+                                        <td>{a.draws || 0}</td>
+                                        <td>{a['1st'] || 0}</td>
+                                        <td>{a['2nd'] || 0}</td>
+                                        <td>{a['3rd'] || 0}</td>
+                                        <td>{a['4th'] || 0}</td>
+                                        <td>{a['5th'] || 0}</td>
+                                    </tr>
+                                );
+                            })}
+                        </tbody>
+                    </table>
+                    <p className="backtest-note">
+                        엔진이 무작위를 넘지 못하면 분석에 통계적 우위가 없다는 정직한 증거입니다.
+                    </p>
+                </>
+            )}
         </div>
     );
 }
diff --git a/src/pages/lotto/evolver/WinnerAnalysisCard.jsx b/src/pages/lotto/evolver/WinnerAnalysisCard.jsx
index c780f1a..af860b3 100644
--- a/src/pages/lotto/evolver/WinnerAnalysisCard.jsx
+++ b/src/pages/lotto/evolver/WinnerAnalysisCard.jsx
@@ -25,7 +25,7 @@ export default function WinnerAnalysisCard({ analysis }) {
                 이번 당첨조합 분석치
                 <span className="badge">무작위 상위 {pct}</span>
             </h2>
-            <div className="winner-chart">
+            <div className="backtest-winner-chart">
                 <ResponsiveContainer width="100%" height={240}>
                     <RadarChart data={data}>
                         <PolarGrid stroke="rgba(255,255,255,0.12)" />