:root{color-scheme:dark;font-family:Inter,Segoe UI,system-ui,sans-serif;color:#f8fafc;background:#070f1e;font-synthesis:none;--blue: #2563eb;--navy: #0f172a;--surface: #111c30;--surface-2: #0c1729;--border: #23324b;--muted: #94a3b8;--green: #22c55e;--yellow: #f59e0b;--red: #ef4444}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 70% -20%,#142c5b 0,#070f1e 38%)}button,a{font:inherit}button:focus-visible,a:focus-visible{outline:2px solid #60a5fa;outline-offset:3px}.shell{min-height:100vh;display:grid;grid-template-columns:255px 1fr}.sidebar{position:fixed;inset:0 auto 0 0;width:255px;padding:22px 16px;background:#070f1ef0;border-right:1px solid var(--border);display:flex;flex-direction:column;backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:12px;padding:0 8px 22px;border-bottom:1px solid var(--border)}.brand-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);box-shadow:0 10px 30px #2563eb59;font-family:Roboto Condensed,sans-serif;font-weight:800}.brand strong{display:block;letter-spacing:.08em;font-size:13px}.brand small{display:block;color:#60a5fa;margin-top:2px;letter-spacing:.2em}.sidebar nav{overflow-y:auto;padding:18px 0;display:grid;gap:3px;scrollbar-width:thin}.nav-item{min-height:38px;padding:9px 12px;border-radius:9px;text-decoration:none;color:var(--muted);font-size:13px;display:flex;align-items:center;gap:10px}.nav-item.router-link-active{color:#fff;background:linear-gradient(90deg,#2563eb47,#2563eb14);box-shadow:inset 3px 0 #3b82f6}.nav-item.disabled{opacity:.62;cursor:not-allowed}.sidebar-foot{margin-top:auto;color:var(--muted);font-size:12px;display:flex;gap:8px;align-items:center;padding:12px}.pulse{width:7px;height:7px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 5px #f59e0b1f}.workspace{grid-column:2;min-width:0}.topbar{min-height:92px;padding:18px 30px;border-bottom:1px solid rgba(35,50,75,.8);display:flex;align-items:center;justify-content:space-between;background:#070f1e8c;backdrop-filter:blur(12px)}.eyebrow{margin:0 0 5px;color:#60a5fa;text-transform:uppercase;font:700 10px/1.2 Roboto Condensed,sans-serif;letter-spacing:.16em}h1,h2,h3{margin:0;font-family:Roboto Condensed,Inter,sans-serif}h1{font-size:19px}h2{font-size:clamp(24px,3vw,34px)}h3{font-size:18px}.server-state{display:flex;align-items:center;gap:11px;padding:9px 13px;border:1px solid var(--border);border-radius:12px;background:#111c30cc}.server-state div{display:grid;gap:2px}.server-state strong{font-size:12px}.server-state small{color:var(--muted);font-size:10px}.state-dot{width:9px;height:9px;border-radius:50%;background:var(--muted)}.server-state.online .state-dot{background:var(--green);box-shadow:0 0 0 5px #22c55e1f}.dashboard{max-width:1600px;margin:0 auto;padding:30px}.page-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.refresh{border:1px solid var(--border);background:var(--surface);color:#dbeafe;padding:10px 15px;border-radius:10px;cursor:pointer}.refresh:hover:not(:disabled){border-color:#3b82f6}.refresh:disabled{opacity:.55}.notice{border:1px solid;padding:13px 15px;border-radius:12px;margin-bottom:18px;display:grid;gap:4px;font-size:13px}.notice.error{background:#ef444414;border-color:#ef444459}.notice span{color:#fecaca}.notice.warning{background:#f59e0b14;border-color:#f59e0b59}.notice.warning span{color:#fde68a}.text-link{color:#60a5fa;text-decoration:none;font-size:11px}.compact-list{display:grid;gap:7px;margin-top:18px}.compact-list>div{display:grid;gap:2px;padding:10px;border:1px solid var(--border);border-radius:9px}.compact-list span{color:var(--muted);font-size:11px}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(150px,1fr));gap:12px}.metric-card{min-height:145px;background:linear-gradient(150deg,#111c30fa,#0a1527fa);border:1px solid var(--border);border-radius:15px;padding:16px;display:flex;flex-direction:column;overflow:hidden;position:relative}.metric-card:after{content:"";position:absolute;width:80px;height:80px;right:-35px;bottom:-40px;border-radius:50%;background:#94a3b80f}.metric-card header,.panel header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.metric-card header>span:first-child{color:#cbd5e1;font-size:12px}.status-pill{border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:9px;padding:3px 6px;white-space:nowrap}.metric-value{font:700 25px/1 Roboto Condensed,sans-serif;margin:auto 0 9px}.metric-card footer{color:#64748b;font-size:10px}.metric-card.warning{border-color:#f59e0b8c}.metric-card.critical,.metric-card.emergency{border-color:#ef444499}.dashboard-grid{margin-top:14px;display:grid;grid-template-columns:2fr 1fr;gap:14px}.panel{min-height:310px;padding:19px;border:1px solid var(--border);border-radius:15px;background:#111c30cc}.empty-chart,.empty-list{height:230px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:7px;color:var(--muted)}.empty-chart:before{content:"";position:absolute}.empty-icon{font-size:40px;color:#3b82f6}.empty-chart strong,.empty-list strong{color:#cbd5e1}.empty-chart span,.empty-list span{max-width:300px;font-size:12px}.incident-count{color:var(--muted);font:700 26px/1 Roboto Condensed,sans-serif}.mobile-nav{display:none}.nav-icon{width:26px;color:#60a5fa;font:700 10px Roboto Condensed,sans-serif;text-align:center}.mock-banner{margin:12px 4px 0;padding:7px;border:1px solid rgba(245,158,11,.35);border-radius:8px;color:#fbbf24;background:#f59e0b14;text-align:center;font-size:10px;font-weight:800;letter-spacing:.12em}.pulse.online{background:var(--green);box-shadow:0 0 0 5px #22c55e1f}.top-actions{display:flex;align-items:center;gap:10px}.profile-button{border:1px solid var(--border);border-radius:12px;background:var(--surface);color:#f8fafc;padding:9px 12px;display:grid;text-align:left;cursor:pointer}.profile-button small{color:var(--muted);font-size:9px}.page-description{color:var(--muted);font-size:13px;margin:8px 0 0;max-width:650px}.primary-button{border:0;border-radius:10px;padding:12px 16px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);color:#fff;font-weight:700;cursor:pointer;box-shadow:0 10px 28px #2563eb3d}.primary-button:disabled{opacity:.55}.text-button{border:0;background:none;color:#60a5fa;cursor:pointer;padding:8px}.success-text{color:var(--green)}.login-page{min-height:100vh;display:grid;grid-template-columns:minmax(320px,1.15fr) minmax(340px,.85fr);align-items:center;gap:7vw;padding:7vw;background:radial-gradient(circle at 15% 20%,#143370 0,transparent 36%),#070f1e}.login-brand{max-width:610px}.login-brand h1{font-size:clamp(48px,7vw,92px);letter-spacing:-.035em;margin:22px 0 5px}.login-brand>p:not(.eyebrow){font-size:20px;color:#bfdbfe}.brand-mark.large{width:66px;height:66px;border-radius:18px;font-size:20px}.security-note{margin-top:40px;color:var(--muted);font-size:12px}.login-card{width:100%;max-width:430px;justify-self:end;padding:34px;border:1px solid var(--border);border-radius:20px;background:#111c30e0;box-shadow:0 30px 80px #00000059;display:grid;gap:20px;backdrop-filter:blur(18px)}.login-card p{color:var(--muted);line-height:1.5}.login-card label{display:grid;gap:7px;color:#cbd5e1;font-size:12px}.login-card input,.settings-content input,select{width:100%;border:1px solid var(--border);border-radius:10px;background:#091426;color:#f8fafc;padding:12px;outline:none}.login-card input:focus,.settings-content input:focus,select:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #2563eb1f}.metric-detail{min-height:260px;margin-bottom:14px}.mini-chart{position:relative;height:190px;margin-top:18px}.mini-chart svg{width:100%;height:100%;overflow:visible}.chart-no-data{height:100%;display:grid;place-items:center;border:1px dashed var(--border);border-radius:12px;color:var(--muted)}.chart-value{position:absolute;top:6px;right:8px;font:700 22px Roboto Condensed,sans-serif}.data-panel{min-height:180px;margin-top:14px}.table-wrap{overflow:auto;margin:16px -19px -19px}.table-wrap table{border-collapse:collapse;width:100%;font-size:12px}.table-wrap th,.table-wrap td{padding:11px 14px;border-top:1px solid var(--border);text-align:left;white-space:nowrap;max-width:360px;overflow:hidden;text-overflow:ellipsis}.table-wrap th{color:#94a3b8;text-transform:capitalize;background:#0c1729}.table-wrap th button{border:0;background:none;color:inherit;padding:0;cursor:pointer}.empty-state{min-height:170px;display:grid;place-content:center;text-align:center;gap:6px;color:var(--muted)}.empty-state strong{color:#cbd5e1}.incident-list{display:grid;gap:9px;margin-bottom:14px}.incident-row{border:1px solid var(--border);border-radius:13px;padding:14px 16px;background:var(--surface);display:flex;align-items:center;justify-content:space-between;gap:14px}.incident-row>div{display:grid;gap:4px}.incident-row small{color:var(--muted)}.severity{width:max-content;padding:3px 6px;border-radius:99px;font-size:9px;background:#334155}.severity.critical,.severity.emergency{background:#ef444433;color:#fca5a5}.severity.warning{background:#f59e0b33;color:#fcd34d}.settings-layout{display:grid;grid-template-columns:220px 1fr;gap:14px}.settings-nav{display:grid;align-content:start;gap:4px}.settings-nav button{border:0;background:none;color:var(--muted);padding:10px 12px;border-radius:9px;text-align:left;cursor:pointer}.settings-nav button.active{background:#2563eb33;color:#fff}.settings-content{min-height:470px}.setup-box{display:grid;gap:12px;max-width:560px;margin-top:20px}.setup-box code{padding:12px;border-radius:9px;background:#07101f;color:#93c5fd;word-break:break-all}.offline-page{min-height:100vh;display:grid;place-content:center;justify-items:center;text-align:center;padding:25px;background:#070f1e}.offline-page p{color:var(--muted);max-width:500px;line-height:1.6}@media(max-width:1180px){.metric-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.shell{display:block;padding-bottom:calc(70px + env(safe-area-inset-bottom))}.sidebar{display:none}.workspace{display:block}.topbar{min-height:76px;padding:14px 17px}.topbar .eyebrow{display:none}h1{max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.server-state{border:0;background:none;padding:0}.server-state small{display:none}.dashboard{padding:22px 15px}.page-heading{align-items:center}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.metric-card{min-height:132px;padding:14px}.metric-card header{display:grid}.metric-value{font-size:22px}.dashboard-grid{grid-template-columns:1fr}.panel{min-height:260px}.empty-chart,.empty-list{height:185px}.mobile-nav{position:fixed;z-index:10;display:grid;grid-template-columns:repeat(3,1fr);inset:auto 0 0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--border);background:#070f1ef5;backdrop-filter:blur(18px)}.mobile-nav a,.mobile-nav button{min-height:48px;border:0;background:none;color:var(--muted);text-decoration:none;display:grid;place-items:center;gap:2px}.mobile-nav a{color:#60a5fa}.mobile-nav button:disabled{opacity:.5}.mobile-nav small{font-size:10px}.profile-button{display:none}.top-actions{gap:0}.login-page{grid-template-columns:minmax(0,1fr);padding:28px 18px}.login-brand{display:none}.login-card{justify-self:center;width:calc(100vw - 36px);max-width:430px;min-width:0;padding:25px}.settings-layout{grid-template-columns:1fr}.settings-nav{display:flex;overflow:auto;padding-bottom:6px}.settings-nav button{white-space:nowrap}.incident-row{align-items:flex-start;flex-direction:column}.table-wrap{margin-inline:-14px}.page-heading{gap:12px}.page-heading h2{font-size:25px}}.settings-help{color:var(--muted);font-size:13px;line-height:1.5;max-width:720px}.interval-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:20px}.interval-grid label{display:grid;gap:6px;padding:13px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2);font-size:12px}.interval-grid label span{color:#dbeafe;font-weight:700}.interval-grid label small{color:var(--muted)}.interval-grid input:disabled{opacity:.65}.interval-actions{grid-column:1/-1;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.interval-actions .success-text{font-size:12px}.filter-bar{display:grid;grid-template-columns:1fr 2fr 150px auto;gap:10px;margin-bottom:14px}.report-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.report-grid .panel{min-width:0}.update-banner{position:fixed;z-index:30;right:18px;bottom:18px;display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid #3b82f6;border-radius:12px;background:#111c30;box-shadow:0 18px 50px #0006;font-size:12px}.update-banner button{border:0;border-radius:8px;background:#2563eb;color:#fff;padding:8px 10px;cursor:pointer}@media(max-width:760px){.filter-bar,.report-grid,.interval-grid{grid-template-columns:1fr}}.filter-bar label{display:grid;gap:6px;min-width:180px}.filter-bar label>span{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.chart-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}.chart-stats span{display:grid;gap:3px;color:var(--muted);font-size:.75rem}.chart-stats strong{color:var(--text);font-size:.9rem}.hardware-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.hardware-card header,.data-panel header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.hardware-card h3,.device-card h4{margin:4px 0 0}.hardware-card dl,.device-card dl{display:grid;gap:10px;margin:18px 0 0}.hardware-card dl div,.device-card dl div{display:flex;justify-content:space-between;gap:16px;border-top:1px solid var(--border);padding-top:9px}.hardware-card dt,.device-card dt{color:var(--muted);font-size:.78rem}.hardware-card dd,.device-card dd{margin:0;text-align:right;font-weight:700;font-size:.82rem}.device-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:16px}.device-card{padding:16px;border:1px solid var(--border);border-radius:14px;background:color-mix(in srgb,var(--panel) 88%,var(--background))}.device-card small{color:var(--muted);font-weight:500}@media(max-width:900px){.hardware-grid{grid-template-columns:1fr}.chart-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}.settings-summary{display:grid;gap:10px;margin:18px 0}.settings-summary div{display:flex;justify-content:space-between;gap:20px;padding:12px;border:1px solid var(--border);border-radius:10px}.settings-summary dt{color:var(--muted)}.settings-summary dd{margin:0;font-weight:800;text-align:right}