.live-head{justify-content:space-between;align-items:center;gap:var(--sp-16);min-block-size:var(--control-h-sm);display:flex}.live-title{font:var(--weight-display) var(--text-md) / var(--leading-snug) var(--font-display)}.live-toggle{visibility:hidden}[data-live] .live-toggle,[data-flow] .live-toggle{visibility:visible}[data-live=static] .live-toggle{display:none}.build{gap:var(--sp-16);padding:var(--sp-24);background:var(--surface-tint);border:var(--bw) solid var(--border);margin-block-end:var(--sp-48);display:grid}.build-grid{gap:var(--sp-24);grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:stretch;display:grid}.build-side{gap:var(--sp-24);align-content:start;display:grid}.build-plan{gap:var(--sp-4);min-block-size:calc(var(--text-md) * 4.2);display:grid}.build-plan-name{font:var(--weight-display) var(--text-md) / var(--leading-snug) var(--font-display)}.build-plan-meta{color:var(--ink-muted);font-size:var(--text-ui)}.build-plan-price{font-size:var(--text-md)}.build-steps{gap:var(--sp-8);grid-template-columns:repeat(4,minmax(0,1fr));margin:0;padding:0;list-style:none;display:grid}.build-step{gap:var(--sp-8);font:var(--weight-strong) var(--text-xs) / var(--leading-label) var(--font-label);color:var(--ink-faint);display:grid}.build-bar{block-size:var(--sp-4);background:var(--border);display:block;position:relative;overflow:hidden}.build-bar:after{content:"";background:var(--accent);transform-origin:0;transition:transform var(--dur-large) var(--ease-linear);position:absolute;inset:0;transform:scaleX(0)}[dir=rtl] .build-bar:after{transform-origin:100%}.build-step[data-state=active]{color:var(--accent-ink)}.build-step[data-state=active] .build-bar:after{transform:scaleX(.5)}.build-step[data-state=done]{color:var(--ink)}.build-step[data-state=done] .build-bar:after{background:var(--success);transform:scaleX(1)}.build-ip{align-items:baseline;gap:var(--sp-8);font-size:var(--text-ui);flex-wrap:wrap;margin-block-start:var(--sp-16);display:flex}.build-ip-label{color:var(--ink-muted)}.build-ip-value{font-family:var(--font-mono);font-size:var(--text-md);font-weight:var(--weight-strong);color:var(--accent-ink)}.build-ip-note{color:var(--ink-faint);font-size:var(--text-xs)}.term{background:var(--band-bg);color:var(--band-ink);border:var(--bw) solid var(--band-line);font:var(--weight-regular) var(--text-ui) / var(--leading-code) var(--font-mono);min-inline-size:0}.term-bar{gap:var(--sp-8);padding:var(--sp-12) var(--sp-16);border-block-end:var(--bw) solid var(--band-line);display:flex}.term-dot{inline-size:var(--sp-8);block-size:var(--sp-8);border-radius:var(--r-full);background:var(--band-line)}.term-body{padding:var(--sp-16);block-size:calc(var(--text-ui) * var(--leading-code) * 5 + var(--sp-32));overflow:hidden}.t-line{white-space:pre-wrap;overflow-wrap:anywhere;min-block-size:1lh;display:block}.t-prompt{color:var(--band-accent)}[data-line=out]{color:var(--band-muted)}.caret{inline-size:var(--caret-w);vertical-align:text-bottom;background:var(--band-accent);block-size:1.1em;animation:live-blink var(--dur-blink) steps(1) var(--blink-count);display:inline-block}@keyframes live-blink{50%{opacity:0}}.flow-pair{gap:var(--sp-32);grid-template-columns:repeat(2,minmax(0,1fr));inline-size:100%;display:grid}.flow-scene{font:var(--weight-strong) var(--text-xs) / var(--leading-label) var(--font-label);letter-spacing:var(--tracking-eyebrow);color:var(--accent-ink)}.flow{gap:var(--sp-12);inline-size:100%;margin-block-start:var(--sp-16);display:grid}.flow-track{grid-template-columns:auto minmax(var(--sp-48), 1fr) auto minmax(var(--sp-48), 1fr) auto;align-items:center;gap:var(--sp-4);display:grid}.flow-node{align-content:center;justify-items:center;gap:var(--sp-4);text-align:center;min-inline-size:calc(var(--sp-64) + var(--sp-12));min-block-size:calc(var(--sp-96) + var(--sp-12));padding:var(--sp-12);background:var(--surface);border:var(--bw) solid var(--border-strong);display:grid}.flow-node.is-edge{border-color:var(--accent);background:var(--accent-soft)}.flow-icon{inline-size:var(--sp-24);block-size:var(--sp-24);color:var(--accent-ink)}.flow-name{font:var(--weight-display) var(--text-ui) / var(--leading-snug) var(--font-display)}.flow-sub{color:var(--ink-muted);font-size:var(--text-xs);max-inline-size:16ch}.flow-link{block-size:var(--sp-24);position:relative;container-type:inline-size}.flow-line{inline-size:100%;block-size:var(--sp-8);transform:translateY(-50%) scaleX(var(--inline-sign));position:absolute;inset-block-start:50%;inset-inline:0}.flow-line path{fill:none;stroke:var(--border-dash);stroke-width:var(--ring-width);stroke-dasharray:var(--sp-8) var(--sp-8);animation:flow-dash var(--dur-pulse) var(--ease-linear) infinite}@keyframes flow-dash{to{stroke-dashoffset:calc(var(--sp-16) * -1)}}.packet{inline-size:var(--sp-8);block-size:var(--sp-8);border-radius:var(--r-full);opacity:0;animation:packet-ok calc(var(--dur-pulse) * 2) var(--ease-in-out) calc(var(--i) * var(--dur-pulse) / -2) infinite;margin-block-start:calc(var(--sp-8) / -2);position:absolute;inset-block-start:50%;inset-inline-start:0}.packet.is-ok{background:var(--accent)}.packet.is-bad{background:var(--danger);animation-name:packet-bad}.packet.is-bad.is-pass{animation-name:packet-ok}@keyframes packet-ok{0%{opacity:0;transform:translate(0)}10%,90%{opacity:1}to{opacity:0;transform:translateX(calc(var(--inline-sign) * (100cqw - var(--sp-8))))}}@keyframes packet-bad{0%{opacity:0;transform:translate(0)scale(1)}10%,80%{opacity:1}to{opacity:0;transform:translateX(calc(var(--inline-sign) * (100cqw - var(--sp-8)))) scale(2)}}.flow-legend{align-items:center;gap:var(--sp-16);color:var(--ink-muted);font:var(--weight-strong) var(--text-xs) / var(--leading-label) var(--font-label);flex-wrap:wrap;display:flex}.flow-key:before{content:"";inline-size:var(--sp-8);block-size:var(--sp-8);border-radius:var(--r-full);margin-inline-end:var(--sp-8);display:inline-block}.flow-key.is-ok:before{background:var(--accent)}.flow-key.is-bad:before{background:var(--danger)}.flow-legend .live-toggle{margin-inline-start:auto}[data-paused] .packet,[data-paused] .flow-line path{animation-play-state:paused}.cta-support .line-figure{inline-size:100%}.cta-support{gap:var(--sp-16);justify-items:start;inline-size:100%;max-inline-size:36rem;display:grid}.reply{align-items:center;gap:var(--sp-12);padding:var(--sp-12) var(--sp-16);background:var(--surface);border:var(--bw) solid var(--border-strong);color:var(--ink-muted);font-size:var(--text-ui);display:inline-flex}.reply-dots{gap:var(--sp-4);display:inline-flex}.reply-dots i{inline-size:var(--sp-8);block-size:var(--sp-8);border-radius:var(--r-full);background:var(--accent);animation:reply-dot calc(var(--dur-pulse) * 2 / 3) var(--ease-in-out) infinite;animation-delay:calc(var(--n,0) * var(--dur-pulse) / 6)}.reply-dots i:nth-child(2){--n:1}.reply-dots i:nth-child(3){--n:2}@keyframes reply-dot{0%,to{opacity:.35;transform:translateY(0)}40%{opacity:1;transform:translateY(calc(var(--sp-4) * -1))}}@media (width<=1023px){.flow-pair{grid-template-columns:minmax(0,1fr)}}@media (width<=767px){.build{padding:var(--sp-16)}.build-grid{grid-template-columns:minmax(0,1fr)}.flow-track{grid-template-columns:auto minmax(var(--sp-24), 1fr) auto minmax(var(--sp-24), 1fr) auto}.flow-node{min-inline-size:0;min-block-size:var(--sp-64);padding:var(--sp-8)}.flow-name{font-size:var(--text-xs)}.flow-icon,.flow-sub{display:none}}@media (prefers-reduced-motion:reduce){.packet{display:none}.flow-line path,.caret,.reply-dots i{animation:none}.build-bar:after{transition:none}.live-toggle{display:none}}