/* Shared chart presentation across completed work, costs and forecasts. */
:root{--chart-surface:#fffefa;--chart-grid:#dde5df;--chart-ink:#203c39;--chart-muted:#63756f;--chart-focus:#146b61;--chart-radius:8px}
.completed-panel,.cost-panel,.cost-distribution,.movement-card,.analytics-panel,.forecast-work-card{background:var(--chart-surface);border:1px solid var(--line);border-radius:var(--chart-radius);box-shadow:0 2px 8px rgb(0 0 0 / .025);padding:28px;min-width:0}
.chart-header h3,.cost-distribution-heading h3,.analytics-heading h3,.forecast-work-heading h3{font:500 28px/1.25 var(--serif);letter-spacing:-.02em;margin:0 0 12px;text-wrap:balance}
.chart-header p,.cost-distribution-heading p,.analytics-heading p,.forecast-work-heading p{font-size:12px;line-height:1.75;color:var(--chart-muted)}
.movement-svg,.history-svg,.analytics-svg,.completed-chart svg,.cost-distribution-svg,.forecast-work-viewport svg{background:var(--chart-surface);font-family:var(--sans);font-variant-numeric:tabular-nums}
.movement-svg text,.history-svg text,.analytics-svg text,.completed-chart text,.cost-distribution-svg text,.forecast-work-viewport text{font-family:var(--sans);font-variant-numeric:tabular-nums}
.movement-svg .year-label,.analytics-svg .chart-count,.cost-distribution-tick,.forecast-work-tick,.forecast-work-count{fill:var(--chart-muted);font-size:11px}
.cost-distribution-grid,.forecast-work-grid{stroke:var(--chart-grid);stroke-width:1;opacity:1}
.cost-distribution-axis,.forecast-work-axis,.analytics-svg .chart-axis-label,.completed-chart .axis-title{fill:var(--chart-ink);font-size:12px;font-weight:600}
.chart-key,.analytics-legend,.completed-legend,.cost-distribution-legend,.forecast-work-key{gap:12px 20px;flex-wrap:wrap;font-size:12px;line-height:1.6;color:var(--chart-muted);margin:16px 0}
.chart-note,.chart-encoding-note,.analytics-note,.cost-distribution-note,.forecast-work-note{font-size:12px;line-height:1.75;color:var(--chart-muted)}
.chart-encoding-note{margin:0 0 18px;max-width:850px}
.forecast-baseline-control{display:grid;gap:12px;margin:24px 0;padding:0;min-width:0}
.forecast-baseline-control label{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.forecast-baseline-control label>span{font-size:12px;font-weight:650;color:var(--muted);line-height:1.5}
#forecast-baseline{display:block;box-sizing:border-box;width:auto;max-width:100%;min-width:0;min-height:40px;padding:7px 30px 7px 10px;border:1px solid var(--line);border-radius:4px;background:var(--surface);font:400 13px/1.5 var(--sans);color:var(--ink)}
#forecast-baseline-context{margin:0;font-size:12px;line-height:1.75;max-width:980px}
.cost-count{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;margin:24px 0 20px;align-items:center}
.cost-count>p{margin:0;line-height:1.75}
#cost-download{justify-self:end;min-height:44px;margin:0}
:is(.forecast-baseline-control,.completed-panel,.cost-panel,.cost-distribution,.movement-card,.analytics-panel,.forecast-work-card) :is(select,input,button):focus-visible{outline:2px solid var(--chart-focus);outline-offset:2px;box-shadow:none}
:is(.forecast-baseline-control,.completed-panel,.cost-panel,.cost-distribution,.movement-card,.analytics-panel,.forecast-work-card) :is(select,input,button):focus:not(:focus-visible){outline:none}
.cost-distribution-point:focus-visible .cost-distribution-selection{stroke:var(--chart-focus);stroke-width:2}
@media(max-width:700px){.completed-panel,.cost-panel,.cost-distribution,.movement-card,.analytics-panel,.forecast-work-card{padding:20px 16px}.chart-header h3,.cost-distribution-heading h3,.analytics-heading h3,.forecast-work-heading h3{font-size:25px}.forecast-baseline-control label{max-width:none}#cost-download{justify-self:start;max-width:100%;white-space:normal}.chart-key,.analytics-legend,.cost-distribution-legend,.forecast-work-key{gap:10px 16px}}

/* The three primary plots use the same plotting surface, marks and axes. */
.plot-background{fill:#f5f8f6;stroke:none}
.plot-grid{stroke:#dce4df;stroke-width:1;fill:none;pointer-events:none}
.plot-reference{stroke:#8a9d94;stroke-width:1;stroke-dasharray:4 4;fill:none;pointer-events:none}
.plot-separator{stroke:#e6ece8;stroke-width:1;fill:none;pointer-events:none}
.completed-chart svg text,.cost-distribution-svg text,.forecast-work-viewport svg text{font-family:Inter,system-ui,sans-serif;font-size:12px;fill:#63756f}
.cost-distribution-source,.forecast-work-viewport .forecast-work-group{font-size:12px;font-weight:650;fill:#203c39}
.forecast-work-viewport .forecast-work-count{font-size:11px}
.cost-distribution-axis,.forecast-work-viewport .forecast-work-axis{font-size:12px;font-weight:600;fill:#203c39}
.cost-distribution-dot,.forecast-work-dot{fill-opacity:.85;opacity:1;stroke:#fffefa;stroke-width:1.5}
.forecast-work-band,.forecast-work-band.alternate{fill:none}
.forecast-work-cluster text{fill:white!important;font-size:10px!important}
@media(max-width:700px){.cost-count{grid-template-columns:minmax(0,1fr);gap:12px}.forecast-baseline-control label{gap:8px}}
