.connected{background:var(--band-1);box-shadow:0 0 0 100vmax var(--band-1);clip-path:inset(0 -100vmax);padding-top:clamp(4rem,7vw,6rem);padding-bottom:clamp(4rem,7vw,6rem)}.connected-head{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:end;gap:1rem clamp(2rem,5vw,4rem);max-width:none;display:grid}.connected-head .section-lede{max-width:40rem;margin-top:0}.df{padding:.9rem;font-size:12.5px;display:grid}.df-flow{--m0:168px;--m1:172px;--m2:236px;--m3:200px;grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(var(--m0), 1.7fr) 44px minmax(var(--m1), .8fr) 44px minmax(var(--m2), 1fr) 44px minmax(var(--m3), 1.2fr);height:32rem;transition:grid-template-columns .7s var(--ease);row-gap:.7rem;display:grid;position:relative}.df-flow.s1{grid-template-columns:minmax(var(--m0), 1.05fr) 44px minmax(var(--m1), 1.4fr) 44px minmax(var(--m2), 1fr) 44px minmax(var(--m3), 1.2fr)}.df-flow.s2{grid-template-columns:minmax(var(--m0), .95fr) 44px minmax(var(--m1), .7fr) 44px minmax(var(--m2), 1.9fr) 44px minmax(var(--m3), 1.2fr)}.df-flow.s3{grid-template-columns:minmax(var(--m0), .8fr) 44px minmax(var(--m1), .5fr) 44px minmax(var(--m2), .8fr) 44px minmax(var(--m3), 2.8fr)}.df-flow>:not(svg){z-index:1;min-width:0;position:relative}.df-wires{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:visible}.df-wire{fill:none;stroke:#d3d9dc;stroke-width:2px;transition:stroke .4s}.df-head{border:1px solid var(--t-line);text-align:left;cursor:pointer;min-width:0;font:inherit;color:inherit;background:#fff;border-top:3px solid #c4c9cc;align-items:center;gap:.5rem;padding:.45rem .55rem;transition:border-color .3s,background .3s;display:flex;container-type:inline-size}.df-head.h0{grid-column:1}.df-head.h1{grid-column:3}.df-head.h2{grid-column:5}.df-head.h3{grid-column:7}.df-head>span:last-child{min-width:0;display:grid}.df-head b{white-space:nowrap;font-size:12.5px;line-height:1.2}.df-head em{color:var(--t-muted);white-space:nowrap;font-size:10.5px;font-style:normal}@container (width<=190px){.df-head em{display:none}}.df-num{width:24px;height:24px;color:var(--t-muted);background:#fff;border:2px solid #c4c9cc;border-radius:50%;flex:none;place-items:center;font-size:11.5px;font-weight:700;display:grid}.df-head.done{border-top-color:var(--t-teal)}.df-head.done .df-num{border-color:var(--t-teal);background:var(--t-teal);color:#fff}.df-head.on{border-color:var(--t-teal);border-top-color:var(--t-teal);background:#e6f3f3;box-shadow:0 0 0 3px #e6f3f3}.df-head.on b{color:var(--t-teal-dark)}.df-head.on .df-num{border-color:var(--t-teal);color:var(--t-teal-dark)}.df-ico{width:32px;height:32px;color:var(--t-teal-dark);background:#e6f3f3;flex:none;place-items:center;transition:background .4s,color .4s;display:grid}.df-srcs{flex-direction:column;grid-area:2/1;justify-content:space-between;gap:.35rem;margin:0;padding:0;list-style:none;display:flex;container-type:inline-size}.df-src{border:1px solid var(--t-line);background:#fff;align-items:center;gap:.55rem;padding:.4rem .5rem;transition:border-color .4s;display:flex}.df-src>span:last-child{min-width:0;display:grid}.df-src b{white-space:nowrap;font-size:12px;line-height:1.2}.df-short{display:none}@container (width<=205px){.df-src .df-full{display:none}.df-src .df-short{display:block}.df-src{gap:.45rem;padding:.4rem}}.df-src em{color:var(--t-muted);font-size:10.5px;font-style:normal}.df-src.more{background:#f7fbfb;border-style:dashed;border-color:#9fc9c9}.df-src.more .df-ico{border:1px dashed var(--t-teal);background:#fff}.df-flow.s0 .df-src{border-color:var(--t-teal)}.df-flow.s0 .df-src .df-ico{background:var(--t-teal);color:#fff}.df-flow.s0.seen .df-src{animation:.6s ease-out both df-light}.df-flow.s0.seen .df-src .df-ico{animation:.6s ease-out both df-icolight}.df-src:nth-child(2),.df-src:nth-child(2) .df-ico{animation-delay:.2s!important}.df-src:nth-child(3),.df-src:nth-child(3) .df-ico{animation-delay:.4s!important}.df-src:nth-child(4),.df-src:nth-child(4) .df-ico{animation-delay:.6s!important}.df-src:nth-child(5),.df-src:nth-child(5) .df-ico{animation-delay:.8s!important}.df-src:nth-child(6),.df-src:nth-child(6) .df-ico{animation-delay:1s!important}.df-src:nth-child(7),.df-src:nth-child(7) .df-ico{animation-delay:1.2s!important}@keyframes df-light{0%{border-color:var(--line-strong);box-shadow:0 0 #00e5e533}60%{box-shadow:0 0 0 5px #00e5e533}}@keyframes df-icolight{0%{color:var(--cyan);background:#00e5e51f}}.df-pullcol{grid-area:2/3;display:flex;container-type:inline-size}@container (width<=200px){.df-pull p{font-size:11px}}.df-pull{border:1px solid var(--t-line);text-align:center;background:#fff;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.5rem;min-width:0;padding:1rem .7rem;transition:border-color .4s,box-shadow .4s;display:flex}.df-pull b{color:#333;font-size:13.5px}.df-pull p{color:#444;max-width:16rem;margin:0;font-size:12px;line-height:1.45}.df-pull-ico{color:#6b7679;background:#eef1f2;border-radius:50%;place-items:center;width:52px;height:52px;transition:background .4s,color .4s;display:grid}.df-flow:is(.s1,.s2,.s3) .df-pull{border-color:var(--t-teal)}.df-flow:is(.s1,.s2,.s3) .df-pull-ico{color:var(--t-teal-dark);background:#e6f3f3}.df-flow.s1 .df-pull{box-shadow:0 0 0 4px #e6f3f3}.df-flow.s1 .df-pull b{color:var(--t-teal-dark)}.df-flow:is(.s1,.s2) .df-pull-ico svg{animation:2.4s linear infinite df-spin}@keyframes df-spin{to{transform:rotate(360deg)}}.df-flow:is(.s1,.s2) .df-wire.in{stroke:var(--t-teal);stroke-width:3px;stroke-linecap:round;stroke-dasharray:1 11;animation:.7s linear infinite df-flowdash}.df-flow.s3 .df-wire.in{stroke:#9fc9c9}.df-flow.s3 .df-wire.out{stroke:var(--t-teal);stroke-width:3px;stroke-linecap:round;stroke-dasharray:1 11;animation:.7s linear infinite df-flowdash}@keyframes df-flowdash{to{stroke-dashoffset:-12px}}.df-dbcol{flex-direction:column;grid-area:2/5;justify-content:center;gap:.9rem;display:flex;container-type:inline-size}.df-db{flex-direction:column;align-items:center;gap:.4rem;display:flex}.df-can{width:84px;height:115px;overflow:visible}.df-can-body{fill:#fff;stroke:#c4c9cc;stroke-width:2px;transition:stroke .4s}.df-can-top{fill:#f6f8f8;stroke:#c4c9cc;stroke-width:2px;transition:stroke .4s}.df-can-fill{fill:var(--t-teal)}.df-flow:is(.s2,.s3) .df-can-body,.df-flow:is(.s2,.s3) .df-can-top{stroke:var(--t-teal)}.df-count{justify-items:center;display:grid}.df-count b{color:var(--t-teal-dark);font-variant-numeric:tabular-nums;font-size:22px;line-height:1.1}.df-count span{color:var(--t-muted);font-size:11px}@container (width>=380px){.df-db{flex-direction:row;justify-content:center;gap:1.2rem}.df-count{justify-items:start}.df-count b{font-size:26px}}.df-join{border:1px solid var(--t-line);opacity:.4;background:#fff;padding:.7rem .6rem .8rem;transition:opacity .4s,border-color .4s;display:grid}.df-flow:is(.s2,.s3) .df-join{opacity:1;border-color:var(--t-teal)}.df-joinbody{justify-items:center;display:grid}.df-q{color:var(--t-teal-dark);text-align:center;text-wrap:balance;margin-bottom:.6rem;font-size:15px;line-height:1.25}.df-lanes{grid-template-columns:1fr 1fr;gap:.4rem;width:100%;display:grid}.df-lane{border:1px solid var(--t-line);border-top:3px solid var(--t-teal);text-align:center;background:#f7fbfb;align-content:start;min-width:0;padding:.25rem .35rem;display:grid}.df-lane.b{background:#fffbea;border-top-color:#f1c232}.df-lane b{white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;line-height:1.25;overflow:hidden}.df-lane .df-short{display:block}.df-lane .df-full{display:none}.df-merge{width:100%;height:20px;overflow:visible}.df-merge path{fill:none;stroke:var(--t-teal);stroke-width:2px;vector-effect:non-scaling-stroke;stroke-dasharray:400;stroke-dashoffset:0}.df-key{z-index:1;background:var(--t-teal);color:#fff;white-space:nowrap;margin-top:-2px;padding:.15rem .55rem;font-size:10.5px;font-weight:700;position:relative}@container (width>=380px){.df-q{margin-bottom:.8rem;font-size:21px}.df-lane b{font-size:12px}.df-lane .df-full{display:block}.df-lane .df-short{display:none}}.df-flow:is(.s2,.s3) .df-q{animation:.45s ease-out .1s both df-in}.df-flow:is(.s2,.s3) .df-lane{animation:.4s ease-out .45s both df-in}.df-flow:is(.s2,.s3) .df-lane.b{animation-delay:.6s}.df-flow:is(.s2,.s3) .df-merge path{animation:.5s ease-out .85s both df-draw}.df-flow:is(.s2,.s3) .df-key{animation:.3s ease-out 1.25s both df-pop}@keyframes df-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes df-draw{0%{stroke-dashoffset:400px}to{stroke-dashoffset:0}}@keyframes df-pop{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}.df-outcol{grid-area:2/7;min-height:0;display:flex}.df-tiles{grid-template-columns:var(--cols);grid-template-rows:var(--rows);min-height:0;transition:grid-template-columns .7s var(--ease), grid-template-rows .7s var(--ease);flex:1;gap:.5rem;display:grid}.df-tile{border:1px solid var(--t-line);opacity:.5;background:#fff;flex-direction:column;min-width:0;min-height:0;transition:opacity .4s,border-color .3s,box-shadow .3s;display:flex;position:relative}.df-flow.s3 .df-tile{opacity:1}.df-tile:hover{opacity:1;border-color:var(--t-teal)}.df-flow.s3 .df-tile.on{border-color:var(--t-teal);z-index:2;box-shadow:0 0 0 3px #e6f3f3,0 6px 18px #064f502e}.df-thumb{background:var(--t-bg);flex:1;min-height:0;position:relative;overflow:hidden}.df-thumb>.fit-canvas{transform-origin:0 0;position:absolute;top:0;left:0;overflow:hidden}.df-thumb .window-bar{display:none}.df-thumb .window{box-shadow:none;border:0}.df-shot,.df-shot>*{height:100%}.df-tile-label{border-top:1px solid var(--t-line);background:#fff;justify-content:space-between;align-items:baseline;gap:.5rem;min-width:0;padding:.35rem .5rem;display:flex}.df-tile-label b{text-overflow:ellipsis;white-space:nowrap;font-size:11.5px;line-height:1.2;overflow:hidden}.df-tile-label em{color:var(--t-teal-dark);white-space:nowrap;font-size:11px;font-style:normal;display:none}.df-flow.s3 .df-tile.on .df-tile-label{background:var(--t-teal);border-top-color:var(--t-teal);color:#fff}.df-flow.s3 .df-tile.on .df-tile-label em{color:#fff;display:inline}.df-flow.s3 .df-tile.on .df-tile-label b{font-size:12.5px}.df-tile-hit{z-index:3;cursor:pointer;background:0 0;border:0;padding:0;position:absolute;inset:0}@media (max-width:1100px){.df-flow,.df-flow.s0,.df-flow.s1,.df-flow.s2,.df-flow.s3{--m0:140px;--m1:120px;--m2:190px;--m3:160px;grid-template-columns:minmax(var(--m0), 1fr) 32px minmax(var(--m1), .8fr) 32px minmax(var(--m2), 1fr) 32px minmax(var(--m3), 1.3fr)}.df-flow.s3{grid-template-columns:minmax(var(--m0), .9fr) 32px minmax(var(--m1), .55fr) 32px minmax(var(--m2), .8fr) 32px minmax(var(--m3), 2.2fr)}.df-head em{display:none}.df-head b{white-space:normal}}@media (max-width:900px){.connected-head{grid-template-columns:1fr}}@media (max-width:760px){.df{padding:.6rem}.df-flow,.df-flow.s0,.df-flow.s1,.df-flow.s2,.df-flow.s3{grid-template-rows:auto auto;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:.35rem;height:auto;min-height:31rem;display:grid}.df-wires{display:none}.df-head{text-align:center;flex-direction:column;grid-row:1;justify-content:flex-start;align-items:center;gap:.25rem;padding:.4rem .2rem}.df-head.h0{grid-column:1}.df-head.h1{grid-column:2}.df-head.h2{grid-column:3}.df-head.h3{grid-column:4}.df-head>span:last-child{justify-items:center}.df-head b{white-space:normal;text-align:center;font-size:10.5px}.df-head em{display:none}.df-srcs,.df-pullcol,.df-dbcol,.df-outcol{grid-area:2/1/auto/-1;margin-top:.4rem}.df-flow:not(.s0) .df-srcs,.df-flow:not(.s1) .df-pullcol,.df-flow:not(.s2) .df-dbcol,.df-flow:not(.s3) .df-outcol{display:none}.df-srcs{grid-template-columns:1fr 1fr;align-content:start;display:grid}.df-src{padding:.45rem}.df-src b{white-space:normal;font-size:11.5px}.df-src .df-full{display:block}.df-src .df-short{display:none}.df-src.more{grid-column:1/-1}.df-pull{padding:1.5rem 1rem}.df-dbcol{justify-content:flex-start}.df-tiles,.df-flow.s3 .df-tiles{grid-template-rows:none;grid-template-columns:1fr 1fr}.df-thumb{aspect-ratio:3/2;flex:none}.df-tile-label em{display:none!important}}@media (prefers-reduced-motion:reduce){.df-flow,.df-tiles{transition:none}.df-flow .df-src,.df-flow .df-src .df-ico,.df-pull-ico svg,.df-q,.df-lane,.df-merge path,.df-key{animation:none!important}.df-flow:is(.s1,.s2) .df-wire.in,.df-flow.s3 .df-wire.out{stroke-dasharray:none;animation:none}.df-wire{transition:none}}.df-flow{padding-top:24px}.df-head{position:relative;overflow:visible}.df-step{color:#00e5e5;height:22px;font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;background:#082f30;align-items:center;padding:0 .55rem;font-size:10.5px;display:flex;position:absolute;bottom:calc(100% + 3px);left:-1px;right:-1px;overflow:hidden}.df-head.on .df-step{color:#fff;background:#0d8b8b}.window.df{box-shadow:8px 8px 0 var(--cyan)}.df-flow>.df-colbg{z-index:0;pointer-events:none;background:#ffffff8c;border:1px solid #d5dfe0;grid-row:1/-1;margin:-30px -10px -10px;transition:border-color .3s,background .3s,box-shadow .3s;position:relative}.df-colbg.h0{grid-column:1}.df-colbg.h1{grid-column:3}.df-colbg.h2{grid-column:5}.df-colbg.h3{grid-column:7}.df-flow>.df-colbg.on{border-color:var(--t-teal);background:#e6f3f3b3;box-shadow:0 0 0 3px #0d8b8b1f}@media (max-width:760px){.df-flow>.df-colbg{display:none}}.df-flow>.df-head{grid-row:1}.df-flow>.df-colbg.on{border:2px solid var(--t-teal);box-shadow:none;background:#e6f3f3cc}.df-head.on{border-color:var(--t-teal)!important;background:var(--t-teal)!important;box-shadow:none!important}.df-head.on b,.df-head.on em{color:#fff!important}.df-head.on .df-num{color:var(--t-teal-dark)!important;background:#fff!important;border-color:#fff!important}.df-head.on .df-step{background:var(--t-teal-dark);color:#fff}.window.df{border-color:var(--line-strong);color:var(--text);background:#062425}.df .df-wire{stroke:#00e5e52e}.df .df-flow:is(.s1,.s2) .df-wire.in,.df .df-flow.s3 .df-wire.out{stroke:var(--cyan)}.df .df-flow.s3 .df-wire.in{stroke:#00e5e559}.df .df-flow>.df-colbg{background:#092728e6;border-color:#60848273}.df .df-flow>.df-colbg.on{border-color:var(--cyan);background:#0d8b8b24}.df .df-head{border-color:var(--line-strong);border-top-color:var(--line-strong);color:var(--text);background:#0b3b3c}.df .df-head em{color:var(--text-3)}.df .df-num{border-color:var(--line-strong);color:var(--text-2);background:0 0}.df .df-head.done{border-top-color:var(--cyan)}.df .df-head.done .df-num{border-color:var(--cyan);background:var(--cyan);color:#062425}.df .df-head.on{border-color:var(--yellow)!important;background:var(--yellow)!important}.df .df-head.on b,.df .df-head.on em{color:#062425!important}.df .df-head.on .df-num{color:var(--yellow)!important;background:#062425!important;border-color:#062425!important}.df .df-step{color:var(--cyan);background:#021c1d}.df .df-head.on .df-step{background:var(--yellow);color:#062425}.df .df-src,.df .df-pull,.df .df-join{border-color:var(--line-strong);color:var(--text);background:#0b3b3c}.df .df-src em{color:var(--text-3)}.df .df-src.more{background:0 0;border-color:#00e5e566}.df .df-src.more .df-ico{border-color:var(--cyan);background:0 0}.df .df-ico,.df .df-pull-ico{color:var(--cyan);background:#00e5e51f}.df .df-flow.s0 .df-src,.df .df-flow:is(.s1,.s2,.s3) .df-pull,.df .df-flow:is(.s2,.s3) .df-join{border-color:var(--cyan)}.df .df-flow.s0 .df-src .df-ico{background:var(--cyan);color:#062425}.df .df-flow:is(.s1,.s2,.s3) .df-pull-ico{color:var(--cyan);background:#00e5e52e}.df .df-flow.s1 .df-pull{box-shadow:0 0 0 4px #00e5e51f}.df .df-pull b,.df .df-flow.s1 .df-pull b{color:var(--text)}.df .df-pull p{color:var(--text-2)}.df .df-can-body{fill:#0b3b3c;stroke:var(--line-strong)}.df .df-can-top{fill:#123f40;stroke:var(--line-strong)}.df .df-can-fill{fill:var(--cyan)}.df .df-flow:is(.s2,.s3) .df-can-body,.df .df-flow:is(.s2,.s3) .df-can-top{stroke:var(--cyan)}.df .df-count b{color:var(--cyan)}.df .df-count span{color:var(--text-3)}.df .df-q{color:var(--text)}.df .df-lane{border-color:var(--line-strong);border-top-color:var(--cyan);color:var(--text);background:#062425}.df .df-lane.b{border-top-color:var(--yellow);background:#062425}.df .df-merge path{stroke:var(--cyan)}.df .df-key{background:var(--cyan);color:#062425}.df .df-tile{border-color:var(--line-strong);background:#0b3b3c}.df .df-tile:hover,.df .df-flow.s3 .df-tile.on{border-color:var(--cyan)}.df .df-flow.s3 .df-tile.on{box-shadow:0 0 0 3px #00e5e533,0 8px 22px #0006}.df .df-tile-label{border-top-color:var(--line-strong);color:var(--text);background:#0b3b3c}.df .df-flow.s3 .df-tile.on .df-tile-label{background:var(--cyan);border-top-color:var(--cyan);color:#062425}.df .df-flow.s3 .df-tile.on .df-tile-label em{color:#062425}@media (min-width:760px){.df .df-step{letter-spacing:.14em;height:26px;font-size:12.5px}.df .df-head b{font-size:14.5px}.df .df-head em{font-size:12px}}
