:root{
  --paper:#F6F0EC; --paper-2:#EEE3DD; --paper-3:#E6D8D0; --card:#FFFCFA;
  --ink:#1C231F; --ink-2:#434A45; --muted:#716B67; --line:rgba(28,35,31,.12); --line-2:rgba(28,35,31,.22);
  --green:#203127; --green-2:#2A4033; --on-green:#EDE3DC; --on-green-2:#A9B3A9;
  --rose:#EBA9AE; --rose-2:#F4CDD0; --rose-ink:#A3445A; --oak:#B8844F;
  --ok:#2F7A4C; --warn:#A8700F; --bad:#A3445A;
  --f:"Onest", system-ui, -apple-system, "Segoe UI", sans-serif; --fd:"Unbounded", "Onest", system-ui, sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:14.5px/1.5 var(--f);-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}
button{font:inherit;color:inherit;cursor:pointer}
input,select,textarea{font:inherit;color:var(--ink)}
:focus-visible{outline:2px solid var(--rose-ink);outline-offset:2px}
.muted{color:var(--muted)} .num{font-variant-numeric:tabular-nums}
.brand{font:500 21px/1 var(--fd);letter-spacing:-.04em;margin:0}
.brand i{font-style:italic;font-family:Georgia,serif;font-weight:400;color:var(--rose);padding:0 .08em}
.brand small{display:block;font:500 10px/1 var(--f);letter-spacing:.18em;text-transform:uppercase;color:var(--on-green-2);margin-top:8px}

