html{scroll-behavior:smooth;scroll-padding-top:92px}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(#68e0e807 1px,transparent 1px),linear-gradient(90deg,#68e0e807 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,#0008,transparent 72%)}.masthead{position:relative;z-index:20}.mobile-nav{display:none}.topology{position:relative;overflow:hidden}.topology:after{content:"";position:absolute;width:260px;height:260px;left:90px;top:50%;border-radius:50%;background:radial-gradient(circle,#68e0e80d,transparent 68%);transform:translate(-50%,-50%);pointer-events:none;animation:ambient-pulse 5s ease-in-out infinite}.fabric{position:relative}.core-node{position:relative;isolation:isolate}.core-node:after{content:"";position:absolute;inset:-10px;border:1px solid #68e0e82c;z-index:-1;animation:core-pulse 2.8s ease-out infinite}.core-node>b{position:absolute;width:7px;height:7px;right:-4px;top:50%;border-radius:50%;background:var(--cyan);box-shadow:0 0 14px var(--cyan);transform:translateY(-50%)}.core-orbit{position:absolute;width:68px;height:68px;left:50%;top:50%;border:1px dashed #68e0e82c;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;animation:orbit 18s linear infinite}.path-line{overflow:visible}.path-line:before{content:"";position:absolute;inset:-1px 0;background:linear-gradient(90deg,transparent,#68e0e855,transparent);background-size:45% 100%;animation:lane-scan 3.6s linear infinite}.packet{position:absolute;top:50%;left:0;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--acid);box-shadow:0 0 8px var(--acid),0 0 18px #c8ff3466;animation:packet-forward 2.8s linear infinite;will-change:transform,opacity}.packet-b{background:var(--cyan);box-shadow:0 0 8px var(--cyan);animation-name:packet-reverse;animation-delay:-1.1s}.packet-c{width:3px;height:3px;margin-top:-1px;animation-delay:-2s}.flow-fast .packet{animation-duration:1.45s}.flow-medium .packet{animation-duration:2.3s}.flow-slow .packet{animation-duration:3.8s}.path.degraded .packet,.path.down .packet{animation-play-state:paused;opacity:.08}.path.degraded .path-line:before,.path.down .path-line:before{animation:none;opacity:.25}.path .node{position:relative;transition:border-color .25s,transform .25s,box-shadow .25s}.path .node:hover{transform:translateX(3px);border-color:#68e0e866;box-shadow:0 12px 35px #0007}.path .node em{display:block;margin-top:7px;color:var(--muted);font:normal 9px/1.2 ui-monospace,SFMono-Regular,monospace}.path.up .node:after{content:"";position:absolute;width:6px;height:6px;left:-4px;top:50%;border-radius:50%;background:var(--acid);box-shadow:0 0 11px var(--acid);transform:translateY(-50%)}.path.degraded .node:after{content:"";position:absolute;width:6px;height:6px;left:-4px;top:50%;border-radius:50%;background:var(--warn);box-shadow:0 0 11px var(--warn);transform:translateY(-50%)}.upstream{transition:transform .25s,border-color .25s,box-shadow .25s}.upstream:hover{transform:translateY(-3px);border-color:#68e0e84d;box-shadow:0 22px 55px #0008}.traffic{opacity:.9}.live.ok i{animation:status-pulse 2s ease-out infinite}.terminal{position:relative}.terminal:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(transparent 50%,#68e0e805 50%);background-size:100% 4px}.target-row button,.tool-picker span{transition:background .2s,color .2s,border-color .2s,transform .2s}.target-row button:not(:disabled):active,.tool-picker label:active span{transform:scale(.97)}
@keyframes packet-forward{0%{left:0;transform:translateX(-50%);opacity:0}10%{opacity:1}90%{opacity:1}100%{left:100%;transform:translateX(-50%);opacity:0}}@keyframes packet-reverse{0%{left:100%;transform:translateX(-50%);opacity:0}10%{opacity:1}90%{opacity:1}100%{left:0;transform:translateX(-50%);opacity:0}}@keyframes lane-scan{from{background-position:-70% 0}to{background-position:170% 0}}@keyframes core-pulse{0%{transform:scale(.92);opacity:0}35%{opacity:1}100%{transform:scale(1.12);opacity:0}}@keyframes ambient-pulse{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(.9)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}}@keyframes orbit{to{transform:translate(-50%,-50%) rotate(360deg)}}@keyframes status-pulse{0%{box-shadow:0 0 0 0 #c8ff3470}70%{box-shadow:0 0 0 8px #c8ff3400}100%{box-shadow:0 0 0 0 #c8ff3400}}
@media(max-width:800px){html{scroll-padding-top:74px}body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}.shell{width:min(100% - 24px,1180px)}.masthead{position:sticky;top:0;height:68px;padding-top:env(safe-area-inset-top);background:#080b0deb;backdrop-filter:blur(18px);border-bottom-color:#253036aa}.identity .mark{width:34px;height:34px}.live{gap:7px}.live span{max-width:128px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hero{padding:38px 0 30px;gap:28px}.hero h1{font-size:clamp(48px,15vw,68px)}.hero-stat{margin:0}.metrics{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:-12px;padding-inline:12px;border-left:0;border-right:0}.metrics::-webkit-scrollbar,.upstreams::-webkit-scrollbar{display:none}.metrics article{flex:0 0 min(76vw,260px);scroll-snap-align:start;border-bottom:0!important;border-right:1px solid var(--line)!important}.section-head{margin:48px 0 18px}.upstreams{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin-inline:-12px;padding:0 12px 10px}.upstream{flex:0 0 min(88vw,350px);scroll-snap-align:center;min-height:320px}.upstream:hover{transform:none}.diagnostics{margin-top:8px}.split{margin-top:12px}.topology:after{left:50%;top:110px}.fabric{grid-template-columns:1fr;gap:12px;padding-top:18px}.core-node{width:min(230px,82%);justify-self:center;text-align:center;padding:18px}.core-node>b{right:50%;top:auto;bottom:-4px;transform:translateX(50%)}.paths{gap:8px}.path{grid-template-columns:34px 1fr;min-height:76px}.path-line{width:1px;height:76px;justify-self:center}.path-line:before{inset:0 -1px;background:linear-gradient(180deg,transparent,#68e0e855,transparent);background-size:100% 45%;animation-name:lane-scan-mobile}.packet{top:0;left:50%;margin:0 0 0 -3px;animation-name:packet-down}.packet-b{left:50%;top:100%;animation-name:packet-up}.packet-c{left:50%;top:0;margin-left:-1px;animation-name:packet-down}.path .node:hover{transform:none}.path .node:after{left:-4px!important;top:50%!important;bottom:auto!important}.system-panel{margin-bottom:12px}.mobile-nav{position:fixed;z-index:50;left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom));height:58px;display:grid;grid-template-columns:repeat(4,1fr);background:#0d1316e8;border:1px solid #314047;backdrop-filter:blur(20px);box-shadow:0 16px 50px #000c}.mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--muted);text-decoration:none;font-size:9px;letter-spacing:.05em;min-width:44px;min-height:44px}.mobile-nav a:active{color:var(--acid)}.mobile-nav i{font:normal 8px/1 ui-monospace,monospace;color:var(--cyan)}footer{padding-bottom:20px}}
@media(max-width:480px){.live span{max-width:88px}.hero h1{font-size:48px}.lede{font-size:14px}.metrics article{flex-basis:79vw}.panel-title{align-items:center}.diagnostic-form{width:100%}.tool-picker{display:grid;grid-template-columns:repeat(3,1fr)}.tool-picker span{text-align:center;padding-inline:5px}.target-row input,.target-row select,.target-row button{height:48px}.terminal pre{font-size:10px}.prefix-card strong{font-size:10px;overflow-wrap:anywhere}.system-panel{gap:20px}}
@keyframes packet-down{0%{transform:translateY(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(76px);opacity:0}}@keyframes packet-up{0%{transform:translateY(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-76px);opacity:0}}@keyframes lane-scan-mobile{from{background-position:0 -70%}to{background-position:0 170%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.packet,.path-line:before,.core-node:after,.core-orbit,.topology:after,.live i{animation:none!important}.upstream,.path .node,.target-row button,.tool-picker span{transition:none!important}}
