.nm-natural-chart { min-width: 0; color: var(--wb-text); }
.nm-natural-chart .nm-chart-summary { margin: 0 0 8px; font-size: 13px; font-weight: 600; }
.nm-chart-svg { display: block; width: 100%; height: auto; overflow: visible; background: var(--wb-surface); border-radius: 8px; }
.nm-chart-grid { stroke: var(--wb-border); stroke-width: 1; vector-effect: non-scaling-stroke; }
.nm-chart-axis-label, .nm-chart-unit { fill: var(--wb-muted); font: 12px system-ui, 'Microsoft YaHei', sans-serif; }
.nm-chart-unit { font-size: 11px; }
.nm-chart-line { fill: none; stroke: var(--wb-chart); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.nm-chart-gap-line { stroke-dasharray: 6 5; stroke-opacity: .7; }
.nm-chart-point { fill: var(--wb-surface); stroke: var(--wb-chart); stroke-width: 2.5; vector-effect: non-scaling-stroke; cursor: crosshair; }
.nm-chart-point:hover, .nm-chart-point:focus { fill: var(--wb-chart); stroke: var(--wb-chart); stroke-width: 4; outline: none; }
.nm-chart-value { fill: var(--wb-text); font: 600 12px system-ui, 'Microsoft YaHei', sans-serif; paint-order: stroke; stroke: var(--wb-surface); stroke-width: 4px; stroke-linejoin: round; pointer-events: none; }
.nm-natural-chart .nm-chart-tooltip { min-height: 2.1em; margin: 8px 0 4px; padding: 8px 10px; background: var(--wb-subtle); border-radius: 6px; font-size: 12px; line-height: 1.6; }
.nm-natural-chart .nm-chart-note { margin: 7px 0 0; color: var(--wb-muted); font-size: 12px; line-height: 1.65; }
.nm-chart-data { margin-top: 8px; font-size: 12px; overflow-x: auto; }
.nm-chart-data summary { cursor: pointer; color: var(--wb-link); }
.nm-chart-data table { width: 100%; border-collapse: collapse; margin-top: 8px; text-align: left; }
.nm-chart-data th, .nm-chart-data td { padding: 8px; border-bottom: 1px solid var(--wb-border); }
@media (max-width: 600px) {
  .nm-chart-axis-label { font-size: 15px; }
  .nm-chart-unit { font-size: 13px; }
}