/* Система колл-центра — стили калькулятора из макета ред. 10 (14.10.2026) на каркасе. Типографика на ступень легче — как в макете КЦ
   (решение владельца 18.09: «меньше и тоньше, лаконичнее»). Вход — в конце файла. */
:root{--fs-base:13.5px;--fs-row:14px;--paper:#FFFFFF;--paper-ink:#1B1D1F;--paper-ink-2:#55595E;--paper-line:#E2DFD6;--paper-soft:#F6F5F0}
.cap,.lbl,th,.ch .t{font-weight:600;letter-spacing:.8px}
.pill{font-weight:600;letter-spacing:0}
.btn,.seg button,.mi,.acc{font-weight:500} .btn.pri{font-weight:600}
.big{font-weight:700;letter-spacing:-.8px} .ch .m b{font-weight:500} .sysname{font-weight:700}
body{background:var(--bg);color:var(--ink)}
#hdr{display:contents}
.tabbar{position:sticky;top:var(--h-hdr);z-index:calc(var(--z-sticky) - 1);display:flex;align-items:center;gap:14px;padding:0 var(--pad-page);background:var(--panel);border-bottom:1px solid var(--line);min-height:46px}
.tabbar .tabs{border-bottom:0;flex:1;overflow-x:auto;scrollbar-width:none;gap:16px}
.tabbar .tabs::-webkit-scrollbar{display:none}
.tabbar .tabs a{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;padding:10px 4px}
.tabbar .right{display:flex;align-items:center;gap:8px;flex:none}
.tabbar .right .note{white-space:nowrap}
.ctx{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;color:var(--ink-2);font-size:var(--fs-note)}
.ctx b{color:var(--ink);font-weight:600}
.kgrid{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:var(--gap-cards);align-items:start}
.kgrid>.col{display:flex;flex-direction:column;gap:var(--gap-cards);min-width:0}
.kgrid>.res{position:sticky;top:calc(var(--h-hdr) + 62px)}
.fgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.fgrid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.fl{display:flex;flex-direction:column;gap:6px;min-width:0}
.fl>.lbl{font-size:var(--fs-cap);text-transform:uppercase;color:var(--ink-2)}
.seg.wrap{flex-wrap:wrap;height:auto}
.seg.wrap button{flex:1 1 auto}
.stack-12{display:flex;flex-direction:column;gap:14px}
.step{width:max-content;display:inline-flex;align-items:center;border:1px solid var(--line-2);border-radius:var(--r-ctl);overflow:hidden;height:var(--h-ctl)}
.step button{width:40px;height:100%;border:0;background:var(--panel-2);color:var(--ink);font-size:18px;cursor:pointer}
.step button:hover{background:var(--panel-3)}
.step output{min-width:44px;text-align:center;font-weight:600;font-size:15px}
.chk{display:flex;align-items:center;gap:10px;min-height:36px;cursor:pointer}
.chk input{width:18px;height:18px;accent-color:var(--brand)}
.chk .note{margin-left:auto;text-align:right}
.lines{width:100%;border-collapse:collapse;font-size:var(--fs-base)}
.lines td{padding:9px 0;border-bottom:1px solid var(--line);vertical-align:top}
.lines td.r{text-align:right;white-space:nowrap;padding-left:12px;font-variant-numeric:tabular-nums}
.lines td .note{display:block;margin-top:2px}
.lines tr.tot td{border-bottom:0;padding-top:12px;font-weight:700;font-size:16px}
.lines tr.off td{color:var(--ink-3)}
.sep{border-top:1px dashed var(--line-2);margin:4px 0}
.inner{padding:10px 12px;border-radius:var(--r-ctl);background:var(--panel-2);border:1px solid var(--line);font-size:var(--fs-note);color:var(--ink-2);display:flex;flex-direction:column;gap:4px}
.inner b{color:var(--ink);font-weight:600}
.ro .inp,.ro .seg button,.ro .step button,.ro .chk input{pointer-events:none;opacity:.72}
.banner{padding:12px 14px;border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--blue-soft);color:var(--ink);font-size:var(--fs-note)}
.banner b{font-weight:600}
.zone-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:-1px}
.mnote{margin:0 var(--pad-page) 18px;padding:12px 14px;border:1px dashed var(--line-2);border-radius:var(--r-card);color:var(--ink-2);font-size:var(--fs-note);max-width:1600px}
.mnote b{color:var(--ink)}
.acts.wide{display:flex;gap:8px;flex-wrap:wrap}
.acts.wide .btn{flex:1 1 0;min-width:120px}
.flag{display:inline-block;padding:1px 7px;border-radius:999px;background:var(--amber-soft);color:var(--amber);font-size:11.5px;font-weight:600;white-space:nowrap}
td.num,.num{font-variant-numeric:tabular-nums}
.rowlink{cursor:pointer} .rowlink:hover td{background:var(--panel-2)}
.loglist td{vertical-align:top}
textarea.inp{min-height:84px;padding:10px 12px;resize:vertical;line-height:1.45}
/* ── картинка-расчёт клиенту (утверждена владельцем 14.10 13:23, эталон kp-kartinka/kp-obrazec-v7.html): 540 css px → PNG 1080 ──
   стили эталона с приставкой kpi-, чтобы не пересекаться с каркасом; цвета брендов — свои, одинаковые в обоих режимах */
