:root{
  --head:#0C343D; --head-ink:#FFFFFF; --plan-ink:#CFE2F3; --month:#38761D;
  --name-bg:#D9EAD3; --money-bg:#F9FFF7; --ads-bg:#F6FEFF; --funnel-bg:#FFFDF6;
  --ground:#FFFFFF; --panel:#F8F9F8; --ink:#111111; --ink-2:#666666; --ink-3:#999999;
  --line:#D6DDD9; --line-2:#E8EDEA;
  --heat-money:14,124,74; --heat-ads:214,140,40; --heat-funnel:196,148,32;
  --neg:#C0392B; --pos:#1E7A46;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --head:#0A2A31; --head-ink:#EAF2F1; --plan-ink:#A9C7DA; --month:#2F6519;
    --name-bg:#1C2B24; --money-bg:#131A17; --ads-bg:#121A1C; --funnel-bg:#1A1813;
    --ground:#0E1211; --panel:#141917; --ink:#E7EDEB; --ink-2:#9AA6A2; --ink-3:#74807C;
    --line:#242C2A; --line-2:#1C2321;
    --heat-money:63,183,159; --heat-ads:217,164,64; --heat-funnel:206,170,74;
    --neg:#E0796A; --pos:#57C08A;
  }
}
:root[data-theme="dark"]{
  --head:#0A2A31; --head-ink:#EAF2F1; --plan-ink:#A9C7DA; --month:#2F6519;
  --name-bg:#1C2B24; --money-bg:#131A17; --ads-bg:#121A1C; --funnel-bg:#1A1813;
  --ground:#0E1211; --panel:#141917; --ink:#E7EDEB; --ink-2:#9AA6A2; --ink-3:#74807C;
  --line:#242C2A; --line-2:#1C2321;
  --heat-money:63,183,159; --heat-ads:217,164,64; --heat-funnel:206,170,74;
  --neg:#E0796A; --pos:#57C08A;
}
*{box-sizing:border-box}
body{margin:0; background:var(--ground); color:var(--ink);
  font:400 13px/1.35 Oswald,"Arial Narrow",Arial,sans-serif;
  font-variant-numeric:tabular-nums; -webkit-font-smoothing:antialiased}

/* ── верхняя панель ── */
.top{background:var(--head); color:var(--head-ink); display:flex; align-items:stretch;
  gap:0; position:sticky; top:0; z-index:30; border-bottom:1px solid var(--head)}
