lotto 추천 및 시뮬레이션 시스템 고도화

src/pages/lotto/Lotto.css

@@ -589,6 +589,151 @@
     background: rgba(247, 116, 125, 0.15);
 }
 
+/* ── 시뮬레이션 추천 (Best Picks) ────────────────────────────────────────── */
+
+.lotto-chip--active {
+    background: rgba(151, 201, 170, 0.2);
+    border-color: rgba(151, 201, 170, 0.5);
+    color: #97c9aa;
+}
+
+.lotto-sim-result {
+    padding: 12px 14px;
+    background: rgba(151, 201, 170, 0.08);
+    border: 1px solid rgba(151, 201, 170, 0.3);
+    border-radius: 14px;
+    font-size: 13px;
+    color: var(--muted);
+    display: grid;
+    gap: 4px;
+}
+
+.lotto-picks {
+    display: grid;
+    gap: 8px;
+}
+
+.lotto-pick {
+    display: grid;
+    grid-template-columns: 28px minmax(0, 1fr) auto;
+    align-items: center;
+    gap: 10px;
+    border: 1px solid var(--line);
+    border-radius: 14px;
+    padding: 10px 12px;
+    background: rgba(255, 255, 255, 0.02);
+}
+
+.lotto-pick__rank {
+    font-size: 11px;
+    color: var(--muted);
+    font-weight: 600;
+    text-align: center;
+}
+
+.lotto-pick__content {
+    display: grid;
+    gap: 6px;
+}
+
+.lotto-pick__score {
+    display: grid;
+    grid-template-columns: 46px minmax(0, 1fr);
+    align-items: center;
+    gap: 8px;
+}
+
+.lotto-pick__score-label {
+    font-size: 11px;
+    color: var(--muted);
+    font-weight: 600;
+}
+
+.lotto-pick__bar {
+    height: 5px;
+    border-radius: 999px;
+    background: rgba(0, 0, 0, 0.25);
+    overflow: hidden;
+    border: 1px solid var(--line);
+}
+
+.lotto-pick__bar span {
+    display: block;
+    height: 100%;
+    background: linear-gradient(
+        90deg,
+        rgba(151, 201, 170, 0.85),
+        rgba(133, 165, 216, 0.85)
+    );
+    border-radius: 999px;
+}
+
+/* ── 통계 분석 (Analysis) ─────────────────────────────────────────────────── */
+
+.lotto-analysis {
+    display: grid;
+    gap: 20px;
+}
+
+.lotto-analysis__row {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+    gap: 20px;
+}
+
+.lotto-analysis__group {
+    display: grid;
+    gap: 10px;
+}
+
+.lotto-analysis__label {
+    margin: 0;
+    font-size: 13px;
+    font-weight: 600;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    flex-wrap: wrap;
+}
+
+.lotto-analysis__label span {
+    font-weight: 400;
+    color: var(--muted);
+    font-size: 11px;
+}
+
+.lotto-analysis__stats {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 20px;
+    padding-top: 14px;
+    border-top: 1px solid var(--line);
+    font-size: 13px;
+    color: var(--muted);
+}
+
+.lotto-analysis__stats strong {
+    color: var(--text);
+    margin-left: 4px;
+}
+
+/* ── 오버듀 번호 ─────────────────────────────────────────────────────────── */
+
+.lotto-overdue {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 3px;
+}
+
+.lotto-overdue__gap {
+    font-size: 10px;
+    color: var(--muted);
+    font-weight: 600;
+}
+
+/* ── 반응형 ─────────────────────────────────────────────────────────────── */
+
 @media (max-width: 900px) {
     .lotto-header {
         grid-template-columns: 1fr;
@@ -597,6 +742,16 @@
     .lotto-history__item {
         grid-template-columns: 1fr;
     }
+
+    .lotto-analysis__row {
+        grid-template-columns: 1fr;
+        gap: 16px;
+    }
+
+    .lotto-pick {
+        grid-template-columns: 24px minmax(0, 1fr) auto;
+        gap: 8px;
+    }
 }
 
 @media (max-width: 768px) {