:root {
  --bg: #f3f2f2;
  --panel: #faf9f8;
  --text: #201f1d;
  --mut: #7d7669;
  --line: #d8d4cc;
  --soft: #e8e5df;
  --g1: #b68235;
  --g2: #c99f5e;
  --g3: #dcc59a;
  --g4: #ece0c8;
  --warm: #a3502a;
  --fact: #7a3626;
  --dds-in: #5f7a52; /* базовый оттенок столбца поступлений в динамике ДДС — оливковый, тот же, что «приход» ниже */
  --in: #5f7a52;      /* приход в платёжном календаре — приглушённый оливковый */
  --in-soft: #e7ecdf;
  --out-soft: #f0e2dc;
  --ok: #4f6f45;  --ok-bg: #e9efe2;
  --pcwarn: #9a6b1f;  --pcwarn-bg: #f6ecd8;
  --bad: #9a3423;  --bad-bg: #f6e2dc;
}

* { box-sizing: border-box; }

/* атрибут hidden должен прятать элемент даже если классу задан display
   (например .settings-overlay / .settings-guard с display:flex) */
[hidden] { display: none !important; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "PT Sans", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  font-size: 13px;
  font-weight: 400;
}

button { font-family: inherit; }

/* ---------- Вход ---------- */

.login-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.login-card {
  width: 100%;
  max-width: 340px;
  background: var(--panel);
  border: 1px solid var(--line);
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.login-brand {
  font-size: 18px;
  font-weight: 600;
  letter-spacing: .24em;
  text-transform: uppercase;
  text-align: center;
}

.login-sub {
  font-size: 12px;
  color: var(--mut);
  text-align: center;
  margin-bottom: 8px;
}

.field { display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: var(--mut); }
.field input {
  font-family: inherit;
  font-size: 13px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--text);
}

.login-card button {
  margin-top: 8px;
  padding: 10px 14px;
  background: var(--g1);
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
}
.login-card button:hover { background: #8f6428; }

.login-error { min-height: 16px; font-size: 12px; color: var(--warm); text-align: center; line-height: 1.5; }
.login-error.info { color: var(--mut); }

.pw-wrap { position: relative; display: flex; }
.pw-wrap input { flex: 1; padding-right: 40px; }
/* .login-card button задаёт золотую заливку — перебиваем её более точным селектором */
.pw-wrap .pw-eye {
  position: absolute; right: 1px; top: 1px; bottom: 1px; width: 34px; margin: 0; padding: 0;
  border: none; background: none; color: var(--mut); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.pw-wrap .pw-eye:hover { background: none; color: var(--text); }
.pw-wrap .pw-eye svg { width: 16px; height: 16px; }

.login-forgot { text-align: center; font-size: 11.5px; }
.login-forgot a { cursor: pointer; }

/* ---------- Дашборд ---------- */

.app { min-height: 100vh; padding-bottom: 90px; }
.page { max-width: 1480px; margin: 0 auto; padding: 0 32px; }

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 0 20px;
  flex-wrap: wrap;
}
.brand-row { display: flex; align-items: baseline; gap: 16px; }
.brand-name { font-size: 16px; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; }
.period-label { font-size: 11px; color: var(--mut); letter-spacing: .04em; }

.controls { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.control-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 14px; background: var(--panel); border: 1px solid var(--line);
  cursor: pointer; font-size: 12px; font-weight: 500; color: var(--text);
}
.control-btn:hover { border-color: var(--g2); }
.control-btn .arrow { color: var(--mut); font-size: 9px; }

.dropdown { position: relative; }
.dropdown-panel {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 40;
  background: var(--panel); border: 1px solid var(--line); padding: 10px 0;
  min-width: 230px;
}
.dropdown-panel.wide { width: 320px; padding: 14px 16px 16px; }

.dir-item { display: flex; align-items: center; gap: 11px; padding: 8px 16px; cursor: pointer; font-size: 12.5px; }
.dir-item:hover { background: #efece6; }
.dir-check { width: 15px; height: 15px; border: 1px solid #c6c0b4; display: flex; align-items: center; justify-content: center; flex: none; font-size: 10px; color: var(--panel); }
.dir-check.on { background: var(--g1); border-color: var(--g1); }

.dropdown-actions { display: flex; gap: 18px; padding: 8px 16px 2px; border-top: 1px solid var(--line); margin-top: 6px; }
.link-btn { font-size: 11px; color: #8f6428; cursor: pointer; background: none; border: none; padding: 0; }
.link-btn.muted { color: var(--mut); }
.link-btn:hover { color: #6f4d1f; }

.quick-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.quick-btn { padding: 7px 11px; font-size: 11.5px; cursor: pointer; border: 1px solid var(--line); color: var(--text); background: #fff; }
.quick-btn.active { border-color: var(--g1); color: #8f6428; }

.month-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.month-cell { padding: 9px 0; text-align: center; font-size: 11.5px; cursor: pointer; border: 1px solid var(--soft); background: transparent; }
.month-cell.selected { background: var(--g1); color: var(--panel); border-color: var(--g1); }

.mode-toggle { display: flex; border: 1px solid var(--line); background: var(--panel); }
.mode-btn { padding: 9px 15px; cursor: pointer; font-size: 12px; background: transparent; border: none; color: var(--mut); }
.mode-btn.active { background: var(--g1); color: var(--panel); font-weight: 500; }

.sync-btn {
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: var(--panel); cursor: pointer; color: var(--mut);
}
.sync-btn:hover { border-color: var(--g2); color: var(--text); }
.sync-btn.syncing { animation: spin 1s linear infinite; }

.tabs { display: flex; gap: 40px; border-bottom: 1px solid var(--line); }
.tab-btn {
  padding: 17px 0 16px; cursor: pointer; font-size: 13px; letter-spacing: .02em;
  background: none; border: none; border-bottom: 2px solid transparent; color: var(--mut);
}
.tab-btn.active { color: var(--text); font-weight: 600; border-bottom-color: var(--g1); }
.help-btn {
  margin-left: auto; align-self: center; width: 22px; height: 22px; border-radius: 50%;
  border: 1px solid var(--line); background: none; color: var(--mut); font-size: 12px;
  cursor: pointer; line-height: 1;
}
.help-btn:hover { color: var(--text); border-color: var(--g2); }
.help-pop-text { font-size: 13px; line-height: 1.6; color: var(--text); }
.help-pop-text.mut { color: var(--mut); }

.empty-state { padding: 120px 0; text-align: center; }
.empty-state .title { font-size: 15px; font-weight: 500; }
.empty-state .sub { font-size: 12px; color: var(--mut); margin-top: 10px; }

.kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); padding: 30px 0; }
.kpi { padding: 0 26px; border-right: 1px solid var(--line); }
.kpi:first-child { padding-left: 0; }
.kpi:last-child { border-right: none; }
.kpi-label { font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); font-weight: 500; }
.kpi-value { font-size: 26px; font-weight: 300; margin-top: 12px; font-variant-numeric: tabular-nums; }
.kpi-sub { font-size: 11.5px; color: var(--mut); margin-top: 8px; }

.ddsbal-block { padding: 10px 0 26px; }
.ddsbal-title { font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); font-weight: 500; margin: 0 0 12px; }
.ddsbal-row { display: flex; flex-wrap: wrap; gap: 14px; }
.ddsbal-card { background: var(--panel); border: 1px solid var(--line); padding: 14px 18px; min-width: 180px; }
.ddsbal-name { font-size: 11.5px; color: var(--mut); }
.ddsbal-amt { font-size: 20px; font-weight: 600; margin-top: 6px; font-variant-numeric: tabular-nums; }
.ddsbal-amt.neg { color: var(--bad); }
.ddsbal-note { font-size: 10.5px; color: var(--warm); margin-top: 6px; max-width: 220px; line-height: 1.4; }

.content-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); border-top: 1px solid var(--line); }
.panel { padding: 28px 40px 32px 0; border-right: 1px solid var(--line); }
.panel:last-child { border-right: none; padding: 28px 0 32px 40px; }
.panel-title { position: relative; font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); font-weight: 500; margin-bottom: 22px; }

.bar-row { margin-bottom: 20px; }
.bar-row .bar-top { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; gap: 12px; }
.bar-row .bar-name { font-size: 12.5px; font-weight: 500; }
.bar-row .bar-val { font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bar-track { position: relative; height: 6px; background: var(--soft); }
.bar-fill { position: absolute; left: 0; top: 0; height: 100%; background: var(--g1); }

.chart-cols { display: flex; align-items: flex-end; gap: 12px; height: 200px; }
.chart-col { flex: 1; display: flex; align-items: flex-end; justify-content: center; height: 100%; }
.chart-bar { width: 60%; max-width: 34px; background: var(--g1); }
.chart-labels { display: flex; gap: 8px; margin-top: 9px; border-top: 1px solid var(--line); padding-top: 9px; }
.chart-labels span { flex: 1; text-align: center; font-size: 11px; color: var(--mut); }

/* накопительный столбец ФОТ «по периодам»: сегменты по направлениям сверху вниз
   по алфавиту — светлое направление сверху, тёмное у основания столбца */
.fot-stack { width: 60%; max-width: 34px; display: flex; flex-direction: column; }
.fot-seg { width: 100%; min-height: 1px; }
/* тонкий светлый разделитель между сегментами (не над верхним) */
.fot-seg:not(:first-child) { border-top: 1px solid rgba(255, 255, 255, 0.55); }
/* цветовая легенда направлений под графиком «по периодам» */
.fot-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 12px; font-size: 11px; color: var(--mut); }
.fot-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.fot-legend-dot { width: 9px; height: 9px; border-radius: 1px; display: inline-block; flex: none; }

/* цветная метка направления слева от названия в панели «по направлениям» */
.fot-tick { display: inline-block; width: 3px; height: 13px; border-radius: 1px; margin-right: 9px; vertical-align: -2px; flex: none; }

