:root{--void:#000;--void-soft:#0a0a0a;--surface:#0d0d0d;--border:#1a1a1a;--border-glow:#2a2a2a;--amber:#ffb000;--amber-dim:#ffb0001f;--amber-glow:#ffb00040;--green:#00ff41;--green-dim:#00ff4114;--green-glow:#00ff4133;--cyan:#00e5ff;--cyan-dim:#00e5ff14;--cyan-glow:#00e5ff33;--red:#ff0040;--red-dim:#ff004014;--red-glow:#ff004033;--text:silver;--text-bright:#e0e0e0;--text-dim:#aaa;--text-muted:#777}[data-theme=light]{--void:#f0ece4;--void-soft:#e8e3da;--surface:#fff;--border:#c8c0b4;--border-glow:#b0a898;--amber:#b8860b;--amber-dim:#b8860b1a;--amber-glow:#b8860b26;--green:#1a8a3e;--green-dim:#1a8a3e14;--green-glow:#1a8a3e1f;--cyan:#07a;--cyan-dim:#0077aa14;--cyan-glow:#0077aa1f;--red:#c03;--red-dim:#cc003314;--red-glow:#cc00331f;--text:#3a3530;--text-bright:#1a1815;--text-dim:#6b6560;--text-muted:#9a9490}*{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{background:var(--void);color:var(--text);min-height:100vh;font-family:Share Tech Mono,VT323,monospace;line-height:1.6;overflow-x:hidden}body:after{content:"";pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,#0000 0 2px,#0000000f 2px 4px);position:fixed;inset:0}[data-theme=light] body:after{background:repeating-linear-gradient(0deg,#0000 0 2px,#00000005 2px 4px)}.shell{max-width:1280px;margin:0 auto;padding:1.5rem;overflow-x:hidden}.header{border-bottom:1px solid var(--border);opacity:0;justify-content:space-between;align-items:flex-start;margin-bottom:1.5rem;padding-bottom:1rem;animation:.4s forwards typeIn;display:flex}.header h1{letter-spacing:.05em;color:var(--amber);text-shadow:0 0 10px var(--amber-glow), 0 0 30px #ffb0001a;font-family:"Press Start 2P",monospace;font-size:1.1rem;line-height:1.6}.header-sub{color:var(--text);margin-top:.25rem;font-size:.85rem}.header-right{align-items:center;gap:1rem;display:flex}.pill{letter-spacing:.08em;text-transform:uppercase;border:1px solid;align-items:center;gap:.5rem;padding:.3rem .8rem;font-family:VT323,monospace;font-size:.75rem;display:flex}.pill-live{border-color:var(--green);color:var(--green);text-shadow:0 0 8px var(--green-glow)}.pill-off{border-color:var(--red);color:var(--red);text-shadow:0 0 8px var(--red-glow)}.cursor{animation:1s step-end infinite blink}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.dot{width:8px;height:8px;display:inline-block}.dot-on{background:var(--green);box-shadow:0 0 6px var(--green-glow), 0 0 12px var(--green-glow);animation:2s ease-in-out infinite breathe}.dot-off{background:var(--red);box-shadow:0 0 6px var(--red-glow)}.dot-idle{background:var(--text-muted)}.term{background:var(--surface);border:1px solid var(--border);margin-bottom:1rem;padding:1rem 1.25rem;transition:border-color .1s,box-shadow .1s;position:relative}.term:hover{border-color:var(--amber);box-shadow:0 0 15px #ffb0000f,inset 0 0 15px #ffb00005}.term:hover *{text-shadow:0 0 4px #ffb00014}.stats-row{border:1px solid var(--border);grid-template-columns:repeat(4,1fr);gap:0;margin-bottom:1rem;display:grid}@media (width<=800px){.stats-row{grid-template-columns:repeat(2,1fr)}.tabs{flex-wrap:wrap}.tab{font-size:.85rem}}@media (width<=500px){.shell{padding:1rem .75rem}.stats-row{grid-template-columns:repeat(2,1fr)}.header{flex-direction:column;gap:.75rem}.header-right{flex-wrap:wrap}.header h1{font-size:.85rem}.stat-value{font-size:2rem}.stat{padding:1rem .5rem}.bw-bar{gap:1rem}.bw-val{font-size:1.2rem}.term{padding:.75rem}.timeline-chart{height:60px}.live-feed{max-height:400px;font-size:.65rem}.list-item{font-size:.75rem}}.stat{text-align:center;border-right:1px solid var(--border);background:var(--surface);padding:1.25rem .75rem;transition:background .1s}.stat:last-child{border-right:none}.stat:hover{background:var(--void-soft)}.stat:hover .stat-value{text-shadow:0 0 15px}.stat-label{text-transform:uppercase;letter-spacing:.15em;color:var(--text);margin-bottom:.5rem;font-family:VT323,monospace;font-size:.8rem}.stat-value{font-family:VT323,monospace;font-size:2.6rem;font-weight:400;line-height:1;transition:text-shadow .15s}.stat-value.amber{color:var(--amber)}.stat-value.green{color:var(--green)}.stat-value.cyan{color:var(--cyan)}.stat-value.red{color:var(--red)}.bw-bar{border:1px solid var(--border);background:var(--surface);flex-wrap:wrap;justify-content:center;align-items:center;gap:2rem;margin-bottom:1rem;padding:.75rem;display:flex}.bw-item{flex-direction:column;align-items:center;gap:.15rem;display:flex}.bw-val{color:var(--amber);text-shadow:0 0 8px var(--amber-glow);font-family:VT323,monospace;font-size:1.5rem}.bw-val.dim{color:var(--text-dim);text-shadow:none;font-size:1rem}.bw-label{text-transform:uppercase;letter-spacing:.12em;color:var(--text);font-family:VT323,monospace;font-size:.75rem}.bw-arrow.up{color:var(--amber)}.bw-arrow.down{color:var(--green)}.bw-sep{background:var(--border);width:1px;height:30px}.tabs{border:1px solid var(--border);gap:0;margin-bottom:1rem;display:flex}.tab{border:none;border-right:1px solid var(--border);background:var(--surface);color:var(--text-dim);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;flex:1;padding:.7rem .75rem;font-family:VT323,monospace;font-size:1rem;transition:all .1s}.tab:last-child{border-right:none}.tab:hover{color:var(--text-bright);background:var(--void-soft)}.tab.active{background:var(--amber);color:var(--void);text-shadow:none}.tab.active:hover{background:var(--amber);color:var(--void)}.device-list{flex-direction:column;gap:.75rem;display:flex}.device-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.75rem;display:flex}.device-name{color:var(--amber);text-shadow:0 0 6px var(--amber-glow);font-family:VT323,monospace;font-size:1.3rem}.device-meta{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.chip{letter-spacing:.04em;text-transform:uppercase;border:1px solid;padding:.15rem .55rem;font-family:VT323,monospace;font-size:.75rem}.chip-amber{border-color:var(--amber);color:var(--amber)}.chip-green{border-color:var(--green);color:var(--green);text-shadow:0 0 6px var(--green-glow)}.chip-cyan{border-color:var(--cyan);color:var(--cyan)}.chip-red{border-color:var(--red);color:var(--red);text-shadow:0 0 6px var(--red-glow)}.chip-dim{border-color:var(--text-muted);color:var(--text-dim)}.device-stats{color:var(--text-dim);flex-wrap:wrap;gap:1.5rem;margin-bottom:.75rem;font-family:VT323,monospace;font-size:.9rem;display:flex}.device-stats strong{color:var(--text-bright)}.device-stats code{color:var(--cyan);font-family:Share Tech Mono,monospace;font-size:.8rem}.mini-chart{align-items:flex-end;gap:1px;height:24px;margin-bottom:.75rem;display:flex}.mini-bar{opacity:.7;flex:1;min-width:2px}.app-badges{flex-wrap:wrap;gap:.3rem;margin-bottom:.75rem;display:flex}.app-tag{border:1px solid var(--cyan);color:var(--cyan);letter-spacing:.04em;text-transform:uppercase;padding:.15rem .55rem;font-family:VT323,monospace;font-size:.75rem;transition:all .1s}.app-tag:hover{background:var(--cyan);color:var(--void)}.port-row{flex-wrap:wrap;gap:.3rem;margin-bottom:.75rem;display:flex}.port-chip{border:1px solid var(--border);background:var(--void);padding:.1rem .5rem;font-family:Share Tech Mono,monospace;font-size:.7rem;transition:all .1s}.port-chip:hover{border-color:var(--amber);color:var(--amber)}.port-num{color:var(--amber)}.port-svc{color:var(--text-dim);margin-left:.2rem}.port-cnt{color:var(--cyan);margin-left:.2rem}.domain-chips{flex-wrap:wrap;gap:.3rem;display:flex}.domain-chip{border:1px solid var(--border);color:var(--text-dim);padding:.1rem .45rem;font-family:Share Tech Mono,monospace;font-size:.65rem;transition:all .1s}.domain-chip:hover{border-color:var(--amber);color:var(--text-bright)}.section-label{text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);margin-bottom:.4rem;font-family:VT323,monospace;font-size:.7rem}.chart-area{margin-bottom:1rem}.chart-area h2{color:var(--amber);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.75rem;font-family:VT323,monospace;font-size:.9rem;font-weight:400}.timeline-chart{align-items:flex-end;gap:2px;height:80px;display:flex}.timeline-bar{background:var(--amber);opacity:.7;flex:1;min-height:1px;transition:height .3s;position:relative}.timeline-bar:hover{opacity:1;box-shadow:0 0 6px var(--amber-glow)}.timeline-bar:hover:after{content:attr(data-tooltip);background:var(--void);color:var(--amber);white-space:nowrap;z-index:10;border:1px solid var(--amber);text-shadow:0 0 6px var(--amber-glow);padding:.2rem .4rem;font-family:Share Tech Mono,monospace;font-size:.6rem;position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.two-col{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}@media (width<=700px){.two-col{grid-template-columns:1fr}.device-header{flex-direction:column;align-items:flex-start}.device-stats{gap:.75rem;font-size:.85rem}.port-row{gap:.25rem}.port-chip{padding:.1rem .35rem;font-size:.65rem}.app-tag{padding:.1rem .4rem;font-size:.65rem}}.list-item{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.35rem 0;font-size:.8rem;transition:background .1s;display:flex}.list-item:hover{background:#ffb00008}.list-item:last-child{border-bottom:none}.list-name{color:var(--text);text-overflow:ellipsis;white-space:nowrap;max-width:70%;font-family:Share Tech Mono,monospace;font-size:.75rem;overflow:hidden}.list-count{color:var(--amber);font-family:VT323,monospace;font-size:.85rem}.app-detail-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.app-detail-name{text-transform:uppercase;letter-spacing:.06em;font-family:VT323,monospace;font-size:1rem}.app-detail-count{color:var(--amber);text-shadow:0 0 8px var(--amber-glow);font-family:VT323,monospace;font-size:1.2rem}.app-bar{background:var(--border);height:3px}.app-bar-fill{background:var(--amber);height:100%;box-shadow:0 0 6px var(--amber-glow);transition:width .5s}.live-feed{max-height:500px;padding:.5rem 0;font-family:Share Tech Mono,monospace;font-size:.72rem;line-height:1.8;overflow-y:auto}.live-feed::-webkit-scrollbar{width:3px}.live-feed::-webkit-scrollbar-track{background:var(--void)}.live-feed::-webkit-scrollbar-thumb{background:var(--border)}.log-line{color:var(--text-dim);padding:.05rem 0;animation:.2s typeLine}.log-time{color:var(--amber);margin-right:.5rem}.log-ip{color:var(--cyan);margin-right:.25rem}.log-dest{color:var(--green)}.log-port{color:var(--text-muted);font-size:.65rem}.loading{text-align:center;color:var(--amber);letter-spacing:.1em;padding-top:40vh;font-family:VT323,monospace;font-size:1.2rem}.loading .cursor{margin-left:.25rem}@keyframes typeIn{0%{opacity:0}to{opacity:1}}@keyframes typeLine{0%{opacity:0}to{opacity:1}}@keyframes breathe{0%,to{opacity:1;box-shadow:0 0 6px var(--green-glow), 0 0 12px var(--green-glow)}50%{opacity:.4;box-shadow:0 0 3px var(--green-glow)}}.enter-1{opacity:0;animation:.3s 50ms forwards typeIn}.enter-2{opacity:0;animation:.3s .1s forwards typeIn}.enter-3{opacity:0;animation:.3s .15s forwards typeIn}.enter-4{opacity:0;animation:.3s .2s forwards typeIn}.enter-5{opacity:0;animation:.3s .25s forwards typeIn}.enter-6{opacity:0;animation:.3s .3s forwards typeIn}.glitch{display:inline-block;position:relative}.glitch:before,.glitch:after{content:attr(data-text);opacity:0;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.glitch:before{color:var(--cyan);z-index:-1}.glitch:after{color:var(--red);z-index:-1}[data-theme=light] .glitch:before{color:var(--amber)}[data-theme=light] .glitch:after{color:var(--cyan)}@media (prefers-reduced-motion:no-preference){.glitch:hover:before{opacity:.8;animation:.3s linear infinite glitch-1}.glitch:hover:after{opacity:.8;animation:.3s linear infinite glitch-2}}@keyframes glitch-1{0%{clip-path:inset(40% 0 61%);transform:translate(-2px,2px)}20%{clip-path:inset(92% 0 1%);transform:translate(1px,-1px)}40%{clip-path:inset(43% 0 1%);transform:translate(-1px,3px)}60%{clip-path:inset(25% 0 58%);transform:translate(3px,1px)}80%{clip-path:inset(54% 0 7%);transform:translate(-3px,-2px)}to{clip-path:inset(58% 0 43%);transform:translate(2px,-3px)}}@keyframes glitch-2{0%{clip-path:inset(65% 0 13%);transform:translate(3px,-1px)}20%{clip-path:inset(79% 0 14%);transform:translate(-2px,2px)}40%{clip-path:inset(31% 0 52%);transform:translate(1px,-3px)}60%{clip-path:inset(2% 0 78%);transform:translate(-3px,1px)}80%{clip-path:inset(48% 0 26%);transform:translate(2px,3px)}to{clip-path:inset(12% 0 69%);transform:translate(-1px,-2px)}}.theme-btn{border:1px solid var(--border);cursor:pointer;color:var(--text-dim);background:0 0;padding:.25rem .5rem;font-family:VT323,monospace;font-size:1rem;transition:all .1s}.theme-btn:hover{border-color:var(--amber);color:var(--amber);background:var(--amber-dim)}
