/* ═══════════════════════════════════════════════════════════════════════
   МАКТАБ — кабинет клиента.

   Слово Бати 2026-08-16: «кабинет в стиле Каспи, только наш фон
   корпоративный», «и Диван посмотри, учти опыт обоих».

   Взято от ДИВАНА:  наш фон (радиальный градиент slate), палитра,
                     стекло blur, красный акцент #dc2626, шрифт.
   Взято от КАСПИ:   живость — карточки с мягкой тенью, цвет по СМЫСЛУ
                     у каждого раздела, чипы, подъём при наведении.

   Чего не взял у Каспи: светлый фон. У нас свой, тёмный — он и есть лицо.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  /* палитра Дивана — общая для всей семьи порталов */
  --bg:#0f172a; --bg-dno:#0a0f1c; --bg-verh:#1e293b;
  --karta:rgba(30,41,59,.62); --panel:rgba(15,23,42,.72);
  --line:rgba(148,163,184,.16);
  --txt:#e2e8f0; --dim:#94a3b8;
  --akcent:#dc2626;

  /* цвет по смыслу — приём Каспи, но приглушённый под наш тёмный фон */
  --jamarik:#2f93da;   /* таможня — синий, как их шапка */
  --mabiaat:#1a9e54;   /* продажи — зелёный, «оплачено» */
  --mahamm:#6f3cd1;    /* задачи — фиолетовый */
  --wathaiq:#ed8b00;   /* документы — янтарный */
  --talabat:#d23b3b;   /* заявки — красный */
  --svyaz:#2f93da;
  --bank:#16a34a;    /* банки — зелёный, денежный */
}

*{ box-sizing:border-box; }

html, body{
  margin:0; min-height:100%;
  font-family:-apple-system,"Segoe UI",Roboto,Inter,Arial,sans-serif;
  background: radial-gradient(1200px 700px at 20% 15%, var(--bg-verh) 0%, var(--bg) 45%, var(--bg-dno) 100%) no-repeat fixed;
  background-color: var(--bg);
  color: var(--txt);
}
/* мягкое красное свечение снизу — как на всех наших страницах */
body::before{
  content:""; position:fixed; inset:auto 0 0 0; height:40vh; pointer-events:none; z-index:0;
  background: radial-gradient(60% 100% at 50% 100%, rgba(220,38,38,.14) 0%, rgba(220,38,38,0) 70%);
}

/* ─── ШАПКА ─────────────────────────────────────────────────────────── */
.shapka{
  position:sticky; top:0; z-index:20;
  background: var(--panel);
  backdrop-filter: saturate(140%) blur(14px);
  border-bottom:1px solid var(--line);
}
.shapka-vnutri{
  max-width:1280px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; gap:20px;
  padding-top: calc(12px + env(safe-area-inset-top));
}
.logo{
  font-size:20px; font-weight:900; letter-spacing:-.5px;
  color:var(--txt); text-decoration:none; display:flex; align-items:baseline; gap:8px;
}
.logo .tochka{ color:var(--akcent); }
.logo-vyaz{ font-size:13px; font-style:normal; color:var(--dim); opacity:.75; }

