@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/s/inter-4b93706f85.woff2) format('woff2')}
/* BCB Control v2 — единая таблица стилей. Палитра @tokens@ подставляется assets.py. */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --navy:#0C284F; --navy2:#17386B; --gold:#B28D25; --gold_lt:#D8B243;
  --bg:#F7F8FA; --panel:#FFFFFF; --panel2:#FBFCFD; --line:#E4E8EF; --line2:#CFD7E3;
  --text:#101A2B; --dim:#5B6880; --dim2:#8A96A9;
  --ok:#17805A; --ok_bg:#EAF6F1; --warn:#A96B05; --warn_bg:#FCF3E4;
  --bad:#C0392B; --bad_bg:#FCEEEC; --gold_bg:#FBF6E7;
  --side:230px; --side_c:62px; --top:52px;
}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:15px/1.5 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  -webkit-font-smoothing:antialiased;font-feature-settings:'tnum' 1}
a{color:var(--navy2)}
.num,table td,table th{font-variant-numeric:tabular-nums}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ======================================================= боковая панель */
.side{position:fixed;top:0;left:0;bottom:0;width:var(--side);background:var(--navy);
  color:#fff;display:flex;flex-direction:column;z-index:60;transition:width .16s ease,transform .2s ease}
.side-top{display:flex;align-items:center;gap:10px;padding:14px 14px 12px;min-height:var(--top)}
.side-top img{height:25px;width:auto;max-width:158px;object-fit:contain;flex:0 1 auto}
.side-top .nm{font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase;
  color:#93A6C4;white-space:nowrap;overflow:hidden;border-left:1px solid rgba(255,255,255,.18);
  padding-left:9px}
.burger{margin-left:auto;background:transparent;border:0;color:#C9D6EA;cursor:pointer;
  padding:6px;border-radius:7px;line-height:0;flex:0 0 auto}
.burger:hover{background:rgba(255,255,255,.1);color:#fff}
.side nav{padding:8px 8px 0;display:flex;flex-direction:column;gap:2px;overflow-y:auto;flex:1}
.side nav a{display:flex;align-items:center;gap:11px;padding:10px 11px;border-radius:9px;
  color:#C4D2E6;text-decoration:none;font-size:14px;font-weight:500;white-space:nowrap}
.side nav a svg{flex:0 0 20px;opacity:.85}
.side nav a:hover{background:rgba(255,255,255,.09);color:#fff}
.side nav a.on{background:var(--gold);color:#241C00;font-weight:650}
.side nav a.on svg{opacity:1}
.side nav .grp{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:#7F93B3;
  padding:14px 12px 5px;white-space:nowrap}
.side-user{border-top:1px solid rgba(255,255,255,.12);padding:12px 14px;font-size:12.5px;color:#9FB3D0}
.side-user .u{display:flex;align-items:center;gap:9px;margin-bottom:8px}
.side-user .av{flex:0 0 28px;height:28px;border-radius:50%;background:var(--gold);color:#241C00;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px}
.side-user .u b{display:block;color:#fff;font-size:13px;font-weight:600;line-height:1.25;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-user .u span{display:block;font-size:11px;color:#93A6C4}
.side-user .acts{display:flex;gap:6px}
.side-user .acts a,.side-user .acts button{flex:1;display:flex;align-items:center;
  justify-content:center;gap:6px;background:rgba(255,255,255,.1);
  border:0;border-radius:7px;padding:7px 4px;color:#D7E1F0;font:inherit;font-size:12px;
  text-decoration:none;cursor:pointer;white-space:nowrap}
.side-user .acts svg{flex:0 0 15px}
.side-user .acts a:hover,.side-user .acts button:hover{background:rgba(255,255,255,.2);color:#fff}
.side-user form{display:flex;flex:1}

/* свёрнуто: только иконки */
body.nav-min .side{width:var(--side_c)}
body.nav-min .side-top .nm,body.nav-min .side nav a span,body.nav-min .side nav .grp,
body.nav-min .side-user .u>div:not(.av),body.nav-min .side-user .acts span{display:none}
body.nav-min .side-top{justify-content:center;padding:14px 8px 12px}
body.nav-min .side-top img{display:none}
body.nav-min .burger{margin:0}
body.nav-min .side nav a{justify-content:center;padding:11px 0}
body.nav-min .side-user{padding:12px 8px}
body.nav-min .side-user .u{justify-content:center}
body.nav-min .side-user .acts{flex-direction:column}
body.nav-min .wrap{margin-left:var(--side_c)}

.scrim{position:fixed;inset:0;background:rgba(6,16,32,.55);z-index:55;opacity:0;
  pointer-events:none;transition:opacity .2s}

/* =========================================================== контент */
.wrap{margin-left:var(--side);min-height:100vh;display:flex;flex-direction:column;
  transition:margin-left .16s ease}
.topbar{position:sticky;top:0;z-index:40;min-height:var(--top);display:flex;align-items:center;
  gap:10px;padding:7px 18px;background:rgba(247,248,250,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line)}
.topbar .mb{display:none;background:var(--navy);border:0;color:#fff;border-radius:8px;padding:7px;
  line-height:0;cursor:pointer}
.topbar h1{font-size:16px;font-weight:700;color:var(--navy);letter-spacing:-.01em;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.topbar .sp{flex:1}
.topbar .fresh{font-size:12px;color:var(--dim);white-space:nowrap;display:flex;align-items:center;gap:6px}
.topbar .fresh .dot{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:0 0 7px}
.topbar .fresh.stale .dot{background:var(--warn)}
main{padding:18px 18px 64px;max-width:1280px;width:100%}

/* ============================================================= кнопки */
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line2);
  background:var(--panel);color:var(--text);border-radius:9px;padding:8px 13px;
  font:600 13px/1.2 inherit;cursor:pointer;text-decoration:none;white-space:nowrap}
.btn:hover{border-color:var(--navy2);background:var(--panel2)}
.btn.pri{background:var(--gold);border-color:var(--gold);color:#241C00}
.btn.pri:hover{filter:brightness(1.06);background:var(--gold)}
.btn.nav{background:var(--navy);border-color:var(--navy);color:#fff}
.btn.nav:hover{background:var(--navy2)}
.btn[disabled],.btn.busy{opacity:.6;cursor:progress;pointer-events:none}
.btn.sm{padding:5px 10px;font-size:12px;border-radius:7px}
.spin{width:13px;height:13px;border:2px solid rgba(0,0,0,.2);border-top-color:#241C00;
  border-radius:50%;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* ================================================== карточки и секции */
.sec{margin:26px 0 0}
.sec:first-child{margin-top:0}
.sec>h2{font-size:14px;font-weight:700;color:var(--navy);margin:0 0 4px;letter-spacing:-.005em}
.sec>h2 .c{font-weight:500;color:var(--dim2);font-size:12px;margin-left:7px}
.sec>.hint{font-size:12.5px;color:var(--dim);margin:0 0 10px;max-width:74ch}
.sec>.bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(218px,1fr));gap:11px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px 15px 12px;
  display:flex;flex-direction:column;text-decoration:none;color:inherit;position:relative}
a.kpi:hover{border-color:var(--navy2);box-shadow:0 4px 18px rgba(12,40,79,.08)}
a.kpi:after{content:'→';position:absolute;top:12px;right:13px;color:var(--dim2);font-size:14px}
a.kpi:hover:after{color:var(--navy2)}
.kpi .t{font-size:11px;font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.055em;
  margin-bottom:7px;padding-right:18px}
.kpi .v{font-size:23px;font-weight:800;letter-spacing:-.03em;line-height:1.15;font-variant-numeric:tabular-nums}
.kpi .n{font-size:12px;color:var(--dim);margin-top:6px;line-height:1.45}
.kpi.bad .v{color:var(--bad)}.kpi.warn .v{color:var(--warn)}.kpi.ok .v{color:var(--ok)}
.kpi .cta{margin-top:9px;font-size:12px;font-weight:600;color:var(--navy2)}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:13px;overflow:hidden}
.rows .r{display:flex;justify-content:space-between;gap:14px;padding:10px 15px;
  border-top:1px solid var(--line);font-size:13.5px}
.rows .r:first-child{border-top:0}
.rows .r>span:last-child{font-variant-numeric:tabular-nums;font-weight:600;text-align:right;white-space:nowrap}
.rows .r .d{color:var(--dim);font-weight:400}
.rows a.r{text-decoration:none;color:inherit}
.rows a.r:hover{background:var(--panel2)}

.todo{display:flex;flex-direction:column;gap:9px}
.todo .i{display:flex;gap:11px;align-items:flex-start;background:var(--panel);
  border:1px solid var(--line);border-left:3px solid var(--dim2);border-radius:11px;padding:12px 14px;
  text-decoration:none;color:inherit}
.todo a.i:hover{border-color:var(--navy2);background:var(--panel2)}
.todo .i.bad{border-left-color:var(--bad)}.todo .i.warn{border-left-color:var(--warn)}
.todo .i.ok{border-left-color:var(--ok)}
.todo .i .tx{flex:1;min-width:0}
.todo .i b{display:block;font-size:13.5px;font-weight:650;margin-bottom:2px}
.todo .i i{font-style:normal;font-size:12.5px;color:var(--dim);display:block}
.todo .i .am{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:13.5px}
@media(max-width:700px){
  /* на телефоне сумма не должна обтекать длинное название — она уходит на свою строку */
  .todo .i{flex-wrap:wrap}
  .todo .i .tx{flex:1 1 100%}
  .todo .i .am{flex:1 1 100%;margin-top:5px;font-size:15px}
}

.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{display:inline-flex;align-items:center;gap:5px;background:var(--panel);border:1px solid var(--line2);
  border-radius:20px;padding:5px 11px;font-size:12.5px;cursor:pointer;color:var(--text);
  text-decoration:none;font-family:inherit}
.tag:hover{border-color:var(--navy2)}
.tag.on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600}
.tag b{font-variant-numeric:tabular-nums}

.bars{display:flex;flex-direction:column;gap:7px}
.bars .b{display:grid;grid-template-columns:1fr;gap:4px;background:none;border:0;padding:0;
  font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%}
.bars .b .lb{display:flex;justify-content:space-between;gap:10px;font-size:12.5px}
.bars .b .lb span:first-child{color:var(--dim)}
.bars .b .lb span:last-child{font-weight:650;font-variant-numeric:tabular-nums}
.bars .b .tr{height:9px;border-radius:5px;background:#EDF0F5;overflow:hidden}
.bars .b .fi{height:100%;border-radius:5px;background:var(--navy2)}
.bars .b.od .fi{background:var(--bad)}
.bars .b.soon .fi{background:var(--warn)}
.bars .b:hover .lb span:first-child{color:var(--navy2)}

.mini{display:flex;align-items:flex-end;gap:3px;height:74px;padding:2px 0}
.mini .c{flex:1;min-width:3px;display:flex;flex-direction:column;justify-content:flex-end;height:100%}
.mini .c i{display:block;background:var(--navy2);border-radius:2px 2px 0 0}
.mini .c.n i{background:var(--bad)}

.note{background:var(--gold_bg);border:1px solid #EADFBB;border-radius:11px;padding:11px 14px;
  font-size:12.5px;color:#5B4A12;line-height:1.5}
.msg{padding:11px 14px;border-radius:11px;font-size:13.5px;background:var(--ok_bg);color:var(--ok);
  border:1px solid #BFE3D5;margin-bottom:16px;display:flex;gap:10px;align-items:flex-start}
.msg.bad{background:var(--bad_bg);color:var(--bad);border-color:#F0CFCA}
.msg.warn{background:var(--warn_bg);color:var(--warn);border-color:#EFDDBC}
.msg .x{margin-left:auto;background:none;border:0;color:inherit;cursor:pointer;font-size:15px;
  line-height:1;opacity:.6;padding:0 2px}
.msg .x:hover{opacity:1}

/* ============================================================ таблицы */
.tbl{background:var(--panel);border:1px solid var(--line);border-radius:13px;overflow:hidden}
.tbl .scroller{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:13px}
thead th{position:sticky;top:0;background:var(--panel2);text-align:left;font-size:11px;
  font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.045em;
  padding:9px 11px;border-bottom:1px solid var(--line);white-space:nowrap;z-index:2}
thead th.s{cursor:pointer;user-select:none}
thead th.s:hover{color:var(--navy2)}
thead th .ar{opacity:.35;font-size:9px;margin-left:3px}
thead th.act .ar{opacity:1;color:var(--gold)}
tbody td{padding:9px 11px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tbody tr.clk{cursor:pointer}
tbody tr.clk:hover td{background:var(--panel2)}
td.r,th.r{text-align:right;white-space:nowrap}
td.mono{font-variant-numeric:tabular-nums}
td.nm{min-width:170px}
td.neg{color:var(--bad);font-weight:600}
td.warnv{color:var(--warn);font-weight:600}
.pill{display:inline-block;padding:2px 7px;border-radius:20px;font-size:11px;font-weight:650;
  white-space:nowrap}
.pill.bad{background:var(--bad_bg);color:var(--bad)}
.pill.warn{background:var(--warn_bg);color:var(--warn)}
.pill.ok{background:var(--ok_bg);color:var(--ok)}
.pill.dim{background:#EEF1F6;color:var(--dim)}
.tfoot{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:10px 13px;
  border-top:1px solid var(--line);background:var(--panel2);font-size:12.5px;color:var(--dim)}
.tfoot .sp{flex:1}
.srch{display:flex;align-items:center;gap:7px;background:var(--panel);border:1px solid var(--line2);
  border-radius:9px;padding:0 10px;min-width:180px}
.srch input{border:0;outline:0;font:inherit;font-size:13px;padding:8px 0;background:none;width:100%;color:var(--text)}
.srch svg{flex:0 0 14px;color:var(--dim2)}
select.sel{font:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--line2);border-radius:9px;
  background:var(--panel);color:var(--text);max-width:100%}

/* ========================================================== скелетоны */
.sk{background:linear-gradient(90deg,#EDF0F5 25%,#F5F7FA 37%,#EDF0F5 63%);
  background-size:400% 100%;animation:shine 1.3s ease-in-out infinite;border-radius:7px}
@keyframes shine{0%{background-position:100% 0}100%{background-position:0 0}}
.sk-kpi{height:96px;border-radius:13px}
.sk-line{height:13px;margin:9px 0}
.sk-tbl{height:230px;border-radius:13px}
.sk-h{height:15px;width:180px;margin-bottom:11px}

/* ============================================================== пусто */
.empty{padding:30px 22px;text-align:center;color:var(--dim)}
.empty b{display:block;color:var(--text);font-size:14.5px;margin-bottom:5px;font-weight:650}
.empty p{font-size:13px;max-width:46ch;margin:0 auto 12px;line-height:1.55}

/* ============================================================= детали */
details.acc{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-top:9px}
details.acc>summary{cursor:pointer;padding:12px 15px;font-size:13.5px;font-weight:650;color:var(--navy);
  list-style:none;display:flex;align-items:center;gap:8px}
details.acc>summary::-webkit-details-marker{display:none}
details.acc>summary:before{content:'▸';color:var(--dim2);font-size:11px}
details.acc[open]>summary:before{content:'▾'}
details.acc .bd{padding:0 15px 14px;font-size:13px;color:var(--text)}
details.acc .bd .rows .r:first-child{border-top:1px solid var(--line)}

/* ============================================================== ящик */
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);background:var(--bg);z-index:70;
  box-shadow:-12px 0 40px rgba(6,16,32,.2);display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .2s ease}
.drawer.on{transform:none}
.drawer .dh{display:flex;align-items:flex-start;gap:12px;padding:15px 17px;background:var(--navy);color:#fff}
.drawer .dh b{font-size:15px;font-weight:700;display:block}
.drawer .dh i{font-style:normal;font-size:12px;color:#A8BCD8;display:block;margin-top:2px}
.drawer .dh button{margin-left:auto;background:rgba(255,255,255,.14);border:0;color:#fff;
  border-radius:8px;width:30px;height:30px;font-size:17px;line-height:1;cursor:pointer;flex:0 0 30px}
.drawer .db{flex:1;overflow-y:auto;padding:15px 17px 40px}
.drawer .db h3{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--dim);
  margin:18px 0 7px;font-weight:700}
.drawer .db h3:first-child{margin-top:0}

/* ======================================================= адаптивность */
@media(max-width:1100px){
  .kpis{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
}
@media(max-width:900px){
  .side{transform:translateX(-100%);width:min(290px,84vw);box-shadow:none}
  body.nav-open .side{transform:none;box-shadow:14px 0 40px rgba(6,16,32,.3)}
  body.nav-open .scrim{opacity:1;pointer-events:auto}
  .wrap,body.nav-min .wrap{margin-left:0}
  .topbar .mb{display:block}
  .topbar{padding:7px 12px}
  main{padding:14px 12px 72px}
  body.nav-min .side-top .nm,body.nav-min .side nav a span,body.nav-min .side nav .grp,
  body.nav-min .side-user .u>div,body.nav-min .side-user .acts span{display:block}
  body.nav-min .side-top{justify-content:flex-start;padding:14px 14px 12px}
  body.nav-min .side-top img{display:block}
  body.nav-min .side nav a{justify-content:flex-start;padding:10px 11px}
  body.nav-min .side-user .acts{flex-direction:row}
  body.nav-min .side-user{padding:12px 14px}
}
@media(max-width:700px){
  /* в две колонки суммы вида 210 697 513,68 ₸ не помещаются — только в одну */
  .kpis{grid-template-columns:1fr;gap:9px}
  .kpi .v{font-size:21px}
  .kpi .t{font-size:10.5px}
  /* таблицы превращаются в карточки: ничего не разъезжается по горизонтали */
  .tbl .scroller{overflow-x:visible}
  table.cards thead{display:none}
  table.cards,table.cards tbody,table.cards tr,table.cards td{display:block;width:100%}
  table.cards tr{border-bottom:1px solid var(--line);padding:11px 13px 9px;position:relative}
  table.cards tr:last-child{border-bottom:0}
  table.cards td{border:0;padding:2px 0;display:flex;gap:10px;align-items:baseline;
    justify-content:space-between;text-align:right}
  table.cards td:before{content:attr(data-l);color:var(--dim);font-size:11.5px;text-transform:uppercase;
    letter-spacing:.04em;font-weight:650;text-align:left;flex:0 0 auto;max-width:52%}
  table.cards td.hd{display:block;text-align:left;font-weight:700;font-size:14px;margin-bottom:5px;
    padding-right:20px}
  table.cards td.hd:before{display:none}
  table.cards td.hide-m{display:none}
  table.cards tr.clk:after{content:'→';position:absolute;top:11px;right:11px;color:var(--dim2)}
  table.cards tr.clk:hover td{background:none}
  .tfoot{font-size:12px}
  .srch{min-width:0;flex:1 1 140px}
}
@media(max-width:430px){
  main{padding:12px 10px 72px}
}
/* узкая шапка: заголовок раздела важнее служебной подписи — она уходит вниз */
@media(max-width:680px){
  .topbar{flex-wrap:wrap;row-gap:2px;padding-bottom:6px}
  .topbar h1{flex:1 1 auto;min-width:0}
  .topbar .sp{display:none}
  .topbar .fresh{order:5;flex:1 0 100%;font-size:11.5px;padding-left:2px}
}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}}

/* ============================================== вход и смена пароля */
body.auth{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.box{width:100%;max-width:382px;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:26px 24px;box-shadow:0 10px 40px rgba(12,40,79,.08)}
.box img.lg{display:block;height:52px;width:auto;margin:0 auto 16px}
.box h1{font-size:19px;font-weight:700;text-align:center;color:var(--navy);margin-bottom:4px}
.box .sub{text-align:center;color:var(--dim);font-size:13px;margin-bottom:20px}
.box label{display:block;font-size:11.5px;font-weight:700;color:var(--dim);margin:14px 0 5px;
  text-transform:uppercase;letter-spacing:.04em}
.box input{width:100%;padding:11px 13px;border:1px solid var(--line2);border-radius:9px;
  font:inherit;color:var(--text);background:#fff}
.box input:focus{outline:2px solid var(--navy2);outline-offset:-1px;border-color:var(--navy)}
.box button{width:100%;margin-top:20px;padding:12px;border:0;border-radius:9px;background:var(--navy);
  color:#fff;font:inherit;font-weight:600;cursor:pointer}
.box button:hover{background:var(--navy2)}
.box .err{margin-top:16px;padding:10px 12px;border-radius:9px;background:var(--bad_bg);color:var(--bad);
  font-size:13px;border:1px solid #F0CFCA}
.box .note{margin-top:18px;font-size:11.5px;color:var(--dim2);text-align:center;line-height:1.45}

/* ---------------- таблицы-карточки в ящике подробностей ----------------
   Ящик узкий (560 px), обычная таблица в нём уезжала вправо.
   Те же правила, что и на телефоне, но действуют при любой ширине. */
.drawer .tbl .scroller{overflow-x:visible}
.drawer table.cards thead{display:none}
.drawer table.cards,.drawer table.cards tbody,.drawer table.cards tr,
.drawer table.cards td{display:block;width:100%}
.drawer table.cards tr{border-bottom:1px solid var(--line);padding:11px 13px;position:relative}
.drawer table.cards tr:last-child{border-bottom:0}
.drawer table.cards td{border:0;padding:2px 0;display:flex;gap:10px;align-items:baseline;
  justify-content:space-between;text-align:right}
.drawer table.cards td:before{content:attr(data-l);color:var(--dim);font-size:11.5px;
  text-transform:uppercase;letter-spacing:.04em;font-weight:650;text-align:left;
  flex:0 0 auto;max-width:52%}
.drawer table.cards td.hd{display:block;text-align:left;font-weight:700;font-size:14px;
  margin-bottom:5px}
.drawer table.cards td.hd:before{display:none}

/* ================================================================= КП
   Конструктор коммерческих предложений, светофор и реестр.
   Палитра и метрики — те же, что на остальных экранах. */
.kpform{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;
  background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:14px 15px}
.kpf{display:flex;flex-direction:column;gap:5px;min-width:0}
.kpf label{font-size:10.5px;font-weight:700;color:var(--dim);text-transform:uppercase;
  letter-spacing:.055em}
.kpf input,.kpf select{width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:9px;
  font:inherit;font-size:13.5px;color:var(--text);background:#fff;min-width:0}
.kpf input:focus,.kpf select:focus{outline:2px solid var(--navy2);outline-offset:-1px}
.kpf input[readonly]{background:var(--panel2);color:var(--dim)}
.kpf .hh{font-size:11px;color:var(--dim2);line-height:1.35}
.kpf.warn input{border-color:var(--warn);background:#FFFBF2}

.kpadd{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}
.kpadd .kpf{flex:0 1 190px}
.kpadd .kpf.q{flex:0 0 100px}

.lamps{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.lamp{display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:2px 9px 2px 7px;
  font-size:11.5px;font-weight:600;background:#EEF1F6;color:var(--dim);white-space:nowrap}
.lamp:before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 7px}
.lamp.ok{background:var(--ok_bg);color:var(--ok)}
.lamp.warn{background:var(--warn_bg);color:var(--warn)}
.lamp.bad{background:var(--bad_bg);color:var(--bad)}
.lamp.dim{background:#EEF1F6;color:var(--dim)}

.kpi.sm .v{font-size:19px}
.kprow td.nm b{display:block;font-size:13.5px}
.kprow td.nm i{font-style:normal;font-size:11.5px;color:var(--dim2);display:block}
td .pin{width:88px;padding:5px 7px;border:1px solid var(--line2);border-radius:7px;font:inherit;
  font-size:13px;text-align:right;color:var(--text);background:#fff;font-variant-numeric:tabular-nums}
td .pin.man{border-color:var(--gold);background:#FFFCF2;font-weight:700}
td .qin{width:66px;padding:5px 7px;border:1px solid var(--line2);border-radius:7px;font:inherit;
  font-size:13px;text-align:right;font-variant-numeric:tabular-nums;background:#fff;color:var(--text)}
.xbtn{background:none;border:0;color:var(--dim2);cursor:pointer;font-size:16px;line-height:1;padding:2px 5px}
.xbtn:hover{color:var(--bad)}
.kpacts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
.kpacts .sp{flex:1}
.saveind{font-size:12px;color:var(--dim)}
.modesw{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.modesw .tag{cursor:pointer}
@media(max-width:700px){
  .kpform{grid-template-columns:1fr}
  .kpadd .kpf{flex:1 1 100%}
  .kpadd .kpf.q{flex:1 1 100%}
  td .pin,td .qin{width:100px}
  .lamps{justify-content:flex-end}
}

/* ---- Этап 3: взыскание ---- */
.dzact{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.dzback{display:flex;gap:16px;font-size:13px;margin:0 0 12px}
.dzback a{text-decoration:none;font-weight:600}
.dzform{grid-template-columns:repeat(2,minmax(0,1fr))}
.dzform .dzfull{grid-column:1/-1}
.dzrow{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.dzrow>.kpf{flex:1 1 160px}
.dzrow.r{justify-content:flex-end;margin-top:4px}
.dzform textarea{width:100%;padding:8px 10px;border:1px solid var(--line2);border-radius:9px;
  font:inherit;font-size:13.5px;resize:vertical;min-height:56px}
.dzform .tags{margin:0}
input.dzterm{width:78px;padding:5px 8px;border:1px solid var(--line2);border-radius:8px;font:inherit;
  font-size:13px;text-align:right}
td .hint,.hint{font-size:11.5px;color:var(--dim);font-weight:400}
.feed{display:flex;flex-direction:column;gap:8px}
.feed .fi{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--line2);
  border-radius:11px;padding:10px 13px;position:relative}
.feed .fi.pr{border-left-color:var(--navy2)}.feed .fi.pr.broken{border-left-color:var(--bad)}
.feed .fi.pr.kept{border-left-color:var(--ok)}.feed .fi.pr.partial{border-left-color:var(--warn)}
.feed .ft{display:flex;gap:10px;flex-wrap:wrap;align-items:baseline;font-size:12px;color:var(--dim);padding-right:26px}
.feed .ft b{color:var(--navy);font-size:13px}
.feed .ft .xbtn{position:absolute;top:6px;right:8px}
.feed .fp{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:13.5px;margin-top:4px;font-weight:600}
.feed .fb{font-size:13.5px;margin-top:4px;white-space:pre-wrap}
.feed .fn{font-size:12.5px;margin-top:5px;color:var(--navy2);font-weight:600}
.feed .fn.done{color:var(--dim2);text-decoration:line-through}
.dzdupe{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:12px 15px;font-size:13.5px}
.dzdupe>div:first-child{flex:1 1 300px}
pre.dzpre{white-space:pre-wrap;background:var(--panel);border:1px solid var(--line);border-radius:11px;
  padding:12px 14px;font:13px/1.5 'Inter',sans-serif;margin-top:10px;max-width:460px}
@media(max-width:700px){.dzform{grid-template-columns:1fr}}
td .hint{white-space:normal;overflow-wrap:anywhere}

/* ======================================================= Этап 5: прайс */
.prinfo{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 18px}
.prinfo .ch{flex:1 1 250px;background:var(--panel);border:1px solid var(--line);border-radius:11px;
  padding:9px 13px;font-size:12.5px;color:var(--dim);line-height:1.45}
.prinfo .ch b{display:block;color:var(--navy);font-size:14px;margin-bottom:1px}
.prinfo .ch.gold{background:var(--gold_bg);border-color:#EADFBB;color:#5B4A12}
.prinfo .ch.gold b{color:var(--navy)}
.prsrch{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap;margin:0 0 10px}
.prsrch .srch{flex:1 1 420px;align-items:flex-start;border-color:var(--navy2)}
.prsrch .srch svg{margin-top:12px}
.prsrch textarea{border:0;outline:0;font:inherit;font-size:14px;line-height:1.4;padding:9px 0;background:none;
  width:100%;color:var(--text);resize:none;min-height:38px;max-height:180px;overflow-y:auto}
.prsrch .acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center;padding-top:4px}
.prmiss{margin:0 0 10px;border-color:#EFDDBC}
.prmiss .r:first-child{background:var(--warn_bg);color:var(--warn)}
.nospec{color:var(--dim2);cursor:help}
td .pill{margin-top:3px}
tr.open td{background:var(--panel2)}
tr.exp td.expd{background:var(--panel2);padding:10px 12px 14px;border-bottom:2px solid var(--line2)}
.prx{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;text-align:left}
.prx .bx{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:10px 12px;
  font-size:12.5px;min-width:0}
.prx .bx h4{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--dim);margin:0 0 6px;font-weight:700}
.prx .rows{border:0;border-radius:0}
.prx .rows .r{padding:6px 0;font-size:12.5px}
.prx .rows .r>span:last-child{white-space:normal}
@media(max-width:700px){
  .prsrch .srch{flex:1 1 100%}
  #t-prais>.hint{display:none}
  .prinfo{gap:7px;margin-bottom:14px}
  .prinfo .ch{padding:8px 11px;font-size:12px}
  table.cards tr.exp{padding:0 10px 12px;background:var(--panel2)}
  table.cards td.expd{display:block;text-align:left;padding:8px 0 0;border:0}
  table.cards td.expd:before{display:none}
  .prx{grid-template-columns:1fr}
  table.cards td.r .hint{text-align:right}
  table.cards td.hd .hint,.prx .hint{text-align:left}
}
@media(min-width:701px){td.prn .hint{white-space:nowrap}}
/* ---- Этап 6: «Фильтры» и «Потребность ERG» */
.ergtabs{margin:0 0 14px}
.prmodels{margin:0 0 10px;border-color:#D8E1EE}
.prmodels .r:first-child{background:var(--panel2);color:var(--navy)}
.fcard{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));max-width:calc(100vw - 400px);position:sticky;left:0}
body.nav-min .fcard{max-width:calc(100vw - 140px)}
@media(max-width:900px){.fcard{max-width:calc(100vw - 44px)}}
.fcard .fhist{grid-column:1/-1}
.fcard .msg{margin:8px 0 0;font-size:12.5px}
.hwrap{position:relative;margin:4px 0 6px}
.hchart{width:100%;height:auto;max-height:240px;display:block}
.hchart .g{stroke:var(--line);stroke-width:1}
.hchart .ax{fill:var(--dim);font-size:10.5px;font-family:inherit}
.hchart .pt{cursor:default}
.hchart .pt:hover circle,.hchart .pt:hover rect{filter:brightness(1.15)}
.hleg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--dim);margin-top:4px}
.hleg span{display:inline-flex;align-items:center;gap:6px}
.hleg i{display:inline-block;width:14px;height:3px;border-radius:2px}
.hleg i.dot{width:9px;height:9px;border-radius:50%}
.hleg i.sq{width:9px;height:9px;border-radius:2px}
table.ptot{width:100%;border-collapse:collapse;font-size:13px}
table.ptot th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--dim);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line)}
table.ptot td{padding:7px 10px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
table.ptot th.r,table.ptot td.r{text-align:right}
table.ptot tr.ent td{background:var(--panel2)}
table.ptot tr.sub td{color:var(--dim);font-size:12.5px}
table.ptot tr.tot td{border-top:2px solid var(--navy);font-weight:700;color:var(--navy)}
.kpi.gold{border-color:var(--gold);background:var(--gold_bg)}
@media(max-width:700px){
  .fcard{grid-template-columns:1fr}
  table.ptot tr.sub td:first-child{padding-left:0}
  .hchart{max-height:200px}
}
.fcard .apps .r>span.d{flex:0 0 150px;text-align:right;white-space:normal!important}
@media(max-width:700px){.fcard .apps .r>span.d{flex-basis:118px}}

/* Этап 5b: вкладка «ERG по договору» — 10 колонок, плотнее */
@media(min-width:701px){#t-prais-erg tbody td,#t-prais-erg thead th{padding-left:7px;padding-right:7px}
  #t-prais-erg thead th{white-space:normal;vertical-align:bottom;line-height:1.25}}
@media(max-width:700px){#t-prais-erg>.hint{display:none}}
table.ptot th.ref,table.ptot td.ref{color:var(--dim2);font-size:12px}
table.ptot tr.ext td{color:var(--dim2);font-size:12px}

/* ======================================================= Этап 8: замены */
.zchain{font-size:14px}
.zchain .zar{color:var(--dim2);font-weight:400}
.zchain b.zold{color:var(--bad);text-decoration:line-through;text-decoration-thickness:1px}
.zchain b.zact{color:var(--ok)}
.znums{display:flex;flex-direction:column;gap:4px;min-width:260px}
.zn{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.zn>b{min-width:66px;font-size:12.5px}
.pill.zb{background:#E7EEF9;color:var(--navy2)}
.pill.zs{background:var(--ok_bg);color:var(--ok)}
.pill.ze{background:var(--gold_bg);color:#7A5C0E}
.pill.zd{background:#EFE7F7;color:#5B3A87}
.prx .bx.zwide{grid-column:1/-1}
@media(max-width:700px){.znums{min-width:0}.zn{justify-content:flex-end}.zn>b{min-width:0}}
.pill.zdc{background:#E6F4F1;color:#0E6E5C}
/* v11: вкладки «Заказы и оплаты» */
.zextra{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-left:auto}
.zacts{display:inline-flex;gap:6px}
table.zsub{font-size:12.5px;width:100%}
table.zsub th,table.zsub td{padding:6px 8px;vertical-align:top}
table.zsub td .hint{white-space:normal}
@media(max-width:700px){.zextra{margin-left:0;width:100%}.zextra select{flex:1;min-width:0}}

/* v12 «Доходы»: фильтры в строку на 390 px — выпадающие списки и даты не схлопываются */
@media(max-width:700px){.zextra select{flex:1 1 45%}.zextra input[type=date]{flex:1 1 40%;min-width:0}}
/* v13: Расходы · Прибыль · Деньги */
table.fpivot tr.grp td{background:var(--panel2);font-weight:650}
table.fpivot tr.sub td{color:var(--dim);font-size:12.5px}
table.fpivot tr.sub td.hd{padding-left:22px}
table.fpivot tr.un td{background:var(--warn_bg)}
table.fpivot td.r a{color:inherit;text-decoration:none;border-bottom:1px dotted var(--dim2)}
table.fpivot td.r a:hover{color:var(--navy2)}
table.fpivot th:first-child,table.fpivot td.hd{position:sticky;left:0;background:var(--panel);z-index:1;min-width:220px}
table.fpivot tr.grp td.hd{background:var(--panel2)}
table.fpivot tr.un td.hd{background:var(--warn_bg)}
.bar .ergtabs{margin:0 10px 6px 0}
@media(max-width:700px){
  table.fpivot th:first-child,table.fpivot td.hd{position:static;min-width:0}
  table.fpivot tr.sub td.hd{padding-left:0}
}

/* ---------- v14: «Главная» ---------- */
.gfresh{display:flex;flex-wrap:wrap;gap:7px 8px}
.gfresh>a{text-decoration:none;color:inherit}
.gch{display:inline-flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--line);border-radius:999px;
  padding:5px 11px;font-size:12.5px;color:var(--dim);line-height:1.35}
.gch b{color:var(--text);font-weight:650}
.gch i{width:7px;height:7px;border-radius:50%;background:var(--dim2);flex:0 0 7px}
.gch.ok i{background:var(--ok)}
.gch.warn{background:var(--warn_bg);border-color:#EFDDBC;color:var(--warn)}
.gch.warn i{background:var(--warn)}
.gfresh>a:hover .gch{border-color:var(--navy2)}
a.glk{color:inherit;text-decoration:none}
a.glk:hover b,a.glk:hover .gv{color:var(--navy2);text-decoration:underline;text-underline-offset:3px}
.gv{font-size:16px;font-weight:750;letter-spacing:-.01em}
.gv.neg{color:var(--bad)}
.gd{font-size:12px;color:var(--dim)}
.gd.up b{color:var(--ok)}.gd.dn b{color:var(--bad)}.gd.na{color:var(--dim2)}
.gch2{font-size:11.5px;color:var(--dim);white-space:nowrap;margin-top:2px}
.gch2 .pill{font-size:11px}
table.gpnl{table-layout:fixed;width:100%}
table.gpnl th:first-child,table.gpnl td:first-child{width:150px}
table.gpnl td{vertical-align:top;padding-top:10px;padding-bottom:10px;overflow-wrap:anywhere}
.gnm{max-width:360px}
table.gpnl td.hd .pill{margin-top:4px}
.gsub{margin-top:14px}
.gsub>h3{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--dim);margin:0 0 7px;font-weight:700}
th.ghl,td.ghl{background:var(--gold_bg)!important}
@media(max-width:700px){
  .gch{font-size:12px;padding:4px 9px}
  .gd,.gch2{white-space:normal}
  table.gpnl{table-layout:auto}
  table.gpnl th:first-child,table.gpnl td:first-child{width:auto}
  table.gpnl td.r{flex-direction:column;align-items:flex-end;text-align:right;gap:1px;padding:6px 0}
  table.gpnl td.r:before{align-self:flex-start;max-width:100%}
}

/* v16: ссылка «Попробовать новый интерфейс» в шапке (новый интерфейс — /v2, тестовая версия) */
.topbar .v2link{display:inline-flex;align-items:center;gap:6px;margin-right:10px;padding:6px 12px;border-radius:9px;
  border:1.5px solid #B28D25;color:#0C284F;background:#FBF6E7;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.topbar .v2link:hover{background:#B28D25;color:#1E1700}
@media(max-width:560px){.topbar .v2link{padding:5px 8px;font-size:12px;margin-right:6px}}