#appShell .nav-group-trigger[aria-expanded="true"]{color:#fff}#appShell .nav-group-trigger[aria-expanded="true"]::before{opacity:.62;transform:translateX(-50%) scale(1)}
.nav-submenu{position:fixed;z-index:140;left:4.25rem;width:17rem;padding:.55rem;border:1px solid #dbe6e2;border-radius:12px;background:#fff;box-shadow:0 16px 42px rgba(17,29,46,.18);opacity:0;visibility:hidden;transform:translateX(-6px) scale(.98);transform-origin:left center;transition:opacity .16s ease,transform .16s ease,visibility .16s}
.nav-submenu.is-open{opacity:1;visibility:visible;transform:none}
.nav-submenu header{display:grid;gap:.15rem;padding:.65rem .7rem .75rem;border-bottom:1px solid #e6edea}.nav-submenu header strong{color:#1e293b;font-size:.82rem}.nav-submenu header span{color:#64748b;font-size:.68rem}
.nav-submenu button{width:100%;min-height:3.55rem;display:grid;grid-template-columns:2rem minmax(0,1fr);align-items:center;gap:.65rem;padding:.55rem .65rem;border:0;border-radius:8px;background:transparent;color:#475569;text-align:left;cursor:pointer}.nav-submenu button:hover,.nav-submenu button.is-active{background:#e7f3ef;color:#334155}.nav-submenu button:focus-visible{outline:3px solid #334155;outline-offset:1px}.nav-submenu button>svg{width:1rem;height:1rem;justify-self:center}.nav-submenu button span{display:grid;gap:.12rem}.nav-submenu button b{font-size:13px}.nav-submenu button small{color:#64748b;font-size:11px;line-height:1.35}.nav-submenu button.is-active small{color:#475569}
.architecture-page-shell{max-width:86rem;margin:0 auto;padding:2.2rem}.architecture-page-shell>header{padding-bottom:1.3rem;border-bottom:1px solid #dbe6e2}.architecture-page-shell h1{margin:0;color:#1e293b;font-size:clamp(26px,2.4vw,36px);letter-spacing:-.025em}.architecture-page-shell p{max-width:70ch;margin:.55rem 0 0;color:#64748b;line-height:1.65}.architecture-boundary{min-height:18rem;display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:1.3rem;border:1px dashed #c7d7d1;border-radius:12px;background:#f7faf8;color:#475569}.architecture-boundary>svg{width:2rem;height:2rem;color:#334155}.architecture-boundary>div{display:grid;gap:.3rem}.architecture-boundary strong{color:#1e293b;font-size:17px}.architecture-boundary span{font-size:13px}
@media(max-width:820px){.nav-submenu{left:3.95rem;width:min(17rem,calc(100vw - 4.5rem))}.architecture-page-shell{padding:1.2rem}.architecture-boundary{min-height:14rem;padding:1.5rem;align-items:flex-start;justify-content:flex-start}}@media(prefers-reduced-motion:reduce){.nav-submenu{transition:none}}
html[dir="rtl"] .nav-submenu{transform-origin:right center}