/* Opt-in chart toolbar control, shared by the figure and its host page. */
.chart-year-range {
  --range-blue: var(--blue, var(--mv-blue));
  --range-border: var(--border-mid, var(--mv-border));
  --range-text: var(--text-light, var(--mv-text-muted));
  width: 220px; max-width: 100%; flex: 0 0 220px; font-family: inherit;
}
.chart-year-range .year-range-heading { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; line-height: 1.25; color: var(--range-text); }
.chart-year-range output { font-weight: 600; font-variant-numeric: tabular-nums; }
.chart-year-range .year-range-track { position: relative; height: 28px; touch-action: none; }
.chart-year-range .year-range-track::before { content: ''; position: absolute; left: 8px; right: 8px; top: 12px; height: 4px; border-radius: 2px; background: linear-gradient(to right, var(--range-border) var(--range-start), var(--range-blue) var(--range-start), var(--range-blue) var(--range-end), var(--range-border) var(--range-end)); }
.chart-year-range input[type="range"] { appearance: none; -webkit-appearance: none; position: absolute; inset: 0; width: 100%; height: 28px; margin: 0; padding: 0; background: transparent; border: 0; pointer-events: none; outline: none; }
.chart-year-range input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; border: 2px solid var(--range-blue); border-radius: 50%; background: var(--range-blue); cursor: ew-resize; pointer-events: auto; }
.chart-year-range input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border: 2px solid var(--range-blue); border-radius: 50%; background: var(--range-blue); cursor: ew-resize; pointer-events: auto; }
.chart-year-range input[type="range"]::-moz-range-track { background: transparent; border: 0; }
.chart-year-range input[type="range"]:focus-visible::-webkit-slider-thumb { outline: 2px solid var(--range-blue); outline-offset: 3px; }
.chart-year-range input[type="range"]:focus-visible::-moz-range-thumb { outline: 2px solid var(--range-blue); outline-offset: 3px; }
@media (max-width: 600px) { .chart-year-range { flex-basis: 200px; width: 200px; } }