/* ════════════════════════════════════════════════════════════════
   동네 결산 (digest) — 무순위·무판정 월간 변화 기록 (P-049)
   분야 요약 / 큐레이션(교차·전환점) / 이달의 가장 큰 변화 / 라벨별 움직임 / 시도별.
   ════════════════════════════════════════════════════════════════ */

/* 부분월(진행 중인 현재월) 배너 — 라벨 허브와 동일 톤 */
.partial-month-banner {
  background: #fef3c7;
  border: 1px solid #fcd34d;
  border-left: 4px solid #f59e0b;
  color: #92400e;
  padding: 12px 16px;
  border-radius: 6px;
  margin: 12px 16px;
  font-size: 14px;
  line-height: 1.5;
}
.partial-month-banner strong {
  display: block;
  margin-bottom: 4px;
  font-weight: 700;
}

:root {
  --dg-bg:#f8fafc; --dg-surface:#fff; --dg-ink:#0f172a; --dg-muted:#475569; --dg-faint:#64748b;
  --dg-line:#e2e8f0; --dg-warm:#ea580c; --dg-cool:#0891b2; --dg-indigo:#4f46e5;
}

/* page-hd (label-hub 톤) */
.page-hd { background:linear-gradient(135deg,#fdf2f8 0%,#fce7f3 100%); padding:34px 20px 26px; border-bottom:1px solid #fbcfe8; }
.page-hd-inner { max-width:1080px; margin:0 auto; }
.page-breadcrumb { font-size:12px; color:var(--dg-faint); margin-bottom:10px; }
.page-breadcrumb a { color:#be185d; text-decoration:none; }
.page-breadcrumb span { margin:0 4px; color:#94a3b8; }
.page-hd-title { font-size:23px; font-weight:800; color:#9d174d; letter-spacing:-.5px; margin-bottom:7px; }
.page-hd-desc { font-size:14px; color:var(--dg-muted); line-height:1.6; max-width:760px; }
.page-note { font-size:12.5px; color:var(--dg-faint); margin-top:9px; }

/* strip — 프로젝트 정본(trade-page/label-hub) 톤에 통일. max-width만 digest 콘텐츠(1080)에 맞춤 */
.strip { background:#be185d; padding:10px 20px; position:sticky; top:var(--header-h, 61px); z-index:100; --kpi-max:1080px; }
.si-wrap { max-width:1080px; margin:0 auto; display:flex; align-items:center; flex-wrap:wrap; }
.si { display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:2px 20px; border-right:1px solid rgba(255,255,255,.18); }
.si:first-child { padding-left:0; }
.si:last-of-type { border-right:none; }
.si-lbl { font-size:13px; color:rgba(255,255,255,.65); font-weight:600; letter-spacing:.2px; }
.si-row { display:flex; align-items:baseline; gap:4px; }
.si-val { font-size:18px; font-weight:800; color:#fff; line-height:1.1; }
.si-unit { font-size:13px; color:rgba(255,255,255,.6); }
.mn-nav { margin-left:auto; display:flex; align-items:center; gap:6px; }
.mn-btn { font-size:13px; color:#fff; padding:3px 10px; border-radius:4px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.25); text-decoration:none; line-height:1.5; cursor:pointer; }
.mn-btn:hover { background:rgba(255,255,255,.32); border-color:rgba(255,255,255,.4); }
.mn-dis { color:rgba(255,255,255,.22); background:transparent; border-color:rgba(255,255,255,.1); cursor:default; pointer-events:none; }
.mn-select { font-size:13px; font-weight:700; color:#fff; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.25); border-radius:4px; padding:3px 8px; cursor:pointer; outline:none; letter-spacing:-.2px; }
.mn-select option { color:#0f172a; background:#fff; }

.dg-wrap { max-width:1080px; margin:0 auto; padding:28px 20px 60px; }

/* grp-hd */
.grp-hd { display:flex; align-items:flex-start; gap:12px; margin:38px 0 16px; }
.grp-bar { width:4px; height:38px; border-radius:2px; flex-shrink:0; }
.grp-bar.orange { background:linear-gradient(180deg,#fb923c,#ea580c); }
.grp-bar.blue   { background:linear-gradient(180deg,#38bdf8,#0284c7); }
.grp-bar.purple { background:linear-gradient(180deg,#c084fc,#7c3aed); }
.grp-bar.slate  { background:linear-gradient(180deg,#94a3b8,#475569); }
.grp-title { font-size:18px; font-weight:800; color:#1e293b; }
.grp-desc { font-size:13px; color:var(--dg-faint); margin-top:2px; }

/* 분야 요약 스트립 */
.cat-summary-wrap { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.cat-summary-card { background:var(--dg-surface); border:1px solid var(--dg-line); border-radius:12px; padding:14px 16px; box-shadow:0 1px 3px rgba(15,23,42,.04); }
.cat-summary-title { font-size:13px; font-weight:800; color:var(--dg-muted); margin-bottom:9px; display:flex; align-items:center; gap:7px; }
.cat-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.cat-dot.env { background:#10b981; } .cat-dot.market { background:#7c3aed; } .cat-dot.jeonse { background:#3b82f6; } .cat-dot.composite { background:#ef4444; }
.cat-summary-counts { font-size:18px; font-weight:800; }
.cat-summary-counts .add { color:var(--dg-warm); } .cat-summary-counts .rm { color:var(--dg-cool); margin-left:12px; }

/* 큐레이션 (교차·전환점) */
.curation-section { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.curation-card { background:var(--dg-surface); border:1px solid var(--dg-line); border-radius:16px; padding:18px 20px; box-shadow:0 1px 4px rgba(15,23,42,.03); }
.curation-badge { display:inline-block; padding:4px 11px; border-radius:999px; font-size:11.5px; font-weight:800; margin-bottom:12px; }
.curation-badge.cross  { background:rgba(234,88,12,.08); color:var(--dg-warm); }
.curation-badge.streak { background:rgba(124,58,237,.08); color:#7c3aed; }
.curation-card-title { font-size:15.5px; font-weight:800; color:#1e293b; margin-bottom:4px; }
.curation-card-desc { font-size:12.5px; color:var(--dg-faint); margin-bottom:14px; }
.curation-list { list-style:none; display:flex; flex-direction:column; gap:10px; }
.curation-item { display:block; padding:12px 14px; background:var(--dg-bg); border:1px solid #eef2f7; border-radius:10px; text-decoration:none; color:inherit; transition:background .15s, border-color .15s; }
.curation-item:hover { background:#eff6ff; border-color:#c7d0f5; }
.curation-loc { font-size:13px; font-weight:800; color:var(--dg-muted); margin-bottom:4px; }
.curation-headline { font-size:14.5px; font-weight:700; color:var(--dg-ink); line-height:1.45; }
.curation-headline b { color:var(--dg-warm); }
.curation-headline.streak b { color:#7c3aed; }
.curation-labels { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.curation-chip { font-size:12px; font-weight:600; color:#334155; background:#e2e8f0; border:none; border-radius:999px; padding:4px 11px; line-height:1.4; white-space:nowrap; }
.curation-empty { font-size:13px; color:#94a3b8; padding:8px 2px; }

/* 이달의 가장 큰 변화 */
.lead-card { display:flex; align-items:center; gap:18px; background:var(--dg-surface); border:1px solid var(--dg-line); border-left:4px solid var(--dg-warm); border-radius:14px; padding:20px 22px; box-shadow:0 1px 4px rgba(15,23,42,.03); text-decoration:none; color:inherit; }
.lead-card:hover { box-shadow:0 6px 18px -10px rgba(234,88,12,.3); }
.lead-info { flex:1; min-width:0; }
.lead-badge { font-size:11.5px; font-weight:700; color:var(--dg-faint); margin-bottom:5px; }
.lead-title-text { font-size:18px; font-weight:800; color:var(--dg-ink); }
.lead-stats { font-size:13.5px; color:var(--dg-faint); margin-top:5px; }
.lead-stats .add { color:var(--dg-warm); font-weight:800; } .lead-stats .rm { color:var(--dg-cool); font-weight:700; }
.lead-go { font-size:20px; color:#cbd5e1; flex-shrink:0; }

/* 라벨별 움직임 (행 + ajax 펼침) */
.legend { display:flex; justify-content:flex-end; gap:16px; font-size:12px; color:var(--dg-faint); margin-bottom:10px; }
.legend-item { display:flex; align-items:center; gap:6px; }
.legend-color { width:12px; height:6px; border-radius:3px; } .legend-color.add { background:var(--dg-warm); } .legend-color.rm { background:var(--dg-cool); }
.card-box { background:var(--dg-surface); border:1px solid var(--dg-line); border-radius:14px; padding:4px 16px; box-shadow:0 1px 4px rgba(15,23,42,.03); }
.dg-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 6px; border-bottom:1px solid var(--dg-line); }
.dg-row:last-of-type { border-bottom:none; }
.dg-row.dg-open { background:var(--dg-bg); }
.dg-row-left { display:flex; align-items:center; gap:11px; flex:1; min-width:0; }
.dg-caret { color:#94a3b8; font-size:11px; flex-shrink:0; transition:transform .2s; }
.dg-row.dg-open .dg-caret { transform:rotate(90deg); }
.dim-badge { font-size:11px; font-weight:700; padding:2.5px 8px; border-radius:7px; white-space:nowrap; flex-shrink:0; }
.dim-badge.cat-nat { background:#dbeafe; color:#1d4ed8; } .dim-badge.cat-sido { background:#d1fae5; color:#065f46; }
.dim-badge.cat-temporal { background:#ede9fe; color:#6d28d9; } .dim-badge.cat-yoy { background:#ede9fe; color:#6d28d9; }
.dim-badge.cat-parent { background:#fed7aa; color:#9a3412; } .dim-badge.cat-composite { background:#fee2e2; color:#b91c1c; }
.dg-label-text { font-size:14.5px; font-weight:700; color:#1e293b; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dg-row-right { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.dg-count { font-family:inherit; border:1px solid transparent; background:transparent; cursor:pointer; font-size:16px; font-weight:800; padding:3px 10px; border-radius:9px; line-height:1.2; transition:background .12s, border-color .12s; }
.dg-count.add { color:var(--dg-warm); } .dg-count.add:hover { background:rgba(234,88,12,.10); } .dg-count.add.on { background:rgba(234,88,12,.14); border-color:rgba(234,88,12,.4); }
.dg-count.rm { color:var(--dg-cool); font-size:14px; } .dg-count.rm:hover { background:rgba(8,145,178,.10); } .dg-count.rm.on { background:rgba(8,145,178,.14); border-color:rgba(8,145,178,.4); }

/* ajax 펼침 패널 — 룰상세 rl-pane(함께 붙는 라벨)과 동일한 3-박스 레이아웃 (digest.js 빌드) */
.dg-pane { display:flex; flex-direction:column; gap:9px; background:#fcfdfe; border-bottom:1px solid var(--dg-line); padding:14px 6px 18px; }
.dg-pane:last-child { border-bottom:none; }
.dg-pane-loading, .dg-pane-empty { padding:10px 2px; font-size:13.5px; color:var(--dg-faint); }
.dg-pane-head { font-size:13.5px; font-weight:800; padding:2px 2px 1px; }
.dg-pane-head.add { color:var(--dg-warm); } .dg-pane-head.rm { color:var(--dg-cool); }

/* ① 시도 탭 박스 */
.dg-sido-tabs { display:flex; flex-wrap:wrap; gap:3px; padding:5px 6px; background:#fff; border:1px solid var(--dg-line); border-radius:8px; }
.dg-sido-tab { display:inline-flex; align-items:center; gap:5px; padding:5px 10px; background:transparent; border:1px solid transparent; border-radius:13px; cursor:pointer; font-size:13px; color:var(--dg-muted); font-family:inherit; transition:background .12s, color .12s; }
.dg-sido-tab:hover { background:#f1f5f9; color:var(--dg-ink); }
.dg-sido-tab.on { background:#1e293b; border-color:#1e293b; color:#fff; }
.dg-sido-tab-name { font-weight:700; }
.dg-sido-tab-count { font-size:11px; font-weight:700; background:rgba(15,23,42,.08); padding:1px 6px; border-radius:8px; }
.dg-sido-tab.on .dg-sido-tab-count { background:rgba(255,255,255,.22); }

/* ② 시군구 칩 박스 */
.dg-gu-area { background:#fff; border:1px solid var(--dg-line); border-radius:8px; padding:8px 10px; }
.dg-gu-list { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:5px; }
.dg-gu { display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border:1px solid var(--dg-line); background:#fff; border-radius:12px; cursor:pointer; font-size:13px; color:var(--dg-ink); white-space:nowrap; transition:background .12s, border-color .12s, color .12s; }
.dg-gu:hover { background:#f1f5f9; border-color:#cbd5e1; }
.dg-gu.on { background:#eff6ff; border-color:#93c5fd; color:#1d4ed8; }
.dg-gu-name { font-weight:600; }
.dg-gu-count { font-size:11px; font-weight:700; color:#64748b; background:#f1f5f9; padding:1px 6px; border-radius:8px; }
.dg-gu.on .dg-gu-count { background:#dbeafe; color:#1d4ed8; }

/* ③ 동네 디테일 박스 */
.dg-detail { background:#fff; border:1px solid var(--dg-line); border-radius:8px; padding:10px 12px; }
.dg-detail-head { font-size:13px; font-weight:700; color:var(--dg-faint); margin-bottom:8px; padding-bottom:7px; border-bottom:1px solid var(--dg-line); }
.dg-dong-list { display:flex; flex-wrap:wrap; gap:8px; }
.dg-dong-card { display:inline-flex; padding:8px 13px; border:1px solid var(--dg-line); border-radius:8px; background:#fff; text-decoration:none; color:inherit; transition:background .12s, border-color .12s; }
.dg-dong-card:hover { background:#eff6ff; border-color:#93c5fd; }
.dg-dong-name { font-size:13.5px; font-weight:700; color:var(--dg-ink); }

/* 시도별 변동 (히트맵 농도) */
.sido-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; }
.sido-card { background:var(--dg-surface); border:1px solid var(--dg-line); border-radius:12px; padding:14px 16px; text-decoration:none; color:inherit; transition:transform .15s, box-shadow .15s; }
.sido-card:hover { transform:translateY(-2px); box-shadow:0 4px 12px rgba(124,58,237,.1); }
.sido-name { font-size:15px; font-weight:800; color:#1e293b; }
.sido-stats { font-size:13px; margin-top:6px; }
.sido-stats .add { color:var(--dg-warm); font-weight:700; } .sido-stats .rm { color:var(--dg-cool); font-weight:700; }

.dg-empty { padding:22px; text-align:center; color:var(--dg-muted); font-size:14.5px; background:#f8fafc; border-radius:10px; border:1px dashed #cbd5e1; }
.dg-cta { text-align:center; margin-top:36px; }
.dg-cta a { display:inline-block; padding:11px 26px; background:#0f172a; color:#f1f5f9; text-decoration:none; border-radius:9px; font-size:15px; font-weight:700; }
.dg-cta a:hover { background:#1e293b; }
.dg-wrap a:hover { text-decoration:none; }

@media (max-width:820px) { .cat-summary-wrap { grid-template-columns:repeat(2,1fr); } .curation-section { grid-template-columns:1fr; } }

/* 모바일: KPI 스트립을 1줄 3칸으로 압축(높이 절감) + 월 네비 하단 중앙 */
@media (max-width:768px) {
  .strip { padding:7px 14px; }
  .si-wrap { display:grid; grid-template-columns:repeat(3,1fr); gap:2px 8px; }
  .si { padding:1px 0; align-items:center; text-align:center; }
  .si-lbl { font-size:10px; }
  .si-val { font-size:15px; }
  .si-unit { font-size:10px; }
  .mn-nav { grid-column:1 / -1; justify-content:center; margin-left:0; margin-top:4px; }
}

/* 모바일: 라벨별 움직임 행을 세로 스택 — 라벨 풀텍스트(말줄임 해제), 카운트는 아래 왼쪽 */
@media (max-width:640px) {
  .dg-row { flex-direction:column; align-items:stretch; gap:8px; }
  .dg-row-left { align-items:flex-start; }
  .dg-label-text { white-space:normal; overflow:visible; text-overflow:clip; }
  .dg-row-right { justify-content:flex-start; }
}