/* Дизайн-язык ev.adriver.io: Ant Design 5, darkAlgorithm.
   colorPrimary #1668dc, borderRadius 6, fontSize 13, компактные таблицы.
   Тема одна, тёмная — как в оригинале. */
:root{
  --primary:#1668dc;
  --primary-hover:#3c89e8;
  --primary-active:#0e4ea8;

  --bg-layout:#000000;
  --bg-container:#141414;
  --bg-elevated:#1f1f1f;
  --bg-head:#1d1d1d;
  --bg-hover:#262626;
  --sider:#001529;

  --border:#424242;
  --border-2:#303030;
  --split:rgba(255,255,255,.08);

  --text:rgba(255,255,255,.85);
  --text-2:rgba(255,255,255,.65);
  --text-3:rgba(255,255,255,.45);
  --text-4:rgba(255,255,255,.25);

  --success:#49aa19; --success-fg:#6abe39; --success-bg:#162312; --success-bd:#274916;
  --warning:#d89614; --warning-fg:#e8b339; --warning-bg:#2b2111; --warning-bd:#594214;
  --error:#dc4446;   --error-fg:#e84749;   --error-bg:#2c1618;   --error-bd:#5b2526;
  --blue-fg:#3c89e8; --blue-bg:#111a2c;    --blue-bd:#15325b;

  --radius:6px;
  --radius-lg:8px;
  --font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  --mono:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,Courier,monospace;
}

*{box-sizing:border-box}
body{
  margin:0;background:var(--bg-layout);color:var(--text);
  font-family:var(--font);font-size:13px;line-height:1.5715;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{margin:0;font-weight:600;color:var(--text)}
a{color:var(--primary-hover);text-decoration:none}
a:hover{text-decoration:underline}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--primary);outline-offset:1px;border-radius:3px}
form{margin:0}

/* ---------------- каркас ---------------- */
.layout{display:grid;grid-template-columns:210px minmax(0,1fr);min-height:100vh}

