/* 2026-09-25 (владелец, ТСД: «долго всё нажимается», каждое действие, не какое-то конкретное) —
   часть мобильных браузеров (особенно старые Android WebView, типичные для промышленных
   терминалов) держат ~300мс паузу между касанием и реальным click — ждут, не начало ли это
   двойного тапа для зума. Зум уже отключён (user-scalable=no в head), но это не всегда само
   по себе убирает паузу — для этого есть отдельное явное свойство. html{touch-action} —
   безопасно и для десктопа/iPhone, просто отключает то, что и так уже недоступно.
*/
html{touch-action:manipulation;}
:root{
  --bg:transparent;--bg2:rgba(255,255,255,.07);--bg3:rgba(255,255,255,.1);--card:rgba(255,255,255,.07);
  --border:rgba(255,255,255,.1);--border2:rgba(255,255,255,.15);
  --ac:#818cf8;--acl:rgba(99,102,241,.2);--ac2:#60a5fa;
  --success:#34d399;--success-bg:rgba(52,211,153,.15);--success-border:rgba(52,211,153,.35);
  --warn:#fbbf24;--warn-bg:rgba(251,191,36,.15);--warn-border:rgba(251,191,36,.35);
  --danger:#f87171;--danger-bg:rgba(248,113,113,.15);--danger-border:rgba(248,113,113,.35);
  --text:#ffffff;--text2:rgba(255,255,255,.85);--text3:rgba(255,255,255,.45);
  --radius:10px;--radius-lg:14px;
  --shadow:0 2px 8px rgba(0,0,0,.3);
  --shadow-lg:0 8px 32px rgba(0,0,0,.4);
  --sidebar-bg:rgba(15,23,42,.55);--sidebar-active:rgba(99,102,241,.25);--sidebar-active-border:rgba(99,102,241,.4);
}
.app-bg{position:fixed;inset:0;z-index:-1;background-size:cover;background-position:center;transition:background-image .5s ease,opacity .4s ease;}
.app-bg.loading{opacity:0;}
.app-bg.loaded{opacity:1;}
.app-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.5) 100%);}
.app-bg.bg-night{background-image:url('/static/backgrounds/night.jpg');}
.app-bg.bg-forest{background-image:url('/static/backgrounds/forest.jpg');}
.app-bg.bg-cosmos{background-image:url('/static/backgrounds/cosmos.jpg');}
.app-bg.bg-sunset{background-image:url('/static/backgrounds/sunset.jpg');}
.app-bg.bg-ocean{background-image:url('/static/backgrounds/ocean.jpg');}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:transparent;color:var(--text);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:14px;min-height:100vh;}
#app{position:relative;z-index:1;}
.app{display:flex;height:100vh;overflow:hidden;}
/* ── Sidebar ── */
.sidebar{width:210px;background:var(--sidebar-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;flex-shrink:0;border-right:1px solid rgba(255,255,255,.08);position:relative;z-index:100;}
.sidebar-logo{padding:16px 14px 12px;border-bottom:1px solid rgba(255,255,255,.08);}
.sidebar-logo-row{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.sidebar-logo .name{font-size:14px;font-weight:700;color:#fff;letter-spacing:-.2px;display:flex;align-items:center;gap:8px;}
.sidebar-logo .sub{font-size:11px;color:rgba(255,255,255,.35);margin-top:3px;}
.sidebar-nav{flex:1;overflow-y:auto;padding:12px 8px;height:0;min-height:0;scrollbar-width:none;-ms-overflow-style:none;}
.sidebar-nav::-webkit-scrollbar{display:none;}
.sidebar.collapsed{width:60px;}
.sidebar.collapsed .nav-label{display:none;}
.sidebar.collapsed .nav-section{display:none;}
.sidebar.collapsed .sidebar-logo{padding:14px 8px;}
.sidebar.collapsed .sidebar-logo-row{justify-content:center;}
.sidebar.collapsed .sidebar-logo .sub{display:none;}
.sidebar.collapsed .sidebar-logo .name span{display:none;}
.sidebar.collapsed .nav-item{justify-content:center;padding:10px;}
.sidebar.collapsed .nav-item i{font-size:20px;}
.nav-section{padding:14px 8px 4px;font-size:10px;font-weight:600;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.08em;}
.nav-item{display:flex;align-items:center;gap:9px;padding:8px 10px;cursor:pointer;color:rgba(255,255,255,.55);transition:all .15s;border-radius:10px;margin-bottom:2px;border:1px solid transparent;}
.nav-item:hover{background:rgba(255,255,255,.07);color:rgba(255,255,255,.85);}
.nav-item.active{background:var(--sidebar-active);border-color:var(--sidebar-active-border);color:#fff;font-weight:600;}
.nav-item i{font-size:18px;flex-shrink:0;color:rgba(255,255,255,.4);transition:color .15s;}
.nav-item:hover i{color:rgba(255,255,255,.7);}
.nav-item.active i{color:#818cf8;}
.nav-label{font-size:12.5px;}
/* ── Main ── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.topbar{padding:14px 28px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(10,15,30,.6);box-shadow:0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;align-items:center;flex-shrink:0;}
.topbar-title{font-size:17px;font-weight:700;letter-spacing:-.3px;color:#fff;}
.content{flex:1;overflow-y:auto;padding:28px;background:transparent;}
.content-flush{padding:0;}
.storage-sticky-head{position:sticky;top:0;z-index:10;background:rgba(15,23,42,.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:20px 28px 8px;}
.storage-body-pad{padding:0 28px 28px;}
/* ── Cards ── */
.card{background:rgba(15,23,42,0.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius-lg);padding:22px;margin-bottom:18px;transition:border-color .2s,background .2s;}
.card:hover{background:rgba(15,23,42,0.82);border-color:rgba(255,255,255,0.18);}
.crm-card{cursor:grab;transition:opacity .15s,box-shadow .15s,transform .15s;user-select:none;}
.crm-card:active{cursor:grabbing;}
.crm-card.dragging{opacity:0.4;transform:scale(0.98);}
.crm-col{min-height:80px;border-radius:var(--radius);transition:background .15s;padding:4px;}
.crm-col.drag-over{background:rgba(99,102,241,0.15);outline:2px dashed rgba(99,102,241,0.5);outline-offset:-2px;}
.inv-col.drag-over{background:rgba(99,102,241,0.12);outline:2px dashed rgba(99,102,241,0.4);outline-offset:-2px;}
.card-title{font-size:11px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:.7px;margin-bottom:16px;}
/* ── Metrics ── */
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:14px;margin-bottom:22px;}
.metric{background:rgba(15,23,42,0.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius-lg);padding:16px 20px;transition:transform .15s,border-color .2s;}
.metric:hover{transform:translateY(-1px);border-color:rgba(255,255,255,0.2);}
.metric-label{font-size:10px;font-weight:600;letter-spacing:0.08em;color:rgba(255,255,255,.35);text-transform:uppercase;margin-bottom:8px;}
.metric-value{font-size:30px;font-weight:800;color:#fff;line-height:1;}
/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:var(--radius);font-size:13px;font-weight:500;cursor:pointer;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.08);color:rgba(255,255,255,.85);transition:all .15s;white-space:nowrap;line-height:1;}
.btn:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.25);color:#fff;}
.btn:active{transform:none;box-shadow:none;}
.btn-p{background:rgba(99,102,241,.7);border-color:rgba(99,102,241,.8);color:#fff;}
.btn-p:hover{background:rgba(99,102,241,.9);}
.btn-s{background:var(--success-bg);border-color:var(--success-border);color:var(--success);}
.btn-s:hover{background:rgba(52,211,153,.25);}
.btn-d{background:var(--danger-bg);border-color:var(--danger-border);color:var(--danger);}
.btn-d:hover{background:rgba(248,113,113,.25);}
.btn-w{background:var(--warn-bg);border-color:var(--warn-border);color:var(--warn);}
.btn-sm{padding:5px 10px;font-size:12px;}
.btn-lg{padding:11px 22px;font-size:14px;font-weight:600;}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none;}
/* ── Table ── */
.tw{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--radius);}
.tw::-webkit-scrollbar{height:4px;}
.tw::-webkit-scrollbar-track{background:transparent;}
.tw::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);border-radius:2px;}
.tw::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.25);}
.an-modal-scroll{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent;}
.an-modal-scroll::-webkit-scrollbar{width:6px;}
.an-modal-scroll::-webkit-scrollbar-track{background:transparent;}
.an-modal-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:3px;}
.an-modal-scroll::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.25);}
.crm-kanban-wrap::-webkit-scrollbar{height:4px;}
.crm-kanban-wrap::-webkit-scrollbar-track{background:transparent;}
.crm-kanban-wrap::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.15);border-radius:2px;}
.crm-kanban-wrap::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.25);}
.crm-kanban-wrap{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.15) transparent;}
.content{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent;}
.content::-webkit-scrollbar{width:8px;}
.content::-webkit-scrollbar-track{background:transparent;}
.content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px;}
.content::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.25);}
table{width:100%;border-collapse:collapse;}
th{text-align:left;padding:10px 12px;font-size:11px;font-weight:600;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid rgba(255,255,255,.1);background:transparent;}
td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.06);font-size:13px;vertical-align:middle;}
tr:last-child td{border-bottom:none;}
tbody tr:hover td{background:rgba(255,255,255,.04);}
.tw thead tr{border-bottom:1px solid rgba(255,255,255,0.08);}
.tw tbody tr{border-bottom:1px solid rgba(255,255,255,0.05);}
.tw tbody tr:hover{background:rgba(255,255,255,0.05);}
.tw th{font-size:10.5px;font-weight:600;letter-spacing:0.07em;color:rgba(255,255,255,0.35);text-transform:uppercase;padding:8px 12px;}
.tw td{padding:10px 12px;font-size:13px;color:rgba(255,255,255,0.85);}
/* Заказы FBS — большая таблица со множеством колонок, при частом скролле выглядела «сжатой»;
   больше вертикального воздуха в строках только здесь, остальные таблицы не трогаем. */
