.infrastructure{padding-block:clamp(4rem,6vw,6rem)}
.infrastructure .section-heading{grid-template-columns:1.2fr 1fr;gap:3rem}
.infrastructure .section-heading h2{font-size:clamp(2.2rem,3.8vw,4.2rem)}
.coordination-system{margin:3rem 0 0;background:var(--paper);padding:2rem clamp(1.5rem,4vw,3.5rem);position:relative;min-width:0}
.coordination-header{display:flex;align-items:center;justify-content:space-between;gap:2rem}
.coordination-brand{display:flex;align-items:center;gap:.45rem .5rem;flex-wrap:wrap;max-width:18rem}
.coordination-brand>strong{font:500 1.7rem/1 var(--display)}
.coordination-brand>span{flex-basis:100%;font-size:.8125rem;color:var(--muted)}
.coordination-compatibility{text-align:right}
.coordination-compatibility strong{font:500 1rem/1.4 var(--display);color:var(--accent-ink)}
.coordination-compatibility p{font-size:.875rem;color:var(--muted);margin-top:.3rem}
.coordination-stage{height:370px;max-width:42rem;margin:.5rem auto 0;position:relative;overflow:hidden}
#coordination-canvas{position:absolute;inset:0}#coordination-canvas canvas{width:100%;height:100%;display:block}
.coordination-node-label{position:absolute;left:0;top:0;text-align:center;display:flex;flex-direction:column;line-height:1.4;gap:.15rem;background:var(--paper);padding:.1rem .3rem;opacity:0;pointer-events:none}
.coordination-node-label>strong{font:500 1rem/1.3 var(--display)}.coordination-node-label>span{font-size:.8125rem;color:var(--muted)}
.coordination-edge-label{position:absolute;left:0;top:0;font-size:.875rem;color:var(--accent-ink);background:var(--paper);padding:.1rem .35rem;opacity:0;pointer-events:none}
.coordination-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:1rem;color:var(--accent-ink)}
.coordination-core[data-ready="true"] .coordination-fallback{display:none}
.coordination-system figcaption{font-size:.875rem;color:var(--muted);text-align:center;margin-top:.25rem}
.coordination-mechanisms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,4vw,3rem);margin-top:2.75rem}
.coordination-mechanisms h3{font:500 1.125rem/1.3 var(--display);margin-bottom:.5rem}.coordination-mechanisms p{font-size:.9375rem;color:var(--muted);max-width:30ch}
.coordination-controls{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:2rem;font-size:.875rem}.coordination-controls p{color:var(--ink)}
#coordination-motion{background:none;border:0;padding:0;min-height:44px;color:var(--muted);font:inherit;cursor:pointer;white-space:nowrap}
#coordination-motion:hover{color:var(--accent-ink)}#coordination-motion:active{transform:translateY(1px)}#coordination-motion:focus-visible{outline:3px solid var(--accent-ink);outline-offset:4px}
@media(max-width:49.999rem){
 .infrastructure .section-heading{display:flex;gap:1.5rem}
 .coordination-system{margin-top:2rem;padding:1.5rem}
 .coordination-header{flex-direction:column;gap:1.25rem;text-align:center}
 .coordination-brand{justify-content:center}.coordination-brand>span{text-align:center}
 .coordination-compatibility{text-align:center}.coordination-compatibility p{max-width:27ch}
 .coordination-stage{height:320px;margin-top:.5rem}
 .coordination-mechanisms{grid-template-columns:1fr;margin-top:2.25rem;gap:1.5rem}.coordination-mechanisms p{max-width:none}
 .coordination-controls{align-items:flex-start;flex-wrap:wrap;margin-top:1.5rem}
}
@media(max-width:24rem){.coordination-system{padding:1.5rem .75rem}.coordination-stage{height:290px}.coordination-node-label>strong{font-size:.875rem}.coordination-node-label>span{font-size:.75rem}.coordination-edge-label{font-size:.8125rem;padding:0 .2rem}.coordination-mechanisms,.coordination-controls{margin-inline:.5rem}}
@media(prefers-reduced-motion:reduce){#coordination-motion{display:none}}
html[data-motion="reduce"] #coordination-motion{display:none}
@media print{#coordination-motion{display:none}.coordination-system{break-inside:avoid}}
