:root{
  --bg-0:#f5f2f9;--bg-1:#ffffff;--bg-2:#faf8fd;--bg-3:#f2eef8;--bg-4:#e8e1f3;
  --fg-0:#191527;--fg-1:#3d3654;--fg-2:#6d6588;--fg-3:#948ca9;
  --line-1:#eae4f2;--line-2:#ddd5ea;--line-3:#c9bedd;
  --accent:#8127ee;--accent-2:#d4198e;--accent-dim:rgba(177,63,240,.11);
  --ok:#0f9b70;--ok-bg:rgba(15,155,112,.11);--warn:#b57708;--warn-bg:rgba(181,119,8,.11);
  --err:#d33b48;--err-bg:rgba(211,59,72,.10);--info:#3f6fd6;--info-bg:rgba(63,111,214,.11);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg-0);color:var(--fg-1);font:16px/1.45 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-text-size-adjust:100%}
a{color:var(--accent);text-decoration:none}
h1{font-size:22px;margin:0 0 12px;color:var(--fg-0)}h2{font-size:17px;margin:18px 0 8px;color:var(--fg-0)}h3{font-size:15px;margin:12px 0 6px}
.top{position:sticky;top:0;z-index:5;background:var(--bg-1);border-bottom:1px solid var(--line-1);padding:10px 14px;display:flex;align-items:center;gap:10px}
.top .brand{font-weight:700;color:var(--accent);font-size:17px}
.top .who{margin-left:auto;font-size:13px;color:var(--fg-2);text-align:right}
.top .who b{color:var(--fg-0)}
.wrap{max-width:720px;margin:0 auto;padding:14px 14px 60px}
.card{overflow-x:auto;background:var(--bg-1);border:1px solid var(--line-1);border-radius:14px;padding:14px;margin:0 0 12px;box-shadow:0 1px 3px rgba(24,18,44,.05)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tile{display:block;background:var(--bg-1);border:1px solid var(--line-1);border-radius:14px;padding:18px 14px;text-align:center;color:var(--fg-0);font-weight:600;font-size:16px;box-shadow:0 1px 3px rgba(24,18,44,.05)}
.tile:active{background:var(--bg-3)}.tile small{display:block;font-weight:400;color:var(--fg-2);font-size:13px;margin-top:4px}
.tile.accent{background:var(--accent);color:#fff;border-color:var(--accent)}.tile.accent small{color:#f0e6ff}
.btn{display:inline-block;border:0;border-radius:12px;padding:14px 18px;font-size:17px;font-weight:600;background:var(--accent);color:#fff;cursor:pointer;width:100%;text-align:center}
.btn.sec{background:var(--bg-3);color:var(--fg-0)}.btn.ok{background:var(--ok)}.btn.err{background:var(--err)}.btn.sm{padding:8px 12px;font-size:14px;width:auto}
.btn:disabled{opacity:.5}
label{display:block;font-size:13px;color:var(--fg-2);margin:10px 0 4px}
input,select,textarea{width:100%;font:inherit;font-size:18px;padding:12px;border:1px solid var(--line-2);border-radius:10px;background:var(--bg-1);color:var(--fg-0)}
input:focus,select:focus{outline:2px solid var(--accent-dim);border-color:var(--accent)}
input.big{font-size:28px;text-align:center;font-weight:700}
.row{display:flex;gap:10px;align-items:end}.row>*{flex:1}
.muted{color:var(--fg-3);font-size:13px}.small{font-size:13px}
.pill{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600}
.pill.ok{background:var(--ok-bg);color:var(--ok)}.pill.warn{background:var(--warn-bg);color:var(--warn)}.pill.err{background:var(--err-bg);color:var(--err)}.pill.info{background:var(--info-bg);color:var(--info)}.pill.acc{background:var(--accent-dim);color:var(--accent)}
.alert{padding:12px 14px;border-radius:12px;margin:0 0 12px;font-size:15px}
.alert.ok{background:var(--ok-bg);color:var(--ok)}.alert.err{background:var(--err-bg);color:var(--err)}.alert.warn{background:var(--warn-bg);color:var(--warn)}.alert.info{background:var(--info-bg);color:var(--info)}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:8px 6px;border-bottom:1px solid var(--line-1);text-align:left;vertical-align:top}th{color:var(--fg-2);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}
td.num,th.num{text-align:right;white-space:nowrap}
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.kpi .k{background:var(--bg-2);border:1px solid var(--line-1);border-radius:12px;padding:10px 12px}
.kpi .k b{display:block;font-size:24px;color:var(--fg-0)}.kpi .k span{font-size:12px;color:var(--fg-2)}
.kpi .k.red b{color:var(--err)}.kpi .k.green b{color:var(--ok)}
#video{width:100%;max-height:300px;border-radius:12px;background:#000;object-fit:cover}
.product{background:var(--accent-dim);border-radius:12px;padding:12px;margin:10px 0}
.product b{font-size:20px;color:var(--accent)}
.nav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.nav a{padding:7px 12px;border-radius:99px;background:var(--bg-1);border:1px solid var(--line-2);color:var(--fg-1);font-size:14px}.nav a.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.rowline{display:flex;justify-content:space-between;gap:8px;padding:8px 0;border-bottom:1px solid var(--line-1)}.rowline:last-child{border:0}
.flag{border-left:4px solid var(--err)}
.mono{font-family:Consolas,monospace;font-size:13px;word-break:break-all}
.seg{display:flex;background:var(--bg-3);border-radius:12px;padding:4px;gap:4px}.seg a,.seg button{flex:1;text-align:center;padding:10px;border-radius:9px;color:var(--fg-1);border:0;background:transparent;font:inherit;font-weight:600}.seg .on{background:var(--bg-1);color:var(--accent);box-shadow:0 1px 3px rgba(24,18,44,.1)}
.stack>*{margin-bottom:10px}
.hint{background:var(--warn-bg);color:var(--warn);padding:10px 12px;border-radius:10px;font-size:14px}
@media(min-width:760px){.grid{grid-template-columns:1fr 1fr 1fr}}

.scanwrap{position:relative}.scanwrap .aim{display:none}#video:not([style*='display: none'])+.aim{display:block;position:absolute;left:3%;right:3%;top:22%;height:56%;border:2px solid rgba(255,255,255,.9);border-radius:10px;pointer-events:none}

/* desktop */
.top{padding:0}.top-in{max-width:720px;margin:0 auto;padding:10px 14px;display:flex;align-items:center;gap:10px;width:100%}
.top-in.mid{max-width:1040px}.top-in.wide{max-width:1560px}
.wrap.mid{max-width:1040px}.wrap.wide{max-width:1560px}
table.sticky1 td:first-child,table.sticky1 th:first-child{position:sticky;left:0;background:var(--bg-1);z-index:1}
.dash .blk{min-width:0}
@media(min-width:1000px){
  .wrap.mid .grid{grid-template-columns:repeat(4,1fr)}
  .wrap.wide{padding-top:20px}
  .wrap.wide table{font-size:15px}.wrap.wide th,.wrap.wide td{padding:9px 10px}
  .wrap.wide .kpi{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
  .wrap.wide form.card,.wrap.wide form.stack{max-width:900px}
  .wrap.wide form.row{max-width:520px}.wrap.wide form.row>*{flex:0 1 auto}.wrap.wide form.row>div{flex:1}
  .wrap.wide table.sticky1 td:first-child{min-width:220px}
  .wrap.wide table.sticky1 th{white-space:normal;max-width:130px;line-height:1.25}
  .wrap.wide input,.wrap.wide select,.wrap.wide textarea{font-size:16px;padding:9px 11px}
  .wrap.wide .btn{width:auto;padding:10px 18px;font-size:15px}
  .wrap.wide .dash form.row{max-width:760px}
  .dash{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;align-items:start}
  .dash .blk.full{grid-column:1 / -1}
}
@media(min-width:1280px){
  /* боковое меню руководителя */
  .wrap.wide{padding-left:236px;position:relative}
  .wrap.wide .nav{position:fixed;top:78px;left:max(14px,calc((100vw - 1560px)/2 + 14px));width:204px;flex-direction:column;gap:4px;margin:0}
  .wrap.wide .nav a{border-radius:10px;padding:10px 14px;font-size:15px;border-color:transparent;background:transparent}
  .wrap.wide .nav a:hover{background:var(--bg-3)}
  .wrap.wide .nav a.on{background:var(--accent);color:#fff}
}

.bar{position:relative;height:20px;background:var(--bg-3);border-radius:99px;overflow:hidden;min-width:70px}
.bar i{position:absolute;left:0;top:0;bottom:0;background:var(--ok);opacity:.85;border-radius:99px}
.bar span{position:relative;display:block;text-align:center;font-size:12px;font-weight:700;line-height:20px;color:var(--fg-0)}
.bar.sm{height:14px;margin-top:4px}.bar.sm span{font-size:10px;line-height:14px}
tr.totalrow td{background:var(--bg-2);border-bottom:2px solid var(--line-2)}
table.sticky1 tr.totalrow td:first-child{background:var(--bg-2)}

/* QR для печати */
.qrsheet{display:grid;grid-template-columns:1fr;gap:16px}
.qrcard{text-align:center;padding:24px}.qrcard .qr svg{width:min(320px,80%);height:auto}
.qrsteps{text-align:left;max-width:420px;margin:12px auto;font-size:17px;line-height:1.6}
.qrcode-line{font-size:22px;margin:6px 0}.qrcode-line b{font-size:30px;letter-spacing:.12em;color:var(--accent)}
@media(min-width:1000px){.qrsheet{grid-template-columns:1fr 1fr}}
@media print{.top,.nav,.noprint,.alert{display:none!important}body{background:#fff}.wrap,.wrap.wide{max-width:none;padding:0}
  .qrsheet{grid-template-columns:1fr}.qrcard{box-shadow:none;border:0;page-break-after:always;padding-top:40px}.qrcard .qr svg{width:420px}.qrsteps{font-size:22px}}

/* смена */
.shiftcard{text-align:center;border:2px solid var(--line-2)}.shiftcard.on{border-color:var(--ok);background:var(--ok-bg)}
.shifttimer{font-size:34px;font-weight:800;color:var(--fg-0);margin:6px 0 12px;font-variant-numeric:tabular-nums}
details.card>summary{cursor:pointer;list-style:none}details.card>summary::before{content:"＋ ";color:var(--accent);font-weight:700}
details.card[open]>summary::before{content:"－ "}