:root { --bg:#f6f7f9; --card:#fff; --line:#e3e6ea; --text:#1d2330; --muted:#6b7280; --accent:#2f5496; --accent2:#1f7a4d;
  --deficit:#ffe3e6; --novelty:#fff3c4; --mixed:#dbe9f8; --cachebad:#f3e8ff; --danger:#b3261e; }
* { box-sizing:border-box; }
body { margin:0; font:14px/1.4 -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--text); background:var(--bg); }
a { color:var(--accent); text-decoration:none; } a:hover { text-decoration:underline; }
/* верхняя полоса: разделы */
header.topbar { display:flex; align-items:center; gap:18px; padding:0 20px; height:46px; background:#1f2a3d; color:#fff; position:sticky; top:0; z-index:6; }
header.topbar .brand { font-weight:700; font-size:15px; color:#fff; margin-right:4px; white-space:nowrap; }
header.topbar .brand:hover { text-decoration:none; }
header.topbar nav.sections { display:flex; gap:2px; height:100%; overflow-x:auto; scrollbar-width:none; }
header.topbar nav.sections a { display:flex; align-items:center; padding:0 15px; color:#c7d0de; font-weight:600; border-bottom:3px solid transparent; white-space:nowrap; }
header.topbar nav.sections a:hover { color:#fff; text-decoration:none; }
header.topbar nav.sections a.on { color:#fff; border-bottom-color:#7fb3ff; background:rgba(255,255,255,.06); }
header.topbar .who { margin-left:auto; display:flex; gap:10px; align-items:center; color:#c7d0de; font-size:13px; }
header.topbar .who a { color:#fff; }
header.topbar .who .role { font-size:12px; border:1px solid #46536b; border-radius:10px; padding:1px 8px; }
header.topbar .who button.link { color:#c7d0de; }
/* вторая полоса: вкладки раздела */
nav.tabs { display:flex; gap:2px; padding:0 20px; background:#fff; border-bottom:1px solid var(--line); height:38px; position:sticky; top:46px; z-index:5; overflow-x:auto; }
nav.tabs a { display:flex; align-items:center; gap:6px; padding:0 13px; color:#374151; border-bottom:3px solid transparent; font-weight:500; white-space:nowrap; }
nav.tabs a:hover { background:#f4f6fa; text-decoration:none; }
nav.tabs a.on { color:var(--accent); border-bottom-color:var(--accent); background:#eef2f8; }
nav.tabs a .mem { font-size:11px; color:var(--muted); font-weight:400; }
nav.tabs a .mem:empty { display:none; }
/* третья полоса: открытые расчёты/заказы — как вкладки браузера */
nav.subtabs { display:flex; gap:4px; padding:4px 20px 0; background:#f1f4f8; border-bottom:1px solid var(--line); position:sticky; top:84px; z-index:4; overflow-x:auto; min-height:0; }
nav.subtabs:empty { display:none; }
nav.subtabs a { display:flex; align-items:center; gap:8px; padding:5px 10px 5px 12px; font-size:13px; color:#374151; background:#e4e8ef; border:1px solid #d6dbe3; border-bottom:0; border-radius:7px 7px 0 0; white-space:nowrap; max-width:280px; }
nav.subtabs a:hover { text-decoration:none; background:#eceff4; }
nav.subtabs a.on { background:#fff; color:var(--text); font-weight:600; }
nav.subtabs a .x { color:#9aa3b2; font-size:13px; line-height:1; padding:0 2px; border-radius:3px; }
nav.subtabs a .x:hover { background:#d9dee7; color:var(--danger); }
main { padding:16px 20px 60px; max-width:1900px; }
h1 { font-size:22px; margin:6px 0 4px; } h1 small { font-weight:400; color:var(--muted); font-size:14px; }
h2 { font-size:16px; margin:22px 0 8px; }
.meta { color:var(--muted); font-size:13px; }
.head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin-bottom:10px; }
.actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.actions .break { flex-basis:100%; height:0; }
.card { background:var(--card); border:1px solid var(--line); border-radius:8px; padding:14px 16px; margin:10px 0; }
.card.narrow { max-width:420px; margin:60px auto; }
.flash { padding:8px 12px; border-radius:6px; margin-bottom:10px; } .flash.ok { background:#e6f6ec; color:#14532d; } .flash.err { background:#fde8e8; color:#7f1d1d; }
label { display:flex; flex-direction:column; gap:3px; font-size:13px; color:var(--muted); }
input, select { font:inherit; padding:5px 7px; border:1px solid #cfd4db; border-radius:5px; background:#fff; color:var(--text); }
input:focus, select:focus { outline:2px solid #bcd0f0; border-color:var(--accent); }
button, .btn { font:inherit; padding:6px 12px; border:1px solid #cfd4db; border-radius:6px; background:#fff; cursor:pointer; color:var(--text); display:inline-block; }
button.primary, .btn.primary { background:var(--accent); color:#fff; border-color:var(--accent); }
button.danger { color:var(--danger); border-color:#e8b4b0; }
button.link { border:0; background:none; color:var(--accent); padding:2px 4px; cursor:pointer; }
.btn.on { background:#eef2f8; border-color:#9fb3cd; font-weight:600; }
form.inline { display:inline; }
.grid-form { display:grid; grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); gap:10px 14px; align-items:end; }
.grid-form .actions, .grid-form .wide { grid-column:1 / -1; }
.inline-form { display:flex; gap:10px; align-items:end; flex-wrap:wrap; }
.hint { color:var(--muted); font-size:12px; }
.warn { color:#9a3412; }
.tag { font-size:11px; background:#eef2f8; border-radius:8px; padding:0 6px; color:var(--muted); white-space:nowrap; }
.status { font-size:12px; border-radius:10px; padding:2px 9px; background:#eef2f8; vertical-align:middle; }
.st-placed, .st-partial { color:#92400e; } .st-closed, .st-done { color:#166534; } .st-cancelled, .st-error { color:var(--danger); } .st-draft, .st-running, .st-queued { color:var(--accent); }
.tablewrap { background:#fff; border:1px solid var(--line); border-radius:8px; }   /* без overflow — иначе sticky-шапка не работает; широкая таблица прокручивает страницу */
table { border-collapse:collapse; width:100%; }
table.list { background:#fff; border:1px solid var(--line); border-radius:8px; }
th, td { padding:5px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
th { background:#f1f4f8; font-weight:600; font-size:12px; color:#374151; }
table.list > tbody > tr > th, table.list > tr > th { position:sticky; top:84px; z-index:1; }
body.has-subtabs table.list > tbody > tr > th, body.has-subtabs table.list > tr > th, body.has-static-sub table.list > tbody > tr > th, body.has-static-sub table.list > tr > th { top:117px; }   /* таблицы без обёртки липнут под шапку */
.tablewrap th { position:sticky; top:84px; z-index:2; box-shadow:0 1px 0 var(--line); }
body.has-subtabs .tablewrap th, body.has-static-sub .tablewrap th { top:117px; }
body.has-subtabs.has-static-sub .tablewrap th { top:150px; }
th small, td small { display:block; font-weight:400; color:var(--muted); font-size:11px; }
td.num, th.num { text-align:right; white-space:nowrap; } table.calc th { text-align:right; }
/* числовая колонка с выравниванием по левому краю: значения стоят ровным рядом прямо под заголовком */
td.numl, th.numl { text-align:left; white-space:nowrap; }
table.calc th.name, table.calc th.note, table.calc th:nth-child(2) { text-align:left; }
table.calc td.name { min-width:260px; } table.calc td.type { color:var(--muted); font-size:12px; white-space:nowrap; }
table.calc td.note { color:var(--muted); font-size:12px; min-width:220px; }
table.calc td.note input { width:100%; font-size:12px; }
table.calc .w { min-width:64px; }
table.calc td.rec b { font-size:15px; }
table.calc input.qty { width:6em; text-align:right; font-weight:600; }
table.calc input.qty.saved { outline:2px solid #86efac; } table.calc input.qty.bad { outline:2px solid #fca5a5; }
tr.deficit td { background:var(--deficit); } tr.novelty td { background:var(--novelty); } tr.mixed td { background:var(--mixed); } tr.cachebad td.name { box-shadow:inset 4px 0 0 #a855f7; } tr.anomaly td.name { box-shadow:inset 4px 0 0 #f59e0b; }
.tag.warn { background:#fff3c4; color:#92400e; border-color:#f59e0b; }
tr.line-done td { opacity:.65; } tr.line-closed td { opacity:.5; text-decoration:line-through; } tr.line-closed td.act, tr.line-closed td.note { text-decoration:none; }
tr.off td { color:var(--muted); }
.has-detail { border-bottom:1px dotted var(--accent); cursor:help; }
.legend { color:var(--muted); font-size:12px; display:flex; gap:14px; align-items:center; margin-top:8px; }
.legend .sw { display:inline-block; width:14px; height:14px; border-radius:3px; margin-right:4px; vertical-align:middle; }
.legend .sw.deficit { background:var(--deficit); } .legend .sw.novelty { background:var(--novelty); } .legend .sw.mixed { background:var(--mixed); } .legend .sw.cachebad { background:var(--cachebad); } .legend .sw.anomaly { background:#f59e0b; }
.bar { height:10px; background:#e5e7eb; border-radius:5px; overflow:hidden; margin:12px 0; } .bar .fill { height:100%; background:var(--accent2); transition:width .4s; }
pre.error { white-space:pre-wrap; background:#fde8e8; padding:10px; border-radius:6px; font-size:12px; }
table.kv th { width:240px; text-align:left; background:none; position:static; }
td.small { font-size:12px; } td.act { white-space:nowrap; }
code { background:#eef2f8; padding:0 4px; border-radius:3px; }
@media (max-width: 700px) { header.topbar { gap:8px; padding:0 10px; } header.topbar nav.sections a { padding:0 9px; } main { padding:10px; } h1 { font-size:18px; } }
/* разбор позиции */
.kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:10px; margin:10px 0; }
.kpi { background:#fff; border:1px solid var(--line); border-radius:8px; padding:10px 12px; }
.kpi small { display:block; color:var(--muted); font-size:12px; } .kpi b { display:block; font-size:22px; margin:2px 0; } .kpi b.type { font-size:16px; }
.kpi.deficit { background:var(--deficit); } .kpi.novelty { background:var(--novelty); }
.cols { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
@media (max-width: 1000px) { .cols { grid-template-columns:1fr; } }
table.bars td.bar-cell { width:55%; } .hbar { height:12px; background:#7fb3ff; border-radius:3px; min-width:2px; }
td.qa-cell { white-space:nowrap; } td.qa-cell input[type=checkbox] { vertical-align:middle; margin-right:4px; } label.chk { flex-direction:row; align-items:center; gap:4px; color:#374151; font-size:12px; justify-content:flex-end; }
tr.qa-foot td { background:#f8fafc; border-top:2px solid #cfd4db; vertical-align:middle; padding:10px 8px; }
tr.qa-foot #qa-count { display:block; margin-bottom:6px; white-space:nowrap; }
nav.subtabs.static { position:static; }
nav.subtabs.static a { font-weight:500; }
header.topbar .jobs { display:flex; gap:6px; margin-left:auto; }
header.topbar .jobs:empty { display:none; }
header.topbar .jobs:not(:empty) + .who { margin-left:0; }   /* пустой индикатор скрыт, блок пользователя остаётся справа */
a.job-chip { color:#fde68a; font-size:12px; border:1px solid #6b5b12; background:#3a3410; border-radius:10px; padding:2px 9px; white-space:nowrap; }
a.job-chip:hover { text-decoration:none; background:#4a4214; }
.btnwrap { display:inline-block; }
button:disabled { opacity:.55; cursor:not-allowed; }
dialog#confirm-dlg { border:1px solid var(--line); border-radius:10px; padding:18px 20px; max-width:420px; font:inherit; color:var(--text); box-shadow:0 12px 32px rgba(0,0,0,.18); }
dialog#confirm-dlg::backdrop { background:rgba(20,26,38,.45); }
dialog#confirm-dlg p { margin:0 0 14px; font-size:15px; line-height:1.45; }
dialog#confirm-dlg .actions { justify-content:flex-end; }
button.danger { background:var(--danger); color:#fff; border-color:var(--danger); }
button.danger:hover { background:#8f1d17; }