:root{--bg:#f4f5f7;--card:#fff;--fg:#1c2330;--muted:#6b7686;--line:#dde1e8;--acc:#1f6feb;--acc-fg:#fff;--danger:#c62828;--ok:#1b7a3d;--warn:#9a6700}
@media (prefers-color-scheme:dark){:root{--bg:#141820;--card:#1d232e;--fg:#e6e9ef;--muted:#9aa5b5;--line:#2c3543;--acc:#4c8dff;--danger:#ef6b6b;--ok:#4cc27a;--warn:#e3b341}}
*{box-sizing:border-box}
#hx-bar{position:fixed;top:0;left:0;height:3px;width:100%;z-index:50;background:var(--acc);transform:scaleX(0);
  transform-origin:left;transition:transform .2s ease;opacity:0;pointer-events:none}
#hx-bar.on{transform:scaleX(0.7);opacity:1;transition:transform 6s cubic-bezier(0,.6,.2,1),opacity .15s}
.hx-toast{position:fixed;bottom:16px;right:16px;z-index:50;max-width:360px;box-shadow:0 6px 20px rgba(0,0,0,.2);margin:0}
.htmx-request.btn,.htmx-request button,button.htmx-request,form.htmx-request button{opacity:.55;pointer-events:none}
body{margin:0;font:15px/1.4 system-ui,"Segoe UI",sans-serif;background:var(--bg);color:var(--fg)}
.top{display:flex;align-items:center;gap:20px;padding:10px 16px;background:var(--card);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand{font-size:17px}.top nav{display:flex;gap:4px;flex:1}
.top nav a{padding:6px 12px;border-radius:6px;color:var(--fg);text-decoration:none}
.top nav a.on,.top nav a:hover{background:var(--bg)}
.who{color:var(--muted);display:flex;gap:10px;align-items:center}
main{padding:16px;max-width:1500px;margin:0 auto}
h1{font-size:22px;margin:0}h2{font-size:17px;margin:20px 0 8px}
.bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:10px;flex-wrap:wrap}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:16px}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:end;margin-bottom:14px}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
label small,.hint,small{color:var(--muted);font-weight:400}
input,select,textarea,button,.btn{font:inherit;padding:7px 10px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--fg)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--acc);outline-offset:0}
button,.btn{cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.btn:hover{border-color:var(--acc)}
.primary{background:var(--acc);color:var(--acc-fg);border-color:var(--acc)}
.danger{color:var(--danger)}button.danger:hover{border-color:var(--danger)}
.link{border:0;background:none;padding:0;color:var(--acc);text-decoration:underline}
.link.danger{color:var(--danger)}
form.inline{display:inline}
kbd{font:11px monospace;background:rgba(127,127,127,.25);border-radius:3px;padding:1px 4px}
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.form .wide{grid-column:1/-1}.form h2{grid-column:1/-1;margin:0}
.field{position:relative;display:flex;flex-direction:column;gap:4px}
.field>label{font-size:13px;color:var(--muted)}
textarea{width:100%;font-family:ui-monospace,Consolas,monospace}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px}
.suggest{position:absolute;top:100%;left:0;right:0;z-index:4;background:var(--card);border:1px solid var(--acc);border-radius:6px;max-height:300px;overflow:auto;box-shadow:0 6px 20px rgba(0,0,0,.18)}
.suggest div{padding:7px 10px;cursor:pointer;border-bottom:1px solid var(--line)}
.suggest div:hover,.suggest div.sel{background:var(--bg)}
.picked{font-weight:600}.picked .tag{font-weight:400}
.tag{font-size:12px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:1px 8px;color:var(--muted)}
.scroll{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%}
th,td{padding:7px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:12px;color:var(--muted);white-space:nowrap;background:var(--bg);position:sticky;top:0}
td.n,th.n{text-align:right;white-space:nowrap}
tr.cancelled td{color:var(--muted);text-decoration:line-through}tr.cancelled td:last-child{text-decoration:none}
.ser{font-family:ui-monospace,Consolas,monospace;font-size:12px;word-break:break-all;max-width:260px}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:10px;border:1px solid}
.flash.ok{color:var(--ok);border-color:var(--ok)}.flash.err{color:var(--danger);border-color:var(--danger)}.flash.warn{color:var(--warn);border-color:var(--warn)}
.badge{display:inline-block;padding:1px 9px;border-radius:10px;font-size:12px;border:1px solid var(--line)}
.st-new{color:var(--acc);border-color:var(--acc)}.st-pack{color:var(--warn);border-color:var(--warn)}.st-ship{color:#8250df;border-color:#8250df}
.st-done{color:var(--ok);border-color:var(--ok)}.st-cancel,.st-warn{color:var(--danger);border-color:var(--danger)}
.empty{color:var(--muted);padding:30px 0;text-align:center}
.login{max-width:340px;margin:12vh auto;display:flex;flex-direction:column;gap:14px}
.login h1{text-align:center}
@media (max-width:640px){main{padding:10px}.top{gap:8px;flex-wrap:wrap}.filters label{flex:1 1 140px}}
.grid th,.grid td{padding:5px 8px;font-size:13px;white-space:nowrap}
.grid td.nm{white-space:normal;min-width:260px;max-width:420px}
.grid tr.grp th{text-align:center;border-bottom:1px solid var(--line);top:0}
.grid .stk{background:rgba(255,217,102,.13)}
.neg{color:var(--danger);font-weight:700}
.pager{display:flex;gap:14px;align-items:center;justify-content:center;margin:14px 0}
.cols{display:grid;grid-template-columns:minmax(280px,1fr) minmax(320px,1.4fr);gap:16px;align-items:start}
@media (max-width:800px){.cols{grid-template-columns:1fr}}
dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}dt{color:var(--muted)}dd{margin:0}
.card table{margin:0}.card h2{margin-top:0}
.num{width:90px;text-align:right}
.grid td.price{line-height:1.15}
.grid td.price small{display:block}
.grid td.noprice{background:rgba(198,40,40,.08);color:var(--danger);font-size:11px;text-align:center}
.grid td.noprice.hot{background:rgba(198,40,40,.28);font-weight:700}
.grid tr.miss th{font-size:12px;background:var(--card);top:auto;position:static}
.missbadge{display:inline-block;background:var(--danger);color:#fff;border-radius:10px;padding:1px 9px;text-decoration:none;font-weight:700}
.okbadge{color:var(--ok);font-weight:600}
.rules{margin:4px 0}.rules th,.rules td{padding:4px 8px}
.stickybar{position:sticky;top:48px;z-index:4;display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:8px;padding:8px 12px;margin-bottom:10px}
.grid td.pc{min-width:105px;white-space:nowrap}
.grid td.pc input{width:82px}
.grid td.pc small{display:inline-block;color:var(--muted);font-size:11px;margin-left:3px}
.grid td.pc.chg{background:rgba(255,205,0,.22)}
.grid td.pc.empty input{border-color:rgba(198,40,40,.5)}
.nobase{color:var(--danger);font-size:12px}
.rename-box{border-color:var(--warn);background:rgba(227,179,65,.08)}
.rename-box h2{margin-top:0;color:var(--warn)}
.codecell{position:relative;white-space:nowrap}
.rowmenu{display:inline-block;position:relative;margin-left:2px}
.rowmenu summary{list-style:none;cursor:pointer;color:var(--muted);padding:0 5px;border-radius:4px;font-weight:700}
.rowmenu summary::-webkit-details-marker{display:none}
.rowmenu summary:hover,.rowmenu[open] summary{background:var(--bg);color:var(--fg)}
.rowmenu-body{position:absolute;left:0;top:100%;z-index:100;background:var(--card);border:1px solid var(--line);
  border-radius:8px;box-shadow:0 6px 16px rgba(0,0,0,.2);min-width:140px;display:flex;flex-direction:column;padding:4px}
.rowmenu-body a{padding:6px 10px;border-radius:5px;color:var(--fg);text-decoration:none;white-space:nowrap;font-size:13px}
.rowmenu-body a:hover{background:var(--bg)}
.grow{flex:1}
.tag.editing{background:var(--warn);color:#fff;border-color:var(--warn);font-size:12px;vertical-align:middle}
.colpanel{position:relative}.colpanel summary{list-style:none;cursor:pointer}.colpanel summary::-webkit-details-marker{display:none}
.colpanel-body{position:absolute;right:0;top:110%;z-index:20;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px;width:min(340px,92vw);max-height:70vh;overflow:auto;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.colpanel-actions{display:flex;gap:8px;margin-bottom:8px}
.colgroup{padding:6px 0;border-top:1px solid var(--line)}
.colgroup label{display:flex;flex-direction:row;align-items:center;gap:6px;color:var(--fg);font-size:14px}
.colgroup .gl{font-weight:600}
.subcols{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;margin:4px 0 0 22px}

/* экран «Сотрудники» */
.staff .row{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;align-items:end;margin-bottom:12px}
.staff.off{opacity:.65}
.perms{display:grid;gap:6px;margin:10px 0 14px}
.check{display:flex;gap:8px;align-items:center;font-weight:400}
.check input{width:auto}

/* фильтр и сортировка по столбцам (colfilter.js) */
.fbtn{border:0;background:transparent;color:var(--muted);cursor:pointer;padding:0 3px;margin-left:2px;font-size:11px;line-height:1}
.fbtn:hover{color:var(--text,#222)}.fbtn.on{color:#fff;background:#d9822b;border-radius:3px}.fbtn.sorted{color:#2b6cd9;font-weight:700}
.tfbar{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin:0 0 8px;padding:6px 10px;background:rgba(217,130,43,.10);border:1px solid var(--line);border-radius:8px;font-size:13px}
.tfchip{display:inline-flex;align-items:center;gap:4px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:2px 8px}
.tfchip.off{opacity:.55;text-decoration:line-through}.tfchip input{width:auto}
.tfpop{position:fixed;z-index:50;width:250px;max-height:72vh;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.25);padding:8px;display:flex;flex-direction:column;gap:6px;font-size:13px}
.tfpop .tfhead{font-weight:600;color:var(--muted)}.tfrow{display:flex;gap:6px}.tfrow button{flex:1}
.tfitem{text-align:left;border:0;background:transparent;padding:4px 6px;cursor:pointer;border-radius:4px;font-size:13px}.tfitem:hover{background:rgba(0,0,0,.06)}
.tflist{max-height:220px;overflow:auto;border:1px solid var(--line);border-radius:6px;padding:4px}
.tfval{display:flex;gap:6px;align-items:center;font-weight:400;padding:1px 2px}.tfval input{width:auto}.tfval small{margin-left:auto}
.tfdlg{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center}
.tfdlgbox{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 18px;min-width:360px;display:flex;flex-direction:column;gap:10px}
.tfdlgbox h3{margin:0}.tfdlgbox p{margin:0;color:var(--muted)}.tfcond{display:flex;gap:8px}.tfcond select{flex:1}.tfcond input{flex:1;min-width:90px}
.tflogic{display:flex;gap:18px}.tflogic label{display:flex;gap:6px;align-items:center;font-weight:400}.tflogic input{width:auto}

/* конструктор нового товара и справочники */
.pform h2{margin:14px 0 8px}.grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-bottom:12px}
.pform .field{display:flex;flex-direction:column;gap:5px}.newin{margin-top:2px}
.preview{margin:10px 0;padding:10px 12px;background:rgba(43,108,217,.08);border-radius:8px;font-size:15px}
.catblock summary{cursor:pointer}.catform{margin-top:10px}.cols2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin:10px 0}
.numrow{display:flex;gap:8px;align-items:center;font-weight:400;margin:3px 0}.numrow input{width:52px;text-align:center}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.filters.inl{margin-top:6px}

/* формы движений: строки товаров */
.lines{display:flex;flex-direction:column;gap:10px;margin-bottom:8px}
.lrow{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;padding:10px;border:1px solid var(--line);border-radius:8px}
.lcell{display:flex;flex-direction:column;gap:4px;font-weight:400;font-size:13px}.lprod{flex:1 1 320px;position:relative}
.lcell input.num{width:110px}.lser{flex:1 1 220px}.lser textarea{width:100%}
.stockhint{font-size:12px;color:var(--muted)}

/* раздел «Справочники» */
.subnav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;border-bottom:1px solid var(--line);padding-bottom:8px}
.subnav a{padding:5px 12px;border-radius:14px;text-decoration:none;color:var(--muted)}.subnav a.on{background:var(--primary,#2b6cd9);color:#fff}
.rowedit{display:flex;flex-direction:column;gap:6px;padding:8px 0;min-width:240px}.rowedit label{font-weight:400}

.rowedit{min-width:min(760px,90vw)}.rowedit h3{margin:10px 0 6px}

/* показ товара на площадках */
.showcell.off{background:rgba(217,43,43,.10)}.listing-form{display:flex;flex-direction:column;gap:6px;min-width:280px}