/* КОМЕК / KMK LOG — рабочая область светлая, боковое меню тёмное. */
:root{
  --bg:#F4F6FA; --card:#fff; --ink:#12203C; --ink2:#4A5A78; --ink3:#7A88A3;
  --line:#E1E7F0; --line2:#CFD8E6; --acc:#1F5FD6; --acc-d:#164AA8;
  --side:#0E1E3C; --side2:#16294D; --side-ink:#C4D0E6;
  --green:#0F7B4F; --amber:#9A6400; --red:#B4231F; --violet:#5B3FB8; --teal:#0B6E77;
  --r:10px; --sw:240px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden}
body.app{font:15px/1.45 "IBM Plex Sans",-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink)}
a{color:var(--acc);text-decoration:none}
h1{font-size:22px;margin:0;font-weight:600;letter-spacing:-.2px}
h2{font-size:16px;margin:0 0 10px;font-weight:600}
table{border-collapse:collapse;width:100%}

/* --- Меню --- */
.side{position:fixed;left:0;top:0;bottom:0;width:var(--sw);background:var(--side);color:var(--side-ink);overflow-y:auto;z-index:40}
.side-brand{display:flex;align-items:center;gap:8px;padding:16px 16px 12px}
.side-brand b{color:#fff;font-size:17px;letter-spacing:.5px}
.side-brand b span{color:#5A8CFF}
.side-brand .sub{display:block;font-size:11px;color:#7E8FB0;font-weight:400;letter-spacing:.3px}
.side-nav{padding:6px 8px 24px}
.side-nav .grp{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:#69799B;padding:14px 10px 6px}
.side-nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--side-ink);font-size:14px}
.side-nav a:hover{background:var(--side2);color:#fff}
.side-nav a.cur{background:var(--acc);color:#fff}
.side-nav a i{display:flex;opacity:.9}
.side-foot{border-top:1px solid #22335A;margin:8px 10px;padding:10px 0;font-size:13px;color:#8C9BBA}
.side-foot b{display:block;color:#fff;font-weight:500}

/* --- Рабочая область --- */
.wrap{margin-left:var(--sw);padding:20px 24px 60px;max-width:100%}
.top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.top .sp{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.sub{color:var(--ink3);font-size:13px}

.btn{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:8px;border:1px solid var(--line2);
  background:#fff;color:var(--ink);font-size:14px;cursor:pointer;font-family:inherit;white-space:nowrap}
.btn:hover{border-color:var(--acc);color:var(--acc)}
.btn.pri{background:var(--acc);border-color:var(--acc);color:#fff}
.btn.pri:hover{background:var(--acc-d);border-color:var(--acc-d);color:#fff}
.btn.sm{padding:5px 10px;font-size:13px}
.btn.dgr:hover{border-color:var(--red);color:var(--red)}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:16px}
.card.p0{padding:0;overflow:hidden}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;align-items:start}
.c2{display:grid;grid-template-columns:2fr 1fr;gap:16px;align-items:start}
@media(max-width:1100px){.c2{grid-template-columns:1fr}}

/* --- Таблицы --- */
table.t{font-size:14px}
table.t th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink3);
  font-weight:600;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;background:#FAFBFD}
table.t th a{color:var(--ink3)}
table.t td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
table.t tbody tr:hover{background:#F5F8FE}
table.t tr.row{cursor:pointer}
table.t td.r,table.t th.r{text-align:right}
.mono{font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.t-scroll{overflow-x:auto;max-width:100%}

.chip{display:inline-block;padding:3px 9px;border-radius:20px;font-size:12px;font-weight:500;white-space:nowrap;border:1px solid}
.b-grey{background:#EEF1F6;color:#41506B;border-color:#DCE2EC}
.b-blue{background:#E8F0FE;color:#154BA8;border-color:#CBDDFB}
.b-green{background:#E4F5EC;color:#0B5F3C;border-color:#C4E7D4}
.b-amber{background:#FCF2DC;color:#7A5000;border-color:#F0DFB6}
.b-red{background:#FCE9E8;color:#93211D;border-color:#F5CFCD}
.b-violet{background:#EFEAFB;color:#452F91;border-color:#DDD3F5}
.b-teal{background:#E1F3F5;color:#08575E;border-color:#C2E4E8}

/* --- Формы --- */
.f{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 14px}
.f .full{grid-column:1/-1}
label{display:block;font-size:12px;color:var(--ink2);margin-bottom:4px}
input[type=text],input[type=number],input[type=date],input[type=password],select,textarea{
  width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:8px;font:inherit;font-size:14px;
  background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid #BBD1F8;border-color:var(--acc)}
textarea{min-height:80px;resize:vertical}
.hint{font-size:12px;color:var(--ink3);margin-top:4px}
fieldset{border:1px solid var(--line);border-radius:var(--r);padding:14px;margin:0 0 14px}
legend{font-size:13px;font-weight:600;padding:0 6px;color:var(--ink2)}

/* --- Плитки --- */
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.kpi .k{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px}
.kpi .k .lb{font-size:12px;color:var(--ink3);margin-bottom:6px}
.kpi .k .vl{font-size:22px;font-weight:600;letter-spacing:-.3px}

/* --- Канбан --- */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:12px;overflow-x:auto;padding-bottom:8px}
.bcol{background:#EDF1F7;border-radius:var(--r);padding:10px;min-height:120px}
.bcol h3{margin:0 0 8px;font-size:13px;font-weight:600;display:flex;justify-content:space-between;color:var(--ink2)}
.bcard{background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px;margin-bottom:8px;display:block;color:var(--ink)}
.bcard:hover{border-color:var(--acc)}
.bcard .n{font-size:12px;color:var(--ink3)}
.bcard .t{font-weight:500;margin:2px 0 4px;font-size:14px}
.bcard .m{font-size:13px;color:var(--ink2);display:flex;justify-content:space-between;gap:8px}

/* --- Расчёт --- */
.calc{display:grid;grid-template-columns:minmax(320px,1fr) minmax(300px,420px);gap:16px;align-items:start}
@media(max-width:1000px){.calc{grid-template-columns:1fr}}
.sum{position:sticky;top:16px}
.sum .ln{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line)}
.sum .ln.big{font-size:17px;font-weight:600;border-bottom:none;padding-top:12px}
.sum .ln b{font-variant-numeric:tabular-nums}
.why{background:#F1F5FD;border-left:3px solid var(--acc);padding:9px 12px;border-radius:0 8px 8px 0;font-size:13px;color:var(--ink2);margin-top:10px}

/* --- Вкладки --- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto}
.tabs a{padding:9px 14px;font-size:14px;color:var(--ink2);border-bottom:2px solid transparent;white-space:nowrap}
.tabs a.cur{color:var(--acc);border-bottom-color:var(--acc);font-weight:500}

.ok{background:#E4F5EC;border:1px solid #C4E7D4;color:#0B5F3C;padding:10px 14px;border-radius:8px;margin-bottom:14px;font-size:14px}
.err{background:#FCE9E8;border:1px solid #F5CFCD;color:#93211D;padding:10px 14px;border-radius:8px;margin-bottom:14px;font-size:14px}
.empty{padding:28px;text-align:center;color:var(--ink3);font-size:14px}
.tl{list-style:none;margin:0;padding:0;font-size:14px}
.tl li{padding:9px 0;border-bottom:1px solid var(--line)}
.tl li .w{color:var(--ink3);font-size:12px}
.srch{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.srch input[type=text]{max-width:280px}
.srch select{max-width:190px}

/* --- Вход --- */
body.lg{background:linear-gradient(140deg,#0E1E3C,#1F3F7A);display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.lgbox{background:#fff;border-radius:14px;padding:28px;width:100%;max-width:380px}
.lgbox h1{margin-bottom:4px}
.lgbox .btn{width:100%;justify-content:center;margin-top:14px}
.lgacc{margin-top:18px;font-size:13px;color:var(--ink2);border-top:1px solid var(--line);padding-top:12px}
.lgacc code{background:#F1F4F9;padding:1px 5px;border-radius:4px}

.mtop{display:none}