feat(cupang): 달력을 2개월(현재+다음 달) 뷰로 개편

- index 라우터가 두 달치 출고를 합쳐(중복 id 제거) 달 별 격자 2개를 생성
- 상단 바: ‹ › 이동 + 기간 제목 + [오늘], 달마다 머리글/월 출고 합계 배지
- 셀 UI 정리: 오늘=검은 원, 선택=링, 출고일=건수/센터수 태그, 타월은 흐리게
- 범례 추가, 1200px 이하에서는 두 달을 세로로 배치

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

app/static/cupang.css

@@ -1126,3 +1126,137 @@ body.cpg-dragging { cursor: grabbing; user-select: none; }
 .cpg-prod-right .cpg-row-actions { flex-wrap: nowrap; gap: 4px; }
 .cpg-prod-right .cpg-row-actions .erp-btn { padding: 3px 8px; font-size: 12px; line-height: 1.5; }
 .cpg-prod-right .cpg-active-toggle { white-space: nowrap; }
+
+/* ══════════════════════════════════════════════════════════════
+   메인 달력 — 2개월(현재 달 + 다음 달) 월간 뷰
+   ══════════════════════════════════════════════════════════════ */
+.cpg-cal-card { padding: 16px 18px 14px; }
+
+/* 상단 바: ‹ › + 기간 제목 + 오늘 */
+.cpg-mcal-bar {
+  display: flex; align-items: center; gap: 12px;
+  padding-bottom: 12px; margin-bottom: 14px;
+  border-bottom: 1px solid var(--color-subtle-ash);
+  flex-shrink: 0;
+}
+.cpg-mcal-nav { display: inline-flex; gap: 4px; }
+.cpg-mcal-navbtn {
+  width: 32px; height: 32px;
+  display: inline-flex; align-items: center; justify-content: center;
+  border: 1px solid var(--color-subtle-ash); border-radius: 8px;
+  font-size: 17px; line-height: 1; color: var(--color-rich-black);
+  text-decoration: none; background: #fff;
+  transition: background .12s, border-color .12s;
+}
+.cpg-mcal-navbtn:hover { background: var(--color-ghost-gray); border-color: var(--color-midtone-gray); }
+.cpg-mcal-range {
+  margin: 0; font-size: 19px; font-weight: 600; letter-spacing: -0.4px;
+  white-space: nowrap;
+}
+.cpg-mcal-todaybtn {
+  margin-left: auto;
+  padding: 6px 14px; border-radius: 999px;
+  border: 1px solid var(--color-subtle-ash); background: #fff;
+  font-size: 13px; color: var(--color-rich-black); text-decoration: none;
+}
+.cpg-mcal-todaybtn:hover { background: var(--color-ghost-gray); border-color: var(--color-midtone-gray); }
+
+/* 두 달 나란히 */
+.cpg-mcal-months {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 22px;
+  flex: 1 1 auto; min-height: 0;
+}
+@media (max-width: 1200px) {
+  .cpg-mcal-months { grid-template-columns: minmax(0, 1fr); }
+}
+.cpg-mcal { display: flex; flex-direction: column; min-height: 0; min-width: 0; }
+
+/* 달 머리글 */
+.cpg-mcal-h {
+  display: flex; align-items: baseline; gap: 6px;
+  padding: 0 2px 8px;
+}
+.cpg-mcal-mname { font-size: 15px; font-weight: 700; letter-spacing: -0.2px; }
+.cpg-mcal-myear { font-size: 12px; color: var(--color-midtone-gray); font-family: var(--font-geist-mono); }
+.cpg-mcal-total {
+  margin-left: auto;
+  font-size: 11px; padding: 2px 8px; border-radius: 999px;
+  background: var(--color-ghost-gray); color: var(--color-midtone-gray);
+}
+.cpg-mcal.is-current .cpg-mcal-total {
+  background: var(--color-deep-black); color: #fff;
+}
+
+/* 날짜 격자 */
+.cpg-mcal-grid {
+  display: grid;
+  grid-template-columns: repeat(7, minmax(0, 1fr));
+  grid-auto-rows: minmax(0, 1fr);
+  gap: 2px;
+  flex: 1 1 auto; min-height: 0;
+}
+.cpg-mcal-wd {
+  text-align: center; padding: 4px 0 6px;
+  font-size: 11px; font-weight: 600; letter-spacing: .3px;
+  color: var(--color-midtone-gray);
+  border-bottom: 1px solid var(--color-subtle-ash);
+}
+.cpg-mcal-wd.is-sun { color: var(--color-callout-red); }
+.cpg-mcal-wd.is-sat { color: #2b5bc2; }
+
+.cpg-mcal-cell {
+  position: relative;
+  display: flex; flex-direction: column; align-items: center; gap: 3px;
+  min-height: 52px; min-width: 0; padding: 5px 4px 6px;
+  border-radius: 8px;
+  text-decoration: none; color: var(--color-rich-black);
+  transition: background .12s, box-shadow .12s;
+}
+.cpg-mcal-cell:hover { background: var(--color-ghost-gray); }
+.cpg-mcal-day {
+  display: inline-flex; align-items: center; justify-content: center;
+  min-width: 24px; height: 24px; padding: 0 6px;
+  border-radius: 999px;
+  font-size: 13px; font-weight: 500; font-variant-numeric: tabular-nums;
+}
+.cpg-mcal-cell.is-red .cpg-mcal-day { color: var(--color-callout-red); }
+.cpg-mcal-cell.is-blue .cpg-mcal-day { color: #2b5bc2; }
+/* 이번 달이 아닌 날 — 흐리게 */
+.cpg-mcal-cell.is-out { opacity: .38; }
+/* 오늘 — 검은 원 */
+.cpg-mcal-cell.is-today .cpg-mcal-day {
+  background: var(--color-deep-black); color: #fff; font-weight: 700;
+}
+/* 선택한 날 — 링 강조 */
+.cpg-mcal-cell.is-selected {
+  background: var(--color-ghost-gray);
+  box-shadow: inset 0 0 0 1.5px var(--color-deep-black);
+}
+
+/* 출고 있는 날 — 건수/센터수 태그 */
+.cpg-mcal-tag {
+  display: inline-flex; align-items: center; gap: 4px;
+  max-width: 100%; padding: 1px 7px;
+  border-radius: 999px;
+  background: var(--color-deep-black); color: #fff;
+  font-size: 11px; line-height: 1.6; white-space: nowrap;
+  overflow: hidden; text-overflow: ellipsis;
+}
+.cpg-mcal-tag > em { font-style: normal; color: #c9c9c9; font-size: 10px; }
+.cpg-mcal-cell.is-out .cpg-mcal-tag { background: var(--color-midtone-gray); }
+
+/* 범례 */
+.cpg-mcal-legend {
+  display: flex; gap: 16px; flex-wrap: wrap;
+  margin-top: 12px; padding-top: 10px;
+  border-top: 1px solid var(--color-subtle-ash);
+  font-size: 11px; color: var(--color-midtone-gray);
+  flex-shrink: 0;
+}
+.cpg-mcal-legend span { display: inline-flex; align-items: center; gap: 6px; }
+.cpg-mcal-legend i { width: 12px; height: 12px; border-radius: 999px; display: inline-block; }
+.cpg-lg-dot { background: var(--color-deep-black); }
+.cpg-lg-today { background: var(--color-deep-black); box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--color-subtle-ash); }
+.cpg-lg-sel { background: var(--color-ghost-gray); box-shadow: inset 0 0 0 1.5px var(--color-deep-black); }