/* ═══════════════════════════════════════════════════════════════════
   ДАШБОРД 2.0
   Плашки максимально белые и лежат прямо на фоне сайта: своей подложки
   у экрана больше нет — Раиль 04.09.2026 «фон, под ним ещё один фон,
   а потом таблицы — убери, не нужно городить».
   Заливка шапок другая и светлее фона, чтобы они не сливались.
   Палитра объявлена и на листе, и на подложке окна: окна живут в body,
   вне .dash2, и без своего набора остаются без фона.
   ═══════════════════════════════════════════════════════════════════ */
.dash2, .d2-back, .d2-pop{
  /* Дашборд больше не держит свою палитру: раньше шапка блока была #EFF3FA —
     прохладный голубой, из-за него дашборд не слушался общего оформления
     и выбивался из всего сайта. Теперь всё берётся из токенов. */
  --card:var(--surface-2);
  --head:var(--surface-head);
  --head-2:var(--surface-3);
  --rule:var(--hair-2);
  --rule-2:var(--hair);
  --ink:var(--text-1);
  --ink-2:var(--text-2);
  --ink-3:var(--text-3);
  --nav:var(--accent);
  --bad:var(--loss);
  /* --mid здесь нельзя объявить через var(--mid): имя совпадает с общим
     токеном и получилась бы ссылка на саму себя. Латунь берём как --warn. */
  --mid:var(--warn);
  --good:var(--gain);
  --rad:var(--radius-card);
  --dur:.16s;
  --ease:cubic-bezier(.2,.7,.3,1);
  --shade:0 0 0 0 transparent;
  --lift:0 18px 40px -18px rgba(14,17,23,.38),0 2px 6px rgba(14,17,23,.10);
  --d2-sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Helvetica Neue",Arial,sans-serif;
  --d2-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
/* Тёмная тема оболочки: белое становится графитовым, границы светлеют. */
/* Тёмная тема отдельного набора больше не требует: значения приходят
   из токенов и меняются вместе с темой. Здесь остаются только тени. */
html[data-theme="dark"] .dash2,
html[data-theme="dark"] .d2-back,
html[data-theme="dark"] .d2-pop{
  --shade:0 1px 2px rgba(0,0,0,.4);
  --lift:0 18px 40px -18px rgba(0,0,0,.7),0 2px 6px rgba(0,0,0,.4);
  --shade:0 0 0 0 transparent;
}
.dash2{color:var(--ink);font:400 13px/1.4 var(--d2-sans);padding-bottom:36px}
.dash2 *{box-sizing:border-box}
body.d2-drag{user-select:none;-webkit-user-select:none;cursor:grabbing}

/* ── Панель сверху ───────────────────────────────────────────────── */
/* Одной строкой без переноса: раньше «Сохранить расстановку» уезжало на
   вторую строку, потому что распорка съедала весь остаток места.
   Не помещается — панель прокручивается вбок. Раиль 04.09.2026. */
.d2-bar{display:flex;gap:7px;align-items:center;flex-wrap:nowrap;margin-bottom:14px;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;padding-bottom:2px}
.d2-bar>*{flex:none}
.d2-bar::-webkit-scrollbar{height:5px}
.d2-bar::-webkit-scrollbar-thumb{background:var(--rule);border-radius:3px}
.d2-tag{
  font:500 11px/1 var(--d2-sans);color:var(--ink-2);background:var(--card);
  border:1px solid var(--rule);border-radius:var(--radius-ctrl);height:29px;padding:0 10px;display:inline-flex;align-items:center;box-shadow:var(--shade);
  white-space:nowrap;
}
.d2-tag b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.d2-sel,.d2-btn,.d2-per{
  font:500 11.5px/1 var(--d2-sans);color:var(--ink-2);background:var(--card);
  border:1px solid var(--rule);border-radius:var(--radius-ctrl);height:29px;padding:0 10px;display:inline-flex;align-items:center;cursor:pointer;
  white-space:nowrap;
  transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.d2-sel{padding-right:26px;appearance:none;max-width:260px;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),
                   linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);
  background-position:calc(100% - 14px) 13px,calc(100% - 10px) 13px;
  background-size:4px 4px,4px 4px;background-repeat:no-repeat}
