.bp{--bp-ground:#07111d;--bp-ink:#e2f2ff;--bp-ink-2:#e2f2ffb8;--bp-line:var(--cyan);--bp-dim:#74c8ff8c;border-radius:var(--radius-lg);color:var(--bp-ink);background-color:var(--bp-ground);background-image:linear-gradient(#74c8ff1a 1px,#0000 1px),linear-gradient(90deg,#74c8ff1a 1px,#0000 1px),linear-gradient(#74c8ff0b 1px,#0000 1px),linear-gradient(90deg,#74c8ff0b 1px,#0000 1px);background-position:-1px -1px;background-size:96px 96px,96px 96px,12px 12px,12px 12px;border:1px solid #74c8ff4d;margin:0;padding:clamp(20px,3.2vw,36px);position:relative;overflow:hidden}.bp-title{border-top:1px solid var(--bp-dim);font:.72rem/1.4 var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--bp-ink-2);flex-wrap:wrap;justify-content:space-between;gap:6px 18px;margin-top:clamp(20px,3vw,28px);padding-top:12px;display:flex}.bp-title b{color:var(--bp-ink);font-weight:600}.bp-title code{text-transform:none;letter-spacing:0;color:inherit;font-size:inherit;background:0 0;border:0;padding:0}.bp-flow{align-items:stretch;gap:0;display:grid}.bp-zone{border:1.25px dashed var(--bp-dim);border-radius:12px;align-content:start;gap:12px;padding:22px 16px 16px;display:grid;position:relative}.bp-zone-label{background:var(--bp-ground);font:600 .72rem/1.2 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--bp-line);padding:0 6px;position:absolute;top:-.7em;left:12px}.bp-node{border:1.5px solid var(--bp-line);background:#07111de6;border-radius:8px;padding:12px 14px}.bp-node h3,.bp-node h4{font:600 .98rem/1.3 var(--font-display);letter-spacing:0;color:var(--bp-ink);margin:0 0 4px}.bp-node p{color:var(--bp-ink-2);margin:0;font-size:.86rem;line-height:1.45}.bp-node code{color:var(--bp-ink);background:0 0;border:0;padding:0;font-size:.82rem}.bp-node ul{color:var(--bp-ink-2);margin:0;padding-left:1.05em;font-size:.88rem;line-height:1.5}.bp-node.is-quiet{border-style:dashed;border-width:1.25px}.bp-links{align-content:center;gap:6px;padding:8px 0;display:grid}.bp-link{place-items:center;min-width:120px;min-height:58px;display:grid;position:relative}.bp-link-line{border-top:1.5px solid var(--bp-line);height:0;position:absolute;top:50%;left:8px;right:8px}.bp-link.is-dashed .bp-link-line{border-top-style:dashed}.bp-link-line:after{content:"";border-top:1.5px solid var(--bp-line);border-right:1.5px solid var(--bp-line);width:9px;height:9px;position:absolute;top:-5.25px;right:0;transform:rotate(45deg)}.bp-link[data-dir=left] .bp-link-line:after{left:0;right:auto;transform:rotate(-135deg)}.bp-link-label{background:var(--bp-ground);max-width:17ch;font:.7rem/1.3 var(--font-mono);text-align:center;color:var(--bp-line);padding:1px 6px;position:relative;transform:translateY(-15px)}.bp-link-label code{font-size:inherit;color:var(--bp-ink);background:0 0;border:0;padding:0}.bp-link-line:before{content:"";background:var(--amber);border-radius:2px;width:18px;height:3px;position:absolute;top:-2px;left:calc(50% - 9px)}.bp-link[data-dir=left] .bp-link-line:before{left:calc(50% - 9px)}.bp.is-live .bp-link-line:before{animation:bp-run-x 2.6s var(--ease) infinite;animation-delay:var(--d,0s)}.bp.is-live .bp-link[data-dir=left] .bp-link-line:before{animation-name:bp-run-x-back}@keyframes bp-run-x{0%{opacity:0;left:0}12%{opacity:1}88%{opacity:1}to{opacity:0;left:calc(100% - 18px)}}@keyframes bp-run-x-back{0%{opacity:0;left:calc(100% - 18px)}12%{opacity:1}88%{opacity:1}to{opacity:0;left:0}}@media (width<=899px){.bp-flow{grid-template-columns:1fr!important}.bp-links{grid-auto-flow:column;justify-content:center;gap:4px;padding:4px 0}.bp-link{width:112px;min-width:0;min-height:104px}.bp-link-line{border-top:0;border-left:1.5px solid var(--bp-line);width:0;height:auto;inset:10px auto 10px 50%}.bp-link.is-dashed .bp-link-line{border-left-style:dashed}.bp-link-line:after{inset:auto auto 0 -5.25px;transform:rotate(135deg)}.bp-link[data-dir=left] .bp-link-line:after{top:0;bottom:auto;left:-5.25px;transform:rotate(-45deg)}.bp-link-label{max-width:12ch;font-size:.68rem;transform:none}.bp-link-line:before,.bp-link[data-dir=left] .bp-link-line:before{width:3px;height:18px;top:calc(50% - 9px);left:-2px}.bp.is-live .bp-link-line:before{animation-name:bp-run-y}.bp.is-live .bp-link[data-dir=left] .bp-link-line:before{animation-name:bp-run-y-back}}@keyframes bp-run-y{0%{opacity:0;top:0}12%{opacity:1}88%{opacity:1}to{opacity:0;top:calc(100% - 18px)}}@keyframes bp-run-y-back{0%{opacity:0;top:calc(100% - 18px)}12%{opacity:1}88%{opacity:1}to{opacity:0;top:0}}