/* Section 02: a single explanatory drawing, with a calm reading surface. */
.architecture-console.architecture-map{--rule:#91b8e334;--rule-active:#b9d9ff;background:#07182e;color:#edf4ff;border:var(--hairline) solid var(--rule);overflow:hidden}
.architecture-map .console-top{padding:17px 28px;background:#091b32;border-color:var(--rule);font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.architecture-map .console-top>span{color:#94aecf}
.architecture-map .console-top>span:first-child{display:flex;align-items:center;gap:10px;color:#c4d9f5}
.architecture-map .console-top>span:first-child::before{content:'';width:4px;height:4px;background:#9ecbff}
.architecture-map .architecture-tabs{position:relative;isolation:isolate;border-color:var(--rule)}
.architecture-map .architecture-tabs button{display:flex;align-items:center;gap:15px;min-height:72px;padding:18px 28px;background:#0a1d34;border-color:var(--rule);color:#94b0d3}
.architecture-map .architecture-tabs button>span{margin:0;font-size:11px;letter-spacing:.06em;color:#7294be}
.architecture-map .architecture-tabs button strong{font-size:16px;letter-spacing:-.01em;font-weight:500;color:inherit}
.architecture-map .architecture-tabs button[aria-selected=true]{background:#12304e;color:#edf6ff}
.architecture-map .architecture-tabs button[aria-selected=true]>span{color:#a7cfff}
.architecture-map .architecture-tabs button:hover{background:#102b48;color:#edf6ff}
.architecture-map .architecture-tabs button::after,.architecture-map .architecture-tabs button::before{display:none}
.architecture-map :is(button,[role=tabpanel]):focus-visible{outline:2px solid #a9d1ff;outline-offset:-4px}
.architecture-map .architecture-cursor,.architecture-map .architecture-cursor::before,.architecture-map .architecture-cursor::after{background:#b9d9ff;box-shadow:none}
.architecture-map .architecture-workspace{display:block}
.architecture-map .architecture-cutaway{position:relative;max-width:none;padding:0;margin:0;background:radial-gradient(ellipse at 50% 48%,#22528436,transparent 54%);overflow:hidden}
.architecture-map .architecture-cutaway::before{content:'';position:absolute;inset:24px;pointer-events:none;background:linear-gradient(#97c2f333,#97c2f333) left top/20px 1px no-repeat,linear-gradient(#97c2f333,#97c2f333) left top/1px 20px no-repeat,linear-gradient(#97c2f333,#97c2f333) right bottom/20px 1px no-repeat,linear-gradient(#97c2f333,#97c2f333) right bottom/1px 20px no-repeat}
.architecture-map .architecture-vector{display:block;width:100%;height:auto;aspect-ratio:1200/430;overflow:hidden;touch-action:pan-y}
.architecture-map .architecture-vector path{fill:none;stroke:#789dca;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.architecture-map .architecture-vector circle{vector-effect:non-scaling-stroke}
.architecture-map .map-step{cursor:pointer}
.architecture-map .map-rail{stroke:#84a9da;opacity:.27}
.architecture-map .map-route{stroke:#84a9da;opacity:.3}
.architecture-map .map-port{fill:#0a1b32;stroke:#a1c8fa;stroke-width:1}
.architecture-map .map-heading{fill:#7897c0;font-size:var(--map-heading-size,12px);letter-spacing:.1em;font-weight:500}
.architecture-map .map-label{fill:#acbfd9;font-size:var(--map-label-size,18px);font-weight:400;letter-spacing:-.015em}
.architecture-map .map-core-label{fill:#c3d7f3;font-size:var(--map-core-size,22px);font-weight:500;letter-spacing:-.02em}
.architecture-map .map-note{fill:#8ba7cb;font-size:var(--map-note-size,13px);letter-spacing:.015em}
.architecture-map .map-policy-note{fill:#8099bb;font-size:var(--map-policy-size,12px)}
.architecture-map .architecture-vector .map-plane{fill:#2863a91c;stroke:#7cabe8;opacity:.7}
.architecture-map .map-plane-rear{stroke:#719ed8;opacity:.24}
.architecture-map .map-grid{stroke:#91bbf3;opacity:.16}
.architecture-map .map-read-line{stroke:#96c3ff;opacity:.58}
.architecture-map .map-interpretation{stroke:#8abbfd;opacity:.4}
.architecture-map .map-lens-point{fill:#0a1e36;stroke:#9cc6ff;stroke-width:1}
.architecture-map .map-core-port{fill:#122d4e;stroke:#b8d8ff;stroke-width:1}
.architecture-map .map-step.is-selected .map-label,.architecture-map .map-step.is-selected .map-core-label{fill:#f0f6ff}
.architecture-map .map-step.is-selected .map-heading{fill:#9fcaff}
.architecture-map .map-step.is-selected .map-rail{opacity:.65;stroke:#9dc5f7}
.architecture-map .map-step.is-selected .map-route{opacity:.65;stroke:#80b6fc}
.architecture-map .map-step.is-selected .map-port{fill:#b4d5ff}
.architecture-map .map-step.is-selected .map-plane{fill:#376bb72b;stroke:#b8d8ff;opacity:1}
.architecture-map .map-step.is-selected .map-lens-point{fill:#b6d7ff}
.architecture-map .map-step.is-selected .map-read-line{opacity:1}
.architecture-map .architecture-vector .map-signal{stroke:#c8e2ff;stroke-width:1.4;stroke-dasharray:3 97;opacity:0}
.architecture-map .architecture-vector.is-in-view .map-step.is-selected .map-signal{animation:architecture-packet 4s linear infinite;animation-delay:var(--signal-delay)}
@keyframes architecture-packet{0%{stroke-dashoffset:100;opacity:0}12%,72%{opacity:.9}100%{stroke-dashoffset:0;opacity:0}}
.architecture-map .architecture-map-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:5px 28px 20px;color:#839fc3;font-size:10px;line-height:1.6;letter-spacing:.025em;border:0}
.architecture-map .architecture-map-caption span:first-child{display:flex;align-items:center;gap:9px}
.architecture-map .architecture-map-caption span:first-child::before{content:'';height:1px;width:20px;background:#8bbaff}
.architecture-map .architecture-panels{border-left:0;border-top:var(--hairline) solid var(--rule);background:#0a1c33;align-items:stretch;perspective:none}
.architecture-map .architecture-panels article{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.3fr);align-content:start;gap:36px;padding:30px 40px;min-height:235px;transform-origin:50% 50%}
.architecture-map .architecture-panels h3{font-size:clamp(24px,2.5vw,31px);font-weight:500;line-height:1.25;color:#eaf3ff;margin:0;max-width:380px;letter-spacing:-.03em}
.architecture-map .architecture-panels p{font-size:14px;line-height:1.9;color:#aec3df;max-width:650px;margin:0}
.architecture-map .architecture-panels .architecture-contract{margin-top:18px;padding-top:15px;border-color:var(--rule);font-size:12px!important;color:#a3bedd}
.architecture-map .architecture-contract span{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#84b4f6;margin-bottom:5px}
.architecture-map .architecture-panels article::after{display:none}
.architecture-map .architecture-scan{top:0;bottom:auto;left:0;width:1px;height:100%;background:linear-gradient(transparent,#b6d8ff,transparent);box-shadow:none}
.architecture-map .architecture-scan::before,.architecture-map .architecture-scan::after{display:none}
@media(max-width:950px){
 .architecture-map .architecture-tabs button{padding:18px 22px;gap:13px}
 .architecture-map .architecture-panels article{padding:28px;gap:28px;grid-template-columns:.8fr 1.2fr}
 .architecture-map .architecture-panels h3{font-size:26px}
}
@media(max-width:800px){
 .architecture-map .architecture-panels article{grid-template-columns:1fr;gap:18px;min-height:0}
 .architecture-map .architecture-panels h3 br{display:none}
}
@media(max-width:700px){
 .architecture-console.architecture-map{margin-inline:calc(-1*var(--gutter));border-inline:0}
 .architecture-map .console-top{padding:17px var(--gutter);font-size:9px;letter-spacing:.04em}
 .architecture-map .console-top>span:last-child{max-width:none}
 .architecture-map .architecture-tabs button{justify-content:center;min-height:66px;padding:16px 10px;gap:10px}
 .architecture-map .architecture-tabs button strong{font-size:14px}.architecture-map .architecture-tabs button>span{font-size:10px}
 .architecture-map .architecture-map-caption{padding:7px var(--gutter) 22px;font-size:10px}
 .architecture-map .architecture-cutaway::before{inset:17px}
 .architecture-map .architecture-panels article{padding:26px var(--gutter);gap:18px}
 .architecture-map .architecture-panels h3{font-size:25px}
 .architecture-map .architecture-panels p{font-size:14px;line-height:1.9}
}
.architecture-map .architecture-vector.is-compact{aspect-ratio:600/840}
.architecture-map .is-compact .map-label{font-size:26px}
.architecture-map .is-compact .map-heading{font-size:19px;letter-spacing:.07em}
.architecture-map .is-compact .map-core-label{font-size:29px}
.architecture-map .is-compact .map-note{font-size:21px}.architecture-map .is-compact .map-policy-note{font-size:19px}
@media(max-width:360px){.architecture-map .architecture-tabs button{padding-inline:8px;gap:8px}.architecture-map .architecture-tabs button strong{font-size:13px}.architecture-map .architecture-map-caption{font-size:9px;gap:10px}}
.motion-paused .architecture-map .map-signal,.page-inactive .architecture-map .map-signal{animation:none!important;opacity:0!important}
@media(prefers-reduced-motion:reduce){.architecture-map .map-signal{animation:none!important;opacity:0!important}.architecture-map *{transition:none!important}}
@media(forced-colors:active){
 .architecture-console.architecture-map{--rule:CanvasText;background:Canvas;color:CanvasText}
 .architecture-map .console-top,.architecture-map .architecture-panels,.architecture-map .architecture-tabs button{background:Canvas;color:CanvasText}
 .architecture-map .architecture-tabs button[aria-selected=true]{background:Highlight;color:HighlightText}
 .architecture-map .architecture-vector{forced-color-adjust:none;background:#07182e}
 .architecture-map .console-top>span,.architecture-map .architecture-panels :is(h3,p,span),.architecture-map .architecture-map-caption{color:CanvasText}
}
