:root{--bg:#101513;--surface:#171e1b;--border:#2b3730;--text:#edf2ec;--muted:#93a299;--accent:#c2f47c;--blue:#7ec4e8;--danger:#f09b89}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--text);padding:9px 14px;cursor:pointer}button:hover{background:#28382b}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}aside{width:232px;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--border);padding:36px 24px;background:#121915;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:700;letter-spacing:1.7px}.logo{display:block;font-size:35px;line-height:1;letter-spacing:-7px;color:var(--accent);margin-right:6px}.logo span{color:#edf2ec}.brand small{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:2px}.side-label{font-size:9px;letter-spacing:1.8px;color:#6e8275;margin:64px 0 15px}.side-link{padding:12px 14px;margin-bottom:7px;color:var(--muted);border-radius:7px;display:flex;gap:12px}.side-link.active{background:#283724;color:var(--accent)}.side-link:hover{background:#233026}.side-foot{margin-top:auto;font-size:10px;letter-spacing:1.4px}.side-foot small{display:block;color:var(--muted);font-size:10px;letter-spacing:0;margin-top:10px}.dot,.pulse,.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:7px}.live-dot{margin-left:12px;vertical-align:middle}.pulse{box-shadow:0 0 0 4px #c2f47c15}main{margin-left:232px;padding:0 44px;max-width:1700px}header{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);gap:20px}.breadcrumb{font-size:12px;color:var(--muted)}.breadcrumb span{margin:0 15px;color:#506554}.head-actions{display:flex;align-items:center;gap:10px}.head-actions button{font-size:11px;padding:6px 10px}#connection{font-size:10px;letter-spacing:.6px;color:var(--muted)}.intro{display:flex;justify-content:space-between;align-items:end;padding:44px 0 30px;gap:20px}.eyebrow{font:10px/1.5 ui-monospace,SFMono-Regular,monospace;letter-spacing:1.7px;color:var(--accent)}h1{font-size:44px;line-height:1.17;font-weight:500;letter-spacing:-1.8px;margin:16px 0}h1 em{font-style:normal;color:#a1b39f}.intro p,.section-head p{color:var(--muted);margin:9px 0 0}.refresh-meta{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:10px;padding-bottom:5px}.refresh-meta small{display:block;color:#6c8071;margin-top:3px}.metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.metric,.network-panel,.containers-panel,.audit-panel{border:1px solid var(--border);border-radius:12px;background:var(--surface)}.metric{padding:23px}.card-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font:10px ui-monospace,monospace;letter-spacing:1px}.metric-icon{font-size:22px;color:#9db19f}.metric-value{font-size:34px;font-weight:500;letter-spacing:-1.2px;margin-top:14px}.metric-value .unit{font-size:15px;font-weight:400;letter-spacing:0;color:var(--muted)}.metric-sub{font-size:11px;color:var(--muted)}.progress{height:5px;background:#2b352e;border-radius:5px;margin:22px 0 13px;overflow:hidden}.progress div{height:100%;background:var(--accent);width:0;transition:width .4s}.progress div.warning{background:var(--danger)}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:11px;color:var(--muted)}.card-bottom strong,.card-bottom a{color:var(--accent);font-weight:500}.metric>small{display:block;color:#6f8476;font-size:10px;margin-top:12px}.container-indicators{height:5px;display:flex;gap:4px;margin:22px 0 13px}.container-indicators span{flex:1;background:var(--accent);border-radius:2px}.container-indicators .off{background:#445248}.network-panel,.containers-panel,.audit-panel{margin-top:22px;padding:25px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:25px}h2{font-size:21px;font-weight:500;letter-spacing:-.6px;margin:6px 0}.section-head p{font-size:11px}.badge{font-size:10px;white-space:nowrap;color:var(--accent)}.tx-legend{color:var(--blue);margin-left:14px}.network-layout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:32px}.rates{display:flex;gap:55px}.rates small,.traffic-totals small{display:block;font:9px ui-monospace,monospace;letter-spacing:1.3px;color:var(--muted)}.rates strong{display:block;font-size:27px;font-weight:500;color:var(--accent);letter-spacing:-1px}.rates>div:last-child strong{color:var(--blue)}.chart-wrap{height:140px;position:relative;margin-top:12px}canvas{width:100%;height:100%;display:block}.chart-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:11px;color:var(--muted)}.chart-foot{display:flex;justify-content:space-between;font-size:9px;color:#788f7f}.traffic-totals{border-left:1px solid var(--border);padding-left:30px}.traffic-totals>div{padding:5px 0 17px}.traffic-totals p{color:var(--accent);margin:7px 0;font-size:12px}.traffic-totals p span{display:inline-block;color:var(--blue);margin-left:18px}.traffic-totals strong{font-weight:500}.traffic-totals details{font-size:11px;color:var(--muted)}summary{cursor:pointer}#history{max-height:180px;overflow:auto}#history p{font-size:10px;display:flex;justify-content:space-between;gap:5px}.footnote{font-size:10px;color:#7e9485;margin:22px 0 0;border-top:1px solid var(--border);padding-top:14px}.search{display:flex;align-items:center;gap:10px;background:#101713;border:1px solid var(--border);padding:8px 12px;border-radius:7px}.search input{width:170px;border:0;padding:0;background:transparent;color:var(--text);font-size:11px}.search span{font-size:20px;color:var(--muted)}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}th{font:9px ui-monospace,monospace;letter-spacing:1px;color:var(--muted);border-bottom:1px solid var(--border);padding:12px 10px}td{border-bottom:1px solid #28332c;padding:17px 10px;font-size:11px}td:first-child{font-weight:600}td small{display:block;max-width:280px;text-overflow:ellipsis;overflow:hidden;color:#7e9485;font-size:10px;font-weight:400}.state{border-radius:5px;padding:4px 8px;background:#2a3c27;color:var(--accent);font-size:10px}.state.off{background:#35322b;color:#d4bc8b}.state.error{background:#422c26;color:var(--danger)}td button{font-size:10px;padding:6px 9px;margin-right:6px}td button.stop{color:var(--danger)}.protected{font-size:10px;color:#8c9d91}.panel-foot{font-size:10px;color:var(--muted);padding-top:17px}.audit-panel h2{font-size:17px}.audit-panel .section-head{margin-bottom:10px}.muted{font-size:11px;color:var(--muted)}.audit-row{display:grid;grid-template-columns:140px 1fr 110px 50px;gap:10px;padding:9px 0;border-top:1px solid var(--border);font-size:11px}.audit-row time{color:var(--muted)}footer{display:flex;justify-content:space-between;padding:30px 0;font:9px ui-monospace,monospace;letter-spacing:1.3px;color:#657c6c}footer span{letter-spacing:0}#error,#login-error,#notice{padding:13px 18px;border:1px solid #70493b;color:#f0b29b;background:#30221b;border-radius:8px;margin:15px 0;font-size:12px}#notice{color:var(--accent);border-color:#415831;background:#23301c}.login-card{max-width:440px;margin:65px auto;padding-bottom:40px}.login-card p{color:var(--muted)}label{display:block;font-size:12px;color:var(--muted);margin:16px 0}input{display:block;width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:7px;background:#101713;color:var(--text);margin-top:7px}.primary{background:var(--accent);border-color:var(--accent);color:#172011;font-weight:600}.primary:hover{background:#d7ffa0}.login-card .primary{width:100%;margin-top:12px;display:flex;justify-content:space-between}dialog{width:min(480px,calc(100% - 30px));padding:32px;border:1px solid #43563f;border-radius:14px;background:var(--surface);color:var(--text)}dialog::backdrop{background:#050b08cc;backdrop-filter:blur(4px)}dialog h2{font-size:25px;margin:14px 0}dialog p{font-size:12px;color:var(--muted);overflow-wrap:anywhere}dialog small{color:var(--muted);font-size:11px}dialog form>.primary{display:block;margin-top:20px;width:100%}.dialog-close{position:absolute;top:10px;right:10px;border:0;font-size:22px;padding:0 9px}.dialog-actions{display:flex;justify-content:end;gap:10px;margin-top:25px}.dialog-error{color:var(--danger)}@media(min-width:1600px){main{padding:0 65px}}@media(max-width:1150px){aside{width:190px;padding:30px 17px}main{margin-left:190px;padding:0 25px}.network-layout{grid-template-columns:minmax(0,1fr) 210px;gap:20px}.traffic-totals{padding-left:20px}.refresh-meta{display:none}.metric{padding:18px}.metric-value{font-size:29px}.metrics-grid{gap:12px}}@media(max-width:800px){aside{position:static;width:auto;height:68px;padding:12px 20px;border-right:0;border-bottom:1px solid var(--border);flex-direction:row;align-items:center;justify-content:space-between}.brand{font-size:11px}.brand small{font-size:7px}.logo{font-size:30px}.side-label,.side-foot{display:none}.side-link{padding:5px 9px;margin:0;font-size:18px}.side-link span{display:none}main{margin:0;padding:0 20px}header{height:65px}.breadcrumb{font-size:10px}.breadcrumb span{margin:0 8px}.head-actions{gap:6px}#connection{display:none}h1{font-size:38px}.intro{padding-top:30px}.metrics-grid{grid-template-columns:1fr}.metric{padding:20px}.metric-value{font-size:34px}.network-panel,.containers-panel,.audit-panel{padding:20px;margin-top:16px}.network-layout{grid-template-columns:1fr}.traffic-totals{border-left:0;border-top:1px solid var(--border);padding:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:10px}.traffic-totals details{grid-column:1/-1}.section-head{align-items:start;flex-wrap:wrap;gap:10px}.section-head h2{font-size:19px}.search{width:100%}.search input{width:100%}.chart-wrap{height:150px}.audit-row{grid-template-columns:1fr 1fr;font-size:10px}.audit-row span{overflow-wrap:anywhere}.audit-row time{grid-column:1/-1}.login-card{margin-top:40px}footer{font-size:8px}.badge{font-size:9px}}