.chart-bar { cursor: pointer; outline: none; -webkit-tap-highlight-color: transparent; }
.chart-bar .chart-hitarea { fill: transparent; stroke: none; }
.chart-bar .chart-selection { fill: none; stroke: var(--fg); stroke-width: 1; stroke-dasharray: 3 3; visibility: hidden; pointer-events: none; shape-rendering: crispEdges; vector-effect: non-scaling-stroke; }
.chart-bar.is-selected .chart-selection,
.chart-bar:focus-visible .chart-selection { visibility: visible; }
.chart-bar:focus-visible .chart-hitarea { stroke: var(--fg); stroke-width: 1; stroke-dasharray: 3 3; shape-rendering: crispEdges; vector-effect: non-scaling-stroke; }
.chart-segment { stroke: var(--fg); stroke-width: 1; vector-effect: non-scaling-stroke; shape-rendering: crispEdges; }
.chart-axis-rule { stroke: var(--fg); stroke-width: 1; vector-effect: non-scaling-stroke; shape-rendering: crispEdges; }
.chart-axis-title, .chart-axis-unavailable { fill: var(--fg); font: 11px var(--font); }
.chart-axis-title { font-weight: 600; }
.chart-cost-series { pointer-events: none; }
.chart-cost-line, .chart-cost-halo { fill: none; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.chart-cost-line { stroke: var(--fg); stroke-width: 1.5; }
.chart-cost-halo { stroke: var(--bg); stroke-width: 4; }
.chart-cumulative-series { pointer-events: none; }
.chart-cumulative-line { fill: none; stroke: var(--fg); stroke-width: 1.5; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.legend .cost-legend-icon { width: 24px; outline: none; }
.chart-tooltip { pointer-events: none; }
.chart-tooltip-box { fill: var(--fg); stroke: var(--bg); stroke-width: 1; }
.chart-tooltip text { fill: var(--bg); font-family: var(--font); font-variant-numeric: tabular-nums; }
.chart-tooltip-date { font-size: 11px; }
.chart-tooltip-tokens { font-size: 14px; font-weight: 700; }
.chart-tooltip-cost, .chart-tooltip-cumulative, .chart-tooltip-progress { font-size: 12px; }