/* V19 mobile network workspace: preserve the engineering canvas, change how it is viewed. */
.mobile-network-hint,.mobile-network-tools,.mobile-sheet-handle{display:none}
@media(max-width:900px){
 html,body{max-width:100%;overflow-x:hidden}
 body.mobile-network-page{--mobile-sheet-height:min(56svh,560px);padding-bottom:72px}
 .mobile-network-page .top{position:sticky;top:0;z-index:70}
 .mobile-network-page .identity-logo,.mobile-network-page .top .identity-logo{width:158px!important;max-height:53px!important}
 .mobile-network-page .demo-guide{padding:8px 10px}.mobile-network-page .demo-guide span{font-size:10px}.mobile-network-page .demo-guide b{font-size:9px}
 .mobile-network-page .head{gap:8px;margin-bottom:8px}.mobile-network-page .head h1{font-size:17px}.mobile-network-page .head p{font-size:10px;line-height:1.4}
 .mobile-network-page .controls{display:flex;width:100%;overflow-x:auto;scrollbar-width:none;gap:6px}.mobile-network-page .controls::-webkit-scrollbar{display:none}.mobile-network-page .controls>*{flex:0 0 auto;white-space:nowrap}
 .mobile-network-page .metrics{display:flex!important;overflow-x:auto;scroll-snap-type:x proximity;gap:6px;padding-bottom:4px;scrollbar-width:none}.mobile-network-page .metrics::-webkit-scrollbar{display:none}.mobile-network-page .metric{flex:0 0 142px;scroll-snap-align:start;padding:8px 9px}.mobile-network-page .metric strong{font-size:13px}.mobile-network-page .metric span{font-size:9px;line-height:1.35;white-space:normal}
 .mobile-network-page .alerts{font-size:10px;padding:7px 9px;margin-bottom:7px}
 .mobile-network-page .network{overflow:visible!important;border-radius:10px;position:relative}
 .mobile-network-page .network-head{min-height:42px;padding:8px 10px;gap:6px;font-size:11px}.mobile-network-page .network-head>span+span{display:none}.mobile-network-page .mode-switch{margin-left:auto}
 .mobile-network-page .scenarios{padding:7px 8px}.mobile-network-page .scenario{font-size:10px;padding:7px 9px}
 .mobile-network-viewport{position:relative;height:52svh;min-height:340px;max-height:620px;overflow:auto!important;overscroll-behavior:contain;touch-action:pan-x pan-y;background:#0c161c;scroll-behavior:smooth;scrollbar-width:thin}
 .mobile-network-page .canvas-scroll.mobile-network-viewport{height:52svh}
 .mobile-network-page .canvas{transform-origin:0 0;transition:zoom .18s ease;max-width:none!important}
 .mobile-network-tools{display:flex;position:sticky;left:8px;bottom:8px;width:max-content;z-index:25;gap:5px;padding:5px;background:#09151ddd;border:1px solid #57717d;border-radius:10px;backdrop-filter:blur(10px);box-shadow:0 8px 24px #0008}
 .mobile-network-tools button{min-width:38px;height:36px;border:1px solid #49616e;border-radius:7px;background:#142832;color:#e8f0f2;font-size:12px;font-weight:800;padding:0 9px}
 .mobile-network-tools button[data-mobile-action="fit"]{color:#102029;background:#d9b775;border-color:#d9b775}
 .mobile-network-tools button[data-mobile-action="focus"]{min-width:86px}
 .mobile-network-hint{display:block;position:sticky;left:8px;top:8px;z-index:22;width:max-content;max-width:calc(100vw - 55px);padding:6px 9px;border-radius:99px;background:#071219d9;color:#bed0d7;border:1px solid #49616e;font-size:9px;pointer-events:none}
 .mobile-network-page aside{display:block!important;position:fixed!important;left:0;right:0;bottom:0;z-index:80;height:calc(var(--mobile-sheet-height) - 58px);max-height:none!important;overflow:auto!important;border:1px solid #57717d!important;border-bottom:0!important;border-radius:18px 18px 0 0;background:#101f28!important;box-shadow:0 -18px 55px #000b;transform:translateY(100%);transition:transform .28s ease;padding:14px 13px 18px!important;color:#edf3f5}
 .mobile-network-page aside.mobile-sheet-open{transform:translateY(0)}
 .mobile-sheet-handle{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:81;height:58px;border:1px solid #57717d;border-bottom:0;border-radius:16px 16px 0 0;background:#142832;color:#eef3f4;align-items:center;justify-content:space-between;padding:0 18px;font-size:12px;font-weight:800;transition:bottom .28s ease}
 .mobile-sheet-handle.mobile-sheet-handle-open{bottom:calc(var(--mobile-sheet-height) - 58px)}
 .mobile-sheet-handle:before{content:'';position:absolute;width:44px;height:4px;left:calc(50% - 22px);top:8px;border-radius:5px;background:#718995}
 .mobile-sheet-handle span{color:#d9b775}.mobile-sheet-handle small{font-size:10px;color:#a9bbc2;font-weight:500}
 .mobile-network-page aside .aside-inner{display:block!important;max-height:none!important;padding:0!important}
 .mobile-network-page aside .aside-head{display:none}
 .mobile-network-page aside .section{margin-top:12px!important}
 .mobile-network-page .toast{left:12px!important;right:12px!important;bottom:82px!important;max-width:none!important}
 .mobile-network-page.mobile-fullscreen{position:fixed;inset:0;z-index:100;background:#07141c;overflow:hidden;padding:0}
 .mobile-network-page.mobile-fullscreen .top,.mobile-network-page.mobile-fullscreen .demo-guide,.mobile-network-page.mobile-fullscreen .head,.mobile-network-page.mobile-fullscreen .metrics,.mobile-network-page.mobile-fullscreen .alerts,.mobile-network-page.mobile-fullscreen .network-guide{display:none!important}
 .mobile-network-page.mobile-fullscreen main{padding:0!important}.mobile-network-page.mobile-fullscreen .network{border:0;border-radius:0}.mobile-network-page.mobile-fullscreen .network-head,.mobile-network-page.mobile-fullscreen .scenarios{display:none}
 .mobile-network-page.mobile-fullscreen .mobile-network-viewport{height:100svh!important;max-height:none;border-radius:0}
 .mobile-network-page.mobile-fullscreen aside,.mobile-network-page.mobile-fullscreen .mobile-sheet-handle{display:none!important}
 .mobile-network-page.mobile-fullscreen .mobile-network-tools{position:fixed;left:8px;bottom:8px}
}
@media(max-width:620px){
 .mobile-network-page .top{min-height:64px;padding:6px 9px!important;gap:7px}.mobile-network-page .demo-tab,.mobile-network-page .demo-tag,.mobile-network-page .live{display:none!important}.mobile-network-page .lang{margin-left:auto}
 .mobile-network-page main{padding:8px!important}.mobile-network-page .network-guide{font-size:10px;padding:8px}.mobile-network-page .network-guide a{white-space:normal}
 .mobile-network-viewport{height:50svh;min-height:330px}.mobile-network-page .canvas-scroll.mobile-network-viewport{height:50svh}
}
@media(orientation:landscape) and (max-height:600px) and (max-width:950px){
 .mobile-network-page .mobile-network-viewport{height:64svh}.mobile-network-page.mobile-fullscreen .mobile-network-viewport{height:100svh}
}
@media(prefers-reduced-motion:reduce){.mobile-network-page aside,.mobile-network-page .canvas{transition:none}}