[data-tone=dark]{--spectrum-scale-strong:var(--color-on-dark);--spectrum-scale-muted:var(--color-on-dark-muted)}figure.spectrum-scale{max-inline-size:var(--measure-prose);margin:0}figure.spectrum-scale>ul.scales{gap:var(--space-5);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}figure.spectrum-scale>ul.scales>li.scale{gap:var(--space-2);flex-direction:column;display:flex}figure.spectrum-scale>ul.scales>li.scale>p.ends{gap:var(--space-1) var(--space-3);color:var(--spectrum-scale-muted);font-family:var(--font-body);font-size:var(--text-caps);font-weight:var(--weight-chrome);line-height:var(--text-caps-leading);letter-spacing:var(--text-caps-tracking);text-transform:uppercase;flex-wrap:wrap;justify-content:space-between;display:flex}figure.spectrum-scale>ul.scales>li.scale>p.ends>span.end{overflow-wrap:anywhere;min-width:0}figure.spectrum-scale>ul.scales>li.scale>p.ends>span.end:last-child{text-align:end}figure.spectrum-scale>ul.scales>li.scale>span.track{block-size:var(--space-4);display:block;position:relative;container-type:inline-size}figure.spectrum-scale>ul.scales>li.scale>span.track>span.line{block-size:var(--line-width);background-color:var(--edge-control);position:absolute;inset-block-start:calc(50% - var(--line-width) / 2);inset-inline:0}figure.spectrum-scale>ul.scales>li.scale>span.track>span.marker{inline-size:var(--space-4);block-size:var(--space-4);border-radius:var(--radius-pill);background-color:var(--mark-emphasis);translate:calc(var(--at) * (100cqi - var(--space-4))) 0;position:absolute;inset-block-start:0;inset-inline-start:0}figure.spectrum-scale>ul.scales>li.scale>p.position{color:var(--spectrum-scale-strong);font-size:var(--text-small);font-weight:var(--weight-emphasis);line-height:var(--text-small-leading)}@media (prefers-reduced-motion:no-preference){figure.spectrum-scale>ul.scales>li.scale[data-play-once=waiting]>span.track>span.marker{translate:calc(.5 * (100cqi - var(--space-4))) 0}figure.spectrum-scale>ul.scales>li.scale[data-play-once=played]>span.track>span.marker{animation-name:spectrum-settle;animation-duration:var(--dur-800);animation-timing-function:var(--ease)}}@keyframes spectrum-settle{0%{translate:calc(.5 * (100cqi - var(--space-4))) 0}}