/* Amana charts: chrome only. Colours come from --viz-* tokens (validated palette). */
.chart { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.chart__plot svg { display: block; width: 100%; height: auto; overflow: visible; }
.chart__plot svg:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-xs); }
.chart__tip {
  position: absolute; z-index: var(--z-tooltip); pointer-events: none; min-width: 9rem; padding: var(--space-2) var(--space-3);
  background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); box-shadow: var(--shadow-md);
  font-size: var(--fs-xs); line-height: 1.5; color: var(--text);
}
.chart__tip > b { display: block; margin-block-end: 2px; color: var(--text-2); font-weight: var(--fw-semibold); }
.chart__tip-row { display: flex; align-items: center; gap: var(--space-2); }
.chart__tip-row i { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.chart__tip-row span { flex: 1; color: var(--text-2); }
.chart__tip-row b { font-weight: var(--fw-semibold); }
.chart__legend { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); font-size: var(--fs-xs); color: var(--text-2); }
.chart__legend li { display: inline-flex; align-items: center; gap: 6px; }
.chart__legend i { width: 10px; height: 10px; border-radius: 3px; }
.chart__table { font-size: var(--fs-xs); }
.chart__table summary { cursor: pointer; color: var(--text-link); width: fit-content; padding-block: var(--space-1); }
.chart__table .table { margin-block-start: var(--space-2); }