@font-face{font-family:"Inter";font-weight:400;font-display:swap;src:url("/static/fonts/Inter-Regular.otf") format("opentype")}
@font-face{font-family:"Inter";font-weight:500;font-display:swap;src:url("/static/fonts/Inter-Medium.otf") format("opentype")}
@font-face{font-family:"Inter";font-weight:600;font-display:swap;src:url("/static/fonts/Inter-SemiBold.otf") format("opentype")}
@font-face{font-family:"Inter";font-weight:700;font-display:swap;src:url("/static/fonts/Inter-Bold.otf") format("opentype")}
@font-face{font-family:"Inter";font-weight:800;font-display:swap;src:url("/static/fonts/Inter-ExtraBold.otf") format("opentype")}
/* Design system: light content + dark navy sidebar (dark content via html[data-theme=dark]) */
:root{
  --bg:#eef2fb;--bg2:#f6f8fd;--panel:#ffffff;--panel2:#f3f6fc;--panel3:#e8eefa;--line:#e3e9f5;--line2:#d2dbec;
  --text:#101a3a;--text2:#2a3558;--muted:#63708f;--muted2:#93a0bb;
  --accent:#2f6bff;--accent2:#6d5df6;--purple:#7c5cf6;--ok:#10b981;--warn:#f59e0b;--bad:#ef4444;--info:#0ea5e9;
  --ok-bg:#dff7ec;--warn-bg:#fff1d6;--bad-bg:#fde6e6;--info-bg:#dff1fd;--muted-bg:#e9edf6;
  --shadow:0 6px 22px rgba(30,50,110,.08);--radius:16px;--topbar:76px;--sidebar:254px;
  --side-bg:linear-gradient(180deg,#0a1130 0%,#0c1740 55%,#0a1232 100%);--side-text:#d6def5;--side-muted:#7d8bb5;--side-line:rgba(255,255,255,.08);
  --tint-blue:linear-gradient(135deg,#e6efff,#f5f8ff);--tint-green:linear-gradient(135deg,#dff6ea,#f3fbf7);--tint-red:linear-gradient(135deg,#fde6e6,#fff5f5);
  --tint-purple:linear-gradient(135deg,#ece6fd,#f8f5ff);--tint-amber:linear-gradient(135deg,#fff0d2,#fffaec);
}
html[data-theme=dark]{
  --bg:#0a1024;--bg2:#0e1630;--panel:#111a36;--panel2:#16213f;--panel3:#1c294c;--line:#1f2b4d;--line2:#2b3a63;
  --text:#e8edfb;--text2:#c6d0ea;--muted:#8c9abf;--muted2:#5f6e95;
  --accent:#4f86ff;--accent2:#8b7bff;--ok:#22c58b;--warn:#f5a524;--bad:#f25c5c;--info:#38bdf8;
  --ok-bg:rgba(34,197,139,.16);--warn-bg:rgba(245,165,36,.16);--bad-bg:rgba(242,92,92,.16);--info-bg:rgba(56,189,248,.16);--muted-bg:rgba(140,154,191,.16);
  --shadow:0 10px 28px rgba(0,0,0,.35);
  --tint-blue:linear-gradient(135deg,rgba(79,134,255,.22),rgba(79,134,255,.06));--tint-green:linear-gradient(135deg,rgba(34,197,139,.2),rgba(34,197,139,.05));
  --tint-red:linear-gradient(135deg,rgba(242,92,92,.2),rgba(242,92,92,.05));--tint-purple:linear-gradient(135deg,rgba(139,123,255,.22),rgba(139,123,255,.06));
  --tint-amber:linear-gradient(135deg,rgba(245,165,36,.2),rgba(245,165,36,.05));
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font:14px/1.5 "Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
h1{font-size:30px;font-weight:800;letter-spacing:-.02em;margin:0 0 6px}h2{font-size:17px;font-weight:700;margin:0 0 12px}h3{font-size:14px;margin:14px 0 8px}
.muted{color:var(--muted)}small{color:var(--muted)}.tiny{font-size:12px}.center{text-align:center}
.mono,code,pre,kbd{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.only-dark{display:none}.only-light{display:inline-flex}
html[data-theme=dark] .only-dark{display:inline-flex}html[data-theme=dark] .only-light{display:none}
.ico{vertical-align:middle;flex:none}

/* sidebar (always dark) */
.sidebar{position:fixed;top:0;left:0;bottom:0;width:var(--sidebar);background:var(--side-bg);color:var(--side-text);display:flex;flex-direction:column;z-index:30;transition:width .15s}
.side-brand{display:flex;align-items:center;gap:10px;padding:16px 14px 16px 12px;border-bottom:1px solid var(--side-line);min-height:var(--topbar)}
.hamb{width:34px;height:34px;border-radius:9px;border:1px solid var(--side-line);background:rgba(255,255,255,.04);color:var(--side-text);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:none}
.hamb:hover{background:rgba(255,255,255,.1)}
.brand{display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none!important;min-width:0}
.brand-mark{display:inline-flex;align-items:center;justify-content:center;flex:none}
.brand-text{display:flex;flex-direction:column;line-height:1.1;min-width:0}
.brand-text b{font-size:21px;font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.brand-text small{font:600 9.5px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.06em;color:var(--side-muted);white-space:nowrap}
.side-nav{flex:1;overflow:auto;padding:6px 10px 10px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}
.side-section{display:flex;align-items:center;gap:10px;font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--side-muted);padding:18px 8px 8px}
.side-section::before{content:"";width:16px;height:2px;border-radius:2px;background:#3b62d6}
.side-nav ul{list-style:none;margin:0;padding:0}
.side-nav li a{display:flex;align-items:center;gap:12px;padding:10px 12px;margin-bottom:3px;border-radius:10px;color:var(--side-text);font-weight:500;font-size:15px;white-space:nowrap}
.side-nav li a:hover{background:rgba(255,255,255,.07);color:#fff;text-decoration:none}
.side-nav li a.active{background:linear-gradient(90deg,#3b82f6,#6d5df6);color:#fff;font-weight:700;box-shadow:0 6px 18px rgba(79,110,255,.35)}
.nav-badge{margin-left:auto;background:var(--bad);color:#fff;font-size:11px;font-weight:700;border-radius:9px;padding:1px 7px;font-style:normal}
.side-promo{position:relative;margin:8px 12px;padding:16px 16px 34px;border-radius:14px;border:1px solid rgba(96,133,255,.35);background:linear-gradient(135deg,#0f1d52,#0b1438);overflow:hidden;line-height:1.35;color:#dfe6ff}
.side-promo span{display:block;font-size:14px}.side-promo b{display:block;font-size:16px;font-weight:800;color:#fff}
.side-promo svg{position:absolute;left:0;right:0;bottom:0;width:100%;height:46px}
.side-foot{padding:12px;text-align:center;color:var(--side-muted);font-size:12.5px}
html.nav-collapsed{--sidebar:72px}
html.nav-collapsed .brand-text,html.nav-collapsed .side-nav li a span,html.nav-collapsed .side-section,html.nav-collapsed .side-promo,html.nav-collapsed .side-foot,html.nav-collapsed .nav-badge,html.nav-collapsed .brand-mark{display:none}
html.nav-collapsed .side-brand{justify-content:center;padding-left:0;padding-right:0}html.nav-collapsed .side-nav li a{justify-content:center;padding:11px 0}

/* top bar */
.topbar{position:fixed;top:0;left:var(--sidebar);right:0;height:var(--topbar);display:flex;align-items:center;gap:18px;padding:0 30px;background:var(--panel);border-bottom:1px solid var(--line);z-index:20;transition:left .15s}
.global-search{flex:1;max-width:560px;display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line2);border-radius:14px;padding:0 14px 0 16px;height:48px;color:var(--muted)}
.global-search input,.global-search input:focus{flex:1;border:0!important;outline:0!important;background:transparent!important;padding:0!important;box-shadow:none!important;color:var(--text);font:inherit;font-size:15px;height:100%}
.global-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(47,107,255,.15)}
.global-search kbd{font-size:11px;border:1px solid var(--line2);border-radius:7px;padding:2px 8px;color:var(--muted);background:var(--bg2);white-space:nowrap}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:16px}
.top-clock{display:flex;align-items:center;gap:12px;color:var(--accent)}
.top-clock span{display:flex;flex-direction:column;line-height:1.25}.top-clock b{font-size:13.5px;color:var(--text);font-weight:700}.top-clock small{font-size:12px}
.theme-seg{display:inline-flex;background:var(--panel3);border-radius:999px;padding:4px;gap:2px}
.theme-seg button{width:32px;height:32px;border-radius:50%;border:0;background:transparent;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
html[data-theme=light] .theme-seg [data-theme-set=light],html[data-theme=dark] .theme-seg [data-theme-set=dark]{background:var(--accent);color:#fff;box-shadow:0 0 0 4px rgba(47,107,255,.2)}
.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:0;background:transparent;color:var(--text);cursor:pointer}
.icon-btn:hover{background:var(--panel2);text-decoration:none}
.icon-btn .badge{position:absolute;top:0;right:0;min-width:20px;height:20px;border-radius:10px;background:var(--bad);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;padding:0 5px;border:2px solid var(--panel)}
.user-menu{position:relative}.user-menu summary{list-style:none;cursor:pointer}.user-menu summary::-webkit-details-marker{display:none}
.user-chip{display:flex;align-items:center;gap:10px;padding:5px 12px 5px 5px;border-radius:999px;border:1px solid var(--line2);background:var(--bg2);color:var(--text)}
.avatar{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.uname{font-size:13px;font-weight:600}
.role-badge{font:600 10.5px "JetBrains Mono",ui-monospace,monospace;border:1px solid var(--accent);color:var(--accent);border-radius:5px;padding:2px 7px;letter-spacing:.02em}
.role-badge.super{border-color:var(--bad);color:var(--bad)}.caret{color:var(--muted);font-size:11px}
.user-menu .menu{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:var(--panel);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:8px;z-index:40}
.menu-head{padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:6px;display:flex;flex-direction:column}
.user-menu .menu a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;color:var(--text)}.user-menu .menu a:hover{background:var(--panel2);text-decoration:none}

/* layout */
body.has-nav .content{margin-left:var(--sidebar);padding:calc(var(--topbar) + 30px) 36px 48px;transition:margin-left .15s}
body.bare .content{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}
.eyebrow{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700;margin-bottom:4px}
.subtitle{margin:0;color:var(--muted);font-size:16px}
.header-side{display:flex;gap:14px;align-items:stretch}
.head-card{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 22px;box-shadow:var(--shadow);line-height:1.3}
.head-card b{display:block;font-size:16px;font-weight:700}.head-card small{font-size:13px}
.head-card.bad b{color:var(--bad)}.head-card.ok b{color:var(--ok)}
.pulse{width:30px;height:30px;border-radius:50%;flex:none}.pulse.bad{background:var(--bad);box-shadow:0 0 0 7px var(--bad-bg)}.pulse.ok{background:var(--ok);box-shadow:0 0 0 7px var(--ok-bg)}.pulse.warn{background:var(--warn);box-shadow:0 0 0 7px var(--warn-bg)}
.clock-card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:8px 14px;text-align:right;line-height:1.2}
.status-pill{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:12px;font-weight:600;border:1px solid var(--line)}
.status-pill.ok{color:var(--ok);background:var(--ok-bg)}.status-pill.bad{color:var(--bad);background:var(--bad-bg)}.status-pill.warn{color:var(--warn);background:var(--warn-bg)}

/* cards & grids */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:20px;box-shadow:var(--shadow)}
.card h2{display:flex;align-items:center;justify-content:space-between;gap:10px}
.card h2 .view-all{font-size:12.5px;font-weight:600}
.btn-view{border:1px solid var(--line2);border-radius:9px;padding:5px 12px;color:var(--text2);background:var(--bg2)}
.card-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.card-head .tile{width:46px;height:46px}.card-head h2{margin:0;display:block}.card-head .sub{color:var(--muted);font-size:13px}
.card-head .right{margin-left:auto;text-align:right;line-height:1.2}.card-head .right b{font-size:24px;font-weight:800;color:var(--ok)}.card-head .right small{display:block}
.tile{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:14px;flex:none}
.tile.blue{background:#dbe7ff;color:#2f6bff}.tile.green{background:#cdf2e1;color:#10b981}.tile.red{background:#fbd5d5;color:#ef4444}.tile.purple{background:#ddd3fb;color:#7c5cf6}.tile.amber{background:#ffe6b3;color:#e08a00}.tile.grey{background:var(--muted-bg);color:var(--muted)}
html[data-theme=dark] .tile.blue{background:rgba(79,134,255,.22)}html[data-theme=dark] .tile.green{background:rgba(34,197,139,.2)}html[data-theme=dark] .tile.red{background:rgba(242,92,92,.2)}html[data-theme=dark] .tile.purple{background:rgba(139,123,255,.24)}html[data-theme=dark] .tile.amber{background:rgba(245,165,36,.22)}
.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(auto-fit,minmax(380px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid .card{margin-bottom:0}
.dash-row{display:grid;gap:18px;margin-bottom:18px}.dash-row .card{margin-bottom:0}
.dash-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
.dash-mini{grid-template-columns:repeat(4,minmax(0,1fr))}
.dash-charts{grid-template-columns:minmax(0,.85fr) minmax(0,1.05fr) minmax(0,1.05fr)}
.dash-two{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.dash-three{grid-template-columns:minmax(0,1.2fr) minmax(0,1.1fr) minmax(0,1fr)}
@container main (max-width:1250px){.dash-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.dash-charts,.dash-three{grid-template-columns:1fr 1fr}}
@media (max-width:1000px){.dash-kpis,.dash-mini{grid-template-columns:1fr 1fr}.dash-charts,.dash-two,.dash-three{grid-template-columns:1fr}}
.kpi{display:flex;flex-direction:column;justify-content:center;gap:10px;min-height:146px;padding:20px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--shadow);color:var(--text);text-decoration:none!important}
.kpi-main{display:flex;align-items:center;gap:14px}
.kpi .kpi-value{display:block;font-size:30px;font-weight:800;line-height:1.05;letter-spacing:-.02em}.kpi .kpi-label{display:block;color:var(--muted);font-size:14.5px}
.kpi .kpi-sub{font-size:13px;color:var(--accent)}.kpi .kpi-sub.ok{color:var(--ok)}.kpi .kpi-sub.bad{color:var(--bad)}
.kpi.tint-blue{background:var(--tint-blue)}.kpi.tint-green{background:var(--tint-green)}.kpi.tint-red{background:var(--tint-red)}.kpi.tint-purple{background:var(--tint-purple)}.kpi.tint-amber{background:var(--tint-amber)}
.mini{display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px 22px;box-shadow:var(--shadow);color:var(--text);text-decoration:none!important}
.mini .ico{color:var(--muted)}.mini b{display:block;font-size:22px;font-weight:800;line-height:1.1}.mini small{font-size:14px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:20px}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow)}
.stat .n{font-size:26px;font-weight:800}.stat .l{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em;font-weight:600}

/* tables */
table{width:100%;border-collapse:collapse;font-size:13.5px}
th,td{text-align:left;padding:10px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:600;font-size:12px;letter-spacing:.03em;text-transform:uppercase}
tbody tr:hover td{background:rgba(47,107,255,.04)}
table.compact th,table.compact td{padding:8px 8px}
.num{text-align:right;font-variant-numeric:tabular-nums}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap;text-transform:capitalize}
.pill-ok{background:var(--ok-bg);color:var(--ok)}.pill-bad{background:var(--bad-bg);color:var(--bad)}
.pill-warn{background:var(--warn-bg);color:#c27803}.pill-muted{background:var(--muted-bg);color:var(--muted)}.pill-info{background:var(--info-bg);color:var(--info)}
html[data-theme=dark] .pill-warn{color:var(--warn)}
.dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle}.dot-ok{background:var(--ok)}.dot-bad{background:var(--bad)}.dot-warn{background:var(--warn)}.dot-muted{background:var(--muted2)}

/* buttons & forms */
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border:0;border-radius:10px;padding:9px 16px;font-weight:600;cursor:pointer;font-size:13.5px;line-height:1.2;font-family:inherit}
.btn:hover{filter:brightness(1.07);text-decoration:none}
.btn-secondary{background:var(--panel);color:var(--text);border:1px solid var(--line2)}
.btn-danger{background:var(--bad);color:#fff}.btn-sm{padding:5px 10px;font-size:12px}.btn-block{width:100%;justify-content:center}
form.inline{display:inline}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.field span{font-size:12.5px;color:var(--muted);font-weight:600}
input[type=text],input[type=password],input[type=number],input[type=email],input[type=search],input[type=datetime-local],select,textarea{width:100%;background:var(--bg2);color:var(--text);border:1px solid var(--line2);border-radius:10px;padding:9px 12px;font:inherit}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(47,107,255,.25);border-color:var(--accent)}
textarea.code{font-family:"JetBrains Mono",ui-monospace,Menlo,monospace;font-size:12px;min-height:320px;white-space:pre}
pre,code{font-size:12px}
pre{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px;overflow:auto}
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.flash{padding:11px 16px;border-radius:12px;margin-bottom:18px;border:1px solid var(--line);background:var(--panel)}
.flash-success{border-color:var(--ok);background:var(--ok-bg)}.flash-error{border-color:var(--bad);background:var(--bad-bg)}.flash-warning{border-color:var(--warn);background:var(--warn-bg)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:20px;flex-wrap:wrap}
.tabs a{padding:10px 14px;color:var(--muted);border-bottom:2px solid transparent;font-weight:600}
.tabs a.active,.tabs a:hover{color:var(--accent);border-bottom-color:var(--accent);text-decoration:none}
.banner{padding:11px 16px;border-radius:12px;border:1px solid var(--warn);background:var(--warn-bg);margin-bottom:14px}
.banner-error{border-color:var(--bad);background:var(--bad-bg)}.banner-ok{border-color:var(--ok);background:var(--ok-bg)}.banner-info{border-color:var(--info);background:var(--info-bg)}
.kv{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;font-size:13.5px}.kv dt{color:var(--muted)}.kv dd{margin:0}
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:10px;flex-wrap:wrap}
.checkbox{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.progress{height:8px;border-radius:4px;background:var(--muted-bg);overflow:hidden;flex:1}.progress i{display:block;height:100%;background:var(--accent)}
.progress.bad i{background:var(--bad)}.progress.warn i{background:var(--warn)}

/* dashboard widgets */
.donut-col{display:flex;flex-direction:column;align-items:center;gap:22px;padding:6px 0 4px}
.donut-wrap{display:flex;align-items:center;gap:18px}
.donut{width:170px;height:170px;flex:none;position:relative}
.donut .center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.15}
.donut .center b{font-size:34px;font-weight:800;letter-spacing:-.02em}.donut .center small{font-size:13px}
.legend{list-style:none;margin:0;padding:0;font-size:14.5px}.legend li{display:flex;justify-content:space-between;gap:22px;padding:6px 0;white-space:nowrap}
.legend li span:first-child{display:flex;align-items:center;gap:6px}.legend .v{color:var(--text2);font-family:"JetBrains Mono",ui-monospace,monospace;font-size:13px}
.chart{width:100%;height:250px;display:block}
.chart text{font:10px "JetBrains Mono",ui-monospace,monospace;fill:var(--muted)}.chart line.grid{stroke:var(--line2);stroke-dasharray:4 4}
.chart polyline{fill:none;stroke-width:2;stroke-linejoin:round}.chart polygon{opacity:.22;stroke:none}
.chart-legend{display:flex;gap:18px;justify-content:flex-end;font-size:13px;color:var(--muted);margin-bottom:4px}
.chart-legend i{display:inline-block;width:12px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
.netmap-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:10px}
.events td.time{color:var(--muted);white-space:nowrap}
.health{list-style:none;margin:0;padding:0}.health li{display:grid;grid-template-columns:20px 1fr 110px 54px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.health li:last-child{border-bottom:0}.health .fix{font-size:12px;color:var(--bad)}
.lvl{font:700 10px "JetBrains Mono",ui-monospace,monospace;padding:3px 7px;border-radius:5px}.lvl-info{background:var(--info-bg);color:var(--info)}.lvl-warn{background:var(--warn-bg);color:#c27803}.lvl-error{background:var(--bad-bg);color:var(--bad)}
.empty{color:var(--muted);padding:18px 0;text-align:center}

/* login */
.login-page{width:100%;max-width:1240px;min-height:calc(100vh - 48px);display:flex;flex-direction:column;gap:12px}
.login-top{display:flex;justify-content:space-between;align-items:center;padding:4px 0 10px}
.login-page .brand{color:var(--text)}.login-page .brand-text small{color:var(--muted)}
.brand.big .brand-text b{font-size:26px}.brand.big .brand-text small{font-size:11px}
.login-wrap{display:grid;grid-template-columns:1.15fr .95fr;gap:48px;align-items:center;flex:1}
.login-hero .eyebrow{font-size:12px;color:var(--muted)}
.login-hero h2{font-size:48px;font-weight:800;line-height:1.05;margin:6px 0 10px;letter-spacing:-.03em}
.login-hero .tagline{font-size:20px;color:var(--muted);letter-spacing:.04em;margin:0 0 26px}
.hero-features{list-style:none;padding:0;margin:0 0 20px;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;max-width:720px}
.hero-features li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;color:var(--text2);font-size:12.5px;line-height:1.3}
.hero-features .ico{color:var(--accent)}
.hero-net{width:100%;max-width:720px;height:auto;display:block}
.login-box{background:var(--panel);border:1px solid var(--line);border-radius:22px;padding:36px 42px;box-shadow:var(--shadow);width:100%;max-width:540px;justify-self:center}
.login-box .brand.center{justify-content:center;margin-bottom:18px}
.login-box h1{text-align:center;font-size:30px;margin-bottom:4px}.login-box>p.muted{text-align:center;margin:0 0 22px;font-size:15px}
.input-icon{display:flex;align-items:center;gap:10px;background:var(--bg2);border:1px solid var(--line2);border-radius:12px;padding:0 12px}
.input-icon .ico{color:var(--muted)}
.input-icon input{border:0!important;background:transparent!important;padding:13px 0!important;font-size:15px;outline:0!important}
.input-icon:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(47,107,255,.18)}
.input-icon .eye{background:none;border:0;color:var(--muted);cursor:pointer;font-size:15px;padding:4px}
.login-row{display:flex;justify-content:space-between;align-items:center;margin:4px 0 20px;font-size:14px}
.btn-lg{padding:14px 18px;font-size:16px;border-radius:12px;background:linear-gradient(90deg,#3b82f6,#6d5df6);box-shadow:0 8px 20px rgba(79,110,255,.3)}
.login-foot{display:flex;gap:18px;color:var(--muted);font-size:12px;padding:10px 0}
.login-foot span+span::before{content:"|";margin-right:18px;color:var(--line2)}
@media (max-width:980px){.login-wrap{grid-template-columns:1fr}.login-hero{display:none}}
@media (max-width:900px){.sidebar{display:none}.topbar{left:0;padding:0 14px}body.has-nav .content{margin-left:0;padding-left:16px;padding-right:16px}.top-clock,.role-badge{display:none}}

/* uploaded logo */
.brand-img{display:block;width:auto;max-width:170px;object-fit:contain}
html.nav-collapsed .brand-img{display:none}

/* responsive */
.mobile-only{display:none}.nav-backdrop{display:none}
.card{overflow-x:auto}
img,svg{max-width:100%}
@media (max-width:1280px){html:not(.fluid) .top-clock small{display:none}html:not(.fluid) .role-badge.super{display:none}html:not(.fluid) body.has-nav .content{padding-left:24px;padding-right:24px}html:not(.fluid) .topbar{padding:0 20px;gap:12px}}
@media (max-width:1000px){
  .mobile-only{display:inline-flex}
  .sidebar{display:flex;width:270px;transform:translateX(-100%);transition:transform .2s;box-shadow:0 0 40px rgba(0,0,0,.4)}
  html.nav-open .sidebar{transform:none}
  html.nav-open .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(5,10,30,.55);z-index:25}
  html.nav-collapsed{--sidebar:254px}
  html.nav-collapsed .brand-text,html.nav-collapsed .side-nav li a span,html.nav-collapsed .side-section,html.nav-collapsed .side-promo,html.nav-collapsed .side-foot,html.nav-collapsed .brand-mark{display:revert}
  html.nav-collapsed .side-nav li a{justify-content:flex-start;padding:10px 12px}
  .topbar{left:0;padding:0 12px;gap:8px}
  body.has-nav .content{margin-left:0;padding:calc(var(--topbar) + 18px) 14px 32px}
  .top-clock,.role-badge,.global-search kbd,.uname,.caret{display:none}
  .user-chip{padding:4px}
  .page-header{flex-direction:column;align-items:stretch}.header-side{flex-wrap:wrap}.head-card{flex:1;min-width:200px;padding:10px 14px}
  h1{font-size:24px}.subtitle{font-size:14px}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .tabs{flex-wrap:nowrap;overflow-x:auto}.tabs a{white-space:nowrap}
  .kv{grid-template-columns:1fr}.kv dt{margin-top:6px}
  table{min-width:520px}
}
@media (max-width:560px){
  .dash-kpis,.dash-mini{grid-template-columns:1fr 1fr;gap:12px}.kpi{min-height:0;padding:14px}.kpi .kpi-value{font-size:24px}.tile{width:44px;height:44px}
  .mini{padding:12px 14px}.card{padding:16px}.global-search{height:42px}
  .login-box{padding:26px 20px}.hero-features{grid-template-columns:repeat(3,1fr)}
  .stats{grid-template-columns:1fr 1fr}
}

/* ===== sign-in page (mockup layout; sizes scale with the viewport) ===== */
.content:has(.login-page){padding:0!important;display:block!important}
.login-page{position:relative;min-height:100vh;width:100%;max-width:none;overflow:hidden;display:grid;grid-template-columns:55fr 45fr;gap:0;
  background:radial-gradient(900px 500px at 12% 0,#ffffff 0,transparent 70%),linear-gradient(180deg,#eaf1fa 0,#f3f7fc 45%,#eef3fa 100%)}
html[data-theme=dark] .login-page{background:radial-gradient(900px 500px at 12% 0,#16254a 0,transparent 70%),linear-gradient(180deg,#0a1024,#0b1430)}
.lg-scene{position:absolute;left:0;bottom:0;width:60%;height:56%;z-index:0;pointer-events:none}
.lg-scene .scene,.lg-scene img{width:100%;height:100%;display:block;max-width:none}
.lg-scene img{object-fit:cover;object-position:left bottom;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%);mask-image:linear-gradient(180deg,transparent 0,#000 22%)}
.lg-scene::after{content:"";position:absolute;right:0;top:0;bottom:0;width:22%;background:linear-gradient(90deg,transparent,rgba(238,243,250,.0))}
html[data-theme=dark] .lg-scene{filter:brightness(.7) saturate(1.05)}
.lg-tools{position:absolute;top:clamp(14px,2.4vh,26px);right:clamp(18px,3.4vw,54px);display:flex;align-items:center;gap:14px;z-index:3;color:var(--text2)}
.lg-lang{display:inline-flex;align-items:center;gap:8px;font-size:18px;color:var(--text2)}
.lg-lang select{border:0!important;background:transparent!important;font:inherit;color:inherit;padding:4px 2px!important;width:auto;cursor:pointer;outline:0!important}
.lg-brand{display:flex;align-items:center;gap:22px;color:var(--text)}
.lg-brand span{display:flex;flex-direction:column;line-height:1.18}
.lg-brand b{font-size:32px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}
.lg-brand small{font-size:21px;font-weight:600;letter-spacing:.34em;text-transform:uppercase;color:var(--text)}
.lg-brand .brand-img{max-width:320px}
.lg-hero{position:relative;z-index:2;padding:clamp(28px,5.6vh,60px) 0 0 clamp(24px,6vw,92px)}
.lg-eyebrow{margin-top:clamp(18px,4.4vh,46px);font-size:17px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:#7a889f}
.lg-hero h2{font-size:clamp(34px,3.7vw,57px);font-weight:800;line-height:1.02;letter-spacing:-.015em;margin:clamp(6px,1vh,12px) 0 clamp(8px,1.6vh,18px);color:#0f1f4b}
html[data-theme=dark] .lg-hero h2{color:#eef3ff}
.lg-tagline{font-size:clamp(17px,1.6vw,25px);color:#8b9bb6;letter-spacing:.07em;margin:0 0 clamp(16px,3.6vh,40px)}.lg-tagline i{font-style:normal;margin:0 .35em}
.lg-features{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,auto);justify-content:start;gap:clamp(18px,3.2vw,50px)}
.lg-features li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;color:#22335c;font-size:15.5px;line-height:1.25}
html[data-theme=dark] .lg-features li{color:#c9d6f2}
.lg-features .ico{color:#3a5486;stroke-width:1.5}html[data-theme=dark] .lg-features .ico{color:#8fb0ee}
.lg-card{position:relative;z-index:2;align-self:center;justify-self:start;width:min(634px,92%);margin:clamp(20px,5vh,56px) 0 clamp(40px,7vh,78px);
  background:var(--panel);border-radius:28px;box-shadow:0 24px 70px rgba(40,70,130,.16);border:1px solid rgba(255,255,255,.7);padding:clamp(26px,5.2vh,56px) clamp(22px,2.8vw,43px) clamp(20px,3.4vh,36px)}
html[data-theme=dark] .lg-card{border-color:var(--line)}
.lg-card .lg-brand{justify-content:center}
.lg-card h1{text-align:center;font-size:clamp(26px,2.2vw,34px);font-weight:800;margin:clamp(14px,3.2vh,34px) 0 8px;color:#0f1f4b;letter-spacing:-.01em}
html[data-theme=dark] .lg-card h1{color:var(--text)}
.lg-sub{text-align:center;font-size:18px;color:#2c4170;margin:0 0 clamp(16px,3.6vh,38px)}html[data-theme=dark] .lg-sub{color:var(--muted)}
.lg-field{display:block;margin-bottom:clamp(14px,2.8vh,30px)}
.lg-field>span:first-child{display:block;font-size:17px;font-weight:600;color:var(--text);margin-bottom:10px}
.lg-input{display:flex;align-items:center;gap:14px;height:54px;border:1px solid #dbe3ef;border-radius:10px;background:var(--panel);padding:0 18px;color:#5a6b8a}
html[data-theme=dark] .lg-input{border-color:var(--line2);background:var(--bg2)}
.lg-input input{flex:1;border:0!important;outline:0!important;background:transparent!important;padding:0!important;font-size:17px;color:var(--text);height:100%}
.lg-input input::placeholder{color:#8a97ad}
.lg-input:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(47,107,255,.16)}
.lg-input .eye{border:0;background:none;color:#42547a;cursor:pointer;padding:0;display:inline-flex}
.lg-row{display:flex;justify-content:space-between;align-items:center;font-size:16.5px;margin:-2px 0 clamp(16px,3vh,30px)}
.lg-check{display:inline-flex;align-items:center;gap:12px;cursor:pointer;color:var(--text2)}
.lg-check input{appearance:none;-webkit-appearance:none;width:24px;height:24px;border-radius:6px;border:1.5px solid #c5d0e2;background:var(--panel);margin:0;cursor:pointer;display:inline-grid;place-content:center}
.lg-check input:checked{background:#1677ff;border-color:#1677ff}
.lg-check input:checked::after{content:"";width:11px;height:6px;border-left:2.4px solid #fff;border-bottom:2.4px solid #fff;transform:rotate(-45deg) translate(1px,-1px)}
.lg-submit{width:100%;height:60px;border:0;border-radius:11px;cursor:pointer;font:600 20px "Inter",sans-serif;color:#fff;display:flex;align-items:center;justify-content:center;gap:12px;
  background:linear-gradient(90deg,#0d6efd,#2d8cff);box-shadow:0 10px 22px rgba(22,119,255,.32)}
.lg-submit:hover{filter:brightness(1.06)}
.lg-divider{display:flex;align-items:center;gap:18px;color:#3b4d75;font-size:16.5px;margin:clamp(16px,3.4vh,38px) 0 clamp(12px,1.8vh,20px)}
.lg-divider::before,.lg-divider::after{content:"";flex:1;height:1px;background:#dfe6f1}html[data-theme=dark] .lg-divider{color:var(--muted)}html[data-theme=dark] .lg-divider::before,html[data-theme=dark] .lg-divider::after{background:var(--line2)}
.lg-sso{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.lg-sso a{height:54px;border:1px solid #dbe3ef;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:13px;font-size:16.5px;font-weight:500;color:var(--text);background:var(--panel);text-decoration:none}
.lg-sso a:hover{background:var(--panel2)}html[data-theme=dark] .lg-sso a{border-color:var(--line2)}
.lg-legal{text-align:center;font-size:15px;color:#1f3260;line-height:1.75;margin:clamp(18px,4.2vh,46px) 0 0}html[data-theme=dark] .lg-legal{color:var(--muted)}
.lg-legal i{font-style:normal;margin:0 12px;color:#7c8aa6}
.lg-foot{position:absolute;left:clamp(16px,2.2vw,34px);bottom:clamp(12px,2.6vh,28px);z-index:3;display:flex;align-items:center;color:#e8eefb;font-size:15px}
.lg-foot span+span::before{content:"|";margin:0 13px;color:rgba(255,255,255,.55)}.lg-foot span:first-child{margin-right:8px}
@media (max-height:820px){.lg-card{margin-top:16px;margin-bottom:22px}.lg-brand b{font-size:26px}.lg-brand small{font-size:17px}.lg-input,.lg-sso a{height:48px}.lg-submit{height:52px}}
@media (max-width:1100px){
  .login-page{grid-template-columns:1fr;overflow:auto}
  .lg-scene{width:100%;height:34%;opacity:.5}
  .lg-hero{padding:22px 20px 0}.lg-hero .lg-eyebrow,.lg-hero h2,.lg-tagline,.lg-features{display:none}
  .lg-hero .lg-brand b{font-size:22px}.lg-hero .lg-brand small{font-size:14px}.lg-hero .lg-brand svg,.lg-hero .brand-img{height:42px!important;width:auto}
  .lg-card{justify-self:center;margin:18px auto 70px}.lg-card .lg-brand{display:none}.lg-card h1{margin-top:0}
  .lg-lang{font-size:15px}
}
@media (max-width:520px){.lg-sso{grid-template-columns:1fr}.lg-row{font-size:15px}.lg-foot span:nth-child(n+4){display:none}.lg-sub{font-size:16px}}
.lg-scene{height:50%;width:62%;-webkit-mask-image:linear-gradient(90deg,#000 72%,transparent 100%);mask-image:linear-gradient(90deg,#000 72%,transparent 100%)}
.lg-card{padding-top:clamp(24px,4.4vh,46px)}
.lg-card h1{margin-top:clamp(12px,2.6vh,28px)}
.lg-sub{margin-bottom:clamp(14px,3vh,32px)}
.lg-field{margin-bottom:clamp(12px,2.3vh,24px)}
.lg-divider{margin-top:clamp(14px,2.8vh,30px)}
.lg-legal{margin-top:clamp(16px,3.2vh,34px)}
.lg-scene{-webkit-mask-image:linear-gradient(90deg,#000 72%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%);mask-image:linear-gradient(90deg,#000 72%,transparent 100%),linear-gradient(180deg,transparent 0,#000 16%);-webkit-mask-composite:source-in;mask-composite:intersect}
@media (max-width:1100px){.lg-hero .lg-brand{gap:12px}.lg-hero .lg-brand b{letter-spacing:.14em}.lg-hero .lg-brand small{font-size:11px;letter-spacing:.2em}.lg-hero{padding-right:150px}}
@media (max-width:520px){.lg-lang select{display:none}.lg-hero{padding-right:90px}}

/* ===== sign-in page v3 (ISPSOL mockup, 1672x941 reference; everything is in em so it scales with the viewport) ===== */
.login-page.lp{display:grid;grid-template-columns:61.4fr 38.6fr;min-height:100vh;background:#f5f8fe;overflow:hidden;font-size:clamp(10px,min(calc(100vw / 104.5),calc(100vh / 58.8)),22px)}
html[data-theme=dark] .login-page.lp{background:#0a1024}
.lp-hero{position:relative;overflow:hidden;color:#fff;background:radial-gradient(60em 40em at 78% 38%,#0a3a8c 0,transparent 62%),radial-gradient(40em 30em at 10% 100%,#0b2f78 0,transparent 60%),linear-gradient(160deg,#00132b 0,#011b42 55%,#00112a 100%);background-size:cover;background-position:center}
.lp-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(120,180,255,.5) .06em,transparent .07em);background-size:7.5em 6.2em;opacity:.35;pointer-events:none}
.lp-waves{position:absolute;left:0;bottom:0;width:100%;height:13.5em;max-width:none;pointer-events:none}
.lp-map{position:absolute;left:35.2em;top:5.2em;width:29.5em;height:auto;max-width:none;z-index:1;pointer-events:none}
.lp-hero-in{position:relative;z-index:2;padding:2.8em 0 0 4.1em;height:100%}
.lp-logo{display:block;width:21.8em;max-width:none;height:auto}
.lp-bar{display:block;width:3em;height:.25em;border-radius:.2em;background:#1e88ff;margin:1.35em 0 1.45em}
.lp-hero h2{font-size:2.95em;font-weight:700;line-height:1.1;letter-spacing:-.012em;margin:0;color:#fff}
.lp-hero h2 em{font-style:normal}.lp-hero h2 .o{color:#ff5a0a}.lp-hero h2 .b{color:#1e9bff}
.lp-lead{font-size:1.24em;line-height:1.38;color:#d3e2ff;max-width:23.6em;margin:.75em 0 0}
.lp-feats{list-style:none;margin:1.9em 0 0;padding:0;display:grid;grid-template-columns:repeat(3,10.35em);gap:1.1em}
.lp-feats li{min-height:10.7em;padding:1.15em 1.1em 1em;border-radius:.55em;background:linear-gradient(160deg,rgba(10,40,90,.72),rgba(4,22,52,.82));border:1px solid rgba(60,120,220,.35);display:flex;flex-direction:column;backdrop-filter:blur(2px)}
.lp-feats .fi{display:block;height:2.6em;margin-bottom:.75em}.lp-feats .fi .ico{width:2.6em;height:2.6em;stroke-width:1.9}
.lp-feats b{font-size:1.06em;font-weight:700;line-height:1.25;color:#fff}
.lp-feats small{font-size:.9em;line-height:1.38;color:#b9c8e6;margin-top:.5em}
.c-blue{color:#2f8cff}.c-orange{color:#ff7a1a}.c-green{color:#1fd18a}.c-violet{color:#9a7bff}.c-cyan{color:#27c4f5}.c-amber{color:#ffab1a}
.lp-stats{list-style:none;margin:2.3em 0 0;padding:0;display:flex;gap:0;align-items:center}
.lp-stats li{display:flex;align-items:center;gap:1.1em;padding-right:2em;margin-right:1.5em;border-right:1px solid rgba(120,160,230,.25)}
.lp-stats li:last-child{border-right:0}
.lp-stats .si{width:3.75em;height:3.75em;border-radius:50%;border:1px solid rgba(120,160,230,.4);background:rgba(10,40,90,.6);display:flex;align-items:center;justify-content:center;flex:none}.lp-stats .si .ico{width:1.9em;height:1.9em}
.lp-stats b{display:block;font-size:1.9em;font-weight:700;line-height:1.1}.lp-stats small{font-size:.97em;color:#d3e2ff}
.lp-strip{position:absolute;left:4.45em;bottom:2.3em;display:flex;align-items:center;font-size:.83em;letter-spacing:.11em;text-transform:uppercase;color:#6fb6ff;white-space:nowrap}
.lp-strip span+span::before{content:"|";margin:0 1.9em;color:rgba(140,190,255,.7)}
.lp-side{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:5.3em 1.2em 1em}
.lp-tools{position:absolute;top:1.1em;right:2.6em;display:flex;align-items:center;gap:.9em;color:#1f3260}.lp-tools>i{width:1px;height:1.6em;background:#c9d3e4}
html[data-theme=dark] .lp-tools{color:#c9d6f2}
.lp .lg-lang{font-size:1.06em;gap:.6em}.lp .icon-btn{width:2.6em;height:2.6em}.lp-tools .ico{width:1.6em;height:1.6em}
.lp-card{width:34.6em;max-width:100%;background:var(--panel);border-radius:1.15em;border:1px solid rgba(220,228,240,.9);box-shadow:0 1.2em 3.6em rgba(40,70,130,.12);padding:2.2em 2.1em 1.9em}
html[data-theme=dark] .lp-card{border-color:var(--line)}
.lp-card-logo{width:20.4em;max-width:90%;height:auto;margin:.3em auto 0}
img.lp-card-logo.only-light{display:block}img.lp-card-logo.only-dark{display:none}
html[data-theme=dark] img.lp-card-logo.only-light{display:none}html[data-theme=dark] img.lp-card-logo.only-dark{display:block}
.lp-card h1{text-align:center;font-size:2.4em;font-weight:700;letter-spacing:-.01em;color:#0a1838;margin:1em 0 .28em}html[data-theme=dark] .lp-card h1{color:var(--text)}
.lp .lg-sub{font-size:1.07em;color:#3a5890;margin:0 0 1.9em}html[data-theme=dark] .lp .lg-sub{color:var(--muted)}
.lp .lg-field{margin-bottom:1.5em}.lp .lg-field>span:first-child{font-size:1em;font-weight:500;margin-bottom:.55em;color:#0f1c3d}html[data-theme=dark] .lp .lg-field>span:first-child{color:var(--text)}
.lp .lg-input{height:3.4em;border-radius:.5em;padding:0 1.1em;gap:.9em}.lp .lg-input input{font-size:1.04em}.lp .lg-input .ico,.lp .lg-input .eye svg{width:1.5em;height:1.5em}
.lp .lg-row{font-size:1.02em;margin:.1em 0 1.3em}.lp .lg-row a{font-weight:600}.lp .lg-check{gap:.7em}.lp .lg-check input{width:1.5em;height:1.5em;border-radius:.3em}
.lp .lg-submit{height:2.72em;border-radius:.4em;font-size:1.25em;font-weight:600;background:linear-gradient(90deg,#015ce6,#0f8bfe);box-shadow:0 .5em 1.1em rgba(15,110,240,.28)}.lp .lg-submit .ico{width:1.2em;height:1.2em}
.lp .lg-divider{font-size:.95em;margin:1.45em 0 .75em;color:#3b62a8;gap:1.1em}
.lp .lg-sso{display:grid;grid-template-columns:1fr 1fr;gap:.8em}.lp .lg-sso.one{grid-template-columns:1fr}.lp .lg-sso:has(a+a){grid-template-columns:1fr 1fr}
.lp .lg-sso a{height:2.8em;border-radius:.45em;font-size:1.12em;font-weight:500;gap:.7em;box-shadow:0 .1em .3em rgba(30,60,120,.06)}.lp .lg-sso a svg{width:1.45em;height:1.45em}
.lp-help{text-align:center;font-size:1.02em;color:#2c4170;margin:1.25em 0 0}.lp-help a{font-weight:600}html[data-theme=dark] .lp-help{color:var(--muted)}
.lp-links,.lp-secure{text-align:center;font-size:.95em;color:#3b5488;margin:2.1em 0 0}.lp-links a{color:#3b5488}.lp-links a:hover{color:var(--accent)}
.lp-links i,.lp-secure i{font-style:normal;margin:0 .95em;color:#9aa8c2}
.lp-secure{margin-top:.75em;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.35em}.lp-secure .ok{color:#17b26a;display:inline-flex}.lp-secure .ok .ico{width:1.35em;height:1.35em}
.lp-secure a{color:#0a2a6b}.lp-secure i{margin:0 .6em}
html[data-theme=dark] .lp-links,html[data-theme=dark] .lp-links a,html[data-theme=dark] .lp-secure{color:var(--muted)}html[data-theme=dark] .lp-secure a{color:var(--text)}
.lp-copy{font-size:.82em;color:#7c8aa6;margin:1em 0 0;text-align:center}
@media (max-width:1000px){
  .login-page.lp{grid-template-columns:1fr;font-size:16px;overflow:auto;min-height:100vh;align-content:start}
  .lp-map,.lp-feats,.lp-stats,.lp-strip,.lp-bar{display:none}
  .lp-hero-in{padding:22px 20px 26px}.lp-logo{width:210px}.lp-hero h2{font-size:26px;margin-top:18px}.lp-lead{font-size:15px;max-width:none}
  .lp-waves{height:90px;opacity:.6}
  .lp-side{padding:18px 14px 24px}.lp-tools{position:static;align-self:flex-end;margin-bottom:10px}
  .lp-card{padding:24px 18px 22px;border-radius:16px}.lp-card-logo{display:none!important}.lp-card h1{margin-top:0;font-size:28px}
  .lp-links{line-height:2}.lp-links i{margin:0 8px}
}
@media (max-width:1000px) and (min-width:700px){.lp-feats{display:grid;grid-template-columns:repeat(3,1fr);margin-top:20px}.lp-feats li{min-height:0}.lp-hero-in{padding:30px 34px}.lp-card{width:520px}}

/* legal pages */
.content:has(.legal-page){display:block!important;padding:0!important}
.legal-page{max-width:880px;margin:0 auto;padding:34px 18px 60px}
.legal-logo{height:54px;width:auto;display:block;margin:0 auto 22px}
.legal-nav{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:18px}
.legal-nav a{padding:8px 14px;border-radius:999px;border:1px solid var(--line2);color:var(--text2);background:var(--panel);font-weight:600;font-size:13.5px}
.legal-nav a.active{background:var(--accent);border-color:var(--accent);color:#fff}
.legal-page article{padding:30px 34px}.legal-page article h1{font-size:28px}.legal-page article h2{font-size:17px;margin:22px 0 6px}.legal-page article p{line-height:1.7;margin:0 0 10px;color:var(--text2)}
.legal-foot{text-align:center;color:var(--muted);font-size:13.5px}
@media (max-width:600px){.legal-page article{padding:20px 18px}}
/* sidebar logo image + powered-by */
.side-logo{display:block;height:40px;width:auto;max-width:176px}
html.nav-collapsed .side-logo{display:none}
.side-foot a{color:var(--side-muted)}.side-foot a:hover{color:#fff}.side-foot .pb{display:block;margin-top:4px;font-size:11.5px}
/* v3 fine-tuning against the mockup's measured positions */
.lp-map{left:31.4em;top:5em;width:34em;overflow:visible}
.lp-bar{margin:1.15em 0 1.2em}
.lp-hero h2{font-size:2.72em;line-height:1.17}
.lp-lead{font-size:1.2em;line-height:1.4;margin-top:.6em;max-width:24em}
.lp-feats{grid-template-columns:repeat(3,10.6em);gap:1.1em .9em;margin-top:1.55em}
.lp-feats li{min-height:0;height:10.65em;padding:1.1em 1em .7em;overflow:hidden}
.lp-feats .fi{height:2.4em;margin-bottom:.6em}.lp-feats .fi .ico{width:2.4em;height:2.4em}
.lp-feats b{font-size:1.02em;line-height:1.24}.lp-feats small{font-size:.855em;line-height:1.36;margin-top:.4em}
.lp-stats{margin-top:1.9em}.lp-stats b{font-size:1.85em}
.lp-card{padding-top:2em;padding-bottom:1.7em}
.lp-card h1{margin:.72em 0 .2em;line-height:1.15}
.lp .lg-sub{margin-bottom:1.65em}
.lp .lg-field{margin-bottom:1.05em}
.lp .lg-row{margin:.35em 0 1.15em}
.lp .lg-divider{margin:1.25em 0 .65em}
.lp-help{margin-top:1.1em}.lp-links{margin-top:1.75em}.lp-secure{margin-top:.6em}
.lp-copy{display:none}
.lp-strip{left:5.5em;font-size:.8em;letter-spacing:.09em}.lp-strip span+span::before{margin:0 1.7em}
@media (max-width:1000px){.login-page.lp{grid-template-columns:minmax(0,1fr)}.lp-side{min-width:0}.lp-card{width:100%;max-width:520px}.lp-hero-in{min-width:0}.lp-hero h2{overflow-wrap:anywhere}.lp-secure{font-size:13.5px}.lp-links{font-size:13.5px}}
@media (max-width:420px){.lp-hero h2{font-size:23px}.lp-links i{margin:0 5px}}
@media (max-width:1000px){td input[type=text],td input[type=password],td input[type=number],td select{min-width:120px}td .btn,td button{white-space:nowrap}.card h2{flex-wrap:wrap}.toolbar>*{max-width:100%}}
/* login card without its own background: content sits directly on the right panel */
.lp-card,html[data-theme=dark] .lp-card{background:transparent;border-color:transparent;box-shadow:none}

/* ===== auto-fit: scale the whole console to the window (zoom factor set by the script in <head>) ===== */
body.has-nav{zoom:var(--ui-zoom,1)}
body.has-nav .content{container-type:inline-size;container-name:main}
@container main (max-width:1100px){.dash-mini{grid-template-columns:1fr 1fr}.dash-two{grid-template-columns:1fr}}
@container main (max-width:900px){.dash-charts,.dash-three{grid-template-columns:1fr}}
code{overflow-wrap:anywhere}.banner,.flash{overflow-wrap:anywhere}

/* ===== sign-in auto-fit: scale to the window in both directions, centre on tall screens, never clip ===== */
.login-page.lp{font-size:clamp(6.5px,min(calc(100vw / 104.5),calc(100vh / 58.8)),26px);overflow-x:hidden;overflow-y:auto}
.lp-hero{min-height:100vh}
.lp-hero-in{display:flex;flex-direction:column;justify-content:center;min-height:100vh;height:auto;padding:.45em 0 5.2em 4.1em}
.lp-map{top:50%;margin-top:-24.2em}
.lp-side{justify-content:center;min-height:100vh;padding:3.56em 1.2em 0}
.lp .lg-check input:checked::after{width:.7em;height:.38em;border-left-width:.15em;border-bottom-width:.15em;transform:rotate(-45deg) translate(.06em,-.06em)}
.lp .lg-input{border-width:max(1px,.06em)}.lp .lg-sso a{border-width:max(1px,.06em)}
.lp .banner{font-size:1em;padding:.7em 1em;border-radius:.6em;margin-bottom:1em}
@media (max-width:1000px){
  .login-page.lp{font-size:16px}
  .lp-hero,.lp-hero-in,.lp-side{min-height:0}
  .lp-hero-in{display:block;padding:22px 20px 26px}
  .lp-side{justify-content:flex-start;padding:18px 14px 24px}
}
@media (max-width:1000px) and (min-width:700px){.lp-hero-in{padding:30px 34px}}
.lp-feats li{height:auto;min-height:10.65em;overflow:visible}
/* bigger sidebar logo: it has the full width now that the menu button lives in the top bar */
.side-brand{justify-content:center;padding:14px 18px;min-height:var(--topbar)}
.side-brand .brand{width:100%;justify-content:center}
.side-logo{height:auto;width:100%;max-width:218px;max-height:54px;object-fit:contain}
.side-mark{display:none;width:38px;height:38px}
html.nav-collapsed .side-mark{display:block}
.topbar{padding-left:16px}
@media (max-width:1000px){html.nav-collapsed .side-mark{display:none}html.nav-collapsed .side-logo{display:block}}
/* 2FA and password-reset steps inside the sign-in layout */
.lp .lg-code{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:1.5em!important;letter-spacing:.35em;text-align:center}
.lp .lg-code::placeholder{letter-spacing:.35em;opacity:.45}
.lp-note{font-size:1.02em;line-height:1.6;color:#2c4170;text-align:center;margin:0 0 1.6em}html[data-theme=dark] .lp-note{color:var(--muted)}
.lp .lg-divider span:empty{display:none}.lp .lg-divider:has(span:empty){gap:0;margin:1.5em 0 0}

/* error page */
.error-page{display:flex;justify-content:center;padding:6vh 16px;width:100%}
.error-page .card{max-width:520px;width:100%;text-align:center;padding:36px 32px}
.error-code{font-size:64px;font-weight:800;letter-spacing:-.03em;line-height:1;background:linear-gradient(90deg,#2f6bff,#6d5df6);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:8px}
.error-page h1{font-size:24px;margin-bottom:8px}.error-page p{font-size:15px;line-height:1.6}

/* ================= ISPSOL look: the sign-in page's navy / blue / orange carried into the console ================= */
:root{--accent:#0b6cf0;--accent2:#0f8bfe;--orange:#ff5a0a;--bg:#f5f8fe;--bg2:#f8fafe;--line:#e2e9f5;--line2:#d5deed;
  --side-bg:radial-gradient(520px 380px at 0 100%,#0b2f78 0,transparent 62%),linear-gradient(170deg,#00132b 0,#011b42 55%,#00112a 100%);--side-muted:#7f9bc9}
html[data-theme=dark]{--bg:#00122a;--bg2:#021a3d;--panel:#06204a;--panel2:#0a2b60;--panel3:#0f3672;--line:#143565;--line2:#1d4585;--text:#eef4ff;--text2:#cfe0ff;--muted:#9fb6dd;--muted2:#6f8bbd;--accent:#2f8cff;--accent2:#1e9bff;
  --shadow:0 12px 30px rgba(0,8,26,.45)}
html[data-theme=dark] body{background-image:radial-gradient(1100px 700px at 78% 10%,rgba(10,58,140,.55) 0,transparent 62%),radial-gradient(800px 600px at 0 100%,rgba(11,47,120,.5) 0,transparent 60%);background-attachment:fixed}
html[data-theme=dark] .card,html[data-theme=dark] .stat,html[data-theme=dark] .mini{background:linear-gradient(160deg,rgba(10,40,90,.78),rgba(4,22,52,.86));border-color:rgba(60,120,220,.35)}
html[data-theme=dark] .topbar{background:rgba(1,22,54,.92);border-bottom-color:rgba(60,120,220,.3)}
.side-nav li a.active{background:linear-gradient(90deg,#015ce6,#0f8bfe);box-shadow:0 6px 18px rgba(15,110,240,.4)}
.side-section::before{background:var(--orange)}
.btn{background:linear-gradient(90deg,#015ce6,#0f8bfe)}.btn-secondary{background:var(--panel)}.btn-danger{background:var(--bad)}
.eyebrow{color:var(--orange)}
html[data-theme=light] .theme-seg [data-theme-set=light],html[data-theme=dark] .theme-seg [data-theme-set=dark]{background:linear-gradient(135deg,#015ce6,#0f8bfe)}
.avatar{background:linear-gradient(135deg,#015ce6,#0f8bfe)}
.error-code{background:linear-gradient(90deg,#015ce6,#ff5a0a);-webkit-background-clip:text;background-clip:text}

/* dashboard hero (same panel as the sign-in page's left side) */
.dash-hero{position:relative;overflow:hidden;border-radius:22px;padding:30px 34px 26px;margin-bottom:20px;color:#fff;
  background:radial-gradient(900px 560px at 80% 30%,#0a3a8c 0,transparent 62%),radial-gradient(640px 420px at 6% 100%,#0b2f78 0,transparent 60%),linear-gradient(160deg,#00132b 0,#011b42 55%,#00112a 100%);
  border:1px solid rgba(60,120,220,.35);box-shadow:0 18px 44px rgba(0,20,60,.28)}
.dash-hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(120,180,255,.5) 1px,transparent 1.2px);background-size:120px 100px;opacity:.35;pointer-events:none}
.dash-hero>*{position:relative;z-index:2}
.dash-hero .lp-waves{position:absolute;left:0;bottom:0;width:100%;height:150px;max-width:none;z-index:0;opacity:.8;pointer-events:none}
.dash-hero .lp-map{position:absolute;left:auto;right:150px;top:-34px;margin:0;width:330px;height:auto;z-index:1;opacity:.5;pointer-events:none}
.dh-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.dash-hero .lp-bar{display:block;width:48px;height:4px;border-radius:3px;background:#1e88ff;margin:0 0 16px}
.dash-hero h1{font-size:38px;font-weight:700;line-height:1.14;letter-spacing:-.015em;margin:0;color:#fff}
.dash-hero h1 em{font-style:normal}.dash-hero h1 .o{color:var(--orange)}.dash-hero h1 .b{color:#1e9bff}
.dh-lead{font-size:16.5px;line-height:1.45;color:#d3e2ff;max-width:640px;margin:10px 0 0}
.dh-status{display:flex;align-items:center;gap:14px;padding:12px 20px;border-radius:14px;background:linear-gradient(160deg,rgba(10,40,90,.8),rgba(4,22,52,.88));border:1px solid rgba(60,120,220,.45);color:#fff;text-decoration:none!important;line-height:1.3;white-space:nowrap;backdrop-filter:blur(3px)}
.dh-status b{display:block;font-size:16px}.dh-status small{color:#b9c8e6;font-size:13px}
.dh-status.bad b{color:#ff8a7a}.dh-status.ok b{color:#3ee0a0}.dh-status.warn b{color:#ffc04d}
.dh-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:26px}
.dh-kpi{display:flex;flex-direction:column;gap:2px;min-height:158px;padding:18px 18px 16px;border-radius:12px;color:#fff;text-decoration:none!important;
  background:linear-gradient(160deg,rgba(10,40,90,.74),rgba(4,22,52,.84));border:1px solid rgba(60,120,220,.38);backdrop-filter:blur(3px);transition:transform .15s,border-color .15s}
.dh-kpi:hover{transform:translateY(-2px);border-color:rgba(90,160,255,.8)}
.dh-kpi .fi{display:block;height:34px;margin-bottom:10px}.dh-kpi .fi .ico{width:34px;height:34px;stroke-width:1.9}
.dh-kpi b{font-size:32px;font-weight:700;line-height:1.05;letter-spacing:-.02em}
.dh-kpi>span:not(.fi){font-size:16px;font-weight:700}
.dh-kpi small{margin-top:auto;padding-top:8px;font-size:13px;color:#b9c8e6}.dh-kpi small.c-green{color:#3ee0a0}.dh-kpi small.c-orange{color:#ff9a5a}
.dh-kpi .dot{width:8px;height:8px;margin:0 4px 0 6px}.dh-kpi small .dot:first-child{margin-left:0}
.dh-stats{list-style:none;margin:24px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:14px 0}
.dh-stats li{padding-right:30px;margin-right:30px;border-right:1px solid rgba(120,160,230,.25)}.dh-stats li:last-child{border-right:0;margin-right:0;padding-right:0}
.dh-stats a{display:flex;align-items:center;gap:14px;color:#fff;text-decoration:none!important}
.dh-stats .si{width:54px;height:54px;border-radius:50%;border:1px solid rgba(120,160,230,.4);background:rgba(10,40,90,.6);display:flex;align-items:center;justify-content:center;flex:none}
.dh-stats b{display:block;font-size:26px;font-weight:700;line-height:1.1}.dh-stats small{font-size:14px;color:#d3e2ff}
@container main (max-width:1250px){.dh-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.dash-hero .lp-map{right:10px}}
@media (max-width:1000px){
  .dash-hero{padding:20px 16px 18px;border-radius:16px}.dash-hero .lp-map{display:none}
  .dh-top{flex-direction:column}.dash-hero h1{font-size:26px}.dh-lead{font-size:14.5px}
  .dh-kpis{grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.dh-kpi{min-height:0;padding:14px}.dh-kpi b{font-size:26px}.dh-kpi>span:not(.fi){font-size:14.5px}
  .dh-stats{flex-direction:column;gap:12px}.dh-stats li{border-right:0;margin:0;padding:0}.dh-stats .si{width:44px;height:44px}.dh-stats b{font-size:22px}
  .dh-status{white-space:normal;width:100%}
}
.dash-hero .lp-map{right:270px;top:-40px;width:350px;opacity:.55}
@container main (max-width:1250px){.dash-hero .lp-map{right:230px}}

/* ===== slim navy banner on every inner page (plain <h1>, toolbar with a heading, or the titled page header) ===== */
body.has-nav .content>h1,body.has-nav .content>.toolbar:has(h1),body.has-nav .content>.page-header{
  position:relative;overflow:hidden;border-radius:18px;padding:22px 28px 22px 38px;margin:0 0 20px;color:#fff;
  border:1px solid rgba(60,120,220,.35);box-shadow:0 14px 34px rgba(0,20,60,.22);
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 120' preserveAspectRatio='none'><g fill='none' stroke='%232f7fe6'><path d='M0 92 C120 30 220 122 340 80 S520 18 600 58' stroke-opacity='.5'/><path d='M0 100 C120 44 220 126 340 88 S520 32 600 68' stroke-opacity='.38'/><path d='M0 108 C120 58 220 130 340 96 S520 46 600 78' stroke-opacity='.28'/><path d='M0 116 C120 72 220 134 340 104 S520 60 600 88' stroke-opacity='.18'/></g></svg>") right bottom/62% 100% no-repeat,
    radial-gradient(rgba(120,180,255,.35) 1px,transparent 1.2px) 0 0/120px 90px,
    radial-gradient(700px 320px at 82% 0,#0a3a8c 0,transparent 65%),
    linear-gradient(160deg,#00132b 0,#011b42 55%,#00112a 100%)}
body.has-nav .content>h1::before,body.has-nav .content>.toolbar:has(h1)::before,body.has-nav .content>.page-header::before{
  content:"";position:absolute;left:18px;top:20px;bottom:20px;width:4px;border-radius:3px;background:linear-gradient(180deg,#1e88ff,#ff5a0a)}
body.has-nav .content>h1,body.has-nav .content>.toolbar h1,body.has-nav .content>.page-header h1{font-size:26px;font-weight:700;letter-spacing:-.01em;line-height:1.2;color:#fff;margin:0}
body.has-nav .content>h1 small,body.has-nav .content>.toolbar h1 small{color:#8fc4ff;font-weight:500;font-size:.62em}
body.has-nav .content>.toolbar:has(h1){align-items:center}
body.has-nav .content>.toolbar:has(h1) small,body.has-nav .content>.toolbar:has(h1) .muted{color:#b9c8e6}
body.has-nav .content>.toolbar:has(h1) h1+small,body.has-nav .content>.toolbar:has(h1)>div>small{display:block;margin-top:4px;font-size:13.5px;max-width:900px}
body.has-nav .content>.toolbar:has(h1) a:not(.btn),body.has-nav .content>.page-header a:not(.btn){color:#7fc0ff}
body.has-nav .content>.toolbar:has(h1) .btn-secondary,body.has-nav .content>.page-header .btn-secondary{background:rgba(10,40,90,.65);border-color:rgba(120,170,255,.5);color:#fff}
body.has-nav .content>.toolbar:has(h1) .btn-secondary:hover{background:rgba(20,60,130,.8)}
body.has-nav .content>.toolbar:has(h1) code{color:#cfe3ff}
body.has-nav .content>.toolbar:has(h1) label,body.has-nav .content>.toolbar:has(h1) .field span{color:#d3e2ff}
body.has-nav .content>.page-header{align-items:center}
body.has-nav .content>.page-header .subtitle{color:#d3e2ff;font-size:14.5px;margin-top:4px}
body.has-nav .content>.page-header .eyebrow{color:#ff8a3d}
body.has-nav .content>.toolbar:has(h1)+.tabs,body.has-nav .content>h1+.tabs{margin-top:-6px}
@media (max-width:1000px){
  body.has-nav .content>h1,body.has-nav .content>.toolbar:has(h1),body.has-nav .content>.page-header{padding:16px 16px 16px 30px;border-radius:14px;margin-bottom:14px;background-size:100% 100%,120px 90px,auto,auto}
  body.has-nav .content>h1::before,body.has-nav .content>.toolbar:has(h1)::before,body.has-nav .content>.page-header::before{left:13px;top:14px;bottom:14px}
  body.has-nav .content>h1,body.has-nav .content>.toolbar h1,body.has-nav .content>.page-header h1{font-size:21px}
}

.role-badge.tier-partner{border-color:#ff7a1a;color:#ff7a1a}.role-badge.tier-customer{border-color:var(--ok);color:var(--ok)}

.lp-portal{display:inline-block;margin-bottom:.55em;padding:.28em .9em;border-radius:999px;font-size:.84em;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(15,123,245,.12);color:#0b6cf0;border:1px solid rgba(15,123,245,.3)}
.lp-portal-partner{background:rgba(255,90,10,.1);color:#e8500a;border-color:rgba(255,90,10,.35)}.lp-portal-customer{background:rgba(16,185,129,.12);color:#0f9d6c;border-color:rgba(16,185,129,.35)}