/* Self-contained concept visual. All motion is paused until the shared controller opts in. */
.dataflow-demo{--df-accent:#b4e9cf;--df-ink:#e1ede5;--df-muted:#83978c;--df-line:#2b4235;--df-duration:8s;position:relative;container-type:inline-size;isolation:isolate;width:100%;padding:29px 34px 25px;border:1px solid #344b3e;border-radius:12px;background:radial-gradient(ellipse at 62% 40%,#264d3524,transparent 58%),#101b15;color:var(--df-ink);overflow:hidden;font-family:Arial,Helvetica,sans-serif}
.dataflow-demo:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.25;background-image:radial-gradient(#6d8c7545 .65px,transparent .65px);background-size:20px 20px;mask-image:linear-gradient(transparent,#000 15%,#000 80%,transparent);pointer-events:none}
.df-topline{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:25px;border-bottom:1px solid #2d443533}.df-brand{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:.14em;line-height:1}.df-brand-mark{height:17px;width:22px;position:relative;display:flex;gap:3px;align-items:center}.df-brand-mark i{display:block;width:4px;height:17px;border-radius:3px;background:var(--df-accent);transform:skewY(-20deg)}.df-brand-mark i:nth-child(2){height:11px}.df-brand-mark i:nth-child(3){height:7px}.df-demo-label{font-size:7px;letter-spacing:.13em;display:flex;align-items:center;gap:9px;color:var(--df-muted)}.df-demo-label i{width:2px;height:2px;background:#71947e;border-radius:50%}
.df-system{display:grid;grid-template-columns:minmax(0,1.05fr) 28px minmax(0,.84fr) 28px minmax(0,1.3fr) 28px minmax(0,1.05fr);align-items:stretch;padding:40px 0 33px;position:relative}.df-station{min-width:0;position:relative;display:flex;flex-direction:column}.df-station-label{display:flex;align-items:center;gap:8px;color:#96b09f;font-size:9px;line-height:1.4;margin:0 0 14px}.df-station-label>span{font-family:monospace;color:#62846e;font-size:8px}.df-card{position:relative;flex:1;min-height:291px;padding:19px 16px 0;background:linear-gradient(150deg,#1c2e22,#17231c 70%);border:1px solid #3a5141;border-radius:8px;box-shadow:0 14px 32px #0002;display:flex;flex-direction:column;overflow:hidden;animation-duration:var(--df-duration);animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused}.df-card:after{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,#b4e9cf4d,transparent)}.df-card-title{display:flex;align-items:center;gap:9px;margin-bottom:23px;min-width:0}.df-card-title>div{min-width:0}.df-card-title strong{display:block;font-size:11px;line-height:1.2;font-weight:500;letter-spacing:-.02em;white-space:nowrap}.df-card-title small{display:block;color:var(--df-muted);font-size:6.5px;line-height:1.5;margin-top:5px;white-space:nowrap}.df-square-icon{display:grid;place-items:center;width:28px;height:29px;flex-shrink:0;border:1px solid #42604c;border-radius:6px;background:#294033;color:var(--df-accent)}.df-square-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}.df-card-foot{font-size:6.5px;letter-spacing:.02em;color:#789883;display:flex;align-items:center;gap:5px;padding:12px 0;margin-top:auto;border-top:1px solid #354c3b6b;line-height:1.3;white-space:nowrap}.df-tiny-dot{display:inline-block;flex-shrink:0;width:3px;height:3px;border-radius:50%;background:#82b795}
.df-form-card{animation-name:df-form-stage}.df-form-field{margin-bottom:12px}.df-form-field>span{display:block;font-size:7px;line-height:1.2;color:#91aa99;margin-bottom:7px}.df-form-field>div{border:1px solid #38513e;border-radius:4px;padding:10px 9px;min-height:31px;line-height:1;font-size:8px;white-space:nowrap;color:#c4d4c9;background:#132019;overflow:hidden}.df-caret{display:inline-block;width:1px;height:9px;background:var(--df-accent);vertical-align:-1px;margin-left:3px;opacity:.6;animation:df-caret var(--df-duration) linear infinite paused}.df-form-options{display:flex;gap:12px;margin:1px 0 16px;font-size:6px;color:#8ca893;line-height:1;white-space:nowrap}.df-form-options>span{display:flex;align-items:center;gap:4px}.df-form-options i{font-size:6px;display:grid;place-items:center;font-style:normal;width:10px;height:10px;border-radius:2px;background:#345941;color:var(--df-accent)}.df-send-visual{display:flex;justify-content:space-between;align-items:center;background:#b4e9cf;color:#1b3827;border-radius:4px;font-size:7px;line-height:1.2;font-weight:700;padding:10px 9px;margin-bottom:15px;animation:df-send var(--df-duration) linear infinite paused}.df-send-visual svg{height:11px;width:11px;stroke:currentColor;stroke-width:1.2;fill:none}
.df-api-card{animation-name:df-api-stage;align-items:center;text-align:center;padding-top:21px;background:linear-gradient(150deg,#17281e,#132018)}.df-api-orbit{height:62px;width:62px;position:relative;display:grid;place-items:center;margin-bottom:14px}.df-api-ring{position:absolute;inset:0;border:1px solid #395b44;border-radius:50%;box-shadow:0 0 0 9px #2944332e}.df-api-symbol{font-family:monospace;font-size:26px;letter-spacing:-5px;color:#c6ebd0;padding-right:5px;line-height:1}.df-api-symbol i{font-style:normal;color:#72b28a;font-size:23px;display:inline-block;padding:0 4px}.df-orbit-dot{position:absolute;width:5px;height:5px;border:1px solid #94caa6;border-radius:50%;top:6px;right:7px;background:#a7dcb9;box-shadow:0 0 7px #b4e9cf55;transform-origin:-20px 24px;animation:df-orbit var(--df-duration) linear infinite paused}.df-api-title{font-size:14px;font-weight:500;line-height:1.1;letter-spacing:.05em}.df-api-caption{font-size:7px;color:var(--df-muted);line-height:1.6;margin-top:7px}.df-endpoint{display:flex;align-items:center;gap:5px;font:6px/1.2 monospace;margin-top:14px;padding:5px 6px;border:1px solid #35523d;border-radius:3px;color:#92ab9a;white-space:nowrap}.df-endpoint b{font-size:5px;letter-spacing:.06em;font-weight:400;color:var(--df-accent)}.df-json-snippet{text-align:left;width:100%;font:5.5px/1.6 monospace;color:#869d8e;margin-top:10px;margin-bottom:14px}.df-json-snippet>span{display:block}.df-json-snippet>span:nth-child(2),.df-json-snippet>span:nth-child(3){padding-left:7px}.df-json-snippet i{font-style:normal;color:#b6cdbd}.df-api-card .df-card-foot{width:100%;justify-content:center}
.df-database-card{border-color:#5b8066;background:linear-gradient(150deg,#233e2c,#1b2d22 60%);box-shadow:0 16px 40px #0003,0 0 50px #9dd3ac08;animation-name:df-database}.df-database-card .df-card-title{margin-bottom:25px}.df-database-card .df-card-title strong{font-size:12px}.df-db-icon{background:#35563e;border-color:#5c8166;color:#ceefd6}.df-db-indicator{width:5px;height:5px;background:#acdfbc;border-radius:50%;margin-left:auto;flex-shrink:0;box-shadow:0 0 0 3px #95d5a51a}.df-table-tab{display:flex;align-items:center;gap:5px;font-size:7px;color:#c7dccd;padding:0 0 12px;line-height:1}.df-table-tab>svg{width:11px;height:11px;stroke:#9eba9f;stroke-width:1;fill:none}.df-table-tab>small{margin-left:auto;font:5.5px/1 monospace;color:#7c9d87}.df-table{border:1px solid #46624b;border-radius:5px;overflow:hidden}.df-table-head,.df-table-row{display:grid;grid-template-columns:.55fr 1.35fr .8fr;align-items:center;min-height:29px;padding:0 9px;gap:4px;font:6.5px/1.4 Arial,sans-serif}.df-table-head{background:#14281b;color:#87a991;border-bottom:1px solid #3a5c43;min-height:25px;font-family:monospace}.df-table-head>span{display:flex;align-items:center;gap:3px}.df-table-head svg{width:9px;height:9px;stroke:#95b299;stroke-width:1;fill:none}.df-table-row{color:#c2d4c6;border-bottom:1px solid #36513d;background:#1a3021}.df-table-row:last-child{border-bottom:0}.df-table-row>span:first-child{font-family:monospace;color:#93b19b;font-size:6px}.df-table-row>span{white-space:nowrap}.df-table-row i{font-style:normal;font-size:5px;padding:3px 4px;background:#334b39;color:#a9c2af;border-radius:3px;display:inline-flex;align-items:center;gap:3px;line-height:1}.df-table-row .df-state-active{background:#315a3d;color:#b8dcc2}.df-table-row .df-state-new{background:#bddfbd;color:#213c26}.df-state-new>b{height:2px;width:2px;border-radius:50%;background:#496f4a}.df-new-record{animation:df-record var(--df-duration) linear infinite paused}.df-schema{display:flex;align-items:center;justify-content:center;gap:6px;padding:15px 0 16px}.df-schema>span:not(.df-schema-line){display:flex;align-items:center;gap:4px;font-size:5.5px;color:#8bab95;white-space:nowrap}.df-schema>span>i{width:5px;height:5px;border:1px solid #577b60;border-radius:1px;display:block}.df-schema-line{height:1px;width:29px;background:#54755a;position:relative}.df-schema-line:before,.df-schema-line:after{content:"";position:absolute;top:-1.5px;width:3px;height:3px;background:#7ca383;border-radius:50%}.df-schema-line:before{left:0}.df-schema-line:after{right:0}
.df-dashboard-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.df-demo-avatar{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#344c3c;color:#b9cfbf;font-size:7px;font-weight:500;border:1px solid #4c6754}.df-dashboard-title{font-size:12px;font-weight:500;letter-spacing:-.03em;line-height:1.1;white-space:nowrap}.df-dashboard-subtitle{font-size:6.5px;color:var(--df-muted);line-height:1.5;margin-top:6px}.df-dashboard-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:15px;margin-bottom:11px}.df-dashboard-stats>div{padding:9px;border:1px solid #3a5441;border-radius:4px;min-width:0}.df-dashboard-stats>div>span{font-size:5.5px;color:#8fab96;white-space:nowrap;display:block;line-height:1.3}.df-dashboard-stats strong{font-size:25px;letter-spacing:-.04em;font-weight:400;line-height:1.2;margin-top:5px;display:flex;align-items:center;justify-content:space-between}.df-dashboard-stats strong>small{font-size:12px;font-weight:400;color:#9bd5b0}.df-dashboard-spark{display:inline-block;width:4px;height:4px;box-shadow:0 0 0 3px #7fab8b22;border-radius:50%;background:#b4e9cf;animation:df-dashboard-dot var(--df-duration) linear infinite paused}.df-new-project{padding:9px;border:1px solid #425d49;border-radius:4px;margin-bottom:14px;background:#1b3022;animation:df-project var(--df-duration) linear infinite paused}.df-new-project>div:first-child{display:flex;align-items:center;gap:6px}.df-project-monogram{width:20px;height:22px;border:1px solid #588265;background:#34543c;border-radius:3px;display:grid;place-items:center;flex-shrink:0;font-size:6px;color:#bfdfc5}.df-new-project strong{font-size:6.5px;display:block;font-weight:500;white-space:nowrap;line-height:1.2}.df-new-project small{font-size:5px;color:#88a490;display:block;margin-top:3px;line-height:1.2}.df-new-project i{font-style:normal;font-size:12px;color:#92b69c;margin-left:auto}.df-project-progress{height:3px;background:#334d39;border-radius:5px;margin:11px 0 6px;overflow:hidden}.df-project-progress>span{display:block;width:62%;height:100%;background:#aacdab;border-radius:5px;transform-origin:left;animation:df-project-progress var(--df-duration) linear infinite paused}.df-project-caption{font-size:5px;line-height:1;color:#7f9f89;white-space:nowrap}.df-dashboard-card{animation-name:df-dashboard}
.df-wire{position:relative;margin-top:23px;align-self:stretch;display:flex;align-items:center;justify-content:center;min-width:0}.df-wire>svg{width:100%;height:24px;overflow:visible}.df-wire-track{fill:none;stroke:#46694f;stroke-width:1;vector-effect:non-scaling-stroke}.df-wire-packet{fill:none;stroke:#c5efd1;stroke-width:2;stroke-linecap:round;stroke-dasharray:9 110;stroke-dashoffset:110;vector-effect:non-scaling-stroke;opacity:0;filter:drop-shadow(0 0 3px #a9ecc3);animation-duration:var(--df-duration);animation-iteration-count:infinite;animation-timing-function:linear;animation-play-state:paused}.df-wire>span{position:absolute;right:-2px;width:4px;height:4px;border:1px solid #76997f;background:#1b3022;border-radius:50%}.df-wire-one .df-wire-packet{animation-name:df-packet-one}.df-wire-two .df-wire-packet{animation-name:df-packet-two}.df-wire-three .df-wire-packet{animation-name:df-packet-three}
.df-bottomline{border-top:1px solid #2b4235;padding-top:20px;display:flex;gap:11px;align-items:center;color:#8ca795;font-size:8px;line-height:1.6}.df-cycle-mark{display:flex;gap:2px;align-items:center;height:15px;flex-shrink:0}.df-cycle-mark>i{width:3px;border-radius:2px;background:#74a483;height:6px;animation:df-cycle var(--df-duration) linear infinite paused}.df-cycle-mark>i:nth-child(2){height:11px;animation-delay:-1s}.df-cycle-mark>i:nth-child(3){height:15px;animation-delay:-2s}.df-cycle-mark>i:nth-child(4){height:8px;animation-delay:-3s}.df-bottomline>small{font-size:6px;font-family:monospace;letter-spacing:.06em;color:#526f5c;margin-left:auto;white-space:nowrap}.df-mobile-break{display:none}
.dataflow-demo.motion-scene.is-playing .df-card,.dataflow-demo.motion-scene.is-playing .df-wire-packet,.dataflow-demo.motion-scene.is-playing .df-caret,.dataflow-demo.motion-scene.is-playing .df-send-visual,.dataflow-demo.motion-scene.is-playing .df-orbit-dot,.dataflow-demo.motion-scene.is-playing .df-new-record,.dataflow-demo.motion-scene.is-playing .df-dashboard-spark,.dataflow-demo.motion-scene.is-playing .df-new-project,.dataflow-demo.motion-scene.is-playing .df-project-progress>span,.dataflow-demo.motion-scene.is-playing .df-cycle-mark>i{animation-play-state:running}
@keyframes df-form-stage{0%,5%,24%,100%{border-color:#3a5141}10%,18%{border-color:#a0cdb0}}
@keyframes df-api-stage{0%,19%,42%,100%{border-color:#3a5141}25%,35%{border-color:#98c7a8}}
@keyframes df-caret{0%,3%,7%,11%,15%{opacity:.8}5%,9%,13%,20%,100%{opacity:0}}
@keyframes df-send{0%,9%,22%,100%{background:#b4e9cf;box-shadow:0 0 0 0 #b4e9cf00;transform:translateY(0)}12%,17%{background:#d0f3dc;box-shadow:0 0 0 4px #b4e9cf10;transform:translateY(1px)}}
@keyframes df-packet-one{0%,13%{stroke-dashoffset:110;opacity:0}14%{stroke-dashoffset:110;opacity:1}27%{stroke-dashoffset:-10;opacity:1}28%,100%{stroke-dashoffset:-10;opacity:0}}
@keyframes df-packet-two{0%,30%{stroke-dashoffset:110;opacity:0}31%{stroke-dashoffset:110;opacity:1}44%{stroke-dashoffset:-10;opacity:1}45%,100%{stroke-dashoffset:-10;opacity:0}}
@keyframes df-packet-three{0%,61%{stroke-dashoffset:110;opacity:0}62%{stroke-dashoffset:110;opacity:1}75%{stroke-dashoffset:-10;opacity:1}76%,100%{stroke-dashoffset:-10;opacity:0}}
@keyframes df-orbit{0%,19%{transform:rotate(0)}38%,100%{transform:rotate(360deg)}}
@keyframes df-database{0%,40%,69%,100%{border-color:#5b8066;box-shadow:0 16px 40px #0003,0 0 50px #9dd3ac08}46%,61%{border-color:#abd5b3;box-shadow:0 16px 40px #0003,0 0 32px #b4e9cf13}}
@keyframes df-record{0%,42%,73%,100%{background:#1a3021}48%,62%{background:#385d3c}}
@keyframes df-dashboard{0%,72%,99%,100%{border-color:#3a5141;box-shadow:0 14px 32px #0002}78%,91%{border-color:#7cae89;box-shadow:0 14px 32px #0002,0 0 24px #b4e9cf08}}
@keyframes df-dashboard-dot{0%,74%,94%,100%{box-shadow:0 0 0 3px #7fab8b22;opacity:.6}80%,87%{box-shadow:0 0 0 5px #a6dfb52b;opacity:1}}
@keyframes df-project{0%,73%,98%,100%{background:#1b3022;border-color:#425d49}80%,91%{background:#2a4530;border-color:#7ba783}}
@keyframes df-project-progress{0%,75%,100%{transform:scaleX(.66)}84%,95%{transform:scaleX(1)}}
@keyframes df-cycle{0%,100%{opacity:.4;transform:scaleY(.7)}50%{opacity:1;transform:scaleY(1)}}
@container(max-width:1000px){.df-system{grid-template-columns:minmax(0,1.05fr) 23px minmax(0,.83fr) 23px minmax(0,1.32fr) 23px minmax(0,1.05fr)}.df-card{padding-inline:12px}.df-card-title{gap:7px}.df-card-title strong{font-size:10px}.df-card-title small{font-size:5.5px}.df-card-title .df-square-icon{width:24px;height:26px}.df-database-card .df-card-title strong{font-size:11px}.df-form-field>div{font-size:7px;padding-inline:7px}.df-form-options{gap:8px}.df-send-visual{font-size:6px}.df-dashboard-title{font-size:11px}.df-dashboard-subtitle{font-size:5.5px}.df-dashboard-stats>div{padding:7px}.df-dashboard-stats>div>span{font-size:5px}.df-new-project{padding:7px}.df-new-project strong{font-size:5.5px}.df-new-project small{font-size:4.5px}.df-project-monogram{width:17px}.df-table-head,.df-table-row{font-size:5.7px;padding-inline:7px;gap:3px}.df-table-row>span:first-child{font-size:5px}.df-table-row i{font-size:4.5px}.df-api-caption{font-size:6px}.df-endpoint{font-size:5px}.df-json-snippet{font-size:5px}}
@container(max-width:810px){.df-system{grid-template-columns:minmax(0,1.05fr) 19px minmax(0,.8fr) 19px minmax(0,1.35fr) 19px minmax(0,1.05fr)}.df-card{padding-inline:10px;min-height:277px}.df-card-title small{display:none}.df-card-title strong{font-size:8px}.df-card-title .df-square-icon{width:22px;height:25px}.df-square-icon svg{width:15px;height:15px}.df-database-card .df-card-title strong{font-size:9px}.df-form-field>div{font-size:6px;padding-inline:6px}.df-form-field>span{font-size:6px}.df-form-options{gap:6px;font-size:5px}.df-send-visual{font-size:5px;padding:9px 6px}.df-send-visual svg{width:9px;height:9px}.df-api-orbit{width:51px;height:51px}.df-api-symbol{font-size:23px}.df-orbit-dot{top:4px;right:5px;transform-origin:-17px 20px}.df-json-snippet{font-size:4.5px}.df-endpoint{font-size:4.5px;padding-inline:4px;gap:4px}.df-endpoint b{font-size:4px}.df-card-foot{font-size:5.5px}.df-dashboard-title{font-size:9px}.df-dashboard-subtitle{font-size:5px}.df-dashboard-stats{gap:5px}.df-dashboard-stats>div{padding:6px}.df-dashboard-stats>div>span{font-size:4.5px}.df-dashboard-stats strong{font-size:22px}.df-new-project>div:first-child{gap:4px}.df-new-project strong{font-size:5px}.df-project-monogram{width:15px;height:20px;font-size:5px}.df-project-caption{font-size:4.4px}.df-new-project small{font-size:4px}.df-new-project i{font-size:9px}.df-table-head,.df-table-row{font-size:5px;padding-inline:5px}.df-table-row i{font-size:4px}.df-table-tab{font-size:6px}.df-table-tab>small{font-size:5px}.df-station-label{font-size:8px}.df-station-label>span{font-size:7px}.df-schema{gap:5px}.df-schema-line{width:18px}.df-schema>span:not(.df-schema-line){font-size:5px}}
@container(max-width:680px){.df-system{grid-template-columns:minmax(0,1fr);gap:0;padding:28px 0 24px;max-width:440px;margin:auto}.df-station{display:grid;grid-template-columns:83px minmax(0,1fr);align-items:center;gap:18px}.df-station-label{display:block;font-size:10px;line-height:1.5;margin:0}.df-station-label>span{display:block;font-size:9px;margin-bottom:5px}.df-card{padding:15px 16px 0;min-height:0;min-width:0;width:100%;border-radius:7px}.df-card-title{margin-bottom:13px;gap:8px}.df-card-title strong{font-size:11px}.df-card-title small{display:block;font-size:6px}.df-card-title .df-square-icon{height:28px;width:28px}.df-square-icon svg{width:17px;height:17px}.df-form-field{margin-bottom:9px}.df-form-field>span{font-size:6.5px;margin-bottom:5px}.df-form-field>div{font-size:8px;min-height:28px;padding:8px}.df-form-options{margin:0 0 11px;gap:10px;font-size:6px}.df-send-visual{font-size:7px;padding:9px;margin-bottom:10px}.df-send-visual svg{width:10px;height:10px}.df-card-foot{font-size:6px;padding:9px 0}.df-api-card{position:relative;display:grid;grid-template-columns:57px 1fr;grid-template-rows:auto auto auto;column-gap:16px;align-items:center;text-align:left;padding:18px 17px 0}.df-api-orbit{grid-column:1;grid-row:1/4;width:49px;height:49px;margin:0 0 15px}.df-api-title{grid-column:2;grid-row:1;font-size:13px;margin-top:0}.df-api-caption{grid-column:2;grid-row:2;font-size:6px;margin:6px 0}.df-api-caption br{display:none}.df-endpoint{grid-column:2;grid-row:3;justify-self:start;font-size:6px;gap:6px;margin:0 0 14px;padding:5px 7px}.df-endpoint b{font-size:5px}.df-json-snippet{display:none}.df-api-card .df-card-foot{grid-column:1/-1;grid-row:4;justify-content:flex-start}.df-database-card .df-card-title{margin-bottom:17px}.df-database-card .df-card-title strong{font-size:12px}.df-table-tab{font-size:7px;padding-bottom:10px}.df-table-tab>small{font-size:6px}.df-table-head,.df-table-row{font-size:7px;padding-inline:9px;min-height:28px}.df-table-head{min-height:24px}.df-table-row>span:first-child{font-size:6px}.df-table-row i{font-size:5px}.df-schema{padding:12px 0;gap:7px}.df-schema>span:not(.df-schema-line){font-size:6px}.df-schema-line{width:28px}.df-dashboard-card{padding-top:14px;display:grid;grid-template-columns:1fr 1fr;column-gap:9px}.df-dashboard-top{grid-column:1/-1;margin-bottom:9px}.df-dashboard-title{grid-column:1/-1;font-size:12px}.df-dashboard-subtitle{grid-column:1/-1;font-size:6px;margin-top:5px}.df-dashboard-stats{grid-column:1/-1;margin:12px 0 10px;gap:8px}.df-dashboard-stats>div{padding:9px}.df-dashboard-stats>div>span{font-size:6px}.df-dashboard-stats strong{font-size:23px;margin-top:3px}.df-new-project{grid-column:1/-1;padding:9px;margin-bottom:10px}.df-new-project strong{font-size:7px}.df-new-project small{font-size:5px}.df-project-monogram{width:20px;height:23px;font-size:6px}.df-new-project>div:first-child{gap:7px}.df-new-project i{font-size:12px}.df-project-caption{font-size:5.5px}.df-project-progress{margin-top:9px}.df-dashboard-card .df-card-foot{grid-column:1/-1}.df-wire{height:36px;width:2px;justify-self:center;align-self:auto;margin:0 0 0 101px}.df-wire>svg{flex-shrink:0;width:36px;height:24px;transform:rotate(90deg);max-width:none}.df-wire>span{width:4px;height:4px;bottom:-2px;right:-1px}.df-bottomline{font-size:8px;padding-top:18px}.df-bottomline>small{display:none}.df-demo-label{font-size:6px}.df-mobile-break{display:none}}
@container(max-width:410px){.df-topline{gap:10px;padding-bottom:19px}.df-brand{font-size:10px}.df-demo-label{font-size:5.5px;letter-spacing:.05em;gap:5px}.df-station{grid-template-columns:60px minmax(0,1fr);gap:13px}.df-station-label{font-size:8px}.df-station-label>span{font-size:8px}.df-card{padding-inline:12px}.df-card-title strong{font-size:9px}.df-card-title small{font-size:5px}.df-card-title .df-square-icon{width:24px;height:25px}.df-form-field>div{font-size:7px}.df-form-field>span{font-size:6px}.df-form-options{font-size:5px;gap:8px}.df-send-visual{font-size:6px}.df-card-foot{font-size:5.5px}.df-api-card{padding-top:17px;grid-template-columns:43px 1fr;column-gap:12px}.df-api-orbit{height:40px;width:40px}.df-api-symbol{font-size:21px}.df-api-symbol i{font-size:19px}.df-orbit-dot{height:4px;width:4px;top:2px;right:4px;transform-origin:-13px 17px}.df-api-ring{box-shadow:0 0 0 6px #2944332e}.df-api-title{font-size:12px}.df-api-caption{font-size:5.5px}.df-endpoint{font-size:5px;padding:5px;gap:4px}.df-endpoint b{font-size:4px}.df-database-card .df-card-title strong{font-size:10px}.df-table-head,.df-table-row{padding-inline:6px;font-size:6px;gap:3px}.df-table-row>span:first-child{font-size:5px}.df-table-row i{font-size:4.5px}.df-table-tab>small{font-size:5px}.df-schema{gap:5px}.df-schema>span:not(.df-schema-line){font-size:5px}.df-schema-line{width:18px}.df-dashboard-title{font-size:11px}.df-dashboard-subtitle{font-size:5.5px}.df-dashboard-stats>div>span{font-size:5.5px}.df-dashboard-stats>div{padding:7px}.df-new-project strong{font-size:6px}.df-project-caption{font-size:5px}.df-wire{margin-left:73px}.df-bottomline{font-size:7px;gap:8px}.df-mobile-break{display:block}}
@media(max-width:640px){.dataflow-demo{padding:22px 19px 20px;border-radius:9px}}
@media(max-width:360px){.dataflow-demo{padding:18px 13px 16px}.df-demo-label{font-size:5px}}
@media(prefers-reduced-motion:reduce){.dataflow-demo.motion-scene *{animation:none!important;transition:none!important}.df-wire-packet{display:none}.df-caret{opacity:.4}}