@layer components{.sb{--tx:1.375rem;--g:3.25rem;--ny:1.85rem}.sb-origin{align-items:center;gap:.9rem;min-height:2.75rem;padding-bottom:1.4rem;display:flex;position:relative}.sb-origin-mark{border:1px solid var(--color-line-strong);border-radius:var(--radius-xs);background:var(--color-void);flex:none;align-self:flex-start;place-items:center;width:2.75rem;height:2.75rem;display:grid}.sb-origin-name{font-family:var(--font-display);letter-spacing:-.015em;color:var(--color-fg);font-size:1.15rem;line-height:1.2;display:block}.sb-origin-sub{font:500 var(--text-micro) / 1.3 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-fg-dim);margin-top:.2rem;display:block}.sb-origin:after{content:"";left:var(--tx);background:var(--color-line-strong);width:1px;transition:background-color var(--dur-base) ease;position:absolute;top:2.75rem;bottom:0}.sb-row{padding-left:var(--g);position:relative}.sb-rail{width:var(--g);pointer-events:none;position:absolute;inset:0 auto 0 0}.sb-trunk,.sb-trunk-b{left:var(--tx);background:var(--color-line-strong);width:1px;transition:background-color var(--dur-base) ease;position:absolute}.sb-trunk{height:var(--ny);top:0}.sb-trunk-b{top:var(--ny);bottom:0}.sb-row:last-child .sb-trunk-b{display:none}.sb-link{left:var(--tx);top:var(--ny);width:calc(var(--g) - var(--tx));border-top:1px dashed var(--color-line-strong);position:absolute}.sb-link:after{content:"";background:var(--color-signal);transform-origin:0;height:1px;transition:transform var(--dur-base) var(--ease-out-quart);position:absolute;inset:-1px 0 auto;transform:scaleX(0)}[data-wired] .sb-rail,[data-wired] .sb-origin:after{visibility:hidden}.sb-choice{border-bottom:1px solid var(--color-line);border-radius:var(--radius-xs);transition:background-color var(--dur-fast) ease;padding:1rem 1rem 1.1rem 1.35rem;display:block;position:relative}.sb-row:first-child .sb-choice{border-top:1px solid var(--color-line)}.sb-choice:focus-visible{outline-offset:-2px}.sb-port{left:-5px;top:var(--ny);border:1.5px solid var(--color-fg-dim);background:var(--color-void);width:10px;height:10px;transition:background-color var(--dur-fast) ease, border-color var(--dur-fast) ease, box-shadow var(--dur-base) var(--ease-out-quart), transform var(--dur-fast) var(--ease-spring);margin-top:-5px;position:absolute}.sb-head{justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.sb-label{font-family:var(--font-display);letter-spacing:-.02em;color:var(--color-fg);font-size:1.3rem;font-weight:500;line-height:1.7rem}.sb-proto{font:500 .625rem/1 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--color-fg-dim);transition:color var(--dur-fast) ease;flex:none}.sb-handle{font:400 .8125rem/1.45 var(--font-mono);color:var(--color-fg-muted);overflow-wrap:anywhere;margin-top:.1rem;display:block}.sb-next{color:var(--color-fg-dim);transition:color var(--dur-fast) ease;margin-top:.4rem;font-size:.9rem;line-height:1.5;display:block}.sb-row:is(:hover,:focus-within,[data-near]) .sb-choice{background:color-mix(in srgb, var(--color-fg) 4%, transparent)}body:has(#message form:focus-within) .sb-row[data-channel=form] .sb-choice{background:color-mix(in srgb, var(--color-fg) 4%, transparent)}.sb-row:is(:hover,:focus-within,[data-near]) .sb-port{background:var(--color-accent);border-color:var(--color-accent);box-shadow:0 0 0 5px color-mix(in srgb, var(--color-accent) 22%, transparent);transform:scale(1.15)}body:has(#message form:focus-within) .sb-row[data-channel=form] .sb-port{background:var(--color-accent);border-color:var(--color-accent);box-shadow:0 0 0 5px color-mix(in srgb, var(--color-accent) 22%, transparent);transform:scale(1.15)}.sb-row:is(:hover,:focus-within,[data-near]) :is(.sb-proto,.sb-next){color:var(--color-fg-muted)}body:has(#message form:focus-within) .sb-row[data-channel=form] :is(.sb-proto,.sb-next){color:var(--color-fg-muted)}.sb-row:is(:hover,:focus-within) .sb-link:after{transform:none}body:has(#message form:focus-within) .sb-row[data-channel=form] .sb-link:after{transform:none}.sb-row:is(:hover,:focus-within) .sb-trunk{background:var(--color-signal)}.sb:has(.sb-row:is(:hover,:focus-within)) .sb-origin:after{background:var(--color-signal)}.sb-row:has(~.sb-row:is(:hover,:focus-within)) :is(.sb-trunk,.sb-trunk-b){background:var(--color-signal)}body:has(#message form:focus-within) .sb:has(.sb-row[data-channel=form]) .sb-origin:after{background:var(--color-signal)}body:has(#message form:focus-within) .sb-row[data-channel=form] .sb-trunk{background:var(--color-signal)}html:not([data-motion=reduced]) .sb-origin{animation:enter-up var(--dur-enter) var(--ease-out-quart) both;animation-delay:80ms}html:not([data-motion=reduced]) .sb-row{animation:enter-up var(--dur-enter) var(--ease-out-quart) both;animation-delay:calc(var(--i,0) * .11s + .36s)}@media (min-width:768px){.sb{--g:3.75rem;--ny:1.95rem}.sb-label{font-size:1.45rem;line-height:1.9rem}}html[data-motion=reduced] .sb :is(.sb-port,.sb-trunk,.sb-trunk-b,.sb-choice),html[data-motion=reduced] .sb .sb-link:after,html[data-motion=reduced] .sb .sb-origin:after{transition:none}}