.valuation-chart { margin: 20px 0 12px; padding: 16px; border: 1px solid var(--lsf-line); border-radius: var(--lsf-radius); background: var(--lsf-surface); font-size: 13px; line-height: 1.55; }
.valuation-chart__summary { color: var(--lsf-ink); font-weight: 700; font-variant-numeric: tabular-nums; }
.valuation-chart__legend { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.valuation-chart button, .valuation-chart select { min-height: 44px; font: inherit; color: var(--lsf-text); border: 1px solid var(--lsf-line-strong); border-radius: var(--lsf-radius-sm); background: var(--lsf-surface); padding: 7px 10px; cursor: pointer; }
.valuation-chart button:focus-visible, .valuation-chart select:focus-visible, .valuation-chart input:focus-visible { outline: 2px solid var(--lsf-brand); outline-offset: 3px; }
.valuation-chart button[aria-pressed="false"] { color: var(--lsf-muted); background: var(--lsf-surface-muted); text-decoration: line-through; }
.valuation-chart__swatch { display: inline-block; width: 9px; height: 9px; margin-right: 6px; border-radius: 50%; background: var(--era-color); }
.valuation-chart__controls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.valuation-chart__controls label { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.valuation-chart__controls select { max-width: 100%; }
.valuation-chart__plot { width: 100%; overflow: hidden; margin-top: 6px; }
.valuation-chart__plot svg { display: block; width: 100%; cursor: crosshair; touch-action: pan-y; }
.valuation-chart__axis { fill: var(--lsf-muted); font-size: 12px; }
.valuation-chart__grid { stroke: var(--lsf-line); stroke-width: 1; }
.valuation-chart__detail { min-height: 150px; padding: 12px; border: 1px solid var(--lsf-line); border-radius: var(--lsf-radius-sm); background: var(--lsf-surface-soft); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.valuation-chart__detail strong { color: var(--lsf-ink); }
.valuation-chart__values { display: flex; flex-wrap: wrap; gap: 5px 18px; margin: 5px 0; font-size: 15px; }
.valuation-chart__foot { color: var(--lsf-muted); font-size: 12px; margin: 7px 0; }
.valuation-chart__week { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 8px; }
.valuation-chart__week label { flex: 1 1 180px; white-space: nowrap; display: flex; align-items: center; gap: 8px; }
.valuation-chart__week input { width: 100%; min-width: 70px; min-height: 44px; accent-color: var(--lsf-brand); }
.valuation-chart__status { min-height: 20px; margin: 8px 0; color: var(--lsf-muted); }
@media (max-width: 600px) { .valuation-chart { padding: 10px 6px; margin-inline: -5px; } .valuation-chart__legend button { flex: 1 1 42%; padding-inline: 6px; } .valuation-chart__detail { min-height: 180px; } }

#valuation-history-chart .lsf-chart__plot { height: 340px; }
@media (max-width: 540px) { #valuation-history-chart .lsf-chart__plot { height: 300px; } }