.flow-diagram.svelte-16uhcqe{--flow-accent:var(--color-docduck-yellow);--flow-border:var(--color-border);--flow-surface:var(--color-card);--flow-muted:var(--color-muted);--flow-muted-text:var(--color-muted-foreground);--flow-text:var(--color-card-foreground);box-sizing:border-box;border:1px solid var(--flow-border);border-radius:var(--radius-xl);background:radial-gradient(circle at 52% 44%, color-mix(in oklch, var(--flow-accent) 14%, transparent), transparent 31%), var(--flow-surface);width:100%;min-width:0;max-width:100%;color:var(--flow-text);overflow-wrap:anywhere;margin:2rem 0;overflow:hidden;container:product-flow/inline-size}figcaption.svelte-16uhcqe{border-bottom:1px solid var(--flow-border);background:color-mix(in oklch, var(--flow-muted) 70%, transparent);justify-content:space-between;align-items:baseline;gap:.35rem 1rem;padding:1rem 1.25rem;display:flex}figcaption.svelte-16uhcqe strong:where(.svelte-16uhcqe){letter-spacing:-.01em;font-size:.875rem}figcaption.svelte-16uhcqe span:where(.svelte-16uhcqe){max-width:35rem;color:var(--flow-muted-text);font-size:.75rem;line-height:1.45}.flow-stages.svelte-16uhcqe{grid-template-columns:minmax(15rem,1.2fr) minmax(11rem,.8fr) minmax(14rem,1fr);align-items:stretch;gap:3.25rem;margin:0;padding:clamp(1.25rem,3vw,2rem);list-style:none;display:grid}.flow-stage.svelte-16uhcqe{flex-direction:column;gap:1rem;min-width:0;display:flex;position:relative}.stage-heading.svelte-16uhcqe{align-items:center;gap:.625rem;display:flex}.stage-number.svelte-16uhcqe{background:var(--flow-accent);width:1.75rem;height:1.75rem;color:var(--color-primary);font-family:var(--font-mono);border-radius:50%;flex:none;place-items:center;font-size:.6875rem;font-weight:700;display:grid}h3.svelte-16uhcqe,h4.svelte-16uhcqe,p.svelte-16uhcqe{margin:0}h3.svelte-16uhcqe{letter-spacing:-.02em;font-size:1rem}h4.svelte-16uhcqe{font-size:.8125rem}p.svelte-16uhcqe{color:var(--flow-muted-text);font-size:.75rem;line-height:1.5}.source-grid.svelte-16uhcqe{gap:.75rem;display:grid}.source-lane.svelte-16uhcqe{grid-template-columns:minmax(10.5rem,15rem) minmax(3.5rem,1fr);align-items:center;gap:.5rem;min-width:0;display:grid}.source.svelte-16uhcqe{border:1px solid var(--flow-border);border-radius:var(--radius-lg);background:var(--flow-surface);grid-template-columns:2.5rem minmax(0,1fr);align-items:center;gap:.625rem;min-height:4.5rem;padding:.625rem;display:grid;position:relative}.source--agent.svelte-16uhcqe svg:where(.svelte-16uhcqe){width:2.5rem;height:2.5rem}.source--reader.svelte-16uhcqe{background:color-mix(in oklch, var(--flow-accent) 13%, var(--flow-surface))}.source--agent.svelte-16uhcqe svg:where(.svelte-16uhcqe){fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px}.feedback-track.svelte-16uhcqe{z-index:1;width:calc(100% + 3rem);min-width:0;height:2.25rem;position:relative;overflow:visible}.feedback-track.svelte-16uhcqe:before{border-top:2px dotted var(--flow-muted-text);content:"";width:calc(100% - .25rem);position:absolute;top:50%;left:0}.feedback-track.svelte-16uhcqe:after{border-right:2px solid var(--flow-muted-text);border-bottom:2px solid var(--flow-muted-text);content:"";width:.625rem;height:.625rem;position:absolute;top:50%;right:0;transform:translateY(-50%)rotate(-45deg)}.feedback-pill.svelte-16uhcqe{border:1px solid var(--flow-border);background:var(--flow-surface);font-family:var(--font-mono);white-space:nowrap;border-radius:999px;padding:.15rem .4rem;font-size:.5625rem;font-weight:700;line-height:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.feedback-track--human.svelte-16uhcqe .feedback-pill:where(.svelte-16uhcqe){background:color-mix(in oklch, var(--flow-accent) 28%, var(--flow-surface))}.flow-stage--processor.svelte-16uhcqe{border:1px solid color-mix(in oklch, var(--flow-accent) 65%, var(--flow-border));border-radius:var(--radius-xl);background:color-mix(in oklch, var(--flow-accent) 18%, var(--flow-surface));text-align:center;justify-content:center;align-items:center;padding:1rem}.flow-stage--processor.svelte-16uhcqe .stage-heading:where(.svelte-16uhcqe){flex-direction:column}.processor-mark.svelte-16uhcqe{border-radius:50%;place-items:center;width:5rem;height:5rem;display:grid}.flow-stage--outcomes.svelte-16uhcqe>ul:where(.svelte-16uhcqe){gap:.625rem;margin:0;padding:0;list-style:none;display:grid}.flow-stage--outcomes.svelte-16uhcqe>ul:where(.svelte-16uhcqe)>li:where(.svelte-16uhcqe){border:1px solid var(--flow-border);border-radius:var(--radius-lg);background:var(--flow-surface);align-items:center;gap:.625rem;padding:.875rem;font-size:.8125rem;font-weight:650;display:flex}.flow-stage--outcomes.svelte-16uhcqe>ul:where(.svelte-16uhcqe)>li:where(.svelte-16uhcqe)>span:where(.svelte-16uhcqe){border:2px solid var(--color-primary);background:var(--flow-accent);border-radius:50%;flex:none;width:.625rem;height:.625rem}.flow-connector.svelte-16uhcqe{width:2rem;height:1rem;position:absolute;top:50%;left:calc(100% + .625rem);transform:translateY(-50%)}.connector-line.svelte-16uhcqe{border-top:2px dotted var(--flow-muted-text);width:100%;position:absolute;top:calc(50% - 1px);left:0}.flow-connector.svelte-16uhcqe svg:where(.svelte-16uhcqe){fill:none;width:1rem;height:1rem;stroke:var(--flow-muted-text);stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;position:absolute;top:0;right:-.25rem}.signal.svelte-16uhcqe{background:var(--flow-accent);width:.5rem;height:.5rem;box-shadow:0 0 0 2px var(--flow-surface);border-radius:50%;position:absolute;top:calc(50% - .25rem);left:0}.flow-diagram--static.svelte-16uhcqe .signal:where(.svelte-16uhcqe){animation:none;left:calc(50% - .25rem)}@media (prefers-reduced-motion:no-preference){.flow-diagram.svelte-16uhcqe:not(.flow-diagram--static) .feedback-pill--static:where(.svelte-16uhcqe){display:none}.flow-diagram.svelte-16uhcqe:not(.flow-diagram--static) .feedback-pill--moving:where(.svelte-16uhcqe){animation:3s ease-in-out forwards svelte-16uhcqe-flow-feedback-pill;left:-3.5rem;transform:translateY(-50%)}.flow-diagram.svelte-16uhcqe:not(.flow-diagram--static) .signal:where(.svelte-16uhcqe){animation:2.4s ease-in-out infinite svelte-16uhcqe-carry-signal}.flow-diagram.svelte-16uhcqe:not(.flow-diagram--static) .signal--delayed:where(.svelte-16uhcqe){animation-delay:1.2s}}@keyframes svelte-16uhcqe-flow-feedback-pill{0%{opacity:0;left:-3.5rem}5%,95%{opacity:1}to{opacity:0;left:calc(100% + .5rem)}}@keyframes svelte-16uhcqe-carry-signal{0%,20%{opacity:0;transform:translate(0)}35%{opacity:1}80%{opacity:1;transform:translate(1.5rem)}to{opacity:0;transform:translate(1.5rem)}}@media (prefers-reduced-motion:reduce){.signal.svelte-16uhcqe{animation:none;left:calc(50% - .25rem)}.feedback-pill--moving.svelte-16uhcqe{animation:none}}@container product-flow (width<=52rem){.flow-stages.svelte-16uhcqe{grid-template-columns:1fr;gap:3rem}.flow-connector.svelte-16uhcqe{width:1rem;height:1.75rem;top:calc(100% + .625rem);left:50%;transform:translate(-50%)}.source-grid.svelte-16uhcqe{grid-template-columns:repeat(2,minmax(0,1fr))}.source-lane.svelte-16uhcqe{grid-template-rows:1fr auto;grid-template-columns:minmax(0,1fr);align-items:stretch}.feedback-track.svelte-16uhcqe{justify-self:center;width:2.25rem;height:3.5rem}.feedback-track.svelte-16uhcqe:before{border-top:0;border-left:2px dotted var(--flow-muted-text);width:0;height:calc(100% + 2.75rem);top:0;left:50%}.feedback-track.svelte-16uhcqe:after{top:auto;bottom:-3rem;right:50%;transform:translate(50%)rotate(45deg)}.feedback-track.svelte-16uhcqe .feedback-pill:where(.svelte-16uhcqe){top:50%;left:50%;transform:translate(-50%,-50%)}.connector-line.svelte-16uhcqe{border-top:0;border-left:2px dotted var(--flow-muted-text);width:0;height:100%;top:0;left:calc(50% - 1px)}.flow-connector.svelte-16uhcqe svg:where(.svelte-16uhcqe){top:auto;bottom:-.25rem;right:0;transform:rotate(90deg)}.signal.svelte-16uhcqe,.flow-diagram--static.svelte-16uhcqe .signal:where(.svelte-16uhcqe){top:0;left:calc(50% - .25rem)}@media (prefers-reduced-motion:no-preference){.flow-diagram.svelte-16uhcqe:not(.flow-diagram--static) .feedback-track:where(.svelte-16uhcqe) .feedback-pill--moving:where(.svelte-16uhcqe){animation-name:svelte-16uhcqe-flow-feedback-pill-vertical;top:-1rem;left:50%;transform:translate(-50%)}.flow-diagram.svelte-16uhcqe:not(.flow-diagram--static) .signal:where(.svelte-16uhcqe){animation-name:svelte-16uhcqe-carry-signal-vertical}}@keyframes svelte-16uhcqe-flow-feedback-pill-vertical{0%{opacity:0;top:-1rem}5%,95%{opacity:1}to{opacity:0;top:calc(100% + 4rem)}}@keyframes svelte-16uhcqe-carry-signal-vertical{0%,20%{opacity:0;transform:translateY(0)}35%{opacity:1}80%{opacity:1;transform:translateY(1.25rem)}to{opacity:0;transform:translateY(1.25rem)}}}@container product-flow (width<=34rem){figcaption.svelte-16uhcqe{flex-direction:column;align-items:flex-start}.flow-stages.svelte-16uhcqe{padding:1rem}.source.svelte-16uhcqe{text-align:center;grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr);align-content:start;gap:.5rem;padding:.75rem .625rem}.source--agent.svelte-16uhcqe svg:where(.svelte-16uhcqe){justify-self:center}}
