/* The approved mark is the hub; live dotted routes connect it to the four teams. */
[data-connected-system].connected-figure{background:var(--navy);padding:26px;border-radius:22px;box-shadow:8px 8px 0 var(--blue);color:var(--paper)}
[data-connected-system] .department-map{display:block;min-height:0;height:550px;padding:0;max-width:none}
[data-connected-system] .dept{position:absolute;width:38%;max-width:224px;height:150px;padding:13px 8px;border-radius:13px;background:var(--ivory);color:var(--navy);box-shadow:4px 4px 0 var(--team-color)}
[data-connected-system] .dept-marketing{left:0;top:4px;--team-color:var(--orange)}
[data-connected-system] .dept-finance{right:0;top:4px;--team-color:var(--gold)}
[data-connected-system] .dept-sales{left:0;bottom:8px;--team-color:var(--blue)}
[data-connected-system] .dept-operations{right:0;bottom:8px;--team-color:var(--green)}
[data-connected-system] .dept .icon{width:66px;height:68px;margin:0 auto 6px}
[data-connected-system] .dept strong{font-size:18px}
[data-connected-system] .dept span{font-size:12px;margin-top:3px}
[data-connected-system] .map-core{top:50%;width:230px;min-width:0;padding:0;background:none;border-radius:0;display:flex;align-items:center;flex-direction:column;gap:0}
[data-connected-system] .core-emblem{position:relative;display:grid;place-items:center;width:170px;height:170px;border-radius:50%;background:var(--blue);border:2px solid var(--paper);box-shadow:0 0 0 9px var(--navy),0 0 0 10px var(--blue);margin-bottom:19px;transform:scale(var(--feedback-scale,1))}
[data-connected-system] .core-emblem:after{content:'';position:absolute;inset:-12px;border:2px solid var(--blue);border-radius:50%;opacity:var(--feedback-opacity,0);transform:scale(var(--feedback-ring-scale,1));pointer-events:none}
[data-connected-system] .map-core .hub-mark{width:126px;height:148px;margin:0;filter:drop-shadow(4px 7px 0 var(--navy))}
[data-connected-system] .map-core strong{font-size:21px;line-height:1.3;background:var(--navy);padding:0 8px;color:var(--paper)}
[data-connected-system] .map-core>span{font:11px var(--mono);background:var(--navy);color:var(--ivory);padding:6px 8px 0}
[data-connected-system] .map-lines{overflow:visible}
[data-connected-system] .map-lines .route-track{stroke:var(--paper);stroke-width:1.5;opacity:.24;vector-effect:non-scaling-stroke}
[data-connected-system] .map-lines .route-dots{stroke:var(--flow-color);stroke-width:4;stroke-dasharray:1 14;stroke-linecap:round;vector-effect:non-scaling-stroke;animation:team-flow 1.8s linear infinite;animation-play-state:paused}
[data-connected-system] [data-team="marketing"]{--flow-color:var(--orange)}
[data-connected-system] [data-team="finance"]{--flow-color:var(--gold)}
[data-connected-system] [data-team="sales"]{--flow-color:var(--blue)}
[data-connected-system] [data-team="operations"]{--flow-color:var(--green)}
[data-connected-system][data-flow-active="true"] .route-dots{animation-play-state:running}
[data-connected-system] figcaption{margin-top:12px;border-top:1px solid var(--blue);color:var(--ivory);font-size:12px;line-height:1.6;padding:18px 6px 0}
/* Outgoing knowledge stays steady. Separate three-dot packets carry feedback inward. */
[data-connected-system] .map-lines .return-track{fill:none;stroke:var(--flow-color);stroke-width:1;opacity:.13;vector-effect:non-scaling-stroke}
[data-connected-system] .map-lines .return-dot{fill:var(--flow-color);stroke:var(--paper);stroke-width:.7;opacity:0;vector-effect:non-scaling-stroke}
@keyframes team-flow{to{stroke-dashoffset:-60}}
html[data-motion-preference="off"] [data-connected-system] .route-dots{animation:none}
html[data-motion-preference="off"] [data-connected-system] .return-dot{display:none}
html[data-motion-preference="off"] [data-connected-system] .core-emblem{transform:none}
html[data-motion-preference="off"] [data-connected-system] .core-emblem:after{opacity:0}
@media(max-width:1100px) and (min-width:801px){
 [data-connected-system].connected-figure{padding:19px}
 [data-connected-system] .dept{width:41%;height:140px}
 [data-connected-system] .dept strong{font-size:15px}
 [data-connected-system] .dept span{font-size:11px}
}
@media(max-width:480px){
 [data-connected-system].connected-figure{padding:16px 12px;box-shadow:5px 5px 0 var(--blue)}
 [data-connected-system] .department-map{height:530px}
 [data-connected-system] .dept{width:43%;height:138px;padding:12px 5px}
 [data-connected-system] .dept .icon{width:56px;height:60px;margin-bottom:6px}
 [data-connected-system] .dept strong{font-size:14px}
 [data-connected-system] .dept span{font-size:10px}
 [data-connected-system] .map-core{width:200px}
 [data-connected-system] .core-emblem{width:130px;height:130px;margin-bottom:17px}
 [data-connected-system] .map-core .hub-mark{width:98px;height:114px}
 [data-connected-system] .map-core strong{font-size:18px}
 [data-connected-system] .map-core>span{font-size:10px}
 [data-connected-system] .map-lines .route-dots{stroke-width:3.5}
}
@media(prefers-reduced-motion:reduce){
 [data-connected-system] .route-dots{animation:none}
 [data-connected-system] .return-dot{display:none}
 [data-connected-system] .core-emblem{transform:none}
 [data-connected-system] .core-emblem:after{opacity:0}
}