.d2-sel:hover,.d2-btn:hover,.d2-per:hover{color:var(--ink);border-color:var(--ink-3)}
.d2-btn:focus-visible,.d2-sel:focus-visible,.d2-per:focus-visible{outline:2px solid var(--nav);outline-offset:1px}
.d2-spacer{margin-left:auto}
/* Четыре шага показа: 1 — панель, 2 — плюс таблицы, 3 — плюс графики,
   4 — плюс мастер. Раиль 04.09.2026: «раз, два, три, четыре». */
.d2-steps{display:inline-flex;border:1px solid var(--rule);border-radius:var(--radius-chip);
  overflow:hidden;background:var(--card);box-shadow:var(--shade)}
.d2-step{width:26px;height:29px;border:0;border-left:1px solid var(--rule);background:none;
  font:700 11.5px/1 var(--d2-sans);color:var(--ink-3);cursor:pointer;
  transition:color var(--dur) var(--ease),background var(--dur) var(--ease)}
.d2-step:first-child{border-left:0}
.d2-step:hover{color:var(--ink);background:var(--head-2)}
.d2-step.on{background:var(--head);color:var(--ink);font-weight:700}
.d2-step:focus-visible{outline:2px solid var(--nav);outline-offset:-2px}
/* Поиск по блокам дашборда: набрал «отгрузка» — блок встал первым. */
.d2-find{display:inline-flex;align-items:center;gap:6px;background:var(--card);
  border:1px solid var(--rule);border-radius:var(--radius-chip);padding:0 11px;height:29px;
  color:var(--ink-3);box-shadow:var(--shade)}
.d2-find:focus-within{border-color:var(--nav);color:var(--nav)}
.d2-find input{border:0;background:none;outline:none;font:500 11.5px/1 var(--d2-sans);
  color:var(--ink);width:112px;padding:0}
.d2-find input::placeholder{color:var(--ink-3)}

/* ── Сетка блоков ───────────────────────────────────────────────── */
.d2-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
@media (max-width:1400px){.d2-board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.d2-board{grid-template-columns:minmax(0,1fr)}}
/* Мастер держит четырнадцать столбцов и до шести линий: во всю ширину,
   друг под другом. Раиль 04.09.2026: «зачем ты сузил их». */
.d2-blk--wide{grid-column:1/-1}

/* ── Блок ───────────────────────────────────────────────────────── */
/* Воздуха между таблицей и её графиком — чуть-чуть: видно, что это одна
   мысль. Между блоками воздуха втрое больше. */
.d2-blk{display:flex;flex-direction:column;gap:7px;min-width:0}
.d2-blk.ph{visibility:hidden}
.d2-blk.ghost{position:fixed;z-index:1200;pointer-events:none;margin:0}
.d2-blk.ghost .d2-pane{box-shadow:var(--lift);border-color:var(--nav)}
.d2-pane{
  background:var(--card);border:1px solid var(--rule);border-radius:var(--rad);
  overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shade);
  transition:border-color var(--dur) var(--ease);
}
.d2-pane--table{flex:0 0 auto}
.d2-pane--chart{flex:1 1 auto;min-height:0}
.d2-blk.closed .d2-pane--chart,.d2-blk.nochart .d2-pane--chart{display:none}
.d2-blk.closed .d2-tbl,.d2-blk.closed .d2-mbody{display:none}
.d2-blk.closed,.d2-blk.nochart{align-self:start}
.d2-blk.closed .d2-chev{transform:rotate(-90deg)}
/* «Глазик»: цифры остаются на месте, но прочесть их через плечо нельзя. */
.d2-blk.hidden-v .d2-tbl,.d2-blk.hidden-v .d2-chart,
.d2-blk.hidden-v .d2-mtwrap,.d2-blk.hidden-v .d2-mchart,
.d2-blk.hidden-v .d2-gauges{
  filter:blur(6px);user-select:none;pointer-events:none;
}
.d2-blk.hidden-v .d2-eye{color:var(--nav)}
.d2-eye .d2-eye-off{opacity:0;transition:opacity var(--dur) var(--ease)}
.d2-blk.hidden-v .d2-eye .d2-eye-off{opacity:1}
.d2-blk.nochart .d2-nochart{color:var(--nav)}
/* Найденный поиском блок поднимается наверх и подсвечивается рамкой. */
.d2-blk.hit .d2-pane{border-color:var(--nav)}
.d2-blk.hit .d2-h{background:var(--head)}

