:root{--bg:#080b0d;--panel:#0e1417;--panel-2:#121a1e;--line:#263238;--text:#e8f0ed;--muted:#8da09b;--accent:#39d6a0;--accent-dim:#163d34;--warn:#ffbd65;--danger:#ff6f76;--radius:12px;--mono:"Cascadia Code","SFMono-Regular",Consolas,monospace}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 80% -20%,#12352d 0,transparent 36%),var(--bg);color:var(--text);font:13px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app-shell{display:grid;grid-template-columns:252px minmax(0,1fr);min-height:100dvh}.sidebar{border-right:1px solid var(--line);background:rgba(7,10,12,.88);padding:24px 16px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:11px;padding:0 10px 28px}.brand-mark{width:32px;height:32px;border-radius:9px;background:var(--accent);color:#06100c;display:grid;place-items:center;font-weight:800;font-size:18px}.brand strong{display:block;font-size:14px;letter-spacing:.02em}.brand span{display:block;color:var(--muted);font-size:10px;margin-top:2px}.nav-label,.eyebrow{color:#6d827c;font-size:10px;letter-spacing:.14em;text-transform:uppercase}.nav-label{padding:0 10px 8px}.nav-item{display:flex;width:100%;justify-content:space-between;align-items:center;border:0;background:transparent;color:var(--muted);padding:10px;border-radius:8px;text-align:left;margin:2px 0}.nav-item span{font:10px var(--mono);opacity:.45}.nav-item:hover,.nav-item.active{background:#13221f;color:var(--text)}.nav-item.active{box-shadow:inset 2px 0 0 var(--accent)}.sidebar-footer{margin-top:auto;border-top:1px solid var(--line);padding:16px 10px 0}.status-line{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;margin-bottom:12px}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#53635e;box-shadow:0 0 0 3px rgba(83,99,94,.12)}.status-dot.online{background:var(--accent);box-shadow:0 0 0 3px rgba(57,214,160,.13)}.status-dot.error{background:var(--danger);box-shadow:0 0 0 3px rgba(255,111,118,.13)}.ghost-button,.text-button{border:0;background:none;color:var(--muted);padding:0;font-size:11px}.ghost-button:hover,.text-button:hover{color:var(--accent)}.main{min-width:0;padding:28px clamp(18px,3vw,46px) 56px}.topbar{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px}.topbar h1{margin:5px 0 0;font-size:26px;letter-spacing:-.04em}.top-actions{display:flex;gap:10px;align-items:center}.connection-pill{border:1px solid var(--line);background:var(--panel);padding:8px 10px;border-radius:999px;color:var(--muted);display:flex;align-items:center;gap:8px;font-size:11px}.icon-button{border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:8px;width:34px;height:34px;font-size:18px}.icon-button:hover{border-color:var(--accent);color:var(--accent)}.auth-banner{display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #245442;background:linear-gradient(100deg,#10241f,#0f1718);padding:14px 16px;border-radius:var(--radius);margin-bottom:24px}.auth-banner strong{display:block}.auth-banner span{display:block;color:var(--muted);font-size:11px;margin-top:3px}.auth-form{display:flex;gap:8px;min-width:340px}.auth-form input,.toolbar input,.toolbar select{min-width:0;flex:1;border:1px solid var(--line);background:#080e10;color:var(--text);padding:9px 10px;border-radius:8px}.primary-button{border:1px solid var(--accent);background:var(--accent);color:#05100c;padding:9px 14px;border-radius:8px;font-weight:700}.primary-button:hover{filter:brightness(1.08)}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:18px}.metric{background:var(--panel);border:1px solid var(--line);padding:15px;border-radius:var(--radius)}.metric-label{color:var(--muted);font-size:11px}.metric-value{font:600 24px var(--mono);margin-top:9px;letter-spacing:-.05em}.metric-note{font-size:10px;color:var(--muted);margin-top:6px}.metric-note.bad{color:var(--danger)}.content-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px}.span-5{grid-column:span 5}.span-7{grid-column:span 7}.span-12{grid-column:span 12}.panel{background:rgba(14,20,23,.92);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}.panel-head,.toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:17px 18px;border-bottom:1px solid var(--line)}h2{font-size:15px;letter-spacing:-.02em;margin:5px 0 0}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:680px}th,td{padding:11px 14px;border-bottom:1px solid #1b2529;text-align:left;white-space:nowrap}th{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#71837e;font-weight:600}td{font-size:12px;color:#c7d5d0}tbody tr:hover{background:#131e1d}.mono{font-family:var(--mono);font-size:11px}.truncate{max-width:240px;overflow:hidden;text-overflow:ellipsis}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 7px;border-radius:999px;background:#17221f;color:var(--accent);font-size:10px}.badge.warn{background:#352a1b;color:var(--warn)}.badge.danger{background:#381e22;color:var(--danger)}.alert-list{padding:4px 18px 12px}.alert{display:flex;gap:10px;align-items:flex-start;padding:13px 0;border-bottom:1px solid #1b2529}.alert:last-child{border-bottom:0}.alert-icon{width:22px;height:22px;display:grid;place-items:center;border-radius:6px;background:#34251b;color:var(--warn);font-size:12px}.alert.danger .alert-icon{background:#381e22;color:var(--danger)}.alert strong{display:block;font-size:12px}.alert span{display:block;color:var(--muted);font-size:11px;margin-top:3px}.toolbar{border:0;padding:0 0 18px}.toolbar h2{font-size:22px}.toolbar-actions{display:flex;gap:8px;min-width:360px}.toolbar-actions select{flex:0 0 140px}.view{animation:fade-in .25s ease}.hidden{display:none!important}.drawer{position:fixed;inset:0;display:flex;justify-content:flex-end;z-index:10}.drawer-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.62)}.drawer-panel{position:relative;width:min(760px,96vw);height:100%;background:#0b1113;border-left:1px solid var(--line);padding:22px;overflow:auto}.drawer-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.drawer-panel pre{white-space:pre-wrap;word-break:break-word;background:#050809;border:1px solid var(--line);padding:15px;border-radius:8px;color:#b8d3c8;font:11px/1.6 var(--mono);min-height:calc(100% - 70px)}.toast{position:fixed;right:24px;bottom:24px;background:#10241f;border:1px solid #245442;color:var(--text);padding:10px 14px;border-radius:8px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateY(0)}@keyframes fade-in{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}@media(max-width:1100px){.app-shell{grid-template-columns:210px 1fr}.metric-grid{grid-template-columns:repeat(3,1fr)}.span-5,.span-7{grid-column:span 12}}@media(max-width:760px){.app-shell{display:block}.sidebar{display:none}.main{padding:20px 14px 40px}.topbar{align-items:center}.auth-banner{display:block}.auth-form{min-width:0;margin-top:12px}.toolbar{display:block}.toolbar-actions{min-width:0;margin-top:12px}.metric-grid{grid-template-columns:repeat(2,1fr)}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
