.sp-flow{border:1px solid #2d4855;border-radius:12px;margin:30px 0 28px;background:radial-gradient(ellipse at 50% 55%,#153b4250,transparent 60%),#081720;position:relative;overflow:hidden}.sp-flow-head{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:25px 28px 10px}.sp-flow-head>div>span{font:8px system-ui;letter-spacing:2px;color:#87d9ce9c}.sp-flow-head p{font-size:18px;color:#d6e5e4;margin:10px 0 0}.sp-flow-toggle{font-size:10px;min-height:34px;padding:6px 11px;border-color:#87d9ce40;color:#aac8cb;white-space:nowrap}.sp-flow-scene{height:360px;position:relative;margin:7px 28px 0}.sp-flow-grid{position:absolute;inset:0;background-image:radial-gradient(#87d9ce25 .8px,transparent .8px);background-size:19px 19px;mask-image:radial-gradient(ellipse,#000,transparent 75%);opacity:.5}.sp-flow-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.sp-flow-lines-mobile{display:none}.sp-flow-base path{fill:none;stroke:#48636c;stroke-width:1.3;opacity:.6;vector-effect:non-scaling-stroke}.sp-flow-packets path{fill:none;stroke:#87d9ce;stroke-width:2;stroke-linecap:round;stroke-dasharray:15 310;stroke-dashoffset:325;animation:sp-flow-stream 5s linear infinite;filter:drop-shadow(0 0 5px #87d9ce);vector-effect:non-scaling-stroke}.sp-flow-packets path:nth-child(2){animation-delay:-1.6s;stroke:#c9aa70;filter:drop-shadow(0 0 5px #c9aa70)}.sp-flow-packets path:nth-child(3){animation-delay:-3.2s}.sp-flow-packets path:nth-child(n+4){animation-delay:-2.6s;stroke:#d4bd90;filter:drop-shadow(0 0 5px #c9aa70)}.sp-flow-packets path:nth-child(5){animation-delay:-4s;stroke:#87d9ce}.sp-flow-packets path:nth-child(6){animation-delay:-.8s}.sp-flow-node{position:absolute;width:21%;height:74px;display:flex;gap:12px;align-items:center;padding:12px 14px;border:1px solid #36515d;border-radius:9px;background:linear-gradient(130deg,#152b36,#0b1b25);box-shadow:0 6px 18px #0003;transition:border-color .3s,box-shadow .3s;transform:translateY(-50%)}.sp-source{left:0}.sp-target{right:0;border-color:#635b423f}.sp-node-one{top:18.055%}.sp-node-two{top:50%}.sp-node-three{top:81.945%}.sp-node-icon{color:#88cabc;display:grid;place-items:center;width:28px;height:30px;flex-shrink:0}.sp-node-icon svg{width:26px;height:26px}.sp-target .sp-node-icon{color:#c9aa70}.sp-flow-node strong{display:block;font-size:12px;font-weight:500;letter-spacing:.4px;white-space:nowrap;color:#d1e2e1}.sp-flow-node small{display:block;font-size:9px;color:#829eab;line-height:1.8;margin-top:3px;white-space:nowrap}.sp-flow-node>i{position:absolute;top:calc(50% - 3px);right:-4px;width:6px;height:6px;background:#87d9ce;border-radius:50%;box-shadow:0 0 8px #87d9ce90;animation:sp-flow-node-glow 4s ease-in-out infinite}.sp-target>i{right:auto;left:-4px;background:#c9aa70;animation-delay:-2s}.sp-flow-node:hover{border-color:#87d9ce88;box-shadow:0 0 24px #87d9ce14}.sp-flow-hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:110px;height:116px;border:1px solid #87d9ce77;border-radius:16px;background:radial-gradient(ellipse at 50% 40%,#1c4e51,#0b222d 75%);display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 0 30px #87d9ce14,inset 0 0 22px #87d9ce0d;animation:sp-hub-breathe 5s ease-in-out infinite}.sp-flow-hub img{width:60px;height:40px;object-fit:contain}.sp-flow-hub strong{font:10px system-ui;letter-spacing:1.4px;color:#e5d4af;margin-top:7px}.sp-flow-hub small{font-size:8px;letter-spacing:.5px;color:#8fb9b6;margin-top:5px}.sp-hub-halo{position:absolute;inset:-12px;border:1px solid #87d9ce22;border-radius:24px;animation:sp-hub-halo 5s ease-out infinite}.sp-hub-port{position:absolute;top:calc(50% - 4px);width:7px;height:7px;border-radius:50%;background:#a4e8d7;box-shadow:0 0 12px #87d9ce}.sp-port-left{left:-4px}.sp-port-right{right:-4px}.sp-flow>footer{margin:0;padding:10px 28px 20px;max-width:none;border:0;display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#7796a3}.sp-flow>footer span:first-child{color:#95bdb5;display:flex;align-items:center;gap:7px}.sp-flow>footer i{height:4px;width:4px;border-radius:50%;background:#87d9ce}.sp-flow[data-flow-paused=true] *,.sp-flow[data-flow-visible=false] *,.sp-motion-paused .sp-card-art *,.sp-motion-offscreen .sp-card-art *{animation-play-state:paused!important}
.sp-value-cards>.card,.sp-type-cards>.card{position:relative;overflow:hidden;transition:border-color .3s,transform .3s}.sp-value-cards>.card:hover,.sp-type-cards>.card:hover{border-color:#87d9ce77;transform:translateY(-4px)}.sp-card-art{position:relative;height:76px;margin:0 0 22px;max-width:180px}.sp-art-trace{position:absolute;left:45px;right:8px;top:37px;height:1px;background:#48616c}.sp-art-satellite{position:absolute;left:0;top:12px;width:48px;height:48px;border:1px solid #87d9ce70;border-radius:10px;background:#87d9ce08;color:#a4e8d7;display:grid;place-items:center;box-shadow:0 0 20px #87d9ce0b}.sp-art-satellite svg{width:24px;height:24px}.sp-art-beacon{position:absolute;left:44px;top:34px;width:6px;height:6px;border-radius:50%;background:#87d9ce;box-shadow:0 0 10px #87d9ce}.sp-art-output{position:absolute;right:5px;top:21px;width:32px;height:32px;border:1px solid #c9aa7070;border-radius:8px;background:#c9aa7008;box-shadow:0 0 15px #c9aa7010;animation:sp-flow-node-glow 5s ease-in-out infinite}.sp-art-output:before,.sp-art-output:after{content:'';height:1px;width:13px;background:#c9aa70;position:absolute;left:9px;top:14px}.sp-art-output:after{transform:rotate(90deg)}.sp-art-spark{position:absolute;left:48px;top:36px;width:11px;height:2px;background:#bbefe2;border-radius:5px;box-shadow:0 0 8px #87d9ce;animation:sp-art-travel 4s linear infinite}.sp-type-cards .sp-card-art{margin-top:18px}.sp-type-cards>.card:nth-child(2) .sp-art-spark{animation-delay:-1.3s}.sp-type-cards>.card:nth-child(3) .sp-art-spark{animation-delay:-2.6s}
@keyframes sp-flow-stream{to{stroke-dashoffset:0}}@keyframes sp-flow-node-glow{0%,100%{opacity:.55}50%{opacity:1;box-shadow:0 0 16px #87d9ce44}}@keyframes sp-hub-breathe{0%,100%{box-shadow:0 0 20px #87d9ce15,inset 0 0 20px #87d9ce08}50%{box-shadow:0 0 42px #87d9ce30,inset 0 0 26px #87d9ce15}}@keyframes sp-hub-halo{0%{transform:scale(.95);opacity:0}35%{opacity:.65}100%{transform:scale(1.15);opacity:0}}@keyframes sp-art-travel{0%{transform:translateX(0);opacity:0}15%{opacity:1}80%{opacity:1}100%{transform:translateX(92px);opacity:0}}
@media(max-width:1000px){.sp-flow-node{padding:10px;gap:7px}.sp-node-icon{width:20px}.sp-node-icon svg{width:21px}.sp-flow-node strong{font-size:10px}.sp-flow-node small{font-size:8px}.sp-flow-hub{width:94px;height:106px}}
@media(max-width:800px){.sp-flow-head{padding:22px 18px 5px;gap:14px;align-items:start}.sp-flow-head>div>span{font-size:7px;letter-spacing:1px}.sp-flow-head p{font-size:17px}.sp-flow-toggle{font-size:9px;padding:5px 8px;min-height:34px}.sp-flow-scene{height:530px;margin:0 10px}.sp-flow-lines{display:none}.sp-flow-lines-mobile{display:block;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.sp-flow-node{width:28%;height:87px;padding:9px 5px;flex-direction:column;gap:3px;text-align:center;transform:translateX(-50%)}.sp-source{top:17px}.sp-target{top:430px;right:auto}.sp-node-one{left:17.1875%}.sp-node-two{left:50%}.sp-node-three{left:82.8125%}.sp-node-icon,.sp-node-icon svg{width:22px;height:22px}.sp-flow-node strong{font-size:10px;letter-spacing:0}.sp-flow-node small{font-size:8px;margin-top:2px}.sp-flow-node>i{right:auto;left:calc(50% - 3px);top:auto;bottom:-4px}.sp-target>i{top:-4px;bottom:auto;left:calc(50% - 3px)}.sp-flow-hub{width:100px;height:100px}.sp-flow>footer{padding:10px 18px 20px;font-size:8px;flex-direction:column;gap:8px}.sp-value-cards .sp-card-art,.sp-type-cards .sp-card-art{max-width:160px}.sp-art-spark{animation-name:sp-art-travel-mobile}}
@keyframes sp-art-travel-mobile{0%{transform:translateX(0);opacity:0}15%{opacity:1}80%{opacity:1}100%{transform:translateX(72px);opacity:0}}
@media(prefers-reduced-motion:reduce){.sp-flow *,.sp-card-art *{animation:none!important;transition:none!important}.sp-value-cards>.card,.sp-type-cards>.card{transition:none!important}.sp-flow-packets path{stroke-dasharray:none;opacity:.25}.sp-art-spark{opacity:0}}
/* Larger labels for comfortable reading in the cooperation diagram. */
.sp-flow-head>div>span{font-size:11px;letter-spacing:1.5px}.sp-flow-head p{font-size:24px}.sp-flow-toggle{font-size:13px;min-height:42px}.sp-flow-node{height:90px;padding:15px 16px;gap:13px}.sp-flow-node strong{font-size:16px;letter-spacing:0}.sp-flow-node small{font-size:12px;margin-top:5px}.sp-node-icon,.sp-node-icon svg{width:28px;height:28px}.sp-flow-hub{width:12.222%;min-width:110px;height:126px}.sp-flow-hub strong{font-size:13px;letter-spacing:1px}.sp-flow-hub small{font-size:11px}.sp-flow>footer{font-size:12px;padding-bottom:23px}.sp-value-cards>.card h3,.sp-type-cards>.card h3{font-size:23px}.sp-value-cards>.card p,.sp-type-cards>.card p{font-size:16px;line-height:1.9}
@media(max-width:1000px){.sp-flow-node{gap:8px;padding:12px 10px}.sp-flow-node strong{font-size:14px}.sp-flow-node small{font-size:11px}.sp-node-icon,.sp-node-icon svg{width:23px;height:23px}}
@media(max-width:800px){.sp-flow-head>div>span{font-size:9px;letter-spacing:1px}.sp-flow-head p{font-size:20px}.sp-flow-toggle{font-size:11px;min-height:40px}.sp-flow-node{height:100px;padding:10px 4px;gap:4px}.sp-source{top:4px}.sp-target{top:430px}.sp-flow-node strong{font-size:13px}.sp-flow-node small{font-size:10px}.sp-node-icon,.sp-node-icon svg{width:25px;height:25px}.sp-flow-hub{width:112px;min-width:0;height:112px}.sp-flow>footer{font-size:11px}.sp-value-cards>.card h3,.sp-type-cards>.card h3{font-size:23px}}
