.compare-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 14px;align-items:end}
.compare-period{grid-column:span 2}.compare-actions{grid-column:span 2;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.compare-submit{background:var(--brand);border-color:var(--brand);color:var(--surface)}
.compare-form select,.compare-actions .chip{min-height:44px}
.compare-legend{list-style:none;display:flex;flex-wrap:wrap;gap:12px 26px;margin:0 0 26px;padding:0}
.compare-legend li{display:flex;align-items:center;gap:8px;font-size:13px}
.compare-series.series-1{--series:var(--brand)}.compare-series.series-2{--series:var(--gold)}.compare-series.series-3{--series:var(--ink)}.compare-series.series-4{--series:var(--muted)}
.compare-key{width:24px;border-top:3px solid var(--series)}.series-2 .compare-key{border-top-style:dashed}.series-3 .compare-key{border-top-style:dotted}.series-4 .compare-key{border-top-style:double}
.compare-plot{display:flex;direction:ltr;gap:12px;height:300px;padding:10px 0}
.compare-y{display:flex;flex-direction:column;justify-content:space-between;min-width:60px;font-size:12px;color:var(--muted)}
.compare-plot svg{width:100%;height:100%;min-width:0;overflow:visible}
.compare-grid{stroke:var(--line);stroke-dasharray:3 5;fill:none;vector-effect:non-scaling-stroke}
.compare-line{stroke:var(--series);stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;fill:none;vector-effect:non-scaling-stroke}
.compare-line.series-2{stroke-dasharray:10 6}.compare-line.series-3{stroke-dasharray:2 5}.compare-line.series-4{stroke-dasharray:12 4 2 4}
.compare-unit{display:block;font-size:12px;font-weight:400;color:var(--muted)}
@media(max-width:700px){.compare-form{grid-template-columns:repeat(2,minmax(0,1fr))}.compare-actions{grid-column:1/-1}.compare-plot{height:240px}.compare-y{min-width:48px;font-size:11px}.compare-legend{gap:12px}.compare-legend li{font-size:12px}.compare-period{grid-column:1/-1}}