.kpi{width:100%;max-width:540px;font-family:"Golos Text","Segoe UI",sans-serif;font-size:14px;line-height:1.36;color:var(--k-ink);background:var(--k-bg);box-shadow:var(--shadow);border-radius:4px;overflow:hidden}
.kpi *{box-sizing:border-box;margin:0;padding:0;color:inherit}
.kpi .kpi-card{padding:22px 26px 18px}
.kpi .kpi-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:16px}
.kpi .kpi-top img{display:block;max-width:60%}
.kpi .kpi-t{text-align:right} .kpi .kpi-t b{display:block;font-size:17px;font-weight:800} .kpi .kpi-t span{font-size:12px;color:var(--k-mut)}
.kpi .kpi-src{margin-top:14px;font-size:13.5px;color:var(--k-mut)} .kpi .kpi-src b{color:var(--k-ink);font-weight:600}
.kpi .kpi-main{margin-top:12px;padding:11px 14px;display:flex;justify-content:space-between;align-items:baseline;font-size:15px}
.kpi .kpi-main b{font-weight:600;white-space:nowrap}
.kpi h3{font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin:16px 0 6px}
.kpi h3 em{font-style:normal;color:var(--k-acc)}
.kpi .kpi-in li{list-style:none;display:flex;gap:9px;padding:3px 0}
.kpi .kpi-in li:before{content:"✓";flex:0 0 18px;height:18px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;margin-top:1px}
.kpi .kpi-in b{font-weight:600}
.kpi .kpi-gift{display:inline-block;font-style:normal;font-size:10px;font-weight:800;letter-spacing:.08em;padding:1px 6px;margin-left:4px;vertical-align:1px}
.kpi .kpi-r{display:flex;justify-content:space-between;gap:14px;padding:5px 0;border-bottom:1px dashed var(--k-line)} .kpi .kpi-r:last-child{border-bottom:0}
.kpi .kpi-r b{font-weight:600;white-space:nowrap}
.kpi .kpi-promo{margin-top:14px;padding:11px 15px} .kpi .kpi-promo b{font-weight:800}
.kpi .kpi-firma{display:block;font-size:12px;color:var(--k-mut);margin-top:1px}
.kpi .kpi-sys li{list-style:none;display:flex;gap:12px;padding:3px 0} .kpi .kpi-sys li em{font-style:normal;font-weight:800;flex:0 0 22px;color:var(--k-acc)}
.kpi .kpi-foot{margin-top:16px;font-size:11px;color:var(--k-mut);line-height:1.4}
.kpi.b-pervye{--k-ink:#15171A;--k-mut:#6E727A;--k-line:#E4E4E1;--k-bg:#F7F7F5;--k-acc:#FF7A1A}
.kpi.b-pervye .kpi-top{border-bottom:3px solid var(--k-acc)} .kpi.b-pervye .kpi-main{background:#fff;border:1px solid var(--k-line);border-radius:6px}
.kpi.b-pervye .kpi-in li:before{border-radius:50%;background:var(--k-acc);color:#fff} .kpi.b-pervye .kpi-gift{background:var(--k-acc);color:#fff;border-radius:3px}
.kpi.b-pervye .kpi-promo{border:2px solid var(--k-acc);border-radius:6px}
.kpi.b-oneon{--k-ink:#2A2A2A;--k-mut:#77777A;--k-line:#DADADA;--k-bg:#FFFFFF;--k-acc:#FB0606}
.kpi.b-oneon .kpi-card{margin:14px;border:1.5px solid #4A4A4A;padding:20px 22px 16px} .kpi.b-oneon .kpi-top{border-bottom:1px solid var(--k-ink)}
.kpi.b-oneon .kpi-t b{font-weight:400;letter-spacing:.14em;text-transform:uppercase;font-size:13px} .kpi.b-oneon h3{font-weight:400;letter-spacing:.24em;font-size:11px}
.kpi.b-oneon .kpi-main{border:1.5px solid var(--k-ink)} .kpi.b-oneon .kpi-in li:before{border:1.5px solid var(--k-ink);color:var(--k-acc)}
.kpi.b-oneon .kpi-gift{color:var(--k-acc);border:1px solid var(--k-acc);font-weight:400;letter-spacing:.14em}
.kpi.b-oneon .kpi-promo{border-left:3px solid var(--k-acc);background:#F6F6F6} .kpi.b-oneon .kpi-sys li em{font-weight:400}
.kpi.b-evi{--k-ink:#1E2A3A;--k-mut:#6B7686;--k-line:#DCE3EC;--k-bg:#FFFFFF;--k-acc:#336099}
.kpi.b-evi .kpi-top{border-bottom:2px solid var(--k-acc)} .kpi.b-evi .kpi-t b{color:var(--k-acc)} .kpi.b-evi h3{color:var(--k-acc)} .kpi.b-evi h3 em{color:#EF8152}
.kpi.b-evi .kpi-main{background:#EEF3F9;border-radius:12px;color:var(--k-acc)} .kpi.b-evi .kpi-in li:before{border-radius:50%;border:1.5px solid var(--k-acc);color:var(--k-acc)}
.kpi.b-evi .kpi-gift{background:#EF8152;color:#fff;border-radius:10px} .kpi.b-evi .kpi-promo{background:#FDEFE8;border-radius:12px;color:#8A3E1F} .kpi.b-evi .kpi-sys li em{color:#EF8152}
.kpi.b-boyard{--k-ink:#1B1B1B;--k-mut:#6A6A6A;--k-line:#E2E2E2;--k-bg:#FFFFFF;--k-acc:#D3202E}
.kpi.b-boyard .kpi-top{border-bottom:6px solid var(--k-acc)} .kpi.b-boyard .kpi-t b{text-transform:uppercase;font-size:16px} .kpi.b-boyard h3{font-size:13px;letter-spacing:.06em}
.kpi.b-boyard .kpi-main{background:#1B1B1B;color:#fff;font-size:16px} .kpi.b-boyard .kpi-in li:before{background:var(--k-acc);color:#fff}
.kpi.b-boyard .kpi-gift{background:var(--k-acc);color:#fff} .kpi.b-boyard .kpi-promo{background:var(--k-acc);color:#fff}
.kpi .kpi-in li:before{color:#fff}
.kpi.b-oneon .kpi-in li:before{color:var(--k-acc)} .kpi.b-evi .kpi-in li:before{color:var(--k-acc)}
/* ── коммерческое предложение: лист бумаги, одинаковый в обоих режимах ── */
.kpwrap{display:flex;flex-direction:column;align-items:center;gap:16px}
.kpbar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;width:100%;max-width:794px}
.paper{width:100%;max-width:794px;background:var(--paper);color:var(--paper-ink);border-radius:6px;box-shadow:var(--shadow);padding:44px 48px 36px;font-size:13.5px;line-height:1.5;--acc:#FF7A1A;--acc-text:#AD4A08;--acc-soft:#FFF1E6}
.paper h1{font-size:23px;line-height:1.2;font-weight:700;margin:0;letter-spacing:-.3px;text-wrap:balance}
.paper h2{font-size:11.5px;text-transform:uppercase;letter-spacing:1.2px;color:var(--acc-text);margin:26px 0 8px;font-weight:700}
.paper .ph{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:3px solid var(--acc)}
.paper .logo{display:flex;align-items:center;gap:12px;min-width:0}
.paper .logo img,.paper .logo svg{height:46px;width:auto;max-width:200px}
.paper .logo .wm{font-size:20px;font-weight:700;letter-spacing:-.2px;color:var(--paper-ink)}
.paper .logo .wm b{color:var(--acc)}
.paper .pm{text-align:right;color:var(--paper-ink-2);font-size:12px;line-height:1.55}
.paper .pm b{color:var(--paper-ink)}
.paper .sub{color:var(--paper-ink-2);margin-top:6px}
.paper .kv2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 24px}
.paper .kv2 div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--paper-line);padding:5px 0}
.paper .kv2 span{color:var(--paper-ink-2)}
.paper table{width:100%;border-collapse:collapse}
.paper td,.paper b,.paper li,.paper div,.paper span{color:inherit}
.paper .logo img.mam{height:40px;max-width:60px}
.paper td{color:var(--paper-ink);padding:9px 0;border-bottom:1px solid var(--paper-line);vertical-align:top}
.paper td.r{text-align:right;white-space:nowrap;padding-left:16px;font-variant-numeric:tabular-nums;font-weight:600}
.paper td small{display:block;color:var(--paper-ink-2);font-size:12px}
.paper tr.tot td{border-bottom:0;border-top:2px solid var(--paper-ink);font-size:17px;font-weight:700;padding-top:12px}
.paper .box{background:var(--acc-soft);border-radius:6px;padding:12px 14px}
.paper ul{margin:0;padding-left:18px} .paper li{margin:3px 0}
.paper ol{margin:0;padding-left:20px} .paper ol li{margin:4px 0}
.paper .promo{border:1.5px dashed var(--acc);border-radius:6px;padding:12px 14px}
.paper .promo .ph-flag{display:inline-block;font-size:11px;font-weight:700;color:#8A6410;background:#FFF4D6;border-radius:999px;padding:1px 8px;margin-bottom:6px}
.paper .pf{margin-top:26px;padding-top:12px;border-top:1px solid var(--paper-line);color:var(--paper-ink-2);font-size:11.5px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (max-width:1100px){.kgrid{grid-template-columns:minmax(0,1fr)}.kgrid>.res{position:static}}
@media (max-width:700px){
  .tabbar{flex-wrap:wrap;gap:4px 8px;padding-bottom:6px}.tabbar .tabs{flex:1 1 100%}.tabbar .right{flex:1 1 100%;justify-content:space-between}
  .fgrid,.fgrid.two,.g2{grid-template-columns:minmax(0,1fr)}
  .card{min-width:0} .g2>*,.main>*{min-width:0;max-width:100%} .band .sub{grid-template-columns:minmax(0,1fr)}
  .seg{flex-wrap:wrap;height:auto;max-width:100%} .seg button{flex:1 1 auto}
  .tabbar .right .note{display:none}
  .kpbar .acts{width:100%}
  .paper{padding:24px 18px;font-size:12.5px}.paper .ph{flex-direction:column;align-items:flex-start}.paper .pm{text-align:left}
  .paper .kv2{grid-template-columns:minmax(0,1fr)}
  .mnote{margin:0 16px 16px}
}
/* ── система КЦ: регламенты (разметка документа — как в техотделе) ── */
.reglistwrap{display:flex;flex-direction:column}
.regitem{border-bottom:1px solid var(--line)} .regitem:last-child{border-bottom:0}
.regtop{all:unset;box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 2px;cursor:pointer;font-size:var(--fs-row)}
.regtop:hover{color:var(--brand-word)} .regtop:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.regitem.open{padding-bottom:16px}
.regbody{margin-top:4px;padding:16px 18px;background:var(--panel-2);border-radius:var(--r-card);line-height:1.55;font-size:var(--fs-base)}
.regbody .regh1{font-size:17px;font-weight:700;margin:4px 0 10px} .regbody .regh2{font-size:15px;font-weight:600;margin:16px 0 8px}
.regbody .regp{margin:0 0 9px;color:var(--ink-2)} .regbody .regp b,.regbody li b{color:var(--ink)}
.regbody .reglist{margin:0 0 10px 18px;color:var(--ink-2);padding:0} .regbody .reglist li{margin-bottom:5px}
.regbody .regnote{border-left:3px solid var(--brand);background:var(--panel);padding:10px 13px;margin:0 0 10px;border-radius:0 6px 6px 0}
.regbody .regsep{height:1px;background:var(--line);margin:14px 0}
.regbody table{font-size:12.5px;width:100%;border-collapse:collapse} .regbody td,.regbody th{border-bottom:1px solid var(--line);padding:6px 8px;text-align:left;vertical-align:top}
@media (max-width:700px){.regtop{flex-direction:column;align-items:flex-start}.regbody{padding:12px}}
/* ── система КЦ: вход ── */
.tabbar[hidden]{display:none}
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--pad-page)}
.login .box{width:100%;max-width:380px;display:flex;flex-direction:column;gap:14px}
.login .head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.login .err{color:var(--bad, #C0392B);min-height:1.2em}
