*{box-sizing:border-box;margin:0}:root{--bg: #eef2f9;--bg2: #e3e9f4;--surface: rgba(255, 255, 255, .66);--surface2: rgba(255, 255, 255, .85);--ink: #0b1220;--ink2: #46536b;--ink3: #64708a;--line: rgba(11, 18, 32, .1);--brand: #1d4ed8;--sky: #38bdf8;--green: #0e8a5f;--amber: #b45309;--danger: #c42348}body{font-family:Helvetica Neue,Segoe UI,system-ui,sans-serif;color:var(--ink);background:radial-gradient(50rem 30rem at 90% -10%,rgba(56,189,248,.16),transparent 60%),radial-gradient(40rem 26rem at -10% 110%,rgba(29,78,216,.12),transparent 60%),linear-gradient(var(--bg),var(--bg2));background-attachment:fixed;min-height:100vh}.app{display:flex;min-height:100vh}.side{width:230px;padding:24px 14px;position:sticky;top:0;height:100vh;background:var(--surface);-webkit-backdrop-filter:blur(20px) saturate(1.4);backdrop-filter:blur(20px) saturate(1.4);border-inline-end:1px solid var(--line);display:flex;flex-direction:column;gap:4px}.logo{font-weight:900;font-size:22px;letter-spacing:-.5px;margin-bottom:18px;padding:0 10px}.logo span{color:var(--sky)}.nav-item{display:block;width:100%;text-align:start;border:0;cursor:pointer;padding:10px 12px;border-radius:12px;font-size:14px;font-weight:500;background:transparent;color:var(--ink2)}.nav-item:hover{background:#0b12200d}.nav-item.active{background:var(--brand);color:#fff}.side .foot{margin-top:auto;font-size:11px;color:var(--ink3);padding:0 10px}.main{flex:1;padding:28px 32px;max-width:1100px}h1{font-size:26px;letter-spacing:-.5px;margin-bottom:18px}h2{font-size:15px;margin:18px 0 8px}.card{background:var(--surface);-webkit-backdrop-filter:blur(20px) saturate(1.4);backdrop-filter:blur(20px) saturate(1.4);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 8px 30px -14px #0b12202e;margin-bottom:14px}.grid{display:grid;gap:12px}.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}.stat .n{font-size:26px;font-weight:800;color:var(--brand)}.stat .l{font-size:12px;color:var(--ink3);text-transform:uppercase;letter-spacing:.5px}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:start;color:var(--ink3);font-size:11px;text-transform:uppercase;letter-spacing:.5px;padding:6px 8px}td{padding:8px;border-top:1px solid var(--line)}input,select,textarea{font:inherit;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface2);color:var(--ink);outline:none;width:100%}input:focus,select:focus{border-color:var(--brand)}button.btn{font:inherit;font-weight:600;cursor:pointer;border:0;border-radius:12px;padding:10px 16px;background:var(--brand);color:#fff}button.btn.ghost{background:transparent;color:var(--ink2);border:1px solid var(--line)}button.btn.small{padding:6px 10px;font-size:12px;border-radius:9px}button.btn.danger{background:var(--danger)}button.btn.green{background:var(--green)}.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:600}.badge.ok{background:#0e8a5f1f;color:var(--green)}.badge.warn{background:#b453091f;color:var(--amber)}.badge.off{background:#c423481f;color:var(--danger)}.row{display:flex;gap:10px;align-items:center}.row .grow{flex:1}.muted{color:var(--ink3);font-size:12px}.login-wrap{min-height:100vh;display:grid;place-items:center}.login{width:360px}label{font-size:12px;font-weight:600;color:var(--ink2);display:block;margin:10px 0 4px}.err{color:var(--danger);font-size:13px;margin-top:8px}
