/* Spatial architecture, scoped to the system chapter. */
.ap-system-stage .ap-system-top,.ap-system-stage .ap-system-bottom{color:#737d69;border-color:#68785b33}
.ap-system-stage .ap-system-count{color:#4e7044}
.ap-system-stage .ap-system-fallback span{border:1px dashed #82907566;background:transparent;color:#355039}
.ap-system-stage .ap-layer-controls button[aria-pressed=true]{background:#e7ebdd;color:#38552b;border-color:#839573}
.ap-home .ap-system-step>div{position:relative;border:1px dashed #7c88733b;padding:30px;opacity:.55;transition:opacity .5s,background-color .5s}
.ap-home .ap-system-step.active>div{background:#edf0e580;opacity:1}
.ap-home .ap-system-step>div:before,.ap-home .ap-system-step>div:after{content:"";position:absolute;inset:-1px;pointer-events:none;background:linear-gradient(#5f7357,#5f7357) left top/6px 1px no-repeat,linear-gradient(#5f7357,#5f7357) left top/1px 6px no-repeat,linear-gradient(#5f7357,#5f7357) right bottom/6px 1px no-repeat,linear-gradient(#5f7357,#5f7357) right bottom/1px 6px no-repeat}
.ap-home .ap-system-step>div:after{transform:scaleX(-1)}
@media(max-width:760px){.ap-home .ap-system-step>div{padding:24px}.ap-home .ap-system-step h3{font-size:30px}.ap-system-stage{height:420px}.ap-system-stage #reference-stack-scene{inset:32px -25px 58px}}
@media(max-width:360px){.ap-system-stage{height:375px}.ap-home .ap-system-step>div{padding:20px}}
@media(prefers-reduced-motion:reduce){.ap-home .ap-system-step>div{transition:none}}