.d2-h{
  background:var(--head);border-bottom:1px solid var(--rule);
  display:flex;align-items:center;gap:8px;
  padding:5px 11px;flex:0 0 auto;cursor:grab;touch-action:none;
}
.d2-n{font-family:var(--d2-mono);font-size:11px;font-weight:700;color:var(--ink-3);flex:none}
.d2-t{font-size:12px;font-weight:700;letter-spacing:.01em;text-transform:uppercase;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
/* Дата актуальности: у каждой выгрузки свой ритм, и это надо видеть сразу. */
.d2-as{font-size:10px;color:var(--ink-3);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;font-variant-numeric:tabular-nums;flex:1 1 auto;min-width:0}
/* Ползунок в шапке блока: тара в инвентаризации. */
.d2-sw{display:inline-flex;align-items:center;gap:5px;flex:none;border:1px solid var(--rule);
  background:var(--card);border-radius:var(--radius-chip);padding:2px 7px 2px 3px;cursor:pointer;
  font:600 9.5px/1 var(--d2-sans);color:var(--ink-3);letter-spacing:.04em;
  text-transform:uppercase;white-space:nowrap}
.d2-sw i{width:18px;height:11px;border-radius:7px;background:var(--rule);position:relative;
  transition:background var(--dur) var(--ease)}
.d2-sw i::after{content:'';position:absolute;top:1.5px;left:1.5px;width:8px;height:8px;
  border-radius:50%;background:var(--card);transition:transform var(--dur) var(--ease)}
.d2-sw.on{color:var(--nav);border-color:var(--nav)}
.d2-sw.on i{background:var(--nav)}
.d2-sw.on i::after{transform:translateX(7px)}
.d2-sw:focus-visible{outline:2px solid var(--nav);outline-offset:1px}
.d2-sw.busy{opacity:.5;cursor:progress}

.d2-icb{
  width:20px;height:20px;border:1px solid transparent;border-radius:6px;background:none;
  display:grid;place-items:center;cursor:pointer;color:var(--ink-3);padding:0;flex:none;
}
.d2-icb:hover{border-color:var(--rule);color:var(--ink)}
.d2-icb:focus-visible{outline:2px solid var(--nav);outline-offset:1px}
.d2-chev{transition:transform var(--dur) var(--ease)}

/* ── Таблица: компактная, разметка по обеим осям ─────────────────── */
.d2-tbl{width:100%;border-collapse:collapse;table-layout:fixed}
.d2-tbl th{
  background:var(--head-2);padding:3px 11px;font-size:9px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-3);text-align:left;
}
.d2-tbl th+th{text-align:right}
.d2-tbl th:last-child{text-align:center}
/* При table-layout:fixed ширину колонок задаёт шапка, а не тело:
   без этого столбцы делили ширину поровну. */
