.decline-figure {
  margin: 36px 0 28px;
  padding: 28px;
  background: #fff;
  color: #1a2c4c;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.decline-figure-heading { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.decline-figure h3 { font-size: 26px; letter-spacing: -.025em; margin-bottom: 8px; }
.decline-figure .chart-subtitle { font-size: 14px; line-height: 1.6; margin-bottom: 18px; }
.decline-figure .decline-total { color: #a34130; font-size: 34px; line-height: 1.2; font-weight: 750; white-space: nowrap; margin: 0; }
.decline-total span { display: block; margin-top: 6px; color: #526075; font-size: 13px; font-weight: 400; }
.decline-chart-scroll { overflow-x: auto; }
.decline-chart-scroll svg { display: block; width: 100%; min-width: 500px; height: auto; font-family: Arial, sans-serif; }
.decline-figure figcaption { max-width: none; margin-top: 18px; color: #526075; font-size: 13px; line-height: 1.7; }
.decline-table-wrap { overflow-x: auto; margin-bottom: 28px; }
.decline-table { width: 100%; border-collapse: collapse; font-size: 16px; font-variant-numeric: tabular-nums; }
.decline-table-heading { margin: 0 0 14px; font-size: 18px; line-height: 1.45; letter-spacing: 0; }
.decline-table thead th { vertical-align: bottom; line-height: 1.4; }
.decline-table th:first-child { width: 20%; }
.decline-table th:nth-child(2) { width: 45%; }
.decline-table th:nth-child(3) { width: 35%; }
.decline-table td { white-space: nowrap; }
.decline-table th, .decline-table td { padding: 12px 8px; border-bottom: 1px solid var(--line); text-align: right; }
.decline-table th:first-child { text-align: left; }
.decline-table tbody th { font-weight: 400; }
.decline-table tbody tr:last-child { background: var(--surface); font-weight: 700; }
.retail-decline-article .source-note { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); font-size: 13px; line-height: 1.7; }
@media (max-width: 700px) {
  .decline-figure { padding: 20px 12px; }
  .decline-figure-heading { flex-wrap: wrap; gap: 0; }
  .decline-figure .decline-total { margin-bottom: 22px; }
  .decline-table { font-size: 14px; }
}
@media print {
  .decline-chart-scroll svg { min-width: 0; }
  .decline-figure { break-inside: avoid; }
}

/* Five-city chart; all rules are scoped to the comparison figure. */
.comparison-figure .comparison-help { font-size: 14px; line-height: 1.5; margin-bottom: 12px; }
.comparison-legend { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.comparison-legend button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; border: 1px solid #b8c2cf; border-radius: 4px; padding: 8px 12px; background: #fff; color: #1a2c4c; font: inherit; font-size: 14px; cursor: pointer; }
.comparison-legend button::before { content: ''; width: 20px; border-top: 3px solid var(--series-color); }
.comparison-legend button[data-city="brentwood"]::before, .comparison-legend button[data-city="pleasanton"]::before { border-top-style: dashed; }
.comparison-legend button[data-city="walnut-creek"]::before { border-top-style: dotted; }
.comparison-legend button[data-city="san-ramon"] { font-weight: 750; }
.comparison-legend button[data-city="san-ramon"]::before { border-top-width: 5px; }
.comparison-legend button:hover, .comparison-legend button:focus-visible, .comparison-legend button.is-highlighted { background: #edf1f6; border-color: var(--series-color); }
.comparison-figure .comparison-series { opacity: .45; transition: opacity 150ms ease; }
.comparison-figure .series-line { fill: none; stroke: var(--series-color); stroke-width: 2; stroke-linejoin: round; }
.comparison-figure .series-hit { fill: none; stroke: transparent; stroke-width: 18; pointer-events: stroke; cursor: pointer; }
.comparison-figure .series-dot { fill: #fff; stroke: var(--series-color); stroke-width: 2; }
.comparison-figure .series-label { fill: var(--series-color); }
.comparison-figure .comparison-series:hover, .comparison-figure .comparison-series.is-highlighted, .comparison-figure [data-series="san-ramon"] { opacity: 1; }
.comparison-figure .comparison-series:hover .series-line, .comparison-figure .comparison-series.is-highlighted .series-line { stroke-width: 4; }
.comparison-figure [data-series="san-ramon"] .series-line { stroke-width: 5; }
.comparison-figure [data-series="san-ramon"] .series-label, .comparison-figure .is-highlighted .series-label { font-weight: 750; }
.comparison-figure .comparison-data { margin-top: 20px; }
.comparison-data summary { cursor: pointer; padding-block: 12px; font-size: 15px; font-weight: 650; }
.comparison-table-scroll { overflow-x: auto; }
.comparison-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 14px; font-variant-numeric: tabular-nums; }
.comparison-table caption { text-align: left; padding-bottom: 12px; }
.comparison-table th, .comparison-table td { padding: 10px 8px; border-bottom: 1px solid #dce2ea; text-align: right; }
.comparison-table th:first-child { text-align: left; }
.comparison-table tbody th { font-weight: 400; }
.comparison-table tbody tr:nth-child(-n+4) { font-weight: 700; background: #edf1f6; }
@media (prefers-reduced-motion: reduce) { .comparison-figure .comparison-series { transition: none; } }
@media print { .comparison-figure .comparison-series { opacity: 1; } .comparison-help, .comparison-legend { display: none; } }
