.architecture-diagram{border:1px solid #39434d;border-radius:14px;background:radial-gradient(ellipse at 50% 0,#28334055,transparent 70%),#13171b;overflow:hidden;box-shadow:0 25px 80px #0003}
.architecture-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 25px;border-bottom:1px solid #303944;background:#1c2229aa;color:#a8bac9;font-size:.68rem;letter-spacing:.07em}.architecture-legend{display:flex;gap:21px;font-size:.67rem;letter-spacing:0}.architecture-legend>span{display:flex;align-items:center;gap:8px}.architecture-legend i{width:20px;height:0;border-top:1px solid #8eb8cd}.architecture-legend i.dashed{border-top-style:dashed;border-top-color:#b4acd3}
.architecture-flow{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:42px;list-style:none;margin:0;padding:32px 25px 24px}.architecture-stage{position:relative;min-width:0;margin:0;border:1px solid #3d4e5c;border-radius:9px;background:#192128;padding:20px 18px 16px}.arch-stage-label{font-size:.56rem;letter-spacing:.08em;line-height:1.6;color:#9bb1c1;margin-bottom:22px}.arch-stage-label .mono{margin-right:9px;color:#d2e6f2}.arch-node-title{display:flex;align-items:center;gap:10px;margin-bottom:11px}.arch-node-title svg{flex:none;color:#b0c9dd}.arch-node-title h3{font-size:1.1rem;line-height:1.3;margin:0;letter-spacing:-.025em}.arch-node-title>span{margin-left:auto;color:#889eaf;font-size:.85rem}.arch-node-title:hover h3{text-decoration:underline;text-underline-offset:4px}.arch-stack{font-size:.65rem;color:#94a7b6;margin-bottom:25px}.arch-components{display:grid;gap:7px}.arch-components a{display:flex;justify-content:space-between;align-items:center;gap:8px;border:1px solid #344552;background:#121a20;border-radius:4px;padding:10px;font-size:.69rem;color:#c8d6e1;line-height:1.45;min-height:42px}.arch-components a>span{color:#7f9db2}.arch-components a:hover{border-color:#809bae;background:#233340}.arch-stage-note{font-size:.67rem;color:#a3b2bf;line-height:1.7;margin:20px 0 0}.arch-stage-note a{color:#c5dbde;text-decoration:underline;text-underline-offset:3px}
.arch-connector{position:absolute;left:calc(100% + 1px);top:44%;width:42px;color:#a2bbc9;text-align:center}.arch-connector span{font-size:.49rem;letter-spacing:.04em}.arch-connector svg{display:block;width:100%;height:16px;fill:none;stroke:#799aa9;stroke-width:1.3}.arch-compile{background:linear-gradient(160deg,#232c3e,#1c242e);border-color:#495876}.arch-compile .arch-node-title svg{color:#b7bee2}.arch-target{background:linear-gradient(150deg,#20353388,#192629);border-color:#40635e}.arch-target .arch-node-title svg{color:#aad3c5}.arch-runtime-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.arch-runtime-grid span{background:#132522;border:1px solid #35544e;padding:8px 7px;font-size:.62rem;border-radius:4px;color:#c1dbd2;line-height:1.4}.arch-platform{border:1px solid #537e70;border-radius:6px;background:#233e33;margin-top:15px;padding:11px 10px;display:grid;grid-template-columns:7px 1fr;align-items:center;gap:5px 8px}.arch-platform strong{font-size:.77rem;line-height:1.4;font-weight:500}.arch-platform>span:last-child{grid-column:2;color:#b1cdbf;font:400 .63rem Consolas,monospace}.arch-target-led{width:6px;height:6px;border-radius:50%;background:#b1ebca}
.arch-horizon{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:2px 25px 27px;align-items:center}.arch-horizon-copy{padding:15px 0 0}.arch-horizon-copy .mono{font-size:.57rem;letter-spacing:.08em;color:#8d9eac}.arch-horizon-copy p{font-size:.83rem;color:#bbc6d0;max-width:340px;margin:10px 0 0}.arch-future{position:relative;display:flex;align-items:center;gap:22px;border:1px dashed #68647c;border-radius:8px;padding:20px;background:linear-gradient(120deg,#252232aa,#1c1c2680)}.arch-future:before{content:'';position:absolute;height:26px;bottom:100%;left:28px;border-left:1px dashed #827496}.arch-future>div{display:flex;flex-direction:column;gap:8px}.arch-future .mono{font-size:.55rem;letter-spacing:.11em;color:#b2a9c6}.arch-future strong{font:500 1.1rem/1.3 var(--heading);color:#e1dcec}.arch-future>div>span:last-child{font-size:.69rem;color:#b2a9c3}.arch-signal{display:flex;align-items:center;gap:4px;height:35px;flex:none}.arch-signal i{display:block;width:3px;height:10px;border-radius:2px;background:#aaa0c8}.arch-signal i:nth-child(2),.arch-signal i:nth-child(4){height:23px;opacity:.7}.arch-signal i:nth-child(3){height:35px;opacity:.9}.architecture-diagram>figcaption{font-size:.71rem;line-height:1.8;color:#9fafbd;padding:17px 25px;margin:0;border-top:1px solid #303944;background:#14191eee}.architecture-diagram>figcaption strong{color:#c3d4db;font-weight:500}.architecture-links{display:flex;flex-wrap:wrap;gap:28px;margin-top:25px}
@media(max-width:1050px){.architecture-flow{gap:28px;padding-inline:18px}.architecture-stage{padding:18px 12px 14px}.arch-connector{width:28px}.arch-node-title{gap:7px}.arch-node-title h3{font-size:.96rem}.arch-node-title svg{width:19px;height:19px}.arch-stack{font-size:.6rem}.arch-runtime-grid{grid-template-columns:1fr}.arch-runtime-grid span{padding:6px 8px}}
@media(max-width:760px){.architecture-flow{grid-template-columns:1fr;gap:40px;padding:22px 18px}.architecture-stage{padding:20px}.arch-stage-label{margin-bottom:16px}.arch-node-title h3{font-size:1.15rem}.arch-stack{font-size:.7rem;margin-bottom:20px}.arch-components a{font-size:.76rem}.arch-stage-note{font-size:.7rem}.arch-runtime-grid{grid-template-columns:1fr 1fr}.arch-runtime-grid span{font-size:.7rem;padding:9px}.arch-connector{left:calc(50% - 14px);top:100%;height:40px;width:28px;display:flex;align-items:center}.arch-connector span{position:absolute;left:30px;top:15px;font-size:.57rem}.arch-connector svg{transform:rotate(90deg);width:38px;height:20px;flex:none}.arch-platform{padding:13px}.arch-platform strong{font-size:.88rem}.arch-horizon{grid-template-columns:1fr;gap:20px;padding-inline:18px}.arch-horizon-copy{order:2;padding:0 3px}.arch-horizon-copy p{max-width:none;font-size:.77rem}.arch-future:before{left:50%;height:23px}.architecture-bar{padding:17px 18px;align-items:flex-start;flex-direction:column;gap:13px}.architecture-legend{gap:20px;font-size:.63rem}.architecture-diagram>figcaption{padding:16px 18px}.architecture-links{gap:20px}}