.d2-tbl th:nth-child(1){width:48%}
.d2-tbl th:nth-child(2){width:28%}
.d2-tbl th:nth-child(3){width:24%}
.d2-tbl td{height:28px;padding:0 9px;font-size:12.5px;vertical-align:middle}
.d2-tbl td.k{color:var(--ink);font-weight:500;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;padding-left:11px}
/* Пояснение — в ту же строку, серым: отдельная строчка растила блок вдвое. */
.d2-note{color:var(--ink-3);font-weight:400;font-size:10.5px;margin-left:5px}
.d2-tbl td.v{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.d2-tbl td.c{text-align:center;white-space:nowrap;padding-right:11px}
.d2-tbl td.v.hot{cursor:pointer}
/* Подложка под курсором — светлая (--head-2), а не цвет шапки: на сером
   #E0E0E0 бордо и изумруд теряли контраст и «расплывались». Раиль 10.09.2026. */
.d2-tbl td.v.hot:hover{background:var(--head-2) !important}
.d2-val{font-size:13.5px;font-weight:750;letter-spacing:-.015em;color:var(--ink)}
.d2-tbl td.v u{font-style:normal;text-decoration:none;font-size:10px;color:var(--ink-3);
  margin-left:3px;font-weight:500}
.d2-sl{color:var(--rule);margin:0 4px;font-weight:400}
.d2-v2{font-size:11.5px;font-weight:650;color:var(--ink-2)}
.d2-tbl td.v.bad .d2-val{color:var(--bad)}
.d2-tbl td.v.good .d2-val{color:var(--good)}
.d2-tbl td.v.mid .d2-val{color:var(--mid)}
.d2-tbl td.v.none .d2-val{color:var(--ink-3);font-weight:500;font-size:12.5px}
/* Сравнение с прошлым отрезком — в своём столбце, прямоугольной
   окантовкой по контуру, значение внутри. Как в обычном дашборде. */
/* Рецепт взят один в один с обычного дашборда (.d5-dlt): заливки нет,
   рамка тонкая и в цвет самой величины. Раиль 01.09.2026: «заливки не
   используй, смотрится некрасиво — оставь только контур». */
.d2-cmp{display:inline-flex;align-items:center;background:none;
  font:600 10px/1 var(--d2-sans);color:var(--ink-3);
  border:1px solid color-mix(in srgb,currentColor 42%,transparent);
  border-radius:5px;padding:3px 6px;white-space:nowrap;font-variant-numeric:tabular-nums}
.d2-cmp.good{color:var(--good)}
.d2-cmp.bad{color:var(--bad)}
.d2-cmp-no{color:var(--rule);font-size:11px}
/* Пунктир вместо кнопки: кнопка в таблице показателей шумит. */
.d2-pick{border:0;background:none;padding:0;font:inherit;color:inherit;letter-spacing:inherit;
  border-bottom:1px dotted var(--ink-3);cursor:pointer}
/* Под курсором число остаётся своего цвета — бордо так и остаётся бордо.
   Раньше оно перекрашивалось в акцент, и «3 в красной зоне» переставала
   быть красной. Кликабельность показывает сплошное подчёркивание. */
.d2-tbl td.v.hot:hover .d2-pick{border-bottom-style:solid;border-bottom-color:currentColor}
.d2-pick:focus-visible{outline:2px solid var(--nav);outline-offset:2px;border-radius:2px}

/* ── Пилюли и период графика ─────────────────────────────────────── */
/* Пилюли слева переносятся, кнопка периода держится справа сверху:
   при пяти пилюлях она уезжала на вторую строку и терялась. */
.d2-cbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;
  align-items:start;padding:7px 12px 2px;flex:0 0 auto}
