.system-hero{margin:0;width:100%;min-width:0}
.system-scene{position:relative;width:100%;height:480px;isolation:isolate}
.system-routes,.system-tools{position:absolute;inset:0;width:100%;height:100%}
.system-routes{overflow:visible}
.system-route{stroke:var(--blue-rule);stroke-width:1.5;opacity:.58;vector-effect:non-scaling-stroke}
.system-active{stroke:var(--blue-bright);stroke-width:3.2;vector-effect:non-scaling-stroke;opacity:0}
.system-packet{fill:var(--blue-soft);stroke:var(--blue-bright);stroke-width:1.5;vector-effect:non-scaling-stroke}
.system-tool{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;width:72px;z-index:2}
.system-tool>span{display:grid;place-items:center;width:46px;height:46px;border:1px solid var(--paper);border-radius:12px;background:var(--paper);box-shadow:0 8px 16px -8px #0006}
.system-tool img{display:block;object-fit:contain;width:29px;height:29px}
.system-tool small{font-size:12px;line-height:1.3;white-space:nowrap;color:var(--muted)}
.system-core{position:absolute;left:50%;top:49.3%;width:54%;min-height:164px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px 16px;transform:translate(-50%,-50%);z-index:3;pointer-events:none}
.system-sas-brand,.system-openai-brand{position:relative;display:flex;align-items:center;justify-content:center;gap:14px;width:100%;background:var(--charcoal)}
.system-sas-brand::before,.system-sas-brand::after,.system-openai-brand::before,.system-openai-brand::after{content:'';position:absolute;top:calc(50% - 3px);left:-3px;width:6px;height:6px;border-radius:50%;background:var(--blue-bright)}
.system-sas-brand::after,.system-openai-brand::after{left:auto;right:-3px}
.system-backbone{stroke:var(--blue-bright);stroke-width:2.5;opacity:.85}
.system-sas-brand>img{display:block;width:52px;height:auto}
.system-sas-brand .system-sas-name{width:min(190px,calc(100% - 66px));height:auto}
.system-openai-brand>img{display:block;width:42px;height:auto}
.system-openai-brand .system-openai-name{width:min(154px,calc(100% - 56px));height:auto}
.system-brand-divider{width:100%;height:22px}
.system-flow-0{--flow-delay:0s}.system-flow-1{--flow-delay:3.6s}.system-flow-2{--flow-delay:7.2s}
.system-source>span{animation:system-source 10.8s linear var(--flow-delay) infinite;animation-play-state:paused}
.system-target>span{animation:system-target 10.8s linear var(--flow-delay) infinite;animation-play-state:paused}
.system-journey{animation:system-journey 10.8s linear var(--flow-delay) infinite;animation-play-state:paused}
.system-hero[data-motion=playing] .system-tool>span,.system-hero[data-motion=playing] .system-active{animation-play-state:running}
.system-hero figcaption{text-align:center;min-height:44px}
.system-motion{min-height:44px;padding:10px 16px;border:0;background:transparent;color:var(--muted);font-size:14px;line-height:1.5;text-decoration:underline;text-underline-offset:4px}
.system-motion:hover{color:var(--text)}
@keyframes system-source{0%,14%,100%{background:var(--paper);border-color:var(--paper)}3%,8%{background:var(--blue-soft);border-color:var(--blue-bright)}}
@keyframes system-target{0%,19%,33%,100%{background:var(--paper);border-color:var(--paper)}23%,28%{background:var(--blue-soft);border-color:var(--blue-bright)}}
@keyframes system-journey{0%,31%,100%{opacity:0}2%,29%{opacity:1}}
@media(max-width:960px){.system-hero{max-width:700px;justify-self:center}.system-scene{height:480px}}
@media(max-width:720px){.system-scene{height:440px}.system-tool{width:60px;gap:6px}.system-tool>span{width:38px;height:38px}.system-tool img{width:25px;height:25px}.system-tool small{font-size:11px}.system-core{width:56%;min-height:138px;padding:14px 8px;gap:8px}.system-sas-brand,.system-openai-brand{gap:8px}.system-sas-brand>img{width:38px}.system-sas-brand .system-sas-name{width:min(132px,calc(100% - 46px))}.system-openai-brand>img{width:31px}.system-openai-brand .system-openai-name{width:min(122px,calc(100% - 39px))}}
@media(prefers-reduced-motion:reduce){.system-tool>span,.system-active{animation:none}.system-packet{display:none}}
