.visual-calculator{grid-template-columns:350px minmax(0,1fr);gap:42px}
.visual-calculator .result{position:static}
.visual-calculator .result h2{font-size:2rem}
.visual-calculator .result-description{font-size:.9375rem;line-height:1.5;margin-bottom:25px}
.inputs-panel{border:0;padding:0;min-width:0}
.inputs-panel>summary{display:none}
.live-note{font-size:.875rem;padding:14px 0 0;margin-bottom:0;color:var(--muted)}
.parameter-range{appearance:none;-webkit-appearance:none;width:100%;padding:0;margin:5px 0 0;border:0;min-height:28px;background:transparent;cursor:pointer;accent-color:var(--accent)}
.parameter-range::-webkit-slider-runnable-track{height:4px;background:#cad4ce;border-radius:1px}
.parameter-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;height:18px;width:18px;margin-top:-7px;background:var(--accent);border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px var(--accent)}
.parameter-range::-moz-range-track{height:4px;background:#cad4ce}
.parameter-range::-moz-range-thumb{height:16px;width:16px;background:var(--accent);border:2px solid white;border-radius:50%}
.range-bounds{display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted);margin-top:-2px}
.visual-section{border-top:1px solid var(--line);padding:23px 0 24px}
.chart-heading{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:18px}
.chart-heading h3{font-size:1.0625rem;margin-bottom:4px}
.chart-heading p{font-size:.875rem;color:var(--muted);margin:0}
.chart-unit{font-size:.8125rem;color:var(--muted)}
.capacity-chart{height:236px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));position:relative;gap:5px;margin:8px 0 8px;padding:0}
.capacity-column,.monthly-column{appearance:none;background:transparent;border:0;min-width:0;padding:0;font:inherit;color:var(--ink);position:relative;display:flex;flex-direction:column;border-radius:2px;text-align:center}
.capacity-column:hover,.monthly-column:hover{background:var(--soft)}
.capacity-column.is-selected{background:#fff3eb;box-shadow:inset 0 -3px var(--accent)}
.capacity-plot{position:relative;display:block;flex:1;width:100%}
.capacity-fill{display:block;position:absolute;left:24%;right:24%;min-height:2px;background:#426a5b;opacity:.75;border-radius:1px}
.capacity-fill.negative{background:#89968e}
.capacity-column.is-selected .capacity-fill{background:var(--accent);opacity:1}
.capacity-value{position:absolute;left:0;right:0;transform:translateY(-100%);font-size:.875rem;font-variant-numeric:tabular-nums;z-index:1;padding-bottom:5px;font-weight:500;line-height:1.2;white-space:nowrap}
.capacity-label{display:block;min-height:42px;font-size:.9375rem;line-height:1.25;font-weight:600;padding-top:4px}
.capacity-label small{font-size:.8125rem;font-weight:400}
.capacity-label i{font-style:normal;font-size:.75rem;color:var(--accent);display:block;font-weight:400;margin-top:3px}
.chart-zero{position:absolute;left:0;right:0;border-top:1px solid #8c9992;pointer-events:none;z-index:1}
.chart-zero>span{position:absolute;left:-12px;top:-9px;font-size:.75rem;color:var(--muted);background:#fff;line-height:1}
.chart-caption{font-size:.8125rem;color:var(--muted);line-height:1.5;margin:10px 0 0}
.selected-scenario{display:flex;flex-wrap:wrap;gap:3px 12px;align-items:baseline;border-top:1px solid var(--line);padding-top:16px;margin-top:18px;font-size:.875rem}
.selected-scenario b{font-size:1rem;white-space:nowrap}
.selected-scenario span{font-size:.8125rem;color:var(--muted)}
.visual-metrics{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:16px 0 12px}
.visual-metrics>div{min-width:0}
.visual-metrics span,.visual-metrics small{display:block;color:var(--muted);font-size:.8125rem}
.visual-metrics strong{display:block;font-size:2.1rem;line-height:1.25;font-weight:500;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:4px 0}
.supply-bar{display:flex;width:100%;height:22px;gap:2px;overflow:hidden;margin:22px 0 16px}
.supply-bar span{height:100%;min-width:0}
.supply-direct{background:#306355}
.supply-stored{background:var(--accent)}
.supply-grid{background:#cbd4ce}
.supply-legend{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.supply-legend span{display:flex;gap:6px;align-items:baseline;font-size:.8125rem;color:var(--muted)}
.supply-legend i,.visual-key i{display:inline-block;width:9px;height:9px;flex-shrink:0}
.supply-legend b{display:block;font-size:1.2rem;font-weight:500;margin-top:6px;font-variant-numeric:tabular-nums}
.supply-legend small{font-size:.8125rem;font-weight:400;color:var(--muted)}
.visual-key{display:flex;gap:20px;font-size:.8125rem;color:var(--muted);margin:0 0 10px}
.visual-key span{display:flex;gap:6px;align-items:center}
.monthly-plot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;height:200px;position:relative}
.monthly-bars{position:relative;flex:1;display:block;width:100%}
.monthly-bars i{position:absolute;width:34%;min-height:1px;left:13%}
.monthly-bars i+i{left:52%}
.month-label{height:28px;font-size:.75rem;line-height:28px;color:var(--muted)}
.month-short{display:none}
.monthly-column.is-selected{background:var(--soft);box-shadow:inset 0 -2px var(--ink)}
.month-reading{display:flex;flex-wrap:wrap;gap:4px 16px;margin:16px 0 0;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:.875rem;font-variant-numeric:tabular-nums}
.month-reading strong{flex-basis:100%;margin-bottom:2px}
.month-reading span{color:var(--muted)}
.month-reading b{color:var(--ink);font-weight:500}
.monthly-data{border:0;padding-bottom:0}
.monthly-data summary{font-size:.875rem;font-weight:400;text-decoration:underline;text-underline-offset:3px}
#result-content[aria-busy=true] .visual-section{opacity:.65}
@media(min-width:761px){.inputs-panel:not([open])>form{display:block}}
@media(max-width:1000px){.visual-calculator{grid-template-columns:300px minmax(0,1fr);gap:26px}.capacity-value{font-size:.8125rem}}
@media(max-width:760px){
 .visual-calculator{grid-template-columns:1fr;gap:20px}
 .intro:has(+.visual-calculator){padding:22px 0 16px}
 .intro:has(+.visual-calculator) h1{font-size:2rem}
 .intro:has(+.visual-calculator) p:last-child{font-size:.9375rem;margin-bottom:6px}
 .inputs-panel{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
 .inputs-panel>summary{display:list-item;padding:13px 0;font-size:1rem;min-height:52px}
 .inputs-panel>summary span{font-weight:400;font-size:.8125rem;color:var(--muted);float:right;padding-top:3px}
 .inputs-panel .inputs{border-top:0}
 .visual-calculator .result{border-top:0;padding-top:0}
 .visual-calculator .result h2{font-size:1.65rem;margin-bottom:8px}
 .visual-calculator .result-top{margin-bottom:10px}
 .visual-calculator .result-description{font-size:.875rem;margin-bottom:18px}
 .visual-section{padding-top:18px;padding-bottom:22px}
 .chart-heading{margin-bottom:13px}
 .chart-heading h3{font-size:1rem}
 .capacity-chart{height:216px;gap:2px}
 .capacity-value{font-size:.8125rem;letter-spacing:-.015em}
 .capacity-label{font-size:.875rem}
 .capacity-label small,.capacity-label i{font-size:.75rem}
 .chart-zero>span{left:-10px}
 .visual-metrics{gap:16px}
 .visual-metrics strong{font-size:1.85rem}
 .supply-legend{gap:8px}
 .supply-legend span{font-size:.75rem;line-height:1.4}
 .supply-legend b{font-size:1.125rem}
 .monthly-plot{gap:1px;height:178px}
 .month-long{display:none}.month-short{display:inline}
 .month-reading{gap:4px 12px;font-size:.8125rem}
}
@media(max-width:360px){.capacity-value{font-size:.75rem}.inputs-panel>summary span{float:none;display:block;margin-left:20px}.supply-legend{grid-template-columns:1fr}.supply-legend>div{display:flex;justify-content:space-between;align-items:center}.supply-legend b{margin:0}.supply-legend span{font-size:.8125rem}}
@media print{.inputs-panel{display:none!important}.capacity-chart,.monthly-plot,.supply-bar{print-color-adjust:exact;-webkit-print-color-adjust:exact}.visual-section{break-inside:avoid}}

.chart-update-note{font-size:.875rem;margin:0 0 18px;padding:12px 15px}
.capacity-column:disabled{cursor:wait}