.coordinator-visual{position:relative;width:100%;min-width:0}
.coordinator-stage{position:relative;width:100%;height:550px}
.coordinator-routes .co-input{stroke:#788391;stroke-width:1.8;stroke-dasharray:none}.coordinator-routes .co-route>path{stroke:#788391;stroke-width:1.8;stroke-dasharray:1 6;stroke-linecap:round}.co-route{opacity:0}
.coordinator-routes .co-route>path.co-terminal{stroke-dasharray:none}

.coordinator-human{left:6%;top:50%;z-index:3}.coordinator-human>.badge{--badge-size:90px}
.coordinator-node{left:31%;top:50%;width:104px;height:104px;border-radius:50%;background:#111418;color:white;display:grid;place-items:center;z-index:3}
.coordinator-node>svg:not(.activity-ring){width:67px;height:67px}.coordinator-node .diagram-label{font-size:18px;color:#111214;top:calc(100% + 14px)}
.coordinator-bubble{position:absolute;z-index:5;padding:19px 21px;border-radius:15px;line-height:1.5;font-size:17px;letter-spacing:-.3px;opacity:0;width:244px;border:1px solid #171b21}
.coordinator-bubble small{display:block;font-size:12px;font-weight:500;letter-spacing:0;color:#c0c6cf;margin-bottom:6px}
.coordinator-question:after{content:'';position:absolute;bottom:-12px;left:28px;border-top:15px solid #191b20;border-right:16px solid transparent}
.coordinator-response{width:290px;font-size:16px}.coordinator-response:after{content:'';position:absolute;top:-12px;right:38%;border-bottom:15px solid #191b20;border-left:16px solid transparent}
.role-group{position:absolute;left:59%;width:41%;height:112px;padding:14px 15px 16px;border:1.25px solid #bdc5d0;border-radius:16px;background:#fbfcfd;z-index:3}
.role-group[data-group="1"]{top:0}.role-group[data-group="2"]{top:141px}.role-group[data-group="3"]{top:282px}.role-group[data-group="4"]{top:423px}
.role-group[data-selected="true"]{border-color:#8795a7;background:#fafcfd}
.role-heading{font-size:15px;font-weight:550;line-height:1.3;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:8px}.role-heading>span{font-size:11px;font-weight:450;color:#637084;white-space:nowrap}
.role-agents{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;align-items:center}.role-agents .agent-node{--badge-size:52px}
.coordinator-controls{display:flex;align-items:center;gap:14px;font-size:13px;color:#566378;margin-top:15px}.coordinator-controls .motion-toggle{width:33px;height:33px}
@media(min-width:1450px){.role-agents .agent-node{--badge-size:58px}.role-group{height:118px;padding:15px 17px}.role-heading{font-size:16px}.coordinator-human>.badge{--badge-size:100px}.coordinator-node{width:112px;height:112px}.coordinator-node>svg:not(.activity-ring){width:74px;height:74px}}
@media(max-width:1200px) and (min-width:901px){.coordinator-stage{height:530px}.role-group{left:58%;width:42%;padding:13px 11px;height:106px}.role-agents{gap:7px}.role-agents .agent-node{--badge-size:42px}.role-heading{font-size:13px}.role-heading>span{font-size:10px}.role-group[data-group="2"]{top:136px}.role-group[data-group="3"]{top:272px}.role-group[data-group="4"]{top:408px}.coordinator-human>.badge{--badge-size:74px}.coordinator-node{width:87px;height:87px}.coordinator-node>svg:not(.activity-ring){width:58px;height:58px}.coordinator-bubble{width:210px;padding:15px 17px;font-size:15px}.coordinator-response{width:245px}.coordinator-node .diagram-label{font-size:16px}}
@media(max-width:900px){.coordinator-visual{max-width:780px;margin:auto}.coordinator-stage{height:550px}}
@media(max-width:620px){
 .coordinator-stage{height:600px}
 .coordinator-human{left:14%;top:210px}.coordinator-human>.badge{--badge-size:65px}
 .coordinator-node{left:54%;top:210px;width:76px;height:76px}.coordinator-node>svg:not(.activity-ring){width:50px;height:50px}.coordinator-node .diagram-label{font-size:14px;top:calc(100% + 10px)}
 .coordinator-bubble{width:100%;max-width:100%;font-size:16px;padding:15px 17px}.coordinator-question:after{left:var(--tail-x,32px)}
 .role-group{left:0;width:48%;height:108px;padding:11px 9px;border-radius:12px}
 .role-group[data-group="1"]{top:328px}.role-group[data-group="2"]{left:52%;top:328px}.role-group[data-group="3"]{top:465px}.role-group[data-group="4"]{left:52%;top:465px}
 .role-heading{font-size:12px;gap:3px;margin-bottom:15px}.role-heading>span{font-size:9px}.role-agents{gap:4px}.role-agents .agent-node{--badge-size:29px}
 .coordinator-response{font-size:15px}.coordinator-response:after{top:auto;bottom:-12px;right:auto;left:var(--tail-x,54%);border-bottom:0;border-top:15px solid #191b20;border-left:16px solid transparent}
 .coordinator-controls{font-size:12px;margin-top:10px}.coordinator-controls .motion-toggle{margin-left:auto}
}
@media(max-width:360px){.role-agents{gap:3px}.role-agents .agent-node{--badge-size:26px}.role-group{padding-inline:8px}.role-heading{font-size:11px}.role-heading>span{font-size:8px}.coordinator-node{width:70px;height:70px}.coordinator-human>.badge{--badge-size:60px}}

.coordinator-human{display:flex;align-items:center;justify-content:center;line-height:0}.role-group{transition:border-color .45s,background .45s}.coordinator-controls{justify-content:space-between}.co-story-title{color:#3f4d60;font-weight:550}.co-story-count{font-size:12px;font-variant-numeric:tabular-nums;color:#6d798b}
@media(max-width:620px){.coordinator-node .diagram-label{left:calc(100% + 12px);top:50%;transform:translateY(-50%);font-size:13px}}

.co-story-title{position:absolute;z-index:3;width:max-content;max-width:180px;transform:translateX(-50%);text-align:center;text-wrap:balance;font-size:15px;font-weight:550;line-height:1.35;color:#3f4d60}
@media(max-width:620px){.co-story-title{font-size:12px}}
