:root{color:#1a231f;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--ink:#161f1a;--ink-secondary:#3b4c44;--muted:#64766e;--muted-light:#8d9f96;--line:#e5e9e7;--line-light:#eff2f1;--line-strong:#d3dad6;--green:#13a25e;--green-dark:#0e8a4e;--green-light:#ebf7ef;--green-border:#c6ead6;--dark:#181d22;--dark-surface:#222a33;--dark-hover:#262f38;--dark-border:#242b33;--blue:#0284c7;--blue-light:#e0f2fe;--violet:#8b5cf6;--violet-light:#f3e8ff;--danger:#dc2626;--danger-light:#fee2e2;--danger-border:#fca5a5;--panel-bg:#fff;--panel-bg-subtle:#fafbfb;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-full:9999px;--font-mono:ui-monospace, "Cascadia Code", "SFMono-Regular", Menlo, Monaco, Consolas, monospace;background:#f7f8f8;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{min-width:320px;color:var(--ink);font-feature-settings:"cv02", "cv03", "cv04", "cv11";background:#f7f8f8;margin:0;font-size:13px;line-height:1.55}button,input,select{font:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--green);outline-offset:2px}.mono{font-family:var(--font-mono)}.subtle{color:var(--muted)}.boot{background:var(--dark);color:#dfe6ee;letter-spacing:.06em;place-items:center;min-height:100vh;font-size:13px;display:grid}.boot-error{text-align:center;justify-items:center;gap:14px;max-width:420px;display:grid}.boot-error p{color:#fca5a5;letter-spacing:0;margin:0}.app-shell{grid-template-columns:210px 1fr;min-height:100vh;display:grid}.skip-link{z-index:300;background:var(--dark-surface);color:#fff;border-radius:var(--radius-md);padding:8px 14px;font-size:12.5px;text-decoration:none;transition:top .15s;position:fixed;top:-40px;left:12px}.skip-link:focus-visible{top:12px}.sidebar{background:linear-gradient(180deg, #1c2229 0%, var(--dark) 100%);color:#9aa5b0;border-right:1px solid var(--dark-border);z-index:20;flex-direction:column;height:100vh;padding:16px 10px;display:flex;position:sticky;top:0}.brand{color:#fff;align-items:center;gap:8px;padding:0 8px 16px;display:flex}.brand .mark.small{color:#fff;background:linear-gradient(135deg,#17b26a 0%,#0d8a4e 100%);box-shadow:0 2px 8px #13a25e59}.brand b{letter-spacing:-.01em;color:#fff;font-size:15px;font-weight:600}.brand span{letter-spacing:.06em;text-transform:uppercase;color:#7e8a96;border-left:1px solid #2b333c;padding-left:8px;font-size:11px;font-weight:500}.sidebar nav{flex-direction:column;gap:2px;display:flex}.sidebar button,.sidebar a{color:#9aa5b0;border-radius:var(--radius-md);text-align:left;background:0 0;border:0;align-items:center;gap:9px;width:100%;padding:7px 9px;font-size:12.5px;font-weight:500;text-decoration:none;transition:background-color .15s,color .15s;display:flex;position:relative}.sidebar nav svg,.sidebar-bottom svg{flex-shrink:0}.sidebar button:hover,.sidebar a:hover{background:var(--dark-hover);color:#eef2f7}.sidebar button.active,.sidebar a.active{background:var(--dark-surface);color:#fff;border-radius:var(--radius-md);font-weight:500}.sidebar nav a.active:before{content:"";background:var(--green);border-radius:0 3px 3px 0;width:3px;height:16px;position:absolute;top:50%;left:-10px;transform:translateY(-50%)}.sidebar-bottom{border-top:1px solid var(--dark-border);flex-direction:column;gap:2px;margin-top:auto;padding-top:8px;display:flex}.workspace{width:100%;padding:20px 28px;overflow:hidden}.page-transition{animation:.15s ease-out page-in}@keyframes page-in{0%{opacity:.8}to{opacity:1}}@media (prefers-reduced-motion:reduce){.page-transition{animation:none}}.workspace header{justify-content:space-between;align-items:flex-end;margin-bottom:18px;padding-bottom:2px;display:flex}.workspace h1{letter-spacing:-.02em;color:var(--ink);margin:0;font-size:20px;font-weight:600}.eyebrow{letter-spacing:.06em;text-transform:uppercase;color:var(--muted-light);margin:0 0 3px;font-size:10.5px;font-weight:600}.status-cluster{color:var(--muted);align-items:center;font-size:12px;font-weight:500;display:flex}.live-dot{background:var(--green);border-radius:50%;width:6px;height:6px;margin-right:6px;display:inline-block}.separator{border-left:1px solid var(--line);height:11px;margin:0 10px}.mark{border-radius:var(--radius-lg);color:#e5fbee;background:var(--dark);place-items:center;width:44px;height:44px;display:grid}.mark.small{border-radius:var(--radius-md);background:var(--green-light);color:#12794a;width:26px;height:26px}.btn-default{border:1px solid var(--line-strong);border-radius:var(--radius-md);color:var(--ink);white-space:nowrap;background:#fff;justify-content:center;align-items:center;gap:5px;padding:6px 11px;font-size:12px;font-weight:500;transition:background-color .12s,border-color .12s,box-shadow .12s;display:inline-flex}.btn-default:hover:not(:disabled){background:#f6f8f7;border-color:#bcc6c0}.btn-default:active:not(:disabled){background:#eef1f0}.btn-default:disabled{opacity:.5;cursor:not-allowed}.btn-default.compact{border-radius:var(--radius-sm);padding:3px 7px;font-size:11.5px}.primary{border-radius:var(--radius-md);background:var(--green);color:#fff;cursor:pointer;white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:5px;padding:6px 13px;font-size:12px;font-weight:500;transition:background-color .12s,box-shadow .12s;display:inline-flex}.primary:hover:not(:disabled),.primary:active:not(:disabled){background:var(--green-dark)}.primary:disabled{opacity:.55;cursor:not-allowed}.primary.compact{border-radius:var(--radius-sm);padding:4px 9px;font-size:11.5px}.danger-link{color:var(--danger);border-radius:var(--radius-sm);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;padding:3px 6px;font-size:11.5px;font-weight:500;transition:background-color .12s,color .12s;display:inline-flex}.danger-link:hover:not(:disabled){background:var(--danger-light);color:#b91c1c}.danger-link:disabled{opacity:.5;cursor:not-allowed}.icon-button{border:1px solid var(--line);border-radius:var(--radius-md);color:var(--ink-secondary);background:#fff;place-items:center;margin-left:6px;padding:4px;transition:background-color .12s,border-color .12s;display:grid}.icon-button:hover:not(:disabled){border-color:var(--line-strong);color:var(--ink);background:#f6f8f7}.icon-button:active:not(:disabled){background:#eef1f0}.icon-button.spinning svg{animation:.75s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.metric-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.metric-grid.three{grid-template-columns:repeat(3,1fr)}.metric-grid+.panel{margin-top:10px}.metric,.panel{background:var(--panel-bg);border:1px solid var(--line-light);border-radius:var(--radius-lg)}.metric{padding:12px 14px;transition:border-color .15s;position:relative}.metric:hover{border-color:var(--line-strong)}.metric-head{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.metric span{color:var(--muted);font-size:11.5px;font-weight:500;display:block}.metric-icon{color:var(--muted-light)}.metric strong{letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums;font-size:21px;font-weight:600;line-height:1.15;font-family:var(--font-mono);display:block}.metric small{color:var(--muted-light);margin-top:4px;font-size:11px;display:block}.split{grid-template-columns:1fr 1fr;gap:10px;margin-top:10px;display:grid}.panel{margin-bottom:10px;padding:14px 16px}.panel-title{justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;display:flex}.panel-title h2{letter-spacing:-.01em;color:var(--ink);margin:0;font-size:13.5px;font-weight:600}.panel-title span,.panel-title p{color:var(--muted);margin:2px 0 0;font-size:11.5px}.traffic{grid-template-columns:1fr 1fr;padding:4px 0;display:grid}.traffic div{padding:0 16px}.traffic div:first-child{padding-left:2px}.traffic div+div{border-left:1px solid var(--line-light)}.traffic p{color:var(--muted);margin:0 0 4px;font-size:11.5px;font-weight:500}.traffic strong{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:21px;font-weight:600;font-family:var(--font-mono);color:var(--ink)}.traffic-ratio{border-radius:var(--radius-full);background:#e8ecea;height:6px;margin-top:14px;display:flex;overflow:hidden}.traffic-ratio span{min-width:2px}.traffic-ratio .inbound,.traffic-legend i.inbound{background:var(--blue)}.traffic-ratio .outbound,.traffic-legend i.outbound{background:var(--violet)}.traffic-legend{color:var(--muted);justify-content:space-between;margin-top:8px;font-size:11.5px;font-weight:500;display:flex}.traffic-legend span{align-items:center;gap:5px;display:flex}.traffic-legend i{border-radius:2px;width:7px;height:7px}dl{margin:0}dl div{border-bottom:1px solid var(--line-light);justify-content:space-between;align-items:center;padding:6px 0;font-size:12px;display:flex}dl div:last-child{border-bottom:none}dt{color:var(--muted);font-weight:500}dd{color:var(--ink);margin:0;font-weight:500}.table-panel{padding:0;overflow:hidden}.table-panel .panel-title{margin-bottom:0;padding:12px 16px}.table-wrap{width:100%;overflow-x:auto}table{border-collapse:collapse;text-align:left;width:100%;font-size:12px}th{color:var(--muted);letter-spacing:0;border-bottom:1px solid var(--line-light);white-space:nowrap;background:#fff;padding:11px 14px;font-size:11.5px;font-weight:500}td{border-top:1px solid var(--line-light);white-space:nowrap;color:var(--ink);vertical-align:middle;padding:11px 14px}tbody tr:first-child td{border-top:none}tbody tr:hover td{background:#fafcfb}td b{color:var(--ink);font-weight:600}td small{color:var(--muted);margin-top:2px;font-size:11px;display:block}th.num,td.num{text-align:right}th.actions,td.actions{text-align:right;width:1%}.numeric{font-variant-numeric:tabular-nums;text-align:right;font-size:12.5px;font-weight:600}.table-cell-client{align-items:center;gap:8px;display:flex}.version-tag{border:1px solid var(--line-light);border-radius:var(--radius-sm);color:#4b5d54;font-size:10.5px;font-family:var(--font-mono);background:#fafcfb;padding:1px 5px;font-weight:500;display:inline-block}.protocol{border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.02em;justify-content:center;align-items:center;min-width:32px;height:18px;padding:0 4px;font-size:9.5px;font-weight:700;display:inline-flex}.protocol.tcp{background:var(--blue-light);color:var(--blue);border:1px solid #bae6fd}.protocol.udp{background:var(--violet-light);color:var(--violet);border:1px solid #e9d5ff}.cell-truncate{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.addr-cell .cell-truncate{max-width:180px}.recent-cell .cell-truncate{max-width:220px}.tunnel-group-title .cell-truncate{max-width:240px}.tunnel-name{max-width:200px}.tunnel-target{max-width:220px}.status-badge{border-radius:var(--radius-full);background:var(--green-light);width:fit-content;color:var(--green-dark);white-space:nowrap;border:1px solid var(--green-border);align-items:center;padding:1.5px 7px;font-size:10.5px;font-weight:600;line-height:1.4;display:inline-flex}.status-badge.active:before{content:"";background:var(--green);border-radius:50%;width:5px;height:5px;margin-right:4.5px}.status-badge.error{background:var(--danger-light);color:var(--danger);border-color:var(--danger-border)}.status-badge.error:before{content:"";background:var(--danger);border-radius:50%;width:5px;height:5px;margin-right:4.5px}.status-badge.offline{color:var(--muted);border-color:var(--line);background:#eef1f0}.status-badge.offline:before{content:"";background:var(--muted-light);border-radius:50%;width:5px;height:5px;margin-right:4.5px}.traffic-value{font-variant-numeric:tabular-nums;align-items:center;gap:12px;font-size:11.5px;display:inline-flex}.traffic-value span{font-weight:600;font-family:var(--font-mono);align-items:center;gap:3.5px;display:inline-flex}.traffic-value span:first-child{color:var(--blue)}.traffic-value span:last-child{color:var(--violet)}.traffic-value.compact{flex-direction:column;align-items:flex-start;gap:2px;font-size:11px}.traffic-icon{flex-shrink:0}.relative-time{color:var(--muted);white-space:nowrap;font-size:11.5px}.endpoint,.mobile-endpoint{align-items:center;gap:6px;display:inline-flex}.endpoint strong,.mobile-endpoint strong{color:var(--ink);font-size:12.5px;font-weight:600}.row-error{max-width:260px;color:var(--danger);text-overflow:ellipsis;font-size:11px;overflow:hidden}.error-row{background:#fff8f8}tbody tr.error-row:hover td{background:#fff0f0}.field{border:1px solid var(--line-strong);border-radius:var(--radius-md);color:var(--ink);background:#fff;width:100%;padding:6px 9px;font-size:12px}.field:focus-visible,.select-trigger:focus-visible{border-color:var(--green);outline:none}select.field{cursor:pointer;background-color:#fff}.field:focus{border-color:var(--green)}.select{width:100%;position:relative}.select-trigger{border:1px solid var(--line-strong);border-radius:var(--radius-md);width:100%;color:var(--ink);text-align:left;background:#fff;justify-content:space-between;align-items:center;gap:6px;padding:6px 9px;font-size:12px;transition:border-color .12s;display:flex}.select-trigger:hover{border-color:#bac5be}.select-trigger[aria-expanded=true]{border-color:var(--green)}.select-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.select-caret{color:var(--muted);flex-shrink:0}.select-menu{z-index:200;border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;max-height:240px;margin:0;padding:3px;list-style:none;position:fixed;overflow-y:auto;box-shadow:0 4px 16px #0f172a1a}.select-option{border-radius:var(--radius-sm);width:100%;color:var(--ink);text-align:left;cursor:pointer;background:0 0;border:0;justify-content:space-between;align-items:center;gap:8px;padding:6px 8px;font-size:12px;display:flex}.select-option:hover,.select-option.highlighted{background:#f6f8f7}.select-option.selected{font-weight:500}.dropdown{display:inline-flex;position:relative}.dropdown-menu{z-index:200;border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;min-width:116px;margin:0;padding:3px;list-style:none;position:fixed;box-shadow:0 4px 16px #0f172a1a}.dropdown-item{border-radius:var(--radius-sm);width:100%;color:var(--ink);text-align:left;cursor:pointer;white-space:nowrap;background:0 0;border:0;align-items:center;padding:6px 8px;font-size:12px;display:flex}.dropdown-item:hover,.dropdown-item.highlighted{background:#f6f8f7}.dropdown-item.danger{color:var(--danger)}.dropdown-item:disabled{opacity:.4;cursor:not-allowed}.form-grid{border:0;grid-template-columns:1fr 1fr;gap:14px;min-width:0;margin:0;padding:0;display:grid}.login-panel label,.form-grid label{color:var(--ink-secondary);flex-direction:column;gap:5px;font-size:12px;font-weight:600;display:flex}.form-grid label small{color:var(--muted);font-size:11px;font-weight:400}.registry-create{grid-template-columns:1.5fr 80px 90px 2fr auto;align-items:center;gap:8px;margin:10px 0 2px;display:grid}.registry-create .field{height:28px;padding:4px 8px;font-size:12px}.registry-create .select-trigger{height:28px;padding:0 8px;font-size:12px}.registry-create .btn-default{height:28px;padding:0 12px}.tunnel-sections{flex-direction:column;display:flex}.tunnel-group{border-top:1px solid var(--line-light);padding:14px 0 8px}.tunnel-group:first-child{border-top:none;padding-top:0}.tunnel-group-head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}.tunnel-group-title{align-items:center;gap:8px;min-width:0;font-size:13px;font-weight:600;display:flex}.tunnel-group-title b{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.number-input{width:100%;position:relative}.number-input .field{appearance:textfield;padding-right:44px}.number-input .field::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.number-input .field::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.number-input-steppers{flex-direction:column;display:flex;position:absolute;top:0;bottom:0;right:0}.number-input-steppers button{border:0;border-left:1px solid var(--line);width:20px;color:var(--muted);cursor:pointer;background:#f6f8f7;flex:1;place-items:center;padding:0;display:grid}.number-input-steppers button:first-child{border-top-right-radius:var(--radius-md)}.number-input-steppers button:last-child{border-bottom-right-radius:var(--radius-md)}.number-input-steppers button+button{border-top:1px solid var(--line-light)}.number-input-steppers button:hover:not(:disabled){color:var(--ink);background:#eef1f0}.number-input-steppers button:disabled{opacity:.4;cursor:not-allowed}.row-actions{justify-content:flex-end;align-items:center;gap:5px;display:inline-flex}.muted-row td{opacity:.55}.notice{border-radius:var(--radius-md);color:#7b6216;background:#fff9e8;border:1px solid #f2e3b5;justify-content:space-between;align-items:center;gap:8px;margin:0 0 12px;padding:7px 10px;font-size:11.5px;font-weight:500;display:flex}.notice-success{background:var(--green-light);border-color:var(--green-border);color:var(--green-dark);font-family:var(--font-mono);word-break:break-all}.notice-error{background:var(--danger-light);border-color:var(--danger-border);color:var(--danger)}.notice-close{color:inherit;opacity:.6;cursor:pointer;background:0 0;border:0;padding:1px 3px;font-size:14px;line-height:1}.notice-close:hover{opacity:1}.error-retry{border:1px solid var(--line-strong);border-radius:var(--radius-sm);color:var(--ink);background:#fff;margin-left:6px;padding:2px 6px;font-size:11px;font-weight:500}.error-retry:hover{background:#f6f8f7;border-color:#bac5be}.timeline{flex-direction:column;display:flex}.event{border-bottom:1px solid var(--line-light);grid-template-columns:24px 1fr auto;align-items:start;gap:10px;padding:9px 0;display:grid}.event:last-child{border-bottom:none}.event-icon{border-radius:var(--radius-md);color:#64736b;background:#eef2f0;place-items:center;width:24px;height:24px;display:grid}.event.success .event-icon{background:var(--green-light);color:var(--green-dark);border:1px solid var(--green-border)}.event.danger .event-icon{background:var(--danger-light);color:var(--danger);border:1px solid var(--danger-border)}.event.muted-event .event-icon{color:#78837c;background:#eef1f0}.event.info .event-icon{background:var(--blue-light);color:var(--blue);border:1px solid #dbe6f6}.event b{font-size:12px;font-weight:600}.event p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:2px 0 0;font-size:12px;line-height:1.4;overflow:hidden}.event-heading{align-items:center;gap:6px;display:flex}.event-heading span{color:#98a39c;font-size:10px;font-family:var(--font-mono)}.event-tags{gap:5px;margin-top:6px;display:flex}.event-tags span{border-radius:var(--radius-sm);color:#55635b;background:#eef2f0;align-items:center;gap:3px;padding:1px 5px;font-size:10.5px;font-weight:500;display:inline-flex}.event-filters{border:1px solid var(--line);border-radius:var(--radius-md);background:#f0f3f1;padding:2px;display:inline-flex}.event-filters button{border-radius:var(--radius-sm);color:#55665c;background:0 0;border:0;padding:4px 8px;font-size:11.5px;font-weight:500;transition:background-color .12s,color .12s,box-shadow .12s}.event-filters button:hover{color:var(--ink)}.event-filters button.active{color:var(--ink);background:#fff;font-weight:500;box-shadow:0 1px 2px #0f172a0d}.empty{text-align:center;color:var(--muted);padding:32px 14px}.empty svg{color:#9eb0a6;margin-bottom:4px}.empty p{margin:0;font-size:12px;font-weight:500}.inline-empty{color:var(--muted);text-align:center;margin:14px 0;font-size:11.5px}.overview-detail{margin-top:0}.summary-list{flex-direction:column;display:flex}.summary-row{border-top:1px solid var(--line-light);justify-content:space-between;align-items:center;gap:12px;padding:8px 0;display:flex}.summary-row:first-child{border-top:0}.summary-row>div:first-child{min-width:0}.summary-row b{font-size:12px;font-weight:600}.summary-row small{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:11px;display:block;overflow:hidden}.summary-value{text-align:right}.summary-value strong{font-variant-numeric:tabular-nums;color:var(--ink);font-size:16px;font-weight:600}.summary-value small{margin-top:1px;font-size:10px}.health-panel.has-error{border-color:var(--danger-border);background:#fffcfc}.health-panel.has-error .panel-title>svg{color:var(--danger)}.health-ok{min-height:64px;color:var(--green-dark);justify-content:center;align-items:center;gap:6px;font-size:13px;font-weight:600;display:flex}.login-shell{background:#f7f8f8;grid-template-columns:minmax(360px,480px) 1fr;min-height:100vh;display:grid}.login-panel{flex-direction:column;justify-content:center;max-width:480px;padding:5vw 4vw;display:flex}.login-panel h1{letter-spacing:-.03em;color:var(--ink);margin:0;font-size:24px;font-weight:700}.login-panel .muted{color:var(--muted);margin:5px 0 0;font-size:12.5px}.login-panel form{margin-top:22px}.login-panel .primary{width:100%;margin-top:14px;padding:8px;font-size:12.5px}.error{color:var(--danger);margin-top:6px;font-size:12px}.login-visual{background:var(--dark);color:#8fa0ad;border-left:1px solid var(--dark-border);align-items:flex-end;padding:36px;display:flex;position:relative;overflow:hidden}.signal-grid{background-color:#0000;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-position:0 0,0 0;background-repeat:repeat,repeat;background-size:36px 36px;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 92%);mask-image:linear-gradient(#000,#0000 92%)}.traffic-chart-card{border:1px solid var(--line-light);border-radius:var(--radius-lg);background:#fff;margin-top:14px;position:relative;overflow:hidden}.chart-header{border-bottom:1px solid var(--line-light);background:#fff;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;display:flex}.chart-quick-stats{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.quick-stat-item{color:var(--ink-secondary);align-items:center;gap:6px;font-size:11.5px;display:flex}.quick-stat-item .dot{border-radius:50%;width:6px;height:6px}.quick-stat-item .dot.in{background:var(--blue)}.quick-stat-item .dot.out{background:var(--violet)}.quick-stat-item .stat-label{color:var(--muted)}.quick-stat-item strong{color:var(--ink);font-weight:600;font-family:var(--font-mono);font-variant-numeric:tabular-nums}.quick-stat-item .stat-sub{color:var(--muted-light);font-size:10.5px}.chart-legend-filters{align-items:center;gap:6px;display:flex}.legend-btn{border-radius:var(--radius-sm);border:1px solid var(--line);color:var(--muted);cursor:pointer;background:#fff;align-items:center;gap:5px;padding:3px 8px;font-size:11px;font-weight:500;transition:all .12s;display:inline-flex}.legend-btn:hover{color:var(--ink);border-color:var(--line-strong)}.legend-btn.active.in{background:var(--blue-light);color:var(--blue);border-color:#bae6fd}.legend-btn.active.out{background:var(--violet-light);color:var(--violet);border-color:#e9d5ff}.legend-indicator{border-radius:1.5px;width:6px;height:6px}.legend-indicator.in{background:var(--blue)}.legend-indicator.out{background:var(--violet)}.chart-canvas-container{height:260px;padding:12px 14px 4px;position:relative}.tooltip-time{color:var(--muted);font-size:10.5px;font-weight:600;font-family:var(--font-mono);margin-bottom:2px}.tooltip-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.tooltip-row.in .tooltip-val{color:var(--blue)}.tooltip-row.out .tooltip-val{color:var(--violet)}.tooltip-row.total{color:var(--ink);font-weight:600}.tooltip-indicator{border-radius:50%;width:5px;height:5px;margin-right:-4px}.tooltip-indicator.in{background:var(--blue)}.tooltip-indicator.out{background:var(--violet)}.tooltip-label{color:var(--ink-secondary);font-size:10.5px}.tooltip-val{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:600}.tooltip-divider{background:var(--line-light);height:1px;margin:2px 0}.chart-empty-box{border:1px dashed var(--line);border-radius:var(--radius-lg);text-align:center;background:#fff;margin-top:14px;padding:40px 14px}.mobile-data-list{display:none}.data-card{border-top:1px solid var(--line-light);padding:11px 12px}.data-card.has-error{background:#fff9f9}.data-card-head,.data-card-foot{justify-content:space-between;align-items:center;gap:8px;display:flex}.data-card-head>div{min-width:0}.data-card-head b{color:var(--ink);font-size:12.5px;font-weight:600}.data-card-head span{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-top:2px;font-size:10.5px;display:block;overflow:hidden}.data-card-grid{grid-template-columns:1fr 1fr;gap:6px;margin:9px 0;display:grid}.data-card-grid>div{border-radius:var(--radius-md);background:#f3f6f4;padding:7px 9px}.data-card-grid span{color:var(--muted);margin-bottom:3px;font-size:10px;display:block}.data-card-grid strong{color:var(--ink);font-size:12px;font-weight:600;display:block}.data-card-foot{border-top:1px solid var(--line-light);color:var(--muted);margin-top:9px;padding-top:8px;font-size:10.5px}.mobile-endpoint{margin-top:8px}.card-error{border-radius:var(--radius-sm);background:var(--danger-light);color:var(--danger);margin:6px 0 0;padding:5px 8px;font-size:11px}@media (width<=1000px){.metric-grid,.metric-grid.three{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.registry-create{grid-template-columns:repeat(2,1fr)}.registry-create .field,.registry-create .select-trigger{min-width:0}.table-wrap th,.table-wrap td{padding-left:8px;padding-right:8px}}@media (width<=900px){.login-shell{grid-template-columns:1fr}.login-visual{display:none}}@media (width<=680px){.app-shell{display:block}.sidebar{z-index:100;background:var(--dark);border-top:1px solid var(--dark-border);border-right:none;flex-direction:row;width:100%;height:54px;padding:4px 8px;position:fixed;inset:auto 0 0}.brand,.sidebar-bottom button:last-child{display:none}.sidebar nav{flex-direction:row;flex:1;justify-content:space-around;gap:2px}.sidebar nav button,.sidebar nav a,.sidebar-bottom button,.sidebar-bottom a{border-radius:var(--radius-md);justify-content:center;padding:7px;font-size:0}.sidebar button.active,.sidebar a.active{background:var(--dark-hover);color:#31b977;border-left:none}.sidebar nav a.active:before{border-radius:0 0 3px 3px;width:20px;height:3px;top:0;left:50%;transform:translate(-50%)}.sidebar-bottom{border:0;flex-direction:row;margin:0;padding:0;display:flex}.workspace{padding:16px 12px 68px}.workspace header{flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:14px}.status-cluster{justify-content:space-between;width:100%;font-size:11px}.metric-grid{grid-template-columns:1fr 1fr;gap:8px}.metric-grid.three{grid-template-columns:1fr}.metric{padding:10px}.metric strong{font-size:18px}.form-grid{grid-template-columns:1fr;gap:10px}.login-panel{padding:22px 14px}.event{grid-template-columns:22px 1fr;gap:8px}.event>.relative-time{grid-column:2;margin-top:-2px}.panel-title{flex-direction:column;align-items:flex-start;gap:8px}.event-filters{max-width:100%;overflow-x:auto}.table-panel .table-wrap,.tunnel-sections .table-wrap{display:none}.mobile-data-list{display:block}.registry-create{grid-template-columns:repeat(2,1fr)}.registry-create .btn-default{grid-column:1/-1}.mobile-data-list .empty{border-top:1px solid var(--line-light)}.traffic-value{border-radius:var(--radius-md);background:#f0f3f1;justify-content:space-between;padding:6px 8px}.traffic{gap:4px}.traffic div{padding:0 6px}.traffic strong{font-size:17px}}