:root {
  --bg: #fbfaf8; --card: #fff; --line: #e6e2db; --ink: #1c1a17; --dim: #7a736a;
  --accent: #8a5a2b; --block: #b3261e; --warn: #a2701a; --info: #3a6b8a; --ok: #2e6b4f;
}
@media (prefers-color-scheme: dark) {
  :root { --bg:#16151a; --card:#1e1d23; --line:#33313a; --ink:#eceaf0; --dim:#9b95a5;
          --accent:#d3a06a; --block:#f2857d; --warn:#e0b25a; --info:#7fb6d6; --ok:#79c9a2; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink);
  font: 15px/1.5 -apple-system, "SF Pro Text", "Segoe UI", Roboto, sans-serif; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

header { position: sticky; top: 0; z-index: 5; background: var(--bg);
  border-bottom: 1px solid var(--line); padding: 10px 20px;
  display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
header .brand { font-weight: 650; letter-spacing: -.01em; margin-right: 6px; }
header nav { display: flex; gap: 14px; flex-wrap: wrap; }
header nav a { color: var(--dim); padding: 5px 11px; border-radius: 8px;
  transition: color .12s, background .12s; }
header nav a:hover { color: var(--ink); }
/* активный раздел: видно, где находишься, не вчитываясь */
header nav a.on { color: #fff; font-weight: 600; background: var(--accent); }
header nav a.on:hover { text-decoration: none; }
@media (prefers-color-scheme: dark) { header nav a.on { color: #17161b; } }
:root[data-theme="dark"] header nav a.on { color: #17161b; }
:root[data-theme="light"] header nav a.on { color: #fff; }
header form { margin-left: auto; }
input[type=search], input[type=text], select {
  background: var(--card); color: var(--ink); border: 1px solid var(--line);
  border-radius: 7px; padding: 6px 10px; font: inherit; min-width: 200px; }

/* поле, которое разбор не заполнил: должно бросаться в глаза, а не теряться */
input.empty { border: 2px solid var(--warn);
  background: color-mix(in srgb, var(--warn) 28%, var(--card));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--warn) 18%, transparent); }
main { padding: 22px 20px 60px; max-width: 1200px; margin: 0 auto; }
/* Стрелка «назад» — единственный выход из раздела, кроме верхнего меню.
   Серой и без рамки её не замечают, поэтому она оформлена как кнопка. */
.back { display: inline-block; color: var(--ink); font-size: 14px; font-weight: 500;
  margin-bottom: 16px; padding: 7px 14px 7px 11px; border-radius: 9px;
  border: 1px solid var(--line); background: var(--card);
  transition: background .12s, border-color .12s; }
.back:hover { text-decoration: none; border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, var(--card)); }
h1 { font-size: 21px; margin: 0 0 4px; letter-spacing: -.015em; }
h2 { font-size: 14px; text-transform: uppercase; letter-spacing: .07em;
     color: var(--dim); font-weight: 600; margin: 28px 0 10px; }
.sub { color: var(--dim); margin: 0 0 20px; }

.cards { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
.card .k { color: var(--dim); font-size: 12.5px; text-transform: uppercase; letter-spacing: .05em; }
.card .v { font-size: 22px; font-variant-numeric: tabular-nums; margin-top: 4px; letter-spacing: -.02em; }
.card .n { color: var(--dim); font-size: 13px; margin-top: 2px; }

table { width: 100%; border-collapse: collapse; background: var(--card);
  border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.scroll { overflow-x: auto; max-width: 100%; }
/* поля ужаты: у широких таблиц (продажи с ценой, НДС и прибылью) правый край
   иначе уезжает за экран и последние колонки приходится искать прокруткой */
th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .04em;
  color: var(--dim); font-weight: 600; padding: 8px 7px; border-bottom: 1px solid var(--line);
  white-space: nowrap; }
td { padding: 7px 7px; border-bottom: 1px solid var(--line); vertical-align: top; }
th:first-child, td:first-child { padding-left: 12px; }
th:last-child, td:last-child { padding-right: 12px; }
tr:last-child td { border-bottom: none; }
tbody tr:hover { background: color-mix(in srgb, var(--accent) 7%, transparent); }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
.dim { color: var(--dim); }
.big { font-size: 17px; font-weight: 600; }

.tag { display: inline-block; font-size: 11.5px; padding: 1px 7px; border-radius: 20px;
  border: 1px solid var(--line); color: var(--dim); white-space: nowrap; }
.tag.block { color: var(--block); border-color: currentColor; }
.tag.warn  { color: var(--warn);  border-color: currentColor; }
.tag.info  { color: var(--info);  border-color: currentColor; }
.tag.ok    { color: var(--ok);    border-color: currentColor; }

dl.facts { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0; }
dl.facts dt { color: var(--dim); }
dl.facts dd { margin: 0; }

.rows { display: grid; gap: 10px; }
.row { background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 11px 14px; display: flex; gap: 14px; align-items: baseline; }
.row .grow { flex: 1; min-width: 0; }
.hint { color: var(--dim); font-size: 13px; margin-top: 3px; }
.split { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.pay { color: var(--block); } .get { color: var(--ok); }

/* плашка готовности к сдаче — «Проверки» прямо в Учёте */
.banner { border-radius: 10px; padding: 12px 16px; margin: 14px 0 22px;
  border: 1px solid; line-height: 1.5; }
.banner.ok   { border-color: color-mix(in srgb, var(--ok) 45%, transparent);
               background:   color-mix(in srgb, var(--ok) 10%, transparent); }
.banner.stop { border-color: color-mix(in srgb, var(--block) 50%, transparent);
               background:   color-mix(in srgb, var(--block) 10%, transparent); }
.banner.ok   > b { color: var(--ok); }
.banner.stop > b { color: var(--block); }
.banner ul { margin: 8px 0 0; padding-left: 20px; }

/* сворачиваемые секции периода в Учёте — клик по заголовку раскрывает */
details.sec { margin: 20px 0 0; }
details.sec > summary { cursor: pointer; font-size: 20px; font-weight: 700;
  list-style: none; padding: 8px 0; border-bottom: 1px solid var(--line); }
details.sec > summary::-webkit-details-marker { display: none; }
details.sec > summary::before { content: '▸'; color: var(--dim);
  font-size: 14px; margin-right: 8px; }
details.sec[open] > summary::before { content: '▾'; }
details.sec > summary:hover { color: var(--accent); }
details.sec > *:not(summary):first-of-type { margin-top: 12px; }

/* перелистывание списков */
.pager { display: flex; align-items: center; justify-content: center; gap: 20px;
  margin: 18px 0; font-size: 14px; }
.pager a { font-weight: 600; }

/* две колонки сверки «начислено — уплачено»; на узком экране складываются */
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
@media (max-width: 1100px) { .cols { grid-template-columns: 1fr; } }

/* итоговая строка года в таблице налогов */
tr.total td { background: rgba(120,120,120,.10); border-bottom: 1px solid var(--line); }