:root{--bg:#f2f4f7;--surface:#fff;--soft:#f6f7f9;--border:#e1e5eb;--border-soft:#edf0f4;--ctl:#c9d0db;--text:#161b26;--text2:#2c3442;--muted:#5a6372;--primary:#1e5eff;--primary-dark:#1647cc;--primary-soft:#e8eeff;--primary-text:#1a47c2;--ok-bg:#e4f4ea;--ok:#12693f;--warn-bg:#fff1d6;--warn:#8a4b00;--bad-bg:#fce8e6;--bad:#a3211a;--danger:#b42318;font-family:system-ui,-apple-system,"Segoe UI","Helvetica Neue",sans-serif;font-size:14px;line-height:1.45}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text)}
button,input,select{font:inherit;color:inherit}
h1{font-size:24px;margin:0}h2{font-size:18px;margin:0}h3{font-size:16px;margin:0}p{margin:0}
.muted{color:var(--muted)}.small{font-size:13px}.num{font-variant-numeric:tabular-nums}
.top{max-width:1480px;margin:0 auto;padding:16px 16px 0;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.mock{background:var(--warn-bg);color:var(--warn);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600}
.layout{max-width:1480px;margin:0 auto;padding:16px 16px 40px;display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start}
.content{flex:999 1 640px;min-width:0;display:flex;flex-direction:column;gap:16px}
#view{display:flex;flex-direction:column;gap:16px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px 24px;min-width:0}
.card-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;margin-bottom:14px}
.card-head .l{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sidebar{flex:1 1 230px;max-width:260px;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:4px}
.side-title{padding:6px 10px 8px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.side-item{width:100%;text-align:left;border:1px solid transparent;border-radius:10px;padding:10px;background:transparent;display:flex;flex-direction:column;gap:2px;cursor:pointer;min-height:56px}
.side-item:hover{background:var(--soft)}
.side-item.active{background:#eef3ff;border-color:#c9d7ff}
.side-item.active .side-name{color:#1a3a8f}
.side-name{display:flex;align-items:center;gap:8px;font-weight:600}
.side-sub{font-size:12px;color:var(--muted);padding-left:16px}
.side-meta{margin-top:10px;padding:12px 10px 4px;border-top:1px solid var(--border-soft);display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.side-meta b{color:var(--text);font-weight:600}
.dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto;background:#9aa3b2}.dot.ok{background:var(--ok)}.dot.info{background:var(--primary)}.dot.bad{background:var(--danger)}
.tabs{display:flex;flex-wrap:wrap;gap:6px}
.tab{height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--ctl);background:var(--surface);font-weight:500;cursor:pointer;white-space:nowrap}
.tab:hover{background:var(--soft)}
.tab.active{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}
.seg{display:inline-flex;border:1px solid var(--ctl);border-radius:8px;overflow:hidden}
.seg button{border:0;background:var(--surface);padding:0 12px;height:32px;cursor:pointer;font-size:13px;white-space:nowrap}
.seg button+button{border-left:1px solid var(--ctl)}
.seg button:hover{background:var(--soft)}
.seg button.on{background:var(--primary-soft);color:var(--primary-text);font-weight:600}
.banners{display:flex;flex-direction:column;gap:10px}
.banner{display:flex;gap:12px;align-items:center;padding:12px 16px;border-radius:12px;border:1px solid}
.banner.warn{background:var(--warn-bg);border-color:#f0ce8c;color:#6b3a00}
.banner.info{background:var(--primary-soft);border-color:#c9d7ff;color:#1a3a8f}
.banner b{font-weight:600}
.btn{height:36px;padding:0 12px;border-radius:8px;border:1px solid var(--ctl);background:var(--surface);font-weight:500;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--soft)}.btn-sm{height:30px;padding:0 10px;font-size:13px}
.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}.btn-primary:hover{background:var(--primary-dark)}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap;background:#eef0f3;color:#3b4556}
.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.warn{background:var(--warn-bg);color:var(--warn)}.pill.bad{background:var(--bad-bg);color:var(--bad)}.pill.info{background:var(--primary-soft);color:var(--primary-text)}
.src{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:6px;background:#eef0f3;color:#3b4556;white-space:nowrap}
.src.ym{background:#fff3cf;color:#7a4a00}.src.tm{background:var(--primary-soft);color:var(--primary-text)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.kpi{background:var(--soft);border-radius:12px;padding:14px 16px}
.kpi .l{font-size:13px;color:var(--muted);white-space:nowrap}.kpi .v{font-size:26px;font-weight:600;margin-top:2px;white-space:nowrap}.kpi .s{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap}
.kpi .v.bad{color:var(--bad)}
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);text-align:left;padding:8px;border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:10px 8px;border-bottom:1px solid var(--border-soft);vertical-align:middle;white-space:nowrap}
td .wrap{white-space:normal;min-width:260px;max-width:420px}
tr.click{cursor:pointer}tr.click:hover td{background:var(--soft)}
td.r,th.r{text-align:right}
.bar{height:8px;border-radius:999px;background:var(--border-soft);overflow:hidden;min-width:60px}
.bar i{display:block;height:100%;background:var(--primary);border-radius:999px}
.row2{display:grid;grid-template-columns:repeat(auto-fit,minmax(380px,1fr));gap:16px}
.list{display:flex;flex-direction:column;gap:10px}
.list .it{display:grid;grid-template-columns:minmax(130px,200px) 1fr 70px;gap:10px;align-items:center;font-size:13px}
.list .it>span:first-child{white-space:nowrap}
.tl .ev{display:flex;gap:12px;padding:8px 0;border-bottom:1px solid var(--border-soft);font-size:13px}
.tl .ev time{width:92px;flex:0 0 auto;color:var(--muted)}
.field{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}
input[type=search],select{height:36px;border:1px solid var(--ctl);border-radius:8px;padding:0 10px;background:var(--surface)}
input[type=search]{min-width:240px}
input[type=number]{height:32px;width:130px;border:1px solid var(--ctl);border-radius:8px;padding:0 8px;background:var(--surface)}
.switch{width:44px;height:26px;border-radius:999px;border:0;padding:3px;background:var(--primary);display:flex;cursor:pointer;justify-content:flex-end}
.switch span{width:20px;height:20px;border-radius:50%;background:#fff}
.switch.off{background:var(--ctl);justify-content:flex-start}
.rule{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--border-soft)}
.toast{position:fixed;right:20px;bottom:20px;background:var(--text);color:#fff;padding:10px 16px;border-radius:10px;font-size:13px;opacity:0;transition:opacity .2s;pointer-events:none}
.toast.on{opacity:1}
.note{font-size:13px;color:var(--muted);margin-top:12px}
.login-body{display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-card{width:340px;display:flex;flex-direction:column;gap:12px}
.login-card input{height:40px;border:1px solid var(--ctl);border-radius:8px;padding:0 10px}
.bad-text{color:var(--bad);font-weight:600}
.top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.empty{padding:28px;text-align:center}
.pill.link{cursor:pointer}
.btn-ghost{border-color:transparent;background:transparent}
td .acts{display:flex;gap:6px;justify-content:flex-end}


.wrapcell{white-space:normal;min-width:150px}
td.errcell{white-space:normal;min-width:260px;max-width:520px}
td.errcell .acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;justify-content:flex-start}
@media (max-width:1320px){.hide-md{display:none}th,td{padding-left:6px;padding-right:6px}}
@media (max-width:1200px){
  .sidebar{flex:1 1 100%;max-width:none}
  #side{display:flex;flex-wrap:wrap;gap:6px}
  #side .side-item{width:auto;flex:1 1 200px}
  .side-meta{flex-direction:row;flex-wrap:wrap;gap:6px 18px}
}
html{overflow-y:scroll}
table.fx{table-layout:fixed}
table.fx th{white-space:normal;line-height:1.25}
table.fx th,table.fx td{overflow:hidden;text-overflow:ellipsis}
table.fx td.errcell,table.fx td.wrapcell{overflow:visible;min-width:0;max-width:none}
.t-clients th:nth-child(1){width:21%}.t-clients th:nth-child(2){width:17%}.t-clients th:nth-child(3){width:12%}.t-clients th:nth-child(4){width:12%}
.t-clients th:nth-child(5){width:6%}.t-clients th:nth-child(6){width:19%}.t-clients th:nth-child(7){width:13%}
.t-over th:nth-child(1){width:24%}.t-over th:nth-child(2){width:8%}.t-over th:nth-child(3){width:10%}.t-over th:nth-child(4){width:9%}.t-over th:nth-child(5){width:9%}
.t-over th:nth-child(6){width:10%}.t-over th:nth-child(7){width:9%}.t-over th:nth-child(8){width:8%}.t-over th:nth-child(9){width:13%}
.t-errors th:nth-child(1){width:40%}.t-errors th:nth-child(2){width:20%}.t-errors th:nth-child(3){width:9%}.t-errors th:nth-child(4){width:6%}
.t-errors th:nth-child(5){width:13%}.t-errors th:nth-child(6){width:12%}
.detail{margin-top:6px;padding:6px 8px;border-radius:8px;background:var(--soft);font:12px/1.4 ui-monospace,Consolas,monospace;word-break:break-word;white-space:pre-wrap}