.sider{background:var(--sider);position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column}
.logo{padding:16px 20px;color:#fff}
.logo .t{font-weight:600;letter-spacing:.3px;font-size:14px}
.logo .s{font-size:11px;opacity:.55;margin-top:1px}

.menu{padding:0 4px;display:flex;flex-direction:column;gap:4px;margin-top:4px}
.menu a{
  display:flex;align-items:center;gap:10px;width:100%;height:40px;
  padding:0 16px;color:var(--text-2);border-radius:var(--radius);font-size:14px;
  transition:background .2s,color .2s;text-decoration:none;
}
.menu a:hover{background:rgba(255,255,255,.08);color:#fff;text-decoration:none}
.menu a[aria-current="page"]{background:var(--primary);color:#fff}
.menu .ic{width:14px;flex:none;text-align:center;font-size:13px;opacity:.9}
.menu .badge{
  margin-left:auto;font-size:11px;background:rgba(255,255,255,.12);
  padding:0 6px;border-radius:9px;line-height:16px;color:rgba(255,255,255,.75);
}
.menu a[aria-current="page"] .badge{background:rgba(0,0,0,.28);color:#fff}
.menu .badge.alarm{background:var(--error);color:#fff}
.menu-group{padding:14px 20px 4px;font-size:11px;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.04em}
.sider-foot{margin-top:auto;padding:14px 20px;font-size:11px;color:rgba(255,255,255,.35);line-height:1.7;border-top:1px solid rgba(255,255,255,.08)}

.right{min-width:0;display:flex;flex-direction:column}
.header{
  height:64px;display:flex;align-items:center;justify-content:flex-end;gap:12px;
  padding-inline:20px;border-bottom:1px solid var(--split);background:rgba(0,0,0,.72);
  position:sticky;top:0;z-index:9;backdrop-filter:blur(6px);
}
.header .who{font-size:12px;color:var(--text-3);margin-right:auto}
.content{padding:20px;max-width:1440px;width:100%}

.pagehead{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.pagehead h2{font-size:20px}
.pagehead .tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* ---------------- карточки ---------------- */
.card{background:var(--bg-container);border:1px solid var(--border-2);border-radius:var(--radius-lg)}
.card > .head{display:flex;align-items:center;gap:10px;min-height:46px;padding:0 16px;border-bottom:1px solid var(--border-2)}
.card > .head h3{font-size:14px}
.card > .head .extra{margin-left:auto;display:flex;gap:8px;align-items:center}
.card > .head .sub{font-size:12px;color:var(--text-3);font-weight:400}
.card > .inner{padding:16px}

.row{display:grid;gap:16px}
.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.span2{grid-column:span 2}
@media(max-width:1080px){
  .c4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .c3,.c2{grid-template-columns:1fr}
  .span2{grid-column:auto}
}

/* ---------------- статистика ---------------- */
.stat .t{font-size:14px;color:var(--text-3);margin-bottom:4px}
.stat .v{font-size:24px;color:var(--text);line-height:1.3;font-variant-numeric:tabular-nums}
.stat .v .suf{font-size:14px;color:var(--text-3);margin-left:3px}
.stat .v.ok{color:var(--success-fg)}
.stat .v.warn{color:var(--warning-fg)}
.stat .v.bad{color:var(--error-fg)}
.stat .foot{font-size:12px;color:var(--text-3);margin-top:6px}

/* ---------------- таблицы ---------------- */
.tablewrap{overflow-x:auto;border-radius:0 0 var(--radius-lg) var(--radius-lg)}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{
  background:var(--bg-head);color:var(--text);font-weight:600;text-align:left;
  padding:9px 8px;border-bottom:1px solid var(--border-2);white-space:nowrap;
}
thead th:first-child{padding-left:16px}
thead th:last-child{padding-right:16px}
tbody td{padding:6px 8px;border-bottom:1px solid var(--border-2);vertical-align:middle}
tbody td:first-child{padding-left:16px}
tbody td:last-child{padding-right:16px}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover td{background:var(--bg-hover)}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.mono{font-family:var(--mono);font-size:12px}
.dim{color:var(--text-3)}
.acts{display:flex;gap:4px;justify-content:flex-end}
.empty{padding:36px 16px;text-align:center;color:var(--text-3)}

.host b{font-weight:600}
.host span{display:block;font-size:11px;color:var(--text-3);font-family:var(--mono)}
.host span::before{content:"→ ";color:var(--text-4)}

/* ---------------- теги ---------------- */
.tag{
  display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 7px;
  border:1px solid;border-radius:4px;font-size:12px;line-height:20px;white-space:nowrap;
}
.t-success{color:var(--success-fg);background:var(--success-bg);border-color:var(--success-bd)}
.t-warning{color:var(--warning-fg);background:var(--warning-bg);border-color:var(--warning-bd)}
.t-error{color:var(--error-fg);background:var(--error-bg);border-color:var(--error-bd)}
.t-blue{color:var(--blue-fg);background:var(--blue-bg);border-color:var(--blue-bd)}
.t-default{color:var(--text);background:var(--bg-elevated);border-color:var(--border)}
.dot{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.t-blue .dot{animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{50%{opacity:.3}}

/* ---------------- кнопки ---------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  height:32px;padding:0 15px;border-radius:var(--radius);cursor:pointer;
  border:1px solid var(--border);background:transparent;color:var(--text);
  font-size:13px;white-space:nowrap;transition:.2s;text-decoration:none;
}
.btn:hover{color:var(--primary-hover);border-color:var(--primary-hover);text-decoration:none}
.btn:active{color:var(--primary-active);border-color:var(--primary-active)}
.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn.primary:hover{background:var(--primary-hover);border-color:var(--primary-hover);color:#fff}
.btn.text{border-color:transparent;background:none}
.btn.text:hover{background:rgba(255,255,255,.08);color:var(--primary-hover)}
.btn.danger{color:var(--error-fg);border-color:var(--error-bd)}
.btn.danger:hover{color:#fff;background:var(--error);border-color:var(--error)}
.btn.sm{height:24px;padding:0 7px;font-size:12px;border-radius:4px}
.btn.block{width:100%}
.btn[disabled]{opacity:.4;cursor:not-allowed}

/* ---------------- формы ---------------- */
.field{margin-bottom:16px}
.field > label{display:block;font-size:13px;color:var(--text);margin-bottom:6px}
.field .extra{font-size:12px;color:var(--text-3);margin-top:5px;line-height:1.5}
.inp,select,textarea{
  width:100%;height:32px;padding:4px 11px;font-size:13px;font-family:var(--font);
  color:var(--text);background:transparent;border:1px solid var(--border);
  border-radius:var(--radius);transition:.2s;
}
textarea{height:auto;padding:7px 11px}
.inp.mono,textarea.mono{font-family:var(--mono);font-size:12px}
.inp:hover,select:hover{border-color:var(--primary-hover)}
.inp:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px rgba(22,104,220,.2)}
.inp::placeholder{color:var(--text-4)}
input[type=file]{font-size:12px;color:var(--text-3)}
input[type=file]::file-selector-button{
  background:transparent;border:1px solid var(--border);color:var(--text);
  border-radius:var(--radius);padding:3px 10px;margin-right:10px;cursor:pointer;font:inherit;
}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--text-3) 50%),linear-gradient(135deg,var(--text-3) 50%,transparent 50%);background-position:calc(100% - 15px) 14px,calc(100% - 10px) 14px;background-size:5px 5px;background-repeat:no-repeat}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
@media(max-width:860px){.f2{grid-template-columns:1fr}}

.check{display:flex;gap:8px;align-items:flex-start;cursor:pointer;margin-bottom:12px}
.check input{margin:2px 0 0;accent-color:var(--primary);width:14px;height:14px;flex:none}
.check .lbl{font-size:13px}
.check .extra{font-size:12px;color:var(--text-3);margin-top:2px;line-height:1.5;display:block}

.switchrow{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--border-2)}
.switchrow:last-child{border-bottom:none}
.switchrow .txt{flex:1}
.switchrow .txt b{display:block;font-weight:400;font-size:13px}
.switchrow .txt span{font-size:12px;color:var(--text-3)}
.sw{width:40px;height:22px;border-radius:11px;background:rgba(255,255,255,.22);position:relative;cursor:pointer;border:none;flex:none;transition:.2s;padding:0}
.sw::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s}
.sw[aria-checked="true"]{background:var(--primary)}
.sw[aria-checked="true"]::after{transform:translateX(18px)}

/* ---------------- сообщения ---------------- */
.alert{display:flex;gap:9px;padding:9px 13px;border:1px solid;border-radius:var(--radius);font-size:13px;line-height:1.6}
.a-info{background:var(--blue-bg);border-color:var(--blue-bd);color:var(--text-2)}
.a-success{background:var(--success-bg);border-color:var(--success-bd);color:var(--text-2)}
.a-warning{background:var(--warning-bg);border-color:var(--warning-bd);color:var(--text-2)}
.a-error{background:var(--error-bg);border-color:var(--error-bd);color:var(--text-2)}
.alert .ic{flex:none;line-height:1.6}
.a-info .ic{color:var(--primary)}
.a-success .ic{color:var(--success)}
.a-warning .ic{color:var(--warning)}
.a-error .ic{color:var(--error)}
.alert b{color:var(--text);font-weight:600}
.mb16{margin-bottom:16px}
.mt16{margin-top:16px}

/* ---------------- прочее ---------------- */
.seg{display:inline-flex;background:var(--bg-elevated);border-radius:var(--radius);padding:2px}
.seg a{height:24px;padding:0 11px;border-radius:4px;color:var(--text-2);font-size:13px;display:inline-flex;align-items:center;text-decoration:none}
.seg a[aria-selected="true"]{background:#333;color:var(--text)}
.seg a:hover{text-decoration:none;color:var(--text)}

.progress{height:6px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden;min-width:90px}
.progress i{display:block;height:100%;background:var(--primary);border-radius:3px}
.progress.ok i{background:var(--success)}

.pre{
  font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--text-2);
  background:#000;border:1px solid var(--border-2);border-radius:var(--radius);
  padding:10px 12px;overflow-x:auto;white-space:pre;margin:0;
}
.pre b{color:var(--warning-fg);font-weight:400}
.pre i{color:var(--text-4);font-style:normal}

.desc{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-size:13px;align-items:baseline;margin:0}
.desc dt{color:var(--text-3);white-space:nowrap}
.desc dd{margin:0;color:var(--text)}

.timeline{list-style:none;margin:0;padding:0}
.timeline li{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-2);font-size:13px;align-items:baseline}
.timeline li:last-child{border-bottom:none}
.timeline time{font-family:var(--mono);font-size:11px;color:var(--text-3);flex:none;width:40px}
.timeline .tx{color:var(--text-2)}
.timeline .tx b{color:var(--text);font-weight:600}
.timeline .tx code{font-family:var(--mono);font-size:11.5px;color:var(--blue-fg)}

.pager{display:flex;gap:8px;align-items:center;justify-content:flex-end;padding:12px 16px;font-size:12px;color:var(--text-3)}

/* ---------------- вход ---------------- */
.loginwrap{min-height:100vh;display:grid;place-items:center;padding:20px}
.loginbox{width:100%;max-width:340px}
.loginbox .brand{text-align:center;margin-bottom:24px}
.loginbox .brand .t{font-size:20px;font-weight:600}
.loginbox .brand .s{font-size:12px;color:var(--text-3);margin-top:2px}

@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms !important;transition-duration:.001ms !important}}
@media(max-width:900px){
  .layout{grid-template-columns:1fr}
  .sider{position:static;height:auto}
  .menu{flex-direction:row;flex-wrap:wrap;padding:0 12px 12px}
  .menu a{width:auto}
  .menu-group,.sider-foot{display:none}
}