.architecture-flow-root{--flow-accent:hsl(var(--brand-accent-1));--flow-accent-soft:hsl(var(--brand-accent-1) / .1);--flow-line:hsl(var(--brand-accent-1) / .34);color:hsl(var(--foreground));background:radial-gradient(circle at 50% 58%, var(--flow-accent-soft), transparent 45%), hsl(var(--background));isolation:isolate;contain:layout paint;flex-direction:column;padding:clamp(.9rem,3vw,1.7rem);animation:.28s ease-out both architecture-flow-in;display:flex;position:absolute;inset:0;overflow:hidden}.architecture-flow-root:before{z-index:-1;border:1px solid hsl(var(--border) / .22);content:"";pointer-events:none;border-radius:1rem;position:absolute;inset:.85rem}.architecture-flow-header{z-index:2;gap:.25rem;padding-inline:.15rem;display:grid;position:relative}.architecture-flow-eyebrow,.architecture-flow-column-label,.architecture-flow-quality-status{letter-spacing:.13em;text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.architecture-flow-eyebrow{color:var(--flow-accent);font-size:clamp(.48rem,1vw,.62rem);font-weight:700}.architecture-flow-title{letter-spacing:-.02em;font-size:clamp(.78rem,1.9vw,1.08rem);line-height:1.2}.architecture-flow-canvas{flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative}.architecture-flow-node{border:1px solid hsl(var(--border) / .68);min-width:clamp(3.15rem,7.5vw,5.4rem);color:hsl(var(--muted-foreground));background:hsl(var(--background) / .72);letter-spacing:.035em;text-transform:uppercase;white-space:nowrap;border-radius:.55rem;justify-content:center;align-items:center;gap:clamp(.22rem,.7vw,.4rem);padding:clamp(.34rem,.9vw,.55rem) clamp(.42rem,1vw,.68rem);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(.48rem,1.05vw,.66rem);font-weight:700;display:inline-flex}.architecture-flow-node-active{border-color:var(--flow-line);color:var(--flow-accent);background:hsl(var(--brand-accent-1) / .08)}.architecture-flow-node-icon{flex:none;width:clamp(.66rem,1.45vw,.9rem);height:clamp(.66rem,1.45vw,.9rem)}.architecture-flow-signal-line{--signal-distance:clamp(1.25rem, 6vw, 4rem);width:var(--signal-distance);background:var(--flow-line);flex:none;height:1px;display:block;position:relative}.architecture-flow-signal-line-vertical{--signal-distance:clamp(1.05rem, 5vw, 3rem);width:1px;height:var(--signal-distance)}.architecture-flow-packet{background:var(--flow-accent);width:5px;height:5px;box-shadow:0 0 0 3px hsl(var(--brand-accent-1) / .08);border-radius:999px;animation:3.6s ease-in-out infinite architecture-packet-x;position:absolute;top:-2px;left:0;transform:none}.architecture-flow-signal-line-vertical .architecture-flow-packet{animation-name:architecture-packet-y;top:0;left:-2px}.architecture-flow-delay-0{animation-delay:0s}.architecture-flow-delay-1{animation-delay:-.9s}.architecture-flow-delay-2{animation-delay:-1.8s}.architecture-flow-delay-3{animation-delay:-2.7s}.architecture-flow-boundary-diagram,.architecture-flow-operations-diagram{width:min(76%,25rem);height:min(82%,16rem);min-height:7.8rem;position:relative}.architecture-flow-core-node,.architecture-flow-operations-core,.architecture-flow-adapter-node{border:1px solid var(--flow-line);min-width:clamp(4rem,9vw,6.2rem);color:var(--flow-accent);background:hsl(var(--background));box-shadow:0 0 0 5px hsl(var(--brand-accent-1) / .04);border-radius:.8rem;place-items:center;gap:.12rem;padding:clamp(.48rem,1.25vw,.76rem);display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.architecture-flow-core-node svg,.architecture-flow-adapter-node svg,.architecture-flow-operations-core>svg{width:clamp(.82rem,1.8vw,1.1rem);height:clamp(.82rem,1.8vw,1.1rem)}.architecture-flow-core-node strong,.architecture-flow-adapter-node strong,.architecture-flow-operations-core strong{letter-spacing:.08em;text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(.55rem,1.25vw,.75rem)}.architecture-flow-core-node small,.architecture-flow-adapter-node small{color:hsl(var(--muted-foreground));white-space:nowrap;font-size:clamp(.4rem,.82vw,.54rem)}.architecture-flow-telemetry-node{position:absolute}.architecture-flow-boundary-diagram{grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;width:min(88%,28rem);display:grid}.architecture-flow-boundary-slot{justify-content:center;align-items:center;min-width:0;min-height:0;display:flex}.architecture-flow-boundary-slot-top{flex-direction:column;grid-area:1/2;justify-content:flex-end}.architecture-flow-boundary-slot-left{grid-area:2/1;justify-content:flex-end}.architecture-flow-boundary-slot-right{grid-area:2/3;justify-content:flex-start}.architecture-flow-boundary-slot-bottom{flex-direction:column;grid-area:3/2;justify-content:flex-start}.architecture-flow-boundary-diagram>.architecture-flow-core-node{grid-area:2/2;place-self:center;position:relative;top:auto;left:auto;transform:none}.architecture-flow-boundary-link{flex:auto;width:auto;min-width:1rem}.architecture-flow-boundary-link.architecture-flow-signal-line-vertical{width:1px;min-width:0;height:auto;min-height:1rem}.architecture-flow-provider-diagram{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:clamp(.35rem,1.8vw,1rem);width:min(94%,38rem);display:grid}.architecture-flow-provider-column{justify-items:center;gap:.5rem;min-width:0;display:grid}.architecture-flow-column-label{color:hsl(var(--muted-foreground) / .78);font-size:clamp(.42rem,.85vw,.54rem)}.architecture-flow-stack{justify-items:center;gap:clamp(.22rem,.7vw,.4rem);display:grid}.architecture-flow-provider-boundary{align-items:center;gap:clamp(.18rem,.7vw,.42rem);display:flex}.architecture-flow-provider-line{--signal-distance:clamp(.75rem, 4vw, 3rem)}.architecture-flow-adapter-node{min-width:clamp(3.8rem,8vw,5.7rem);position:relative;top:auto;left:auto;transform:none}.architecture-flow-quality-flow{flex-direction:column;align-items:center;gap:clamp(.75rem,1.8vw,1.15rem);width:100%;display:flex}.architecture-flow-quality-diagram{justify-content:center;align-items:center;width:min(96%,38rem);display:flex}.architecture-flow-quality-step{align-items:center;display:flex}.architecture-flow-quality-line{--signal-distance:clamp(.65rem, 3.4vw, 2.6rem)}.architecture-flow-quality-status{color:var(--flow-accent);align-items:center;gap:.35rem;font-size:clamp(.46rem,.9vw,.58rem);font-weight:700;display:inline-flex}.architecture-flow-quality-status svg{stroke-width:2.5px;width:.78rem;height:.78rem}.architecture-flow-operations-diagram{width:min(76%,25rem)}.architecture-flow-radar-ring{aspect-ratio:1;border:1px solid var(--flow-line);border-radius:999px;width:clamp(7.2rem,26vw,12.5rem);animation:4.2s ease-in-out infinite architecture-radar;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.architecture-flow-telemetry-node{border:1px solid hsl(var(--border) / .68);color:hsl(var(--muted-foreground));background:hsl(var(--background) / .8);letter-spacing:.04em;text-transform:uppercase;border-radius:999px;align-items:center;gap:.3rem;padding:clamp(.28rem,.8vw,.42rem) clamp(.42rem,1vw,.62rem);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(.44rem,.9vw,.58rem);font-weight:700;display:inline-flex}.architecture-flow-telemetry-node svg{width:clamp(.66rem,1.35vw,.86rem);height:clamp(.66rem,1.35vw,.86rem);color:var(--flow-accent)}.architecture-flow-telemetry-top{top:0;left:50%;transform:translate(-50%)}.architecture-flow-telemetry-right{top:50%;right:0;transform:translateY(-50%)}.architecture-flow-telemetry-bottom{bottom:0;left:50%;transform:translate(-50%)}.architecture-flow-telemetry-left{top:50%;left:0;transform:translateY(-50%)}.architecture-flow-operations-core{aspect-ratio:1;border-radius:999px;width:clamp(4.2rem,9vw,5.8rem);min-width:0}.architecture-flow-core-pulse{border:1px solid var(--flow-line);border-radius:inherit;animation:2.9s ease-out infinite architecture-core-pulse;position:absolute;inset:-.4rem}.architecture-flow-root[data-motion=paused] .architecture-flow-packet,.architecture-flow-root[data-motion=paused] .architecture-flow-radar-ring,.architecture-flow-root[data-motion=paused] .architecture-flow-core-pulse{animation-play-state:paused}@keyframes architecture-flow-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@keyframes architecture-packet-x{0%,14%{opacity:0;left:0}28%{opacity:1}84%{opacity:1}to{opacity:0;left:calc(100% - 5px)}}@keyframes architecture-packet-y{0%,14%{opacity:0;top:0}28%{opacity:1}84%{opacity:1}to{opacity:0;top:calc(100% - 5px)}}@keyframes architecture-radar{0%,to{opacity:.34;transform:translate(-50%,-50%)scale(.92)}50%{opacity:.75;transform:translate(-50%,-50%)scale(1.04)}}@keyframes architecture-core-pulse{0%{opacity:.68;transform:scale(.88)}80%,to{opacity:0;transform:scale(1.24)}}@media (max-width:34rem){.architecture-flow-root{padding:.82rem}.architecture-flow-root:before{border-radius:.8rem;inset:.7rem}.architecture-flow-provider-diagram{gap:.24rem}.architecture-flow-provider-boundary{gap:.16rem}.architecture-flow-adapter-node{min-width:3.5rem;padding-inline:.34rem}}@media (prefers-reduced-motion:reduce){.architecture-flow-root,.architecture-flow-packet,.architecture-flow-signal-line-vertical .architecture-flow-packet,.architecture-flow-radar-ring,.architecture-flow-core-pulse{animation:none}}