/* motion.css: chart motion. The animations themselves run in
   js/v2/viz/charts/common.mjs (Element.animate on transform, opacity and
   stroke-dashoffset, timed from tokens.css); this file holds the motion
   tokens tokens.css does not have and the styles motion relies on.

   What moves, and when (only on first appearance and on a data, period or
   basis change, never per scrub frame):
   - lines (band, renderLines): the stroke draws from left to right over
     --dur-entry; end labels and dashed tails fade in over --dur-entry-late
     as the draw ends; a period change morphs the line (--dur-morph), or
     crossfades it when the frames cannot be matched point to point
   - bars: grow from the zero line on entry (stagger squeezed under 100 ms);
     a change moves each bar from its old box to its new one (--dur-morph)
   - donut: the ring sweeps in; a change crossfades it (--dur-tween)
   - treemap: tiles fade and scale in; a change crossfades them
   - caption and donut totals count to a changed value (--dur-tween) */

:root {
  --dur-entry-late: 220ms;   /* end dot / end label fade after a line draw */
}

/* counting figures keep their width while the digits change */
.viz-cap-v, .viz-donut-total { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  :root { --dur-entry-late: 0ms; }
}