.flow{color:var(--ink);margin-block:1.5rem;container-type:inline-size}.flow .sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:.0625rem;height:.0625rem;margin:-.0625rem;padding:0;position:absolute;overflow:hidden}.flow__tabs{flex-wrap:wrap;gap:.4rem;margin:0 0 .75rem;display:flex}.flow__tabs[hidden]{display:none}.flow__tabs button{border:.0625rem solid var(--line);background:var(--paper);min-height:2.75rem;color:var(--ink);font:inherit;cursor:pointer;border-radius:.5rem;padding:.35rem .8rem;font-size:.9rem}.flow__tabs button[aria-selected=true]{border:.125rem solid var(--semantic-data,var(--chapter-accent));background:color-mix(in oklch, var(--semantic-data,var(--chapter-accent)) 10%, var(--paper));font-weight:700}.flow__panel{background:var(--paper);border:.0625rem solid var(--line);border-radius:.75rem;margin:0 0 1.25rem;padding:1rem}.flow__panel[hidden]{display:none}.flow__panel>figcaption{gap:.25rem;margin-bottom:.75rem;display:grid}.flow__panel>figcaption strong{font-size:1.05rem}.flow__panel>figcaption span{color:var(--ink-soft);font-size:.9rem}.flow__lanes,.flow__step{grid-template-columns:minmax(11rem,42%) minmax(0,1fr);column-gap:1rem;display:grid}.flow__lane-names,.flow__track{grid-template-columns:repeat(var(--lanes), minmax(0, 1fr));display:grid}.flow__lanes{top:var(--sl-nav-height,3.5rem);z-index:3;background:var(--paper);border-bottom:.0625rem solid var(--line);position:sticky}.flow__lane-names{column-gap:.3rem;padding-block:.35rem}.flow__lane{border:.125rem solid var(--hue,var(--line));background:color-mix(in oklch, var(--hue,var(--line)) 14%, var(--paper));text-align:center;overflow-wrap:anywhere;border-radius:.5rem;align-content:center;justify-items:center;gap:.15rem;min-width:0;padding:.3rem .2rem;font-size:.78rem;font-weight:700;line-height:1.2;display:grid}.flow__icon{fill:none;width:1.25rem;height:1.25rem;stroke:var(--hue,var(--ink));stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.flow__steps{margin:0;padding:0;list-style:none}.flow__step{--flow-color:var(--hue,var(--semantic-data,var(--chapter-accent)));margin:0;transition:opacity .15s}.flow__track{background-image:repeating-linear-gradient(to right, transparent 0, transparent calc(50% / var(--lanes) - .0625rem), var(--line) calc(50% / var(--lanes) - .0625rem), var(--line) calc(50% / var(--lanes) + .0625rem), transparent calc(50% / var(--lanes) + .0625rem), transparent calc(100% / var(--lanes)));align-content:center;min-height:3.25rem;padding-block:.6rem}.flow__arrow{grid-column:var(--start) / var(--end);height:.1875rem;margin-inline:calc(50% / var(--span));background:var(--flow-color);grid-row:1;align-self:center;position:relative}.flow__arrow:after{border-top:.125rem solid var(--flow-color);border-right:.125rem solid var(--flow-color);content:"";width:.6rem;height:.6rem;position:absolute;top:50%}.flow__arrow[data-direction=right]:after{right:-.05rem;transform:translateY(-50%)rotate(45deg)}.flow__arrow[data-direction=left]:after{left:-.05rem;transform:translateY(-50%)rotate(-135deg)}.flow__track b{z-index:1;border:.125rem solid var(--flow-color);background:var(--paper);width:1.45rem;height:1.45rem;color:var(--ink);border-radius:50%;place-items:center;font-size:.72rem;line-height:1;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.flow__self{grid-column:var(--start) / var(--end);border:.125rem dashed var(--flow-color);background:var(--paper);border-radius:.5rem;grid-row:1;place-self:center;width:2.25rem;height:1.6rem;position:relative}.flow__self b{position:absolute}.flow__arrow i{background:var(--flow-color);border-radius:50%;width:.8rem;height:.8rem;display:none;position:absolute;top:50%;left:0;transform:translate(-50%,-50%)}.flow__step[data-state=active] .flow__arrow i{display:block}.flow__text{border-top:.0625rem solid var(--line);min-width:0;padding:.55rem .6rem .6rem}.flow__text p{margin:0}.flow__label{overflow-wrap:anywhere;flex-wrap:wrap;align-items:baseline;gap:.15rem .5rem;font-size:.95rem;display:flex}.flow__kind{border:.0625rem solid var(--flow-color);color:var(--ink);white-space:nowrap;border-radius:.25rem;padding:.05rem .4rem;font-size:.75rem}.flow__route{color:var(--ink-soft);margin-top:.1rem;font-size:.8rem}.flow__caption{margin-top:.3rem;font-size:.88rem;line-height:1.45}.flow__step[data-state=todo]{opacity:.42}.flow__step[data-state=active] .flow__text{background:color-mix(in oklch, var(--flow-color) 8%, var(--paper));box-shadow:inset .2rem 0 var(--flow-color)}.flow__controls{flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.85rem;display:flex}.flow__controls[hidden]{display:none}.flow__controls button{border:.0625rem solid var(--line);background:var(--paper);min-height:2.75rem;color:var(--ink);font:inherit;cursor:pointer;border-radius:.5rem;padding:.35rem .8rem;font-size:.9rem}.flow__controls button:disabled{opacity:.55;cursor:default}.flow__counter{color:var(--ink-soft);font-variant-numeric:tabular-nums;margin-left:.25rem;font-size:.85rem}.flow__note{color:var(--ink-soft);margin:.5rem 0 0;font-size:.8rem}.flow button:focus-visible{outline:.15rem solid var(--semantic-data,var(--chapter-accent));outline-offset:.15rem}html[data-academy-semantic=off] .flow__step{--flow-color:var(--ink)}html[data-academy-semantic=off] .flow__tabs button[aria-selected=true]{border-color:var(--ink);background:var(--paper)}@container (width<=34rem){.flow__lanes,.flow__step{grid-template-columns:minmax(0,1fr)}.flow__panel{padding:.75rem}.flow__text{border-top:0;padding-top:0}}@media (width<=34rem){.flow__panel{padding:.75rem}}@media print{.flow__panel[hidden]{display:block!important}.flow__tabs,.flow__controls,.flow__note{display:none!important}.flow__step{break-inside:avoid;opacity:1!important}.flow__step[data-state=active] .flow__text{box-shadow:none;background:0 0}.flow__arrow i{display:none!important}}@media (prefers-reduced-motion:reduce){.flow__step{transition:none}}.flow__panel>figcaption strong,.flow__label strong{text-wrap:balance}.flow__caption,.flow__panel>figcaption span{text-wrap:pretty}