:root { /* палитра Инвард-А: графит и янтарь (логотип: #6D6E70, #FCB81A, тёмный #1C252C) */
  --bg:#f2f2f3; --card:#fff; --line:#d9dadc; --text:#1c252c; --muted:#6d6e70; --acc:#1c252c; --acc2:#e6e7e9; --yel:#fcb81a; --yel2:#e3a21a;
  --warn:#b4530c; --bad:#b00020; --ok:#2e7d32; }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.4 "Segoe UI", Arial, sans-serif; color:var(--text); background:var(--bg); }
.top { display:flex; justify-content:space-between; align-items:center; padding:8px 18px; background:#fff; color:var(--text); border-bottom:3px solid var(--yel); position:sticky; top:0; z-index:5; }
.brand { display:flex; align-items:center; gap:14px; }
.brand .logo { height:38px; width:auto; display:block; }
.brand-sep { width:1px; height:30px; background:var(--line); }
.brand-title { font-size:17px; font-weight:600; }
.top-actions { display:flex; align-items:center; gap:8px; }
.pill { font-size:12px; color:#8a6400; background:#fff3d6; border:1px solid #f1d591; border-radius:6px; padding:6px 10px; white-space:nowrap; }
.layout { display:grid; grid-template-columns: minmax(0,1fr) 380px; gap:16px; padding:16px 18px; align-items:start; }
@media (max-width:1100px){ .layout{ grid-template-columns:1fr; } }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:14px 16px; margin-bottom:14px; }
.sticky { position:sticky; top:12px; }
h2 { margin:0 0 10px; font-size:16px; }
h3 { margin:0; font-size:15px; }
h4 { margin:14px 0 6px; font-size:13px; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; border-left:3px solid var(--yel); padding-left:8px; }
label { display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--muted); }
input, select, textarea { font:inherit; color:var(--text); border:1px solid var(--line); border-radius:5px; padding:5px 7px; background:#fff; min-width:0; }
#head input { font-weight:600; }
#head input::placeholder { font-weight:400; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--yel2); box-shadow:0 0 0 2px rgba(252,184,26,.25); }
input.short { width:110px; }
textarea { resize:vertical; }
.grid4 { display:grid; grid-template-columns:2fr 1fr 2fr 1fr; gap:10px; margin-bottom:8px; }
.extra-tags { display:grid; grid-template-columns:1.6fr 1.2fr 3.8fr; column-gap:10px; row-gap:5px; margin:-3px 0 8px; }
.extra-tags input { font-size:12px; }   /* как у полей в подписях (label — 12px) */
.extra-tags:empty { display:none; }
.grid5 { display:grid; grid-template-columns:1.6fr 1.2fr 2fr 1fr 0.8fr; gap:10px; margin-bottom:8px; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:8px; }
.head-cols { display:flex; flex-wrap:wrap; gap:10px 24px; align-items:flex-start; }
.head-left { flex:1 1 360px; min-width:0; max-width:640px; }
.head-right { flex:0 0 auto; margin-left:auto; }
.grid3 { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,0.8fr) minmax(0,1fr); gap:10px; margin-bottom:8px; }
.head-left .grid2 { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.head-left input { width:100%; }
.head-right { display:flex; flex-direction:column; gap:8px; }
.head-right-row { display:flex; gap:10px; justify-content:flex-end; align-items:flex-end; }
.head-right-row select { min-width:200px; }
.head-right > label input { width:120px; }
.rates { display:grid; grid-template-columns: auto 105px 85px 85px auto; gap:6px 8px; align-items:end; }
.rates-title { font-size:13px; color:var(--text); padding-bottom:6px; white-space:nowrap; }
.rates label { font-size:11px; }
.rates input.short { width:100%; }
.rates button { justify-self:start; margin-bottom:1px; }
.muted { color:var(--muted); }
button { font:inherit; border-radius:5px; border:1px solid var(--yel2); background:var(--yel); color:var(--text); padding:7px 14px; cursor:pointer; font-weight:600; }
button:hover { background:var(--yel2); }
button.ghost { background:#fff; color:var(--text); border-color:#b9bcc0; font-weight:400; }
button.ghost:hover { background:#f3f4f5; }
.top button.ghost { background:#f3f4f5; color:var(--text); border-color:#e3e4e6; }
.top button.ghost:hover { background:#e8e9eb; }
button.small { padding:4px 9px; font-size:12px; }
button.primary { font-weight:600; }
button:disabled { opacity:.5; cursor:default; }
.pos-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.pos-tools { display:flex; gap:6px; }
.code-line { background:var(--acc2); border-left:4px solid var(--yel); border-radius:6px; padding:6px 10px; margin:6px 0 10px; font-size:14px; word-break:break-word; display:flex; gap:8px; align-items:center; }
.code-line .f-code { flex:1; }
.price3 { border-collapse:collapse; white-space:nowrap; align-self:center; }
.price3 th { font-size:11px; font-weight:400; color:var(--muted); padding:0 10px 2px; text-align:center; border-bottom:1px solid #c9cbcf; }
.price3 td { font-size:14px; font-weight:700; color:var(--text); padding:3px 10px 0; text-align:center; }
.pos-cols { display:grid; grid-template-columns: minmax(300px, 420px) minmax(0,1fr); gap:10px 22px; align-items:stretch; }
@media (max-width:1300px){ .pos-cols{ grid-template-columns:1fr; } }
.opts { display:flex; flex-direction:column; gap:4px; }
.opts label { display:grid; grid-template-columns: 150px minmax(0,1fr) 110px; align-items:center; gap:8px; }
.opts input.opt-price { padding:3px 6px; text-align:right; }
.opts input.opt-price.manual { border-color:var(--yel2); background:#fff8e6; }
.opts label span.lbl { font-size:12px; color:var(--muted); line-height:1.2; }
.opts select { width:100%; padding:3px 6px; }
.pos-cols { grid-template-columns: minmax(442px, 722px) minmax(0,1fr); }   /* в списке опций видна цена; поле уже на 1 см (31.10.2026) */
.pos-right h4, .pos-left h4 { margin-top:0; }
.pos-right { padding-left:40px; border-left:1px solid var(--line); display:flex; flex-direction:column; }
.pos-right .kit { flex:0 0 auto; }
.pos-notes { margin-top:auto; padding-top:14px; margin-bottom:0; }
.pos-notes label b { font-weight:700; color:inherit; }
.pos-notes textarea { font-weight:400; min-height:64px; }
.pos-cols { border-top:1px solid var(--line); padding-top:10px; }
.kit-row .kit-lbl { order:-2; }
.kit-row button { order:-1; }
.fl-hint { font-size:12px; margin-bottom:8px; }
.kit-row { flex-wrap:wrap; }
.opts label.missing select { color:var(--bad); }
.opts select option { color:var(--text); }
.opts label span.pr { color:var(--muted); font-size:11px; }
.k-line { flex-direction:row; align-items:center; gap:8px; margin-top:10px; }
.kit-row { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:4px; }
.kit-row select, .kit-row input { padding:3px 6px; }
.kit-row button.small { padding:3px 9px; }
.kit-lbl { width:135px; flex:0 0 135px; font-size:12px; color:var(--muted); }
.kit-row select { max-width:260px; }
.kit-row input.cu-name { flex:1 1 220px; min-width:160px; }
.kit-row input.kprice { width:110px; margin-left:auto; }   /* цена и количество — в один столбец справа, как у «Прочее» */
.kit-row input.kqty { width:62px; }
.kit-row { flex-wrap:wrap; }
.kit-row select { flex:0 1 auto; min-width:80px; max-width:200px; }
.kit-row input.cu-name { flex:1 1 120px; min-width:120px; }
.kit-added { margin-top:34px; font-size:12px; color:var(--muted); }
.kit-table { width:100%; border-collapse:collapse; margin-top:4px; font-size:13px; }
.kit-table td { border-top:1px solid var(--line); padding:4px 6px; vertical-align:top; }
.kit-table td.num { text-align:right; white-space:nowrap; }
.kit-table button { margin-left:6px; }
.price-box { margin-top:10px; font-size:12px; line-height:1.5; }
.summary { font-size:13px; }
.summary table { width:100%; border-collapse:collapse; margin-bottom:8px; }
.summary td { padding:3px 4px; border-top:1px solid var(--line); vertical-align:top; }
.summary td.num { text-align:right; white-space:nowrap; }
.summary .total { font-size:15px; font-weight:700; color:var(--text); }
.summary tr:has(.total) td { border-top:2px solid var(--yel); }
.problems { color:var(--bad); font-size:12px; white-space:pre-line; margin:6px 0; }
.actions { display:flex; gap:8px; margin:10px 0; }
.result { font-size:13px; }
.result a { color:#8a6400; cursor:pointer; text-decoration:underline; display:block; margin:3px 0; }
.result .ok { color:var(--ok); font-weight:600; }
.result .err { color:var(--bad); white-space:pre-wrap; }
.modal { position:fixed; inset:0; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; z-index:10; }
.modal.hidden { display:none; }
.modal-box { background:#fff; border-radius:8px; width:min(820px, 92vw); max-height:80vh; overflow:auto; padding:14px 16px; }
.modal-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.modal-body table { width:100%; border-collapse:collapse; font-size:13px; }
.modal-body td { border-top:1px solid var(--line); padding:5px 6px; }
#btn-add { margin-bottom:30px; }
/* единая высота полей: опции расходомера и строки комплектующих */
.opts select, .opts input.opt-price, .kit-row select, .kit-row input, .kit-row button.small { height:28px; padding-top:0; padding-bottom:0; font-size:13px; line-height:26px; }
/* подписи полей жирнее, подсказки-примеры бледнее (руководитель 31.10.2026) */
label { font-weight:600; color:var(--text); }
label input, label select, label textarea { font-weight:400; }
.opts label span.lbl, .kit-lbl { font-weight:600; color:var(--text); }
.pos-notes label b { font-weight:700; }
input::placeholder, textarea::placeholder { color:#b5b8bc; font-weight:400; opacity:1; }
/* комплектующие — сетка с фиксированными столбцами, поля не съезжают при сужении окна (руководитель 31.10.2026):
   подпись | Добавить | стандарт | PN | DN | материал | поверхность | цена | кол-во */
.kit { overflow-x:auto; }
.kit-row { display:grid; grid-template-columns:135px 78px 150px 80px 90px 110px 170px 110px 62px; gap:6px; align-items:center; min-width:1040px; }
.kit-row .kit-lbl { grid-column:1; width:auto; flex:none; }
.kit-row button.small { grid-column:2; }
.kit-row select, .kit-row input { width:100%; max-width:none; min-width:0; margin:0; }
.kit-row .g-code, .kit-row .cu-name { grid-column:3 / 8; }
.kit-row .th-dn { grid-column:3; } .kit-row .th-heat { grid-column:4 / 8; }
.kit-row .fl-std, .kit-row .sp-std { grid-column:3; } .kit-row .fl-p, .kit-row .sp-p { grid-column:4; }
.kit-row .fl-dn, .kit-row .sp-dn { grid-column:5; } .kit-row .fl-mat, .kit-row .sp-mat { grid-column:6; } .kit-row .fl-face { grid-column:7; }
.kit-row input.kprice { grid-column:8; } .kit-row input.kqty { grid-column:9; }
/* порог одной колонки: опции над комплектующими, пока окну не хватает места на оба блока рядом */
@media (max-width:2000px){ .pos-cols{ grid-template-columns:1fr; } .pos-left{ max-width:722px; } .pos-right{ padding-left:0; border-left:0; border-top:1px solid var(--line); padding-top:12px; margin-top:10px; } }

/* рабочая зона на всю ширину; «Итог» — полоса в шапке + выдвижная панель справа (руководитель 31.10.2026) */
.layout { grid-template-columns:minmax(0,1fr); }
.top { gap:16px; }
.topbar { display:flex; align-items:center; gap:14px; flex:1 1 auto; justify-content:center; min-width:0; flex-wrap:wrap; }
.tb-item { display:flex; align-items:baseline; gap:6px; white-space:nowrap; }
.tb-lbl { font-size:12px; color:var(--muted); }
#tb-total { font-size:16px; }
.tb-warn { color:var(--bad); font-size:12px; }
.tb-warn:empty { display:none; }
.topbar button.small { padding:5px 11px; font-size:13px; }
.drawer { position:fixed; top:0; right:0; bottom:0; width:min(440px, 96vw); background:var(--bg); box-shadow:-6px 0 18px rgba(0,0,0,.18); transform:translateX(100%); transition:transform .2s ease; z-index:20; overflow:auto; padding:14px; }
.drawer.open { transform:none; }
.drawer-card { margin:0; }
.drawer-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.drawer-head h2 { margin:0; }
.drawer-bg { position:fixed; inset:0; background:rgba(0,0,0,.25); z-index:19; }
.drawer-bg.hidden { display:none; }
@media (max-width:2000px){ .pos-cols{ grid-template-columns:minmax(442px, 722px) minmax(0,1fr); } .pos-left{ max-width:none; } .pos-right{ padding-left:40px; border-left:1px solid var(--line); border-top:0; padding-top:0; margin-top:0; } }
@media (max-width:1500px){ .pos-cols{ grid-template-columns:1fr; } .pos-left{ max-width:722px; } .pos-right{ padding-left:0; border-left:0; border-top:1px solid var(--line); padding-top:12px; margin-top:10px; } }

/* заголовок «ТКП» в карточке шапки убран — экономия места (руководитель 01.11.2026); номер ТКП остаётся в заголовке вкладки */
#head-title { display:none; }

/* кнопки сборки/сохранения — только в шапке, из панели «Итог» убраны (руководитель 01.11.2026) */
.drawer .actions { display:none; }

/* серверный режим: имя пользователя и «выйти» в шапке */
.pill.user { background:#f3f4f5; border-color:#e3e4e6; color:var(--text); }
.pill.user a { color:#8a6400; }
/* узкое окно (< 1100 px): кнопки шапки второй строкой, без ломаной сетки (проверка сайта 01.11.2026) */
.top button, .pill { white-space:nowrap; }
@media (max-width:1100px){
  .top { flex-wrap:wrap; row-gap:6px; }
  .brand { order:1; } .top-actions { order:2; margin-left:auto; }
  .topbar { order:3; flex-basis:100%; justify-content:flex-start; }
}
