/* Reusable, scoped styles for the four subsidence visualizations. */
.subsidence-viz {
  --subsidence-globe: #00358e;
  --subsidence-blueprint: #0062ff;
  --subsidence-ink: #03183c;
  --subsidence-muted: #52647f;
  --subsidence-line: #d4e0f1;
  --subsidence-panel: #ffffff;
  --subsidence-surface: #fbfcfe;
  --subsidence-orange: #ff7643;
  --subsidence-ramp: linear-gradient(90deg,#dceaf8,#80a4ea,#4a7be8,#7c73fb,#b562ce,#d95593,#f66c5c,#ff9636,#ffc600);
  color: var(--subsidence-ink);
  font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
}
.subsidence-viz, .subsidence-viz * { box-sizing: border-box; }
.subsidence-viz__card {
  width: 100%;
  padding: 20px;
  overflow: hidden;
  border: 1px solid var(--subsidence-line);
  border-radius: 4px;
  background: var(--subsidence-panel);
}
.subsidence-viz__title {
  margin: 0 0 4px;
  color: var(--subsidence-globe);
  font-family: Martel, Georgia, serif;
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  font-weight: 700;
  line-height: 1.25;
}
.subsidence-viz__description,
.subsidence-viz__note { margin: 0; color: var(--subsidence-muted); }
.subsidence-viz__description { font-size: .95rem; }
.subsidence-viz__note { margin-top: 9px; font-size: .75rem; line-height: 1.5; }
.subsidence-viz__chart { width: 100%; height: 410px; margin-top: 14px; }
.subsidence-viz__map { width: 100%; min-height: 320px; margin-top: 14px; background: var(--subsidence-surface); }
.subsidence-viz__legend { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.subsidence-viz__legend-label { color: var(--subsidence-muted); font-size: .7rem; white-space: nowrap; }
.subsidence-viz__ramp { flex: 1 1 auto; height: 12px; border-radius: 999px; background: var(--subsidence-ramp); }
.subsidence-viz__error { padding: 12px; border-left: 4px solid var(--subsidence-orange); background: #fff5f0; color: var(--subsidence-ink); }
@media (max-width: 600px) {
  .subsidence-viz__card { padding: 14px; }
  .subsidence-viz__chart { height: 390px; }
  .subsidence-viz__map { min-height: 280px; }
  .subsidence-viz__legend { gap: 8px; }
  .subsidence-viz__legend-label { font-size: .65rem; }
}
@media print {
  .subsidence-viz__card { break-inside: avoid; padding: 3mm; }
  .subsidence-viz__chart { height: 108mm; }
  .subsidence-viz__legend { gap: 3mm; margin-top: 3mm; }
  .subsidence-viz__ramp { height: 3mm; }
}