/* login */
.login{min-height:100vh;display:grid;place-items:center;background:var(--green);padding:16px}
.login-card{background:var(--paper);border-radius:20px;padding:28px;width:min(360px,100%);display:grid;gap:14px}
.login-card .brand i{color:var(--rose-ink)}
label{display:grid;gap:5px;font-size:13px;color:var(--muted)}
input,select,textarea{height:40px;border:1px solid var(--line-2);border-radius:10px;padding:0 11px;background:#fff;width:100%}
textarea{height:auto;min-height:80px;padding:10px 11px;resize:vertical}
input[type=checkbox],input[type=radio]{width:16px;height:16px;accent-color:var(--rose-ink)}
input[type=range]{height:auto;padding:0;accent-color:var(--rose-ink)}
.err{color:var(--bad);font-size:13px;margin:0;min-height:1em}

/* layout */
.app{display:grid;grid-template-columns:228px 1fr;min-height:100vh}
.app > *{min-width:0}
.side{background:var(--green);color:var(--on-green);padding:22px 12px 16px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh;overflow-y:auto}
.side .brand{padding:0 10px}
nav{display:grid;gap:2px}
nav button{display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;border:0;background:none;color:var(--on-green-2);padding:9px 11px;border-radius:9px;font-size:14px}
nav button:hover{background:rgba(237,227,220,.07);color:var(--on-green)}
nav button[aria-current=page]{background:var(--rose);color:var(--ink);font-weight:500}
nav .cnt{font-size:11px;background:rgba(237,227,220,.16);border-radius:999px;padding:1px 7px;font-variant-numeric:tabular-nums}
nav button[aria-current=page] .cnt{background:rgba(28,35,31,.14)}
nav .sep{height:1px;background:rgba(237,227,220,.1);margin:8px 6px}
.me{margin-top:auto;font-size:12.5px;color:var(--on-green-2);padding:0 10px;display:grid;gap:8px}
.me b{color:var(--on-green);font-weight:500}
.me button{justify-self:start;background:none;border:1px solid rgba(237,227,220,.25);color:var(--on-green);border-radius:8px;padding:4px 10px;font-size:12.5px}
.main{padding:22px clamp(14px,2.6vw,34px) 60px;display:grid;gap:18px;align-content:start}
@media (max-width:900px){
  .app{grid-template-columns:1fr}
  .side{position:sticky;height:auto;flex-direction:row;align-items:center;padding:10px;gap:10px;z-index:30;overflow-x:auto;scrollbar-width:none}
  .side .brand small,.me{display:none}
  nav{display:flex;gap:4px}
  nav button{white-space:nowrap}
  nav .sep{display:none}
}

/* header */
.top{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap}
.top h1{font:400 clamp(24px,2.6vw,32px)/1.05 var(--fd);letter-spacing:-.035em;margin:0}
.top p{margin:6px 0 0;color:var(--muted);font-size:13.5px}
.top .r{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* controls */
.btn{height:36px;padding:0 14px;border-radius:9px;border:1px solid var(--line-2);background:#fff;font-size:13.5px;font-weight:500;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:hover{border-color:var(--ink)}
.btn.pri{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn.rose{background:var(--rose);border-color:var(--rose)}
.btn.danger{color:var(--bad);border-color:rgba(163,68,90,.4)}
.btn.sm{height:30px;padding:0 10px;font-size:12.5px;border-radius:8px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.chips{display:flex;gap:5px;flex-wrap:wrap}
.chip{height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:transparent;font-size:13px}
.chip[aria-pressed=true]{background:var(--ink);color:#fff;border-color:var(--ink)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.row > label{flex:1 1 160px}

/* cards & grids */
.card{background:var(--card);border-radius:14px;padding:16px 18px;display:grid;gap:12px;align-content:start;min-width:0;box-shadow:0 0 0 1px var(--line)}
.card > *{min-width:0}
.card h2{font:600 14.5px/1.3 var(--f);margin:0}
.card .sub{font-size:12.5px;color:var(--muted);margin:2px 0 0}
.ch{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.g2{display:grid;grid-template-columns:1.5fr 1fr;gap:14px} .g2e{display:grid;grid-template-columns:1fr 1fr;gap:14px} .g3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.g2 > *,.g2e > *,.g3 > *{min-width:0}
@media (max-width:1150px){.g2,.g2e,.g3{grid-template-columns:1fr}}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.kpi{background:var(--card);border-radius:12px;padding:12px 14px;display:grid;gap:4px;box-shadow:0 0 0 1px var(--line)}
.kpi small{font-size:12px;color:var(--muted)}
.kpi b{font:400 26px/1.05 var(--fd);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.kpi span{font-size:12px;color:var(--muted)}
.kpi.warn{box-shadow:inset 3px 0 0 var(--warn),0 0 0 1px var(--line)}

/* tables */
.tw{overflow-x:auto;margin:0 -18px;padding:0 18px}
table.t{width:100%;border-collapse:collapse;font-size:13.5px;min-width:640px}
.t th{font:500 11px/1.2 var(--f);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:left;padding:9px 8px;border-bottom:1px solid var(--line-2);white-space:nowrap}
.t td{padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.t td.n,.t th.n{text-align:right;font-variant-numeric:tabular-nums}
.t tr.click{cursor:pointer} .t tr.click:hover td{background:rgba(235,169,174,.12)}
.pill{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;font-size:11.5px;font-weight:500;white-space:nowrap;background:var(--paper-2);color:var(--ink-2)}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.pill.CONFIRMED,.pill.AVAILABLE,.pill.ok,.pill.ACTIVE{background:#DDEDE2;color:#1F5A36}
.pill.PENDING,.pill.HELD,.pill.warn{background:#F7E5C4;color:#6B4A0E}
.pill.CANCELLED,.pill.NO_SHOW,.pill.RESERVED,.pill.bad{background:#F3DADF;color:#7E2B3E}
.pill.SEATED,.pill.OCCUPIED,.pill.BILL_OPEN{background:#DAD6D2;color:#1C231F}
.pill.COMPLETED,.pill.CLOSED,.pill.BLOCKED,.pill.EXPIRED{background:#E6E2DF;color:#5D5854}
.pill.NEW{background:#E4ECF4;color:#284A6B} .pill.LOYAL{background:var(--rose-2);color:#6B2E3B} .pill.VIP{background:#E7D6BF;color:#5A3D1C} .pill.INACTIVE{background:#E6E2DF;color:#5D5854}
.tags{display:inline-flex;gap:4px;flex-wrap:wrap}
.tag{font-size:11.5px;padding:1px 7px;border-radius:6px;background:var(--paper-2);color:var(--ink-2);white-space:nowrap}
.dots{letter-spacing:2px;color:var(--rose-ink);font-size:13px;white-space:nowrap}
.empty{padding:18px;text-align:center;color:var(--muted);font-size:13.5px}

/* charts */
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart text{font:11px var(--f);fill:var(--muted)}
.chart .gl{stroke:var(--line)}
.chart .bar{fill:#6B8F78}.chart .bar.hl{fill:var(--green-2)}.chart .bar.hov{fill:var(--rose-ink)}
.heat{display:grid;grid-template-columns:22px repeat(15,minmax(0,1fr));gap:3px;font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.heat .c{aspect-ratio:1.6;border-radius:3px}
.heat .c:hover{outline:2px solid var(--ink)}
.scale{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted)}
.scale i{width:90px;height:7px;border-radius:4px;background:linear-gradient(90deg,#EEF3EE,#9DB8A4,#4E7D5B,#203127)}
.hbars{display:grid;gap:8px}
.hb{display:grid;grid-template-columns:minmax(110px,1.1fr) 2fr minmax(44px,auto);gap:10px;align-items:center;font-size:13px}
.hb > span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb .tr{height:9px;background:var(--paper-2);border-radius:0 4px 4px 0}.hb .tr i{display:block;height:100%;background:var(--green-2);border-radius:0 4px 4px 0}
.hb b{font-weight:500;text-align:right;font-variant-numeric:tabular-nums}
.tip{position:fixed;z-index:400;pointer-events:none;background:var(--ink);color:#fff;font-size:12px;padding:7px 9px;border-radius:7px;line-height:1.4;font-variant-numeric:tabular-nums}

/* floor */
.floor{display:grid;grid-template-columns:1fr 330px;gap:14px;align-items:start}
@media (max-width:1150px){.floor{grid-template-columns:1fr}}
.planbox{background:#EFE5DF;border-radius:12px;overflow:auto}
.planbox svg{display:block;width:100%;min-width:700px;height:auto}
.legend{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;color:var(--ink-2)}
.ll-lg{display:inline-flex;align-items:center;gap:5px}.ll-lg i{width:12px;height:12px;border-radius:3px;display:inline-block}
.sticky{position:sticky;top:16px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:5px 14px;margin:0;font-size:13.5px}.kv dt{color:var(--muted)}.kv dd{margin:0}
.reqs{display:grid;gap:8px}
.req{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:11px;background:var(--paper-2);font-size:13.5px}
.req .ic{width:36px;height:36px;border-radius:9px;background:#fff;display:grid;place-items:center;font-size:18px}
.req.hot{background:#FBE3C8}
.req small{display:block;color:var(--muted);font-size:12px}
.sess{display:grid;gap:8px}
.ses{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:11px;background:var(--paper-2);font-size:13.5px}
.ses .no{font:500 14px/1 var(--fd);width:36px;height:36px;border-radius:9px;background:var(--ink);color:#fff;display:grid;place-items:center}
.ses small{display:block;color:var(--muted);font-size:12px}

/* drawer & modal */
.drawer{position:fixed;inset:0;z-index:100;background:rgba(18,24,20,.45);display:flex;justify-content:flex-end}
.drawer-in{background:var(--paper);width:min(620px,100%);height:100%;overflow-y:auto;padding:20px 22px 40px;display:grid;gap:16px;align-content:start;animation:sl .3s ease}
@keyframes sl{from{transform:translateX(30px);opacity:.3}}
.modal{position:fixed;inset:0;z-index:110;background:rgba(18,24,20,.45);display:grid;place-items:center;padding:16px}
.modal-in{background:var(--paper);border-radius:16px;width:min(520px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:20px;display:grid;gap:14px}
.dh{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.dh h2{font:400 24px/1.1 var(--fd);letter-spacing:-.03em;margin:0}
.x{width:34px;height:34px;border-radius:50%;border:1px solid var(--line-2);background:#fff;font-size:16px;flex:none}
.stat3{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stat3 div{background:var(--card);border-radius:10px;padding:10px;box-shadow:0 0 0 1px var(--line)}
.stat3 b{display:block;font:400 20px/1.1 var(--fd);letter-spacing:-.03em}
.stat3 small{font-size:11.5px;color:var(--muted)}
.hosp{background:var(--green);color:var(--on-green);border-radius:12px;padding:14px 16px;font-size:13.5px;display:grid;gap:6px}
.hosp b{font:500 12px/1 var(--f);letter-spacing:.12em;text-transform:uppercase;color:var(--rose)}
.list{display:grid;border-top:1px solid var(--line)}
.list > div{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.list small{display:block;color:var(--muted);font-size:12px}
.sec-t{font:600 11.5px/1 var(--f);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:4px 0 0}
.taste{display:flex;gap:5px;flex-wrap:wrap}
.taste label{display:inline-flex;gap:5px;align-items:center;padding:4px 9px;border:1px solid var(--line-2);border-radius:999px;font-size:12.5px;color:var(--ink);cursor:pointer}
.taste input{width:14px;height:14px}
.sliders{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sent{background:var(--card);border-left:3px solid var(--rose-ink);padding:10px 12px;border-radius:0 10px 10px 0;font-size:14px}
.preview{background:#E3F4D7;border-radius:12px 12px 12px 4px;padding:10px 12px;font-size:14px;white-space:pre-wrap;max-width:420px}

.toasts{position:fixed;right:18px;bottom:18px;z-index:500;display:grid;gap:8px;width:min(380px,calc(100vw - 36px))}
.toast{background:var(--ink);color:#fff;padding:11px 14px;border-radius:11px;font-size:13.5px;animation:sl .3s ease}
.toast.bad{background:var(--bad)}
.demo-banner{background:var(--rose-2);color:#6B2E3B;border-radius:10px;padding:8px 12px;font-size:12.5px}

/* ───────── робочі панелі: Кухня / Склад / Бухгалтерія ───────── */
.spaces{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:0 4px}
.spaces:empty{display:none}
.spaces button{border:1px solid rgba(237,227,220,.18);background:none;color:var(--on-green-2);border-radius:9px;padding:7px 6px;font-size:12.5px;font-weight:500}
.spaces button:hover{color:var(--on-green);border-color:rgba(237,227,220,.4)}
.spaces button[aria-current=true]{background:var(--on-green);color:var(--green);border-color:var(--on-green)}
@media (max-width:900px){
  .side{flex-wrap:wrap;row-gap:8px}
  .spaces{display:flex;order:2;width:100%;padding:0;overflow-x:auto;scrollbar-width:none}
  .spaces button{flex:1 0 auto;padding:6px 12px}
  nav{order:3;width:100%;overflow-x:auto;scrollbar-width:none}
}
.kpi.good{box-shadow:inset 3px 0 0 var(--ok),0 0 0 1px var(--line)}
.kpi b .dl,.kpi span .dl{font:500 11.5px var(--f)}
.dl{font-size:11.5px;font-weight:500;white-space:nowrap}.dl.up{color:var(--ok)}.dl.dn{color:var(--bad)}
.neg{color:var(--bad)}
.fcv{display:inline-block;width:64px;height:7px;border-radius:4px;background:var(--paper-2);vertical-align:middle;margin-right:7px;overflow:hidden}
.fcv i{display:block;height:100%;border-radius:4px;background:#6B8F78}
.fcv.warn i{background:var(--warn)}.fcv.bad i{background:var(--bad)}.fcv.tgt i{background:var(--ink-2)}
.fc-ok{color:var(--ok)}.fc-warn{color:var(--warn)}.fc-bad{color:var(--bad)}
.pre{white-space:pre-wrap;font-size:13.5px;background:var(--card);border-radius:10px;padding:10px 12px;box-shadow:0 0 0 1px var(--line)}
.tclines{display:grid;gap:8px}
.tcl{display:grid;grid-template-columns:minmax(0,1fr) 96px 78px 74px 30px;gap:6px;align-items:center}
.tcl.pl{grid-template-columns:minmax(0,1fr) 96px 104px 82px 30px}
.tcl .u{position:relative;display:block}
.tcl .u span{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:11.5px;color:var(--muted);pointer-events:none}
.tcl .u input{padding-right:30px}
.tcl .lc{font-size:12.5px;text-align:right;color:var(--ink-2)}
.tcl .x{width:30px;height:30px;font-size:14px}
.tcl .miss{grid-column:1/-1;color:var(--warn);font-size:12px;margin-top:-4px}
.tcl .miss.ok{color:var(--ok)}
@media (max-width:560px){.tcl,.tcl.pl{grid-template-columns:1fr 1fr 30px}.tcl select{grid-column:1/-1}.tcl .lc{display:none}}
.calc{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px}
.calc > div{background:var(--green);color:var(--on-green);border-radius:10px;padding:9px 11px;display:grid;gap:2px}
.calc small{font-size:11.5px;color:var(--on-green-2)}
.calc b{font:400 18px/1.15 var(--fd);letter-spacing:-.03em}
.calc .fc-ok{color:#8FD6A6}.calc .fc-warn{color:#F2C46B}.calc .fc-bad{color:#F4A3B3}
.calc .al{grid-column:1/-1}.calc .al span{font-size:13px}
.ck{display:flex!important;gap:8px;align-items:center;color:var(--ink)!important;font-size:13.5px!important}
.quad{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.quad .q{border-radius:12px;padding:12px 14px;display:grid;gap:2px;background:var(--card);box-shadow:0 0 0 1px var(--line)}
.quad .q b{font:400 28px/1 var(--fd)}.quad .q span{font-weight:600}.quad .q small{font-size:12px;color:var(--muted)}
.quad .star{box-shadow:inset 0 3px 0 var(--ok),0 0 0 1px var(--line)}.quad .plowhorse{box-shadow:inset 0 3px 0 var(--warn),0 0 0 1px var(--line)}
.quad .puzzle{box-shadow:inset 0 3px 0 #284A6B,0 0 0 1px var(--line)}.quad .dog{box-shadow:inset 0 3px 0 var(--bad),0 0 0 1px var(--line)}
@media (max-width:760px){.quad{grid-template-columns:1fr 1fr}}
.pl{display:grid}
.pl-r{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.pl-r small{display:block;font-size:11.5px;color:var(--muted)}
.pl-r.tot{font-weight:600;border-bottom:1px solid var(--line-2);background:linear-gradient(90deg,rgba(235,169,174,.12),transparent);padding-left:8px;margin:0 -8px;padding-right:8px}
.pl-r.big b{font:400 20px/1.1 var(--fd)}
.fcbig{display:grid;gap:10px}
.fcbig > div{display:grid;grid-template-columns:100px 1fr 60px;gap:10px;align-items:center;font-size:13px}
.fcbig .fcv{width:100%;height:10px;margin:0}
.fcbig b{text-align:right;font-variant-numeric:tabular-nums}
.alert{background:#F3DADF;color:#7E2B3E;border-radius:12px;padding:12px 14px;font-size:13.5px}
.utils{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.util{display:flex;gap:12px;align-items:center;text-align:left;background:var(--card);border:0;border-radius:12px;padding:12px 14px;box-shadow:0 0 0 1px var(--line)}
.util:hover{box-shadow:0 0 0 1px var(--ink)}
.util .ic{font-size:22px;width:42px;height:42px;border-radius:10px;background:var(--paper-2);display:grid;place-items:center;flex:none}
.util small{display:block;font-size:12px;color:var(--muted)}.util b{display:block;font:400 20px/1.2 var(--fd)}.util .muted{font-size:12px}
.regimes{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.reg{display:flex!important;gap:10px;align-items:flex-start;border:1px solid var(--line-2);border-radius:12px;padding:12px;cursor:pointer;color:var(--ink)!important}
.reg:has(input:checked){border-color:var(--ink);background:rgba(235,169,174,.12)}
.reg b{display:block;font-size:13.5px}.reg small{font-size:12px;color:var(--muted)}
.reg input{margin-top:2px;flex:none}
.limit{height:10px;border-radius:5px;background:var(--paper-2);overflow:hidden}.limit i{display:block;height:100%;background:#6B8F78}
.limit.warn i{background:var(--warn)}.limit.bad i{background:var(--bad)}
input.inv{width:110px;height:34px;text-align:right;font-variant-numeric:tabular-nums}
.t td input.inv:placeholder-shown{background:#FFF9EC}
.tcl .miss:empty{display:none}
.kpi b{font-size:clamp(20px,1.75vw,26px)}
.t td.n{white-space:nowrap}.hb b{white-space:nowrap}
.emps{display:grid;grid-template-columns:1fr 1fr;gap:8px}.emps .reg{padding:9px 10px}@media (max-width:560px){.emps{grid-template-columns:1fr}}
.depts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px}

.dk{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dk > div{background:var(--paper-2);border-radius:10px;padding:9px 11px;display:grid;gap:1px}
.dk small{font-size:11.5px;color:var(--muted)}.dk b{font:400 19px/1.15 var(--fd);letter-spacing:-.03em}.dk span{font-size:11.5px;color:var(--muted)}
.loop{display:grid;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--line)}
.loop > div{display:flex;justify-content:space-between;gap:10px;padding:7px 11px;font-size:13px;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.loop .p b{color:var(--ok)}.loop .m b{color:var(--bad)}
.loop .eq{background:var(--green);color:var(--on-green);border-bottom:0;font-weight:600}
.flow{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px}
.flow span{background:var(--paper-2);border-radius:8px;padding:6px 10px}.flow i{font-style:normal;color:var(--muted)}
.catmap{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.ok-t{color:var(--ok)!important;font-weight:500}
.dtabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.dtab{display:grid;gap:3px;text-align:left;background:var(--card);border:0;border-radius:12px;padding:12px 14px;box-shadow:0 0 0 1px var(--line)}
.dtab:hover{box-shadow:0 0 0 1px var(--ink)}
.dtab .t{font-weight:600;font-size:13.5px}.dtab b{font:400 21px/1.1 var(--fd);letter-spacing:-.03em}.dtab small{font-size:12px;color:var(--muted)}.dtab em{font-style:normal;color:var(--warn)}
.dtab[aria-pressed=true]{background:var(--green);color:var(--on-green);box-shadow:none}.dtab[aria-pressed=true] small{color:var(--on-green-2)}.dtab[aria-pressed=true] em{color:#F2C46B}
@media (max-width:760px){.dtabs{grid-template-columns:1fr 1fr}}
.t tr.grp td{background:var(--paper-2);font-weight:600;font-size:12.5px;letter-spacing:.02em;padding:8px}

/* ───────── мобільне випадаюче меню ───────── */
.mbtn,.mmenu,.mback{display:none}
@media (max-width:900px){
  .side{flex-wrap:nowrap!important;justify-content:space-between;overflow:visible!important;padding:8px 12px!important;gap:12px}
  .side .spaces,.side nav{display:none!important}
  .side .brand{padding:0;font-size:18px;flex:none}
  .mbtn{display:flex;align-items:center;gap:10px;min-width:0;max-width:70%;height:42px;padding:0 12px 0 14px;border-radius:11px;border:1px solid rgba(237,227,220,.28);background:rgba(237,227,220,.08);color:var(--on-green);font-size:14px;font-weight:500;text-align:left}
  .mbtn span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.15}
  .mbtn small{display:block;font-size:10.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--on-green-2)}
  .mbtn i{flex:none;width:18px;height:12px;position:relative;border-top:2px solid currentColor;border-bottom:2px solid currentColor;transition:.2s}
  .mbtn i::after{content:"";position:absolute;left:0;right:0;top:3px;border-top:2px solid currentColor;transition:.2s}
  .side.open .mbtn{background:var(--on-green);color:var(--green)}
  .side.open .mbtn small{color:var(--muted)}
  .side.open .mbtn i{border-color:transparent}
  .side.open .mbtn i::after{transform:rotate(45deg);top:3px}
  .side.open .mbtn i::before{content:"";position:absolute;left:0;right:0;top:3px;border-top:2px solid currentColor;transform:rotate(-45deg)}
  .mmenu:not([hidden]){display:grid;gap:12px;position:absolute;top:100%;left:0;right:0;background:var(--green);padding:6px 12px 14px;border-bottom-left-radius:18px;border-bottom-right-radius:18px;box-shadow:0 18px 40px rgba(0,0,0,.28);max-height:calc(100dvh - 140px);overflow-y:auto;animation:mdrop .18s ease}
  @keyframes mdrop{from{opacity:0;transform:translateY(-6px)}}
  .mspaces{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:4px;background:rgba(237,227,220,.08);border-radius:11px;padding:4px}
  .mspaces button{border:0;background:none;color:var(--on-green-2);border-radius:8px;padding:9px 4px;font-size:13px;font-weight:500}
  .mspaces button[aria-pressed=true]{background:var(--on-green);color:var(--green)}
  .mgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .mgrid button{display:flex;justify-content:space-between;align-items:center;gap:6px;min-height:52px;text-align:left;border:1px solid rgba(237,227,220,.14);background:rgba(237,227,220,.05);color:var(--on-green);border-radius:12px;padding:10px 12px;font-size:14px;line-height:1.2}
  .mgrid button[aria-current=page]{background:var(--rose);border-color:var(--rose);color:var(--ink);font-weight:500}
  .mgrid .cnt{font-size:11px;background:rgba(237,227,220,.18);border-radius:999px;padding:1px 7px}
  .mme{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12.5px;color:var(--on-green-2);border-top:1px solid rgba(237,227,220,.12);padding-top:10px}
  .mme b{color:var(--on-green);font-weight:500}
  .mme button{background:none;border:1px solid rgba(237,227,220,.28);color:var(--on-green);border-radius:8px;padding:5px 12px;font-size:12.5px}
  .mback:not([hidden]){display:block;position:fixed;inset:0;z-index:25;background:rgba(18,24,20,.45)}
}
.newbox{background:var(--paper-2);border-radius:12px;padding:12px;display:grid;gap:10px}

a.btn{text-decoration:none;color:inherit}

/* ───────── модуль «Інвентаризація» ───────── */
.spaces button:last-child:nth-child(odd){grid-column:1/-1}
.drawer-in.wide{width:min(900px,100%)}
.modal-in.wide{width:min(760px,100%)}
.iflow{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;background:var(--card);border-radius:14px;box-shadow:0 0 0 1px var(--line);overflow:hidden}
.iflow>div{position:relative;padding:14px 16px 14px 22px;display:grid;gap:3px;min-width:0}
.iflow>div+div::before{content:"";position:absolute;left:-9px;top:50%;width:16px;height:16px;border-top:1px solid var(--line-2);border-right:1px solid var(--line-2);transform:translateY(-50%) rotate(45deg);background:var(--card);z-index:1}
.iflow>div:nth-child(odd){background:rgba(238,227,221,.35)}
.iflow small{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.iflow b{font:400 21px/1.1 var(--fd);letter-spacing:-.03em;white-space:nowrap}
.iflow span{font-size:12px;color:var(--muted)}
.iflow .neg b{color:var(--bad)}
@media (max-width:1200px){.iflow{grid-template-columns:repeat(3,minmax(0,1fr))}.iflow>div:nth-child(4)::before{display:none}}
@media (max-width:640px){.iflow{grid-template-columns:1fr 1fr}.iflow>div::before{display:none}}
.ialerts{display:grid;gap:6px}
.ia{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;border-radius:10px;background:#FBEFF1;cursor:pointer}
.ia.yellow{background:#FBF3E2}
.ia i{font-style:normal;font-size:14px;line-height:1.3}
.ia span{display:grid;gap:1px;min-width:0}.ia b{font-size:13.5px}.ia small{font-size:12.5px;color:var(--ink-2);overflow-wrap:anywhere}
.inotfound{display:grid;gap:8px;background:#FBF3E2;border-radius:12px;padding:14px 16px;box-shadow:inset 3px 0 0 var(--warn)}
.inotfound b{font-size:15px}.inotfound span{font-size:13px;color:var(--ink-2)}
.ncard.focus{box-shadow:0 0 0 2px var(--rose-ink)}
.chain{display:flex;flex-wrap:wrap;gap:6px;align-items:stretch}
.chain>span{display:grid;gap:1px;background:var(--paper-2);border-radius:10px;padding:7px 10px;font-size:13px;min-width:0}
.chain>span small{font-size:11.5px;color:var(--muted)}
.chain>span.ap{align-content:center;font-weight:600;background:var(--green);color:var(--on-green)}
.chain em{font-style:normal;align-self:center;color:var(--muted)}
.ysc{position:relative;height:30px;margin:4px 0 2px;background:linear-gradient(var(--line),var(--line)) 0 12px/100% 2px no-repeat}
.ysc i{position:absolute;top:6px;height:14px}
.ysc .ext{border:1.5px dashed #8E8984;border-radius:6px;top:4px;height:18px}
.ysc .zone{background:rgba(47,122,76,.28);border-radius:5px}
.ysc .tg{width:2px;background:var(--ok);top:2px;height:22px}
.ysc .act{width:12px;height:12px;border-radius:50%;background:var(--rose-ink);top:7px;margin-left:-6px;box-shadow:0 0 0 2px #fff}
.ysc span{position:absolute;bottom:-4px;font-size:10.5px;color:var(--muted)}
.nstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.nstats>div{display:grid;gap:2px;background:var(--paper);border-radius:10px;padding:9px 11px;min-width:0}
.nstats small{font-size:11px;color:var(--muted);letter-spacing:.04em}.nstats b{font-size:14px}.nstats span{font-size:11.5px}
.nsug{display:grid;gap:6px;background:#EEF4EF;border-radius:12px;padding:12px 14px;box-shadow:inset 3px 0 0 var(--ok);font-size:13px}
.nsug b{font-size:14px}
.ydots{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.ydots i{font-style:normal;font-size:11.5px;padding:2px 6px;border-radius:6px;background:#DDEDE2;color:#1F5A36;font-variant-numeric:tabular-nums}
.ydots i.warn{background:#F7E5C4;color:#6B4A0E}.ydots i.critical{background:#F3DADF;color:#7E2B3E}
.ncard details summary,.card>details>summary,details.card>summary{cursor:pointer;font-size:13px;color:var(--ink-2)}
.t.srcs td{vertical-align:top;font-size:12.5px}.t.srcs tr.off td{opacity:.55}
.t.srcs a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.semis{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:14px}
@media (max-width:640px){.semis{grid-template-columns:1fr}}
.semi.off{opacity:.8}
.sstock{text-align:right;display:grid}.sstock b{font:400 22px/1.1 var(--fd)}.sstock small{font-size:11.5px;color:var(--muted)}
.mbal{display:flex;height:26px;border-radius:8px;overflow:hidden;margin:6px 0;font-size:11px;color:#fff}
.mbal i{font-style:normal;display:grid;place-items:center;min-width:3px;white-space:nowrap;overflow:hidden}
.mbal .semi{background:var(--ok)}.mbal .other_semi{background:#3C7C8C}.mbal .waste{background:#B8844F}.mbal .loss{background:#A3445A}
.mbal .reduce{background:#6E7FA8}.mbal .rest{background:#8E8984}.mbal .gap{background:repeating-linear-gradient(45deg,#E4DFDA 0 6px,#fff 6px 12px);color:var(--bad);font-weight:700}
.story{display:grid;gap:0;background:var(--card);border-radius:14px;padding:12px 16px;box-shadow:0 0 0 1px var(--line)}
.story>div{position:relative;padding:6px 0 6px 22px;font-size:14px}
.story>div::before{content:"";position:absolute;left:5px;top:12px;width:8px;height:8px;border-radius:50%;background:var(--green)}
.story>div:not(.last)::after{content:"↓";position:absolute;left:3px;top:21px;font-size:10px;color:var(--muted)}
.story>div.last{font-weight:600}
.tsteps{display:grid;gap:10px}
.tstage{display:grid;gap:6px;background:var(--paper);border-radius:10px;padding:10px 12px}
.tap input{font-size:18px}
.tbig{font-weight:600;font-size:14px;padding:4px 10px;border-radius:999px}.tbig.ok{background:#DDEDE2;color:#1F5A36}.tbig.warn{background:#F7E5C4;color:#6B4A0E}.tbig.critical{background:#F3DADF;color:#7E2B3E}
.thr{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.t.invt tr.bad td{background:#FBEFF1}.t.invt tr.warn td{background:#FBF3E2}
.pout{align-items:end}
.wip{display:grid;gap:8px;background:#FBF3E2;border-radius:10px;padding:10px 12px;box-shadow:inset 3px 0 0 var(--warn);font-size:13.5px}
.wip small{color:var(--ink-2)}.wip .row{gap:8px}
.list > div.click{cursor:pointer}.list > div.click:hover{background:rgba(235,169,174,.12)}
.t.prodt td{font-size:13px}.t.prodt td:first-child{min-width:180px}.t.prodt td small{font-size:11.5px}
/* відповідальність і передача НФ */
.resp{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--paper);border-radius:10px;padding:8px 12px;font-size:13.5px}
.resp>span{display:grid;gap:1px}.resp small{font-size:11px;color:var(--muted)}.resp .arr{color:var(--muted);font-size:18px}
.hand{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}
.hand>span{background:var(--paper);border-radius:8px;padding:4px 10px}.hand>span.muted{background:transparent;padding:4px 0}.hand i{font-style:normal;color:var(--muted)}
.hflow{display:grid;grid-template-columns:minmax(0,1fr) 92px minmax(0,1.15fr) 92px minmax(0,1fr) 92px minmax(0,1.15fr) 92px minmax(0,1fr);align-items:stretch;gap:0}
.hn{display:grid;gap:3px;align-content:center;background:var(--paper);border-radius:12px;padding:12px 14px;min-width:0}
.hn.main{background:#EFE3DC;box-shadow:inset 0 0 0 1px var(--line-2)}.hn.warn{background:#FBF3E2;box-shadow:inset 3px 0 0 var(--warn)}
.hn small{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.hn b{font:400 19px/1.1 var(--fd);letter-spacing:-.02em;white-space:nowrap}.hn span{font-size:12px;color:var(--ink-2)}
.ha{display:grid;place-items:center;padding:0 4px;position:relative}
.ha::before{content:"";position:absolute;left:4px;right:10px;top:50%;border-top:1.5px solid var(--line-2)}
.ha::after{content:"";position:absolute;right:6px;top:50%;width:8px;height:8px;border-top:1.5px solid var(--line-2);border-right:1.5px solid var(--line-2);transform:translateY(-50%) rotate(45deg)}
.ha i{position:relative;z-index:1;background:var(--card);font-style:normal;font-size:11px;line-height:1.3;color:var(--muted);text-align:center;padding:2px 4px}
.hside{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--ink-2)}
.hand-t td small{font-size:11.5px;color:var(--muted)}
@media (max-width:1150px){.hflow{grid-template-columns:1fr}.ha{min-height:44px}.ha::before{left:50%;right:auto;top:4px;bottom:10px;border-top:0;border-left:1.5px solid var(--line-2)}
  .ha::after{right:auto;left:calc(50% - 4px);top:auto;bottom:6px;transform:rotate(135deg)}}
.hl>div>span:last-child{white-space:nowrap;text-align:right}
.hmore{display:flex;justify-content:center;padding-top:6px}
/* меню користувача: сповіщення, пароль, вихід */
.me .mebtns{display:flex;gap:6px;flex-wrap:wrap}
.me .mebtns button{justify-self:auto}
#pushBtn.on{background:rgba(237,227,220,.16)}