.fbs-orders-tbl td{padding:16px 12px;}
/* ── Badges ── */
.badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:600;letter-spacing:.2px;}
.bi{background:var(--acl);color:var(--ac2);}
.bs{background:var(--success-bg);color:var(--success);}
.bw{background:var(--warn-bg);color:var(--warn);}
.bd{background:var(--danger-bg);color:var(--danger);}
.bg2{background:var(--bg3);color:var(--text3);}
/* ── Forms ── */
.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;font-weight:600;color:var(--text2);margin-bottom:5px;}
.inp{width:100%;padding:9px 12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:var(--radius);color:#fff;font-size:13px;outline:none;transition:border .15s,background .15s;font-family:inherit;}
input.inp[type=number]::-webkit-outer-spin-button,
input.inp[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
input.inp[type=number]{-moz-appearance:textfield;}
.inp:focus{border-color:rgba(99,102,241,.6);background:rgba(99,102,241,.08);}
.inp::placeholder{color:rgba(255,255,255,.3);}
select.inp option{background:#1e293b;color:#fff;}
/* ── Modal ── */
.modal-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(4px);animation:fadeIn .15s ease;padding:16px;}
.supply-card-scan-highlight{background:rgba(59,130,246,.28) !important;}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{background:rgba(15,23,42,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:28px;width:560px;max-width:95vw;max-height:90vh;overflow-y:auto;color:#fff;animation:slideUp .2s ease;}
.modal::-webkit-scrollbar{width:6px;}
.modal::-webkit-scrollbar-track{background:transparent;}
.modal::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:3px;}
.modal::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.25);}
@keyframes slideUp{from{transform:translateY(16px);opacity:0}to{transform:none;opacity:1}}
.modal-title{font-size:16px;font-weight:700;color:#fff;margin-bottom:20px;display:flex;justify-content:space-between;align-items:center;letter-spacing:-.2px;}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px;padding-top:16px;border-top:1px solid var(--border);}
/* ── Toast ── */
.toast{position:fixed;bottom:28px;right:28px;background:#fff;color:#111;border:1px solid var(--border);border-radius:14px;padding:14px 20px;font-size:13px;z-index:9999;box-shadow:0 8px 32px rgba(0,0,0,.14);display:flex;align-items:center;gap:10px;max-width:360px;animation:tIn .25s cubic-bezier(.34,1.56,.64,1);}
@keyframes tIn{from{transform:translateX(110%);opacity:0}to{transform:none;opacity:1}}
/* ── Search ── */
.search-row{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap;}
.si{position:relative;flex:1;min-width:160px;}
.si i{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--text3);font-size:16px;pointer-events:none;}
.si input{width:100%;padding:9px 12px 9px 36px;background:var(--bg3);border:1.5px solid var(--border2);border-radius:var(--radius);color:var(--text);font-size:13px;outline:none;font-family:inherit;transition:border .15s;}
.si input:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(59,130,246,.1);}
/* ТЗ «зум страницы на телефоне при сканировании» (2026-08-13, часть 2) — iOS Safari сам
   увеличивает масштаб страницы при фокусе на текстовом поле, если его вычисленный font-size
   меньше 16px (это касается ТОЛЬКО iOS Safari, не Android/десктоп) — обычный .si input выше
   13px, отсюда и непроизвольный зум именно на этом поле при сканировании короба. Только этот
   конкретный инпут (не все .si input сразу — не менять внешний вид остальных полей поиска):
   #s-box — поле сканирования короба в «Хранении» (см. renderStorageWrap). */
#s-box{font-size:16px;}
/* ── Box panel ── */
.box-panel{background:rgba(15,23,42,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1.5px solid var(--border2);border-radius:var(--radius-lg);padding:20px;margin-bottom:20px;box-shadow:0 2px 12px rgba(0,0,0,.25);}
.box-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;}
/* ── Upload zone ── */
.upload-zone{border:2px dashed var(--border2);border-radius:var(--radius-lg);padding:40px;text-align:center;cursor:pointer;transition:all .2s;}
.upload-zone:hover,.upload-zone.drag{border-color:var(--ac);background:var(--acl);transform:scale(1.01);}
/* ── Tabs ── */
.tabs{display:flex;border-bottom:2px solid var(--border);margin-bottom:20px;}
.tab{padding:10px 18px;cursor:pointer;font-size:13px;font-weight:500;color:var(--text3);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s;}
.tab.active{color:var(--ac2);border-bottom-color:var(--ac);font-weight:600;}
.tab:hover{color:var(--text);}
/* ── Banners ── */
.ib{padding:12px 16px;border-radius:var(--radius);font-size:13px;margin-bottom:16px;display:flex;align-items:flex-start;gap:10px;line-height:1.5;}
.ib-info{background:#eff6ff;border:1px solid #bfdbfe;color:#1d4ed8;}
.ib-warn{background:var(--warn-bg);border:1px solid var(--warn-border);color:#92400e;}
.ib-s{background:var(--success-bg);border:1px solid var(--success-border);color:var(--success);}
/* ── Loading ── */
.loading{display:flex;align-items:center;justify-content:center;padding:60px;color:var(--text3);}
.spinner{width:26px;height:26px;border:2.5px solid var(--border2);border-top-color:var(--ac);border-radius:50%;animation:spin .7s linear infinite;margin-right:10px;flex-shrink:0;}
@keyframes spin{to{transform:rotate(360deg)}}
/* ── KK ── */
.kk-tabs{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:14px;}
.kk-bt{padding:7px 14px;border-radius:var(--radius);font-size:12px;font-weight:600;cursor:pointer;border:1.5px solid var(--border2);background:var(--bg3);color:var(--text2);transition:all .15s;}
.kk-bt.active{background:var(--acl);border-color:var(--ac);color:var(--ac2);box-shadow:0 0 0 3px rgba(59,130,246,.1);}
.kk-bt.done{background:var(--success-bg);border-color:var(--success-border);color:var(--success);}
.scan-area{background:rgba(15,23,42,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:2px solid var(--ac);border-radius:var(--radius-lg);padding:18px;margin-bottom:16px;}
.scan-area input{width:100%;padding:13px 16px;background:rgba(255,255,255,.08);border:1.5px solid var(--border2);border-radius:var(--radius);color:#fff;font-size:15px;outline:none;font-family:monospace;transition:border .15s,box-shadow .15s;}
.scan-area input:focus{border-color:var(--ac);box-shadow:0 0 0 3px rgba(59,130,246,.15);}
/* ── Billing ── */
.debt-card{border-radius:var(--radius-lg);padding:18px;margin-bottom:14px;border:1.5px solid var(--border);box-shadow:var(--shadow);}
/* ── Print ── */
@media print{
  body>*:not(#print-area){display:none!important;}
  #print-area{display:block!important;}
  @page{size:58mm 40mm;margin:0;}
  .bc-lbl{display:grid!important;grid-template-columns:27mm 1fr!important;align-items:center!important;width:54mm!important;height:38mm!important;margin:0!important;border:none!important;page-break-after:always;padding:1.5mm 2mm!important;box-sizing:border-box!important;column-gap:2mm!important;}
  .bc-lbl .bc-qr-col{display:flex!important;flex-direction:column!important;align-items:center!important;}
  .bc-lbl .qr-wrap{display:flex!important;justify-content:center!important;}
  .bc-lbl .qr-wrap canvas{display:none!important;}
  .bc-lbl .qr-wrap img{width:26mm!important;height:26mm!important;display:block!important;}
  .bc-lbl .bc-text{display:flex!important;flex-direction:column!important;}
  .wb-sticker-lbl{display:flex!important;align-items:center;justify-content:center;width:58mm!important;height:40mm!important;margin:0!important;page-break-after:always;box-sizing:border-box!important;}
  .wb-sticker-lbl img{max-width:58mm!important;max-height:40mm!important;}
}
#print-area{display:none;}
.bc-lbl{display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-start;border:1px solid #000;padding:4px;margin:4px;text-align:center;font-family:Arial,sans-serif;background:#fff;color:#000;width:200px;min-height:120px;page-break-inside:avoid;box-sizing:border-box;overflow:hidden;}
.bc-lbl .bc-qr-col{display:flex;flex-direction:column;align-items:center;width:100%;}
.bc-lbl .qr-wrap{display:flex;justify-content:center;width:100%;line-height:0;margin-bottom:2px;}
.bc-lbl .qr-wrap canvas{display:none!important;}
.bc-lbl .qr-wrap img{width:80px!important;height:80px!important;display:block!important;}
/* ТЗ «номер короба текстом на этикетке» (2026-08-13, часть 3) — раньше номер короба был только
   в .bc-text (правая колонка печатного грида, вперемешку с клиентом/ячейкой/составом) — на
   физической этикетке 58×40мм рядом с самим QR-кодом читаемого текста не было вообще, только
   штрихкод/QR. Эта строка — специально ПОД QR (не заменяет .bc-n в правой колонке, дополняет),
   как принято у обычных штрихкодов (цифры под линиями) — глазами читается без сканера. */
.bc-lbl .bc-n-under-qr{font-size:12px;font-weight:700;margin-top:1px;line-height:1.15;font-family:monospace;word-break:break-all;}
.bc-lbl .bc-n{font-size:18px;font-weight:700;margin-top:0;line-height:1.2;}
.bc-lbl .bc-cl{font-size:16px;font-weight:700;color:#111;margin-top:2px;}
.bc-lbl .bc-ip{font-size:13px;font-weight:600;color:#111;margin-top:3px;}
.bc-lbl .bc-c{font-size:15px;font-weight:600;color:#000;margin-top:2px;}
.bc-lbl .bc-dt{font-size:10px;color:#777;margin-top:2px;}
.bc-lbl .bc-items{font-size:9px;color:#444;margin-top:2px;line-height:1.25;word-break:break-word;}
/* ── Camera modal ── */
.camera-overlay{position:relative;background:#000;border-radius:var(--radius);overflow:hidden;}
.camera-overlay video{width:100%;display:block;max-height:280px;object-fit:cover;}
.camera-feedback{position:absolute;inset:0;pointer-events:none;transition:background .15s;border-radius:var(--radius);border:3px solid transparent;}
.camera-feedback.ok{border-color:#059669;background:rgba(5,150,105,.2);}
.camera-feedback.warn{border-color:#d97706;background:rgba(217,119,6,.2);}
.camera-feedback.err{border-color:#dc2626;background:rgba(220,38,38,.2);}
/* П.7 ТЗ «непрерывное сканирование» (2026-08-14) — тот же цветовой язык, что и .camera-feedback
   (те же 3 цвета/оттенки фона), но БЕЗ position:absolute/inset:0 — здесь это не оверлей поверх
   видео с камеры, а обычный блок с собственным содержимым (текущий заказ + поле ввода). */
.kiz-session-fb{transition:background .15s,border-color .15s;border-radius:var(--radius-lg);border:2px solid var(--border2);}
.kiz-session-fb.ok{border-color:#059669;background:rgba(5,150,105,.2);}
.kiz-session-fb.warn{border-color:#d97706;background:rgba(217,119,6,.2);}
.kiz-session-fb.err{border-color:#dc2626;background:rgba(220,38,38,.2);}
/* Крупная плашка результата скана (ТСД) — остаётся видимой до следующего скана */
.scan-banner{margin-top:10px;padding:14px 12px;border-radius:var(--radius-lg);font-size:18px;font-weight:700;text-align:center;line-height:1.3;min-height:22px;border:2px solid transparent;color:var(--text2);}
.scan-banner:empty{display:none;}
.scan-banner.ok{background:rgba(5,150,105,.28);border-color:#059669;color:#d1fae5;}
.scan-banner.warn{background:rgba(217,119,6,.28);border-color:#d97706;color:#fef3c7;}
.scan-banner.err{background:rgba(220,38,38,.3);border-color:#dc2626;color:#fee2e2;}
.scan-step-hint{font-size:20px;font-weight:800;color:var(--ac2);text-align:center;margin:4px 0 8px;}
.printed-counter{font-size:15px;font-weight:700;}
.camera-reticle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:76%;max-width:210px;height:52%;max-height:120px;pointer-events:none;box-shadow:0 0 0 9999px rgba(0,0,0,.35);}
.camera-reticle::before{content:'';position:absolute;inset:-2px;border:2px solid rgba(255,255,255,.9);border-radius:8px;}
.camera-reticle::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:16px;height:2px;background:rgba(255,255,255,.6);box-shadow:0 0 0 1px rgba(255,255,255,.0),8px 0 0 rgba(255,255,255,.0);}
.cam-ctrls{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:10;}
.cam-ctrl-btn{background:rgba(0,0,0,.65);color:#fff;border:1.5px solid rgba(255,255,255,.4);border-radius:8px;padding:7px 15px;font-size:17px;font-weight:700;cursor:pointer;min-width:42px;line-height:1;-webkit-tap-highlight-color:transparent;user-select:none;}
.cam-ctrl-btn.active{background:rgba(255,180,0,.8);border-color:#ffb000;color:#000;}
/* ── Login screen ── */
.pin-screen{position:fixed;inset:0;background:linear-gradient(135deg,#0f172a,#1e293b);display:flex;align-items:center;justify-content:center;z-index:9000;}
.pin-box{background:rgba(15,23,42,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:40px;width:380px;box-shadow:0 24px 80px rgba(0,0,0,.4);}
.login-role{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:12px;font-size:11px;font-weight:700;letter-spacing:.3px;}
.login-role.admin{background:#eff6ff;color:#1d4ed8;}
.login-role.staff{background:#ecfdf5;color:#059669;}
/* ── Burger button ── */
.mnbtn{display:none;}
/* ── Icon-only sidebar: 768–1023px ── */
@media(max-width:1023px){
  .sidebar{width:68px;}
  .nav-label,
  .sidebar-logo .name,
  .sidebar-logo .sub,
  .nav-section{display:none !important;}
  .sidebar-logo{padding:14px 0;display:flex;align-items:center;justify-content:center;}
  .nav-item{
    display:flex !important;
    padding:10px;
    justify-content:center;
    position:relative;
  }
  .nav-item i{font-size:20px;}
  .nav-item::after{content:attr(data-tooltip);position:absolute;left:76px;top:50%;transform:translateY(-50%);background:#1e293b;color:#f1f5f9;padding:6px 12px;border-radius:8px;font-size:12px;font-weight:500;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;z-index:400;box-shadow:0 4px 12px rgba(0,0,0,.3);}
  .nav-item:hover::after{opacity:1;}
}
/* ── Icon sidebar only (768-1023px) ── */
@media(min-width:768px) and (max-width:1023px){
  .sidebar{width:68px;flex-shrink:0;position:static;}
  .nav-item{display:flex !important;visibility:visible !important;}
}
/* ── Storage action buttons: ≤640px ── */
@media(max-width:640px){
  /* Раньше кнопки складывались в столбик (3 строки на всю ширину) — на ТСД это вместе с
     переключателем склада/полями поиска съедало ~75% экрана (жалоба владельца 2026-09-25).
     Прокручиваемая по горизонтали ОДНА строка вместо столбика — та же функциональность,
     кнопки просто уходят вбок при нехватке ширины, а не съедают высоту. */
  .storage-actions-row{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .storage-actions-row .btn{flex-shrink:0;white-space:nowrap;}
}
/* ── Drawer sidebar: ≤767px ── */
@media(max-width:767px){
  .mnbtn{display:inline-flex!important;}
  .sidebar{position:fixed;left:-250px;top:0;height:100%;z-index:300;transition:left .25s;width:244px;}
  .sidebar.open{left:0;}
  .sidebar.open .nav-label{display:inline!important;}
  .sidebar.open .nav-section{display:block!important;}
  .sidebar.open .sidebar-logo .name,.sidebar.open .sidebar-logo .sub{display:block!important;}
  .sidebar.open .sidebar-logo{padding:20px 16px 16px;display:block;}
  .sidebar.open .nav-item{padding:9px 12px;justify-content:flex-start;}
  .sidebar.open .nav-item i{font-size:18px;}
  .sidebar.open .nav-item::after{display:none!important;}
  #sb-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:299;display:none;}
  #sb-overlay.active{display:block;}
  .metrics{grid-template-columns:1fr 1fr;}
  .content{padding:12px;}
  .content-flush{padding:0;}
  .storage-sticky-head{padding:12px 12px 8px;}
  .storage-body-pad{padding:0 12px 12px;}
  .tw{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .modal{width:calc(100vw - 24px)!important;max-width:calc(100vw - 24px)!important;}
  .card{padding:12px;}
  .box-actions{flex-wrap:wrap;gap:6px;}
  .topbar{padding:10px 14px;}
  /* ФИКС «адаптация под ТСД» (2026-09-25, жалоба владельца — половина экрана в Хранении +
     зум при вводе чисел). Два отдельных момента: */
  /* 1) Зум при фокусе на поле — часть браузеров (в т.ч. некоторые Android-сборки, не только
     iOS Safari) автоматически увеличивает страницу при фокусе на поле с font-size <16px,
     чтобы ввод был виден. .inp (базовый класс большинства полей проекта) — 13px, плюс больше
     десятка отдельных числовых полей по файлу с inline font-size 11-13px (CRM/Приёмка/
     Упаковка). !important — одна точка, перекрывает и класс, и все inline-варианты разом,
     вместо правки каждого поля по отдельности. Только в этом мобильном блоке — десктоп
     (плотные таблицы CRM/Приёмки) не трогаем.
  */
  input,select,textarea{font-size:16px!important;}
  /* 2) Поля поиска в Хранении (ШК/Клиент/Ячейка). Правка от 2026-09-25 (.si{min-width:100%})
     не решила жалобу «шапка = 75% экрана» на ТСД — оказалось, поля и до этого переносились
     по 1-2 в ряд (min-width:160px не помещалось на узком экране), так что визуально ничего
     не поменялось, а настоящая причина высоты была в другом месте (см. .storage-actions-row
     выше и hide-переключателя-склада в renderWarehouseSwitch). Вместо 3 строк на всю ширину —
     2 строки: ШК (это поле сканирует пистолет, ему нужна вся ширина) сверху, Клиент/Ячейка
     — вторичные фильтры — рядом внизу. */
  .search-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
  .search-row .si:first-child{grid-column:1/-1;}
  .si{min-width:0;}
  #wh-switch{width:100%!important;}
}