.puti{ display:flex; gap:4px; flex:1; overflow-x:auto; scrollbar-width:none; }
.puti::-webkit-scrollbar{ display:none; }
.kto{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.kto-imya{ font-size:12.5px; font-weight:800; }
.kto-firma{
  font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  color:var(--dim); background:rgba(148,163,184,.12);
  padding:3px 9px; border-radius:999px;
}
.vyhod{ color:var(--dim); text-decoration:none; font-size:18px; padding:0 4px; }
.vyhod:hover{ color:var(--akcent); }

.knopka-vhod{
  margin-left:auto; padding:9px 18px; border-radius:10px;
  background:var(--akcent); color:#fff; text-decoration:none;
  font-size:13px; font-weight:800;
  box-shadow:0 4px 14px rgba(220,38,38,.3);
}
.knopka-vhod:hover{ filter:brightness(1.1); }

.polotno{ position:relative; z-index:1; max-width:1280px; margin:0 auto; padding:28px 20px 60px; }

/* ─── ПРИВЕТСТВИЕ ───────────────────────────────────────────────────── */
.privet h1{ margin:0 0 4px; font-size:26px; font-weight:900; letter-spacing:-.4px; }
.privet-pod{ margin:0 0 26px; color:var(--dim); font-size:13px; font-weight:600; }

/* ─── ПЛИТКИ РАЗДЕЛОВ (приём Каспи: цвет по смыслу) ─────────────────── */
.plitki{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.plitka{
  position:relative; display:block; text-decoration:none; color:var(--txt);
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--dim);
  border-radius:14px; padding:18px;
  transition:transform .16s, box-shadow .16s, border-color .16s;
}
.plitka:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.plitka-verh{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.plitka .znak{ font-size:24px; }
.plitka .vyaz{ font-style:normal; font-size:15px; color:var(--dim); opacity:.6; }
.plitka h2{ margin:0 0 6px; font-size:17px; font-weight:900; }
.plitka p{ margin:0 0 16px; font-size:12.5px; color:var(--dim); line-height:1.45; }
.plitka-niz{
  font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  color:var(--dim); border-top:1px solid var(--line); padding-top:10px;
}
.plitka-niz .schet{ font-size:15px; color:var(--txt); }

.plitka.jamarik{ border-top-color:var(--jamarik); }
.plitka.mabiaat{ border-top-color:var(--mabiaat); }
.plitka.mahamm { border-top-color:var(--mahamm); }
.plitka.wathaiq{ border-top-color:var(--wathaiq); }
.plitka.talabat{ border-top-color:var(--talabat); }
.plitka.svyaz  { border-top-color:var(--svyaz); }
.plitka.bank   { border-top-color:var(--bank); }
.plitka.jamarik:hover{ border-color:var(--jamarik); }
.plitka.mabiaat:hover{ border-color:var(--mabiaat); }
.plitka.mahamm:hover { border-color:var(--mahamm); }
.plitka.wathaiq:hover{ border-color:var(--wathaiq); }
.plitka.talabat:hover{ border-color:var(--talabat); }

/* ─── ВИТРИНА (для гостя) ───────────────────────────────────────────── */
.vitrina{ text-align:center; padding:56px 20px 44px; }
.vitrina h1{ margin:0 0 14px; font-size:40px; font-weight:900; letter-spacing:-1px; line-height:1.15; }
.vitrina .vydel{ color:var(--akcent); }
.vitrina-pod{ max-width:620px; margin:0 auto 28px; color:var(--dim); font-size:15px; line-height:1.6; }
.knopka-bolshaya{
  display:inline-block; padding:14px 34px; border-radius:12px;
  background:var(--akcent); color:#fff; text-decoration:none;
  font-size:15px; font-weight:800; box-shadow:0 6px 22px rgba(220,38,38,.32);
}
.knopka-bolshaya:hover{ filter:brightness(1.1); transform:translateY(-1px); }
.knopka-bolshaya.prizrak{
  background:transparent; color:var(--txt); box-shadow:none;
  border:1px solid var(--line);
}

.uslugi{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin:20px 0 50px; }
.usluga{
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-radius:14px; padding:20px;
}
.usluga .znak{ font-size:26px; display:block; margin-bottom:10px; }
.usluga h3{ margin:0 0 8px; font-size:15px; font-weight:900; }
.usluga p{ margin:0; font-size:12.5px; color:var(--dim); line-height:1.5; }

.zov{ text-align:center; padding:20px 0 40px; }
.zov p{ color:var(--dim); font-size:14px; margin:0 0 16px; }

/* ─── ВХОД ──────────────────────────────────────────────────────────── */
.vhod-okno{
  max-width:380px; margin:60px auto;
  background:var(--karta); backdrop-filter:blur(10px);
  border:1px solid var(--line); border-radius:16px; padding:32px;
  box-shadow:0 10px 40px rgba(0,0,0,.4);
}
.vhod-okno h1{ margin:0 0 6px; font-size:22px; font-weight:900; }
.vhod-pod{ margin:0 0 22px; color:var(--dim); font-size:12.5px; }
.vhod-forma{ display:flex; flex-direction:column; gap:6px; }
.vhod-forma label{
  font-size:10px; font-weight:800; text-transform:uppercase;
  letter-spacing:.06em; color:var(--dim); margin-top:10px;
}
.vhod-forma input{
  padding:12px 14px; border-radius:10px;
  border:1px solid var(--line); background:rgba(2,6,23,.45);
  color:var(--txt); font-size:16px; outline:none;   /* 16px — иначе Safari зумит */
}
.vhod-forma input:focus{ border-color:var(--akcent); box-shadow:0 0 0 3px rgba(220,38,38,.15); }
.vhod-forma button{
  margin-top:20px; padding:13px; border:0; border-radius:10px;
  background:var(--akcent); color:#fff; font-size:14px; font-weight:800; cursor:pointer;
  box-shadow:0 4px 16px rgba(220,38,38,.3);
}
.vhod-forma button:hover{ filter:brightness(1.1); }
.vhod-nizhe{ margin:20px 0 0; font-size:11.5px; color:var(--dim); text-align:center; }
.beda{
  background:rgba(210,59,59,.16); border:1px solid rgba(210,59,59,.4);
  color:#fca5a5; border-radius:10px; padding:10px 14px; font-size:12.5px; margin-bottom:14px;
}

/* ─── ШАПКА РАЗДЕЛА ─────────────────────────────────────────────────── */
.razdel-shapka{
  display:flex; align-items:center; gap:16px; margin-bottom:26px;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-left:4px solid var(--dim);
  border-radius:14px; padding:18px 22px;
}
.razdel-shapka .znak{ font-size:32px; }
.razdel-shapka h1{ margin:0 0 4px; font-size:20px; font-weight:900; }
.razdel-shapka .vyaz{ font-style:normal; font-size:14px; color:var(--dim); opacity:.6; margin-left:8px; }
.razdel-shapka p{ margin:0; font-size:12.5px; color:var(--dim); }
.razdel-shapka.jamarik{ border-left-color:var(--jamarik); }
.razdel-shapka.mabiaat{ border-left-color:var(--mabiaat); }
.razdel-shapka.mahamm { border-left-color:var(--mahamm); }
.razdel-shapka.wathaiq{ border-left-color:var(--wathaiq); }
.razdel-shapka.talabat{ border-left-color:var(--talabat); }
.razdel-shapka.idara  { border-left-color:#fbbf24; }

.pusto{ text-align:center; padding:60px 20px; color:var(--dim); }
.pusto-znak{ font-size:40px; margin:0 0 12px; opacity:.5; }
.pusto p{ margin:0 0 6px; font-size:14px; font-weight:700; }
.pusto-pod{ font-size:12.5px; font-weight:500; opacity:.8; max-width:420px; margin:0 auto; }

/* ─── ПОДВАЛ ────────────────────────────────────────────────────────── */
.podval{
  position:relative; z-index:1;
  max-width:1280px; margin:0 auto; padding:20px;
  padding-bottom: calc(20px + env(safe-area-inset-bottom));
  display:flex; justify-content:space-between; align-items:center;
  border-top:1px solid var(--line); font-size:11.5px; color:var(--dim);
}
.podval a{ color:var(--dim); text-decoration:none; }
.podval a:hover{ color:var(--txt); }

/* ─── ТЕЛЕФОН (урок Дивана: колонки не делить, а листать) ───────────── */
@media (max-width:900px){
  .plitki{ grid-template-columns:repeat(2,1fr); }
  .uslugi{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .plitki, .uslugi{ grid-template-columns:1fr; }
  .shapka-vnutri{ flex-wrap:wrap; gap:12px; }
  .puti{ order:3; flex:1 1 100%; }
  .vitrina h1{ font-size:30px; }
  .polotno{ padding:20px 14px 40px; }
}

/* ─── СТРОКИ ДЕЛ ────────────────────────────────────────────────────────
   Клиенту важно ДВА: на какой стадии его дело и когда обещали.
   Кто у нас исполнитель — не показываем: это наша кухня, ему не нужна. */
.stroki{ display:flex; flex-direction:column; gap:9px; }
.stroki.tusklo{ opacity:.6; }
.stroka{
  display:flex; align-items:center; gap:16px;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-left:3px solid var(--dim);
  border-radius:12px; padding:14px 18px;
  transition:.15s;
}
.stroka:hover{ transform:translateX(2px); border-color:rgba(148,163,184,.3); }
.stroka-glavnoe{ flex:1; min-width:0; }
.stroka-imya{ font-size:14px; font-weight:800; margin-bottom:3px; }
.stroka-opis{
  font-size:12px; color:var(--dim); line-height:1.4;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.stroka-sprava{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }

.sostoyanie{
  font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.05em;
  padding:4px 11px; border-radius:999px; white-space:nowrap;
  background:rgba(148,163,184,.16); color:var(--dim);
}
.stroka.novaya       { border-left-color:#2f93da; }
.sostoyanie.novaya   { background:rgba(47,147,218,.18); color:#7cc4f5; }
.stroka.utochnenie   { border-left-color:#ed8b00; }
.sostoyanie.utochnenie{ background:rgba(237,139,0,.18); color:#fbbf24; }
.stroka.soglasovanie { border-left-color:#6f3cd1; }
.sostoyanie.soglasovanie{ background:rgba(111,60,209,.2); color:#c4b5fd; }
.stroka.v_rabote     { border-left-color:#1a9e54; }
.sostoyanie.v_rabote { background:rgba(26,158,84,.2); color:#6ee7a8; }
.stroka.gotovo       { border-left-color:#64748b; }
.sostoyanie.gotovo   { background:rgba(100,116,139,.2); color:#cbd5e1; }
.stroka.otkloneno    { border-left-color:#d23b3b; }

/* срок — светофором, как на доске Дивана: далеко спокойно, близко тревожно */
.srok{
  font-size:11.5px; font-weight:800; white-space:nowrap;
  padding:4px 10px; border-radius:8px;
  background:rgba(148,163,184,.12); color:var(--dim);
}
.srok.skoro   { background:rgba(237,139,0,.18); color:#fbbf24; }
.srok.segodnya{ background:rgba(210,59,59,.2); color:#fca5a5; }
.srok.prosrok { background:rgba(210,59,59,.28); color:#fca5a5;
                animation:trevoga 2s ease-in-out infinite; }
@keyframes trevoga{ 0%,100%{ opacity:1; } 50%{ opacity:.55; } }

.dolya{ font-size:12px; font-weight:900; color:var(--dim); min-width:38px; text-align:right; }

.podzagolovok{
  margin:34px 0 14px; font-size:11px; font-weight:900;
  text-transform:uppercase; letter-spacing:.08em; color:var(--dim);
}

@media (max-width:640px){
  .stroka{ flex-direction:column; align-items:flex-start; gap:10px; }
  .stroka-sprava{ width:100%; }
}

/* метка «документы созданы в 1С» — клиенту важно видеть, что дело дошло до дела */
.metka-1s{
  font-size:9.5px; font-weight:900; letter-spacing:.06em;
  padding:3px 8px; border-radius:6px;
  background:rgba(26,158,84,.2); color:#6ee7a8;
  border:1px solid rgba(26,158,84,.35);
}
.stroka.tusklo{ opacity:.5; border-left-color:#475569; }
.sostoyanie.tusklo{ background:rgba(100,116,139,.14); color:#94a3b8; }

/* приглашение подать заявку — не кнопка посреди пустоты, а строка с делом */
.podat{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  background:var(--karta); border:1px solid var(--line); border-radius:12px;
  padding:14px 18px; margin-bottom:20px; font-size:13px; color:var(--dim);
}
.knopka-malaya{
  padding:8px 16px; border-radius:9px; white-space:nowrap;
  background:var(--akcent); color:#fff; text-decoration:none;
  font-size:12.5px; font-weight:800;
}
.knopka-malaya:hover{ filter:brightness(1.1); }
@media (max-width:640px){ .podat{ flex-direction:column; align-items:stretch; text-align:center; } }

/* ─── КАРТОЧКА ДЕКЛАРАЦИИ ──────────────────────────────────────────── */
.nazad{
  display:inline-block; margin-bottom:16px; font-size:12.5px; font-weight:700;
  color:var(--dim); text-decoration:none;
}
.nazad:hover{ color:var(--txt); }

.karta-shapka{
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-left:4px solid var(--dim);
  border-radius:14px; padding:22px; margin-bottom:22px;
}
.karta-shapka.gotovo{ border-left-color:#1a9e54; }
.karta-shapka.novaya{ border-left-color:#2f93da; }
.karta-shapka.utochnenie{ border-left-color:#ed8b00; }
.karta-shapka.otkloneno{ border-left-color:#d23b3b; }
.karta-verh{ display:flex; justify-content:space-between; align-items:flex-start; gap:20px; flex-wrap:wrap; }
.karta-verh h1{ margin:0 0 5px; font-size:22px; font-weight:900; letter-spacing:-.3px; }
.karta-pod{ margin:0; font-size:12.5px; color:var(--dim); }
.karta-sost{ display:flex; align-items:center; gap:9px; flex:0 0 auto; }

.karta-cifry{
  display:flex; gap:12px; flex-wrap:wrap;
  margin-top:20px; padding-top:18px; border-top:1px solid var(--line);
}
.cifra{
  flex:1; min-width:130px;
  background:rgba(2,6,23,.35); border-radius:10px; padding:11px 14px;
}
.cifra-imya{
  display:block; font-size:9.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.06em; color:var(--dim); margin-bottom:4px;
}
.cifra b{ font-size:17px; font-weight:900; }

/* цепочка — как маршрут задачи на доске: видно, где мы */
.cepochka{
  display:flex; align-items:center; flex-wrap:wrap;
  background:var(--karta); border:1px solid var(--line); border-radius:12px;
  padding:16px 20px; margin-bottom:24px;
}
.shag{ display:flex; align-items:center; gap:10px; opacity:.45; }
.shag.proydeno{ opacity:1; }
.shag-tochka{
  width:26px; height:26px; flex:0 0 auto; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(148,163,184,.16); color:var(--dim);
  font-size:13px; font-weight:900;
}
.shag.proydeno .shag-tochka{ background:rgba(26,158,84,.22); color:#6ee7a8; }
.shag-imya{ font-size:12.5px; font-weight:800; white-space:nowrap; }
.shag-kogda{ font-size:10.5px; color:var(--dim); }
.shag-svyaz{
  flex:1; min-width:24px; height:2px; margin:0 12px;
  background:rgba(148,163,184,.18); border-radius:2px;
}
.shag-svyaz.proydeno{ background:rgba(26,158,84,.35); }

.stroka.tovar{ align-items:flex-start; }
.tovar-nomer{
  flex:0 0 auto; width:24px; height:24px; border-radius:7px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(47,147,218,.16); color:#7cc4f5;
  font-size:11px; font-weight:900;
}

.predupr{
  background:rgba(237,139,0,.14); border:1px solid rgba(237,139,0,.35);
  color:#fbbf24; border-radius:11px; padding:13px 17px;
  font-size:12.5px; margin-top:16px; line-height:1.5;
}

/* строка декларации — кликабельная, с намёком что провалится */
a.stroka{ text-decoration:none; color:var(--txt); }
a.stroka:hover{ border-color:rgba(148,163,184,.35); }
a.stroka::after{
  content:"›"; color:var(--dim); font-size:20px; font-weight:900;
  flex:0 0 auto; opacity:.4; transition:.15s;
}
a.stroka:hover::after{ opacity:1; transform:translateX(2px); }

@media (max-width:640px){
  .cepochka{ flex-direction:column; align-items:flex-start; gap:12px; }
  .shag-svyaz{ display:none; }
  .karta-cifry{ flex-direction:column; }
}

/* ─── ОТБОР И ПОИСК ─────────────────────────────────────────────────── */
.otbor{ margin-bottom:22px; }
.firmy{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.chip{
  display:inline-flex; align-items:center; gap:7px;
  padding:7px 14px; border-radius:999px; text-decoration:none;
  background:var(--karta); border:1px solid var(--line);
  color:var(--dim); font-size:12.5px; font-weight:700;
  transition:.15s;
}
.chip:hover{ color:var(--txt); border-color:rgba(148,163,184,.35); transform:translateY(-1px); }
.chip b{ font-size:11px; font-weight:900; opacity:.65; }
.chip.gorit{
  background:rgba(220,38,38,.16); border-color:rgba(220,38,38,.4); color:#fff;
}
.chip.gorit b{ opacity:.9; }

.iskalka{ display:flex; gap:8px; align-items:center; }
.iskalka input[type=search]{
  flex:1; padding:11px 16px; border-radius:11px;
  border:1px solid var(--line); background:rgba(2,6,23,.45);
  color:var(--txt); font-size:16px; outline:none;   /* 16px — Safari не зумит */
}
.iskalka input[type=search]:focus{ border-color:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.14); }
.iskalka button{
  padding:11px 22px; border:0; border-radius:11px; cursor:pointer;
  background:#16a34a; color:#fff; font-size:13px; font-weight:800;
  transition:.15s;
}
.iskalka button:focus-visible{ outline:2px solid #4ade80; outline-offset:2px; }
.iskalka button:hover{ filter:brightness(1.1); }
.sbros{ font-size:12px; color:var(--dim); text-decoration:none; white-space:nowrap; }
.sbros:hover{ color:var(--txt); }

/* ─── КАРТОЧКА ТОВАРА ───────────────────────────────────────────────── */
.tovar-metka{
  font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.07em;
  color:var(--dim); margin-bottom:6px;
}
.tovar-zag{ font-size:19px !important; line-height:1.3; }
.listalka{ display:flex; gap:6px; flex:0 0 auto; }
.listalka a{
  width:34px; height:34px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(148,163,184,.12); border:1px solid var(--line);
  color:var(--txt); text-decoration:none; font-size:19px; font-weight:900;
}
.listalka a:hover{ background:rgba(220,38,38,.16); border-color:rgba(220,38,38,.35); }
.tovar-niz{
  margin-top:22px; padding-top:16px; border-top:1px solid var(--line);
  font-size:12px; color:var(--dim);
}
.tovar-niz a{ color:#7cc4f5; text-decoration:none; }

@media (max-width:640px){
  .iskalka{ flex-wrap:wrap; }
  .iskalka input[type=search]{ flex:1 1 100%; }
}

/* ─── СКВОЗНОЙ ПОИСК ────────────────────────────────────────────────── */
.poisk-shapka{ flex:0 0 auto; }
.poisk-shapka form{ display:flex; gap:6px; }
.poisk-shapka input{
  width:190px; padding:7px 13px; border-radius:9px;
  border:1px solid var(--line); background:rgba(2,6,23,.45);
  color:var(--txt); font-size:12.5px; outline:none; transition:.15s;
}
.poisk-shapka input:focus{ width:260px; border-color:var(--akcent); }
.poisk-shapka input::placeholder{ color:var(--dim); opacity:.7; }

.poisk-bolshoy{ display:flex; gap:10px; margin-bottom:22px; }
.poisk-bolshoy input{
  flex:1; padding:15px 20px; border-radius:13px;
  border:1px solid var(--line); background:rgba(2,6,23,.5);
  color:var(--txt); font-size:16px; outline:none;
}
.poisk-bolshoy input:focus{ border-color:var(--akcent); box-shadow:0 0 0 3px rgba(220,38,38,.14); }
.poisk-bolshoy button{
  padding:15px 30px; border:0; border-radius:13px; cursor:pointer;
  background:var(--akcent); color:#fff; font-size:14px; font-weight:800;
}
.poisk-itog{ font-size:13px; color:var(--dim); margin:0 0 18px; }
.poisk-itog b{ color:var(--txt); }
.stroka.jamarik{ border-left-color:#2f93da; }

@media (max-width:900px){ .poisk-shapka input{ width:150px; } }
@media (max-width:640px){
  .poisk-shapka{ flex:1 1 100%; order:4; }
  .poisk-shapka input{ width:100%; }
  .poisk-shapka input:focus{ width:100%; }
  .poisk-bolshoy{ flex-wrap:wrap; }
  .poisk-bolshoy input{ flex:1 1 100%; }
}

/* ─── ПОЛЯ ТОВАРА В СПИСКЕ ──────────────────────────────────────────────
   Батя: «поля сливаются». Раньше шли строкой через точку — глаз не цеплял.
   Теперь каждое в своей плашке: сверху бледное имя, снизу само значение. */
.tovar-polya{ display:flex; gap:7px; flex-wrap:wrap; margin-top:7px; }
.pole{
  display:inline-flex; flex-direction:column; gap:1px;
  background:rgba(2,6,23,.42); border:1px solid var(--line);
  border-radius:8px; padding:5px 10px;
  font-size:12px; font-weight:700; color:var(--txt);
}
.pole i{
  font-style:normal; font-size:8.5px; font-weight:800;
  text-transform:uppercase; letter-spacing:.06em; color:var(--dim);
}
.pole.tusklo{ opacity:.6; justify-content:center; }
/* артикул — зелёным: его ищут чаще всего */
.pole.artikul{
  background:rgba(26,158,84,.16); border-color:rgba(26,158,84,.4);
  color:#6ee7a8;
}
.pole.artikul i{ color:#4ade80; opacity:.85; }

.stroka.tovar{ align-items:flex-start; }

/* ─── ХАРАКТЕРИСТИКИ ТОВАРА ─────────────────────────────────────────── */
.artikuly{ display:flex; gap:7px; flex-wrap:wrap; margin-top:10px; }
.artikul-bolshoy{
  background:rgba(26,158,84,.18); border:1px solid rgba(26,158,84,.45);
  color:#6ee7a8; border-radius:9px; padding:6px 14px;
  font-size:13.5px; font-weight:900; letter-spacing:.02em;
  font-family:ui-monospace, "SF Mono", Menlo, monospace;
}
.svoystva{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:10px;
}
.svoystvo{
  display:flex; flex-direction:column; gap:3px;
  background:var(--karta); border:1px solid var(--line);
  border-left:3px solid rgba(26,158,84,.5);
  border-radius:10px; padding:11px 15px;
}
.svoystvo-imya{
  font-size:9.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.06em; color:var(--dim);
}
.svoystvo-znach{ font-size:14px; font-weight:800; color:#6ee7a8; }

@media (max-width:640px){
  .svoystva{ grid-template-columns:1fr; }
  .tovar-polya{ gap:5px; }
}

/* ─── КОНВЕЙЕР ЗАКАЗА ────────────────────────────────────────────────
   Приём Каспи, но у нас это ПУТЬ ТОВАРА, а не список кодов. Таможня —
   наш этап, потому и подсвечена своим цветом. */
.konveyer{
  display:flex; align-items:stretch; gap:0; overflow-x:auto;
  padding:4px 2px 12px; margin-bottom:18px; scrollbar-width:thin;
}
.stadiya{
  flex:0 0 auto; min-width:126px; text-decoration:none;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--dim);
  border-radius:12px; padding:11px 14px;
  display:flex; flex-direction:column; gap:3px;
  transition:.15s;
}
.stadiya:hover{ transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,.3); }
.stadiya-imya{
  font-size:10px; font-weight:900; text-transform:uppercase;
  letter-spacing:.05em; color:var(--dim); white-space:nowrap;
}
.stadiya-chislo{ font-size:21px; font-weight:900; color:var(--txt); line-height:1.1; }
.stadiya-summa{ font-size:10.5px; font-weight:700; color:var(--dim); }
.stadiya.pusto{ opacity:.4; }
.stadiya.gorit{ box-shadow:0 0 0 2px var(--akcent); }

.stadiya.novaya      { border-top-color:#2f93da; } .stadiya.novaya .stadiya-imya{ color:#7cc4f5; }
.stadiya.soglasovanie{ border-top-color:#6f3cd1; } .stadiya.soglasovanie .stadiya-imya{ color:#c4b5fd; }
.stadiya.jamarik     { border-top-color:#ed8b00; background:linear-gradient(180deg, rgba(237,139,0,.12), var(--karta)); }
.stadiya.jamarik .stadiya-imya{ color:#fbbf24; }
.stadiya.v_rabote    { border-top-color:#1a9e54; } .stadiya.v_rabote .stadiya-imya{ color:#6ee7a8; }
.stadiya.gotovo      { border-top-color:#1a9e54; background:linear-gradient(180deg, rgba(26,158,84,.12), var(--karta)); }
.stadiya.gotovo .stadiya-imya{ color:#6ee7a8; }
.stadiya.otkloneno   { border-top-color:#d23b3b; } .stadiya.otkloneno .stadiya-imya{ color:#fca5a5; }

.strelka{
  align-self:center; color:var(--line); font-size:20px; font-weight:900;
  padding:0 5px; flex:0 0 auto;
}

/* номер декларации в строке заказа — синим, это дверь в таможню */
.pole.gtd{
  background:rgba(47,147,218,.16); border-color:rgba(47,147,218,.4); color:#7cc4f5;
}
.pole.gtd i{ color:#7cc4f5; opacity:.8; }

.shagi-zakaza{ display:flex; flex-direction:column; gap:0; }
.shag-zakaza{
  display:flex; align-items:center; gap:12px; padding:9px 0;
  opacity:.4; position:relative;
}
.shag-zakaza.proydeno{ opacity:1; }
.shag-zakaza:not(:last-child)::after{
  content:""; position:absolute; left:12px; top:34px; bottom:-4px;
  width:2px; background:var(--line);
}
.shag-zakaza.proydeno:not(:last-child)::after{ background:rgba(26,158,84,.35); }

@media (max-width:640px){ .konveyer{ padding-bottom:16px; } .stadiya{ min-width:112px; } }

/* ─── ПЛАТЕЖИ ПО ДЕКЛАРАЦИИ ─────────────────────────────────────────
   Клиент хочет знать, сколько стоило растаможить. Каждый вид платежа —
   своей плашкой с суммой крупно: это то, за чем сюда и приходят. */
.oplaty{ display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:12px; }
.oplata{
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--dim);
  border-radius:12px; padding:14px 16px;
}
.oplata-verh{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px; }
.oplata-imya{
  font-size:10px; font-weight:900; text-transform:uppercase;
  letter-spacing:.05em; color:var(--dim);
}
.oplata-sposob{
  font-size:9px; font-weight:800; padding:2px 7px; border-radius:999px;
  background:rgba(148,163,184,.14); color:var(--dim); white-space:nowrap;
}
.oplata-summa{ font-size:19px; font-weight:900; letter-spacing:-.3px; }
.oplata-niz{ font-size:10.5px; color:var(--dim); margin-top:5px; }

.oplata.novaya      { border-top-color:#2f93da; } .oplata.novaya .oplata-imya{ color:#7cc4f5; }
.oplata.soglasovanie{ border-top-color:#6f3cd1; } .oplata.soglasovanie .oplata-imya{ color:#c4b5fd; }
.oplata.utochnenie  { border-top-color:#ed8b00; } .oplata.utochnenie .oplata-imya{ color:#fbbf24; }
.oplata.v_rabote    { border-top-color:#1a9e54; } .oplata.v_rabote .oplata-imya{ color:#6ee7a8; }

/* ─── ОПЛАЧЕНО ───────────────────────────────────────────────────────
   Приём из дашборда Каспи: заказ дошёл до логистики — значит деньги
   пришли. Метка зелёная и заметная: за ней приходят в первую очередь. */
.oplachen{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.05em;
  padding:3px 9px; border-radius:999px; white-space:nowrap;
  background:rgba(26,158,84,.2); color:#6ee7a8;
  border:1px solid rgba(26,158,84,.4);
}
.oplachen.bolshoy{ font-size:11px; padding:5px 13px; }

/* на стадии конвейера — уголком, чтобы не спорить с цифрой */
.stadiya{ position:relative; }
.oplacheno-metka{
  position:absolute; top:-9px; right:9px;
  background:#1a9e54; color:#fff;
  font-size:10px; font-weight:900; line-height:1;
  padding:3px 7px; border-radius:999px;
  box-shadow:0 2px 8px rgba(26,158,84,.5);
}

/* связь строки товара с заказами — синим, это дверь в продажи */
.pole.svyaz-znachok{
  background:rgba(47,147,218,.16); border-color:rgba(47,147,218,.45); color:#7cc4f5;
}
.pole.svyaz-znachok i{ color:#7cc4f5; opacity:.85; }

/* китайский поставщик — отдельно и тускло: это не наш артикул */
.pole.postavshchik{ opacity:.7; }
.pole.postavshchik i{ color:#c4b5fd; }


/* 👑 ВИП-заказ — образец BM, закон тот же, что в портале ФрешТрейда */
.vip-znak{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:6px;
  background:linear-gradient(45deg,#f1c40f,#f39c12);color:#111;font-size:11px;
  font-weight:800;vertical-align:middle;letter-spacing:.3px;white-space:nowrap;
  box-shadow:0 0 8px rgba(241,196,15,.45);}
h1 .vip-znak{font-size:14px;padding:3px 10px;}


/* заказы вне реестра Kaspi — заведены в 1С вручную (ВИП и прочие) */
.svyaz-znachok.vne-reestra{border-color:rgba(241,196,15,.45)!important;
  background:rgba(241,196,15,.07)!important;}
.vne-metka{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:5px;
  background:rgba(241,196,15,.18);color:#f1c40f;font-size:10px;font-weight:800;
  letter-spacing:.3px;white-space:nowrap;}
.kontragent-metka{display:block;margin-top:3px;color:#9fb3c8;font-size:11px;
  font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}


/* карточка заказа, заведённого в 1С, а не в Kaspi */
.vne-reestra-shapka{margin:10px 0 16px;padding:12px 16px;border-radius:12px;
  background:rgba(241,196,15,.07);border:1px solid rgba(241,196,15,.28);}
.vrs-metka{color:#f1c40f;font-size:11px;font-weight:800;letter-spacing:.4px;
  text-transform:uppercase;}
.vrs-kontragent{margin-top:5px;font-size:17px;font-weight:800;color:#e8eef5;}
.vrs-melko{margin-top:3px;font-size:12px;color:#9fb3c8;font-weight:600;}


/* путь заказа — горизонтально, над бланком, всё сразу перед глазами */
@media (max-width:820px){.put-shag{min-width:106px;}}


/* отметки заказа вне реестра — прямым словом, без догадок */
.vrs-metki{display:flex;flex-wrap:wrap;gap:7px;align-items:center;}
.vrs-metki span{display:inline-block;padding:3px 9px;border-radius:6px;
  font-size:11px;font-weight:800;letter-spacing:.3px;white-space:nowrap;}
.vrs-net{background:rgba(239,68,68,.14);color:#f87171;}
.vrs-1s{background:rgba(241,196,15,.16);color:#f1c40f;}
.vrs-oplata.da{background:rgba(34,197,94,.15);color:#4ade80;}
.vrs-oplata.net{background:rgba(255,255,255,.07);color:#9fb3c8;}


/* артикул, по которому идёт связь строки ГТД с заказом */
.pole.artikul.klyuch{background:rgba(34,197,94,.10)!important;
  border-color:rgba(34,197,94,.35)!important;}
.pole.artikul.klyuch i{color:#4ade80!important;}


/* карта заказа — таблица товаров (образец: портал ФрешТрейда) */
.tovary-obertka{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;
  border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.03);}
.tovary-tablica{width:100%;border-collapse:collapse;font-size:13px;min-width:620px;}
.tovary-tablica th{padding:11px 12px;text-align:left;font-size:10.5px;font-weight:800;
  letter-spacing:.6px;text-transform:uppercase;color:#9fb3c8;
  background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.09);}
.tovary-tablica td{padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.05);
  vertical-align:top;color:#e8eef5;}
.tovary-tablica tr:last-child td{border-bottom:none;}
.t-nomer{width:38px;color:#7f8fa4;font-weight:700;}
.t-chislo{text-align:right;white-space:nowrap;font-weight:700;}
.t-imya{font-size:13.5px;font-weight:700;color:#e8eef5;line-height:1.35;}
.t-kody{margin-top:5px;display:flex;flex-wrap:wrap;gap:5px;}
.t-kody span{display:inline-block;padding:1px 7px;border-radius:5px;font-size:10.5px;
  font-weight:700;background:rgba(255,255,255,.05);color:#9fb3c8;white-space:nowrap;}
.t-kod{color:#7fd4ff!important;}
.t-kod.klyuch{background:rgba(34,197,94,.12)!important;color:#4ade80!important;}
.t-tnved{color:#f0b429!important;}
.t-nkt{color:#c4a3ff!important;}
.t-bylo{color:#7f8fa4;font-weight:600;margin-right:5px;}
.t-stalo{color:#f1c40f;}
.t-zhdyom{margin-top:3px;font-size:10px;font-weight:800;color:#e67e22;}
.itogo-k-oplate{margin-top:12px;padding:12px 16px;border-radius:12px;text-align:right;
  background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.22);
  font-size:14px;font-weight:700;color:#e8eef5;}
.itogo-k-oplate b{font-size:17px;font-weight:800;}


/* карта заказа: покупатель и доставка (образец — портал ФрешТрейда) */
.info-korobki{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 16px;}
.info-korobka{padding:13px 16px;border-radius:12px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);}
.ik-zagolovok{font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;
  color:#9fb3c8;margin-bottom:6px;}
.ik-imya{font-size:15px;font-weight:800;color:#7fd4ff;line-height:1.3;}
.ik-stroka{margin-top:4px;font-size:12px;color:#9fb3c8;font-weight:600;}
.ik-stroka b{color:#e8eef5;font-weight:800;}
.ik-adres{font-size:13px;color:#e8eef5;font-weight:600;line-height:1.4;}
@media (max-width:820px){.info-korobki{grid-template-columns:1fr;}}

/* этап, завершённый В СРОК, — зелёный (слово Бати) */
.ik-yur{margin-top:5px;font-size:11px;color:#7f8fa4;font-weight:600;line-height:1.35;}


/* документы сопровождения товара в ГТД */
.d-nomer{width:38px;color:#7f8fa4;font-weight:700;}
.d-imya{font-weight:700;line-height:1.35;}
.d-kod{margin-top:2px;font-size:10px;color:#7f8fa4;font-weight:700;}
.d-num{white-space:nowrap;color:#7fd4ff;font-weight:700;}
.d-data{white-space:nowrap;color:#9fb3c8;font-weight:600;}


/* цифры в таблице товаров: ровный столбик, по середине строки */
.tovary-tablica td.t-chislo{vertical-align:middle;text-align:right;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;
  white-space:nowrap;letter-spacing:.2px;}
.tovary-tablica th.t-chislo{text-align:right;}
.tovary-tablica td:not(.t-chislo){vertical-align:middle;}
.tovary-tablica td.t-nomer{vertical-align:middle;text-align:center;}
.tovary-tablica th.t-nomer{text-align:center;}
.t-bylo,.t-stalo{font-variant-numeric:tabular-nums;}
/* имя, подтянутое из ГТД, — помечаем, чтобы не путали с данными Kaspi */
.t-iz-gtd{margin-left:6px;padding:1px 6px;border-radius:5px;font-size:9.5px;
  font-weight:800;background:rgba(127,212,255,.12);color:#7fd4ff;white-space:nowrap;}

.t-postavshchik{color:#7f8fa4!important;opacity:.85;}


/* чипы по состояниям деклараций — вся картина одной строкой */
.chipy-sost{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 14px;}
.chipy-sost .chip b{margin-left:5px;opacity:.75;font-weight:800;}
.chip.sost-gotovo.gorit{background:rgba(22,163,74,.18);border-color:rgba(22,163,74,.45);color:#4ade80;}
.chip.sost-utochnenie{border-color:rgba(243,156,18,.35);color:#f0b429;}
.chip.sost-utochnenie.gorit{background:rgba(243,156,18,.18);}
.chip.sost-otkloneno{border-color:rgba(239,68,68,.35);color:#f87171;}
.chip.sost-otkloneno.gorit{background:rgba(239,68,68,.16);}
.chip.sost-tusklo{opacity:.65;}


/* закладки карточки декларации */
.zakladka{appearance:none;cursor:pointer;padding:8px 15px;border-radius:10px;
  border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.03);
  color:#9fb3c8;font-size:12.5px;font-weight:800;letter-spacing:.2px;
  font-family:inherit;transition:all .15s;}
.zakladka:hover{background:rgba(255,255,255,.07);color:#e8eef5;}
.zakladka b{margin-left:5px;opacity:.7;font-weight:800;}
.zakladka.gorit{background:rgba(220,38,38,.14);border-color:rgba(220,38,38,.4);
  color:#fff;}
.zakladka.gorit b{opacity:.85;}
@media (max-width:820px){.zakladka{padding:7px 12px;font-size:12px;}}


/* сводная цепочка документов 1С по всей декларации */
.cepochka-dekl{display:flex;gap:0;padding:16px 10px;border-radius:14px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);
  overflow-x:auto;-webkit-overflow-scrolling:touch;}
.cd-shag{flex:1 1 0;min-width:120px;position:relative;text-align:center;padding:0 8px;}
.cd-shag:not(:last-child)::after{content:"";position:absolute;top:14px;
  left:calc(50% + 18px);right:calc(-50% + 18px);height:2px;background:rgba(255,255,255,.1);}
.cd-shag.gotov:not(:last-child)::after{background:rgba(22,163,74,.5);}
.cd-shag.chastichno:not(:last-child)::after{background:rgba(243,156,18,.45);}
.cd-tochka{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;
  border-radius:50%;background:rgba(255,255,255,.08);color:#9fb3c8;font-size:13px;font-weight:800;
  position:relative;z-index:1;}
.cd-shag.gotov .cd-tochka{background:#16a34a;color:#fff;box-shadow:0 0 0 4px rgba(22,163,74,.16);}
.cd-shag.chastichno .cd-tochka{background:#f39c12;color:#111;box-shadow:0 0 0 4px rgba(243,156,18,.16);}
.cd-shag.netu{opacity:.45;}
.cd-imya{margin-top:8px;font-size:12.5px;font-weight:800;color:#e8eef5;}
.cd-schet{margin-top:2px;font-size:10.5px;color:#9fb3c8;font-weight:700;}
.cd-podpis{margin-top:10px;font-size:12px;color:#9fb3c8;font-weight:600;line-height:1.45;}
.cd-podpis b{color:#e8eef5;font-weight:800;}
@media (max-width:820px){.cd-shag{min-width:104px;}}

/* ── ШАПКИ ТАБЛИЦ НЕ УЕЗЖАЮТ ПРИ ПРОКРУТКЕ (слово Отца 15.09.2026:
   «слова сумма и ставка не зафиксированы в НДС и двигаются со скролом»).
   Делаем как у банковских таблиц (.bk-tab th), а не по-своему. ── */
.t-tabl-lipkaya{ overflow:auto; max-height:70vh; border-radius:12px; }
.tovary-tablica thead th,
.pv-tovary thead th,
table.platezhi thead th{
  position:sticky; top:0; z-index:5;
  background:#0f172a; background:var(--karta,#0f172a);
  box-shadow:0 1px 0 rgba(148,163,184,.18);
}

/* ── ЁЛКА ДОКУМЕНТОВ НИЖЕ И ПЛОТНЕЕ (слово Отца 15.09.2026: «ячейки сильно
   высокие… горизонтальной или в 2 яруса»). Точка и подпись — в строку,
   а не столбиком: высота падает примерно вдвое. ── */
.cepochka-dekl{ padding:10px 8px; gap:2px; }
.cd-shag{ min-width:96px; padding:0 4px;
  display:flex; flex-direction:column; align-items:center; gap:1px; }
.cd-tochka{ width:22px; height:22px; font-size:11px; }
.cd-shag:not(:last-child)::after{ top:11px;
  left:calc(50% + 15px); right:calc(-50% + 15px); }
.cd-imya{ margin-top:4px; font-size:11px; line-height:1.2; }
.cd-schet{ margin-top:0; font-size:10px; }
.cd-podpis{ margin-top:7px; font-size:11.5px; }
/* на узком стекле — в два яруса, а не лентой вбок */
@media (max-width:900px){
  .cepochka-dekl{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr));
    row-gap:10px; overflow:visible; }
  .cd-shag::after{ display:none; }
}



/* тумблер рычага реализаций в админке */
.rychag-karta{display:flex;gap:16px;align-items:center;justify-content:space-between;
  padding:16px 18px;border-radius:14px;background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);flex-wrap:wrap;}
.rychag-karta.gorit{background:rgba(22,163,74,.08);border-color:rgba(22,163,74,.35);}
.rk-levo{flex:1 1 320px;min-width:260px;}
.rk-sost{font-size:16px;font-weight:800;color:#9fb3c8;text-transform:uppercase;letter-spacing:.5px;}
.rychag-karta.gorit .rk-sost{color:#4ade80;}
.rk-poyasn{margin-top:5px;font-size:13px;color:#c9d6e2;line-height:1.45;}
.rk-poyasn b{color:#e8eef5;}
.rk-kto{margin-top:5px;font-size:11px;color:#7f8fa4;font-weight:600;}
.rk-knopka{appearance:none;cursor:pointer;padding:11px 22px;border-radius:10px;
  border:1px solid rgba(22,163,74,.45);background:rgba(22,163,74,.16);color:#4ade80;
  font-size:13px;font-weight:800;font-family:inherit;letter-spacing:.3px;transition:all .15s;}
.rk-knopka:hover{background:rgba(22,163,74,.26);}
.rk-knopka.gasit{border-color:rgba(220,38,38,.45);background:rgba(220,38,38,.14);color:#f87171;}
.rk-knopka.gasit:hover{background:rgba(220,38,38,.24);}
.rk-predupr{margin-top:12px;padding:12px 16px;border-radius:12px;font-size:12.5px;
  line-height:1.5;color:#f0b429;background:rgba(243,156,18,.08);
  border:1px solid rgba(243,156,18,.25);}
.rk-predupr b{color:#f8d57e;}
.skazano{margin:0 0 14px;padding:12px 16px;border-radius:12px;font-size:13px;font-weight:600;
  color:#4ade80;background:rgba(22,163,74,.1);border:1px solid rgba(22,163,74,.3);}


/* управление: кто что видит */
.lyudi-tablica td{vertical-align:middle;}
.dostup{display:inline-block;padding:2px 9px;border-radius:6px;font-size:10.5px;font-weight:800;
  letter-spacing:.3px;white-space:nowrap;}
.dostup.nash{background:rgba(220,38,38,.16);color:#f87171;}
.dostup.klient{background:rgba(255,255,255,.06);color:#9fb3c8;}
.vidit-yacheyka{font-size:12px;color:#9fb3c8;line-height:1.4;}
.firma-forma select{padding:6px 10px;border-radius:8px;font-size:12px;font-family:inherit;
  background:rgba(255,255,255,.05);color:#e8eef5;border:1px solid rgba(255,255,255,.12);
  cursor:pointer;max-width:190px;}
.firma-forma select:focus{outline:none;border-color:rgba(220,38,38,.5);}
.zh-kogda{white-space:nowrap;color:#7f8fa4;font-size:11.5px;font-weight:600;}
.zh-chto{display:inline-block;padding:1px 8px;border-radius:5px;font-size:10.5px;font-weight:800;
  background:rgba(127,212,255,.12);color:#7fd4ff;}


/* сверка по декларации */
.sverka-svod{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px;}
.ss-plitka{flex:1 1 130px;min-width:120px;padding:12px 16px;border-radius:12px;text-align:center;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);}
.ss-plitka b{display:block;font-size:24px;font-weight:800;color:#e8eef5;line-height:1.1;}
.ss-plitka span{display:block;margin-top:3px;font-size:11px;font-weight:700;color:#9fb3c8;
  text-transform:uppercase;letter-spacing:.4px;}
.ss-plitka.horosho{background:rgba(22,163,74,.1);border-color:rgba(22,163,74,.35);}
.ss-plitka.horosho b{color:#4ade80;}
.ss-plitka.ploho{background:rgba(243,156,18,.1);border-color:rgba(243,156,18,.32);}
.ss-plitka.ploho b{color:#f0b429;}
.ss-plitka.net{background:rgba(255,255,255,.03);}
.sverka-tablica td{vertical-align:middle;}
.sverka-tablica tr.sv-beda{background:rgba(243,156,18,.05);}
.sv-kod{color:#7fd4ff;font-weight:800;text-decoration:none;}
.sv-kod:hover{text-decoration:underline;}
.sv-dok{white-space:nowrap;}
.sv-raznica{margin-top:2px;font-size:10px;color:#f0b429;font-weight:700;}
.sv-bedy{font-size:11.5px;color:#f0b429;line-height:1.45;}
.sv-horosho{color:#4ade80;font-weight:700;}


/* сверка по всей фирме — свод над списком деклараций */
.sverka-firmy{margin:0 0 16px;padding:14px 16px;border-radius:14px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);}
.sf-shapka{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  flex-wrap:wrap;margin-bottom:10px;}
.sf-shapka b{font-size:13px;font-weight:800;color:#e8eef5;letter-spacing:.3px;}
.sf-shapka span{font-size:11.5px;color:#9fb3c8;font-weight:600;}
.sverka-firmy .sverka-svod{margin-bottom:0;}
.sf-net{margin-top:10px;font-size:12px;color:#f0b429;font-weight:600;}
.sf-net span{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:5px;
  background:rgba(243,156,18,.12);}
.sf-podrobno{margin-top:10px;}
.sf-podrobno summary{cursor:pointer;font-size:12px;font-weight:700;color:#7fd4ff;
  padding:6px 0;list-style:none;}
.sf-podrobno summary::-webkit-details-marker{display:none;}
.sf-podrobno summary:before{content:"▸ ";}
.sf-podrobno[open] summary:before{content:"▾ ";}
.sf-spisok{margin-top:6px;display:flex;flex-direction:column;gap:5px;}
.sf-stroka{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;font-size:12px;
  padding:6px 10px;border-radius:8px;background:rgba(255,255,255,.03);}
.sf-stroka a{color:#7fd4ff;font-weight:800;text-decoration:none;}
.sf-gtd{color:#9fb3c8;font-size:11px;font-weight:600;}
.sf-beda{color:#f0b429;font-weight:600;}
.sf-eshchyo{font-size:11.5px;color:#7f8fa4;font-weight:600;padding:4px 10px;}


/* сверка: таблица деклараций */
.sverka-dekl td{vertical-align:middle;}
.sverka-dekl tr.sv-ok{background:rgba(22,163,74,.04);}
.sd-horosho{color:#4ade80;font-weight:800;}
.sd-ploho{color:#f0b429;font-weight:800;}
.sd-net{display:inline-block;margin:1px 4px 1px 0;padding:1px 8px;border-radius:5px;
  background:rgba(243,156,18,.12);color:#f0b429;font-size:10.5px;font-weight:700;white-space:nowrap;}
.sf-podskazka{margin-top:10px;font-size:11.5px;color:#7f8fa4;font-weight:600;}

/* ══════════════════════════════════════════════════════════════
   РАЗДЕЛ «БАНКИ» — выписки и разноска.
   Палитра общая, свой цвет по смыслу: зелёный — деньги.
   ══════════════════════════════════════════════════════════════ */
:root{ --bank:#16a34a; }
.razdel-shapka.bank .znak{ background:rgba(22,163,74,.14); border-color:rgba(22,163,74,.3); }

/* ── чья компания ── */
.bk-firmy{ display:flex; gap:9px; flex-wrap:wrap; margin-bottom:16px; }
.bk-firma{
  text-align:left; padding:12px 16px; border-radius:14px; cursor:pointer;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--dim); color:var(--dim);
  transition:transform .16s, box-shadow .16s, border-color .16s;
}
.bk-firma:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.bk-firma b{ display:block; font-size:13.5px; color:var(--txt); }
.bk-firma span{ font-size:11px; }
.bk-firma:hover{ border-color:rgba(148,163,184,.4); }
.bk-firma.gorit{ border-top-color:var(--bank); border-color:rgba(22,163,74,.35); }
.bk-odna{ margin-bottom:16px; font-size:13px; color:var(--dim); }
.bk-odna b{ color:var(--txt); font-size:15px; margin-right:9px; }

/* ── приём файла ── */
.bk-priyom{
  border:2px dashed rgba(148,163,184,.28); border-radius:14px; padding:34px 20px;
  text-align:center; cursor:pointer; margin-bottom:14px;
  background:rgba(15,23,42,.4); transition:border-color .18s ease, background .18s ease;
}
.bk-priyom:hover, .bk-priyom.nad{ border-color:var(--bank); background:rgba(22,163,74,.06); }
.bk-priyom-znak{ font-size:34px; display:block; margin-bottom:9px; }
.bk-priyom-nutro b{ display:block; font-size:16px; margin-bottom:5px; }
.bk-priyom-pod{ display:block; font-size:12.5px; color:var(--dim); }
.bk-priyom-pod a{ color:var(--bank); font-weight:700; }
.bk-priyom-banki{ display:block; margin-top:11px; font-size:11px; color:#64748b; letter-spacing:.04em; }

/* ── ход дела ── */
.bk-hod{ padding:12px 16px; border-radius:12px; margin-bottom:14px; font-size:13px;
  background:rgba(15,23,42,.6); border:1px solid var(--line); }
.bk-hod.horosho{ border-color:rgba(22,163,74,.4); background:rgba(22,163,74,.08); }
.bk-hod.beda{ border-color:rgba(220,38,38,.4); background:rgba(220,38,38,.08); }
.bk-hod a{ color:var(--bank); font-weight:700; }
.bk-bedy{ margin:8px 0 0 18px; font-size:12px; color:#fca5a5; }
.bk-krutit{ display:inline-block; width:12px; height:12px; margin-right:7px; vertical-align:-1px;
  border:2px solid rgba(148,163,184,.3); border-top-color:var(--bank); border-radius:50%;
  animation:bk-vert .7s linear infinite; }
@keyframes bk-vert{ to{ transform:rotate(360deg) } }

/* ── список выписок ── */
.bk-spisok{ display:grid; grid-template-columns:repeat(auto-fill,minmax(268px,1fr)); gap:12px; }
/* Карточка выписки — тем же почерком, что плитки кабинета:
   стекло, цветная полоска сверху, подъём при наведении.
   Батя 23.08: «клеточки должны быть одинаковыми по стилю». */
.bk-karta{
  position:relative; background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--bank);
  border-radius:14px; padding:18px; cursor:pointer;
  transition:transform .16s, box-shadow .16s, border-color .16s;
}
.bk-karta:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.bk-karta.zhdet{ border-top-color:var(--wathaiq); }
.bk-karta.otkaz{ border-top-color:var(--talabat); }
.bk-karta-verh{ display:flex; align-items:center; justify-content:space-between; gap:9px; margin-bottom:9px; }
.bk-karta-verh b{ font-size:13.5px; }
.bk-karta-niz{ display:flex; gap:11px; flex-wrap:wrap; font-size:11px; color:var(--dim); }
.bk-summa{ font-variant-numeric:tabular-nums; color:var(--txt); font-weight:700; }
.bk-sost{ font-size:10px; font-weight:800; padding:3px 8px; border-radius:999px; white-space:nowrap; }
.bk-sost.zhdet{ background:rgba(245,158,11,.16); color:#fbbf24; }
.bk-sost.svereno{ background:rgba(56,189,248,.16); color:#7dd3fc; }
.bk-sost.v1c{ background:rgba(22,163,74,.18); color:#4ade80; }
.bk-sost.otkaz{ background:rgba(220,38,38,.18); color:#fca5a5; }
.bk-pusto-mal{ color:var(--dim); font-size:13px; padding:22px; text-align:center;
  border:1px dashed var(--line); border-radius:14px; }

/* ── окно ── */
.bk-okno{ position:fixed; inset:0; z-index:300; background:rgba(2,6,23,.76);
  backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; padding:22px; }
.bk-korob{ width:min(1240px,100%); max-height:90vh; overflow:auto;
  background:linear-gradient(180deg,rgba(30,41,59,.99),rgba(15,23,42,.99));
  border:1px solid var(--line); border-radius:20px; padding:24px 26px;
  box-shadow:0 30px 80px rgba(0,0,0,.7); }
.bk-okno-shapka{ margin-bottom:17px; }
.bk-okno-shapka b{ display:block; font-size:17px; font-weight:900; letter-spacing:-.02em; }
.bk-okno-shapka span{ display:block; font-size:12px; color:var(--dim); margin-top:3px; }

/* ── сводка ── */
.bk-svodka{ display:flex; gap:11px; flex-wrap:wrap; margin-bottom:15px; }
.bk-svodka > div{ flex:1 1 96px; background:rgba(2,6,23,.45); border:1px solid var(--line);
  border-radius:12px; padding:12px 14px; }
.bk-svodka b{ display:block; font-size:23px; font-weight:900; letter-spacing:-.03em; }
.bk-svodka span{ display:block; font-size:11px; color:var(--dim); margin-top:2px; }
.bk-svodka .svoi{ border-color:rgba(245,158,11,.35); background:rgba(245,158,11,.07); }
.bk-poyas{ font-size:12px; color:#fde68a; background:rgba(245,158,11,.08);
  border-left:3px solid rgba(245,158,11,.5); border-radius:9px; padding:10px 13px; margin-bottom:15px; }

/* ── таблица платежей ── */
.bk-tab-obertka{ overflow:auto; max-height:46vh; border:1px solid var(--line); border-radius:13px; }
.bk-tab{ width:100%; border-collapse:collapse; font-size:12.5px; }
.bk-tab th{ position:sticky; top:0; background:rgba(15,23,42,.97); text-align:left;
  padding:9px 11px; font-size:10.5px; text-transform:uppercase; letter-spacing:.07em;
  color:#64748b; font-weight:800; border-bottom:1px solid var(--line); }
.bk-tab td{ padding:9px 11px; border-bottom:1px solid rgba(148,163,184,.07); }
.bk-tab tr:hover td{ background:rgba(148,163,184,.05); }
.bk-tab tr.v1c td{ opacity:.62; }
.bk-tab .p{ text-align:right; }
.bk-dok{ font-family:ui-monospace,Menlo,monospace; font-size:11px; color:var(--dim); }
.bk-kto{ color:var(--txt); }
.bk-kurs{ color:var(--dim); font-variant-numeric:tabular-nums; }
.bk-vid{ font-size:10px; font-weight:800; padding:2px 7px; border-radius:999px; }
.bk-vid.r{ background:rgba(220,38,38,.15); color:#fca5a5; }
.bk-vid.p{ background:rgba(22,163,74,.16); color:#4ade80; }
.bk-vid.s{ background:rgba(245,158,11,.16); color:#fbbf24; }
.bk-galka{ color:#4ade80; font-weight:900; }

/* ── сравнение ── */
.bk-sr-itog{ display:flex; align-items:center; gap:16px; margin-bottom:16px; }
.bk-sr-itog > div{ flex:1; background:rgba(2,6,23,.45); border:1px solid var(--line);
  border-radius:12px; padding:13px 16px; }
.bk-sr-itog i{ display:block; font-style:normal; font-size:10.5px; color:#64748b;
  text-transform:uppercase; letter-spacing:.08em; }
.bk-sr-itog b{ display:block; font-size:26px; font-weight:900; }
.bk-sr-itog span{ font-size:12px; color:var(--dim); font-variant-numeric:tabular-nums; }
.bk-sr-strelka{ flex:0 0 auto !important; background:none !important; border:none !important;
  font-size:22px; color:#64748b; }
.bk-sr-blok{ margin-bottom:13px; }
.bk-sr-blok > b{ display:block; font-size:12px; margin-bottom:7px; }
.bk-sr-blok.propalo > b{ color:#fca5a5; }
.bk-sr-blok.poyavilos > b{ color:#4ade80; }
.bk-sr-blok.izmenilos > b{ color:#fbbf24; }
.bk-sr-stroka{ display:flex; gap:13px; font-size:12px; padding:5px 11px; border-radius:8px;
  background:rgba(2,6,23,.35); margin-bottom:4px; }
.bk-sr-summa{ font-variant-numeric:tabular-nums; font-weight:700; margin-left:auto; }
.bk-sr-komu{ color:var(--dim); flex:0 0 210px; }
.bk-vnimanie{ font-size:12.5px; color:#fca5a5; background:rgba(220,38,38,.09);
  border:1px solid rgba(220,38,38,.28); border-radius:11px; padding:11px 14px; margin-bottom:14px; }

/* ── кнопки ── */
.bk-okno-niz{ display:flex; align-items:center; gap:9px; margin-top:18px; }
.bk-otstup{ flex:1; }
.bk-knopka{ cursor:pointer; border-radius:11px; padding:10px 17px; font-size:12.5px; font-weight:800;
  border:1px solid var(--line); background:rgba(30,41,59,.8); color:var(--txt); }
.bk-knopka:hover{ border-color:rgba(148,163,184,.45); }
.bk-knopka.glavnaya{ background:linear-gradient(180deg,var(--bank),#15803d); border-color:var(--bank); color:#fff; }
.bk-knopka.opasnaya{ color:#fca5a5; border-color:rgba(220,38,38,.35); }
.bk-knopka.tihaya{ color:var(--dim); }

@media(max-width:760px){
  .bk-korob{ padding:18px 15px; }
  .bk-sr-komu{ display:none; }
  .bk-tab{ font-size:11.5px; }
}

/* ══════════════ КАЛЕНДАРЬ ГОДА ══════════════
   Бухгалтеру важен ДЕНЬ, а не список файлов: где густо, где пусто,
   что уже в учёте. Дыры в цепочке дней видны глазом. */
.bk-god{ margin:0 0 24px; }

/* ── год: крупно посередине, листается каруселью ── */
.bk-leta{ display:flex; align-items:center; justify-content:center; gap:16px; margin-bottom:14px; }
.bk-leto-okno{ width:150px; overflow:hidden; text-align:center; }
.bk-leto-lenta{ font-size:34px; font-weight:900; letter-spacing:-.04em; line-height:1.05;
  transition:transform .17s ease-in, opacity .17s ease-in; }
.bk-leto-lenta.uhodit-vlevo{ transform:translateX(-46px); opacity:0; }
.bk-leto-lenta.uhodit-vpravo{ transform:translateX(46px); opacity:0; }
.bk-leto-lenta.prihodit-sprava{ animation:bk-pribyl-sprava .26s ease-out; }
.bk-leto-lenta.prihodit-sleva{ animation:bk-pribyl-sleva .26s ease-out; }
@keyframes bk-pribyl-sprava{ from{ transform:translateX(46px); opacity:0 } to{ transform:none; opacity:1 } }
@keyframes bk-pribyl-sleva{ from{ transform:translateX(-46px); opacity:0 } to{ transform:none; opacity:1 } }
.bk-leto-strelka{ width:34px; height:34px; border-radius:11px; cursor:pointer;
  background:rgba(2,6,23,.5); border:1px solid var(--line); color:var(--dim);
  font-size:19px; line-height:1; transition:border-color .15s, color .15s, transform .15s; }
.bk-leto-strelka:hover{ border-color:var(--bank); color:var(--txt); transform:scale(1.06); }
.bk-leto-strelka:active{ transform:scale(.94); }

/* ── итог года ── */
.bk-god-itog{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.bk-god-itog > div{ flex:1 1 128px; background:rgba(2,6,23,.45); border:1px solid var(--line);
  border-radius:12px; padding:11px 14px; }
.bk-god-itog b{ display:block; font-size:19px; font-weight:900; letter-spacing:-.03em;
  font-variant-numeric:tabular-nums; }
.bk-god-itog span{ display:block; font-size:11px; color:var(--dim); margin-top:2px; }
.bk-god-itog .kom{ border-color:rgba(220,38,38,.3); background:rgba(220,38,38,.07); }
.bk-god-itog .kom b{ color:#fca5a5; }
.bk-god-itog .chisto{ border-color:rgba(74,222,128,.3); background:rgba(22,163,74,.07); }
.bk-god-itog .chisto b{ color:#4ade80; }
.bk-god-pusto{ flex:1; text-align:center; color:var(--dim); font-size:13px; padding:14px; }

/* ── 12 месяцев настоящей сеткой ── */
.bk-mesyacy{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
@media (max-width:1180px){ .bk-mesyacy{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:760px){ .bk-mesyacy{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:420px){ .bk-mesyacy{ grid-template-columns:1fr; } }

.bk-mes{ background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--bank);
  border-radius:13px; padding:10px 10px 8px; min-width:0;
  transition:transform .16s, box-shadow .16s, border-color .16s; }
.bk-mes:not(.pusto):hover{ transform:translateY(-2px); box-shadow:0 8px 22px rgba(0,0,0,.32); }
.bk-mes.gorit{ border-color:var(--bank); box-shadow:0 0 0 2px rgba(22,163,74,.28); }
.bk-mes.pusto{ opacity:.45; border-top-color:var(--line); }
.bk-mes-verh{ margin-bottom:6px; min-height:30px; cursor:pointer; }
.bk-mes.pusto .bk-mes-verh{ cursor:default; }
.bk-mes-verh b{ display:block; font-size:12.5px; font-weight:800; text-transform:capitalize; }
.bk-mes-dnej{ display:block; font-size:9.5px; color:var(--dim); margin-top:1px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ── итог месяца: разнесён или ждёт (слово Отца 11.09.2026) ──
   Чтобы не открывать месяц ради одного вопроса «всё ли ушло в учёт». */
/* Погашенный тумблер: виден, но не нажимается (урок 13.09.2026 — спрятанный
   инструмент человек считает несделанным). */
.bk-ptichka.pogashen{ opacity:.45; cursor:default; }
.bk-knopka[disabled]{ opacity:.5; cursor:default; }

/* Кнопка разноски на плитке месяца — как было в Затратах (слово Отца 14.09.2026).
   Мелкая, в углу: работа видна, но не заслоняет календарь. */
.bk-mes-knopka{ display:block; width:100%; margin-top:4px; padding:2px 6px;
  background:rgba(245,158,11,.16); color:#fbbf24; border:1px solid rgba(245,158,11,.45);
  border-radius:6px; font-size:10.5px; font-weight:800; cursor:pointer; line-height:1.5; }
.bk-mes-knopka:hover{ background:rgba(245,158,11,.26); }

/* Ждёт разноски: строку видно глазом, не выискивая (урок 14.09.2026 —
   «не видно те 8, они никак не выделены»). */
tr.zhdet{ background:rgba(245,158,11,.07); }
tr.zhdet:hover{ background:rgba(245,158,11,.13); }
tr.zhdet td:first-child{ box-shadow:inset 3px 0 0 #fbbf24; }
.bk-zhdet{ color:#fbbf24; font-weight:800; }

/* Окно сверки с учётом (слово Отца 14.09.2026: «красивое понятное окно»). */
.bk-sv-tabl{ width:100%; border-collapse:collapse; font-size:12px; margin-top:4px; }
.bk-sv-tabl th{ text-align:left; font-size:10.5px; text-transform:uppercase;
  letter-spacing:.04em; color:var(--dim); font-weight:700;
  padding:6px 8px; border-bottom:1px solid rgba(148,163,184,.16); white-space:nowrap; }
.bk-sv-tabl td{ padding:6px 8px; border-bottom:1px solid rgba(148,163,184,.07);
  vertical-align:middle; }
.bk-sv-tabl td.ch{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.bk-sv-tabl td.beda{ color:#fca5a5; font-weight:700; }
.bk-sv-tabl tr.beda{ background:rgba(220,38,38,.07); }
.bk-sv-tabl tr:hover{ background:rgba(148,163,184,.06); }
.bk-sv-tabl a{ color:var(--svyaz,#7c9aff); text-decoration:none; font-weight:600; }
.bk-sv-tabl a:hover{ text-decoration:underline; }
/* Номер строки и разница в окне сверки (слово Отца 15.09.2026:
   «написано пять и приходится считать»; «значок не треугольник, а +»). */
.bk-sv-tabl .bk-sv-nom{ width:30px; text-align:right; color:var(--dim);
  font-variant-numeric:tabular-nums; font-size:11px; }
.bk-sv-raznica{ font-variant-numeric:tabular-nums; }

.bk-sv-znak{ font-size:13px; }
.bk-sv-zakaz{ display:inline-block; padding:1px 6px; margin:1px 0;
  background:rgba(148,163,184,.12); border-radius:5px; font-size:11px;
  font-variant-numeric:tabular-nums; }
.bk-sv-zakaz.vip{ background:rgba(168,85,247,.18); color:#d8b4fe; }
.bk-sv-krik{ margin:10px 0; padding:9px 12px; border-radius:9px; font-size:12.5px;
  background:rgba(220,38,38,.1); border:1px solid rgba(220,38,38,.35); color:#fca5a5; }
.bk-sv-horosho{ margin:14px 0; padding:12px; text-align:center; font-size:13px;
  color:#4ade80; }

.bk-mes-itog{ display:block; font-size:9px; font-weight:700; margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk-mes-itog.gotov{ color:#4ade80; }
.bk-mes-itog.zhdet{ color:#fbbf24; }
.bk-mes-itog.big{ display:inline; font-size:12px; margin:0 0 0 10px; }

.bk-kal{ width:100%; border-collapse:separate; border-spacing:2px; table-layout:fixed; }
.bk-kal th{ font-size:8px; color:#475569; font-weight:600; padding:0 0 2px; text-align:center; }
.bk-kal td{ padding:0; text-align:center; }
.bk-kl{ display:inline-flex; align-items:center; justify-content:center;
  width:100%; aspect-ratio:1; max-width:24px; border-radius:5px;
  font-size:9.5px; font-weight:700; box-sizing:border-box;
  border:1px solid transparent; transition:transform .12s, filter .12s; }
.bk-kl.tiho{ background:rgba(15,23,42,.55); color:#3f4a5f; border-color:rgba(148,163,184,.09);
  font-weight:400; cursor:default; }
/* загружено и без бед — зелёный; разнесено в учёт — гуще; с бедой — жёлтый */
.bk-kl.chisto{ background:rgba(22,163,74,.16); color:#4ade80; border-color:rgba(74,222,128,.42);
  cursor:pointer; }
.bk-kl.gotov{ background:rgba(22,163,74,.42); color:#dcfce7; border-color:#4ade80;
  cursor:pointer; font-weight:800; }
.bk-kl.beda{ background:rgba(245,158,11,.2); color:#fbbf24; border-color:rgba(245,158,11,.6);
  cursor:pointer; }
.bk-kl:not(.tiho):hover{ transform:scale(1.18); filter:brightness(1.15); }

/* ── что каким цветом ── */
.bk-legenda{ display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; font-size:11px; color:var(--dim); }
.bk-legenda span{ display:inline-flex; align-items:center; gap:6px; }
.bk-legenda .kl{ width:12px; height:12px; border-radius:4px; display:inline-block; border:1px solid; }
.bk-legenda .kl.gotov{ background:rgba(22,163,74,.42); border-color:#4ade80; }
.bk-legenda .kl.chisto{ background:rgba(22,163,74,.16); border-color:rgba(74,222,128,.42); }
.bk-legenda .kl.beda{ background:rgba(245,158,11,.2); border-color:rgba(245,158,11,.6); }
.bk-legenda .kl.tiho{ background:rgba(15,23,42,.55); border-color:rgba(148,163,184,.15); }

/* ── расшифровка месяца строками ── */
.bk-dni{ margin-top:16px; background:rgba(2,6,23,.42); border:1px solid var(--line);
  border-radius:14px; padding:14px 15px; }
.bk-dni-shapka{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:11px; }
.bk-dni-shapka b{ font-size:14px; font-weight:800; text-transform:capitalize; }
.bk-dni-shapka span{ font-size:11px; color:var(--dim); }
.bk-dni-ryad{ display:grid; grid-template-columns:repeat(auto-fill,minmax(106px,1fr)); gap:8px; }
.bk-den{ background:rgba(15,23,42,.6); border:1px solid var(--line); border-radius:11px;
  padding:9px 10px; cursor:pointer; min-width:0;
  transition:transform .14s, border-color .14s, box-shadow .14s; }
.bk-den:hover{ transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,.3); }
.bk-den.gotov{ border-color:rgba(74,222,128,.35); background:rgba(22,163,74,.08); }
.bk-den.chisto{ border-color:rgba(74,222,128,.25); }
.bk-den.beda{ border-color:rgba(245,158,11,.45); background:rgba(245,158,11,.07); }
.bk-den b{ font-size:17px; font-weight:900; letter-spacing:-.02em; }
.bk-den-summa{ display:block; font-size:11px; font-weight:700; margin-top:3px;
  font-variant-numeric:tabular-nums; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk-den-op{ display:block; font-size:10px; color:var(--dim); margin-top:1px; }

.bk-kom{ color:#fca5a5; font-variant-numeric:tabular-nums; }
.bk-vid.v{ background:rgba(139,92,246,.16); color:#c4b5fd; }

/* ══════════════ РЕЕСТР KaspiPay ══════════════
   Кто стоит за номером заказа. Стоит рядом с приёмом файла:
   без имён покупателей разносить нечего, и это должно быть на виду. */
/* приём файла слева, реестр — узкой колонкой справа */
.bk-verh{ display:grid; grid-template-columns:1fr 268px; gap:14px; align-items:stretch;
  margin:0 0 18px; }
@media (max-width:900px){ .bk-verh{ grid-template-columns:1fr; } }
.bk-verh .bk-priyom{ margin:0; height:100%; }

.bk-reestr{ display:flex; flex-direction:column; gap:11px;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-top:3px solid var(--bank);
  border-radius:13px; padding:14px 15px; }
.bk-reestr-verh{ cursor:pointer; }
.bk-reestr-verh:hover .bk-reestr-imya{ color:#4ade80; }
.bk-reestr-imya{ font-size:13.5px; font-weight:800; }
.bk-reestr-pod{ font-size:11px; color:var(--dim); margin-top:2px; }
.bk-reestr-cifry{ display:flex; flex-direction:column; gap:8px; cursor:pointer; }
.bk-reestr-cifry > div{ background:rgba(2,6,23,.45); border:1px solid var(--line);
  border-radius:10px; padding:7px 13px; min-width:88px; }
.bk-reestr-cifry b{ display:block; font-size:17px; font-weight:900; letter-spacing:-.03em; }
.bk-reestr-cifry span{ display:block; font-size:10px; color:var(--dim); margin-top:1px; }
.bk-reestr-cifry .zhdet{ border-color:rgba(245,158,11,.4); background:rgba(245,158,11,.08); }
.bk-reestr-cifry .zhdet b{ color:#fbbf24; }
.bk-reestr-cifry .gotovo{ border-color:rgba(74,222,128,.35); background:rgba(22,163,74,.08); }
.bk-reestr-cifry .gotovo b{ color:#4ade80; }
.bk-reestr-niz{ display:flex; flex-direction:column; gap:8px; margin-top:auto; }
.bk-reestr-knopki{ display:flex; gap:8px; }
.bk-reestr-knopki .bk-knopka{ flex:1; }
.bk-reestr-poisk{ background:rgba(2,6,23,.5); border:1px solid var(--line); color:var(--txt);
  border-radius:10px; padding:8px 12px; font-size:12.5px; width:100%;
  box-sizing:border-box; font-family:inherit; }
.bk-reestr-poisk:focus{ outline:none; border-color:var(--bank); }
.bk-hod-pod{ font-size:11.5px; color:var(--dim); margin-top:6px; }
.bk-hod-pod .zheltoe{ color:#fbbf24; }

.bk-net{ color:var(--dim); font-weight:400; font-size:11px; }
.bk-zhdet{ color:#fbbf24; font-size:11px; font-weight:700; }
.bk-reestr-imya{ transition:color .15s; }
.bk-knopka.shirokaya{ width:100%; background:rgba(2,6,23,.5); border:1px solid var(--line);
  color:var(--txt); border-radius:10px; padding:9px 12px; font-size:12px; font-weight:700;
  cursor:pointer; transition:border-color .15s, background .15s; }
.bk-knopka.shirokaya:hover{ border-color:var(--bank); background:rgba(22,163,74,.1); }
.bk-vybor{ display:flex; gap:8px; margin-bottom:12px; }
.bk-vklad{ background:rgba(2,6,23,.5); border:1px solid var(--line); color:var(--dim);
  border-radius:999px; padding:6px 14px; font-size:11.5px; font-weight:700; cursor:pointer;
  transition:all .15s; font-family:inherit; }
.bk-vklad:hover{ color:var(--txt); border-color:var(--bank); }
.bk-vklad.gorit{ background:rgba(22,163,74,.18); border-color:#4ade80; color:#4ade80; }
.bk-sostoyanie{ font-size:10.5px; color:var(--dim); }
.bk-tab tr.beda td{ background:rgba(245,158,11,.07); }
.bk-svodka .gotovo{ border-color:rgba(74,222,128,.35); background:rgba(22,163,74,.07); }
.bk-svodka .gotovo b{ color:#4ade80; }
/* ⛔ платёж ушёл в 1С без покупателя — порча в учёте, чинить руками */
.bk-kl.porcha{ background:rgba(220,38,38,.24); color:#fecaca; border-color:#f87171;
  cursor:pointer; font-weight:800; }
.bk-legenda .kl.porcha{ background:rgba(220,38,38,.24); border-color:#f87171; }
.bk-den.porcha{ border-color:rgba(248,113,113,.5); background:rgba(220,38,38,.1); }

/* Шапка таблицы при прокрутке — СПЛОШНАЯ.
   Была полупрозрачной, и сквозь неё просвечивали уезжающие строки. */
.bk-tab thead th{ background:#0f172a; box-shadow:0 1px 0 var(--line); z-index:2; }
.bk-tab-obertka{ background:rgba(2,6,23,.35); }

/* дни в раскладе месяца — зелёные, когда бед нет */
.bk-den.chisto{ border-color:rgba(74,222,128,.4); background:rgba(22,163,74,.1); }
.bk-den.gotov{ border-color:#4ade80; background:rgba(22,163,74,.2); }
.bk-den.beda{ border-color:rgba(245,158,11,.5); background:rgba(245,158,11,.09); }
.bk-dni-ryad{ display:grid; grid-template-columns:repeat(auto-fill,minmax(106px,1fr));
  gap:8px; margin-bottom:16px; }

/* ── коды заказов ── */
.bk-kody{ display:flex; flex-direction:column; gap:8px; margin-bottom:14px; }
.bk-kod{ display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:rgba(2,6,23,.45); border:1px solid var(--line); border-radius:11px; padding:10px 13px; }
.bk-kod b{ font-size:15px; font-weight:900; font-family:ui-monospace,Menlo,monospace;
  min-width:42px; }
.bk-kod-opis{ color:var(--dim); font-size:12px; flex:1 1 auto; }
.bk-kod-schyot{ font-size:11px; color:var(--dim); }
.bk-kod-ubrat{ background:none; border:none; color:var(--dim); font-size:17px; cursor:pointer;
  line-height:1; padding:0 3px; }
.bk-kod-ubrat:hover{ color:#fca5a5; }
.bk-ptichka{ display:inline-flex; align-items:center; gap:6px; font-size:11px;
  color:var(--dim); cursor:pointer; user-select:none; }
.bk-ptichka input{ width:15px; height:15px; accent-color:#16a34a; cursor:pointer; }
.bk-kod-novyy{ display:flex; gap:8px; align-items:center; flex-wrap:wrap;
  border-top:1px solid var(--line); padding-top:13px; }
.bk-kod-novyy .bk-reestr-poisk{ width:auto; flex:1 1 150px; }
.bk-v1c{ font-size:10.5px; font-weight:700; color:#4ade80; background:rgba(22,163,74,.14);
  border:1px solid rgba(74,222,128,.35); border-radius:999px; padding:2px 8px; white-space:nowrap; }
/* пояснение, которое должно успокаивать, а не пугать */
.bk-poyas.spokoyno{ color:#bfdbfe; background:rgba(59,130,246,.09);
  border-left-color:rgba(96,165,250,.55); line-height:1.55; }
.bk-poyas.spokoyno b{ color:#dbeafe; }

/* ── таблица дня: разбор комиссии двумя ярусами ── */
.bk-tab th.grupa{ text-align:center; border-bottom:1px solid rgba(148,163,184,.2);
  color:#94a3b8; letter-spacing:.04em; }
.bk-tab th.pod{ font-size:9.5px; color:#64748b; text-transform:none; letter-spacing:0;
  font-weight:600; padding-top:2px; }
.bk-tab.kaspi th{ vertical-align:bottom; }
.bk-otm{ width:22px; text-align:center; padding-right:0 !important; }
.bk-stavka{ color:#64748b; font-size:11px; font-variant-numeric:tabular-nums; }
.bk-kom.itog{ font-weight:800; color:#fca5a5; }
.bk-pp{ font-family:ui-monospace,Menlo,monospace; font-size:11px; color:#4ade80; }
.bk-vip{ color:#fbbf24; font-size:11px; }

/* ★ особый заказ, которого нет ни в реестре, ни в учёте — рыжий */
.bk-kl.vip{ background:rgba(249,115,22,.24); color:#fed7aa; border-color:#f97316; cursor:pointer; }
.bk-legenda .kl.vip{ background:rgba(249,115,22,.24); border-color:#f97316; }
.bk-den.vip{ border-color:rgba(249,115,22,.5); background:rgba(249,115,22,.1); }

/* беда дня — сразу в окне, с тем, что можно сделать */
.bk-beda-blok{ display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:rgba(249,115,22,.08); border:1px solid rgba(249,115,22,.35);
  border-radius:12px; padding:12px 14px; margin-bottom:12px; }
.bk-beda-znak{ font-size:18px; }
.bk-beda-tekst{ flex:1 1 260px; font-size:12.5px; color:#fed7aa; line-height:1.5; }
.bk-sr-stroka.net{ color:#fca5a5; }

/* ── строка компаний с клавишами: верх страницы должен быть лёгким ── */
.bk-stroka{ display:flex; align-items:center; justify-content:space-between;
  gap:14px; flex-wrap:wrap; margin-bottom:18px; }
.bk-stroka .bk-firmy, .bk-stroka .bk-odna{ margin:0; }
.bk-deystviya{ display:flex; gap:9px; flex-wrap:wrap; margin-left:auto; }
.bk-klavisha{ display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-radius:12px; padding:10px 15px;
  color:var(--txt); font-size:12.5px; font-weight:700; font-family:inherit;
  transition:transform .15s, border-color .15s, box-shadow .15s; }
.bk-klavisha:hover{ transform:translateY(-1px); border-color:var(--bank);
  box-shadow:0 6px 16px rgba(0,0,0,.28); }
.bk-klavisha.gorit{ border-color:var(--bank); background:rgba(22,163,74,.14); color:#dcfce7; }
.bk-klavisha-znak{ font-size:15px; }
.bk-klavisha-cifra{ font-size:10.5px; color:var(--dim); font-weight:800;
  background:rgba(2,6,23,.5); border-radius:999px; padding:2px 8px; }
.bk-klavisha.gorit .bk-klavisha-cifra{ color:#4ade80; }

/* раскрытая форма занимает ширину целиком, без пустой второй колонки */
.bk-verh.odna-forma{ grid-template-columns:1fr; animation:bk-raskrylos .22s ease-out; }
@keyframes bk-raskrylos{ from{ opacity:0; transform:translateY(-6px) } to{ opacity:1; transform:none } }
.bk-verh.odna-forma .bk-reestr{ flex-direction:row; align-items:center; flex-wrap:wrap; gap:16px; }
.bk-verh.odna-forma .bk-reestr-cifry{ flex-direction:row; }
.bk-verh.odna-forma .bk-reestr-niz{ margin-left:auto; flex-direction:row; align-items:center; }
.bk-verh.odna-forma .bk-reestr-poisk{ width:190px; }
.bk-verh.odna-forma .bk-knopka.shirokaya{ width:auto; }

/* клавиши держатся правого края, даже когда строка переносится */
.bk-deystviya{ margin-left:auto; justify-content:flex-end; }
@media (max-width:700px){
  .bk-stroka{ align-items:stretch; }
  .bk-deystviya{ width:100%; justify-content:flex-end; }
}
.bk-svodka em.bk-vnutri{ display:block; font-style:normal; font-size:10px; color:#fca5a5;
  margin-top:3px; }
.bk-karta.chastichno{ border-top-color:var(--wathaiq, #f59e0b); }
.bk-sost.chastichno{ background:rgba(245,158,11,.16); color:#fbbf24; }

/* ── что портал понимает: видно сразу в форме приёма ── */
.bk-ponimaem{ display:flex; flex-direction:column; gap:6px; margin-top:14px;
  padding-top:13px; border-top:1px solid var(--line); text-align:left; }
.bk-ponimaem-zagolovok{ font-size:10px; color:#64748b; text-transform:uppercase;
  letter-spacing:.08em; font-weight:800; }
.bk-ponimaem-stroka{ font-size:11.5px; color:var(--dim); line-height:1.5; }
.bk-ponimaem-stroka b{ color:var(--txt); font-weight:800; }
.bk-ponimaem-pod{ font-size:10.5px; color:#64748b; font-style:italic; margin-top:2px; }

/* ── безопасный режим: играться можно, следов не остаётся ── */
.bk-bezopasno{ display:flex; align-items:center; gap:9px; cursor:pointer; user-select:none;
  margin-top:14px; padding:9px 13px; border-radius:11px; text-align:left;
  background:rgba(59,130,246,.08); border:1px solid rgba(96,165,250,.3); }
.bk-bezopasno:hover{ border-color:rgba(96,165,250,.55); }
.bk-bezopasno input{ width:16px; height:16px; accent-color:#3b82f6; cursor:pointer; flex:0 0 auto; }
.bk-bezopasno span{ font-size:11.5px; color:#bfdbfe; line-height:1.45; }
.bk-bezopasno b{ color:#dbeafe; }

/* легенда — НАД календарём: сперва читаешь, чем красят, потом смотришь год */
.bk-legenda.nad{ margin:0 0 12px; padding-bottom:11px;
  border-bottom:1px solid var(--line); }
.bk-legenda .kl.bezkontrolya{ background:rgba(139,92,246,.22); border-color:#a78bfa; }
.bk-kl.bezkontrolya{ background:rgba(139,92,246,.22); color:#ddd6fe; border-color:#a78bfa; }

/* покупатель, его БИН и договор — всё в строке, как просил Батя */
.bk-kto em.bk-bin{ display:block; font-style:normal; font-size:9.5px; color:#64748b;
  font-family:ui-monospace,Menlo,monospace; margin-top:1px; }
.bk-dogovor{ font-size:11px; color:#a5b4fc; white-space:nowrap; }
.bk-summa em.bk-nds-prod{ display:block; font-style:normal; font-size:9.5px;
  color:#64748b; margin-top:1px; font-weight:400; }

/* список файлов раскрывается клавишей — год не должен тонуть в карточках */
.bk-spisok.raskrylsya{ animation:bk-raskrylos .22s ease-out; margin-top:18px;
  padding-top:16px; border-top:1px solid var(--line); }
/* где число не из отчёта, а восстановлено нами — так и помечено */
.bk-raschyot{ font-size:8.5px; color:#94a3b8; background:rgba(148,163,184,.16);
  border-radius:4px; padding:1px 4px; vertical-align:1px; }
.bk-kom.raschyot{ opacity:.75; border-bottom:1px dotted rgba(148,163,184,.4); }

/* ══════════════ ВКЛАДЫШ КОМПАНИЙ ══════════════
   Компания — отдельное хозяйство, а не фильтр. Вкладка так и читается. */
.razdel-shapka.bank{ position:relative; }
.razdel-shapka .bk-deystviya{ margin-left:auto; align-items:stretch; }
.bk-vkladysh{ display:flex; align-items:flex-end; justify-content:space-between;
  gap:14px; flex-wrap:wrap; margin:0 0 18px; border-bottom:1px solid var(--line); }
.bk-vkladki{ display:flex; gap:4px; flex-wrap:wrap; }
.bk-vkladka{ background:transparent; border:1px solid transparent; border-bottom:none;
  border-radius:12px 12px 0 0; padding:10px 18px 11px; cursor:pointer; font-family:inherit;
  color:var(--dim); text-align:left; transition:background .15s, color .15s, border-color .15s;
  margin-bottom:-1px; }
.bk-vkladka b{ display:block; font-size:13px; font-weight:800; }
.bk-vkladka span{ display:block; font-size:10.5px; margin-top:2px; opacity:.75; }
.bk-vkladka:hover{ color:var(--txt); background:rgba(148,163,184,.06); }
.bk-vkladka.gorit{ background:var(--karta); border-color:var(--line);
  border-top:2px solid var(--bank); color:var(--txt); }
.bk-zapomnit{ display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  font-size:11px; color:var(--dim); user-select:none; padding-bottom:10px; }
.bk-zapomnit input{ width:14px; height:14px; accent-color:#16a34a; cursor:pointer; }

/* клавиши — квадратные, слова переносятся, а не растягивают строку */
.bk-klavisha{ flex-direction:column; align-items:center; justify-content:center; gap:5px;
  width:96px; min-height:80px; padding:11px 8px; text-align:center; line-height:1.25;
  white-space:normal; font-size:11.5px; }
.bk-klavisha-znak{ font-size:19px; }
.bk-klavisha-cifra{ padding:1px 7px; font-size:10px; }

/* ══════════════ СТАТИСТИКА ══════════════ */
.bk-statistika{ margin-bottom:20px; }
.bk-plitki{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:11px; margin-bottom:11px; }
.bk-plitki.glavnye{ grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); }
.bk-plitka{ background:var(--karta); backdrop-filter:blur(8px); border:1px solid var(--line);
  border-radius:14px; padding:14px 16px; min-width:0; }
.bk-plitka-imya{ display:block; font-size:10px; color:#64748b; text-transform:uppercase;
  letter-spacing:.07em; font-weight:800; }
.bk-plitka b{ display:block; font-size:20px; font-weight:900; letter-spacing:-.03em;
  margin-top:6px; font-variant-numeric:tabular-nums; }
.bk-plitka em{ display:block; font-style:normal; font-size:10.5px; color:var(--dim); margin-top:4px; }
.bk-plitka.krupno{ border-top:3px solid var(--bank); }
.bk-plitka.krupno b{ font-size:26px; }
.bk-plitka.kom{ border-top:3px solid rgba(220,38,38,.6); }
.bk-plitka.kom b{ color:#fca5a5; }
.bk-plitka.chisto{ border-top:3px solid #4ade80; }
.bk-plitka.chisto b{ color:#4ade80; }
.bk-plitka.gotovo b{ color:#4ade80; }
.bk-plitka.osobye{ border-top:3px solid #f97316; }
.bk-plitka.osobye b{ color:#fdba74; }

/* ритм года — столбики по месяцам */
.bk-ritm{ background:rgba(2,6,23,.42); border:1px solid var(--line); border-radius:14px;
  padding:14px 16px; margin-bottom:11px; }
.bk-ritm-shapka{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.bk-ritm-shapka b{ font-size:13px; font-weight:800; }
.bk-ritm-shapka span{ font-size:10.5px; color:var(--dim); }
.bk-ritm-stolby{ display:flex; align-items:flex-end; gap:6px; height:110px; }
.bk-ritm-stolb{ flex:1; display:flex; flex-direction:column; align-items:center;
  justify-content:flex-end; height:100%; cursor:pointer; min-width:0; }
.bk-ritm-stolb i{ display:flex; align-items:flex-end; width:100%; border-radius:6px 6px 0 0;
  background:rgba(34,197,94,.22); border:1px solid rgba(74,222,128,.3); border-bottom:none;
  transition:background .15s, transform .15s; overflow:hidden; }
.bk-ritm-stolb u{ display:block; width:100%; background:rgba(34,197,94,.55); }
.bk-ritm-stolb:hover i{ background:rgba(34,197,94,.35); transform:translateY(-2px); }
.bk-ritm-stolb span{ font-size:9.5px; color:var(--dim); margin-top:5px; text-transform:capitalize; }

/* выделки: самое крупное */
.bk-vydelki{ display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr));
  gap:11px; margin-bottom:11px; }
.bk-vydelka{ display:flex; align-items:center; gap:11px; background:rgba(2,6,23,.42);
  border:1px solid var(--line); border-radius:13px; padding:12px 14px; min-width:0; }
.bk-vydelka i{ font-style:normal; font-size:19px; }
.bk-vydelka span{ display:block; font-size:10px; color:#64748b; text-transform:uppercase;
  letter-spacing:.06em; font-weight:800; }
.bk-vydelka b{ display:block; font-size:12.5px; font-weight:800; margin-top:3px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bk-vydelka[onclick]{ cursor:pointer; transition:border-color .15s; }
.bk-vydelka[onclick]:hover{ border-color:var(--bank); }

/* списки: кто покупает и по договорам */
.bk-spiski{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:11px; }
.bk-spisok-blok{ background:rgba(2,6,23,.42); border:1px solid var(--line);
  border-radius:14px; padding:13px 15px; min-width:0; }
.bk-spisok-blok > b{ display:block; font-size:12.5px; font-weight:800; margin-bottom:9px; }
.bk-spisok-stroka{ position:relative; display:flex; align-items:center; gap:9px;
  padding:6px 0; font-size:11.5px; border-bottom:1px solid rgba(148,163,184,.07); }
.bk-spisok-kto{ flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; }
.bk-spisok-schyot{ color:var(--dim); font-size:10.5px; white-space:nowrap; }
.bk-spisok-summa{ font-weight:800; font-variant-numeric:tabular-nums; white-space:nowrap; }
.bk-spisok-polosa{ position:absolute; left:0; bottom:0; height:2px; background:var(--bank);
  border-radius:2px; opacity:.5; }

/* клетка с двумя числами: одно без другого не читается */
.bk-plitka.dve .bk-dve{ display:flex; gap:14px; margin-top:7px; }
.bk-plitka.dve .bk-dve > div{ flex:1; min-width:0; }
.bk-plitka.dve .bk-dve i{ display:block; font-style:normal; font-size:9.5px; color:#64748b;
  text-transform:uppercase; letter-spacing:.05em; font-weight:700; }
.bk-plitka.dve .bk-dve b{ display:block; font-size:16px; font-weight:900; letter-spacing:-.03em;
  margin-top:2px; font-variant-numeric:tabular-nums; }
.bk-plitka.dve .bk-dve .vtoraya{ border-left:1px solid var(--line); padding-left:14px; }
.bk-plitka.kom .bk-dve b{ color:#fca5a5; }
.bk-plitka.nds{ border-top:3px solid #a78bfa; }
.bk-plitka.nds .bk-dve b{ color:#c4b5fd; }

/* ── ТЕКУЩАЯ КОМПАНИЯ посередине шапки ── */
.bk-tekushchaya{ text-align:center; cursor:pointer; padding:6px 18px; border-radius:13px;
  border:1px solid transparent; transition:border-color .15s, background .15s; min-width:0; }
.bk-tekushchaya:hover{ border-color:var(--line); background:rgba(2,6,23,.35); }
.bk-tekushchaya-nad{ display:block; font-size:9.5px; color:#64748b; text-transform:uppercase;
  letter-spacing:.1em; font-weight:800; }
.bk-tekushchaya b{ display:block; font-size:17px; font-weight:900; letter-spacing:-.02em;
  margin-top:2px; }
.bk-tekushchaya-pod{ display:block; font-size:10.5px; color:var(--dim); margin-top:2px; }

/* окно выбора компании */
.bk-vybor-firm{ display:grid; grid-template-columns:repeat(auto-fill,minmax(215px,1fr));
  gap:10px; margin-bottom:14px; }
.bk-firma-karta{ background:rgba(2,6,23,.45); border:1px solid var(--line); border-radius:13px;
  padding:14px 15px; cursor:pointer; text-align:left; font-family:inherit; color:var(--txt);
  transition:transform .15s, border-color .15s, box-shadow .15s; }
.bk-firma-karta:hover{ transform:translateY(-2px); border-color:var(--bank);
  box-shadow:0 8px 20px rgba(0,0,0,.3); }
.bk-firma-karta.gorit{ border-color:var(--bank); background:rgba(22,163,74,.12); }
.bk-firma-znak{ font-size:19px; }
.bk-firma-karta b{ display:block; font-size:13.5px; font-weight:800; margin-top:6px; }
.bk-firma-rol{ display:block; font-size:11px; color:var(--dim); margin-top:3px; }
.bk-firma-bin{ display:block; font-size:10px; color:#64748b; margin-top:2px;
  font-family:ui-monospace,Menlo,monospace; }
.bk-zapomnit.v-okne{ padding:0 0 4px; }

/* дорожка из Банков в Пульс: разбор живёт там */
.bk-k-pulsu{ display:flex; align-items:center; gap:10px; text-decoration:none;
  background:rgba(2,6,23,.42); border:1px solid var(--line); border-radius:13px;
  padding:11px 15px; margin-bottom:14px; color:var(--dim); font-size:12.5px;
  transition:border-color .15s, color .15s; }
.bk-k-pulsu:hover{ border-color:var(--bank); color:var(--txt); }
.bk-k-pulsu span{ font-size:17px; }
.bk-k-pulsu b{ color:var(--txt); }
.pl-vperedi{ margin-top:14px; padding:12px 15px; border-radius:12px; font-size:11.5px;
  color:var(--dim); background:rgba(2,6,23,.35); border:1px dashed var(--line); }
.razdel-shapka.puls .znak{ background:linear-gradient(180deg,#dc2626,#991b1b); }

/* ══════════════ ПЛИТКА ПУЛЬСА на главной кабинета ══════════════
   Единственная плитка, которая не просто дверь: показывает дело сразу. */
.plitka.puls{ --bank:#dc2626; cursor:pointer; position:relative; }
.plitka.puls.shirokaya{ grid-column:span 2; }
@media (max-width:820px){ .plitka.puls.shirokaya{ grid-column:span 1; } }
.puls-firma{ display:inline-flex; align-items:center; gap:6px; margin:2px 0 12px;
  padding:5px 12px; border-radius:999px; cursor:pointer; font-size:11.5px; font-weight:700;
  background:transparent; border:1px solid transparent; color:var(--txt);
  transition:border-color .15s, background .15s; }
.puls-firma:hover{ border-color:rgba(148,163,184,.4); background:rgba(2,6,23,.35); }
.puls-firma:hover{ border-color:#dc2626; }
.puls-firma i{ font-style:normal; font-size:9px; color:var(--dim); }
.puls-vybor{ display:none; position:absolute; z-index:5; margin-top:-8px;
  background:#0f172a; border:1px solid var(--line); border-radius:12px; padding:6px;
  box-shadow:0 12px 30px rgba(0,0,0,.45); }
.puls-vybor.vidno{ display:block; }
.puls-vybor button{ display:block; width:100%; text-align:left; background:none; border:none;
  color:var(--txt); font-family:inherit; font-size:12px; padding:8px 12px; border-radius:9px;
  cursor:pointer; white-space:nowrap; }
.puls-vybor button:hover{ background:rgba(220,38,38,.16); }
.puls-cifry{ display:grid; grid-template-columns:repeat(auto-fit,minmax(112px,1fr)); gap:9px;
  margin-bottom:12px; }
.puls-cifra{ background:rgba(2,6,23,.4); border:1px solid var(--line); border-radius:11px;
  padding:9px 11px; min-width:0; }
.puls-cifra i{ display:block; font-style:normal; font-size:15px; font-weight:900;
  letter-spacing:-.02em; font-variant-numeric:tabular-nums;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.puls-cifra span{ display:block; font-size:9.5px; color:var(--dim); margin-top:2px; }
.puls-cifra.glavnaya{ border-color:rgba(220,38,38,.4); background:rgba(220,38,38,.08); }
.puls-cifra.glavnaya i{ font-size:19px; }
.puls-cifra.kom i{ color:#fca5a5; }
.puls-cifra.nds i{ color:#c4b5fd; }
.puls-cifra.gotovo i{ color:#4ade80; }
.puls-cifra.zhdet i{ color:#fbbf24; }

/* пульс должен биться: знак живой, а плитка чуть дышит рамкой */
.plitka.puls .znak{ animation:puls-bienie 2.4s ease-in-out infinite; }
@keyframes puls-bienie{
  0%, 62%, 100%{ transform:scale(1); }
  68%{ transform:scale(1.18); }
  74%{ transform:scale(1.02); }
  80%{ transform:scale(1.12); }
  86%{ transform:scale(1); }
}
.plitka.puls{ animation:puls-obodok 2.4s ease-in-out infinite; }
@keyframes puls-obodok{
  0%, 60%, 100%{ box-shadow:0 0 0 0 rgba(220,38,38,0); }
  70%{ box-shadow:0 0 0 4px rgba(220,38,38,.14); }
  85%{ box-shadow:0 0 0 2px rgba(220,38,38,.08); }
}
@media (prefers-reduced-motion: reduce){
  .plitka.puls, .plitka.puls .znak{ animation:none; }
}

/* Компания и клавиши — оба справа, одной группой: по центру шапка «разбивается»
   и заголовок раздела теряется (поправка Бати 23.08). */
.razdel-shapka .bk-tekushchaya{ margin-left:auto; text-align:right; }
.razdel-shapka .bk-deystviya{ margin-left:14px; }
@media (max-width:820px){
  .razdel-shapka .bk-tekushchaya{ margin-left:0; text-align:left; }
  .razdel-shapka .bk-deystviya{ margin-left:0; width:100%; }
}

/* строка «сегодня» на плитке пульса */
.puls-segodnya{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-bottom:11px;
  font-size:11px; color:var(--dim); }
.puls-segodnya b{ font-size:10px; text-transform:uppercase; letter-spacing:.08em;
  color:#fca5a5; font-weight:800; }
.puls-segodnya span{ background:rgba(2,6,23,.45); border:1px solid var(--line);
  border-radius:999px; padding:3px 10px; }
.puls-segodnya span.summa{ color:var(--txt); font-weight:700; }

/* ══════════════ КАБИНЕТ: ПУЛЬС СЛЕВА, ПЛИТКИ СПРАВА ══════════════
   Плитки — двери, их выбирают. Пульс — то, на что смотрят, стоя у входа.
   Разное занятие — разное место (слово Бати 23.08). */
/* Пульс — первая клетка сетки, вытянутая вниз: слева и во всю высоту ряда. */
.puls-polosa{ grid-row:span 2; display:flex; flex-direction:column;
  background:var(--karta); backdrop-filter:blur(8px);
  border:1px solid var(--line); border-left:3px solid #dc2626;
  border-radius:16px; padding:18px 18px 16px; cursor:pointer;
  transition:border-color .16s, box-shadow .16s;
  animation:puls-obodok 2.4s ease-in-out infinite; }
.puls-polosa:hover{ border-color:#dc2626; }
.puls-polosa-verh{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.puls-polosa-verh .znak{ font-size:26px; animation:puls-bienie 2.4s ease-in-out infinite; }
.puls-polosa-verh h2{ margin:0; font-size:15px; font-weight:900; letter-spacing:-.02em; }
.puls-polosa-verh .vyaz{ font-size:12px; color:var(--dim); font-style:normal; }
.puls-polosa .puls-cifry{ grid-template-columns:1fr; gap:8px; }
.puls-polosa .puls-cifra{ display:flex; align-items:baseline; justify-content:space-between; gap:9px; }
.puls-polosa .puls-cifra i{ font-size:15px; }
.puls-polosa .puls-cifra.glavnaya i{ font-size:19px; }
.puls-polosa .puls-cifra span{ margin-top:0; text-align:right; }
.puls-polosa-niz{ font-size:10.5px; color:var(--dim); margin-top:auto; padding-top:12px;
  border-top:1px solid var(--line); }
.puls-vybor button em{ font-style:normal; color:#64748b; font-size:10px; }
@media (max-width:820px){ .puls-polosa{ grid-row:auto; } }
@media (prefers-reduced-motion: reduce){
  .puls-polosa, .puls-polosa-verh .znak{ animation:none; }
}

/* ══════════════ КАБИНЕТ В ТРИ КОЛОНКИ ══════════════
   Слева — как идут дела, в центре «Экономика» по областям, справа — что
   ждёт тебя. Замысел Бати 23.08. */
.kabinet-tri{ display:grid; grid-template-columns:minmax(0,1fr) 250px 260px;
  gap:16px; align-items:start; }
@media (max-width:1250px){ .kabinet-tri{ grid-template-columns:minmax(0,1fr) 250px; } }
@media (max-width:900px){ .kabinet-tri{ grid-template-columns:1fr; } }

.kolonka-imya{ font-size:11px; font-weight:900; text-transform:uppercase;
  letter-spacing:.12em; color:#64748b; margin:2px 0 12px; padding-bottom:9px;
  border-bottom:1px solid var(--line); }
.kolonka-imya em{ font-style:normal; opacity:.6; letter-spacing:0; margin-left:6px; }
.kolonka-imya.ekonomika{ color:#4ade80; border-bottom-color:rgba(74,222,128,.28); }
.kolonka-imya.rabota{ color:#fbbf24; border-bottom-color:rgba(245,158,11,.28); }

.oblast{ margin-bottom:18px; }
.oblast-imya{ font-size:12px; font-weight:800; color:var(--dim); margin-bottom:9px; }
.oblast-imya em{ font-style:normal; font-size:11px; opacity:.55; margin-left:5px; }
.oblast-plitki{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
@media (max-width:620px){ .oblast-plitki{ grid-template-columns:1fr; } }

.kabinet-centr .plitka, .kabinet-pravo .plitka{ min-width:0; }
.kabinet-pravo .plitka{ margin-bottom:13px; }
.kabinet-levo .puls-polosa{ grid-row:auto; }

/* лента событий под правой колонкой */
.lenta{ display:flex; flex-direction:column; gap:8px; }
.lenta-shapka{ font-size:11px; font-weight:800; color:var(--dim); text-transform:uppercase;
  letter-spacing:.08em; margin:4px 0 4px; }
.lenta-stroka{ display:flex; gap:9px; background:rgba(2,6,23,.42); border:1px solid var(--line);
  border-radius:12px; padding:10px 12px; }
.lenta-znak{ font-size:15px; line-height:1.2; }
.lenta-telo{ min-width:0; flex:1; }
.lenta-chto{ font-size:11.5px; font-weight:700; overflow:hidden; text-overflow:ellipsis;
  white-space:nowrap; }
.lenta-podrobno{ font-size:10.5px; color:var(--dim); margin-top:2px; }
.lenta-kogda{ font-size:9.5px; color:#64748b; margin-top:3px; }
.lenta-sost{ font-size:9.5px; color:#4ade80; }

/* ══════════════ ПУЛЬС ЛЕНТОЙ СВЕРХУ ══════════════
   Одна строка вместо колонки: светится, бьётся, цепляет взгляд — и не
   отнимает места у дела (слово Бати 23.08). */
.puls-lenta{ position:relative; display:flex; flex-direction:column; gap:12px;
  background:linear-gradient(90deg, rgba(220,38,38,.14), rgba(2,6,23,.45) 42%);
  border:1px solid rgba(220,38,38,.35); border-radius:14px;
  padding:11px 16px; margin:0 0 18px; cursor:pointer;
  animation:puls-svechenie 2.4s ease-in-out infinite;
  transition:border-color .16s; }
.puls-lenta:hover{ border-color:#dc2626; }
@keyframes puls-svechenie{
  0%, 60%, 100%{ box-shadow:0 0 0 0 rgba(220,38,38,0), inset 0 0 0 rgba(220,38,38,0); }
  70%{ box-shadow:0 0 18px 0 rgba(220,38,38,.28), inset 0 0 22px rgba(220,38,38,.10); }
  85%{ box-shadow:0 0 8px 0 rgba(220,38,38,.14), inset 0 0 10px rgba(220,38,38,.05); }
}
.puls-lenta-znak{ font-size:20px; animation:puls-bienie 2.4s ease-in-out infinite; flex:0 0 auto; }
.puls-lenta .puls-firma{ margin:0; flex:0 0 auto; }
.puls-lenta .puls-cifry{ display:flex; flex-wrap:wrap; gap:8px; margin:0; flex:1 1 auto; }
.puls-lenta .puls-cifra{ display:flex; align-items:baseline; gap:7px; padding:5px 11px;
  border-radius:999px; background:rgba(2,6,23,.5); border:1px solid var(--line); }
.puls-lenta .puls-cifra i{ font-size:13px; }
.puls-lenta .puls-cifra.glavnaya i{ font-size:15px; }
.puls-lenta .puls-cifra span{ margin:0; font-size:9.5px; }
.puls-lenta .puls-segodnya{ margin:0; flex:0 0 auto; }
.puls-lenta .puls-segodnya span{ padding:2px 8px; font-size:10px; }
.puls-lenta-vhod{ font-size:11px; color:var(--dim); white-space:nowrap; flex:0 0 auto; }
.puls-lenta:hover .puls-lenta-vhod{ color:#fca5a5; }
.puls-lenta .puls-vybor{ top:52px; }
@media (max-width:760px){
  .puls-lenta{ gap:9px; }
  .puls-lenta .puls-cifra span{ display:none; }
}
@media (prefers-reduced-motion: reduce){
  .puls-lenta, .puls-lenta-znak{ animation:none; }
}

/* год в ленте — рядом с компанией, мелко и ровно */
.puls-god{ display:inline-flex; align-items:center; gap:5px; flex:0 0 auto;
  background:transparent; border:1px solid transparent; border-radius:999px;
  padding:3px 8px; transition:border-color .15s, background .15s; }
.puls-god:hover{ border-color:rgba(148,163,184,.4); background:rgba(2,6,23,.35); }
.puls-god button{ width:20px; height:20px; border-radius:50%; border:none; cursor:pointer;
  background:transparent; color:var(--dim); font-size:14px; line-height:1; font-family:inherit; }
.puls-god button:hover{ color:#fca5a5; background:rgba(220,38,38,.14); }
.puls-god b{ font-size:12px; font-weight:800; min-width:34px; text-align:center; }

/* подпись НАД числом */
.puls-lenta .puls-cifra{ flex-direction:column; align-items:flex-start; gap:1px; padding:5px 12px; }
.puls-lenta .puls-cifra span{ font-size:8.5px; text-transform:uppercase; letter-spacing:.07em;
  font-weight:800; color:#64748b; }
.puls-lenta .puls-cifra i{ font-size:14px; }
.puls-lenta .puls-cifra.glavnaya i{ font-size:16px; }
.puls-lenta .puls-cifra.chisto i{ color:#4ade80; }
@media (max-width:760px){ .puls-lenta .puls-cifra span{ display:block; } }

/* области внутри Пульса: деньги, таможня — и дальше инвойсы, товары */
.pl-oblast{ margin-bottom:14px; }
.pl-oblast-imya{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;
  font-size:13px; font-weight:800; margin:18px 0 10px; }
.pl-oblast-imya:first-child{ margin-top:0; }
.pl-oblast-imya em{ font-style:normal; font-size:11px; color:var(--dim); opacity:.7; }
.pl-oblast-imya span{ font-size:10.5px; color:var(--dim); font-weight:400; margin-left:auto; }

/* компания и год — столбиком, год под компанией (слово Бати 23.08) */
.puls-kto{ display:flex; flex-direction:column; align-items:flex-start; gap:5px; flex:0 0 auto; }
.puls-kto .puls-firma{ margin:0; }
.puls-kto .puls-god{ padding:2px 5px; }
.puls-kto .puls-god b{ font-size:11px; min-width:30px; }
.puls-kto .puls-god button{ width:17px; height:17px; font-size:12px; }

/* список компаний виден целиком: лежит слоем поверх, лента его не режет */
/* Список компаний открывается ПОД компанией, по центру: она сама теперь
   стоит посередине, и список у левого края читался как чужой. */
.puls-lenta .puls-vybor{ position:absolute; top:64px; left:50%; transform:translateX(-50%);
  z-index:40; min-width:250px; max-height:300px; overflow:auto; }

/* ── области внутри ленты пульса: Финансы · Затраты · Продажи ── */
.puls-oblast{ display:flex; flex-direction:column; gap:4px; padding:0 14px;
  border-left:1px solid var(--line); }
.puls-oblast:first-of-type{ border-left:none; padding-left:0; }
.puls-oblast-imya{ font-size:8.5px; font-weight:900; text-transform:uppercase;
  letter-spacing:.12em; color:#64748b; }
.puls-oblast.zatraty .puls-oblast-imya{ color:#fca5a5; }
.puls-oblast.prodazhi .puls-oblast-imya{ color:#93c5fd; }
.puls-oblast-kletki{ display:flex; gap:8px; flex-wrap:wrap; }
.puls-lenta .puls-cifra.gotovo i{ color:#4ade80; }
.puls-lenta .puls-cifra.gotovo{ border-color:rgba(74,222,128,.35); background:rgba(22,163,74,.08); }

.puls-po-uchyotu{ font-size:10px; font-weight:800; color:#4ade80;
  background:rgba(22,163,74,.12); border:1px solid rgba(74,222,128,.35);
  border-radius:999px; padding:4px 11px; white-space:nowrap; }
.puls-po-faylu{ font-size:10px; color:var(--dim); background:rgba(2,6,23,.5);
  border:1px solid var(--line); border-radius:999px; padding:4px 11px; white-space:nowrap; }
@media (max-width:900px){
  .puls-oblast{ border-left:none; padding:0; }
}

/* ── лента: крупная строка сверху, области под ней, всё по центру ── */
.puls-glava{ display:flex; align-items:center; justify-content:center; gap:14px;
  flex-wrap:wrap; width:100%; }
.puls-glava .puls-lenta-znak{ font-size:24px; }
.puls-glava .puls-kto{ flex-direction:column; align-items:center; gap:4px; }
.puls-glava .puls-firma{ font-size:14px; font-weight:900; padding:6px 15px; }
.puls-glava .puls-lenta-vhod{ margin-left:6px; }

.puls-lenta .puls-cifry{ display:flex; justify-content:center; align-items:stretch;
  gap:0; flex-wrap:wrap; width:100%; }
.puls-oblast{ text-align:center; padding:0 16px; }
.puls-oblast-imya{ text-align:center; margin-bottom:5px; }
.puls-oblast-kletki{ justify-content:center; }
.puls-lenta .puls-cifra{ align-items:center; text-align:center; }
.puls-lenta .puls-cifra span{ text-align:center; }
.puls-oblast.privezli .puls-oblast-imya{ color:#c4b5fd; }

/* отметка учёта — своей клеткой, с датой */
.puls-uchyot{ display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; padding:7px 15px; border-radius:12px; margin-left:6px; text-align:center; }
.puls-uchyot b{ font-size:11px; font-weight:800; white-space:nowrap; }
.puls-uchyot span{ font-size:9.5px; opacity:.75; white-space:nowrap; }
.puls-uchyot.da{ color:#4ade80; background:rgba(22,163,74,.12);
  border:1px solid rgba(74,222,128,.4); }
.puls-uchyot.net{ color:var(--dim); background:rgba(2,6,23,.5); border:1px solid var(--line); }
@media (max-width:900px){
  .puls-oblast{ padding:0 8px; }
  .puls-uchyot{ margin:6px auto 0; }
}
.kolonka-imya.novosti{ color:#93c5fd; border-bottom-color:rgba(147,197,253,.28); }
.kabinet-novosti{ min-width:0; }

/* сердце слева, под ним «сегодня»; компания с годом — посередине */
.puls-glava{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; }
.puls-serdce{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; }
.puls-serdce .puls-lenta-znak{ font-size:26px; }
.puls-serdce .puls-segodnya{ margin:0; font-size:10px; }
.puls-serdce .puls-segodnya b{ font-size:9px; }
.puls-serdce .puls-segodnya span{ padding:2px 8px; font-size:9.5px; }
.puls-glava .puls-kto{ justify-content:center; }
@media (max-width:760px){
  .puls-glava{ grid-template-columns:1fr; justify-items:center; }
  .puls-serdce{ align-items:center; }
}

/* «Детально» — клавиша под чертой, мерцает, но не кричит */
.puls-detalno{ align-self:center; padding:7px 18px; cursor:pointer; white-space:nowrap;
  font-family:inherit; font-size:11.5px; font-weight:800; letter-spacing:.04em;
  color:#fecaca; background:rgba(220,38,38,.12);
  border:1px solid rgba(220,38,38,.45); border-radius:999px;
  animation:puls-mercanie 2.4s ease-in-out infinite;
  transition:background .15s, color .15s, transform .15s; }
.puls-detalno:hover{ background:rgba(220,38,38,.24); color:#fff; transform:translateY(-1px); }
.puls-detalno i{ font-style:normal; }
@keyframes puls-mercanie{
  0%, 55%, 100%{ opacity:.72; box-shadow:0 0 0 0 rgba(220,38,38,0); }
  68%{ opacity:1; box-shadow:0 0 14px 0 rgba(220,38,38,.35); }
  82%{ opacity:.85; box-shadow:0 0 6px 0 rgba(220,38,38,.16); }
}
/* черта над клавишей — граница между цифрами и входом в разбор */
.puls-lenta .puls-cifry{ padding-bottom:11px; border-bottom:1px solid rgba(220,38,38,.22); }
@media (prefers-reduced-motion: reduce){ .puls-detalno{ animation:none; opacity:1; } }

/* два потока в ленте: деньги и таможня — у каждого своя шапка */
.lenta-potok{ margin-bottom:14px; }
.lenta-potok .lenta-shapka{ margin-bottom:7px; }
.lenta-sost{ color:#4ade80; }
.lenta-sost.zhdet{ color:#fbbf24; }
/* черта осталась под цифрами, но клавиша теперь наверху — черту убираем */
.puls-lenta .puls-cifry{ padding-bottom:0; border-bottom:none; }
.puls-glava .puls-kto{ justify-self:center; }

/* компания · «в цифрах» · строка «год + Детально» */
.puls-v-cifrah{ font-size:9.5px; text-transform:uppercase; letter-spacing:.14em;
  color:#64748b; font-weight:800; }
.puls-god-ryad{ display:flex; align-items:center; gap:8px; }
.puls-god-ryad .puls-detalno{ padding:5px 14px; font-size:10.5px; }

/* печать учёта — справа в шапке ленты */
.puls-uchyot-mesto{ justify-self:end; }
.puls-uchyot-mesto .puls-uchyot{ margin:0; align-items:flex-end; text-align:right; }
@media (max-width:760px){
  .puls-uchyot-mesto{ justify-self:center; }
  .puls-uchyot-mesto .puls-uchyot{ align-items:center; text-align:center; }
}

/* закладки ленты: потоки рядом, а не друг под другом */
.lenta-zakladki{ display:flex; gap:6px; margin-bottom:10px; }
.lenta-zakladka{ display:inline-flex; align-items:center; gap:6px; flex:1;
  justify-content:center; cursor:pointer; font-family:inherit; font-size:11px;
  font-weight:700; color:var(--dim); background:rgba(2,6,23,.45);
  border:1px solid var(--line); border-radius:10px; padding:7px 9px;
  transition:color .15s, border-color .15s, background .15s; }
.lenta-zakladka:hover{ color:var(--txt); border-color:rgba(147,197,253,.45); }
.lenta-zakladka.gorit{ color:#dbeafe; background:rgba(59,130,246,.16);
  border-color:rgba(147,197,253,.55); }
.lenta-zakladka i{ font-style:normal; font-size:9.5px; font-weight:800;
  background:rgba(2,6,23,.55); border-radius:999px; padding:1px 6px; }

/* подпись под сердцем вместо клавиши: лента и так вся кликабельна */
.puls-klikni{ font-size:9.5px; color:#fca5a5; opacity:.75; letter-spacing:.06em;
  animation:puls-mercanie 2.4s ease-in-out infinite; }
.puls-lenta:hover .puls-klikni{ opacity:1; color:#fecaca; }
@media (prefers-reduced-motion: reduce){ .puls-klikni{ animation:none; } }

/* компания и год стоят строго по центру ленты; рамка появляется под курсором —
   она подсказывает, что здесь есть меню, но не рисует лишних коробок */
.puls-glava .puls-kto{ justify-self:center; align-items:center; }
.puls-glava .puls-serdce{ justify-self:start; }
.puls-uchyot-mesto{ justify-self:end; }
.puls-firma:hover, .puls-god:hover{ cursor:pointer; }

/* подсказка относится ко ВСЕЙ ленте, потому и стоит под ней, по центру,
   а не встык к «сегодня» — иначе читается как «кликни, почему тихо» */
.puls-klikni{ align-self:center; text-align:center; margin-top:2px; }

/* сердце и подсказка — одной строкой, «сегодня» под ними */
.puls-serdce-ryad{ display:flex; align-items:center; gap:9px; }
.puls-serdce .puls-klikni{ margin:0; align-self:center; text-align:left; max-width:150px;
  line-height:1.3; }

/* «сегодня» — сигнал сердца: стоит вплотную справа от него */
.puls-serdce-ryad .puls-segodnya{ margin:0; }
.puls-serdce .puls-klikni{ margin-top:2px; max-width:none; }

/* подсказка отделена чертой: она про всю ленту, а не про соседнюю строку */
.puls-klikni{ align-self:center; text-align:center; margin-top:9px; padding-top:9px;
  width:100%; max-width:none; border-top:1px solid rgba(220,38,38,.18);
  font-size:10.5px; letter-spacing:.05em; }
.puls-klikni i{ font-style:normal; }
.puls-serdce .puls-klikni{ display:none; }
/* стрелка, которой некуда вести, не должна выглядеть живой */
.puls-god button:disabled, .bk-leto-strelka:disabled{ opacity:.25; cursor:default; }
.puls-god button:disabled:hover, .bk-leto-strelka:disabled:hover{
  color:var(--dim); background:transparent; border-color:var(--line); transform:none; }

/* ── часы в шапке: у самого края, справа от имени ── */
.kto-chasy{ display:flex; flex-direction:column; align-items:flex-end; gap:1px;
  padding-left:14px; margin-left:4px; border-left:1px solid var(--line); }
.kto-chasy b{ font-size:14px; font-weight:800; letter-spacing:.02em;
  font-variant-numeric:tabular-nums; line-height:1.15; }
.kto-chasy span{ font-size:10px; color:var(--dim); white-space:nowrap; }
@media (max-width:820px){ .kto-chasy{ display:none; } }

/* крупные часы в строке приветствия: не служебная метка, а часть встречи */
.privet{ display:flex; align-items:flex-start; justify-content:space-between; gap:18px;
  flex-wrap:wrap; }
.privet-chasy{ text-align:right; margin-left:auto; }
.privet-chasy b{ display:block; font-size:34px; font-weight:900; letter-spacing:-.03em;
  line-height:1; font-variant-numeric:tabular-nums; }
.privet-chasy span{ display:block; font-size:12px; color:var(--dim); margin-top:5px; }
@media (max-width:700px){
  .privet-chasy{ text-align:left; margin-left:0; }
  .privet-chasy b{ font-size:26px; }
}

/* окно магазина: поля ключей */
.bk-magazin-polya{ display:flex; flex-direction:column; gap:11px; margin-bottom:14px; }
.bk-magazin-polya label{ display:flex; flex-direction:column; gap:5px; font-size:11px;
  color:var(--dim); }
.bk-magazin-polya label input.bk-reestr-poisk{ width:100%; }
.bk-ptichka.big{ flex-direction:row; align-items:flex-start; gap:9px; font-size:11.5px;
  line-height:1.45; }
.bk-ptichka.big b{ color:var(--txt); }
.bk-svodka .gotovo b{ color:#4ade80; }

/* строка продажи: товар, количество, адрес — всё для сверки глазами */
.bk-tab.prodazhi td{ vertical-align:top; }
.bk-tovar{ max-width:230px; font-size:11.5px; }
.bk-tovar em.bk-kolvo{ display:block; font-style:normal; font-size:10px; color:#93c5fd;
  margin-top:2px; }
.bk-adres{ max-width:200px; font-size:10.5px; color:var(--dim); }
.bk-summa em.bk-kogda{ display:block; font-style:normal; font-size:9.5px; color:#64748b;
  font-weight:400; margin-top:2px; }

/* ── клавиши в панели реестра: были похожи на серый текст ── */
.bk-reestr-niz .bk-knopka.shirokaya{
  display:flex; align-items:center; justify-content:flex-start; gap:9px;
  width:100%; padding:11px 14px; font-size:12.5px; font-weight:800;
  color:var(--txt); background:rgba(15,23,42,.72);
  border:1px solid rgba(148,163,184,.3); border-radius:12px;
  transition:transform .14s, border-color .14s, background .14s, box-shadow .14s; }
.bk-reestr-niz .bk-knopka.shirokaya:hover{
  transform:translateY(-1px); border-color:var(--bank);
  background:rgba(22,163,74,.14); box-shadow:0 6px 16px rgba(0,0,0,.3); }
.bk-reestr-knopki .bk-knopka{ padding:9px 14px; font-size:12px; font-weight:800; }
.bk-reestr-knopki .bk-knopka.tihaya{ color:var(--txt); background:rgba(15,23,42,.72);
  border:1px solid rgba(148,163,184,.3); }
.bk-reestr-knopki .bk-knopka.tihaya:hover{ border-color:var(--bank); }

/* сам заголовок реестра — видно, что он ведёт в продажи */
.bk-reestr-verh{ padding:2px 0 4px; }
.bk-reestr-imya{ font-size:14px; }
.bk-reestr-verh::after{ content:'открыть продажи →'; display:block; font-size:10px;
  color:#4ade80; opacity:.75; margin-top:3px; }
.bk-reestr-verh:hover::after{ opacity:1; }

/* ── ЦЕПОЧКА ДОКУМЕНТОВ В СТРОКЕ ──
   Зелёным — докуда дошли, серым — что впереди. Видно и путь, и где стоим. */
.bk-cepochka{ max-width:none; width:1%; white-space:nowrap; }
.cep{ flex-wrap:nowrap; }
.cep-zveno{ white-space:nowrap; }
@media (max-width:1100px){ .cep{ flex-wrap:wrap; } .bk-cepochka{ white-space:normal; } }
.cep{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; }
.cep-zveno{ display:inline-flex; flex-direction:column; align-items:center; gap:1px;
  font-size:11px; font-weight:700; padding:5px 10px; border-radius:9px;
  border:1px solid var(--line); background:rgba(2,6,23,.45); color:#475569;
  white-space:nowrap; }
.cep-zveno em{ font-style:normal; font-size:10px; opacity:.85; font-weight:500;
  letter-spacing:.01em; }
.cep-zveno.est{ color:#86efac; border-color:rgba(74,222,128,.3); background:rgba(22,163,74,.08); }
.cep-zveno.teper{ color:#dcfce7; border-color:#4ade80; background:rgba(22,163,74,.22);
  box-shadow:0 0 0 1px rgba(74,222,128,.25); }
.cep-strelka{ font-style:normal; font-size:11px; color:#334155; }
.cep-strelka.est{ color:#4ade80; }


/* ── ЦЕПОЧКА В БАНКАХ: В СТРОКУ, А НЕ СТОЛБИКОМ (слово Отца 15.09.2026:
   «надо цепочку сделать более горизонтальной»). Было: имя сверху, номер
   снизу — строка таблицы вдвое выше нужного. Стало: «ГТД №0012» в строку. ── */
.cep-zveno-gorizont{}
.cep{ gap:3px; }
.cep-zveno{
  flex-direction:row; align-items:baseline; gap:4px;
  padding:3px 8px; border-radius:7px; font-size:10.5px; line-height:1.35;
}
.cep-zveno em{ font-size:9.5px; opacity:.8; }
.cep-strelka{ font-size:9.5px; margin:0 -1px; }
/* на узком стекле складываем в два яруса, а не режем вбок */
@media (max-width:1100px){
  .cep{ flex-wrap:wrap; row-gap:3px; }
}

/* ── ЦЕПОЧКА В ДВА РЯДА (слово Отца 15.09.2026: «хотя бы в 2 рядочка»).
   Шесть звеньев по три в ряд: колонка не тянет таблицу ни вширь, ни ввысь.
   Стрелки между звеньями прячем — в сетке они мешают, порядок и так виден. ── */
.cep-dva-ryada{}
.bk-cepochka{ white-space:normal; width:1%; min-width:250px; }
/* 🔴 Было minmax(0, max-content) — колонки сжимались уже содержимого, и
   звенья наползали друг на друга («доки так наложились», слово Отца 15.09).
   Честная сетка: равные доли, ничему не давать вылезать за свою клетку. */
.cep{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:4px; align-items:stretch;
}
.cep .cep-strelka{ display:none; }
.cep-zveno{
  justify-content:flex-start; width:auto; min-width:0; max-width:100%;
  overflow:hidden; box-sizing:border-box;
}
.cep-zveno em{
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0;
}
@media (max-width:820px){
  .cep{ grid-template-columns:repeat(2, 1fr); }
}

/* связь с 1С: клавиши реверса и синхры под списком заказов */
.bk-svyaz-podpis{ font-size:11px; color:var(--dim); line-height:1.4; margin-left:4px; }
.bk-svyaz-podpis em{ display:block; font-style:normal; font-size:10px; opacity:.75; }
.bk-svyaz-idet{ font-size:12px; color:#86efac; font-weight:700; }
.bk-adres{ display:block; font-style:normal; font-size:9.5px; color:var(--dim); font-weight:400; }


/* строка заказа в разделе «Продажи»: товар и цепочка документов */
.stroka-tovar{ font-size:13px; font-weight:600; color:#cbd5e1;
  margin-top:7px; line-height:1.4; }
.stroka-tovar em{ font-style:normal; color:#cbd5e1; font-weight:700; }
.stroka .cep{ margin-top:9px; }

/* ═══════════════════════════════════════════════════════════════════════
   ТАМОЖНЯ: свод и дорожка пути декларации
   Слово Бати 2026-08-24: «тот же фид, что на brok api — только в нашем
   стиле, супер улучшенном современном».
   ═══════════════════════════════════════════════════════════════════════ */

/* ─── Плитки свода над лентой ──────────────────────────────────────── */
.stroka.dekl{ flex-direction:column; align-items:stretch; gap:0; }
.dekl-verh{
  display:flex; align-items:center; gap:12px; width:100%;
}
@keyframes puls-shag{
  0%,100%{ box-shadow:0 0 0 0 rgba(237,139,0,.45); }
  50%    { box-shadow:0 0 0 6px rgba(237,139,0,0); }
}
@keyframes puls-beda{
  0%,100%{ box-shadow:0 0 0 0 rgba(220,38,38,.5); }
  50%    { box-shadow:0 0 0 6px rgba(220,38,38,0); }
}

/* число внутри шага (сколько реализаций/СНТ/ЭСФ) — под точкой */
/* точка с числом (сколько реализаций, СНТ, ЭСФ) — пилюлей, чтобы влезло */
.stroka.dekl:hover .put-shag.done .tochka,
.stroka.dekl:hover .put-shag.wait .tochka{ transform:scale(1.12); }

@media (max-width:640px){
  .put{ gap:0; }
  .put-shag{ min-width:46px; }
  .put-shag b{ font-size:8px; }
  .st-plitka{ flex:1 1 100px; min-width:100px; padding:10px 12px; }
  .st-plitka b{ font-size:20px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   ЧИСТЫЙ ФИД ТАМОЖНИ — диагностический вид, только для root
   Слово Бати 2026-08-24: «чистый фид как в брок буду видеть только ты и я»,
   «группа roots — это для диагностики и анализа», «тоже с полным json».
   ═══════════════════════════════════════════════════════════════════════ */

.sostoyanie.tusklo{ background:rgba(148,163,184,.14); color:var(--dim); }
.stroka.tusklo{ border-left-color:rgba(148,163,184,.35); opacity:.72; }
.chip.sost-tusklo b{ color:var(--dim); }

/* ─── Плашка-сообщение ─────────────────────────────────────────────── */
.pl-tovar{ color:var(--txt); font-weight:700; }

/* ─── Дорожка в карточке — крупнее, чем в ленте ────────────────────── */
.podzagolovok .pz-tiho{
  font-size:11px; font-weight:500; color:var(--dim);
  text-transform:none; letter-spacing:0; margin-left:10px;
}

/* ─── Таблица разбора ──────────────────────────────────────────────── */
@media (max-width:640px){
  .razbor-shapka > div{ flex:1 1 45%; min-width:0; }
  .syrjo{ font-size:10.5px; max-height:380px; }
  .tolko-root{ margin-left:0; }
}

/* вторая единица (графа 41) — в ней КГД ведёт виртуальный склад */
.gr-znak{ font-size:16px; }
.tkp-imya{
  display:block; font-size:10px; text-transform:uppercase;
  letter-spacing:.4px; color:var(--dim); margin-bottom:8px;
}
.pl-kod{ font-size:10px; color:rgba(148,163,184,.6); margin-left:5px; }
.pl-summa{ font-weight:800; }

/* ─── Документы ─────────────────────────────────────────────────────── */
@media (max-width:640px){
  .dt-daty{ flex-direction:column; gap:12px; padding:14px; }
  .dd-strelka{ flex-direction:row; padding:0; min-width:0; width:100%; gap:10px; }
  .dd-strelka i{ flex:1; }
  .dd-tochka.tihaya{ margin-left:0; text-align:left; }
  .put-schet > div{ flex:1 1 33%; min-width:0; margin-bottom:12px; border-right:none; }
  .zakladki{ overflow-x:auto; flex-wrap:nowrap; scrollbar-width:none; }
  .zakladki::-webkit-scrollbar{ display:none; }
  .zk{ white-space:nowrap; padding:9px 12px; }
  .grafy-setka{ grid-template-columns:1fr; }
  .tovar-karta{ padding:14px; }
}

/* наш артикул (номер заказа) и артикул поставщика — разные вещи, и видно это сразу */
@media (max-width:640px){
  .sd-tiho{ margin-left:0; }
}

/* количество с отметкой графы — рядом с кодами, чтобы всё главное в одной строке */
.ta-razdel{
  font-size:10px; text-transform:uppercase; letter-spacing:.4px;
  color:var(--dim); margin:0 4px 0 10px;
  padding-left:12px; border-left:1px solid var(--line);
}
@media (max-width:640px){
  .ta-razdel{ margin-left:0; padding-left:0; border-left:none; width:100%; }
}

/* ─── Подключения к 1С: что видим и что нам разрешено ───────────────── */
.sv-shapka{ display:flex; align-items:baseline; gap:10px; margin-bottom:12px; flex-wrap:wrap; }
.sv-shapka b{ font-size:12px; text-transform:uppercase; letter-spacing:.5px; }
.sv-shapka span{ font-size:11px; color:var(--dim); }
.sv-spisok{ display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:10px; }
.galka{
  font-size:10.5px; font-weight:700; padding:3px 8px; border-radius:6px;
  background:rgba(148,163,184,.1); color:rgba(148,163,184,.7);
  border:1px solid rgba(148,163,184,.2); white-space:nowrap;
}
.galka.est{ background:rgba(47,147,218,.16); color:#7cc4f5; border-color:rgba(47,147,218,.34); }
.galka.rabota{ background:rgba(237,139,0,.16); color:#fbbf24; border-color:rgba(237,139,0,.34); }
.galka.tihaya{ opacity:.6; }
@media (max-width:640px){
  .ob-rubezh{ flex-wrap:wrap; }
  .ob-rubezh b{ min-width:0; }
  .ob-knopka{ flex:1 1 100%; }
}
a.st-plitka{ text-decoration:none; color:inherit; cursor:pointer;
  transition:border-color .15s ease, transform .12s ease; }
a.st-plitka:hover{ border-color:rgba(148,163,184,.4); transform:translateY(-2px); }
a.st-plitka.vybrana{ border-color:rgba(220,38,38,.5); background:rgba(220,38,38,.07); }
a.st-plitka.vybrana::after{
  content:""; position:absolute; inset:auto 0 0 0; height:2px; background:var(--akcent);
}

/* ─── Свежесть данных ───────────────────────────────────────────────── */
@keyframes puls-svezh{
  0%,100%{ box-shadow:0 0 0 0 rgba(26,158,84,.45); }
  50%    { box-shadow:0 0 0 5px rgba(26,158,84,0); }
}
a.st-plitka.novye::before{ background:#7cc4f5; }
a.st-plitka.novye b{ color:#7cc4f5; }

.sd-imya{
  width:100%; font-size:9.5px; text-transform:uppercase; letter-spacing:.4px;
  color:var(--dim); margin-bottom:3px;
}
.galka.dok{ font-size:10px; padding:2px 7px; }
.galka.dok.est{ background:rgba(26,158,84,.15); color:#6ee7a8; border-color:rgba(26,158,84,.3); }

/* ─── Разбор «не прошли»: подчипы вторым рядом ──────────────────────── */
a.rzs-nomer:hover{ color:#7cc4f5; }
.sv-data{ color:#7cc4f5; font-weight:700; }

/* ─── Не сверялись: те, что дальше не пошли ─────────────────────────── */
button.ss-plitka{
  font:inherit; text-align:left; cursor:pointer;
  transition:border-color .15s ease, transform .12s ease;
}
button.ss-plitka:hover{ transform:translateY(-2px); }
button.ss-plitka.gorit{ border-color:rgba(220,38,38,.5); box-shadow:0 0 0 1px rgba(220,38,38,.25) inset; }
#svod-skolko{ color:var(--txt); font-weight:700; margin-right:8px; }

/* Сбой связи — не вина декларации: показываем коротко, простыню прячем */
.beda-sovet{ margin-top:6px !important; opacity:.85; }
.beda-polnostyu{ margin-top:9px; }
.beda-polnostyu summary{
  cursor:pointer; font-size:11px; color:var(--dim);
  text-decoration:underline dotted; outline:none;
}
.beda-polnostyu pre{
  margin:8px 0 0; padding:9px 12px; border-radius:8px;
  background:rgba(2,6,23,.5); border:1px solid var(--line);
  font-family:ui-monospace,Menlo,Consolas,monospace; font-size:10.5px;
  line-height:1.5; color:#cbd5e1; white-space:pre-wrap; word-break:break-word;
  max-height:220px; overflow:auto;
}

.pole.artikul.nash{
  background:rgba(26,158,84,.14); color:#6ee7a8; border-color:rgba(26,158,84,.3);
}
.pole.artikul.nash i{ color:#a7f3c9; }
.pole.artikul.postavshchika{
  background:rgba(148,163,184,.1); color:var(--dim); border-color:rgba(148,163,184,.24);
}

/* количество по графам в строке товара — как в фиде */
.pole.kolvo{
  background:rgba(47,147,218,.12); color:#7cc4f5; border-color:rgba(47,147,218,.3);
  font-weight:700;
}
.pole.kolvo i{ color:#bae0fb; }
.pole.kolvo.vtoraya{
  background:rgba(111,60,209,.14); color:#c4b5fd; border-color:rgba(111,60,209,.36);
}
.pole.kolvo.vtoraya i{ color:#ddd0ff; }
.pole.kolvo.net{
  background:rgba(220,38,38,.12); color:#fca5a5; border-color:rgba(220,38,38,.3);
}


/* Расхождение по количеству: по декларации пришло одно, отгружено другое.
   Красным, потому что это не мелочь — товар либо не доехал, либо не продан. */
.pole.rashozhdenie i { color: #c0392b; }
.pole.rashozhdenie { color: #c0392b; font-weight: 600; }

/* веса: брутто тише, нетто — по нему считают платежи */
.pole.ves{ background:rgba(148,163,184,.1); border-color:rgba(148,163,184,.22); }
.pole.ves.netto{ background:rgba(237,139,0,.1); color:#fbbf24; border-color:rgba(237,139,0,.26); }
.pole.ves.netto i{ color:#fcd34d; }


/* ─── ОТБОР ПО ДЕКЛАРАЦИИ ───────────────────────────────────────────── */
/* Стоит в одном ряду с поиском и одет так же: системный список среди
   тёмных карточек смотрелся чужим. Стрелку рисуем сами — иначе браузер
   ставит свою, светлую. */







/* отбор включён — видно не приглядываясь */



/* сам список раскрывается средствами системы — красим, чтобы не слепил */


@media (max-width:760px){
  
  
}


/* Кнопка «обновить цепочки»: тише поисковой — она не главное действие,
   а подспорье. Тот же рост и скругление, чтобы ряд не рвался. */




/* наличие документов в сверке внутри ГТД — галка или крестик, не догадки */
.stroka .cep{ flex-wrap:wrap; }
/* .cep-zveno{max-width:none} снято 15.09: распирало клетку сетки */
/* снято 15.09: из-за visible звено распирало клетку сетки */
@media (max-width:900px){
  .cep-zveno{ font-size:10.5px; padding:4px 8px; }
}


/* Плитка расхождений: стоит особняком в конце конвейера — это не этап пути,
   а сигнал беды. Потому красная, а не в общей гамме. */

.stadiya.rashozhdeniya .stadiya-imya,






/* «Ожидаются»: оплачено, но груз ещё в пути. Не беда и не победа —
   потому янтарным: деньги ушли, товар не пришёл, за этим смотрят. */

.stadiya.ozhidayutsya .stadiya-imya,






/* ═══ ПРОДАЖИ: ОБЛАЧКО ОТБОРОВ И ПЛИТКИ ВНИМАНИЯ ═══════════════════════
   Раскладка по слову Бати 24.08: отборы в облачке, поиск короткий рядом,
   плитки «Расхождения» и «Ожидаются» — своей областью, а не хвостом
   конвейера, откуда они вылезали за экран. */

/* кнопка обновления встала в шапку раздела, справа */




/* облачко: все отборы на одной подложке, чтобы читались как одно целое */








/* поле ждёт своего часа — видно, что оно будет */








/* ─── плитки внимания ─────────────────────────────────────────────── */




















@media (max-width:760px){
  
  
  
  
}


/* ─── Дорожка пути: по центру и без наложений ────────────────────────
   Классы разведены с братовыми: у него в карточке декларации свой .shag,
   и одинаковые имена налезали друг на друга — текст становился нечитаем.
   Слово Бати 2026-08-24: «плитки на текст накладываются, не читается»,
   «дорожку по центру сделай». */
@media (max-width:640px){
  .put-shag{ flex:0 1 62px; min-width:48px; }
  .put-shag b{ font-size:8px; }
}

/* Дата выпуска в будущем — так прислал КГД. Не наша ошибка, но заметная. */
a.rzs-kod:hover{ background:rgba(237,139,0,.24); }
@media (max-width:640px){
  .rz-shapka{ flex-direction:column; align-items:flex-start; gap:12px; padding:14px; }
  .rzsh-cifra{ font-size:32px; }
  .rzsh-sprava{ min-width:0; width:100%; }
}

/* ═══ ЗАМОК КОМПАНИЙ И СОСТАВ ДОКУМЕНТОВ (управление) ═══════════════
   Слово Бати 25.08: «я думал, он уже есть»; «ЭДВС, СНТ — где это всё?
   их надо перенести… всё к нам сюда, в кабинет». Раньше правилось
   руками в companies.json на узле. */
.zamki{display:flex;flex-direction:column;gap:10px;margin:10px 0 14px}
.zamok-karta{border:1px solid var(--line);border-radius:12px;background:var(--karta);
  padding:12px 14px;display:flex;flex-direction:column;gap:9px}
.zamok-karta.otkryt{border-color:rgba(234,179,8,.45);background:rgba(234,179,8,.06)}
.zk-imya{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.zk-imya b{font-size:14px;color:var(--txt)}
.zk-bin,.zk-baza{font-size:11.5px;color:var(--dim)}
.zk-ryad{display:flex;gap:16px;flex-wrap:wrap}
.zk-tumbler{display:flex;align-items:center;gap:8px}
.zk-sost{font-size:12.5px;color:var(--dim)}
.zk-sost.zaperto{color:#86efac}
.zk-sost.rabota{color:#fcd34d}
.zk-knopka{padding:5px 12px;border-radius:8px;border:1px solid var(--line);
  background:rgba(148,163,184,.08);color:var(--txt);font-size:12px;cursor:pointer;
  font-family:inherit;transition:.15s}
.zk-knopka:hover{background:rgba(148,163,184,.16)}
.zk-knopka.gasit{border-color:rgba(220,38,38,.45);color:#fca5a5}
.zk-doki{display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  padding-top:8px;border-top:1px dashed var(--line)}
.zk-podpis{font-size:11px;color:var(--dim);margin-right:4px}
.zk-dok-forma{display:inline}
.zk-dok{padding:4px 10px;border-radius:7px;border:1px solid var(--line);
  background:rgba(2,6,23,.4);color:var(--dim);font-size:11.5px;cursor:pointer;
  font-family:inherit;transition:.15s}
.zk-dok:hover{border-color:rgba(148,163,184,.35);color:var(--txt)}
.zk-dok.est{border-color:rgba(34,197,94,.45);color:#86efac;background:rgba(34,197,94,.08)}
.zk-dok.vsegda{cursor:default;border-style:dashed;
  border-color:rgba(37,99,235,.35);background:rgba(37,99,235,.08)}
.zk-kto{font-size:11px;color:var(--dim)}
.zk-pusto{font-size:12.5px;color:#fca5a5}

/* ══ ПРЕДПРОСМОТР И ОТЧЁТ О СОЗДАННОМ ═══════════════════════════════
   Слово Бати 2026-08-25: «кнопку с красивой анимацией и подробным
   отчётом что создано было». Кабинет создаёт документы сам — человек
   должен видеть работу: до неё (что создастся) и после (что вышло). */

/* кнопка в работе: бегущая полоска по низу и мягкое дыхание */
.ob-knopka.rabotaet{ position:relative; overflow:hidden; opacity:.95; }
.ob-knopka.rabotaet::after{
  content:""; position:absolute; left:0; bottom:0; height:2px; width:40%;
  background:linear-gradient(90deg, transparent, var(--jamarik), transparent);
  animation: ob-begom 1.1s linear infinite;
}
@keyframes ob-begom{ from{ transform:translateX(-120%);} to{ transform:translateX(320%);} }

.ob-itog.zhdem .tochki{ display:inline-block; width:10px; height:10px; margin-right:8px;
  border-radius:50%; background:var(--jamarik); animation: ob-puls 1s ease-in-out infinite; }
@keyframes ob-puls{ 0%,100%{ opacity:.35; transform:scale(.8);} 50%{ opacity:1; transform:scale(1.15);} }
#ob-shag{ transition:opacity .25s; }

.ob-itog.vspyshka{ animation: ob-vspyshka .7s ease-out; }
@keyframes ob-vspyshka{
  0%{ box-shadow:0 0 0 0 rgba(22,163,74,.55); }
  100%{ box-shadow:0 0 0 18px rgba(22,163,74,0); }
}

/* состав документов плитками */
.pv-doki{ display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
.pv-dok{ padding:6px 12px; border-radius:999px; font-size:13px; border:1px solid var(--line);
  background:var(--karta); animation: pv-vyplyv .35s ease-out both; }
.pv-dok.da{ color:#86efac; border-color:rgba(22,163,74,.45); background:rgba(22,163,74,.12); }
.pv-dok.net{ color:var(--dim); opacity:.65; }

/* свод и товары */
.pv-svod{ width:100%; border-collapse:collapse; margin:10px 0 14px; font-size:14px; }
.pv-svod td{ color:var(--dim); padding:6px 10px 6px 0; white-space:nowrap; }
.pv-svod th{ text-align:left; padding:6px 24px 6px 0; font-weight:600; }
.pv-svod i{ color:var(--dim); font-style:normal; font-size:12px; }

.pv-tovary{ width:100%; border-collapse:collapse; font-size:13px; margin:8px 0; }
.pv-tovary th{ text-align:left; color:var(--dim); font-weight:500; padding:6px 10px;
  border-bottom:1px solid var(--line); }
.pv-tovary td{ padding:6px 10px; border-bottom:1px solid var(--line); }
.pv-tovary tbody tr{ animation: pv-vyplyv .35s ease-out both; }
.pv-tovary.sozdano td b{ color:var(--txt); }

@keyframes pv-vyplyv{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none;} }

.st-ok{ color:#86efac; }
.st-net{ color:#fbbf24; }
.pv-tovary i{ color:var(--dim); font-style:normal; }

.pv-vrezka{ margin-top:14px; padding:12px; border:1px dashed var(--line); border-radius:10px;
  background:rgba(2,6,23,.35); }
.pv-vrezka > b{ display:block; margin-bottom:8px; color:var(--dim); font-weight:600; }

.ob-podrobno{ margin-top:12px; }
.ob-podrobno summary{ cursor:pointer; color:var(--dim); font-size:13px; }

.zk-knopka.vybrano{background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.45);color:#86efac;cursor:default;display:inline-block}

/* ══ РЕЖИМ ДЕМО ═══════════════════════════════════════════════════════
   Слово Бати 2026-08-25: «писало об этом везде, что он в режиме демо».
   Самое опасное в песочнице — забыть, что ты в песочнице. */
.demo-polosa{background:rgba(245,158,11,.14);border:1px solid rgba(245,158,11,.45);
  color:#fcd34d;border-radius:12px;padding:11px 15px;margin-bottom:14px;font-size:13.5px}
.demo-polosa b{color:#fcd34d}
.zk-demo{padding:3px 9px;border-radius:999px;font-size:10.5px;font-weight:800;
  background:rgba(245,158,11,.18);color:#fcd34d}


/* серверы в «Управлении»: карточка, работы, кого заденет */
.servery{ display:flex; flex-direction:column; gap:10px; margin-bottom:14px; }
.srv-karta{ display:flex; justify-content:space-between; align-items:center; gap:14px;
  padding:15px 18px; border-radius:14px; background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07); }
.srv-karta.vrabote{ border-color:rgba(245,158,11,.45); background:rgba(245,158,11,.08); }
.srv-imya{ font-weight:800; font-size:15px; }
.srv-naznachenie{ font-style:normal; font-size:10.5px; color:#7dd3fc; font-weight:700;
  background:rgba(125,211,252,.12); border-radius:7px; padding:1px 7px; margin-left:7px; }
.srv-host{ font-size:11.5px; color:#9fb3c8; margin-top:2px; font-family:ui-monospace,monospace; }
.srv-sost{ font-size:12px; margin-top:7px; color:#94a3b8; }
.srv-sost.rabota{ color:#fbbf24; font-weight:700; }
.srv-sost.rabota b{ color:#fde68a; font-weight:800; margin-left:4px; }
.srv-sost.rabota span{ color:#94a3b8; font-weight:600; margin-left:6px; }
.srv-zadenet{ font-size:11.5px; color:#9fb3c8; margin-top:6px; }
.srv-zadenet b{ color:#e8eef5; font-weight:700; }
.srv-pravo{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.srv-pravo input[type=text]{ background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10); border-radius:10px; padding:7px 11px;
  color:#e8eef5; font:inherit; font-size:12px; width:190px; outline:none; }
.srv-pravo select{ background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10);
  border-radius:10px; padding:7px 9px; color:#e8eef5; font:inherit; font-size:12px; }


/* ══ ЦЕПОЧКА ДОКУМЕНТОВ — ОКОНЧАТЕЛЬНО, В КОНЦЕ ФАЙЛА ══
   Слово Отца 15.09.2026: два ряда, слова не должны налезать друг на друга.
   Держим здесь, ниже всех прочих правил, чтобы ничто не перебивало. */
.bk-cepochka{ white-space:normal; min-width:180px; max-width:230px; }
/* Две колонки, три ряда (слово Отца 15.09: «широко три колонки, надо в 2»). */
.bk-cepochka .cep{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:3px 4px !important;
  align-items:stretch;
}
.bk-cepochka .cep-strelka{ display:none !important; }
.bk-cepochka .cep-zveno{
  display:flex !important; flex-direction:row !important; align-items:baseline;
  gap:4px; justify-content:flex-start;
  min-width:0 !important; max-width:100% !important; width:auto !important;
  box-sizing:border-box; overflow:hidden;
  padding:3px 7px; border-radius:7px; font-size:10.5px; line-height:1.35;
  white-space:nowrap;
}
.bk-cepochka .cep-zveno em{
  min-width:0; overflow:hidden !important; text-overflow:ellipsis !important;
  white-space:nowrap !important; font-size:9.5px; opacity:.8;
}
@media (max-width:820px){
  .bk-cepochka .cep{ grid-template-columns:repeat(1, minmax(0, 1fr)) !important; }
}

/* Номер строки в таблицах платежей (слово Отца 15.09.2026: «написано пять
   и приходится считать»). Тихий, узкий — считает, но не мешает читать. */
.bk-nom{ width:32px; text-align:right; color:#475569; font-size:11px;
  font-variant-numeric:tabular-nums; padding-right:6px !important; }
th.bk-nom{ color:#475569; }

/* Что проверили перед разноской (слово Отца 15.09.2026: «со сверкой,
   и проверкой, и показыванием ошибок»). Каждая беда — строкой: сколько,
   что именно, чем это кончится и по каким заказам. */
.bk-proverki{ margin:10px 0; padding:10px 12px; border-radius:10px;
  background:rgba(15,23,42,.5); border:1px solid rgba(148,163,184,.14);
  font-size:12px; }
.bk-proverki > b{ display:block; font-size:11px; text-transform:uppercase;
  letter-spacing:.05em; color:var(--dim); margin-bottom:7px; }
.bk-proverka{ display:grid; grid-template-columns:34px 1fr auto; gap:4px 8px;
  align-items:baseline; padding:5px 0;
  border-top:1px solid rgba(148,163,184,.08); }
.bk-proverka:first-of-type{ border-top:none; }
.bk-pr-skolko{ font-weight:800; text-align:right; font-variant-numeric:tabular-nums; }
.bk-pr-chto{ color:#e2e8f0; }
.bk-pr-itog{ color:var(--dim); font-size:11px; }
.bk-pr-kto{ grid-column:2 / -1; display:flex; flex-wrap:wrap; gap:3px; margin-top:2px; }
.bk-proverka.zadvoenie .bk-pr-skolko{ color:#fca5a5; }
.bk-proverka.postuplenie .bk-pr-skolko{ color:#fbbf24; }
.bk-proverka.dogovor .bk-pr-skolko,
.bk-proverka.reestr .bk-pr-skolko{ color:#fbbf24; }

/* ══ ОДНА ПРОКРУТКА В ОКНЕ (слово Отца 15.09.2026) ══
   Была вложенная: короб крутился и таблица внутри него крутилась своя.
   На двенадцати строках это уже мешало. Оставляем прокрутку только у
   короба; таблица растёт по содержимому, шапка залипает от короба. */
.odna-prokrutka{}
.bk-korob .bk-tab-obertka{
  max-height:none !important;
  overflow:visible !important;
}
.bk-korob .bk-tab thead th{
  position:sticky; top:-1px; z-index:6;
  background:#0f172a;
}

/* ══ ШАПКА В ДВА ЭТАЖА ЛИПНЕТ ЦЕЛИКОМ (слово Отца 15.09.2026:
   «в НДС сумма и ставка уходят со скролом») ══
   У Kaspi-таблицы шапка двухрядная: сверху группы, снизу «сумма/ставка».
   Оба ряда должны липнуть, второй — под первым, иначе нижний уезжает. */
.dvuhetazhnaya{}
/* подпорки двухъярусной шапки сняты 15.09 — шапка теперь в один ряд */
.bk-korob .bk-tab thead th{ position:sticky; background:#0f172a; }
.bk-korob .bk-tab thead th.pod{ font-size:9.5px; padding-top:4px; padding-bottom:6px; }
/* имя покупателя больше не режем — даём ему место и перенос */
.bk-tab .bk-kto{ white-space:normal; line-height:1.3; min-width:170px; max-width:280px; }

/* ══ ЛИПКОЕ ПО-НАСТОЯЩЕМУ (слово Отца 15.09.2026) ══
   Шапка в два ряда уезжала, потому что при border-collapse:collapse
   position:sticky на ячейках не держится. Даём separate. */
.lipkoe-po-nastoyashchemu{}
.bk-korob .bk-tab{
  border-collapse:separate !important;
  border-spacing:0 !important;
  --shapka1:30px;                 /* высота первого ряда шапки */
}
.bk-korob .bk-tab thead th{
  position:sticky !important;
  background:#0f172a !important;
  box-shadow:inset 0 -1px 0 rgba(148,163,184,.18);
}
.bk-korob .bk-tab thead th{ top:0 !important; z-index:8; }
/* при collapse рамки рисовала таблица; при separate — рисуем ячейками */
.bk-korob .bk-tab td{ border-bottom:1px solid rgba(148,163,184,.07); }

/* ── Кнопки окна не уезжают: липнут к низу короба ── */
.bk-korob .bk-okno-niz{
  position:sticky; bottom:-24px; z-index:9;
  margin-top:18px; padding:12px 0 4px;
  background:linear-gradient(180deg, rgba(15,23,42,0), rgba(15,23,42,.97) 28%);
}

/* ══ ТАБЛИЦА ДНЯ ВЛЕЗАЕТ БЕЗ ПРОКРУТКИ ВБОК (слово Отца 15.09.2026) ══
   Четырнадцать колонок. Раздували их длинное имя в одну строку, широкая
   цепочка и вольные отступы. Даём доли, перенос длинному, запрет переноса
   числам. */
.vmeshchaem-bez-skrola{}
.bk-korob{ padding:22px 18px; }
.bk-korob .bk-tab-obertka{ overflow-x:hidden !important; }
.bk-korob .bk-tab{
  table-layout:fixed; width:100%;
  font-size:11.5px;
}
.bk-korob .bk-tab th,
.bk-korob .bk-tab td{ padding:6px 5px; overflow:hidden; }
.bk-korob .bk-tab th{ font-size:9.5px; letter-spacing:.02em; white-space:normal; line-height:1.2; }

/* доли колонок: считаем от 100% */
.bk-korob .bk-tab th.bk-nom          { width:2.5%; }
.bk-korob .bk-tab thead th:nth-child(2){ width:2.5%; }   /* отметка */
.bk-korob .bk-tab thead th:nth-child(3){ width:4.5%; }   /* время */
.bk-korob .bk-tab thead th:nth-child(4){ width:9%; }     /* заказ */
.bk-korob .bk-tab thead th:nth-child(5){ width:19%; }    /* покупатель */
.bk-korob .bk-tab thead th:nth-child(6){ width:7%; }     /* договор */
.bk-korob .bk-tab thead th:nth-child(7){ width:8%; }     /* сумма покупки */

/* имя и назначение — переносим, а не режем */
.bk-korob .bk-tab .bk-kto{ white-space:normal !important; word-break:break-word;
  min-width:0 !important; max-width:none !important; line-height:1.25; }
/* числа и номера — одной строкой */
.bk-korob .bk-tab td.p,
.bk-korob .bk-tab .bk-pp,
.bk-korob .bk-tab .bk-dok{ white-space:nowrap; font-variant-numeric:tabular-nums; }
/* цепочка — самая узкая, два столбика мелко */
.bk-korob .bk-cepochka{ min-width:0 !important; max-width:none !important; width:13%; }
.bk-korob .bk-cepochka .cep-zveno{ font-size:9.5px; padding:2px 5px; }
.bk-korob .bk-cepochka .cep-zveno em{ display:none; }   /* номера — в подсказке */