cs-steps{display:block}.cs-steps-controls{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.cs-steps-controls input[type=range]{--range-progress:0%;-webkit-appearance:none;appearance:none;cursor:pointer;background:0 0;border:none;flex:1;min-width:0;height:1.25rem;margin:0;padding:0}.cs-steps-controls input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--c-accent) 0 var(--range-progress), color-mix(in oklch, var(--c-muted) 28%, transparent) var(--range-progress) 100%);border:none;border-radius:999px;height:.35rem}.cs-steps-controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--c-accent);border:none;border-radius:50%;width:1.25rem;height:1.25rem;margin-top:-.45rem;box-shadow:0 2px 8px oklch(35% .12 260/.2)}.cs-steps-controls input[type=range]::-moz-range-track{background:color-mix(in oklch, var(--c-muted) 28%, transparent);border:none;border-radius:999px;height:.35rem}.cs-steps-controls input[type=range]::-moz-range-progress{background:var(--c-accent);border:none;border-radius:999px;height:.35rem}.cs-steps-controls input[type=range]::-moz-range-thumb{background:var(--c-accent);border:none;border-radius:50%;width:1.25rem;height:1.25rem;box-shadow:0 2px 8px oklch(35% .12 260/.2)}.dark .cs-steps-controls input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--c-accent) 0 var(--range-progress), color-mix(in oklch, var(--c-dark-muted) 28%, transparent) var(--range-progress) 100%)}.dark .cs-steps-controls input[type=range]::-moz-range-track{background:color-mix(in oklch, var(--c-dark-muted) 28%, transparent)}.cs-steps-count{font-variant-numeric:tabular-nums;color:var(--c-muted);flex-shrink:0;font-size:.8125rem}.dark .cs-steps-count{color:var(--c-dark-muted)}cs-steps .cs-steps-stack{border-radius:var(--w-radius-l);corner-shape:squircle;background:color-mix(in oklch, var(--c-accent) 6%, var(--c-bg));padding:1rem 1.1rem;overflow:hidden}.dark cs-steps .cs-steps-stack{background:color-mix(in oklch, var(--c-accent) 8%, var(--c-dark-bg))}article.project-body cs-steps .cs-steps-stack pre{background:0 0;border-radius:0;padding:0}cs-steps .cs-steps-stack>*{opacity:0;transition:opacity var(--dur-fast) ease-out, visibility 0s var(--dur-fast)}cs-steps .cs-steps-stack>[data-active]{opacity:1;transition:opacity var(--dur-fast) ease-out, visibility 0s;animation:none}cs-steps .cs-steps-stack>[data-active] :is(del,ins){animation:cs-steps-mark .42s var(--ease-out-sharp) 80ms both}@keyframes cs-steps-mark{0%{background-color:#0000;text-decoration-color:#0000}}.cs-steps-track{flex:1;align-items:center;min-width:0;display:grid;position:relative}.cs-steps-track>*{grid-area:1/1}.cs-steps-ticks{--thumb:1.25rem;background:linear-gradient(to right, var(--c-accent) 0 calc(var(--thumb) / 2 + var(--f,0) * (100% - var(--thumb))), color-mix(in oklch, var(--c-muted) 28%, transparent) 0);pointer-events:none;border-radius:999px;height:.35rem;position:relative}.dark .cs-steps-ticks{background:linear-gradient(to right, var(--c-accent) 0 calc(var(--thumb) / 2 + var(--f,0) * (100% - var(--thumb))), color-mix(in oklch, var(--c-dark-muted) 28%, transparent) 0)}.cs-steps-controls input[type=range]{z-index:2;position:relative}.cs-steps-controls input[type=range]::-webkit-slider-thumb{transition:transform var(--dur-fast) var(--ease-out-back), box-shadow var(--dur-fast) ease-out}.cs-steps-controls input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.1)}.cs-steps-controls input[type=range]:active::-webkit-slider-thumb{box-shadow:0 0 0 .4rem color-mix(in oklch, var(--c-accent) 18%, transparent), 0 2px 8px oklch(35% .12 260/.2);transform:scale(1.2)}.cs-steps-controls input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 .25rem color-mix(in oklch, var(--c-accent) 35%, transparent)}.cs-steps-controls input[type=range]::-moz-range-thumb{transition:transform var(--dur-fast) var(--ease-out-back)}.cs-steps-controls input[type=range]:active::-moz-range-thumb{transform:scale(1.2)}.cs-steps-count{text-align:right;min-width:2.5rem}@media (prefers-reduced-motion:reduce){cs-steps .cs-steps-stack>*,cs-steps .cs-steps-stack>[data-active] :is(del,ins){transition:none;animation:none}}cs-steps .cs-steps-controls input[type=range]::-webkit-slider-runnable-track{background:0 0}cs-steps .cs-steps-controls input[type=range]::-moz-range-track,cs-steps .cs-steps-controls input[type=range]::-moz-range-progress{background:0 0}
