/* Seven-node client workspace. The original mobile panel remains unchanged. */
.client-panel{display:none}
.client-visual{min-width:0}
@media(min-width:640px){
 .study-client .client-legacy-panel{display:none}
 .architecture-studies .study-client{height:632px}
 .client-panel{display:flex;height:576px}
 .client-graph{position:relative;flex:0 0 456px;width:100%;height:456px;margin:auto 0;min-width:0}
 .client-connections{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
 .client-line{fill:none;stroke-width:1;stroke-linecap:square;stroke-linejoin:miter}
 .client-line path,.client-junctions circle{vector-effect:non-scaling-stroke}
 .client-line--main{stroke:var(--bronze)}
 .client-line--event{stroke:var(--slate);stroke-dasharray:4 5}
 #client-flow-arrow path{fill:none;stroke:var(--bronze);stroke-width:1}
 #client-event-arrow path{fill:none;stroke:var(--slate);stroke-width:1}
 .client-junctions{fill:var(--paper);stroke:var(--bronze);stroke-width:1}
 .client-nodes{list-style:none;padding:0;margin:0}
 .client-node{position:absolute;left:var(--node-x);top:var(--node-y);transform:translate(-50%,-36px);width:20%;display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
 .client-node--client,.client-node--crm{width:15%}
 .client-node--cabinet{width:19%}
 .client-node--notifications{width:25%}
 .client-node-index{position:absolute;left:3px;top:0;font-size:8px;line-height:12px;color:var(--bronze)}
 .client-node-icon{display:block;width:120px;max-width:100%;height:72px;object-fit:contain}
 .client-node-title{font-family:var(--serif);font-weight:700;color:var(--ink);font-size:23px;line-height:25px;margin-top:2px}
 .client-node-meta{font-size:7px;line-height:12px;color:var(--slate);margin-top:3px;white-space:nowrap;letter-spacing:0}
 .client-connection-label{position:absolute;transform:translateX(-50%);font-size:7px;line-height:12px;color:var(--bronze);background:var(--paper);padding:0 4px;white-space:nowrap}
 .client-connection-label--access{left:18.5%;top:34.5%}
 .client-connection-label--sync{left:70%;top:0;color:var(--slate)}
 .client-connection-label--events{left:41%;top:76.5%;color:var(--slate)}
 .client-connection-label--delivery{left:12%;top:68%;color:var(--slate)}
 .client-legend{display:flex;justify-content:space-between;gap:12px;padding-top:12px;margin-top:8px;border-top:1px solid var(--rule);font-size:8px;line-height:12px;color:var(--slate)}
 .client-legend>span{display:flex;gap:8px;align-items:center}
 .client-legend i{display:block;width:22px;border-top:1px solid var(--bronze)}
 .client-legend .client-legend-dashed{border-top:1px dashed var(--slate)}
 .client-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
}
@media(min-width:1200px){.architecture-studies{height:1984px}}
@media(min-width:640px) and (max-width:1199px){
 .architecture-studies .study-client{height:auto;grid-template-columns:1fr;gap:28px}
 .study-client .study-copy{min-height:0;padding-top:0;display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
 .study-client .study-copy>.eyebrow{grid-column:1/-1}
 .study-client h3{grid-column:1;grid-row:2;margin-top:12px;min-height:0}
 .study-client .study-copy>p:not(.eyebrow){grid-column:2;grid-row:2;margin-top:12px}
 .study-client .study-copy .tags{position:static;grid-column:1/-1;display:block;margin-top:24px}
 .client-node-title{font-size:22px;line-height:25px}
}
@media(min-width:640px) and (max-width:760px){
 .client-node-title{font-size:19px;line-height:23px}
 .client-node-meta{font-size:6px;line-height:11px}
 .client-node-index{font-size:7px;left:0}
 .client-connection-label{font-size:6px;padding-inline:2px}
 .client-legend{font-size:7px}
}