/* 통계 화면 가독성 보정: 작은 보조 문구와 연한 대비를 한 단계 올린다. */
:root {
  --green: #06704d;
  --green-dark: #064d39;
  --green-soft: #e2f0e9;
  --muted: #58665f;
  --line: #d5e1db;
  --bg: #f1f5f3;
  --shadow: 0 9px 26px rgba(22, 50, 38, .1);
}

.stats-top > p { font-size: 12px; }
.period-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
.period-tabs button { min-width: 0; padding: 8px 3px; font-size: 12px; white-space: nowrap; }
.breadcrumb button { font-size: 13px; }
.filter-chips button { font-size: 12px; }
.hero-period { font-size: 12px; }
.market-hero h1 { font-size: 25px; }
.kpis span { font-size: 11px; }
.kpis strong { font-size: 22px; }
.kpis small { font-size: 11px; }
.panel-head p { font-size: 11px; }
.panel-head h2 { font-size: 19px; }
.panel-head span { font-size: 11px; }
.trend-chart { position: relative; }
.trend-bar { padding: 0; border: 0; appearance: none; background: #9fcfbc; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.trend-bar.hot { background: #3f9b76; }
.trend-bar.selected { background: var(--green); box-shadow: 0 0 0 2px rgba(6, 112, 77, .16); }
.trend-bar:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }
.trend-bar span { font-size: 9px; color: #66766e; }
.trend-readout { position: absolute; z-index: 2; top: -35px; right: 0; padding: 5px 8px; border: 1px solid #cfe0d7; border-radius: 9px; color: var(--green-dark); background: #fff; box-shadow: 0 4px 12px rgba(22, 50, 38, .1); font-size: 11px; font-weight: 850; white-space: nowrap; }
.dimension-tabs button { font-size: 13px; color: #596860; }
.stat-card h3 { font-size: 15px; color: var(--green-dark); }
.stat-card strong { font-size: 20px; }
.stat-card p, .stat-card small { font-size: 11px; }
.region-row b { font-size: 13px; }
.region-row span { font-size: 11px; }
.region-row { color: #12314b; }
.region-row b, .region-row span { color: #12314b; }
.region-row .up-text { color: var(--up); }
.region-row .down-text { color: var(--down); }
.stat-card .median-line { margin-top: 2px; color: #58665f; }
.stats-note { font-size: 11px; }

@media (max-width: 460px) {
  .stats-top > p { font-size: 13px; }
  .period-tabs button { font-size: 12.5px; padding: 9px 2px; }
  main { padding-left: 16px; padding-right: 16px; }
  .breadcrumb button { font-size: 14px; }
  .hero-period { font-size: 13px; }
  .market-hero h1 { font-size: 27px; }
  .kpis span { font-size: 12px; }
  .kpis strong { font-size: 23px; }
  .kpis small { font-size: 12px; }
  .panel-head p { font-size: 12px; }
  .panel-head h2 { font-size: 21px; }
  .panel-head span { font-size: 12px; }
  .trend-bar span { font-size: 10px; }
  .trend-readout { top: -38px; font-size: 12px; }
  .dimension-tabs button { font-size: 14px; padding-top: 9px; padding-bottom: 9px; }
  .stat-card h3 { font-size: 16px; }
  .stat-card strong { font-size: 21px; }
  .stat-card p, .stat-card small { font-size: 12px; }
  .region-row { grid-template-columns: 1.05fr .7fr 1fr .8fr; padding-top: 13px; padding-bottom: 13px; }
  .region-row.head { font-size: 11px; }
  .region-row b { font-size: 15px; }
  .region-row span { font-size: 12px; }
  .map-caption { font-size: 11px; }
  .stats-note { font-size: 13px; line-height: 1.65; }
}

/* iPad·데스크톱에서 지역명보다 작아지던 숫자 열을 함께 키운다. */
@media (min-width: 600px) {
  .region-row {
    min-height: 58px;
    padding: 14px 4px;
  }

  .region-row b {
    font-size: 16px;
  }

  .region-row span {
    font-size: 14px;
    font-weight: 750;
  }

  .region-row.head {
    min-height: 0;
    padding: 6px 4px 10px;
  }

  .region-row.head b,
  .region-row.head span {
    font-size: 13px;
    font-weight: 850;
  }

  .map-caption {
    font-size: 12px;
  }
}
.stat-card strong { color: var(--green-dark, #075b42); }