:root{--bg:#020b16;--panel:#061a2e;--panel2:#08223b;--line:#1d4f7a;--line2:#2a74aa;--text:#eaf5ff;--muted:#9fc2e2;--blue:#0a73cc;--blue2:#53b7ff;--good:#5ee3a1;--warn:#ffc85c;--bad:#ff7b8a;color-scheme:dark}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 "Segoe UI",system-ui,sans-serif}
a{color:var(--blue2)}
h1,h2,h3{margin:0 0 8px}
h2{font-size:22px}
h3{font-size:15px;letter-spacing:.02em}
.muted{color:var(--muted)}
.small{font-size:12px}
.good{color:var(--good)}
.warn{color:var(--warn)}
.bad{color:var(--bad)}
button{font:inherit;color:var(--text);background:#0c2b48;border:1px solid var(--line2);border-radius:9px;padding:7px 12px;cursor:pointer}
button:hover{background:#155786;border-color:var(--blue2)}
button.primary{background:var(--blue);border-color:var(--blue2)}
button.danger{border-color:#8d3341;color:var(--bad)}
button.tiny{padding:3px 8px;font-size:12px}
button:disabled{opacity:.45;cursor:not-allowed}
input,select,textarea{font:inherit;color:#fff;background:#04142a;border:1px solid #2f6ea2;border-radius:8px;padding:7px 9px;width:100%}
label{display:block;font-size:12px;color:var(--muted)}
label>input,label>select,label>textarea{margin-top:4px}
.card{background:linear-gradient(180deg,var(--panel),#04162a);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px}
.shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.side{background:#03101f;border-right:1px solid var(--line);padding:16px;display:flex;flex-direction:column;gap:14px;position:sticky;top:0;height:100vh}
.brand{display:flex;gap:10px;align-items:center}
.brand img{width:52px;height:52px;border-radius:10px;object-fit:cover}
.brand b{display:block;font-size:17px}
.brand small{color:var(--muted)}
.servers{display:flex;gap:6px}
.servers button{flex:1}
.servers button.on{background:var(--blue);border-color:var(--blue2)}
.servers button.on[data-srv=dev]{background:#6b3fa0;border-color:#b38cf0}
nav{display:flex;flex-direction:column;gap:4px}
nav a{color:var(--text);text-decoration:none;padding:9px 12px;border-radius:9px;border:1px solid transparent}
nav a:hover{background:#0b2540}
nav a.on{background:#0c2b48;border-color:var(--line2)}
.me{margin-top:auto;font-size:12px;color:var(--muted)}
.me b{color:var(--text)}
.main{padding:22px 26px;max-width:1400px;width:100%}
.banner{padding:10px 14px;border-radius:10px;margin-bottom:14px;border:1px solid}
.banner.dev{background:#21103a;border-color:#6b3fa0}
.banner.warn{background:#2a2108;border-color:#7a5a1c}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.toolbar .grow{flex:1}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.kpi span{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.kpi b{font-size:22px}
.kpi small{display:block;color:var(--muted)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:6px 8px;border-bottom:1px solid var(--line)}
td{padding:8px;border-bottom:1px solid #0f3355;vertical-align:top}
tr.click{cursor:pointer}
tr.click:hover td{background:#08203a}
td small{display:block;color:var(--muted)}
td.actions{text-align:right;white-space:nowrap}
td.actions button{margin-left:4px}
.pill{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line2);border-radius:99px;padding:2px 9px;white-space:nowrap;background:#061c30}
.pill.good{border-color:#1f7a4d;color:var(--good)}
.pill.warn{border-color:#7a5a1c;color:var(--warn)}
.pill.bad{border-color:#8d3341;color:var(--bad)}
.pill.info{color:#7cc8ff}
.pill.muted{color:var(--muted)}
.head{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.head small{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.head b{display:block;font-size:15px}
.empty{color:var(--muted);padding:8px 0}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:10px}
.form .full{grid-column:1/-1}
.checks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 14px;margin:6px 0 12px}
.check{display:flex;gap:6px;align-items:center;font-size:13px;color:var(--text)}
.check input{width:auto;margin:0}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
.chips button{border-radius:99px;padding:4px 10px}
.chips button.on{background:var(--blue);border-color:var(--blue2)}
.modalback{position:fixed;inset:0;background:rgba(0,6,14,.72);display:flex;align-items:flex-start;justify-content:center;padding:5vh 16px;z-index:50;overflow:auto}
.modal{background:var(--panel);border:1px solid var(--line2);border-radius:14px;width:min(760px,100%);box-shadow:0 20px 60px #000a}
.modal.wide{width:min(1100px,100%)}
.modal h2{padding:14px 18px;border-bottom:1px solid var(--line);margin:0;font-size:18px}
.modalbody{padding:16px 18px;max-height:72vh;overflow:auto}
.modalactions{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px;border-top:1px solid var(--line)}
.sec{margin:8px 0}
.sec>b{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.item{display:flex;gap:8px;align-items:center;padding:3px 0}
.item input{max-width:240px}
.tick{width:28px;height:28px;padding:0;font-weight:700}
.tick.ok{border-color:#1f7a4d;color:var(--good)}
.tick.no{border-color:#8d3341;color:var(--bad)}
.part{display:grid;grid-template-columns:1fr 80px 130px auto;gap:6px;margin:4px 0}
.toast{position:fixed;right:18px;bottom:18px;background:var(--panel2);border:1px solid var(--line2);border-radius:10px;padding:10px 14px;z-index:60}
.toast.bad{border-color:#8d3341}
.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:16px}
.login-card{width:min(420px,100%);text-align:center}
.login-logo{width:120px;height:120px;border-radius:16px;object-fit:cover}
.login-card .form{grid-template-columns:1fr;text-align:left;margin-top:14px}
.error{color:var(--bad);font-size:13px}
@media print{.side,.toolbar,.noprint,td.actions{display:none!important}.shell{display:block}body{background:#fff;color:#000}.card{border-color:#999;background:#fff}td,th{color:#000;border-color:#ccc}.pill{color:#000!important;border-color:#999!important;background:#fff}}
@media (max-width:900px){.shell{grid-template-columns:1fr}.side{position:static;height:auto}.grid2,.form,.checks{grid-template-columns:1fr}.main{padding:16px}td.actions{white-space:normal}}