.stepper-grid{align-items:start}.stepper-figure{grid-column:1/span 6;min-width:0}.stepper-steps{grid-column:8/span 5;list-style:none}.stepper-source{font-size:var(--small-size);grid-column:8/span 5;margin-top:28px;line-height:1.5}@media (min-width:1100px){.stepper-figure{grid-row:span 2}}@media screen and (min-width:1100px){:where(:root[data-js]) .stepper-figure{top:calc(var(--header-h,76px) + 24px);position:sticky}}@media (max-width:1099px){.stepper-figure,.stepper-steps,.stepper-source{grid-column:1/-1}.stepper-figure{width:100%;max-width:calc(720px + 2*clamp(16px,1.6vw,24px))}.stepper-steps{max-width:46em;margin-top:40px}}@media (max-width:599px){.stepper-stage,.stepper-frame>.fig-drawing{margin-inline:calc(-1 * var(--box-pad))}}.stepper-head{justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:clamp(8px,1vw,12px);display:flex}.stepper-status{font-family:var(--font-mono);font-size:var(--mono-size);color:var(--ink);font-variant-numeric:tabular-nums;margin:0;line-height:1.5}.stepper-controls{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.stepper-figure .fig-legend{margin-top:16px}.stepper-btn{min-height:40px;font:500 .9375rem/1 var(--font-sans);letter-spacing:0;color:var(--ink);border:1px solid var(--control);border-radius:var(--radius-pill);cursor:pointer;transition:background-color .16s var(--ease-enter), color .16s var(--ease-enter), border-color .16s var(--ease-enter);background:0 0;align-items:center;gap:8px;padding:0 18px;display:inline-flex}.stepper-btn:hover{background:var(--surface)}.stepper-btn[aria-disabled=true]{color:var(--ink-muted);border-color:var(--hairline);cursor:default;background:0 0}.stepper-btn[hidden]{display:none}.stepper-icon{fill:currentColor;flex:none;width:16px;height:16px}.stepper-icon-line{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round}.stepper-play .stepper-icon>*{display:none}.stepper-play[data-state=play] .stepper-icon-play,.stepper-play[data-state=pause] .stepper-icon-pause,.stepper-play[data-state=replay] .stepper-icon-replay{display:inline}.stepper-step+.stepper-step{margin-top:24px}.stepper-label{letter-spacing:-.005em;padding-left:2.25rem;font-size:clamp(1.125rem,1rem + .35vw,1.3125rem);font-weight:500;line-height:1.3;position:relative}.stepper-num{font-family:var(--font-mono);font-size:var(--mono-size);color:var(--ink-muted);font-weight:400;line-height:1.5;position:absolute;top:.3em;left:0}.stepper-desc{max-width:calc(40ch + 2.25rem);margin-top:6px;padding-left:2.25rem}.stepper-jump{cursor:pointer;font:inherit;letter-spacing:inherit;color:inherit;text-align:left;background:0 0;border:0;margin:0;padding:0;display:inline}.stepper-jump:hover .stepper-label-text{text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent);text-underline-offset:.22em;text-decoration-thickness:1px}.stepper-frame{margin-bottom:16px}.stepper-stage [data-show]:not([data-on]){opacity:0}.stepper-stage [data-enter=pop]{transform-box:fill-box;transform-origin:50%}.stepper-stage[data-mode=animate] [data-show]{transition:color .4s var(--ease-enter)}.stepper-stage[data-mode=cut] [data-show]{transition:opacity .16s linear,color .16s linear}.stepper-stage[data-views]{clip-path:inset(-6px)}.stepper-stage[data-views]>svg{overflow:hidden}@media (prefers-reduced-motion:reduce){:root .stepper-stage [data-show]{transition-property:opacity!important;transition-duration:.15s!important;transition-timing-function:linear!important}}:root[data-motion=off] .stepper-stage [data-show]{transition-property:opacity!important;transition-duration:.15s!important;transition-timing-function:linear!important}:where(:root[data-js]) .stepper-frame{display:none}:where(:root[data-js]) .stepper:not([data-ready]) .stepper-stage [data-show]{opacity:0}:where(:root[data-js]) .stepper:not([data-ready]) .stepper-controls{visibility:hidden}:where(:root[data-js]) .stepper-step:not([data-current]){color:var(--ink-muted)}:where(:root[data-js]) .stepper-step[data-current] .stepper-num{color:var(--accent)}@media (max-width:599px){:where(:root[data-js]) .stepper-step+.stepper-step{margin-top:14px}:where(:root[data-js]) .stepper-step:not([data-current]) .stepper-desc{display:none}}:where(:root:not([data-js])) .stepper-stage,:where(:root:not([data-js])) .stepper-controls,:where(:root:not([data-js])) .stepper-status{display:none}:where(:root:not([data-js])) .stepper-box{background:0 0;padding:0}:where(:root:not([data-js])) .stepper-figure,:where(:root:not([data-js])) .stepper-steps,:where(:root:not([data-js])) .stepper-source{grid-area:auto/1/auto/-1;max-width:none}:where(:root:not([data-js])) .stepper-figure .fig-legend{margin-top:4px}:where(:root:not([data-js])) .stepper-steps{gap:48px var(--gutter);grid-template-columns:repeat(2,minmax(0,1fr));margin-top:24px;display:grid}:where(:root:not([data-js])) .stepper-step+.stepper-step{margin-top:0}:where(:root:not([data-js])) .stepper-source{margin-top:32px}@media (max-width:1099px){:where(:root:not([data-js])) .stepper-steps{grid-template-columns:minmax(0,1fr)}:where(:root:not([data-js])) .stepper:not(.flow) .stepper-frame{max-width:720px}}@media print{.stepper-stage,.stepper-controls,.stepper-status{display:none!important}.stepper-box{background:0 0;padding:0}.stepper-frame{display:block!important}.stepper-figure,.stepper-steps,.stepper-source{grid-area:auto/1/auto/-1;max-width:none}.stepper-figure{break-after:avoid}.stepper-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 32px;margin-top:16px;display:grid}.stepper-step{break-inside:avoid;color:var(--ink)!important}.stepper-step+.stepper-step{margin-top:0}.stepper-step .stepper-desc{display:block!important}.stepper-step .stepper-num{color:var(--ink-muted)!important}}
