.flow-picture{gap:var(--space-2);min-width:0;display:grid}.flow-frame{border-radius:var(--radius-small);background:var(--panel);overflow:hidden}.flow-variant svg{width:100%;height:auto;display:block}.flow-variant[data-flow-variant=embeddings],[data-input=embeddings] .flow-variant[data-flow-variant=series]{display:none}[data-input=embeddings] .flow-variant[data-flow-variant=embeddings]{display:block}.flow-edge{fill:none;stroke:var(--rule);stroke-width:1.5px}.flow-curve{fill:none;stroke-width:2.5px;stroke-linejoin:round}.flow-arrow{fill:none;stroke:var(--ink-2);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.flow-model rect{fill:var(--raised);stroke:var(--ink-2);stroke-width:1.5px}.flow-model__edges{fill:none;stroke:var(--rule);stroke-width:1px}.flow-model circle{fill:var(--ink-2)}.flow-card .flow-arrow{stroke-width:5px}.flow-card .flow-model rect{stroke:var(--ink);stroke-width:4px}.flow-card .flow-model__edges{stroke:var(--ink);stroke-width:2.5px}.flow-card .flow-model circle{fill:var(--ink);r:8}.flow-layer-edge{fill:none;stroke:var(--panel);stroke-width:3px}.flow-map{image-rendering:pixelated}.flow-word{fill:var(--ink-2);font:20px var(--font-text)}.flow-captions{color:var(--ink);font-size:var(--step--1);gap:.15rem;margin:0;padding:0;line-height:1.4;list-style:none;display:grid}.flow-picture [data-flow-part]{--flow-dim:.2;--flow-out:flow-dim;--flow-in:flow-lit}.flow-picture [data-flow-caption]{--flow-out:flow-mute;--flow-in:flow-unmute}[data-picture][data-play] .flow-picture--plays [data-flow-beat="1"]{animation:var(--flow-out) var(--flow-change) ease-out var(--flow-two) forwards}[data-picture][data-play] .flow-picture--plays [data-flow-beat="2"]{animation:var(--flow-out) var(--flow-change) ease-out both, var(--flow-in) var(--flow-change) ease-out var(--flow-two) forwards, var(--flow-out) var(--flow-change) ease-out var(--flow-three) forwards}[data-picture][data-play] .flow-picture--plays [data-flow-beat="3"]{animation:var(--flow-out) var(--flow-change) ease-out both, var(--flow-in) var(--flow-change) ease-out var(--flow-three) forwards}[data-picture][data-play] .flow-picture--plays .flow-cube{animation:flow-rise var(--flow-change) ease-out both, flow-drop var(--flow-change) ease-out var(--flow-two) forwards}@keyframes flow-dim{0%{opacity:1}to{opacity:var(--flow-dim)}}@keyframes flow-lit{0%{opacity:var(--flow-dim)}to{opacity:1}}@keyframes flow-mute{0%{color:var(--ink)}to{color:var(--ink-2)}}@keyframes flow-unmute{0%{color:var(--ink-2)}to{color:var(--ink)}}@keyframes flow-rise{0%{transform:translateY(0)}to{transform:translateY(-14px)}}@keyframes flow-drop{0%{transform:translateY(-14px)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){[data-picture][data-play] .flow-picture--plays [data-flow-beat],[data-picture][data-play] .flow-picture--plays .flow-cube{animation:none}}.cube-picture{gap:var(--space-2);min-width:0;display:grid}.cube-picture__svg{width:100%;height:100%;display:block}.cube-picture__words{justify-content:space-between;gap:var(--space-1) var(--space-3);color:var(--ink-2);font-size:var(--step--1);flex-wrap:wrap;margin:0;line-height:1.35;display:flex}.cp-axis line,.cp-axis path{fill:none;stroke:var(--rule);stroke-width:1px;vector-effect:non-scaling-stroke}.cp-axis path{stroke:var(--ink-2)}.cp-axis .cp-axis__period{stroke:var(--ink-2);stroke-width:2px}.cp-edge{fill:none;stroke:var(--ground);stroke-width:1px;vector-effect:non-scaling-stroke}.cp-ghosts rect{fill:none;stroke:var(--rule);stroke-width:1px;stroke-dasharray:2 2;vector-effect:non-scaling-stroke}.cp-sheet .cp-edge{stroke:var(--ink-2)}.cp-card[data-empty] .cp-edge{stroke:var(--ink-2);stroke-dasharray:2 2}.cp-card{transform:var(--rest)}.cp-sheet__fill{opacity:0}[data-play] .cp-card{transform:var(--cube);opacity:0;transition:transform var(--move) var(--easing) var(--delay), opacity var(--fade-for) linear var(--fade)}[data-play] .cp-sheet__still{opacity:0;transition:opacity var(--clear) ease-out}[data-play] .cp-sheet__fill{opacity:1;transition:opacity var(--fill) ease-out var(--fill-at)}@media (prefers-reduced-motion:reduce){[data-play] :is(.cp-card,.cp-sheet__still,.cp-sheet__fill){transition:none}}.variability-picture{aspect-ratio:640/352;border-radius:var(--radius-small);background:var(--panel);width:100%;color:var(--ink);position:relative;overflow:hidden}.vp-pixels{image-rendering:pixelated;display:block}.vp-map,.vp-merge{position:absolute}.vp-merge,.vp-gather{transform-origin:0 0}.vp-gather{width:100%;height:100%}.vp-card{background:var(--panel);width:100%;height:100%;position:relative;overflow:hidden}.vp-card:after{border:1px solid var(--rule);content:"";position:absolute;inset:0}.vp-sprite{max-width:none;height:100%;position:absolute;top:0}.vp-merge{opacity:0}@media (scripting:none){.variability-picture img[data-src]{display:none}}[data-play] .vp-gather{animation:vp-gather var(--vp-gather-for) cubic-bezier(.45, 0, .2, 1) var(--vp-arrives) both}[data-play] .vp-merge{animation:vp-merge var(--vp-merge-for) cubic-bezier(.45, 0, .2, 1) var(--vp-leaves) both}[data-play] .vp-map{animation:vp-resolve var(--vp-map-for) ease-in-out var(--vp-map-at) both}@keyframes vp-gather{0%{transform:var(--vp-loose)}to{transform:none}}@keyframes vp-merge{0%{opacity:1;transform:none}35%{opacity:.45}80%{transform:var(--vp-into);opacity:.25}to{transform:var(--vp-into);opacity:0}}@keyframes vp-resolve{0%{opacity:0}}@media (prefers-reduced-motion:reduce){[data-play] :is(.vp-gather,.vp-merge,.vp-map){animation:none}}.sample-picture{border-radius:var(--radius-small);background:var(--panel);width:100%;color:var(--ink)}.sample-picture svg{width:100%;height:auto;display:block}.sample-picture text{fill:var(--ink)}.sp-title{font:15px var(--font-text)}.sp-label{font:20px var(--font-code)}.sp-small{font:13px var(--font-code)}.sp-cell rect{fill:var(--raised);stroke:var(--rule)}.sp-axis{stroke:var(--rule)}.sp-curve{fill:none;stroke:var(--ink);stroke-width:2px;stroke-dasharray:1;stroke-dashoffset:0}[data-picture][data-play] .sample-picture .sp-cell{animation:sample-cell var(--sample-move) ease-out both;transform-origin:18px 187px}[data-picture][data-play] .sample-picture .sp-curve{animation:sample-curve var(--sample-move) ease-out var(--sample-move) both}@keyframes sample-cell{0%{opacity:.4;transform:scaleX(.35)}to{opacity:1;transform:scaleX(1)}}@keyframes sample-curve{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){[data-picture][data-play] .sample-picture .sp-cell,[data-picture][data-play] .sample-picture .sp-curve{animation:none}}