.d2-pills{display:flex;gap:5px;flex-wrap:wrap;min-width:0}
.d2-pill{
  font:500 11px/1 var(--d2-sans);color:var(--ink-3);background:none;
  border:1px solid var(--rule);border-radius:var(--radius-chip);padding:5px 9px;cursor:pointer;
  display:inline-flex;align-items:center;gap:5px;
  transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease);
}
.d2-pill:hover{color:var(--ink);border-color:var(--ink-3)}
.d2-pill:focus-visible{outline:2px solid var(--nav);outline-offset:1px}
.d2-pill[aria-pressed="true"],.d2-pill.on{color:var(--nav);border-color:var(--nav);font-weight:700}
.d2-per{flex:0 0 auto;padding:5px 10px;font-size:11px;justify-self:end}
.d2-hide{color:var(--ink-3)}
.d2-hide:hover{color:var(--bad);border-color:var(--bad)}
.d2-chart{padding:2px 12px 0;flex:1 1 auto;min-height:0;display:flex;align-items:center;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
.d2-chart svg{display:block;flex:0 0 auto}
.d2-chart.grabbing{cursor:grabbing}
.d2-chart::-webkit-scrollbar,.d2-mtwrap::-webkit-scrollbar{height:6px}
.d2-chart::-webkit-scrollbar-thumb,.d2-mtwrap::-webkit-scrollbar-thumb{
  background:var(--rule);border-radius:3px}
.d2-foot{padding:2px 12px 7px;font-size:10px;color:var(--ink-3);line-height:1.3;
  display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex:0 0 auto}
/* Правая подпись («без тары», «по датам документов») в одну строку и на месте:
   длинная левая часть не должна сталкивать её вниз. */
.d2-foot>span:last-child{flex:0 0 auto;white-space:nowrap;text-align:right}
/* У мастер-графика строка появляется, только когда есть что сказать. */
.d2-mfoot:empty{display:none}

/* ── Всплывающий список: состав блоков и выбор периода ───────────── */
.d2-pop{
  position:fixed;z-index:1250;background:var(--card);border:1px solid var(--rule);
  border-radius:10px;box-shadow:var(--lift);padding:7px;min-width:250px;max-width:330px;
  font:400 12px/1.4 var(--d2-sans);color:var(--ink);max-height:70vh;overflow:auto;
}
.d2-opt{display:flex;align-items:center;gap:9px;padding:6px 7px;border-radius:7px;cursor:pointer}
.d2-opt:hover{background:var(--head)}
.d2-opt input{accent-color:var(--nav);width:14px;height:14px;cursor:pointer}
.d2-poph{font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-3);padding:7px 7px 4px}
.d2-prow{display:flex;gap:5px;flex-wrap:wrap;padding:0 7px 5px;align-items:center}
.d2-phint{font-size:10.5px;color:var(--ink-3);line-height:1.45;padding:6px 7px 3px;
  border-top:1px solid var(--rule-2);margin-top:4px}
.d2-phint b{color:var(--ink-2)}
.d2-pop--find{min-width:340px;padding:0;max-height:400px;display:flex;flex-direction:column}
.d2-fbox{padding:8px;border-bottom:1px solid var(--rule-2);flex:0 0 auto}
.d2-finp{width:100%;font:500 12px var(--d2-sans);color:var(--ink);background:var(--card);
  border:1px solid var(--rule);border-radius:8px;padding:7px 9px;outline:none}
.d2-finp:focus{border-color:var(--nav)}
.d2-flist{overflow:auto;padding:5px;min-height:0}
.d2-fopt{display:block;width:100%;text-align:left;border:0;background:none;cursor:pointer;
  font:400 12px/1.35 var(--d2-sans);color:var(--ink);padding:7px 8px;border-radius:7px}
.d2-fopt:hover{background:var(--head)}
.d2-fopt:focus-visible{outline:2px solid var(--nav);outline-offset:-2px}
.d2-dates span{color:var(--ink-3);font-size:11px}
.d2-date{
  font:500 11px/1 var(--d2-sans);color:var(--ink);background:var(--card);
  border:1px solid var(--rule);border-radius:8px;padding:5px 7px;
}
.d2-date:focus{outline:2px solid var(--nav);outline-offset:0}

/* ── Приборная панель: одиннадцать чисел одной строкой ──────────── */
.d2-gauges{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));
  gap:0;padding:0}
