:root{--c-bg:#f1f5f9;--c-surface:#ffffff;--c-surface-2:#f8fafc;--c-border:#e2e8f0;--c-border-str:#cbd5e1;--c-text:#0f172a;--c-text-2:#475569;--c-text-3:#64748b;--c-primary:#1e40af;--c-primary-fg:#ffffff;--c-primary-wk:#eff6ff;--c-primary-br:#bfdbfe;--series-1:#2a78d6;--series-2:#008300;--status-good:#0ca30c;--status-warn:#fab219;--status-crit:#d03b3b;--status-good-t:#006300;--status-good-bg:#ecfdf5;--status-warn-bg:#fffbeb;--status-crit-bg:#fef2f2;--grid:#e2e8f0;--axis:#cbd5e1;--radius:8px;--radius-sm:6px;--sidebar-w:232px;--shadow-sm:0 1px 2px rgba(15,23,42,.06);--shadow:0 1px 3px rgba(15,23,42,.08),0 1px 2px rgba(15,23,42,.04);--font-sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--font-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;color-scheme:light}*{box-sizing:border-box}body,html{height:100%}body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:var(--font-sans),system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}.axis-label,.mono,td.num,th.num{font-family:var(--font-mono),ui-monospace,SFMono-Regular,Menlo,monospace;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-size:12.5px}a{color:var(--c-primary);text-decoration:none}a:hover{text-decoration:underline}:focus-visible{outline:2px solid var(--c-primary);outline-offset:2px;border-radius:4px}.shell{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-w);flex-shrink:0;background:var(--c-surface);border-right:1px solid var(--c-border);display:flex;flex-direction:column;position:-webkit-sticky;position:sticky;top:0;height:100vh}.sidebar-brand{display:flex;align-items:center;gap:9px;padding:18px 16px;border-bottom:1px solid var(--c-border);font-weight:650;font-size:15px;letter-spacing:-.2px}.sidebar-brand .logo{width:26px;height:26px;border-radius:6px;background:var(--c-primary);display:grid;place-items:center;flex-shrink:0}.sidebar-brand .logo svg{width:15px;height:15px;stroke:#fff}.sidebar-nav{padding:10px 8px;flex:1 1;overflow-y:auto}.sidebar-section{font-size:10.5px;font-weight:650;color:var(--c-text-3);text-transform:uppercase;letter-spacing:.6px;padding:12px 8px 5px}.nav-item{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:var(--radius-sm);color:var(--c-text-2);font-weight:500;transition:background .15s ease,color .15s ease;cursor:pointer}.nav-item:hover{background:var(--c-surface-2);color:var(--c-text);text-decoration:none}.nav-item.active{background:var(--c-primary-wk);color:var(--c-primary);font-weight:600;box-shadow:inset 2px 0 0 var(--c-primary)}.nav-item svg{width:16px;height:16px;flex-shrink:0;stroke-width:1.75}.nav-item .badge{margin-left:auto;font-size:11px;font-weight:600;background:var(--c-surface-2);color:var(--c-text-3);padding:1px 6px;border-radius:999px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.nav-item.active .badge{background:#dbeafe;color:var(--c-primary)}.sidebar-foot{padding:10px 8px;border-top:1px solid var(--c-border)}.sidebar-user{display:flex;align-items:center;gap:9px;padding:6px 8px;font-size:12.5px;color:var(--c-text-3)}.sidebar-user .avatar{width:24px;height:24px;border-radius:50%;background:var(--c-primary-wk);color:var(--c-primary);display:grid;place-items:center;font-weight:650;font-size:11px}.main{flex:1 1;min-width:0}.topbar{height:56px;background:var(--c-surface);border-bottom:1px solid var(--c-border);display:flex;align-items:center;gap:12px;padding:0 22px;position:-webkit-sticky;position:sticky;top:0;z-index:20}.topbar h1{font-size:15px;font-weight:650;margin:0;letter-spacing:-.2px}.topbar .spacer{flex:1 1}.content{padding:20px 22px 56px;width:100%}.page-sub{color:var(--c-text-3);font-size:13px;margin:-2px 0 18px}.card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);margin-bottom:16px}.card-head{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--c-border)}.card-head h2{font-size:13px;font-weight:650;margin:0;letter-spacing:-.1px}.card-head .hint{font-size:12px;color:var(--c-text-3);font-weight:400}.card-head .spacer{flex:1 1}.card-body{padding:16px}.card-body.flush{padding:0}.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));grid-gap:12px;gap:12px;margin-bottom:16px}.tile{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:13px 14px;box-shadow:var(--shadow-sm)}.tile .label{font-size:10.5px;font-weight:650;color:var(--c-text-3);text-transform:uppercase;letter-spacing:.5px}.tile .value{font-size:25px;font-weight:650;letter-spacing:-.7px;margin-top:5px;line-height:1.15}.tile .value .unit{font-size:13px;font-weight:500;color:var(--c-text-3);margin-left:2px}.tile .foot{font-size:11.5px;color:var(--c-text-3);margin-top:3px}.tile.alert{border-color:#fecaca;background:var(--status-crit-bg)}.tile.alert .value{color:var(--status-crit)}table{width:100%;border-collapse:collapse;font-size:13px}thead th{text-align:left;padding:8px 12px;font-size:10.5px;font-weight:650;color:var(--c-text-3);text-transform:uppercase;letter-spacing:.5px;background:var(--c-surface-2);white-space:nowrap;position:-webkit-sticky;position:sticky;top:0}tbody td,thead th{border-bottom:1px solid var(--c-border)}tbody td{padding:9px 12px}tbody tr:last-child td{border-bottom:none}tbody tr:hover td{background:var(--c-surface-2)}td.num,th.num{text-align:right}.scroll-x{overflow-x:auto}.pill{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:5px;font-size:11px;font-weight:600;white-space:nowrap}.pill svg{width:11px;height:11px;stroke-width:2.2}.pill.ok{background:var(--status-good-bg);color:var(--status-good-t)}.pill.warn{background:var(--status-warn-bg);color:#92400e}.pill.crit{background:var(--status-crit-bg);color:#991b1b}.pill.mute{background:var(--c-surface-2);color:var(--c-text-2);border:1px solid var(--c-border)}.pill.info{background:var(--c-primary-wk);color:var(--c-primary)}.btn,button{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--c-primary);color:var(--c-primary-fg);border:1px solid transparent;border-radius:var(--radius-sm);padding:8px 13px;min-height:36px;font:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:background .15s ease,border-color .15s ease}button:hover:not(:disabled){background:#1a3a9c}button:disabled{opacity:.45;cursor:not-allowed}button svg{width:14px;height:14px;stroke-width:2}button.ghost{background:var(--c-surface);color:var(--c-text-2);border-color:var(--c-border-str)}button.ghost:hover:not(:disabled){background:var(--c-surface-2);color:var(--c-text)}button.danger{background:var(--status-crit)}button.danger:hover:not(:disabled){background:#b32d2d}button.sm{padding:5px 9px;min-height:30px;font-size:12px}.seg{display:inline-flex;background:var(--c-surface-2);border:1px solid var(--c-border);border-radius:var(--radius-sm);padding:2px}.seg button{background:transparent;color:var(--c-text-2);min-height:28px;padding:4px 11px;font-size:12px;font-weight:600;border:0;border-radius:4px}.seg button.on{background:var(--c-surface);color:var(--c-text);box-shadow:var(--shadow-sm)}.seg button:hover:not(.on){color:var(--c-text);background:transparent}input,select,textarea{width:100%;background:var(--c-surface);border:1px solid var(--c-border-str);border-radius:var(--radius-sm);padding:8px 10px;min-height:36px;font:inherit;font-size:13px;color:var(--c-text)}input:focus,select:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(30,64,175,.1)}input::placeholder{color:#94a3b8}label{display:block;font-size:11px;font-weight:650;color:var(--c-text-2);margin-bottom:5px;letter-spacing:.3px}.field{margin-bottom:13px}.row{display:flex;gap:10px;flex-wrap:wrap}.row>*{flex:1 1;min-width:130px}.msg{padding:10px 13px;border-radius:var(--radius-sm);font-size:13px;margin-bottom:14px;display:flex;gap:8px;align-items:flex-start}.msg svg{width:15px;height:15px;flex-shrink:0;margin-top:1px}.msg.err{background:var(--status-crit-bg);color:#991b1b;border:1px solid #fecaca}.msg.ok{background:var(--status-good-bg);color:#065f46;border:1px solid #a7f3d0}.msg.info{background:var(--c-primary-wk);color:#1e3a8a;border:1px solid var(--c-primary-br)}.empty{text-align:center;padding:34px 20px;color:var(--c-text-3);font-size:13px}.empty svg{width:26px;height:26px;stroke:var(--c-border-str);margin-bottom:8px}.note{font-size:12px;color:var(--c-text-3);line-height:1.6}.chart{width:100%;display:block;overflow:visible}.chart .grid-line{stroke:var(--grid);stroke-width:1;shape-rendering:crispEdges}.chart .axis-line{stroke:var(--axis);stroke-width:1;shape-rendering:crispEdges}.chart text{font-size:10.5px;fill:var(--c-text-3);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.chart .series-line{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--c-text-2)}.legend .key{display:inline-flex;align-items:center;gap:6px}.legend .swatch{width:10px;height:10px;border-radius:2px;flex-shrink:0}.hit{fill:transparent;cursor:pointer}.bar-group:hover .bar-mark,.hit:hover+.bar-mark{filter:brightness(.9)}.tip{position:fixed;pointer-events:none;z-index:100;background:var(--c-text);color:#fff;border-radius:6px;padding:7px 9px;font-size:12px;line-height:1.45;box-shadow:0 4px 12px rgba(15,23,42,.2);white-space:nowrap}.tip .t-head{font-weight:650;margin-bottom:3px}.tip .t-row{display:flex;align-items:center;gap:6px}.tip .t-sw{width:8px;height:8px;border-radius:2px}.tip .t-val{margin-left:auto;padding-left:12px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:600}.login-wrap{min-height:100vh;display:grid;place-items:center;background:var(--c-bg);padding:20px}.login-card{width:100%;max-width:348px;background:var(--c-surface);border:1px solid var(--c-border);border-radius:10px;padding:26px;box-shadow:var(--shadow)}.login-brand{display:flex;align-items:center;gap:9px;margin-bottom:20px;font-weight:650;font-size:16px}@media (max-width:900px){.sidebar{position:fixed;z-index:50;transform:translateX(-100%);transition:transform .2s ease;box-shadow:var(--shadow)}.sidebar.open{transform:translateX(0)}.content{padding:16px 14px 48px}.topbar{padding:0 14px}}@media (min-width:901px){.menu-btn{display:none}}.scrim{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:40}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;transition-duration:.01ms!important}}.chart{max-height:280px}.chart .bar-mark{transition:filter .12s ease}.bar-group:hover .bar-mark{filter:brightness(1.06)}.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--c-border);flex-wrap:wrap}.pager-info{font-size:12px;color:var(--c-text-3);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.pager-controls{display:flex;align-items:center;gap:3px}.pager-btn{min-width:30px;height:30px;padding:0 7px;min-height:30px;background:var(--c-surface);color:var(--c-text-2);border:1px solid var(--c-border);border-radius:6px;font-size:12.5px;font-weight:600;font-feature-settings:"tnum";font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;justify-content:center}.pager-btn:hover:not(:disabled){background:var(--c-surface-2);color:var(--c-text)}.pager-btn.on{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}.pager-btn:disabled{opacity:.4;cursor:not-allowed}.pager-ellipsis{color:var(--c-text-3);padding:0 3px;font-size:12px}.switch{position:relative;display:inline-flex;align-items:center;gap:8px;cursor:pointer}.switch input{position:absolute;opacity:0;width:0;height:0}.switch .track{position:relative;width:38px;height:22px;flex:0 0 38px;background:var(--c-border-str);border-radius:999px;transition:background .18s ease}.switch .track:before{content:"";position:absolute;left:3px;top:3px;width:16px;height:16px;background:#fff;border-radius:50%;box-shadow:0 1px 2px rgba(15,23,42,.25);transition:transform .18s ease}.switch input:checked+.track{background:var(--status-good)}.switch input:checked+.track:before{transform:translateX(16px)}.switch input:focus-visible+.track{outline:2px solid var(--c-primary);outline-offset:2px}.switch.off input:disabled+.track{opacity:.45}.switch input:disabled~*{cursor:not-allowed}.switch .switch-label{font-size:12px;font-weight:600}.switch .switch-label.on{color:var(--status-good-t)}.switch .switch-label.off{color:var(--c-text-3)}