.hero-system .system-scene{position:relative;width:105%;aspect-ratio:3/2;isolation:isolate}
.hero-system .system-scene img{width:100%;height:100%;max-height:none;object-fit:contain}
.system-light{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.system-building{opacity:0;transition:opacity .35s ease;stroke:#f5d7ac;stroke-width:3;fill:none}
.system-building.is-lit{opacity:.9}
.system-building .system-window{fill:#f5d7ac;fill-opacity:.42;stroke-width:2}
.system-wire{stroke:#fff1d7;stroke-width:6;stroke-linecap:round;stroke-dasharray:20 100;stroke-dashoffset:20;opacity:0}
.system-wire.is-flowing{opacity:1;animation:system-transmit 1.25s ease-in-out both}
@keyframes system-transmit{0%{stroke-dashoffset:20;opacity:0}20%{opacity:1}80%{opacity:1}100%{stroke-dashoffset:-100;opacity:0}}
.system-hotspots{position:absolute;inset:0}
.system-node{position:absolute;border:0;background:transparent;color:var(--chalk);cursor:pointer;min-width:44px;min-height:44px;padding:0;border-radius:3px}
.system-node-people{left:18%;top:13%;width:21%;height:33%}
.system-node-processes{left:59%;top:17%;width:19%;height:31%}
.system-node-systems{left:58%;top:56%;width:18%;height:31%}
.system-node-improvement{left:39%;top:37%;width:19%;height:19%}
.system-node span{position:absolute;left:50%;top:0;transform:translate(-50%,-100%);background:var(--slate-deep);border:1px solid var(--mineral);padding:4px 10px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .15s}
.system-node:hover span,.system-node:focus-visible span{opacity:1}
.system-node:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
.hero-system .system-caption{position:static;text-align:left;margin:0 0 0 6%;font-size:12px;color:var(--mineral)}
.system-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.system-pause{font:inherit;color:var(--chalk);background:none;border:0;text-decoration:underline;text-underline-offset:4px;cursor:pointer;min-height:44px;padding:0 4px}
.system-pause:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
.system-description{font-size:14px;line-height:1.45;min-height:3em;margin:0;color:var(--chalk);max-width:44ch}
@media(max-width:700px){.hero-system .system-scene{width:100%}.hero-system .system-caption{margin:0}.system-description{font-size:13px}}
@media(prefers-reduced-motion:reduce){.system-wire.is-flowing{animation:none;opacity:.7;stroke-dasharray:none}.system-building{transition:none}}