.control-integration-panel{position:relative;overflow:hidden;margin-bottom:15px;background:radial-gradient(circle at 50% 42%,#6d1e2d63,transparent 27%),radial-gradient(circle at 80% 4%,#235f7e6b,transparent 41%),linear-gradient(150deg,#081c2a,#0c2738 66%,#081b29)!important;border:1px solid #5e87925c!important;border-radius:24px!important;color:#eff8fb!important;box-shadow:0 22px 38px #0b344432}.control-integration-panel:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(#b9e8ee24 .8px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(90deg,transparent 8%,black,transparent 92%)}.control-integration-panel .control-card-head{position:relative;z-index:1;color:#85d9d5!important}.control-integration-panel h2{position:relative;z-index:1;color:#fff;font-size:25px!important;letter-spacing:-.6px}.control-integration-panel>.control-muted{position:relative;z-index:1;color:#a9cbd4!important}.control-integration-panel>p:last-child{position:relative;z-index:2;margin-top:12px!important}.control-integration-panel>p:last-child a{color:#9ee6d5!important}
.control-integration-map{position:relative;z-index:1;min-height:0}.control-integration-stage{position:relative;height:520px;max-width:1150px;margin:auto;isolation:isolate}.control-integration-stage:before{content:'';position:absolute;inset:12% 12%;z-index:-1;border:1px solid #90d7d21d;border-radius:50%;background:radial-gradient(circle at center,#c7493b13,transparent 32%);box-shadow:inset 0 0 70px #2c72881c}.control-integration-stage:after{content:'';position:absolute;left:50%;top:50%;z-index:-1;width:330px;height:330px;border:1px dashed #ff9c7040;border-radius:50%;transform:translate(-50%,-50%);animation:controlNetworkOrbit 45s linear infinite}
.control-integration-branches{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.control-integration-branch{fill:none;stroke-width:2.2;stroke-linecap:round;stroke-dasharray:8 10;animation:controlNetworkFlow 15s linear infinite}.control-integration-branch.is-waiting{stroke:#ee996380;filter:drop-shadow(0 0 7px #ee98684d)}.control-integration-branch.is-active{stroke:#76ebc5;filter:drop-shadow(0 0 8px #67ebcf)}.control-integration-particle{pointer-events:none;filter:drop-shadow(0 0 5px currentColor)}.control-integration-particle.is-waiting{fill:#ffba8a;color:#ff9f6a;opacity:.9}.control-integration-particle.is-active{fill:#8ff5d5;color:#5decce}
.control-integration-core{position:absolute;left:50%;top:50%;z-index:3;display:grid;justify-items:center;align-content:center;gap:5px;width:188px;height:188px;transform:translate(-50%,-50%);border:1px solid #ff9c8888;border-radius:50%;background:radial-gradient(circle at 50% 22%,#872a27a3,#250e1ad9 65%,#0c1625);box-shadow:0 0 0 10px #e5622922,0 0 58px #e242365e,inset 0 0 28px #ff845329;text-align:center}.control-integration-core:before,.control-integration-core:after{content:'';position:absolute;inset:-15px;border:1px solid #f4785761;border-radius:50%;animation:controlNetworkPulse 3.5s ease-out infinite}.control-integration-core:after{animation-delay:1.75s}.control-integration-halo{position:absolute;inset:-24px;border:1px dashed #ffaf8060;border-radius:50%;animation:controlNetworkSpin 22s linear infinite}.control-integration-core img{position:relative;width:104px;height:104px;object-fit:cover;border:1px solid #ffbc9b9c;border-radius:24px;box-shadow:0 0 24px #ff65478c}.control-integration-core strong{position:relative;color:#fff;font-size:13px;font-weight:900;letter-spacing:1px;line-height:1.1}.control-integration-core>span{position:relative;color:#ffc19b;font-size:8px;font-weight:850;letter-spacing:2px}
.control-integration-node{position:absolute;left:var(--node-x);top:var(--node-y);z-index:2;display:grid;gap:4px;width:221px;min-height:82px;padding:13px 15px;transform:translate(-50%,-50%);border:1px solid #ecab7655;border-radius:14px;background:linear-gradient(125deg,#17384bf0,#112736e8);box-shadow:0 10px 24px #06121ac4,inset 0 1px #ffffff20;transition:transform .25s,border-color .25s,box-shadow .25s}.control-integration-node:hover{transform:translate(-50%,-50%) scale(1.04);border-color:#ffbd8e;box-shadow:0 14px 32px #06121ad9,0 0 18px #ffae6e48}.control-integration-node.is-active{border-color:#78dfc286}.control-integration-node.is-active:hover{border-color:#90f5d8;box-shadow:0 14px 32px #06121ad9,0 0 18px #78eac755}.control-integration-node-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.control-integration-node-code{color:#91b5c2;font-size:9px;letter-spacing:1.1px;text-transform:uppercase}.control-integration-node strong{color:#f6fcff;font-size:13px;line-height:1.2}.control-integration-node small{color:#ffc39a;font-size:8px;font-weight:850;letter-spacing:1px}.control-integration-node.is-active small{color:#8cf3cf}.control-integration-signal{width:8px;height:8px;border-radius:50%;background:#ffc096;box-shadow:0 0 12px #ffae80;animation:controlNetworkSignal 2.5s ease-in-out infinite}.control-integration-node.is-active .control-integration-signal{background:#83f0cb;box-shadow:0 0 12px #83f0cb}
.control-integration-foot{display:flex;align-items:center;gap:17px;flex-wrap:wrap;max-width:1150px;margin:5px auto 0;padding:15px 4px 0;border-top:1px solid #ffffff24}.control-integration-legend{display:inline-flex;align-items:center;gap:7px;color:#b4d0d8;font-size:10px}.control-integration-legend i{width:8px;height:8px;border-radius:50%}.control-integration-legend .is-active{background:#82efc9;box-shadow:0 0 8px #82efc9}.control-integration-legend .is-waiting{background:#ffb880;box-shadow:0 0 8px #ffb880}.control-integration-foot small{margin-left:auto;color:#91b4c1;font-size:9px}
@keyframes controlNetworkFlow{to{stroke-dashoffset:-180}}
@keyframes controlNetworkOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes controlNetworkSpin{to{transform:rotate(360deg)}}
@keyframes controlNetworkPulse{0%{transform:scale(.75);opacity:.75}100%{transform:scale(1.3);opacity:0}}
@keyframes controlNetworkSignal{50%{opacity:.4;transform:scale(.75)}}
@media(max-width:860px){.control-integration-stage{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;padding:16px 2px 8px}.control-integration-stage:before,.control-integration-stage:after,.control-integration-branches{display:none}.control-integration-core{position:relative;left:auto;top:auto;grid-column:1/-1;justify-self:center;transform:none;margin:10px 0 22px}.control-integration-node{position:relative;left:auto;top:auto;width:100%;min-height:90px;transform:none}.control-integration-node:hover{transform:translateY(-3px) scale(1.01)}.control-integration-node:last-child{grid-column:1/-1}.control-integration-foot small{flex-basis:100%;margin-left:0}}
@media(max-width:520px){.control-integration-stage{grid-template-columns:1fr}.control-integration-node:last-child{grid-column:auto}.control-integration-core{grid-column:auto;width:165px;height:165px}.control-integration-core img{width:89px;height:89px}}
@media(prefers-reduced-motion:reduce){.control-integration-stage:after,.control-integration-halo,.control-integration-core:before,.control-integration-core:after,.control-integration-branch,.control-integration-signal{animation:none}.control-integration-particle{display:none}.control-integration-node{transition:none}}

/* Frozen frontier: the atmosphere stays behind the network and its labels. */
.control-integration-panel{background:radial-gradient(ellipse at 50% 40%,#69314245,transparent 25%),radial-gradient(ellipse at 50% 93%,#76b6c233,transparent 54%),linear-gradient(156deg,#071b2a,#103449 52%,#081d2c)!important}
.control-integration-stage{overflow:hidden}
.control-integration-stage:before{inset:8% 7%;border-color:#bddfe522;background:radial-gradient(ellipse at 50% 85%,#c2e8f01c,transparent 52%);box-shadow:inset 0 0 90px #b9e9f016}
.control-integration-snow{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:linear-gradient(180deg,transparent 62%,#a9dbe00c 100%)}
.control-integration-snow:before,.control-integration-snow:after{content:'';position:absolute;left:-4%;right:-4%;bottom:-1px;height:140px;pointer-events:none}
.control-integration-snow:before{background:linear-gradient(180deg,#c2ecf00f,#b9e3e620);clip-path:polygon(0 100%,0 79%,13% 62%,22% 80%,32% 45%,40% 75%,51% 55%,62% 78%,73% 41%,83% 73%,91% 50%,100% 82%,100% 100%);filter:drop-shadow(0 -8px 14px #d5f4f01b)}
.control-integration-snow:after{height:88px;background:linear-gradient(180deg,#d5f6f016,#b1dce81b);clip-path:polygon(0 100%,0 80%,18% 54%,28% 84%,42% 53%,52% 87%,65% 64%,78% 85%,90% 60%,100% 77%,100% 100%)}
.control-integration-snow i{position:absolute;top:-8%;left:var(--snow-x);width:var(--snow-size);height:var(--snow-size);border-radius:50%;background:#eaffff;opacity:var(--snow-opacity);box-shadow:0 0 7px #d9f5ffb0;animation:controlSnowFall var(--snow-duration) linear var(--snow-delay) infinite}
.control-integration-branches{z-index:1}
.control-integration-branch-base{fill:none;stroke:#b4e5ef40;stroke-width:1.5;filter:drop-shadow(0 0 3px #8ee2f477)}
.control-integration-branch{stroke-width:1.7;stroke-dasharray:3 15;animation-duration:6s}
.control-integration-branch.is-waiting{stroke:#ffb486c4;filter:drop-shadow(0 0 6px #ff9e75a8)}
.control-integration-stream{fill:none;stroke-width:3.4;stroke-linecap:round;stroke-dasharray:2 175;animation:controlNetworkStream 4.5s linear var(--stream-delay) infinite;filter:drop-shadow(0 0 8px currentColor)}
.control-integration-stream.is-waiting{stroke:#ffd3a9;color:#ffac79}.control-integration-stream.is-active{stroke:#9bffe2;color:#79e5d0}
.control-integration-particle{filter:drop-shadow(0 0 8px currentColor)}
.control-integration-particle-glow{pointer-events:none;opacity:.19;filter:blur(3px)}
.control-integration-particle-glow.is-waiting{fill:#ffb283}.control-integration-particle-glow.is-active{fill:#79f7db}
.control-integration-node{background:linear-gradient(135deg,#173d50f5,#0d2535f2);backdrop-filter:blur(8px)}
@keyframes controlSnowFall{0%{transform:translate3d(0,-20px,0);opacity:0}12%{opacity:var(--snow-opacity)}85%{opacity:var(--snow-opacity)}100%{transform:translate3d(var(--snow-drift),570px,0);opacity:0}}
@keyframes controlNetworkStream{from{stroke-dashoffset:0}to{stroke-dashoffset:-177}}
@media(max-width:860px){.control-integration-snow{display:block}.control-integration-stage{overflow:visible}.control-integration-branches{display:none}}
@media(prefers-reduced-motion:reduce){.control-integration-snow i,.control-integration-stream{animation:none}.control-integration-particle-glow{display:none}}
.control-integration-panel .control-integration-stage:before,.control-integration-panel .control-integration-stage:after{display:none}.control-integration-panel .control-integration-node{min-height:90px}.control-integration-panel .control-integration-branches{overflow:hidden}
.control-integration-panel .control-integration-node strong{font-size:14px}.control-integration-panel .control-integration-node small{font-size:9px;letter-spacing:.55px}.control-integration-panel .control-integration-stream{stroke-width:2.3;opacity:.75}.control-integration-panel .control-integration-branch{stroke-width:1.4;opacity:.75}.control-integration-panel .control-integration-particle-glow{opacity:.13}
.control-integration-panel .control-integration-registered{border-color:#8cebd6;background:linear-gradient(135deg,#1d5260f5,#103549f2);box-shadow:0 10px 24px #06121ac4,0 0 19px #71e9cf35,inset 0 1px #d8fff13b}