.d2-g{padding:9px 11px;border-left:1px solid var(--rule-2);min-width:0}
.d2-g:first-child{border-left:0}
.d2-gv{font-size:19px;font-weight:700;letter-spacing:-.03em;color:var(--ink);
  line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.d2-gv small{font-size:10.5px;font-weight:600;color:var(--ink-3);margin-left:3px;
  letter-spacing:0}
.d2-gv.bad{color:var(--bad)}
.d2-gv.good{color:var(--good)}
.d2-gl{font-size:11px;font-weight:600;color:var(--ink-2);margin-top:5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d2-gs{font-size:10px;color:var(--ink-3);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.d2-gd{display:flex;align-items:center;justify-content:space-between;gap:5px;
  margin-top:6px;font-size:9.5px;color:var(--ink-3);min-height:19px}
.d2-gd>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:900px){.d2-gauges{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
  .d2-g{border-top:1px solid var(--rule-2)}}

/* ── Мастер ─────────────────────────────────────────────────────── */
.d2-mbody{display:flex;flex-direction:column;min-height:0}
/* У мастера в строке три элемента: пилюли, выбор показателя и период. */
.d2-mbody .d2-cbar{grid-template-columns:minmax(0,1fr) auto auto}
.d2-mtwrap{padding:4px 12px 12px;overflow-x:auto;scrollbar-width:thin}
.d2-mtwrap.grabbing{cursor:grabbing}
.d2-mdel{border:0;background:none;color:currentColor;cursor:pointer;font-size:13px;
  line-height:1;padding:0 2px;opacity:.55}
.d2-mdel:hover{opacity:1;color:var(--bad)}
.d2-mtbl{border-collapse:collapse;table-layout:auto;min-width:100%}
.d2-mtbl th{background:var(--head-2);padding:6px 8px;font-size:9px;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3);text-align:right;white-space:nowrap}
.d2-mtbl th:first-child{text-align:left;min-width:250px;position:sticky;left:0;z-index:2}
.d2-mtbl td:first-child{position:sticky;left:0;z-index:1;min-width:250px}
.d2-mtbl th i{font-style:normal;font-weight:500;opacity:.7;margin-left:3px;text-transform:lowercase}
.d2-mtbl td{padding:0 7px;height:28px;font-size:12px;text-align:right;white-space:nowrap;
  font-variant-numeric:tabular-nums;font-weight:650;color:var(--ink)}
.d2-mtbl td:first-child{text-align:left;font-weight:500;overflow:hidden;text-overflow:ellipsis}
.d2-dot{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:7px;
  vertical-align:middle}

/* ── Окна ───────────────────────────────────────────────────────── */
.d2-back{position:fixed;inset:0;background:rgba(14,17,23,.4);display:grid;place-items:center;
  padding:24px;z-index:1300}
.d2-win{background:var(--card) !important;border:1px solid var(--rule);border-radius:var(--rad);
  width:min(460px,100%);box-shadow:var(--lift);overflow:hidden;
  font:400 13px/1.45 var(--d2-sans);color:var(--ink)}
.d2-win.wide{width:min(1180px,100%)}
/* Ширина окна под число столбцов: у техники их шесть, и окно в 1180 px
   стояло наполовину пустым. Раиль 04.09.2026. */
.d2-win.w1{width:min(660px,100%)}
.d2-win.w2{width:min(820px,100%)}
.d2-win.w3{width:min(1000px,100%)}
.d2-win.w4{width:min(1180px,100%)}
.d2-win header{padding:11px 15px;border-bottom:1px solid var(--rule);background:var(--head) !important;
  display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.d2-win header b{font-size:13px;font-weight:700;color:var(--ink)}
.d2-win header span{font-size:10.5px;color:var(--ink-3)}
.d2-win .body{padding:0;max-height:64vh;overflow:auto}
/* Поля ввода живут в своём отступе: раньше рамка фокуса срезалась
   прокруткой и поле выглядело недорисованным. */
.d2-win .body.pad{padding:15px;overflow:visible}
.d2-win .body.pad input{width:100%;display:block}
.d2-win input{font:600 15px var(--d2-sans);color:var(--ink);
  background:var(--card);border:1px solid var(--rule);border-radius:8px;padding:9px 11px;
  font-variant-numeric:tabular-nums}
.d2-win input:focus{outline:2px solid var(--nav);outline-offset:0}
.d2-win .hint{font-size:11.5px;color:var(--ink-3);line-height:1.5;padding:9px 0 0}
.d2-win .err{font-size:11.5px;color:var(--bad);padding:6px 0 0;min-height:16px}
.d2-win footer{padding:10px 15px;border-top:1px solid var(--rule);display:flex;
  justify-content:flex-end;gap:8px}
.d2-win button{font:600 12px var(--d2-sans);border:1px solid var(--rule);background:var(--card);
  color:var(--ink);border-radius:8px;padding:8px 15px;cursor:pointer}
.d2-win button.pri{border-color:var(--nav);background:var(--nav);color:#fff}
.d2-win button:hover{border-color:var(--ink-3)}

/* Таблица расшифровки: столбцы, шапка и вертикальная разметка —
   всё как в обычном дашборде, только на светлом листе. */
.d2-dwrap{overflow:auto;max-height:60vh}
.d2-dtbl{width:100%;border-collapse:collapse;font-size:12.5px}
.d2-dtbl th{position:sticky;top:0;z-index:1;background:var(--head) !important;
  padding:7px 10px;font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);white-space:nowrap;text-align:left}
.d2-dtbl td{padding:7px 10px;color:var(--ink);vertical-align:middle;line-height:1.35}
.d2-dtbl .a-right{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.d2-dtbl .a-center{text-align:center;white-space:nowrap}
.d2-dtbl td.t-bad{color:var(--bad);font-weight:650}
.d2-dtbl td.t-mid{color:var(--mid);font-weight:650}
.d2-dtbl td.t-good{color:var(--good);font-weight:650}
.d2-dtbl tr.total td{background:var(--head) !important;font-weight:750}

.d2-empty{padding:34px 20px;text-align:center;color:var(--ink-3);font-size:13px}

/* ═══════════════════════════════════════════════════════════════════
   ТЕЛЕФОН
   Раиль смотрит дашборд с айфона. Широкую расшифровку туда не втиснуть
   никаким кеглем, поэтому строка разворачивается карточкой: сверху имя,
   ниже «подпись — значение» столбиком. Прокрутки вбок не остаётся вовсе,
   и телефон разворачивать не нужно.
   ═══════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){.dash2 *{transition:none!important;animation:none!important}}

/* ═══════════════════════════════════════════════════════════════════
   ЗАЩИТА ОТ ОБЩИХ СТИЛЕЙ САЙТА
   У сайта есть правила на голые table/th/td: рамка всей таблицы, свои
   грани по теме оформления, закреплённый и залитый первый столбец.
   Из-за них грани дашборда рисовались разной толщиной и цветом.
   Здесь линии задаются один раз и одинаково — но только внутри листа.
   ═══════════════════════════════════════════════════════════════════ */
.dash2 table,.d2-win table{border:0 !important;border-collapse:collapse !important;
  border-spacing:0;font-size:inherit;min-width:0;border-radius:0 !important}
.dash2 thead th:first-child,.dash2 tbody td:first-child,
.d2-win thead th:first-child,.d2-win tbody td:first-child{
  position:static;left:auto;z-index:auto;--col-stick:var(--card);
  background:var(--card) !important;border-radius:0 !important;
}
.d2-win .d2-dtbl thead th:first-child{position:sticky;top:0;background:var(--head) !important}
.dash2 .d2-tbl thead th,html[data-style] .dash2 .d2-tbl thead th,
.dash2 .d2-mtbl thead th,html[data-style] .dash2 .d2-mtbl thead th{
  background:var(--head) !important;color:var(--ink-3);
}
.d2-win .d2-dtbl thead th,html[data-style] .d2-win .d2-dtbl thead th{
  background:var(--head) !important;color:var(--ink-3);
}
.dash2 .d2-tbl tbody td,.dash2 .d2-mtbl tbody td,.d2-win .d2-dtbl tbody td{
  background:var(--card);color:var(--ink);
}
.dash2 .d2-tbl tbody tr:hover,.dash2 .d2-mtbl tbody tr:hover,
.d2-win .d2-dtbl tbody tr:hover{background:transparent}
.dash2 .d2-mtbl tbody tr:hover td,.d2-win .d2-dtbl tbody tr:hover td{
  background:var(--head-2) !important}
.d2-win .d2-dtbl tr.total td{background:var(--head) !important}

/* Грани: одна толщина, один цвет, без сюрпризов от темы оформления.
   Раиль 04.09.2026: «криво прорисовались границы, где-то темнее,
   где-то светлее — этот глюк везде». */
.dash2 .d2-tbl thead th,.dash2 .d2-mtbl thead th,.d2-win .d2-dtbl thead th{
  border:0 !important;border-bottom:1px solid var(--rule) !important;
}
.dash2 .d2-tbl tbody td,.dash2 .d2-mtbl tbody td,.d2-win .d2-dtbl tbody td{
  border:0 !important;border-bottom:1px solid var(--rule-2) !important;
}
.dash2 .d2-tbl thead th+th,.dash2 .d2-tbl tbody td+td,
.dash2 .d2-mtbl thead th+th,.dash2 .d2-mtbl tbody td+td,
.d2-win .d2-dtbl thead th+th,.d2-win .d2-dtbl tbody td+td{
  border-left:1px solid var(--rule) !important;
}
.dash2 .d2-tbl tbody tr:last-child td,.dash2 .d2-mtbl tbody tr:last-child td,
.d2-win .d2-dtbl tbody tr:last-child td{border-bottom:0 !important}
.d2-win .d2-dtbl tr.total td{border-top:1px solid var(--rule) !important}

@media (max-width:700px){
  .d2-back{padding:8px}
  .d2-win,.d2-win.wide,.d2-win.w1,.d2-win.w2,.d2-win.w3,.d2-win.w4{width:100%}
  .d2-win header{flex-direction:column;align-items:flex-start;gap:2px;padding:10px 13px}
  .d2-win .body{max-height:72vh}
  .d2-dwrap{max-height:none;overflow:visible;padding:9px 10px}

  /* Строка становится карточкой: сверху заголовок, ниже настоящая таблица
     из двух колонок — подпись и значение, с вертикальной и горизонтальной
     разметкой. Раиль 04.09.2026: «нету вертикального разделения, во всех
     таблицах они должны быть». */
  .d2-dtbl{display:block;width:100%;font-size:12.5px;border:0 !important}
  .d2-dtbl thead{display:none}
  .d2-dtbl tbody,.d2-dtbl tr,.d2-dtbl td{display:block;width:auto}
  .d2-dtbl tr{border:1px solid var(--rule);border-radius:10px;margin:0 0 9px;
    overflow:hidden;background:var(--card)}
  .d2-dtbl tr:last-child{margin-bottom:0}

  .d2-dtbl td,.d2-win .d2-dtbl tbody td{
    display:grid;grid-template-columns:38% 62%;align-items:stretch;
    padding:0;border:0 !important;border-top:1px solid var(--rule-2) !important;
    background:var(--card) !important;text-align:left;white-space:normal}
  .d2-dtbl td::before{content:attr(data-label);display:flex;align-items:center;
    padding:7px 9px;color:var(--ink-3);font-size:9.5px;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;line-height:1.25}
  .d2-dtbl td .cellv{display:flex;align-items:center;justify-content:flex-end;
    padding:7px 10px;border-left:1px solid var(--rule-2);text-align:right;
    color:var(--ink);overflow-wrap:anywhere;line-height:1.3}

  /* Первая ячейка — шапка карточки: имя, товар, направление. */
  .d2-dtbl td:first-child,.d2-win .d2-dtbl tbody td:first-child{
    display:block;border-top:0 !important;padding:9px 11px;
    background:var(--head) !important;border-bottom:1px solid var(--rule) !important}
  .d2-dtbl td:first-child::before{display:none}
  .d2-dtbl td:first-child .cellv{display:block;padding:0;border-left:0;
    text-align:left;font-weight:700;font-size:13.5px;line-height:1.3;color:var(--ink)}

  /* Пустые ячейки итоговой строки места не занимают. */
  .d2-dtbl td:not(:first-child):has(.cellv:empty){display:none}
  .d2-dtbl tr.total{border-color:var(--nav)}
  .d2-dtbl tr.total td:first-child .cellv{color:var(--nav)}
  .d2-win .d2-dtbl tr.total td,.d2-dtbl tbody tr:hover td,
  .d2-win .d2-dtbl tbody tr:hover td{background:var(--card) !important}
  .d2-win .d2-dtbl tr.total td:first-child{background:var(--head) !important}

  /* Лист и блоки на телефоне: одна колонка, поля уже. */
  .d2-bar{gap:6px}
  .d2-gauges{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
  .d2-g{border-top:1px solid var(--rule-2)}
  .d2-g:first-child,.d2-g:nth-child(2),.d2-g:nth-child(3){border-top:0}
}