/* собственный фильтр направлений вкладки «Выручка и ФОТ» (чипы, мультивыбор) */
.fot-filter { display: flex; flex-wrap: wrap; gap: 8px; padding: 30px 0 2px; }
.fot-chip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px; font-size: 12px; cursor: pointer; border: 1px solid var(--line); background: #fff; color: var(--mut); }
.fot-chip.on { background: var(--g1); border-color: var(--g1); color: var(--panel); font-weight: 500; }
.fot-chip-dot { width: 8px; height: 8px; border-radius: 1px; flex: none; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12); }

/* переключатель показателя над блоком графиков «Маркетинга» */
.metric-toggle { display: flex; flex-wrap: wrap; gap: 8px; padding: 30px 0 2px; }
.metric-toggle .mode-btn { border: 1px solid var(--line); background: #fff; color: var(--mut); }
.metric-toggle .mode-btn.active { background: var(--g1); color: var(--panel); border-color: var(--g1); font-weight: 500; }

/* парные полосы «план / факт» по направлениям */
.bar-group { margin-bottom: 18px; }
/* padding-right = ширина колонки значений (.bar-val 96px) + зазор (10px):
   так «план X · факт Y» выравнивается по правому краю полос, а не по краю панели,
   и не смешивается визуально с колонкой процентов */
.bar-group-name { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-right: 106px; font-size: 12.5px; font-weight: 500; margin-bottom: 7px; }
.bar-group-note { font-size: 11px; font-weight: 400; color: var(--mut); font-variant-numeric: tabular-nums; white-space: nowrap; }
/* 3px, а не 1px: зазор между «план» и «факт» должен стабильно рисоваться во всех
   группах — при 1px он местами схлопывался и выглядел неодинаково */
.bar-line { display: flex; align-items: center; gap: 10px; margin-bottom: 3px; }
.bar-line .bar-tag { flex: none; width: 34px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); }
.bar-line .bar-track { flex: 1; height: 16px; }
.bar-line .bar-val { flex: none; width: 96px; text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bar-fill.plan { background: var(--g1); }
.bar-fill.fact { background: var(--fact); }
/* вкладка «Выручка и ФОТ»: один ряд чисел (ФОТ-факт), без пары план/факт */
.bar-fill.fot { background: var(--g1); }

/* парные столбцы «план / факт» по периодам: план и факт вплотную, зазор — между месяцами */
.chart-col .col-pair { display: flex; align-items: flex-end; justify-content: center; gap: 1px; width: 100%; max-width: 72px; height: 100%; margin: 0 auto; }
.chart-col .col-pair .chart-bar { flex: 1 1 0; min-width: 0; width: auto; max-width: 34px; }
.chart-bar.plan { background: var(--g1); }
.chart-bar.fact { background: var(--fact); }

/* ДДС: пара «приход | расход» в помесячной динамике. Оба столбца составные —
   .dds-in по видам поступлений (оливковая гамма), .dds-out по статьям расхода
   (тёплая гамма), теми же сегментами .fot-seg. */
.chart-col .col-pair .dds-in,
.chart-col .col-pair .dds-out { background: var(--dds-in); display: flex; flex-direction: column; }
.chart-col .col-pair .dds-out { background: transparent; }
.net-cols { display: flex; gap: 8px; margin-top: 6px; }
.net-cols span { flex: 1; text-align: center; font-size: 10.5px; font-variant-numeric: tabular-nums; color: var(--mut); }
.net-cols span.neg { color: var(--warm); }
.net-cols span.share { color: var(--g1); }
.fot-legend-grp { font-weight: 500; color: var(--text); }

/* вкладка «Выручка и ФОТ»: выручка (Bitrix24) рядом с ФОТ (Excel).
   Полосы «Выручка / ФОТ» по направлениям — золотая и терракотовая (.bar-fill
   .plan / .fact, как «план / факт» на «Маркетинге»); справа от полос — доля ФОТ
   в выручке и валовая прибыль в две строки. Столбцы «по периодам» — парные
   (.col-pair + .chart-bar), как на «ДДС». */
.panel.revfot .bar-group { margin-bottom: 9px; }
.panel.revfot .bar-group-name { padding-right: 0; }
.panel.revfot .bar-line .bar-tag { width: 62px; text-transform: none; letter-spacing: 0; font-size: 11px; }
.panel.revfot .chart-cols { gap: 8px; }
.revfot-row { display: flex; align-items: center; gap: 18px; }
.revfot-row .revfot-bars { flex: 1; min-width: 0; }
.revfot-stat { flex: none; width: 170px; border-left: 1px solid var(--line); padding-left: 16px; }
.revfot-stat .s { display: flex; justify-content: space-between; gap: 6px; font-size: 10.5px; color: var(--mut); line-height: 1.9; white-space: nowrap; }
.revfot-stat .s b { color: var(--text); font-weight: 500; font-variant-numeric: tabular-nums; }
.revfot-stat .s.neg b { color: var(--warm); }
@media (max-width: 820px) {
  .revfot-row { flex-wrap: wrap; }
  .revfot-stat { width: 100%; border-left: none; border-top: 1px solid var(--line); padding: 8px 0 0; margin-top: 4px; }
}

/* ДДС: фильтр «Все статьи расходов» — список с суммами и полоса выбранного */
.dropdown-panel.cats { min-width: 360px; max-height: 380px; overflow-y: auto; }
.dropdown-panel.cats .dir-item { padding-right: 16px; }
.dir-item .dir-sum { margin-left: auto; padding-left: 16px; font-size: 11px; color: var(--mut); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dds-selband { display: flex; flex-wrap: wrap; align-items: stretch; border: 1px solid var(--g3); background: #fbf6ec; margin: 4px 0 2px; }
.dds-selband-cell { padding: 14px 24px; border-right: 1px solid var(--g3); }
.dds-selband-cell.names { flex: 1; min-width: 200px; }
.dds-selband-cell .l { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }
.dds-selband-cell .v { font-size: 19px; font-weight: 600; margin-top: 6px; }
.dds-selband-cell.names .v { font-size: 13px; font-weight: 500; line-height: 1.5; }
.dds-selband-clear { align-self: center; margin: 0 16px 0 auto; font-size: 11px; color: #8f6428; background: none; border: none; cursor: pointer; }
.dds-selband-clear:hover { color: #6f4d1f; }
.dds-panel-sub { font-size: 11px; color: var(--mut); margin: -14px 0 20px; }
.dds-donut-c1 { font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase; fill: var(--mut); }
.dds-donut-c2 { font-size: 17px; font-weight: 600; fill: var(--text); }

/* подпись окна сравнения над KPI-блоком «Маркетинга» */
.mkt-cov { font-size: 11.5px; color: var(--mut); padding: 26px 0 0; }
.mkt-cov b { color: var(--text); font-weight: 500; }

/* мелкий переключатель «% / значения» в заголовке сводной панели */
.allview-toggle { position: absolute; right: 0; top: -6px; display: inline-flex; gap: 4px; }
.allview-toggle button { font-size: 10px; padding: 3px 9px; border: 1px solid var(--line); background: #fff; color: var(--mut); cursor: pointer; text-transform: none; letter-spacing: 0; }
.allview-toggle button.active { background: var(--g1); color: var(--panel); border-color: var(--g1); }

/* ---------- вкладка «Продажи» (сделки и воронки из Bitrix24) ---------- */
/* Пончик «Выручка по направлениям» использует классы .dds-donut* (см. ниже).
   Чипы направлений — .fot-filter/.fot-chip, столбцы «по периодам» —
   .chart-cols/.fot-stack/.fot-seg, сводная таблица — .data-table.fot-pivot. */
.funnel-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 1px solid var(--line); padding-top: 26px; margin-top: 6px; flex-wrap: wrap; }
.funnel-head .panel-title { margin: 0; }
.funnel-row { margin-bottom: 4px; }
.funnel-row .f-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 12.5px; margin-bottom: 6px; }
.funnel-row .f-name { font-weight: 500; }
.funnel-row .f-val { color: var(--mut); font-variant-numeric: tabular-nums; white-space: nowrap; }
.funnel-track { background: var(--soft); height: 22px; }
.funnel-fill { background: var(--g1); height: 100%; }
.funnel-fill.won { background: var(--fact); }
.funnel-fill.lost { background: #c9beb0; }
.funnel-drop { font-size: 10.5px; color: var(--mut); text-align: center; padding: 5px 0; letter-spacing: .04em; }
.funnel-conv-track { display: flex; justify-content: center; }
.funnel-foot { font-size: 11.5px; color: var(--warm); margin-top: 12px; }

.table-wrap { padding: 28px 0 0; overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.data-table th {
  font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); font-weight: 500;
  text-align: right; padding: 0 10px 12px; border-bottom: 1px solid var(--line);
}
.data-table th:first-child, .data-table td:first-child { text-align: left; }
.data-table td { font-size: 12.5px; text-align: right; padding: 12px 10px; border-bottom: 1px solid var(--soft); font-variant-numeric: tabular-nums; }
.data-table tr:hover td { background: #eeeae2; }
.data-table tfoot td { border-top: 1px solid var(--line); border-bottom: none; font-weight: 500; padding-top: 14px; }

/* таблица ФОТ: строка на месяц, колонки — направления */
.data-table.fot-pivot th { vertical-align: bottom; }
.data-table.fot-pivot th.dir { min-width: 88px; white-space: normal; line-height: 1.35; }
.fot-th-tick { display: block; width: 16px; height: 3px; border-radius: 1px; margin: 0 0 6px auto; }
.data-table.fot-pivot td.mut { color: var(--mut); }
.data-table.fot-pivot td.col-hl { background: rgba(182, 130, 53, 0.07); }
.data-table.fot-pivot tr:hover td.col-hl { background: rgba(182, 130, 53, 0.12); }

.top-actions { display: flex; align-items: center; gap: 10px; font-size: 11px; color: var(--mut); }
.user-badge { padding: 8px 12px; border: 1px solid var(--line); background: var(--panel); font-size: 11.5px; }
.logout-btn { background: none; border: none; color: var(--mut); cursor: pointer; font-size: 11.5px; text-decoration: underline; padding: 0; }

/* ---------- Платёжный календарь ---------- */

.value-plan { color: var(--g1); font-weight: 500; }
.value-fact { color: var(--fact); font-weight: 500; }
.value-fot { color: var(--g1); font-weight: 500; }

/* легенда план/факт и сводка «за период» — используются также на «ДДС», «ФОТ», «Маркетинге» */
.legend { display: flex; gap: 20px; align-items: center; font-size: 11.5px; color: var(--mut); margin: 28px 0 10px; flex-wrap: wrap; }
.legend .dot { width: 9px; height: 9px; display: inline-block; margin-right: 7px; border-radius: 1px; vertical-align: middle; }
.legend .dot.plan { background: var(--g1); }
.legend .dot.fact { background: var(--fact); }
.legend .dot.fot { background: var(--g1); }
.cal-summary { display: flex; gap: 40px; padding: 18px 0 8px; border-top: 1px solid var(--line); margin-top: 4px; flex-wrap: wrap; }
.cal-summary .item .label { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); margin-bottom: 6px; }
.cal-summary .item .val { font-size: 18px; font-variant-numeric: tabular-nums; font-weight: 300; }

/* строка над содержимым: переключатель «График / Календарь», навигация календаря, буфер */
.pc-viewrow { display: flex; align-items: center; gap: 12px; padding: 20px 0 4px; flex-wrap: wrap; }
.pc-viewrow .mode-toggle { background: #fff; }
.pc-calnav { display: flex; align-items: center; gap: 8px; }
.pc-caltitle { font-size: 13px; font-weight: 500; min-width: 150px; text-align: center; }
.pc-buf { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--mut); white-space: nowrap; }
.pc-buf > span { cursor: help; border-bottom: 1px dotted var(--mut); }
.pc-buf input { width: 118px; padding: 8px 10px; border: 1px solid var(--line); background: var(--panel); font-size: 12px; text-align: right; font-variant-numeric: tabular-nums; color: var(--text); }
.pc-buf input:focus { outline: none; border-color: var(--g2); }
.pc-buf input:disabled { color: var(--mut); background: var(--soft); }

/* KPI-ряд платёжного календаря: карточка-статус + 4 показателя */
.kpi-row.pc-kpi-row { grid-template-columns: 1.15fr 1fr 1fr 1fr 1fr; padding: 20px 0 26px; }
@media (max-width: 900px) { .kpi-row.pc-kpi-row { grid-template-columns: 1fr 1fr 1fr; } .kpi-row.pc-kpi-row .kpi.pc-status { grid-column: 1 / -1; } }

/* строка-шапка над KPI: какой период и где граница факт/план */
.pc-period-cap { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 14px 26px 0; font-size: 12px; color: var(--mut); }
.pc-period-cap b { color: var(--text); font-weight: 600; }
.pc-period-cap .div { color: var(--line); }
.pc-period-cap .fd, .pc-period-cap .pd { display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 5px; }
.pc-period-cap .fd { background: var(--fact); }
.pc-period-cap .pd { background: var(--g1); }

/* карточки «Поступления»/«Расходы»: сумма разбита на факт и план */
.kpi-split { display: flex; flex-direction: column; gap: 4px; margin-top: 11px; }
.kpi-split .row { display: flex; align-items: baseline; gap: 7px; font-variant-numeric: tabular-nums; }
.kpi-split .row .dot { width: 6px; height: 6px; border-radius: 50%; flex: none; }
.kpi-split .row.fact .dot { background: var(--fact); }
.kpi-split .row.plan .dot { background: var(--g1); }
.kpi-split .row .lbl { font-size: 10.5px; color: var(--mut); width: 34px; flex: none; }
.kpi-split .row .val { font-size: 15px; font-weight: 500; }
.kpi-split .total { font-size: 20px; font-weight: 300; margin-top: 2px; padding-top: 7px; border-top: 1px solid var(--line); }
.kpi-split .total .n { font-size: 11px; color: var(--mut); font-weight: 400; }

/* KPI-ряд ДДС: остаток на начало/приход/расход/остаток на конец/чистый поток */
.kpi-row.dds-kpi-row { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 900px) { .kpi-row.dds-kpi-row { grid-template-columns: repeat(2, 1fr); row-gap: 20px; } .kpi-row.dds-kpi-row .kpi { border-right: none; } }

/* карточка-статус первой в ряду KPI */
.kpi.pc-status { border-right: none; cursor: pointer; padding: 14px 18px; display: flex; flex-direction: column; justify-content: center; border: 1px solid transparent; }
.kpi.pc-status .s-mark { font-size: 10.5px; letter-spacing: .11em; text-transform: uppercase; font-weight: 600; }
.kpi.pc-status .s-phrase { font-size: 15px; font-weight: 500; line-height: 1.3; margin-top: 8px; }
.kpi.pc-status .s-go { font-size: 11px; margin-top: 9px; opacity: .75; }
.kpi.pc-status.s-ok   { background: var(--ok-bg);     border-color: #c7d6ba; color: #33502a; }
.kpi.pc-status.s-warn { background: var(--pcwarn-bg); border-color: #e6d3a8; color: #6f4d15; }
.kpi.pc-status.s-bad  { background: var(--bad-bg);    border-color: #e6c3b8; color: #6f2417; }
.kpi.pc-status.s-past { background: var(--soft);      border-color: var(--line); color: var(--mut); }
.kpi.pc-status:hover { filter: brightness(.98); }

/* раннвей */
.pc-rw-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 8px; flex-wrap: wrap; }
.pc-rw-title { font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); font-weight: 500; margin-bottom: 4px; }
.pc-rw-sub { font-size: 11px; color: var(--mut); }
.pc-rw-zoom { display: flex; gap: 6px; flex: none; }
.pc-rw-zoom button { border: 1px solid var(--line); background: #fff; color: var(--text); cursor: pointer; font-size: 12px; padding: 6px 11px; }
.pc-rw-zoom button:hover { border-color: var(--g2); }
.pc-rw-zoom button[disabled] { opacity: .4; cursor: default; }
.pc-rw-wrap { position: relative; display: flex; align-items: flex-start; }
.pc-yax { width: 66px; height: 240px; flex: none; display: block; }
.pc-yax text { font-size: 10px; fill: var(--mut); font-variant-numeric: tabular-nums; }
.pc-yax line { stroke: var(--line); }
.pc-rw-scroll { flex: 1; min-width: 0; height: 240px; overflow: hidden; border: 1px solid var(--soft); background: #fff; }
.pc-rw-svg { display: block; height: 240px; width: 100%; cursor: grab; }
.pc-rw-svg.grabbing { cursor: grabbing; }
.pc-rw-svg .grid { stroke: #efece6; }
.pc-rw-svg .buffer { fill: rgba(154, 107, 31, .09); }
.pc-rw-svg .below { fill: rgba(154, 52, 35, .14); }
.pc-rw-svg .zero { stroke: var(--line); }
.pc-rw-svg .bufline { stroke: #c9a86a; stroke-dasharray: 4 3; }
.pc-rw-svg .today { stroke: var(--mut); stroke-dasharray: 2 3; }
.pc-rw-svg .factline { stroke: var(--pcwarn); stroke-dasharray: 2 2; }
.pc-rw-svg .factlbl { font-size: 9px; fill: var(--pcwarn); }
.pc-rw-svg .bk { stroke: #eeeae2; }
.pc-rw-svg .bklabel { font-size: 10px; fill: var(--mut); }
.pc-rw-svg .line-fact { fill: none; stroke: var(--fact); stroke-width: 2; }
.pc-rw-svg .line-plan { fill: none; stroke: var(--g1); stroke-width: 2; stroke-dasharray: 5 3; }
.pc-rw-svg .mindot { fill: var(--bad); }
.pc-rw-svg .minlbl { font-size: 10px; fill: var(--bad); font-weight: 600; }
.pc-rw-svg .hline { stroke: var(--g2); }
.pc-rw-svg .hdot { fill: var(--g1); }
.pc-rw-tip { position: absolute; z-index: 20; pointer-events: none; background: #2b2823; color: #f3efe6; font-size: 11px; line-height: 1.55; padding: 8px 11px; border-radius: 2px; box-shadow: 0 4px 14px rgba(0, 0, 0, .22); white-space: nowrap; }
.pc-rw-tip b { color: #fff; font-weight: 600; }
.pc-rw-tip .r { color: #d9cbb2; }
.pc-rw-tip .neg { color: #f0a58f; }
.pc-legend { display: flex; gap: 18px; align-items: center; font-size: 11px; color: var(--mut); margin-top: 10px; flex-wrap: wrap; }
.pc-legend .solid { display: inline-block; width: 14px; border-top: 2px solid var(--fact); margin-right: 6px; vertical-align: middle; }
.pc-legend .dash { display: inline-block; width: 14px; border-top: 2px dashed var(--g1); margin-right: 6px; vertical-align: middle; }
.pc-legend .sw { display: inline-block; width: 12px; height: 10px; margin-right: 6px; vertical-align: middle; }

/* таблица по бакетам */
.pc-bk-table { width: 100%; border-collapse: collapse; margin-top: 24px; }
.pc-bk-table th { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); font-weight: 500; text-align: right; padding: 0 12px 12px; border-bottom: 1px solid var(--line); }
.pc-bk-table th:first-child { text-align: left; }
.pc-bk-table td { font-size: 12.5px; text-align: right; padding: 9px 12px; border-bottom: 1px solid var(--soft); font-variant-numeric: tabular-nums; }
.pc-bk-table td:first-child { text-align: left; }
.pc-bk-table tr.row { cursor: pointer; }
.pc-bk-table tr.row:hover td { background: #eeeae2; }
.pc-bk-table tr.lvl1 td:first-child { padding-left: 30px; }
.pc-bk-table tr.lvl2 td:first-child { padding-left: 50px; }
.pc-bk-table tr.lvl2 td { color: #4a453d; }
.pc-bk-table tr.pay td { background: #f5f3f0; font-size: 12px; color: #4a453d; cursor: default; }
.pc-bk-table tr.pay td:first-child { padding-left: 70px; }
.pc-bk-table tr.red > td { background: #f8ece8; }
.pc-bk-table tr.red.row:hover > td { background: #f3e2dc; }
.pc-bk-table tr.amber > td { background: #f8f1e2; }
.pc-bk-table tr.flash > td { animation: pcflash 1.6s ease; }
@keyframes pcflash { 0%,100% { background: transparent; } 15%,50% { background: #f6e4bf; } }
.pc-caret { display: inline-block; width: 12px; color: var(--mut); font-size: 9px; }
.pc-st { display: inline-block; width: 9px; height: 9px; border-radius: 50%; }
.pc-st.g { background: var(--ok); } .pc-st.a { background: var(--pcwarn); } .pc-st.r { background: var(--bad); }
.pc-t-in { color: var(--in); } .pc-t-out { color: var(--fact); }
.pc-neg { color: var(--bad); font-weight: 500; }
.pc-bk-table td.stcell { cursor: help; }

/* нижний раздел «Подробности» */
.pc-details { margin-top: 26px; border-top: 1px solid var(--line); }
.pc-details-head { width: 100%; text-align: left; background: none; border: none; cursor: pointer; padding: 16px 0 14px; font-size: 10.5px; letter-spacing: .13em; text-transform: uppercase; color: var(--mut); font-weight: 600; display: flex; align-items: center; gap: 8px; }
.pc-details-head:hover { color: var(--text); }
.pc-details-body { padding-bottom: 20px; }
.pc-d-summary { font-size: 12.5px; line-height: 1.7; color: var(--text); }
.pc-d-summary b { font-weight: 600; }
.pc-d-summary .lnk { color: var(--g1); cursor: pointer; border-bottom: 1px dotted var(--g1); }
.pc-gap { border-left: 3px solid var(--bad); background: #f9ece8; padding: 12px 16px; margin-bottom: 10px; cursor: pointer; }
.pc-gap:hover { background: #f5e2db; }
.pc-gap .g1 { font-size: 13px; font-weight: 500; color: #6f2417; }
.pc-gap .g2 { font-size: 11.5px; color: var(--mut); margin-top: 5px; line-height: 1.6; }

/* вид «Календарь» */
.pc-cal-wd { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; margin-top: 14px; }
.pc-cal-wd span { text-align: center; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); padding-bottom: 8px; }
.pc-cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.pc-cal-day { background: var(--panel); min-height: 92px; padding: 8px; display: flex; flex-direction: column; gap: 3px; position: relative; }
.pc-cal-day.outside { opacity: .4; }
.pc-cal-day.past { background: #f5f3f0; }
.pc-cal-day.pending { background: repeating-linear-gradient(45deg, #f5f3f0, #f5f3f0 5px, #efe7d9 5px, #efe7d9 7px); cursor: help; }
.pc-cal-day.pending .pc-cal-badge { color: var(--pcwarn); }
.pc-cal-day.today .pc-cal-num { color: var(--g1); font-weight: 700; }
.pc-cal-day.below { box-shadow: inset 0 0 0 2px rgba(154, 52, 35, .35); }
.pc-cal-num { font-size: 12px; }
.pc-cal-in { font-size: 11px; color: var(--in); font-weight: 500; font-variant-numeric: tabular-nums; }
.pc-cal-out { font-size: 11px; color: var(--fact); font-weight: 500; font-variant-numeric: tabular-nums; }
.pc-cal-bal { font-size: 10px; color: var(--mut); margin-top: auto; font-variant-numeric: tabular-nums; }
.pc-cal-bal.neg { color: var(--bad); }
.pc-cal-badge { position: absolute; top: 6px; right: 7px; font-size: 8.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--mut); }
.pc-cal-legend { font-size: 11px; color: var(--mut); margin-top: 12px; }

/* общий тултип по data-tip */
.pc-tip { position: fixed; z-index: 60; pointer-events: none; background: #2b2823; color: #f3efe6; font-size: 11px; line-height: 1.5; padding: 8px 11px; border-radius: 2px; box-shadow: 0 4px 14px rgba(0, 0, 0, .22); max-width: 280px; }

/* ---------- вкладка «ДДС»: пончик структуры расходов ---------- */
.dds-donut { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.dds-donut-svg { width: 176px; height: 176px; flex: none; }
.dds-legend { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 10px; }
.dds-legend-row { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto auto; align-items: center; column-gap: 12px; font-size: 12px; }
.dds-legend-dot { width: 9px; height: 9px; border-radius: 1px; }
.dds-legend-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dds-legend-val { color: var(--mut); font-variant-numeric: tabular-nums; }
.dds-legend-pct { color: var(--mut); font-variant-numeric: tabular-nums; min-width: 46px; text-align: right; }

@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

@media (max-width: 720px) {
  .kpi-row { grid-template-columns: repeat(2, 1fr); row-gap: 20px; }
  .kpi { border-right: none; padding: 0 12px; }
  .content-grid { grid-template-columns: 1fr; }
  .panel, .panel:last-child { padding: 24px 0; border-right: none; border-bottom: 1px solid var(--line); }
}

/* ---------- Экран «Настройки» (значения из .env + пользователи) ---------- */
/* Раньше было всплывающее окно; теперь — восьмой внутренний экран: та же общая
   шапка, строка вкладок скрыта, слева список разделов. */

#settingsBtn svg { width: 16px; height: 16px; display: block; }

.set-top { padding: 16px 0 12px; }
.set-back {
  display: inline-flex; align-items: center; gap: 7px;
  border: none; background: none; padding: 0; cursor: pointer;
  font: inherit; font-size: 12px; color: #8f6428;
}
.set-back:hover { color: #6f4d1f; }

.settings-guard {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 12px 16px; margin-bottom: 12px; background: #f6ece0; border: 1px solid var(--g3);
  font-size: 12px; color: var(--warm);
}
.settings-guard b { font-weight: 600; }
.settings-guard-sp { flex: 1; }
.settings-guard button { padding: 6px 11px; font-size: 11.5px; border: 1px solid var(--g2); background: #fff; color: var(--text); cursor: pointer; }
.settings-guard button.stay { background: var(--g1); color: #fff; border-color: var(--g1); }

.set-shell {
  display: grid; grid-template-columns: 212px 1fr;
  border: 1px solid var(--line); background: var(--panel);
  box-shadow: 0 24px 60px -20px rgba(32, 31, 29, .14); min-height: 520px;
}
.set-nav { border-right: 1px solid var(--line); padding: 14px 0; }
.set-nav-h { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--mut); font-weight: 600; padding: 6px 20px 10px; }
.set-nav button {
  display: block; width: 100%; text-align: left; padding: 10px 20px;
  border: none; border-left: 2px solid transparent; background: none;
  font: inherit; font-size: 12.5px; color: var(--text); cursor: pointer;
}
.set-nav button:hover { background: #f2ede3; }
.set-nav button.on { border-left-color: var(--g1); background: #f5efe2; font-weight: 600; }

.set-pane { padding: 24px 28px 30px; min-width: 0; }
.set-pane h2 { font-size: 16px; font-weight: 600; margin: 2px 0 4px; }
.set-pane h3 { font-size: 12.5px; font-weight: 600; margin: 0 0 14px; }
.set-lead { font-size: 11.5px; color: var(--mut); line-height: 1.55; margin-bottom: 20px; max-width: 560px; }
.set-pane .settings-body { padding: 0; }

.settings-body { overflow-y: auto; }
.settings-loading { padding: 30px 0; text-align: center; color: var(--mut); font-size: 12px; }

@media (max-width: 720px) {
  .set-shell { grid-template-columns: 1fr; }
  .set-nav { border-right: none; border-bottom: 1px solid var(--line); }
  .set-nav button { border-left: none; border-bottom: 2px solid transparent; }
  .set-nav button.on { border-left: none; border-bottom-color: var(--g1); }
}

/* --- раздел «Пользователи» --- */
.usr-table { width: 100%; border-collapse: collapse; margin-bottom: 8px; font-size: 12px; }
.usr-table th { text-align: left; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); font-weight: 600; padding: 8px 10px; border-bottom: 1px solid var(--line); }
.usr-table td { padding: 11px 10px; border-bottom: 1px solid var(--soft); vertical-align: top; }
.usr-email { font-weight: 500; }
.usr-sub { font-size: 10.5px; color: var(--mut); margin-top: 3px; }
.role-pill { display: inline-block; font-size: 10px; letter-spacing: .04em; padding: 3px 8px; border: 1px solid var(--line); background: #fff; color: var(--mut); }
.role-pill.admin { border-color: var(--g2); background: #f7f0e3; color: var(--g1); }
.role-pill.editor { border-color: #b9c6ac; background: var(--ok-bg); color: var(--ok); }
.usr-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.mini-btn { font: inherit; font-size: 11px; padding: 6px 10px; border: 1px solid var(--line); background: #fff; color: var(--text); cursor: pointer; }
.mini-btn:hover { border-color: var(--g2); }
.mini-btn.danger { color: var(--bad); }
.mini-btn.danger:hover { border-color: var(--bad); background: var(--bad-bg); }
.mini-btn:disabled { opacity: .4; cursor: not-allowed; }

.usr-edit { background: #f7f4ee; }
.usr-edit .usr-email { margin-bottom: 10px; }
.usr-edit-actions { display: flex; gap: 8px; margin-top: 14px; }

.pw-chip { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 14px 0 6px; padding: 12px 14px; background: #f6ece0; border: 1px solid var(--g3); }
.pw-chip .lbl { font-size: 11px; color: var(--warm); }
.pw-chip code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 14px; letter-spacing: .12em; background: #fff; border: 1px solid var(--g3); padding: 4px 10px; color: var(--text); }
.pw-chip button { font: inherit; font-size: 11px; padding: 5px 10px; border: 1px solid var(--g2); background: #fff; cursor: pointer; }
.pw-chip .pw-done { font-size: 11px; color: var(--ok); }

.add-box { margin-top: 22px; border: 1px solid var(--line); background: #fff; padding: 18px 18px 20px; max-width: 620px; }
.add-row { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; }
.add-row label { display: flex; flex-direction: column; gap: 5px; font-size: 11px; color: var(--mut); }
.add-row input, .add-row select { font: inherit; font-size: 12.5px; padding: 8px 10px; border: 1px solid var(--line); background: #fff; color: var(--text); min-width: 200px; }
.add-row input:focus, .add-row select:focus { outline: none; border-color: var(--g2); }
.add-btn { padding: 9px 16px; background: var(--g1); color: #fff; border: none; font: inherit; font-size: 12.5px; font-weight: 500; cursor: pointer; }
.add-btn:hover { background: #8f6428; }
.add-btn:disabled { opacity: .5; cursor: default; }
.sec-pick { margin-top: 16px; }
.sec-pick .cap { font-size: 11px; color: var(--mut); margin-bottom: 8px; }
.sec-grid { display: flex; flex-wrap: wrap; gap: 10px 20px; }
.sec-grid label { display: flex; flex-direction: row; align-items: center; gap: 9px; font-size: 12px; color: var(--text); cursor: pointer; }

/* Флаги доступа к разделам — в виде переключателей (тумблеров). Разметка
   остаётся <input type="checkbox">, меняется только вид. Скоуп — только .sec-grid. */
.sec-grid input[type="checkbox"] {
  appearance: none; -webkit-appearance: none; margin: 0; flex: none;
  position: relative; width: 34px; height: 18px; border-radius: 999px;
  background: var(--line); border: 1px solid var(--line); cursor: pointer;
  transition: background .15s, border-color .15s;
}
.sec-grid input[type="checkbox"]::after {
  content: ""; position: absolute; top: 1px; left: 1px; width: 14px; height: 14px;
  border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(32, 31, 29, .25);
  transition: transform .15s;
}
.sec-grid input[type="checkbox"]:checked { background: var(--g1); border-color: var(--g1); }
.sec-grid input[type="checkbox"]:checked::after { transform: translateX(16px); }
.sec-grid input[type="checkbox"]:focus-visible { outline: 2px solid var(--g2); outline-offset: 2px; }
.hint { font-size: 10.5px; color: var(--mut); margin-top: 10px; line-height: 1.5; }
.usr-err { font-size: 11.5px; color: var(--bad); background: var(--bad-bg); border: 1px solid #e3b7ac; padding: 8px 10px; margin-bottom: 12px; }

.st-row { padding: 16px 0; border-bottom: 1px solid var(--soft); }
.st-row:last-child { border-bottom: none; }
.st-label { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 9px; }
.st-name { font-size: 12.5px; font-weight: 600; letter-spacing: .01em; }

.st-info {
  position: relative; width: 15px; height: 15px; flex: none;
  border: 1px solid #c6c0b4; border-radius: 50%; color: var(--mut);
  font-size: 10px; display: flex; align-items: center; justify-content: center;
  cursor: help; font-family: Georgia, "Times New Roman", serif; font-style: italic;
}
.st-info:hover, .st-info:focus-visible { border-color: var(--g1); color: var(--g1); outline: none; }
.st-tip {
  position: absolute; top: calc(100% + 8px); left: -6px; width: 270px;
  background: var(--text); color: #f3efe8; font-size: 11.5px; line-height: 1.5;
  padding: 10px 12px; letter-spacing: .01em; z-index: 5;
  font-family: "PT Sans", sans-serif; font-style: normal; font-weight: 400;
  opacity: 0; visibility: hidden; transform: translateY(-3px); transition: opacity .13s, transform .13s;
}
.st-tip::before { content: ""; position: absolute; bottom: 100%; left: 10px; border: 6px solid transparent; border-bottom-color: var(--text); }
.st-info:hover .st-tip, .st-info:focus-visible .st-tip { opacity: 1; visibility: visible; transform: translateY(0); }
.st-row:nth-last-child(-n+2) .st-tip { top: auto; bottom: calc(100% + 8px); }
.st-row:nth-last-child(-n+2) .st-tip::before { bottom: auto; top: 100%; border-bottom-color: transparent; border-top-color: var(--text); }

.st-tag { font-size: 9.5px; letter-spacing: .07em; text-transform: uppercase; font-weight: 600; padding: 2px 6px; border: 1px solid var(--g3); color: var(--g1); background: #f7f0e3; }
.st-tag.changed { border-color: var(--warm); color: var(--warm); background: #f6e9e2; }

.st-control { display: flex; align-items: stretch; gap: 8px; }
.st-val {
  flex: 1; min-width: 0; font-size: 12px; letter-spacing: .02em;
  font-family: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;
  padding: 9px 11px; border: 1px solid var(--line); background: #fff; color: var(--text);
}
.st-val:read-only { background: #f4f2ef; color: var(--mut); cursor: default; }
.st-val.empty { font-family: "PT Sans", sans-serif; font-style: italic; color: #a49b8b; }
.st-val:focus { outline: none; border-color: var(--g2); }

.st-eye { width: 36px; flex: none; border: 1px solid var(--line); background: #fff; color: var(--mut); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.st-eye:hover { border-color: var(--g2); color: var(--text); }
.st-eye svg { width: 16px; height: 16px; }

.st-save { flex: none; padding: 0 15px; font-size: 11.5px; font-weight: 500; border: 1px solid var(--g1); background: var(--g1); color: #fff; cursor: pointer; }
.st-save:disabled { background: var(--soft); border-color: var(--line); color: #a49b8b; cursor: default; }
.st-save.saved { background: #5c7a4a; border-color: #5c7a4a; }

.st-foot-row { display: flex; align-items: center; gap: 14px; margin-top: 8px; min-height: 14px; }

.help-row { padding: 16px 0; border-bottom: 1px solid var(--soft); }
.help-row:last-child { border-bottom: none; }
.help-row-h { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.help-row-name { font-size: 12.5px; font-weight: 600; letter-spacing: .01em; margin-right: auto; }
.help-bold-btn {
  width: 28px; height: 28px; border: 1px solid var(--line); background: #fff; color: var(--text);
  cursor: pointer; font-size: 12px;
}
.help-bold-btn:hover { border-color: var(--g2); }
.help-row-h .st-save { padding: 7px 15px; }
.help-saved-msg { font-size: 11px; color: #5c7a4a; }
.help-textarea {
  width: 100%; min-height: 78px; font-family: inherit; font-size: 12.5px; line-height: 1.55;
  padding: 9px 11px; border: 1px solid var(--line); background: #fff; color: var(--text); resize: vertical;
}
.help-textarea:focus { outline: none; border-color: var(--g2); }
.st-undo { background: none; border: none; padding: 0; font-size: 11px; color: #8f6428; text-decoration: underline; cursor: pointer; }
.st-msg { font-size: 11px; color: #5c7a4a; opacity: 0; transition: opacity .15s; }
.st-msg.show { opacity: 1; }
.st-note { font-size: 10.5px; color: var(--mut); }

.settings-foot { padding: 14px 24px 18px; border-top: 1px solid var(--line); font-size: 11px; color: var(--mut); line-height: 1.5; }
.settings-foot b { color: var(--text); font-weight: 600; }

.ref-note { display: flex; gap: 10px; align-items: flex-start; padding: 11px 14px; margin-bottom: 20px; background: #f6ece0; border: 1px solid var(--g3); font-size: 11.5px; line-height: 1.55; color: var(--warm); max-width: 640px; }
.ref-note b { font-weight: 600; }

.tab-rows { max-width: 620px; border-top: 1px solid var(--soft); }
.tab-row { display: flex; align-items: center; gap: 14px; padding: 13px 2px; border-bottom: 1px solid var(--soft); }
.tab-row-name { flex: 1; min-width: 0; display: flex; align-items: center; gap: 9px; font-size: 13px; }
.tab-row.disabled .tab-row-name { color: var(--mut); }
.tab-row-status { font-size: 11px; color: var(--mut); width: 74px; flex: none; }
.tab-row-status.on { color: #5c7a4a; }
.tab-row-saved { font-size: 10.5px; color: #5c7a4a; width: 66px; flex: none; opacity: 0; transition: opacity .25s; }
.tab-row-saved.show { opacity: 1; }
.tab-row-dragging { opacity: .45; }
.tab-row.tab-drop-before { box-shadow: inset 0 2px 0 0 var(--g1); }
.tab-row.tab-drop-after { box-shadow: inset 0 -2px 0 0 var(--g1); }

.switch { position: relative; display: inline-block; width: 34px; height: 19px; flex: none; }
.switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.switch .track { position: absolute; inset: 0; background: var(--soft); border: 1px solid var(--line); transition: background .15s, border-color .15s; }
.switch .thumb { position: absolute; top: 2px; left: 2px; width: 13px; height: 13px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.switch input:checked + .track { background: var(--g1); border-color: var(--g1); }
.switch input:checked + .track .thumb { transform: translateX(15px); }
.switch input:focus-visible + .track { outline: 2px solid var(--g2); outline-offset: 2px; }

.settings-toast {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(12px);
  background: var(--text); color: #f3efe8; font-size: 12px; padding: 11px 18px;
  opacity: 0; transition: opacity .2s, transform .2s; z-index: 200; pointer-events: none; max-width: 90vw;
}
.settings-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ---------- Вкладка «ОПиУ» (отчёт о прибылях и убытках) ---------- */
/* Зелёный тон прироста и терракотовый убытка — в тёплой гамме «Atlas». */
:root { --pnl-up: #4f7a3f; }
.pnl-up { color: var(--pnl-up); }
.pnl-down { color: var(--warm); }
.pnl-neg { color: var(--warm); }
.kpi-value.pnl-neg { color: var(--warm); }

/* каскад во времени */
.data-table.pnl-table { min-width: 640px; }
.data-table.pnl-table td.pnl-in { padding-left: 26px; color: var(--mut); }
.data-table.pnl-table tr.pnl-sub td {
  font-weight: 600; color: var(--text);
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
  background: rgba(182, 130, 53, 0.06);
}
.data-table.pnl-table tr.pnl-sub.pnl-net td { background: rgba(182, 130, 53, 0.13); }
.data-table.pnl-table td.pnl-total-col, .data-table.pnl-table th.pnl-total-col {
  border-left: 1px solid var(--line); font-weight: 500;
}
/* заголовок-обёртка блока (Косвенные расходы / Ниже EBITDA) */
.data-table.pnl-table tr.pnl-group td {
  font-weight: 600; color: var(--text);
  border-top: 1px solid var(--line);
  background: rgba(182, 130, 53, 0.03); letter-spacing: .02em;
}
/* строка рентабельности к выручке — мелкая, приглушённая */
.data-table.pnl-table tr.pnl-pct td { font-size: 11px; color: var(--mut); }
.data-table.pnl-table tr.pnl-pct td:first-child { font-style: italic; }
.pnl-dp { display: block; font-size: 10px; color: var(--mut); margin-top: 2px; }

/* KPI-ряд вкладки «ОПиУ» — пять карточек */
.kpi-row.pnl-kpi-row { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 900px) { .kpi-row.pnl-kpi-row { grid-template-columns: repeat(3, 1fr); row-gap: 20px; } }

/* столбцы «уровень по периодам» */
.pnl-col-wrap { flex: 1; display: flex; align-items: flex-end; justify-content: center; height: 100%; }
.pnl-col { width: 58%; max-width: 30px; background: var(--g1); min-height: 1px; }
.pnl-col.loss { background: var(--warm); opacity: .55; }
.pnl-col-labels { display: flex; gap: 8px; margin-top: 9px; border-top: 1px solid var(--line); padding-top: 9px; }
.pnl-col-labels > span { flex: 1; text-align: center; font-size: 10.5px; color: var(--mut); line-height: 1.45; }
.pnl-col-labels > span > span { display: block; }

/* «за счёт чего изменилась прибыль» — вклад видов */
.pnl-contrib-head { font-size: 11.5px; color: var(--mut); margin-bottom: 14px; line-height: 1.5; }
.pnl-contrib-head b { color: var(--text); font-weight: 500; }
.pnl-contrib-row { display: grid; grid-template-columns: 160px 1fr 110px; align-items: center; column-gap: 10px; font-size: 12px; margin-bottom: 7px; }
.pnl-contrib-name { color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pnl-contrib-track { position: relative; height: 14px; background: linear-gradient(var(--soft), var(--soft)) center / 1px 100% no-repeat; }
.pnl-contrib-bar { position: absolute; top: 0; height: 100%; }
.pnl-contrib-bar.pos { left: 50%; background: var(--pnl-up); }
.pnl-contrib-bar.neg { right: 50%; background: var(--warm); }
.pnl-contrib-val { text-align: right; font-variant-numeric: tabular-nums; }
.pnl-contrib-total { display: flex; justify-content: space-between; font-weight: 600; font-size: 12.5px; border-top: 1px solid var(--line); margin-top: 12px; padding-top: 11px; }

/* разрез по направлениям */
.pnl-dir-row { margin-bottom: 15px; }
.pnl-dir-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 12.5px; margin-bottom: 6px; }
.pnl-dir-name { font-weight: 500; display: flex; align-items: center; gap: 8px; }
.pnl-dir-tick { width: 3px; height: 12px; border-radius: 1px; flex: none; }
.pnl-dir-val { color: var(--mut); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pnl-dir-bar { position: relative; height: 15px; background: var(--soft); }
.pnl-dir-fill { position: absolute; left: 0; top: 0; height: 100%; background: var(--g1); }
.pnl-dir-fill.loss { background: var(--warm); }
.pnl-dir-foot { display: flex; justify-content: space-between; font-size: 12.5px; font-weight: 600; border-top: 1px solid var(--line); margin-top: 6px; padding-top: 12px; }

/* ---------- Вкладка «Плановые данные» (бюджетная матрица) ---------- */

.control-btn.primary { background: var(--g1); border-color: var(--g1); color: #fff; }
.control-btn.primary:hover { background: #8f6428; border-color: #8f6428; }

.pl-intro { font-size: 12.5px; color: var(--mut); line-height: 1.7; padding: 26px 0 4px; max-width: 820px; }
.pl-toolrow { display: flex; align-items: center; gap: 12px; padding: 16px 0 6px; flex-wrap: wrap; }
.pl-yearnav { display: inline-flex; align-items: center; gap: 4px; }
.pl-yearnav .control-btn { padding: 7px 12px; }
.pl-year { min-width: 66px; text-align: center; font-size: 13px; font-weight: 600; }
.pl-hint { font-size: 11px; color: var(--mut); }

/* Сама обёртка — прокручиваемая область ограниченной высоты (а не просто
   overflow-x): position: sticky у шапки/первого столбца считается относительно
   ближайшего контейнера прокрутки. Раз overflow-x: auto и так делает эту обёртку
   таким контейнером, прилипание к странице (без своей высоты) не работает — оно
   должно прилипать здесь, к верху этой же прокручиваемой области. */
.pl-mx-wrap { margin-top: 12px; border: 1px solid var(--line); overflow: auto; max-height: 70vh; background: var(--panel); }
table.pl-mx { border-collapse: collapse; width: 100%; min-width: 1120px; }
table.pl-mx th, table.pl-mx td { font-size: 12px; padding: 8px 10px; border-bottom: 1px solid var(--soft); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
table.pl-mx thead th { position: sticky; top: 0; background: #efece6; z-index: 3; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); font-weight: 600; border-bottom: 1px solid var(--line); }
table.pl-mx th.c0, table.pl-mx td.c0 { text-align: left; position: sticky; left: 0; background: var(--panel); z-index: 2; min-width: 250px; max-width: 250px; white-space: normal; }
table.pl-mx thead th.c0 { z-index: 4; background: #efece6; }
table.pl-mx td.pl-yr, table.pl-mx th.pl-yr { border-left: 1px solid var(--line); font-weight: 600; }
table.pl-mx td.z { color: #c4bdae; }
table.pl-mx td.pl-cell { cursor: pointer; }
table.pl-mx td.pl-cell:hover { background: #f3ead9; box-shadow: inset 0 0 0 1px var(--g3); }
table.pl-mx td.pl-cell-past { color: var(--mut); background: #f6f5f3; }
table.pl-mx td.pl-cell-past:hover { background: #efece8; box-shadow: none; }
table.pl-mx tr.pl-sec td { background: #efe9dd; font-weight: 600; color: var(--text); border-top: 1px solid var(--line); }
table.pl-mx tr.pl-parent td.c0 { font-weight: 600; }
table.pl-mx tr.pl-total td { border-top: 2px solid var(--line); font-weight: 700; background: #f2efe9; }

.pl-tw { display: inline-block; width: 14px; color: var(--mut); font-size: 9px; cursor: pointer; }
.pl-tw-empty { cursor: default; }
.pl-grip { display: inline-block; width: 12px; color: #cabfa8; font-size: 12px; line-height: 1; cursor: grab; user-select: none; }
.pl-grip:active { cursor: grabbing; }
table.pl-mx tr[data-drag]:hover .pl-grip { color: var(--g2); }
table.pl-mx tr.pl-dragging td { opacity: .45; }
table.pl-mx tr.pl-drop-before td { box-shadow: inset 0 2px 0 0 var(--g1); }
table.pl-mx tr.pl-drop-after td { box-shadow: inset 0 -2px 0 0 var(--g1); }
table.pl-mx tr.pl-drop-into td { box-shadow: inset 0 0 0 2px var(--g1); background: #f3ead9; }
table.pl-mx tr.pl-sec-empty td { color: var(--mut); font-weight: 500; }
.pl-sec-hint { font-size: 10.5px; font-weight: 400; color: var(--mut); }
.pl-c0 { display: flex; align-items: center; gap: 5px; }
.pl-lvl1 .pl-c0 { padding-left: 16px; }
.pl-lvl2 .pl-c0 { padding-left: 34px; }
.pl-lvl3 .pl-c0 { padding-left: 52px; }
.pl-fdot { width: 7px; height: 7px; border-radius: 1px; flex: none; }
.pl-fdot.o { background: var(--fact); }
.pl-fdot.i { background: var(--in); }
.pl-arch { font-size: 9.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--mut); border: 1px solid var(--line); padding: 1px 5px; }
.pl-cname { border-bottom: 1px dotted var(--mut); cursor: help; }
.pl-sec-cap { font-size: 9px; letter-spacing: .04em; text-transform: uppercase; color: var(--mut); font-weight: 600; }

/* название раздела в матрице — кликается, «проваливается» в карточку раздела */
.pl-secname { cursor: pointer; border-bottom: 1px dashed transparent; }
.pl-secname:hover { border-bottom-color: var(--g2); }
.pl-secchev { color: var(--mut); font-size: 9px; margin-left: 6px; }
table.pl-mx tr.pl-sec-ind td.c0 .pl-secname { margin-left: 14px; }
/* заголовок блока каскада (Косвенные расходы / Ниже EBITDA / Вне ОПиУ) */
table.pl-mx tr.pl-block td { background: #e7ded0; font-weight: 700; color: var(--text);
  border-top: 2px solid var(--g2); text-transform: uppercase; letter-spacing: .05em; font-size: 10.5px; }
table.pl-mx tr.pl-block td.c0 { background: #e7ded0; }
/* строка подытога прибыли */
table.pl-mx tr.pl-subtotal td { border-top: 1px solid var(--g2); border-bottom: 1px solid var(--g2);
  font-weight: 700; background: rgba(182, 130, 53, .10); }
table.pl-mx tr.pl-subtotal td.c0 { background: rgba(182, 130, 53, .10); }
table.pl-mx td.pl-neg { color: var(--warm); }

/* карточка раздела ОПиУ */
.pl-sec-meta { font-size: 11.5px; color: var(--mut); margin: 2px 0 14px; }
.pl-radiolist { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; }
.pl-radiolist label { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 1px solid var(--line);
  background: #fff; font-size: 12.5px; color: var(--text); cursor: pointer; }
.pl-radiolist label:hover { border-color: var(--g2); }
.pl-radiolist input { width: 15px; height: 15px; accent-color: var(--g1); }
.pl-warn { margin-top: 10px; font-size: 11px; color: #9a6b1f; background: #f6ecd8; border: 1px solid #e6d3ad;
  padding: 8px 10px; line-height: 1.5; }
.pl-sec-arts { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 12px; }
.pl-sec-arts h4 { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--mut); font-weight: 600; margin: 0 0 8px; }
.pl-sec-a { display: flex; justify-content: space-between; font-size: 12.5px; padding: 6px 0; border-bottom: 1px solid var(--soft); }
.pl-sec-a span:last-child { font-variant-numeric: tabular-nums; }

/* модальные окна вкладки «Плановые данные» */
.pl-ov { position: fixed; inset: 0; z-index: 120; background: rgba(32, 31, 29, .38); display: flex; align-items: flex-start; justify-content: center; padding: 48px 18px; overflow-y: auto; }
.pl-sheet { width: 100%; max-width: 640px; background: var(--panel); border: 1px solid var(--line); box-shadow: 0 24px 60px -20px rgba(32, 31, 29, .35); display: flex; flex-direction: column; }
.pl-sheet.narrow { max-width: 460px; }
.pl-sheet.wide { max-width: 960px; }
.pl-head { display: flex; align-items: flex-start; justify-content: space-between; padding: 22px 24px 16px; border-bottom: 1px solid var(--line); }
.pl-eyebrow { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--mut); font-weight: 600; }
.pl-head h2 { font-size: 17px; font-weight: 600; margin: 6px 0 0; }
.pl-x { width: 30px; height: 30px; border: 1px solid transparent; background: none; font-size: 19px; line-height: 1; color: var(--mut); cursor: pointer; }
.pl-x:hover { border-color: var(--line); color: var(--text); }
.pl-body { padding: 18px 24px 10px; }
.pl-foot { padding: 16px 24px 20px; border-top: 1px solid var(--line); display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.pl-foot-sp { flex: 1; }
.pl-btn { padding: 9px 16px; font-size: 12px; font-weight: 500; border: 1px solid var(--line); background: #fff; color: var(--text); cursor: pointer; }
.pl-btn.primary { background: var(--g1); border-color: var(--g1); color: #fff; }
.pl-btn.primary:hover { background: #8f6428; }
.pl-btn:disabled { opacity: .45; cursor: default; }
.pl-btn.primary:disabled:hover { background: var(--g1); }

.pl-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 16px; }
.pl-form label { display: flex; flex-direction: column; gap: 6px; font-size: 11px; color: var(--mut); min-width: 0; }
.pl-form .w { grid-column: 1 / -1; }
.pl-form label.chk { flex-direction: row; align-items: center; gap: 8px; color: var(--text); font-size: 12px; }
.pl-form label i { color: var(--warm); font-style: normal; }
.pl-form input:not([type="checkbox"]), .pl-form select, .pl-form textarea { font-family: inherit; font-size: 12.5px; padding: 9px 11px; border: 1px solid var(--line); background: #fff; color: var(--text); width: 100%; min-width: 0; max-width: 100%; }
.pl-form input:focus, .pl-form select:focus, .pl-form textarea:focus { outline: none; border-color: var(--g2); }
.pl-form textarea { resize: vertical; min-height: 52px; }
.pl-note { font-size: 10.5px; color: var(--mut); line-height: 1.5; }
.pl-note .pl-lnk { font-size: 10.5px; }
.pl-repeat { border: 1px solid var(--line); background: #fff; padding: 12px 14px; display: flex; flex-direction: column; gap: 9px; }
.pl-repeat-line { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12px; color: var(--text); }
.pl-repeat-line.off { opacity: .4; pointer-events: none; }
.pl-repeat-line select, .pl-repeat-line input { font-size: 12px; padding: 7px 9px; border: 1px solid var(--line); background: #fff; width: auto; }
.pl-repeat-line input { width: 72px; }
/* Подпись со своим полем не должны переноситься порознь — иначе строка "разъезжается" */
.pl-repeat-grp { display: inline-flex; align-items: center; gap: 9px; flex-wrap: nowrap; }
.pl-seg { display: flex; border: 1px solid var(--line); background: #fff; }
.pl-seg button { flex: 1; padding: 9px 12px; font-size: 12px; background: transparent; border: none; color: var(--mut); cursor: pointer; }
.pl-seg button.on { background: var(--g1); color: #fff; font-weight: 500; }
.pl-formerr { grid-column: 1 / -1; margin-top: 12px; font-size: 12px; color: var(--bad); }

.pl-lnk { background: none; border: none; padding: 0; font-size: 11.5px; color: #8f6428; text-decoration: underline; cursor: pointer; }
.pl-lnk.mut { color: var(--mut); }
.pl-lnk:hover { color: #6f4d1f; }
.pl-acts { display: inline-flex; gap: 14px; white-space: nowrap; }

.pl-tw2 { overflow-x: auto; }
.pl-drill { width: 100%; border-collapse: collapse; min-width: 720px; }
.pl-drill th { font-size: 9.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--mut); font-weight: 500; text-align: right; padding: 0 10px 8px; white-space: nowrap; }
.pl-drill th.l, .pl-drill td.l { text-align: left; }
.pl-drill td { font-size: 12.5px; text-align: right; padding: 9px 10px; border-top: 1px solid var(--soft); font-variant-numeric: tabular-nums; }
.pl-drill td.mut { color: var(--mut); }
.pl-drill-sum { display: flex; justify-content: space-between; align-items: baseline; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); font-size: 13px; }
.pl-drill-sum b { font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---------- вкладка «Разметка ДДС» ---------- */
.ddsr-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-top: 28px; }
.ddsr-title { font-size: 17px; font-weight: 600; margin: 0 0 4px; }
.ddsr-lede { font-size: 12px; color: var(--mut); margin: 0; max-width: 60ch; }
.ddsr-kpi { text-align: right; flex: none; }
.ddsr-kpi .n { font-size: 26px; font-weight: 600; font-variant-numeric: tabular-nums; line-height: 1; }
.ddsr-kpi .n.zero { color: var(--g1); }
.ddsr-kpi .l { font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--mut); margin-top: 4px; }
.ddsr-export-btn { display: inline-block; text-decoration: none; }

.ddsr-toolbar { display: flex; align-items: center; gap: 12px; margin: 18px 0 6px; flex-wrap: wrap; }
.ddsr-sortlabel { font-size: 11px; color: var(--mut); }
.ddsr-sortbtns { display: flex; border: 1px solid var(--line); background: #fff; }
.ddsr-sortbtns button { border: none; border-right: 1px solid var(--line); background: transparent; color: var(--mut); font: inherit; font-size: 11.5px; padding: 7px 12px; cursor: pointer; }
.ddsr-sortbtns button:last-child { border-right: none; }
.ddsr-sortbtns button.on { background: rgba(182, 130, 53, .13); color: #8f6428; font-weight: 500; }
.ddsr-sortbtns button:hover:not(.on) { background: var(--soft); }
.ddsr-period { display: flex; align-items: center; gap: 6px; }
.ddsr-period input[type=date] { font: inherit; font-size: 11.5px; padding: 6px 8px; border: 1px solid var(--line); background: #fff; color: var(--text); }
.ddsr-catview { display: flex; align-items: center; gap: 10px; }

.ddsr-table { min-width: 900px; }
.ddsr-table th, .ddsr-table td { text-align: left; font-variant-numeric: normal; vertical-align: top; }
.ddsr-table th.num, .ddsr-table td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ddsr-purpose { max-width: 430px; color: var(--text); }
.ddsr-amt { font-weight: 600; font-variant-numeric: tabular-nums; }
.ddsr-amt.in { color: var(--in); }
.ddsr-amt.out { color: var(--bad); }
.ddsr-amt.tr { color: var(--mut); font-weight: 400; }

.ddsr-assign select.ddsr-catsel { font: inherit; font-size: 11.5px; padding: 6px 8px; border: 1px solid var(--line); background: #fff; color: var(--text); width: 100%; max-width: 200px; }
.ddsr-dircell { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.ddsr-dircell select.ddsr-dirsel { font: inherit; font-size: 11.5px; padding: 6px 8px; border: 1px solid var(--line); background: #fff; color: var(--text); width: 100%; max-width: 85px; }
.ddsr-rulebox { display: none; margin-top: 9px; padding: 10px 12px; background: var(--soft); border: 1px solid var(--line); max-width: 340px; }
.ddsr-rulebox.show { display: block; }
.ddsr-rq { font-size: 10px; text-transform: uppercase; letter-spacing: .07em; color: var(--mut); font-weight: 600; margin-bottom: 8px; }
.ddsr-opt { display: flex; align-items: flex-start; gap: 7px; margin-bottom: 6px; font-size: 11.5px; cursor: pointer; }
.ddsr-opt input { margin-top: 2px; }
.ddsr-opt b { color: #8f6428; font-weight: 600; }
.ddsr-ruleval { width: 100%; font: inherit; font-size: 11.5px; padding: 6px 8px; border: 1px solid var(--line); background: #fff; color: var(--text); margin: 2px 0 8px 21px; max-width: 290px; }
.ddsr-ruleval:disabled { opacity: .5; }
.ddsr-rowactions { display: flex; gap: 8px; margin-top: 9px; flex-wrap: wrap; }

.ddsr-wallets { margin-top: 34px; padding-bottom: 30px; }
.ddsr-subtitle { font-size: 12.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--mut); font-weight: 600; margin: 0 0 4px; }
.ddsr-wtable { min-width: 0; max-width: 620px; }
.ddsr-dir { color: var(--g1); font-weight: 500; }
.ref-wallets-table { max-width: 720px; }
.ref-wallet-name { min-width: 220px; }
.ref-wallet-rename-row { display: flex; gap: 6px; align-items: center; }
.ref-wallet-rename-input { font: inherit; font-size: 11.5px; padding: 6px 8px; border: 1px solid var(--line); background: #fff; color: var(--text); flex: 1; min-width: 140px; }
.ref-wallet-orig { font-size: 10.5px; margin-top: 3px; }
.ddsr-addrow { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; align-items: center; }
.ddsr-addrow input { font: inherit; font-size: 11.5px; padding: 8px 10px; border: 1px solid var(--line); background: #fff; color: var(--text); }
.ddsr-addrow input#refWalletName, .ddsr-addrow input#refBalName { flex: 1; min-width: 220px; }
.ddsr-addrow input#refWalletDir { min-width: 160px; }
.ddsr-err { font-size: 11.5px; color: var(--bad); margin-top: 8px; }

.ddsr-cand { display: flex; gap: 8px; align-items: flex-start; border: 1px solid var(--line); background: var(--soft); padding: 10px 12px; margin-bottom: 12px; font-size: 11.5px; cursor: pointer; }
.ddsr-cand input { margin-top: 2px; }
.ddsr-cand .mut { color: var(--mut); }
.ddsr-table .mut { color: var(--mut); }
.dds-missing td { background: var(--pcwarn-bg); }
.ddsr-missing-badge { font-size: 9.5px; text-transform: uppercase; letter-spacing: .04em; font-weight: 600; color: var(--pcwarn); border: 1px solid #e6d3ad; background: #fff; padding: 1px 6px; margin-left: 6px; white-space: nowrap; cursor: help; }

.pl-subtabs { display: flex; gap: 8px; align-items: center; margin-bottom: 12px; }
.pl-subtabs button[data-dv], .pl-subtabs button[data-rv] { font-size: 11.5px; padding: 7px 12px; border: 1px solid var(--line); background: #fff; color: var(--mut); cursor: pointer; }
.pl-subtabs button[data-dv].on, .pl-subtabs button[data-rv].on { background: var(--g1); border-color: var(--g1); color: #fff; }

/* ---------- «Настройки → Справочники» (данные вкладки «Кошельки» переиспользуют
   .ddsr-wallets/.ddsr-lede/.ddsr-wtable/.ddsr-addrow/.ddsr-err — те же классы,
   что и раньше в «Разметке ДДС», см. renderReferencesAdmin в app.js) ---------- */
.set-pane .ddsr-wallets { margin: 4px 0 26px; max-width: 680px; }

/* ---------- загрузка начислений по ФОТ Excel-файлом (вкладка «Выручка и ФОТ») ---------- */
.fot-up { margin: 16px 0 22px; }
.fot-up-bar { border: 1px solid var(--line); background: var(--panel); padding: 11px 14px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; transition: background .12s, border-color .12s; }
.fot-up-bar.hot { border-color: var(--g1); background: #faf3e6; }
.fot-up-bar.busy { opacity: .75; }
.fot-up-lead { font-size: 12.5px; }
.fot-up-btn { padding: 8px 14px; font-size: 12px; font-weight: 500; border: 1px solid var(--g1); background: var(--g1); color: #fff; cursor: pointer; white-space: nowrap; }
.fot-up-btn:hover { background: #8f6428; }
.fot-up-btn[disabled] { opacity: .6; cursor: default; }
.fot-up-hint { font-size: 11px; color: var(--g1); font-weight: 500; }
.fot-up-sp { flex: 1; }
.fot-up-meta { font-size: 11px; color: var(--mut); }

.fot-up-msg { margin-top: 10px; font-size: 12px; line-height: 1.6; padding: 10px 12px; border: 1px solid var(--line); display: flex; gap: 10px; align-items: flex-start; }
.fot-up-msg .mk { flex: none; font-weight: 700; font-size: 13px; line-height: 1.3; }
.fot-up-msg.ok { background: var(--ok-bg); border-color: #cfe0c2; color: #2f4a27; }
.fot-up-msg.ok .mk { color: var(--ok); }
.fot-up-msg.dup { background: var(--pcwarn-bg); border-color: #e6d3ad; color: #6b4d16; }
.fot-up-msg.dup .mk { color: var(--pcwarn); }
.fot-up-msg.err { background: var(--bad-bg); border-color: #e6c3b8; color: #7d2b1c; }
.fot-up-msg.err .mk { color: var(--bad); }
.fot-up-x { margin-left: auto; flex: none; border: none; background: none; font-size: 15px; line-height: 1; color: var(--mut); cursor: pointer; padding: 0 2px; }
.fot-up-x:hover { color: var(--text); }

.fot-jrnl { margin-top: 12px; }
.fot-jrnl > summary { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--mut); font-weight: 600; cursor: pointer; padding: 6px 0; }
.fot-jrnl table { width: 100%; border-collapse: collapse; margin-top: 6px; }
.fot-jrnl th { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); font-weight: 500; text-align: left; padding: 0 12px 9px; border-bottom: 1px solid var(--line); }
.fot-jrnl td { font-size: 12px; padding: 10px 12px; border-bottom: 1px solid var(--soft); vertical-align: top; }
.fot-jrnl td.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.fot-jrnl td b { font-weight: 600; }

/* окно сводки различий (D1) */
.fd-saved { font-size: 11.5px; line-height: 1.6; color: #2f4a27; background: var(--ok-bg); border: 1px solid #cfe0c2; padding: 10px 12px; margin-bottom: 14px; }
.fd-table { width: 100%; border-collapse: collapse; min-width: 620px; }
.fd-table th { font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--mut); font-weight: 500; text-align: left; padding: 0 10px 9px; border-bottom: 1px solid var(--line); }
.fd-table th.r, .fd-table td.r { text-align: right; font-variant-numeric: tabular-nums; }
.fd-table td { font-size: 12.5px; padding: 10px; border-bottom: 1px solid var(--soft); }
.fd-row { cursor: pointer; }
.fd-row.changed td { background: #f6ecd8; }
.fd-row.removed td { background: var(--bad-bg); }
.fd-row td.tw { text-align: center; width: 30px; }
.fd-chev { display: inline-block; color: var(--mut); font-size: 9px; transition: transform .14s; }
.fd-row.open .fd-chev { transform: rotate(90deg); }
.fd-was { color: var(--mut); text-decoration: line-through; }
.fd-now { font-weight: 600; }
.fd-now.rm { color: var(--bad); font-weight: 600; }
.fd-tag { font-size: 9px; letter-spacing: .05em; text-transform: uppercase; padding: 2px 6px; border: 1px solid var(--line); color: var(--mut); white-space: nowrap; }
.fd-tag.chg { color: var(--pcwarn); border-color: #e6d3ad; }
.fd-tag.rm { color: var(--bad); border-color: #e6c3b8; }
.fd-det > td { padding: 0; }
.fd-det > td:last-child { padding: 2px 10px 12px; }
.fd-sum { display: flex; gap: 16px; flex-wrap: wrap; font-size: 11.5px; color: var(--mut); margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.fd-sum b { color: var(--text); font-weight: 600; }

.fd-emp-empty, .fd-emp-note { font-size: 11px; color: var(--mut); padding: 6px 2px; }
.fd-emp { width: 100%; border-collapse: collapse; margin-top: 6px; }
.fd-emp th { font-size: 9px; letter-spacing: .05em; text-transform: uppercase; color: var(--mut); font-weight: 500; text-align: left; padding: 4px 8px 6px; border-bottom: 1px solid var(--soft); }
.fd-emp th.r, .fd-emp td.r { text-align: right; font-variant-numeric: tabular-nums; }
.fd-emp td { font-size: 11.5px; padding: 6px 8px; border-bottom: 1px solid var(--soft); }
.fd-emp tr:last-child td { border-bottom: none; }
.fd-emp tr.chg td { background: #fbf4e4; }
.fd-emp tr.new td { background: #eef3e6; }
.fd-emp tr.gone td { background: #f8e7e2; }
.fd-emp .fd-delta { font-weight: 600; }
.fd-emp tr.chg .fd-delta { color: var(--pcwarn); }
.fd-mut { color: var(--mut); }
.fd-badge { font-size: 8.5px; letter-spacing: .04em; text-transform: uppercase; border: 1px solid #c7d6ba; color: var(--in); padding: 1px 4px; margin-left: 4px; }