.brand{padding:10px 18px; min-width:236px; border-right:1px solid rgba(255,255,255,.14)}
.brand .nm{font-size:11px; letter-spacing:.09em; opacity:.72; font-weight:400}
.brand .yr{font-size:30px; font-weight:500; line-height:1.05; letter-spacing:.01em}
.sel{display:flex; align-items:center; gap:14px; padding:10px 18px; flex-wrap:wrap}
.sel label{font-size:10.5px; letter-spacing:.09em; opacity:.72; display:block; margin-bottom:4px}
select{font:400 14px/1 Oswald,Arial,sans-serif; background:var(--month); color:#fff;
  border:none; border-radius:3px; padding:7px 26px 7px 11px; cursor:pointer;
  appearance:none; background-image:linear-gradient(45deg,transparent 50%,#fff 50%),
    linear-gradient(135deg,#fff 50%,transparent 50%);
  background-position:calc(100% - 14px) 52%, calc(100% - 9px) 52%;
  background-size:5px 5px,5px 5px; background-repeat:no-repeat}
select:focus-visible{outline:2px solid #fff; outline-offset:1px}
.loaded{font-size:11px; opacity:.7; line-height:1.5; padding-left:6px; border-left:1px solid rgba(255,255,255,.16)}
.loaded b{font-weight:500; opacity:1}

/* ── сетка ── */
.sheet{display:grid; grid-template-columns:minmax(236px,236px) 1fr; align-items:start}
.left{position:sticky; left:0; z-index:20; background:var(--ground);
  border-right:2px solid var(--line)}
.right{overflow-x:auto; overflow-y:visible}
table{border-collapse:collapse; width:100%}
th,td{padding:0 8px; height:27px; white-space:nowrap; border-bottom:1px solid var(--line-2)}
thead th{background:var(--head); color:var(--head-ink); font-weight:400; font-size:10.5px;
  letter-spacing:.07em; height:34px; position:sticky; top:59px; z-index:10;
  border-bottom:1px solid var(--head)}
.right thead th{font-size:9.5px; letter-spacing:.02em; text-align:right; padding:0 7px}
.right thead th.wk{background:var(--head); border-left:1px solid rgba(255,255,255,.15)}
.right thead th.sat,.right thead th.sun{color:#FFD9A0}

/* левая панель */
.left td.nm{background:var(--name-bg); font-size:12.5px; font-weight:400; width:160px;
  overflow:hidden; text-overflow:ellipsis; max-width:160px}
.left td.fact{text-align:right; font-size:13.5px; font-weight:500; width:76px}
.left tr.grp-money td.fact{background:var(--money-bg)}
.left tr.grp-ads td.fact{background:var(--ads-bg)}
.left tr.grp-funnel td.fact{background:var(--funnel-bg)}
.left tr.head td{background:var(--name-bg); font-weight:600; font-size:13px}
.left tr.head td.fact{font-size:15px; font-weight:600}
.left tr.small td.nm{font-size:10.5px; font-style:italic; color:var(--ink-2); padding-left:14px}
.left tr.small td.fact{font-size:10.5px; font-style:italic; color:var(--ink-2)}
.left tr.sub td.nm{padding-left:16px; font-size:11.5px; color:var(--ink-2)}
.left tr.miss td.nm,.left tr.miss td.fact{color:var(--ink-3)}
.avg{display:block; font-size:9px; color:var(--ink-2); font-style:italic; line-height:1;
  margin-top:-2px; padding-bottom:3px}
.pct{font-size:11px; color:var(--ink-2)}

/* правая часть */
.right td{text-align:right; font-size:12px; min-width:62px}
.right td.wk{border-left:1px solid var(--line); min-width:74px}
.right td.delta{font-size:10px; color:var(--ink-2); min-width:58px}
.right tr.small td{font-size:10px; font-style:italic; color:var(--ink-2)}
.up{color:var(--pos)} .down{color:var(--neg)}
tbody tr:hover td{outline:1px solid rgba(var(--heat-money),.35); outline-offset:-1px}
tr.spacer td{height:9px; border-bottom:none; background:transparent}
tr.sec td{height:24px; background:var(--panel); font-size:10px; letter-spacing:.12em;
  color:var(--ink-2); border-bottom:1px solid var(--line)}

/* сноска */
.note{padding:18px 18px 40px; color:var(--ink-2); font-size:12px; line-height:1.6; max-width:104ch}
.note b{color:var(--ink); font-weight:500}
.note ul{margin:8px 0 0; padding-left:18px}
.note li{margin-bottom:4px}
.tagmiss{display:inline-block; border:1px solid var(--line); border-radius:3px;
  padding:0 5px; font-size:10px; color:var(--ink-3); margin-left:5px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ── вкладки листов: как в самой таблице, внизу экрана ── */
.tabs{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  display:flex; gap:0; align-items:stretch;
  background:var(--panel); border-top:1px solid var(--line);
  padding:0 8px; overflow-x:auto;
}
.tab{
  display:flex; align-items:center; padding:0 18px; height:34px;
  font:400 13px/1 Oswald,Arial,sans-serif; color:var(--ink-2); text-decoration:none;
  border-right:1px solid var(--line); white-space:nowrap;
}
.tab:hover{background:var(--ground); color:var(--ink)}
.tab.on{
  background:var(--ground); color:var(--ink); font-weight:500;
  box-shadow:inset 0 2px 0 var(--month);
}
.tab:focus-visible{outline:2px solid var(--month); outline-offset:-2px}
body{padding-bottom:34px}
/* межгрупповой просвет: разделяет витрины / ввод / отчёты / справочники,
   не пряча ни один лист — весь состав виден и прокручивается по горизонтали */
.tab-gap{flex:0 0 18px}

/* ── простой лист: одна таблица во всю ширину ── */
.plain{padding:0 0 12px}
.plain table{border-collapse:collapse; width:100%}
.plain th{
  background:var(--head); color:var(--head-ink); font-weight:400; font-size:10.5px;
  letter-spacing:.07em; text-align:right; padding:0 10px; height:34px; white-space:nowrap;
  position:sticky; top:59px; z-index:10;
}
.plain th:first-child{text-align:left}
.plain td{
  padding:0 10px; height:26px; text-align:right; font-size:12.5px;
  border-bottom:1px solid var(--line-2); white-space:nowrap;
}
.plain td:first-child{text-align:left}
.plain tr.head td{background:var(--name-bg); font-weight:600; font-size:13px}
.plain tr.sub td:first-child{padding-left:26px; color:var(--ink-2)}
.plain tr.total td{border-top:2px solid var(--line); font-weight:600; background:var(--money-bg)}
.plain tr.miss td{color:var(--ink-3)}
.plain tr:hover td{background:rgba(var(--heat-money),.06)}
.scrollx{overflow-x:auto}

/* ── лист «Себестоимость»: таблица, в которой правят прямо в ячейке ── */
.toolbar{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:12px 18px; background:var(--panel); border-bottom:1px solid var(--line);
  font-size:12.5px; flex-wrap:wrap;
}
.tb-gap b{font-weight:600; color:var(--ink)}
.tb-bulk{display:flex; align-items:center; gap:8px}
.tb-bulk label{font-size:10.5px; letter-spacing:.05em; color:var(--ink-2)}
.tb-bulk input[type=number]{
  width:90px; padding:5px 8px; font:400 13px Oswald,Arial,sans-serif;
  border:1px solid var(--line); border-radius:3px; background:var(--ground); color:var(--ink);
}
.tb-bulk button, .tb-bulk-btn{
  padding:6px 14px; font:400 12.5px Oswald,Arial,sans-serif; letter-spacing:.03em;
  background:var(--month); color:#fff; border:none; border-radius:3px; cursor:pointer;
}
.tb-bulk button:hover, .tb-bulk-btn:hover{filter:brightness(1.08)}
.tb-status{font-size:11px; color:var(--ink-2); min-width:60px}
.plain tr.gap{background:rgba(var(--heat-ads),.10)}
.plain tr.gap td:first-child{border-left:2px solid rgb(var(--heat-ads))}
.cell-input{white-space:nowrap}
.cost-input{
  width:88px; padding:4px 7px; text-align:right; font:400 12.5px Oswald,Arial,sans-serif;
  border:1px solid var(--line); border-radius:3px; background:var(--ground); color:var(--ink);
}
.cost-input:focus{outline:2px solid var(--month); outline-offset:0; border-color:transparent}
.plain tr.gap .cost-input{border-color:rgb(var(--heat-ads))}
.save-mark{display:inline-block; margin-left:8px; font-size:10.5px; color:var(--ink-2); min-width:70px}

/* ── листы-отчёты: загрузка файла + история загрузок ── */
.upload-box{padding:14px 18px; background:var(--panel); border-bottom:1px solid var(--line)}
.upload-row{display:flex; align-items:center; gap:14px}
.upload-btn{
  display:inline-flex; align-items:center; padding:8px 16px; cursor:pointer;
  font:400 13px Oswald,Arial,sans-serif; letter-spacing:.02em;
  background:var(--month); color:#fff; border-radius:3px;
}
.upload-btn:hover{filter:brightness(1.08)}
.upload-status{font-size:12px; color:var(--ink-2)}
.upload-hint{margin-top:8px; font-size:11.5px; color:var(--ink-2); line-height:1.5; max-width:96ch}
.upload-hint b{color:var(--ink); font-weight:500}
#historyWrap{border-bottom:2px solid var(--line)}
.sec-title{
  margin:20px 18px 0; font:400 12px Oswald,Arial,sans-serif; letter-spacing:.06em;
  text-transform:uppercase; color:var(--ink-2);
}

/* ── лист «Логистика»: статусы обеспеченности и панель параметров ── */
.st-urgent{color:var(--neg); font-weight:500}
.st-short{color:rgb(var(--heat-ads))}
.st-enough{color:var(--pos)}
.st-dead,.st-nodata{color:var(--ink-3)}
.toolbar input[type=number],.toolbar input[type=text]{
  width:78px; padding:5px 8px; font:400 13px Oswald,Arial,sans-serif;
  border:1px solid var(--line); border-radius:3px; background:var(--ground); color:var(--ink);
}
.toolbar input:focus{outline:2px solid var(--month); outline-offset:0; border-color:transparent}

/* ── плашка нехватки данных: над содержимым листа, не вместо него ── */
.banner{
  padding:10px 18px; font-size:12px; line-height:1.55; color:var(--ink);
  background:rgba(var(--heat-ads),.12); border-bottom:1px solid var(--line);
  border-left:3px solid rgb(var(--heat-ads));
}
.banner b{font-weight:600}
.banner u{text-decoration:none; font-weight:500}
.banner a{color:var(--month); font-weight:500; margin-left:6px; white-space:nowrap}
:root:not([data-theme="light"]) .banner a,:root[data-theme="dark"] .banner a{color:var(--pos)}

/* ── страница входа ── */
.login-wrap{display:flex; justify-content:center; padding:56px 18px 24px}
.login-card{
  display:flex; flex-direction:column; gap:6px; width:100%; max-width:320px;
  background:var(--panel); border:1px solid var(--line); border-radius:4px; padding:22px 20px;
}
.login-card label{font-size:10.5px; letter-spacing:.09em; color:var(--ink-2); margin-top:8px}
.login-card input{
  padding:9px 10px; font:400 14px Oswald,Arial,sans-serif;
  border:1px solid var(--line); border-radius:3px; background:var(--ground); color:var(--ink);
}
.login-card input:focus{outline:2px solid var(--month); outline-offset:0; border-color:transparent}
.login-card button{margin-top:16px; justify-content:center; border:none; cursor:pointer}
.login-card button:disabled{opacity:.6; cursor:default}
.login-status{min-height:18px; margin-top:10px; font-size:12px; color:var(--neg)}