.ds-motion-token{font-family:var(--font-mono);color:var(--text-label);font-size:13px;line-height:20px}.ds-motion-sr{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;margin:-1px;position:absolute;overflow:hidden}.ds-motion-popup{inline-size:max-content}.ds-motion-popup[data-state]{opacity:0;visibility:hidden;transform:translateY(var(--ds-motion-rise,0));transition:opacity var(--duration-fast) var(--ease-standard), visibility 0s linear var(--duration-fast)}.ds-motion-popup[data-state=open]{opacity:1;visibility:visible;transition:opacity var(--duration-fast) var(--ease-soft), visibility 0s;transform:none}.ds-motion-popup[data-state=closing],.ds-motion-popup[data-reduced]{transform:none}@media (prefers-reduced-motion:no-preference){.ds-motion-popup[data-state=open]:not([data-reduced]){transition:opacity var(--duration-base) var(--ease-soft), transform var(--duration-base) var(--ease-soft), visibility 0s}}@media (prefers-reduced-motion:reduce){.ds-motion-popup[data-state]{transform:none}}.ds-motion-race{justify-items:start;gap:var(--space-6);inline-size:100%;color:var(--text);display:grid;container-type:inline-size}.ds-motion-lanes{gap:var(--space-4);margin:0;padding:0;list-style:none;display:grid}.ds-motion-lane{gap:var(--space-2);display:grid}.ds-motion-lane-label{align-items:baseline;gap:var(--space-3);color:var(--text-muted);display:flex}.ds-motion-track{inline-size:calc(var(--ds-motion-travel) + 40px);block-size:40px;max-inline-size:100%;display:block}.ds-motion-square{border-radius:var(--radius-sm);background:var(--brand-true);block-size:40px;inline-size:40px;display:block}.ds-motion-race[data-moved] .ds-motion-square{transform:translateX(var(--ds-motion-travel))}@container (min-width:400px){.ds-motion-lane{align-items:center;column-gap:var(--space-4);grid-template-columns:11rem auto}}@media (prefers-reduced-motion:no-preference){.ds-motion-square{transition:transform var(--ds-motion-duration) var(--ease-standard)}}@media (forced-colors:active){.ds-motion-square{background:canvastext}}.ds-motion-curves{justify-items:start;gap:var(--space-6);color:var(--text);display:grid}.ds-motion-graphs{gap:var(--space-10) var(--space-12);flex-wrap:wrap;display:flex}.ds-motion-graph{padding:var(--space-2) var(--space-2) 0;margin:0}.ds-motion-plot{inline-size:var(--ds-motion-plot);block-size:var(--ds-motion-plot);position:relative}.ds-motion-plot svg{display:block;overflow:visible}.ds-motion-axes{fill:none;stroke:var(--border-rule);stroke-width:1px}.ds-motion-curve{fill:none;stroke:var(--text);stroke-width:1.75px;stroke-linecap:round}.ds-motion-across,.ds-motion-mover{block-size:0;inline-size:0;position:absolute;inset-block-end:0;inset-inline-start:0}.ds-motion-up{position:absolute;inset:0}.ds-motion-dot{border-radius:var(--radius-full);background:var(--brand-true);block-size:12px;inline-size:12px;position:absolute;inset-block-start:-6px;inset-inline-start:-6px}.ds-motion-line{inline-size:var(--ds-motion-plot);block-size:1px;background:var(--border-rule);margin-block-start:var(--space-8);position:relative}.ds-motion-mover{inset-block:0 auto}.ds-motion-curves[data-phase=play] .ds-motion-across,.ds-motion-curves[data-phase=play] .ds-motion-mover{transform:translateX(var(--ds-motion-plot))}.ds-motion-curves[data-phase=play] .ds-motion-up{transform:translateY(calc(var(--ds-motion-plot) * -1))}.ds-motion-graph-caption{flex-direction:column;margin-block-start:var(--space-6);display:flex}@media (prefers-reduced-motion:no-preference){.ds-motion-curves[data-phase=play] .ds-motion-across{transition:transform var(--ds-motion-duration) linear}.ds-motion-curves[data-phase=play] .ds-motion-up,.ds-motion-curves[data-phase=play] .ds-motion-mover{transition:transform var(--ds-motion-duration) var(--ds-motion-ease)}}@media (forced-colors:active){.ds-motion-dot{background:canvastext}}.ds-motion-anchor{min-block-size:calc(44px + var(--space-1) + 4 * 36px + 2 * var(--space-1));position:relative}.ds-motion-anchor>.ds-motion-popup{z-index:var(--layer-popover);position:absolute;inset-block-start:calc(44px + var(--space-1));inset-inline-start:0}.ds-motion-stagger{justify-items:start;gap:var(--space-4);display:grid}.ds-motion-rows{align-content:start;gap:var(--space-1);inline-size:200px;max-inline-size:100%;min-block-size:calc(var(--ds-motion-rows) * 36px + (var(--ds-motion-rows) - 1) * var(--space-1));margin:0;padding:0;list-style:none;display:grid}.ds-motion-row{min-block-size:36px;padding-inline:var(--space-3);border-radius:var(--radius-lg);background:var(--surface-control);color:var(--text);animation:ds-motion-fade var(--duration-fast) var(--ease-standard) both;align-items:center;display:flex}@media (prefers-reduced-motion:no-preference){.ds-motion-row{animation:ds-motion-rise var(--ds-motion-item) var(--ease-soft) var(--ds-motion-start) both}}@keyframes ds-motion-fade{0%{opacity:0}}@keyframes ds-motion-rise{0%{opacity:0;transform:translateY(var(--ds-motion-rise))}}.ds-motion-reduced{gap:var(--space-8);inline-size:100%;color:var(--text);display:grid;container-type:inline-size}.ds-motion-controls{align-items:center;gap:var(--space-4) var(--space-8);flex-wrap:wrap;display:flex}.ds-motion-sides{gap:var(--space-8) var(--gutter);grid-template-columns:minmax(0,1fr);display:grid}.ds-motion-side{margin:0}.ds-motion-side>figcaption{color:var(--text-muted);margin-block-start:var(--space-3)}.ds-motion-stage{min-block-size:calc(4 * 36px + 2 * var(--space-1) + var(--space-4));padding-block-start:var(--space-2)}@container (min-width:440px){.ds-motion-sides{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (pointer:coarse){.ds-motion-anchor{min-block-size:calc(44px + var(--space-1) + 4 * 44px + 2 * var(--space-1))}.ds-motion-stage{min-block-size:calc(4 * 44px + 2 * var(--space-1) + var(--space-4))}}