/* ============================================================
   ОКНО ОРДЕРА — новая раскладка (js/ui/order-window/*)
   ============================================================

   Числа и цвета взяты из артборда 2a макета редизайна, а не пересказаны с
   описания: первая сборка делалась по словам, и вышло бледно и рыхло —
   подложки вместо ритма, свои отступы, свой кегль.

   ТОКЕНЫ ЗДЕСЬ ЛИТЕРАЛЬНЫЕ. Выводить их из темы портала через color-mix я
   пробовал — получается вымытая картинка: у портала красный #e5484d и
   поверхности «текст под 6%», а окну нужны #ff6369 и плотные #15181c поверх
   #0f1114. Контраст в этом окне несёт смысл: красное значит «не отпускай».
   Поэтому значения заданы прямо, парой «тёмная/светлая», и живут ТОЛЬКО
   внутри `.bw-win` — снаружи ничего не меняется.

   ЧЕГО ЗДЕСЬ НЕТ. Пузыря ленты (.by-msg*), блока «уехавших» (.by-stray*) и
   строки истории контрагента (.by-cpHistRow*) — их рисуют ОБЩИЕ модули, и
   вторым зрителем той же переписки остаётся панель под строкой списка. Мы их
   не переписываем, а подгоняем ВНУТРИ `.bw-win`: снаружи всё как было.

   Тот же набор нужен слою подробной внешней проверки (.bec-overlay): он живёт
   в body отдельно от окна и токенов по наследству не получает.
   ============================================================ */

.bw-win,
.bec-overlay {
  --bw-bg: #0f1114;
  --bw-surf: #15181c;
  --bw-surf2: #1b1f24;
  --bw-surf3: #23282f;

  --bw-line: rgba(255, 255, 255, .07);
  --bw-line2: rgba(255, 255, 255, .13);

  --bw-ink: rgba(255, 255, 255, .95);
  --bw-ink2: rgba(255, 255, 255, .62);
  --bw-ink3: rgba(255, 255, 255, .40);

  --bw-hi: #2bd576;
  --bw-hi-dim: rgba(43, 213, 118, .13);
  --bw-red: #ff6369;
  --bw-red-dim: rgba(255, 99, 105, .13);
  --bw-amber: #f5b544;
  --bw-amber-dim: rgba(245, 181, 68, .13);
  --bw-blue: #4c8dff;
  --bw-blue-dim: rgba(76, 141, 255, .12);
  /* Заметная заливка: `-dim` рассчитан на подложку чипа, для строки списка он
     на тёмном фоне неразличим. */
  --bw-blue-soft: rgba(76, 141, 255, .18);

  --bw-f: var(--font-ui);
}

[data-theme="light"] .bw-win,
[data-theme="light"] .bec-overlay {
  --bw-bg: #f2f0ec;
  --bw-surf: #ffffff;
  --bw-surf2: #f7f5f2;
  --bw-surf3: #eae7e2;

  --bw-line: rgba(17, 20, 24, .09);
  --bw-line2: rgba(17, 20, 24, .16);

  --bw-ink: rgba(17, 20, 24, .94);
  --bw-ink2: rgba(17, 20, 24, .60);
  --bw-ink3: rgba(17, 20, 24, .50);

  --bw-hi: #0f9553;
  --bw-hi-dim: rgba(15, 149, 83, .10);
  --bw-red: #d5262d;
  --bw-red-dim: rgba(213, 38, 45, .08);
  --bw-amber: #a5700a;
  --bw-amber-dim: rgba(165, 112, 10, .10);
  --bw-blue: #2a63d8;
  --bw-blue-dim: rgba(42, 99, 216, .08);
  --bw-blue-soft: rgba(42, 99, 216, .12);
}

/* ---------- каркас ---------- */

.bw-overlay {
  position: fixed;
  inset: 0;
  z-index: 40;
  background: rgba(0, 0, 0, .62);
  animation: bw-fade .16s ease-out;
}

.bw-overlay[hidden],
.bw-win[hidden],
.bw-win [hidden] { display: none !important; }

@keyframes bw-fade { from { opacity: 0 } to { opacity: 1 } }
@keyframes bw-in {
  from { opacity: 0; transform: translate(-50%, -50%) scale(.985) }
  to   { opacity: 1; transform: translate(-50%, -50%) scale(1) }
}

.bw-win {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* НАД САЙДБАРОМ. У сайдбара `position: relative; z-index: 10000` (тултипы
     свёрнутого меню обязаны быть над контентом) плюс `backdrop-filter`, из-за
     которого он создаёт собственный слой. Заезжает окно под меню НЕ только на
     узком экране: левый край оказывается левее свёрнутого меню уже при ~1730px
     (там кончается запас `1600 + 2×64`), а левее развёрнутого — при ~2000px.
     Просто чем шире экран, тем меньше перекрытие и тем вернее оно приходится
     на поле окна; на суженном оно достаёт до содержимого, и колонка сделки
     уходит ЗА иконки — вместе с номером ордера и суммой.
     Этаж выбран между сайдбаром (10000, пункты меню 10001) и стеком слоёв
     `order-card/layers.js` (BASE_Z 10020): вторая карточка, окно истории
     контрагента и просмотрщик обязаны остаться ВЫШЕ.
     Затемнение при этом СОЗНАТЕЛЬНО остаётся на 40, под сайдбаром: кликов оно
     не ловит вовсе, и подними его сюда — меню перестало бы нажиматься, а уход
     в другой раздел с открытым окном оператору доступен и сейчас. */
  z-index: 10010;
  width: min(calc(1600px * var(--by-zoom-modal, 1)), calc(100vw - 48px));
  /* СТРАХОВКА, а не дубль ширины выше. Ширину окна может задать кто угодно
     снаружи — инлайновым стилем стенда, будущим «развернуть», зумом, — и тогда
     центрирование через left:50% + translate уводит ЛЕВЫЙ край за экран, а
     вместе с ним колонку сделки целиком. Потолок держит окно внутри экрана,
     чем бы ширина ни была назначена. */
  max-width: calc(100vw - 48px);
  height: 88vh;
  min-height: 620px;
  max-height: calc(100dvh - 24px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font: 400 12px/1.4 var(--bw-f);
  color: var(--bw-ink);
  background: var(--bw-bg);
  border: 1px solid var(--bw-line2);
  border-radius: 14px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .5);
  animation: bw-in .18s cubic-bezier(.2, .7, .3, 1);
}

/* Личный зум оператора масштабирует СОДЕРЖИМОЕ; рамка остаётся чёткой. */
.bw-head,
.bw-body { zoom: var(--by-zoom-modal, 1); }

.bw-win .mono { font-variant-numeric: tabular-nums; }
.bw-win button { font-family: inherit; }
.bw-gap { flex: 1; min-width: 0; }
.bw-pipe { display: inline-block; width: 1px; height: 11px; background: var(--bw-line2); }

.bw-win.is-dragover { outline: 2px dashed color-mix(in srgb, var(--bw-blue) 60%, transparent); outline-offset: -6px; }

/* ---------- шапка ---------- */

.bw-head {
  flex: none;
  display: flex;
  align-items: center;
  gap: 14px;
  height: 46px;
  padding: 0 14px;
  border-bottom: 1px solid var(--bw-line);
}

.bw-head__id {
  flex: none;
  font: 500 13px/1 var(--bw-f);
  color: var(--bw-ink);
  white-space: nowrap;
  cursor: pointer;
  padding: 4px 5px;
  margin: -4px -5px;
  border-radius: 6px;
}
.bw-head__id:hover { background: var(--bw-surf2); }
.bw-head__id:focus-visible { outline: 2px solid var(--bw-blue); outline-offset: 1px; }
.bw-head__id.is-copied { color: var(--bw-hi); }

.bw-head__gap { flex: 1; min-width: 0; }
.bw-head__sep { flex: none; width: 1px; height: 20px; background: var(--bw-line2); }

.bw-head__sums { flex: none; display: flex; align-items: baseline; gap: 12px; }
.bw-head__fiat { font: 600 19px/1 var(--bw-f); letter-spacing: -.01em; white-space: nowrap; }
.bw-head__token { font: 500 13px/1 var(--bw-f); color: var(--bw-ink2); white-space: nowrap; }
.bw-head__rate { font: 400 12.5px/1 var(--bw-f); color: var(--bw-ink3); white-space: nowrap; }

.bw-head__close {
  flex: none;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  font: 400 16px/1 var(--bw-f);
  color: var(--bw-ink3);
  background: transparent;
  border: 0;
  border-radius: 7px;
  cursor: pointer;
}
.bw-head__close:hover { color: var(--bw-ink); background: var(--bw-surf2); }

/* Кнопка «Создать реквизит — Приём» приходит из общего виджета. */
.bw-win .by-quickAdd {
  flex: none;
  height: 28px;
  padding: 0 11px;
  font: 600 12px/1 var(--bw-f);
  color: var(--bw-hi);
  background: var(--bw-hi-dim);
  border: 1px solid var(--bw-hi);
  border-radius: 8px;
  cursor: pointer;
  white-space: nowrap;
}
.bw-win .by-quickAdd--done {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-color: transparent;
  cursor: pointer;
}
.bw-win .by-quickAdd--done:hover { border-color: color-mix(in srgb, var(--bw-hi) 45%, transparent); }
.bw-win .by-quickAdd--done[aria-expanded="true"] {
  background: color-mix(in srgb, var(--bw-hi) 20%, transparent);
  border-color: var(--bw-hi);
}
.bw-win .by-quickAdd__caret {
  font-size: 10px;
  line-height: 1;
  color: color-mix(in srgb, var(--bw-hi) 75%, transparent);
  transition: transform .16s cubic-bezier(.2, .7, .3, 1);
}
.bw-win .by-quickAdd--done[aria-expanded="true"] .by-quickAdd__caret { transform: rotate(180deg); }

/* ---------- полка сделок площадок ----------

   Живёт СОСЕДНИМ узлом каркаса, между шапкой и телом, и потому переживает
   морфинг шапки: цикл перерисовки частей её не касается.

   Раскрытие — через `grid-template-rows: 0fr → 1fr`, а не `hidden` и не
   абсолютным слоем. Слой пришлось бы позиционировать в пикселях поверх
   зумированной шапки, а личный масштаб оператора живёт именно здесь
   (`--by-zoom-modal`): считать координаты сквозь него мы уже пробовали в форме
   реквизита. В потоке считать не нужно ничего, а свой `zoom` полка объявляет
   сама — у соседей он есть, по наследству он не достаётся. */

.bw-priem {
  flex: none;
  display: grid;
  grid-template-rows: 0fr;
  zoom: var(--by-zoom-modal, 1);
  /* Сворачивание быстрее раскрытия: решение уже принято, ждать нечего. */
  transition: grid-template-rows .13s cubic-bezier(.4, 0, 1, 1);
}
.bw-priem.is-open {
  grid-template-rows: 1fr;
  transition: grid-template-rows .18s cubic-bezier(.2, .7, .3, 1);
}

.bw-priem__box { min-height: 0; overflow: hidden; }
.bw-priem.is-open .bw-priem__box {
  display: flex;
  flex-direction: column;
  max-height: 320px;
  border-bottom: 1px solid var(--bw-line);
  background: var(--bw-surf);
}

.bw-priem__head {
  flex: none;
  display: flex;
  align-items: center;
  gap: 9px;
  height: 34px;
  padding: 0 14px;
  border-bottom: 1px solid var(--bw-line);
  background: var(--bw-surf2);
}
.bw-priem__title { font: 600 11.5px/1 var(--bw-f); color: var(--bw-ink2); }
.bw-priem__n {
  font: 600 11px/1 var(--bw-f);
  color: var(--bw-ink3);
  padding: 3px 6px;
  border-radius: 5px;
  background: var(--bw-surf3);
}
.bw-priem__live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 500 10px/1 var(--bw-f);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--bw-hi);
}
.bw-priem__live--stale { color: var(--bw-ink3); }
.bw-priem__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  animation: bw-priemBeat 2.4s ease-in-out infinite;
}
.bw-priem__live--stale .bw-priem__dot { animation: none; }
@keyframes bw-priemBeat { 0%, 100% { opacity: 1 } 50% { opacity: .35 } }

.bw-priem__note {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 12px 14px 10px;
}
.bw-priem__note b { font: 600 12.5px/1.3 var(--bw-f); color: var(--bw-ink); }
.bw-priem__note span { font: 400 11.5px/1.5 var(--bw-f); color: var(--bw-ink2); max-width: 46ch; }

.bw-priem__list { overflow-y: auto; padding: 4px 10px 6px; }

/* Подвал держит место под сообщение ВСЕГДА: всплывающая подпись под номером
   налезала на соседнюю строку, поэтому слово о копировании подменяет строку
   итога, а не встаёт над ней. */
.bw-priem__foot {
  flex: none;
  position: relative;
  height: 30px;
  border-top: 1px solid var(--bw-line);
}
.bw-priem__line {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  padding: 0 14px;
  font: 400 10.5px/1 var(--bw-f);
  color: var(--bw-ink3);
  transition: opacity .14s cubic-bezier(.2, .7, .3, 1);
}
.bw-priem__line--say { color: var(--bw-hi); font-weight: 500; opacity: 0; }
.bw-priem__box.is-said .bw-priem__line--base { opacity: 0; }
.bw-priem__box.is-said .bw-priem__line--say { opacity: 1; }

/* Высота строки ЗАДАНА: полка держит ритм при любом составе полей, а список из
   сорока строк не растёт рывками.

   Ширины колонок ЖЁСТКИЕ, и это не лень. `max-content` здесь пробовали, чтобы
   вместить «Апелляция завершена»: у каждой строки СВОЙ грид (список — обычный
   блок, ни subgrid, ни `display: contents`), поэтому дорожка считается для
   каждой строки отдельно, и середина у длинного статуса начиналась на три-четыре
   десятка пикселей правее, чем у соседей. Левый край списка становился рваным
   там, где до этого был ровным.

   Отсюда 150px: под самый длинный из наших статусов с запасом. Незнакомое
   значение приходит строкой прямо из базы площадки — его усечёт многоточие, а
   ровный край останется.

   Колонка денег 172px: в 128px «19.73 USDT · курс 102.84» ломалось на две
   строки, отрывая слово «курс» от числа. */
.bw-priemRow {
  height: 46px;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 172px;
  align-items: center;
  gap: 10px;
  padding: 8px 9px;
  border-radius: 8px;
  overflow: hidden;
  transition: background-color .14s cubic-bezier(.2, .7, .3, 1);
}
.bw-priemRow:hover { background: var(--bw-surf2); }
.bw-priemRow + .bw-priemRow { box-shadow: 0 -1px 0 var(--bw-line) inset; }
.bw-priemRow--new { animation: bw-priemArrive .9s ease-out; }
@keyframes bw-priemArrive {
  from { background: var(--bw-hi-dim) }
  to { background: transparent }
}

.bw-priemRow__mid { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.bw-priemRow__top {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  white-space: nowrap;
}
.bw-priemRow__id { font: 500 12px/1 var(--bw-f); color: var(--bw-ink); }
.bw-priemRow__time { font: 400 10.5px/1 var(--bw-f); color: var(--bw-ink3); }
.bw-priemRow__req {
  font: 400 11px/1.3 var(--bw-f);
  color: var(--bw-ink2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bw-priemRow__money { text-align: right; display: flex; flex-direction: column; gap: 3px; }
.bw-priemRow__rub { font: 600 13px/1 var(--bw-f); color: var(--bw-ink); }
.bw-priemRow__rate { font: 400 10.5px/1 var(--bw-f); color: var(--bw-ink3); }
.bw-priemRow__note { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3); }

/* Копируемый номер: вспышка НА МЕСТЕ. Текст не подменяем — номер исчезал бы
   из-под курсора; то же правило у номера ордера в шапке окна. */
.bw-priemRow__id[data-copy] {
  cursor: pointer;
  padding: 3px 5px;
  margin: -3px -5px;
  border-radius: 5px;
  border-bottom: 1px dashed var(--bw-line2);
  transition: color .12s ease, background-color .12s ease, border-color .12s ease;
}
.bw-priemRow__id[data-copy]:hover { background: var(--bw-surf3); border-bottom-color: transparent; }
.bw-priemRow__id[data-copy]:focus-visible { outline: 2px solid var(--bw-blue); outline-offset: 1px; }
.bw-priemRow__id.is-copied {
  color: var(--bw-hi);
  background: var(--bw-hi-dim);
  border-bottom-color: transparent;
}

.bw-priemPill {
  justify-self: start;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 20px;
  padding: 0 8px;
  font: 600 10.5px/1 var(--bw-f);
  border-radius: 999px;
  white-space: nowrap;
  transition: color .24s ease, background-color .24s ease;
}
.bw-priemPill__dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; flex: none; }
/* Многоточие — на САМОМ тексте: `text-overflow` работает у блочного контейнера,
   а пилюля — `inline-flex`, и её собственный текст стал бы анонимным флекс-
   элементом, обрезанным посреди буквы. */
.bw-priemPill__text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bw-priemPill--ok { color: var(--bw-hi); background: var(--bw-hi-dim); }
.bw-priemPill--warn { color: var(--bw-amber); background: var(--bw-amber-dim); }
.bw-priemPill--bad { color: var(--bw-red); background: var(--bw-red-dim); }
.bw-priemPill--mute { color: var(--bw-ink3); background: var(--bw-surf3); }

.bw-priemFlag {
  display: inline-flex;
  align-items: center;
  height: 16px;
  padding: 0 6px;
  font: 600 9.5px/1 var(--bw-f);
  letter-spacing: .04em;
  text-transform: uppercase;
  border-radius: 4px;
}
.bw-priemFlag--team { color: var(--bw-blue); background: var(--bw-blue-dim); }

/* Привязка без сделок: ни статуса, ни суммы — путать её со сделкой нельзя. */
.bw-priemRow--bind { background: var(--bw-blue-dim); }
.bw-priemRow--bind:hover { background: var(--bw-blue-dim); }
.bw-priemBind__label { justify-self: start; font: 600 10.5px/1 var(--bw-f); color: var(--bw-blue); }

.bw-priemSkel { padding: 4px 10px 6px; }
.bw-priemSkel__row {
  height: 46px;
  display: grid;
  grid-template-columns: 150px 1fr 172px;
  gap: 10px;
  padding: 9px;
  align-items: center;
}
.bw-priemSkel__row span {
  height: 10px;
  border-radius: 5px;
  background: var(--bw-surf3);
  animation: bw-priemPulse 1.25s ease-in-out infinite;
}
.bw-priemSkel__row:nth-child(2) span { animation-delay: .12s }
.bw-priemSkel__row:nth-child(3) span { animation-delay: .24s }
@keyframes bw-priemPulse { 0%, 100% { opacity: .55 } 50% { opacity: 1 } }

/* ---------- полка на узких ступенях ----------

   На `sm` и `xs` окно занимает почти весь экран, и полка на 320px съедала бы
   половину сделки. Держим её долей высоты, а строку разворачиваем в два яруса:
   статус и деньги сверху, номер с реквизитом снизу. Трёхколоночная строка при
   ширине окна в 380px оставляла середине около семидесяти пикселей — номер
   сделки, ради которого полку и открывают, вырождался в многоточие.

   Прятать что-либо `display: none` здесь нельзя: это грид, и убранный бокс
   уносит с собой ячейку, сдвигая соседей (грабля 18.08.2026). */

.bw-win[data-w="sm"] .bw-priem.is-open .bw-priem__box,
.bw-win[data-w="xs"] .bw-priem.is-open .bw-priem__box { max-height: 46dvh; }

.bw-win[data-w="xs"] .bw-priemRow,
.bw-win[data-w="xs"] .bw-priemRow--bind {
  height: auto;
  min-height: 58px;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "pill  money"
    "mid   mid";
  row-gap: 5px;
  padding: 9px;
}
.bw-win[data-w="xs"] .bw-priemPill,
.bw-win[data-w="xs"] .bw-priemBind__label { grid-area: pill; }
.bw-win[data-w="xs"] .bw-priemRow__mid { grid-area: mid; }
.bw-win[data-w="xs"] .bw-priemRow__money { grid-area: money; }

/* Время и номер на телефоне не помещаются в одну строку — разрешаем перенос
   ровно здесь: `nowrap` заведён для ритма списка, а не как правило. */
.bw-win[data-w="xs"] .bw-priemRow__top { flex-wrap: wrap; row-gap: 3px; }

.bw-win[data-w="xs"] .bw-priemSkel__row {
  height: 58px;
  grid-template-columns: 88px 1fr 96px;
}

/* Тач-цель у копируемого номера: 12px текста с 3px отступа — это 18px, вдвое
   меньше пальца. Растим ТОЧЕЧНО и вне media-запроса, где выигрывает
   специфичность, а не порядок файлов (грабля 23.08.2026). */
.bw-win[data-w="xs"] .bw-priemRow__id[data-copy] {
  padding: 7px 8px;
  margin: -7px -8px;
}

/* Настройку системы уважаем целиком: движения нет, состояния остаются —
   вспышка копирования держится статично и гаснет по таймеру. */
@media (prefers-reduced-motion: reduce) {
  .bw-priem,
  .bw-priem.is-open { transition: none; }
  .bw-priemRow--new,
  .bw-priem__dot,
  .bw-priemSkel__row span { animation: none; }
  .bw-priemRow,
  .bw-priemPill,
  .bw-priemRow__id[data-copy],
  .bw-priem__line,
  .bw-win .by-quickAdd__caret { transition: none; }
}

/* ---------- плашка запроса отмены ---------- */

.bw-cancelNote {
  flex: none;
  display: flex;
  align-items: center;
  gap: 9px;
  height: 30px;
  padding: 0 10px;
  border-radius: 8px;
  background: var(--bw-amber-dim);
}
.bw-cancelNote__sign { color: var(--bw-amber); font: 700 11px/1 var(--bw-f); }
.bw-cancelNote__text { font: 400 11.5px/1 var(--bw-f); color: var(--bw-ink2); white-space: nowrap; }
.bw-cancelNote__sep { display: none; }
.bw-cancelNote__timer { font: 600 11.5px/1 var(--bw-f); color: var(--bw-amber); white-space: nowrap; }
.bw-cancelNote__timer.is-urgent { color: var(--bw-red); }
.bw-cancelNote__acts { display: flex; align-items: center; gap: 5px; }

.bw-cancelNote__btn {
  height: 22px;
  padding: 0 8px;
  font: 500 11px/1 var(--bw-f);
  color: var(--bw-ink2);
  background: var(--bw-surf);
  border: 1px solid var(--bw-line2);
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
}
.bw-cancelNote__btn--pass { color: var(--bw-amber); border-color: var(--bw-amber); font-weight: 600; }

/* ---------- тело ---------- */

.bw-body {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: grid;
  grid-template-columns: 320px 342px 358px minmax(400px, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  padding: 10px 14px 14px;
  overflow: hidden;
}

.bw-band { grid-column: 1 / 4; grid-row: 1; }
.bw-tabsHost { display: none; }
.bw-col--deal { grid-column: 1; grid-row: 2; }
.bw-pair { display: contents; }
.bw-col--cp { grid-column: 2; grid-row: 2; }
.bw-col--scam { grid-column: 3; grid-row: 2; }
.bw-col--chat { grid-column: 4; grid-row: 1 / 3; }

/* Панели держатся ПОВЕРХНОСТЬЮ, а не рамкой: #15181c на #0f1114 читается как
   отдельный лист, а рамка на каждой панели дробит окно на клетки. */
.bw-band,
.bw-col {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--bw-surf);
  border-radius: 12px;
}

.bw-col { display: flex; flex-direction: column; }
.bw-col--chat { position: relative; }

/* ---------- полоса решения ---------- */

.bw-band { display: flex; align-items: stretch; min-height: 82px; }
.bw-band__sep { flex: none; width: 1px; background: var(--bw-line); }

.bw-band__side {
  width: 222px;
  flex: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
  padding: 0 14px;
}
.bw-band__sideTop { display: flex; align-items: center; gap: 9px; }
.bw-band__sideBot { display: flex; align-items: baseline; gap: 7px; }

/* Сторона обведена, а не залита: заливка спорит с денежной кнопкой, а она в
   этой полосе должна быть единственным сплошным пятном. */
.bw-sideBadge {
  font: 700 10px/1 var(--bw-f);
  letter-spacing: .09em;
  padding: 3px 5px;
  border-radius: 4px;
  border: 1px solid currentColor;
  white-space: nowrap;
}
.bw-sideBadge.is-sell { color: var(--bw-red); }
.bw-sideBadge.is-buy { color: var(--bw-hi); }
.bw-sideBadge.is-appeal { color: var(--bw-red); background: var(--bw-red-dim); }

.bw-band__status { font: 600 12.5px/1 var(--bw-f); color: var(--bw-ink2); white-space: nowrap; }
.bw-band__status.is-ok { color: var(--bw-hi); }
.bw-band__status.is-wait { color: var(--bw-amber); }
.bw-band__status.is-bad { color: var(--bw-red); }

.bw-band__timer { font: 600 20px/1 var(--bw-f); color: var(--bw-ink); }
.bw-band__timer.is-warn { color: var(--bw-amber); }
.bw-band__timer.is-urgent { color: var(--bw-red); }
.bw-band__timerNote { font: 400 10.5px/1.2 var(--bw-f); color: var(--bw-ink3); white-space: nowrap; }

/* Отступ и скругление живут в БАЗОВОМ правиле, а не рядом с `[data-act]`:
   оценка приезжает вторым запросом, и сегмент за свою жизнь успевает побывать
   и «считаем…», и посчитанным. Держи плитку у кликабельного варианта — и
   приход данных сдвигал бы полосу решения на своих же четырнадцать пикселей. */
.bw-band__risk {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 7px 0;
  padding: 0 16px;
  border-radius: 10px;
}
.bw-risk__head { flex: none; display: flex; flex-direction: column; gap: 3px; }
.bw-risk__label {
  font: 400 9.5px/1 var(--bw-f);
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--bw-ink3);
  white-space: nowrap;
}
/* Спиннер у оценки: идёт сбор BybitEye. Маленький, вровень со строчной буквой
   метки, чтобы не растянуть строку заголовка. */
.bw-risk__spin {
  display: inline-block;
  vertical-align: -1px;
  margin-left: 4px;
  width: 9px;
  height: 9px;
  border: 1.5px solid var(--bw-line2);
  border-top-color: var(--bw-ink2);
  border-radius: 50%;
  animation: bw-spin .8s linear infinite;
}
.bw-risk__num { display: flex; align-items: baseline; gap: 5px; }
.bw-risk__val { font: 700 28px/1 var(--bw-f); letter-spacing: -.01em; color: var(--bw-ink); }
.bw-risk__val--danger { color: var(--bw-red); }
.bw-risk__val--warn { color: var(--bw-amber); }
.bw-risk__val--info { color: var(--bw-blue); }
.bw-risk__val--good,
.bw-risk__val--ok { color: var(--bw-hi); }
.bw-risk__max { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3); }
.bw-risk__word { font: 500 12px/1 var(--bw-f); color: var(--bw-ink2); }

.bw-risk__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; }

/* Дорожка — шкала от нуля до ста: незанятое остаётся фоном, и по длине видно
   не только «из чего», но и «сколько». */
.bw-riskBar {
  display: flex;
  height: 6px;
  border-radius: 3px;
  overflow: hidden;
  background: var(--bw-surf3);
}
.bw-riskBar__seg + .bw-riskBar__seg { margin-left: 1px; }
.bw-riskBar__seg--danger { background: var(--bw-red); }
.bw-riskBar__seg--warn { background: var(--bw-amber); }
.bw-riskBar__seg--info { background: var(--bw-blue); }
.bw-riskBar__seg--good { background: var(--bw-hi); }
.bw-riskBar__seg.is-dim { opacity: .65; }

.bw-scoreChips { display: flex; flex-wrap: wrap; gap: 4px; }
.bw-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 20px;
  padding: 0 7px;
  border-radius: 5px;
  font: 500 11px/1 var(--bw-f);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: var(--bw-ink2);
  background: var(--bw-surf2);
}
.bw-chip--danger { color: var(--bw-red); background: var(--bw-red-dim); }
.bw-chip--warn { color: var(--bw-amber); background: var(--bw-amber-dim); }
.bw-chip--info { color: var(--bw-blue); background: var(--bw-blue-dim); }
.bw-chip--good { color: var(--bw-hi); background: var(--bw-hi-dim); }
.bw-chip b { font-weight: 600; }

/* ---------- сегмент оценки — он же кнопка отчёта ----------

   Блок открывает окно отчёта внешней проверки, и сказать об этом надо ДО
   клика: постоянная метка «ОТЧЁТ ПРОВЕРКИ ›» у правого края, курсор-палец и
   подложка под наведением. Метка стоит в раскладке ВСЕГДА, а не всплывает по
   наведению: то, что видно лишь под курсором, нельзя найти, не наведя, — а
   наводят на то, про что уже знают.

   Наведение меняет только цвет и подложку, но НЕ геометрию: полоса стоит над
   колонками, и подросший сегмент толкал бы соседей (общее правило портала —
   «hover не меняет размеры»).

   `transition` перечисляет свойства ПОИМЁННО: `all` утянул бы за собой и цвет
   числа, и ширину сегментов дорожки — то есть вернул бы вспышку обновления
   ровно там, где её запрещали. Меняется `background-color`, а не шорткат
   `background`: шорткат сбрасывает у соседей картинку и позицию.

   Правила НЕ завёрнуты в `@media (prefers-reduced-motion)` намеренно: у
   владельца эффекты выключены в системе, Chrome транслирует это в `reduce`, и
   завёрнутый отклик не увиделся бы никогда. Гасить здесь нечего — движения на
   экране нет, есть отклик на собственное действие руки. */

.bw-band__risk[data-act] {
  cursor: pointer;
  transition: background-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.bw-band__risk[data-act]:hover { background-color: var(--bw-surf2); }

/* Нажатие «проваливает» плитку. Масштаб взят у денежной кнопки: отклик на
   нажатие в одном окне обязан быть один и тот же. */
.bw-band__risk[data-act]:active { transform: scale(.99); background-color: var(--bw-surf3); }

/* Обводка внутренняя (`inset`), а не `outline`: у полосы `overflow: hidden`,
   и внешнее кольцо срезалось бы по краю. */
.bw-band__risk[data-act]:focus-visible { outline: none; box-shadow: inset 0 0 0 1px var(--bw-blue); }

.bw-risk__open {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 24px;
  padding: 0 6px 0 9px;
  border: 1px solid var(--bw-line);
  border-radius: 7px;
  font: 500 10px/1 var(--bw-f);
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--bw-ink3);
  transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}
.bw-risk__chev { display: inline-block; transition: transform .15s ease; }
.bw-risk__chev::before { content: "›"; font: 600 14px/1 var(--bw-f); }

/* В «оценка не посчитана» нет тела, растягивающего сегмент, — прижмём кнопку
   вправо, чтобы она встала на то же место, что и при посчитанной оценке. */
.bw-band__risk.is-empty .bw-risk__open { margin-left: auto; }

.bw-band__risk[data-act]:hover .bw-risk__open,
.bw-band__risk[data-act]:focus-visible .bw-risk__open {
  color: var(--bw-ink);
  border-color: var(--bw-line2);
  background-color: var(--bw-surf3);
}
.bw-band__risk[data-act]:hover .bw-risk__chev { transform: translateX(2px); }

/* ---------- денежный сегмент ---------- */

.bw-band__act {
  width: 248px;
  flex: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 0 14px;
}

.bw-money {
  height: 40px;
  border: 0;
  border-radius: 10px;
  font: 600 14px/1 var(--bw-f);
  cursor: pointer;
}
.bw-money--release { background: var(--bw-hi); color: #08130c; }
.bw-money--pay { background: var(--bw-blue); color: #04101f; }
.bw-money--appeal { background: var(--bw-red-dim); color: var(--bw-red); border: 1px solid var(--bw-red); }
.bw-money:hover { filter: brightness(1.06); }
.bw-money:active { transform: scale(.985); }

.bw-act__idle { font: 400 11.5px/1.35 var(--bw-f); color: var(--bw-ink3); }
.bw-actErr { font: 400 11.5px/1.35 var(--bw-f); color: var(--bw-red); }

.bw-actBusy {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 40px;
  border-radius: 10px;
  background: var(--bw-surf2);
  font: 500 12.5px/1 var(--bw-f);
  color: var(--bw-ink2);
}
.bw-actBusy__spin {
  width: 14px;
  height: 14px;
  border: 2px solid var(--bw-line2);
  border-top-color: var(--bw-ink2);
  border-radius: 50%;
  animation: bw-spin .8s linear infinite;
}
@keyframes bw-spin { to { transform: rotate(360deg) } }

/* Подтверждение встаёт НА МЕСТО кнопки — в том же сегменте, ничего не
   перекрывая: поповер закрывал колонку антифрода, по которой и решают. */
.bw-confirm { display: flex; flex-direction: column; gap: 5px; }
.bw-confirm__text { font: 400 11px/1.3 var(--bw-f); color: var(--bw-ink2); }
.bw-confirm__row { display: flex; gap: 6px; }
.bw-btn {
  flex: 1;
  height: 30px;
  border-radius: 8px;
  font: 500 12px/1 var(--bw-f);
  cursor: pointer;
  white-space: nowrap;
}
.bw-btn--ghost { border: 1px solid var(--bw-line2); background: transparent; color: var(--bw-ink2); }
.bw-btn--go { flex: 1.4; border: 0; background: var(--bw-hi); color: #08130c; font-weight: 600; }
.bw-btn--warn { flex: 1.4; border: 0; background: var(--bw-amber); color: #161000; font-weight: 600; }

/* ---------- колонки ---------- */

.bw-col__head {
  flex: none;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 12px 7px;
  border-bottom: 1px solid var(--bw-line);
  background: var(--bw-surf);
}
.bw-col__title {
  font: 600 10.5px/1 var(--bw-f);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--bw-ink2);
  white-space: nowrap;
}
.bw-cp__nick { font: 600 11.5px/1 var(--bw-f); color: var(--bw-ink); white-space: nowrap; }
.bw-cp__nick .by-badge { font-size: 11px; }
.bw-cp__nick .by-scamMark {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 4px;
  background: var(--bw-red-dim);
  color: var(--bw-red);
  text-align: center;
  font: 700 9px/14px var(--bw-f);
}
.bw-cp__nick .by-scamMark::before { content: "!"; }

.bw-col__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 7px 12px 14px;
}

.bw-col__body::-webkit-scrollbar,
.bw-pair::-webkit-scrollbar,
.bw-chat::-webkit-scrollbar,
.bw-chatReqs__body::-webkit-scrollbar { width: 8px }
.bw-col__body::-webkit-scrollbar-track,
.bw-pair::-webkit-scrollbar-track,
.bw-chat::-webkit-scrollbar-track,
.bw-chatReqs__body::-webkit-scrollbar-track { background: transparent }
.bw-col__body::-webkit-scrollbar-thumb,
.bw-pair::-webkit-scrollbar-thumb,
.bw-chat::-webkit-scrollbar-thumb,
.bw-chatReqs__body::-webkit-scrollbar-thumb { background: var(--bw-line2); border-radius: 4px }

.bw-col--arrived > * { animation: bw-arrive .22s ease-out both }
@keyframes bw-arrive { from { opacity: 0; transform: translateY(3px) } to { opacity: 1; transform: none } }

@media (prefers-reduced-motion: reduce) {
  .bw-win, .bw-overlay, .bw-col--arrived > * { animation: none }
}

/* Низкое окно. `min-height` сильнее `max-height`, поэтому на невысоком экране
   окно осталось бы 620px и вылезло вверх и вниз. Снимаем нижнюю границу и
   отдаём окну ровно то, что есть; полоса при этом ужимается — её содержимое
   и так стоит в одну строку. */
@media (max-height: 700px) {
  .bw-win { min-height: 0; height: calc(100dvh - 24px) }
  .bw-band { min-height: 68px }
  .bw-risk__val { font-size: 22px }
  .bw-band__timer { font-size: 17px }
}

/* На телефоне окно возвращается НИЖЕ выдвижного меню.
   Этаж 10010 заведён против одной беды — сайдбар шириной 64–200 px, под
   который окно заезжает на узком экране. На телефоне сайдбара там нет вовсе:
   `mobile.css` уводит его за левый край выдвижной панелью, и заезжать не подо
   что. Зато верхняя панель портала (z 60) выше затемнения окна и остаётся
   НАД ним, гамбургер живой — а шторка (z 200) при этаже 10010 выехала бы
   ПОЗАДИ окна: кнопка нажимается, и ничего не происходит.
   Берём этаж между панелью и шторкой — окно по-прежнему поверх верхней
   полосы, но меню, если его позвали, открывается поверх окна, как и раньше.
   Условие ДОСЛОВНО повторяет `mobile.css`: разойдись они — на пограничной
   ширине окно оказалось бы то над шторкой, то под ней. */
@media (max-width: 860px), (orientation: landscape) and (max-height: 520px) {
  .bw-win { z-index: 150 }
}

/* ---------- строки, плитки, мелочи ---------- */

.bw-kv {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  min-height: 21px;
  font: 400 12px/1.35 var(--bw-f);
  color: var(--bw-ink3);
}
.bw-kv__label { flex: none }
.bw-kv__value {
  font-weight: 500;
  font-size: 12.5px;
  color: var(--bw-ink);
  text-align: right;
  overflow-wrap: anywhere;
}

.bw-num { font-weight: 500 }
.bw-num--buy { color: var(--bw-hi) }
.bw-num--sell { color: var(--bw-red) }

.bw-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 5px }
.bw-metric {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 7px 9px;
  border-radius: 8px;
  background: var(--bw-surf2);
  min-width: 0;
}
.bw-metric--wide { grid-column: 1 / -1 }
.bw-metric__label {
  font: 400 9px/1.25 var(--bw-f);
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--bw-ink3);
  min-height: 22px;
}
.bw-metric__value { font: 500 14px/1 var(--bw-f); overflow-wrap: anywhere }
.bw-metric__second { font: 400 10.5px/1.25 var(--bw-f); color: var(--bw-ink3) }
.bw-metric--danger .bw-metric__value { color: var(--bw-red) }
.bw-metric--warn .bw-metric__value { color: var(--bw-amber) }

.bw-group { margin-top: 12px }
.bw-group__head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 5px }
.bw-group__title {
  font: 600 10px/1 var(--bw-f);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--bw-ink3);
}
.bw-group__meta { font: 400 10px/1 var(--bw-f); color: var(--bw-ink3) }

.bw-ctx { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-bottom: 9px }
.bw-ctx__item { font: 400 11.5px/1.3 var(--bw-f); color: var(--bw-ink3); white-space: nowrap }
.bw-ctx__item.is-warn { font-weight: 500; font-size: 12px; color: var(--bw-amber) }
.bw-ctx__item.is-danger { font-weight: 600; font-size: 12px; color: var(--bw-red) }

.bw-empty { font: 400 11.5px/1.4 var(--bw-f); color: var(--bw-ink3); padding: 3px 0 }
.bw-err { display: flex; flex-direction: column; align-items: flex-start; gap: 6px }
.bw-err__text { font: 400 11.5px/1.4 var(--bw-f); color: var(--bw-red) }
.bw-err__retry {
  height: 24px;
  padding: 0 10px;
  border: 1px solid var(--bw-line2);
  border-radius: 7px;
  background: transparent;
  color: var(--bw-ink2);
  font: 500 11px/1 var(--bw-f);
  cursor: pointer;
}

.bw-miniBtn {
  height: 24px;
  padding: 0 8px;
  border: 1px solid var(--bw-line2);
  border-radius: 7px;
  background: transparent;
  color: var(--bw-ink2);
  font: 500 11px/1 var(--bw-f);
  cursor: pointer;
  white-space: nowrap;
}
.bw-miniBtn:hover:not(:disabled) { color: var(--bw-ink); background: var(--bw-surf2) }
.bw-miniBtn:disabled { opacity: .55; cursor: default }
/* «Проверить» у номера без ответа — единственная кнопка полки, которая что-то
   МЕНЯЕТ (платный вопрос источнику), поэтому она акцентная, а не серая. */
.bw-miniBtn--ask { color: var(--bw-blue); border-color: var(--bw-blue-soft) }
.bw-miniBtn--ask:hover:not(:disabled) { color: var(--bw-blue); background: var(--bw-blue-dim) }

.bw-caret { font: 400 10px/1 var(--bw-f); color: var(--bw-ink3); flex: none }
.bw-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14px;
  height: 14px;
  padding: 0 4px;
  border-radius: 5px;
  background: var(--bw-surf3);
  color: var(--bw-ink2);
  font: 600 9.5px/1 var(--bw-f);
  font-variant-numeric: tabular-nums;
}
.bw-count.is-dim { opacity: .55 }
.bw-count--unread { background: var(--bw-blue); color: #04101f }

.bw-skelStack { display: flex; flex-direction: column; gap: 6px; padding: 4px 0 }
.bw-skelRow {
  display: block;
  height: 12px;
  border-radius: 6px;
  background: var(--bw-surf2);
  animation: bw-pulse 1.2s ease-in-out infinite;
}
.bw-skelRow:nth-child(2n) { width: 84% }
.bw-skelRow:nth-child(3n) { width: 66% }
.bw-skel {
  display: inline-block;
  width: 56px;
  height: 22px;
  border-radius: 6px;
  background: var(--bw-surf2);
  animation: bw-pulse 1.2s ease-in-out infinite;
}
@keyframes bw-pulse { 0%, 100% { opacity: 1 } 50% { opacity: .45 } }

/* ---------- полка «Реквизиты в ордере» ---------- */

.bw-shelf { margin-top: 11px }
.bw-shelf__head { display: flex }
.bw-shelf__btn {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 5px 9px;
  border: 0;
  border-radius: 9px;
  background: var(--bw-surf2);
  cursor: pointer;
  text-align: left;
}
.bw-shelf__btn:hover { background: var(--bw-surf3) }
.bw-shelf__title {
  font: 600 10px/1 var(--bw-f);
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--bw-ink2);
  white-space: nowrap;
}
.bw-shelf__preview {
  flex: 1;
  min-width: 0;
  font: 400 11px/1.25 var(--bw-f);
  color: var(--bw-ink3);
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bw-shelf__chev { order: 99; flex: none; font: 400 10px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-shelf__chev::before { content: "›" }
.bw-shelf[data-open="1"] .bw-shelf__chev::before { content: "▾" }

.bw-shelf__body { display: none; padding-top: 6px }
.bw-shelf[data-open="1"] > .bw-shelf__body { display: block }

.bw-reqCard { margin-bottom: 6px; padding: 7px 9px; border-radius: 9px; background: var(--bw-surf2) }
.bw-reqCard__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  min-height: 21px;
  font: 400 12px/1.35 var(--bw-f);
  color: var(--bw-ink3);
}
.bw-reqCard__label { flex: none }
.bw-reqCard__value {
  font-weight: 500;
  font-size: 12.5px;
  color: var(--bw-ink);
  text-align: right;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.bw-reqCard__value.is-copied { color: var(--bw-hi) }

/* ---------- заметки ---------- */

.bw-notes { display: flex; flex-direction: column; min-height: 0 }
.bw-notes__tabs { display: flex; align-items: center; gap: 6px; margin: 12px 0 6px }
.bw-notes__label {
  margin-right: auto;
  font: 600 10px/1 var(--bw-f);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--bw-ink3);
}
.bw-tab {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 22px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--bw-ink3);
  font: 500 11px/1 var(--bw-f);
  cursor: pointer;
  white-space: nowrap;
}
.bw-tab:hover { color: var(--bw-ink2) }
.bw-tab.is-active { background: var(--bw-surf3); color: var(--bw-ink) }

.bw-notes__list { display: flex; flex-direction: column }

.bw-note { margin-bottom: 5px; padding: 7px 9px; border-radius: 9px; background: var(--bw-surf2) }
.bw-note__text { font: 400 12px/1.4 var(--bw-f); color: var(--bw-ink); overflow-wrap: anywhere }
.bw-note__meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-top: 3px;
  font: 400 10px/1 var(--bw-f);
  color: var(--bw-ink3);
}
.bw-note__date { font-variant-numeric: tabular-nums }
.bw-note__del {
  width: 16px;
  height: 16px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--bw-ink3);
  font: 400 12px/1 var(--bw-f);
  cursor: pointer;
}
.bw-note__del:hover { color: var(--bw-red) }

.bw-sysNotes { margin-bottom: 6px }
.bw-sysNotes__head { display: flex; align-items: center; border-radius: 8px; background: var(--bw-red-dim) }
.bw-sysNotes__btn {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 8px;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.bw-sysNotes__btn .bw-shelf__chev { order: 0; color: var(--bw-red) }
.bw-sysNotes__sum {
  flex: 1;
  min-width: 0;
  font: 400 11px/1.3 var(--bw-f);
  color: var(--bw-ink2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bw-sysNotes__go {
  flex: none;
  padding: 0 8px;
  align-self: stretch;
  border: 0;
  background: transparent;
  color: var(--bw-ink3);
  font: 500 10px/1 var(--bw-f);
  cursor: pointer;
}
.bw-sysNotes__body { display: none; padding: 6px 0 0 }
.bw-sysNotes[data-open="1"] .bw-sysNotes__body { display: block }
.bw-note--sys { background: var(--bw-red-dim) }

.bw-pager { display: flex; align-items: center; justify-content: center; gap: 4px; margin-top: 7px }
.bw-pager__gap { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3); padding: 0 2px }
.bw-pager__btn {
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border: 0;
  border-radius: 6px;
  background: var(--bw-surf2);
  color: var(--bw-ink2);
  font: 500 11px/1 var(--bw-f);
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.bw-pager__btn.is-active { background: var(--bw-surf3); color: var(--bw-ink); font-weight: 600 }
.bw-pager__btn:disabled { opacity: .35; cursor: default }

/* Футер колонки: живёт ВНЕ прокручиваемого тела, поэтому форма всегда под
   рукой, а список заметок ходит под ней. */
.bw-col__foot {
  flex: none;
  padding: 9px 12px 11px;
  border-top: 1px solid var(--bw-line);
}
.bw-col__foot:empty { display: none }
.bw-noteForm { display: flex; gap: 6px }
.bw-noteForm__input {
  flex: 1;
  min-width: 0;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--bw-line2);
  border-radius: 8px;
  background: var(--bw-surf2);
  color: var(--bw-ink);
  font: 400 12.5px/1 var(--bw-f);
}
.bw-noteForm__input:focus { outline: none; border-color: var(--bw-blue) }
.bw-noteForm__add {
  width: 32px;
  height: 32px;
  flex: none;
  border: 0;
  border-radius: 8px;
  background: var(--bw-surf3);
  color: var(--bw-ink2);
  font: 500 15px/1 var(--bw-f);
  cursor: pointer;
}

/* ---------- история сделок с контрагентом ---------- */

.bw-hist { margin-top: 12px }
.bw-hist__head {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 7px 9px;
  margin-bottom: 5px;
  border: 1px solid var(--bw-line2);
  border-radius: 9px;
  background: transparent;
  cursor: pointer;
}
.bw-hist__title {
  font: 600 10px/1 var(--bw-f);
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--bw-ink3);
  white-space: nowrap;
}
.bw-hist__stats { margin-left: auto; font: 500 12px/1 var(--bw-f); color: var(--bw-ink) }
.bw-hist__arrow { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-hist__list { display: flex; flex-direction: column; gap: 1px }
.bw-hist__legend { margin-top: 6px; font: 400 10px/1 var(--bw-f); color: var(--bw-ink3); text-align: right }

/* Строку рисует ОБЩИЙ модуль (cpHistRows.js) — здесь только подгонка ритма под
   это окно. Снаружи, в окне полной истории, строка остаётся прежней. */
.bw-win .by-cpHistRow {
  display: flex;
  align-items: center;
  gap: 7px;
  height: 27px;
  padding: 0 8px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  cursor: pointer;
}
.bw-win .by-cpHistRow:hover { background: var(--bw-surf3); outline: none }

/* Подложки у строк НЕТ — ни у покупок, ни у отменённых (решение владельца
   25.08.2026). Сторону называет маркер, состояние — слово справа; подложка
   поверх них делала список пёстрым, а отменённые выглядели важнее живых.
   Правила в bybit.css идут двумя-тремя классами, поэтому гасим так же. */
.bw-win .by-cpHistRow.is-buy,
.bw-win .by-cpHistRow.is-sell,
.bw-win .by-cpHistRow.is-cancelled,
.bw-win .by-cpHistRow.is-buy.is-cancelled,
.bw-win .by-cpHistRow.is-sell.is-cancelled { background: transparent }
.bw-win .by-cpHistRow.is-buy:hover,
.bw-win .by-cpHistRow.is-sell:hover { background: var(--bw-surf3) }

.bw-win .by-cpHistRow__side {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  flex: none;
  border-radius: 4px;
  font: 700 9.5px/1 var(--bw-f);
}
/* Покупка зелёная, продажа красная — это сторона КОНТРАГЕНТА, и цвет у неё
   тот же, что у чисел «его покупки / продажи» выше. */
.bw-win .by-cpHistRow.is-buy .by-cpHistRow__side { background: var(--bw-hi-dim); color: var(--bw-hi) }
.bw-win .by-cpHistRow.is-sell .by-cpHistRow__side { background: var(--bw-red-dim); color: var(--bw-red) }
.bw-win .by-cpHistRow.is-cancelled .by-cpHistRow__amount { color: var(--bw-ink3) }
.bw-win .by-cpHistRow__date { font: 400 11.5px/1 var(--bw-f); color: var(--bw-ink3); flex: none }
.bw-win .by-cpHistRow__amount { font: 500 12px/1 var(--bw-f); color: var(--bw-ink) }
.bw-win .by-cpHistRow__rate { font: 400 11.5px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-win .by-cpHistRow__appeal { color: var(--bw-red); font-size: 11px }
.bw-win .by-cpHistRow__status { margin-left: auto; font: 500 11px/1 var(--bw-f); white-space: nowrap }
/* Открытая сейчас сделка в списке — СИНЯЯ (макет).
   Подсветка была и раньше, но её не было видно: фон в 8% синего на тёмном
   почти неразличим, а цвет статуса задан ИНЛАЙНОМ в общей разметке строки
   (`ui/order-card/cpHistRows.js` ставит style="color:…" по статусу), и обычное
   правило его не перебивает. Инлайн бьётся только `!important`; трогать общий
   модуль ради этого нельзя — по нему живёт и старое окно.
   Полоса слева нужна отдельно от фона: строка бывает и приглушённой
   (`is-denied`, прозрачность .45), и один фон там тает совсем.
   `!important` у фона — не украшение. В `bybit.css` у `.by-cpHistRow.is-current`
   стоит `background: color-mix(… var(--by-acc) …) !important`, а токена
   `--by-acc` в этом окне нет вовсе: оно живёт на своих `--bw-*`. Значение с
   неразрешимым `var()` не отбрасывается как ошибка — оно вычисляется в
   «ничто», и важное чужое правило гасило фон в ПРОЗРАЧНЫЙ, перебивая наш.
   Ровно поэтому подсветки и не было видно: полоса и цвет статуса вставали, а
   заливка исчезала. */
.bw-win .by-cpHistRow.is-current,
.bw-win .by-cpHistRow.is-buy.is-current,
.bw-win .by-cpHistRow.is-sell.is-current {
  background-color: var(--bw-blue-soft) !important;
  box-shadow: inset 2px 0 0 var(--bw-blue);
  outline: none;
}
.bw-win .by-cpHistRow.is-current .by-cpHistRow__status { color: var(--bw-blue) !important }
.bw-win .by-cpHistRow.is-current .by-cpHistRow__amount { color: var(--bw-ink) }
.bw-win .by-cpHistRow.is-denied { opacity: .45 }

/* ---------- антифрод ---------- */

.bw-finds { display: flex; flex-direction: column }

.bw-find { margin-bottom: 4px; border-radius: 9px; background: var(--bw-surf2); overflow: hidden }
.bw-find--danger { background: var(--bw-red-dim) }

.bw-find__head {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 31px;
  padding: 6px 9px;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.bw-find__head[aria-disabled="true"] { cursor: default }
.bw-find__dot { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--bw-ink3) }
.bw-find--danger .bw-find__dot { background: var(--bw-red) }
.bw-find--warn .bw-find__dot { background: var(--bw-amber) }
.bw-find--info .bw-find__dot { background: var(--bw-blue) }
.bw-find--good .bw-find__dot { background: var(--bw-hi) }

.bw-find__title { flex: none; font: 600 12px/1.25 var(--bw-f); color: var(--bw-ink); white-space: nowrap }
.bw-find__text {
  flex: 1;
  min-width: 0;
  font: 400 11.5px/1.25 var(--bw-f);
  color: var(--bw-ink2);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bw-find[data-open="1"] .bw-find__text { white-space: normal }
.bw-find__caret { width: 12px; flex: none; text-align: right; font: 400 10px/1 var(--bw-f); color: var(--bw-ink3) }

.bw-find__body { display: none; padding: 0 9px 8px 23px; flex-direction: column; gap: 3px }
.bw-find[data-open="1"] .bw-find__body { display: flex }
.bw-find__detail { font: 400 11.5px/1.35 var(--bw-f); color: var(--bw-ink2) }
.bw-find__note { font: 400 11.5px/1.35 var(--bw-f); color: var(--bw-amber) }
.bw-find__acts { display: flex; gap: 5px; margin-top: 4px }

/* ---------- запись реестра скамеров (scam.js: regHtml) ----------
   Имя `.bw-reg`, а НЕ `.bw-mark`: последнее занято галочкой 15×15 в полке «Его
   реквизиты». Столкновение не даёт ни ошибки, ни предупреждения — записи молча
   сжимаются в пятнадцать пикселей и наезжают друг на друга (поймано на стенде
   `docs/order-window/scam-marks-format.html`).

   Подложки у записи НЕТ намеренно: находка уже стоит на красной, и вторая
   внутри неё дала бы «коробку в коробке» на 326 пикселях ширины. Разделяет
   записи полоса слева — она же метка «это обвинение». */
.bw-reg + .bw-reg { margin-top: 6px }
.bw-reg { border-left: 2px solid var(--bw-red); padding-left: 7px }

/* ① кто помечен. Перенос разрешён: длинный номер плюс дата плюс счётчик не
   всегда влезают в 326px, и уехавший за край счётчик хуже второй строки. */
.bw-reg__h { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap }
.bw-reg__kind {
  flex: none; font: 500 9.5px/1 var(--bw-f); letter-spacing: .05em;
  text-transform: uppercase; color: var(--bw-ink3);
}
.bw-reg__v { font: 600 12px/1.25 var(--bw-f); color: var(--bw-ink); min-width: 0; word-break: break-all }
/* Дата — В ШАПКЕ (плотный вариант, решение владельца): третий ярус короче на
   строку, а два числа подряд не спорят, потому что счётчик красный пилюлей. */
.bw-reg__at { margin-left: auto; flex: none; font: 400 10px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-reg__n {
  flex: none; font: 600 10px/1 var(--bw-f); color: var(--bw-red);
  background: var(--bw-red-dim); border-radius: 20px; padding: 3px 6px;
}

/* ② за что — главное на этой находке, поэтому сразу под значением. */
.bw-reg__q { margin-top: 2px; font: 400 11.5px/1.4 var(--bw-f); color: var(--bw-red) }

/* ③ кто и когда сказал — мелко и приглушённо. */
.bw-reg__m {
  margin-top: 2px; display: flex; flex-wrap: wrap; gap: 3px 6px;
  font: 400 10px/1.3 var(--bw-f); color: var(--bw-ink3);
}
.bw-reg__src { color: var(--bw-ink2) }
/* Система названа отдельно от паблика: после 28.08.2026 «какая система нашла»
   не праздный вопрос — у Detecto и BybitEye свои строки и свои вердикты. */
.bw-reg__sys { letter-spacing: .02em; text-transform: uppercase; font-weight: 600 }
/* Источник перестал подтверждать — не снятие обвинения, но и не свежее оно. */
.bw-reg__stale { color: var(--bw-amber) }

/* Оспоренная гаснет целиком, цитата зачёркнута, причина видна. Удалять записи
   нельзя, и «кто-то уже разбирался» — само по себе сведение. */
.bw-reg.is-off { border-left-color: var(--bw-line2); opacity: .7 }
.bw-reg.is-off .bw-reg__q { color: var(--bw-ink2); text-decoration: line-through }
.bw-reg.is-off .bw-reg__n { color: var(--bw-ink3); background: var(--bw-surf2) }
.bw-reg__off {
  margin-top: 3px; padding-top: 3px; border-top: 1px dashed var(--bw-line2);
  font: 400 10px/1.35 var(--bw-f); color: var(--bw-ink3);
}

.bw-quiets { margin-top: 6px }
.bw-quiets__head {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  height: 28px;
  padding: 0 9px;
  border: 1px solid var(--bw-line);
  border-radius: 9px;
  background: transparent;
  color: var(--bw-ink2);
  font: 500 11.5px/1 var(--bw-f);
  cursor: pointer;
}
.bw-quiets__n { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-quiets__body { display: none; padding: 6px 2px 0 }
.bw-quiets[data-open="1"] .bw-quiets__body { display: block }
.bw-quiet { display: flex; align-items: center; gap: 7px; min-height: 22px }
.bw-quiet__dot { width: 6px; height: 6px; flex: none; border-radius: 50%; background: var(--bw-ink3) }
.bw-quiet--ok .bw-quiet__dot { background: var(--bw-hi) }
.bw-quiet__title { flex: none; font: 400 11.5px/1.3 var(--bw-f); color: var(--bw-ink2); white-space: nowrap }
.bw-quiet__text {
  font: 400 11px/1.3 var(--bw-f);
  color: var(--bw-ink3);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* --- «Его реквизиты» --- */

.bw-hisReqs { margin-top: 8px }
.bw-hisReqs__head {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 7px;
  height: 30px;
  padding: 0 9px;
  border: 0;
  border-radius: 9px;
  background: var(--bw-surf2);
  cursor: pointer;
}
.bw-hisReqs__head.is-bad { background: var(--bw-red-dim) }
.bw-hisReqs__title { font: 600 11.5px/1 var(--bw-f); color: var(--bw-ink) }
.bw-hisReqs__n { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-hisReqs__scam { font: 600 11px/1 var(--bw-f); color: var(--bw-red) }
.bw-hisReqs__body { display: none; padding-top: 6px }
.bw-hisReqs[data-open="1"] .bw-hisReqs__body { display: block }

.bw-hisReq {
  margin-bottom: 6px;
  padding: 7px 9px;
  border-radius: 9px;
  background: var(--bw-surf2);
  border-left: 2px solid var(--bw-line2);
}
.bw-hisReq.is-bad { border-left-color: var(--bw-red) }
.bw-hisReq.is-ok { border-left-color: var(--bw-hi) }
.bw-hisReq__top { display: flex; align-items: center; gap: 6px }
.bw-hisReq__value { font: 500 12.5px/1 var(--bw-f); color: var(--bw-ink); cursor: pointer }
.bw-hisReq__value.is-copied { color: var(--bw-hi) }
.bw-hisReq__times { font: 400 10.5px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-hisReq__meta { margin-top: 3px; font: 400 10.5px/1.3 var(--bw-f); color: var(--bw-ink3) }
.bw-hisReq__chk { display: flex; align-items: center; gap: 5px; margin-top: 4px; font: 400 11px/1.3 var(--bw-f) }
.bw-hisReq__ic { width: 13px; flex: none; text-align: center; font: 700 9.5px/1 var(--bw-f) }
.bw-hisReq__chk.is-bad { color: var(--bw-red) }
.bw-hisReq__chk.is-ok { color: var(--bw-hi) }
.bw-hisReq__chk.is-none { color: var(--bw-ink3) }
/* Источник промолчал: не находка и не чистота — попытка, которую стоит
   повторить. Янтарный, как и всё «требует внимания» в этом окне. */
.bw-hisReq__chk.is-warn { color: var(--bw-amber) }
.bw-hisReq.is-warn { border-left-color: var(--bw-amber) }
.bw-hisReq__shared { margin-top: 3px; font: 400 11px/1.3 var(--bw-f); color: var(--bw-red) }
.bw-hisReq .bw-miniBtn { margin-top: 5px }

.bw-here {
  font: 600 9.5px/1 var(--bw-f);
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--bw-blue);
  background: var(--bw-blue-dim);
  border-radius: 4px;
  padding: 3px 5px;
  white-space: nowrap;
}

.bw-idx {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  flex: none;
  border-radius: 4px;
  background: var(--bw-surf3);
  color: var(--bw-ink2);
  font: 700 9.5px/1 var(--bw-f);
  font-variant-numeric: tabular-nums;
}
.bw-idx.is-bad,
.bw-idx.is-invalid { background: var(--bw-red-dim); color: var(--bw-red) }
.bw-idx.is-ok { background: var(--bw-hi-dim); color: var(--bw-hi) }

.bw-reqOrders { display: flex; flex-direction: column; gap: 4px; margin-top: 6px }
.bw-reqOrders__tabs { display: flex; gap: 4px }
.bw-reqOrders__list { display: flex; flex-direction: column; gap: 2px; max-height: 180px; overflow-y: auto }
.bw-reqOrder {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto auto;
  align-items: center;
  gap: 6px;
  min-height: 24px;
  padding: 0 7px;
  border: 0;
  border-radius: 6px;
  background: var(--bw-surf3);
  color: var(--bw-ink2);
  font: 400 10.5px/1 var(--bw-f);
  cursor: pointer;
  text-align: left;
}
.bw-reqOrder:hover { color: var(--bw-ink) }
.bw-reqOrder__nick { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.bw-reqOrder__date { color: var(--bw-ink3) }

/* ---------- колонка чата ---------- */

.bw-chatReqs { flex: none; padding: 9px 12px 8px; border-bottom: 1px solid var(--bw-line) }
.bw-chatReqs__head {
  width: 100%;
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 7px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}
.bw-chatReqs__hint {
  margin-left: auto;
  font: 400 10px/1 var(--bw-f);
  color: var(--bw-ink3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.bw-chatReqs[data-open="0"] .bw-chatReqs__hint { display: none }
.bw-chatReqs__body { display: none; flex-direction: column; gap: 4px; max-height: 210px; overflow-y: auto }
.bw-chatReqs[data-open="1"] .bw-chatReqs__body { display: flex }

.bw-reqRow {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: var(--bw-surf2);
  cursor: pointer;
}
.bw-reqRow:hover { background: var(--bw-surf3) }
.bw-reqRow.is-bad,
.bw-reqRow.is-invalid { border-color: var(--bw-red) }
.bw-reqRow.is-bad .bw-reqRow__value,
.bw-reqRow.is-invalid .bw-reqRow__value { color: var(--bw-red) }
.bw-reqRow.is-invalid .bw-reqRow__meta { color: var(--bw-red) }
.bw-reqRow.is-mine { opacity: .85 }
.bw-reqRow.is-flash { border-color: var(--bw-blue) }
.bw-reqRow.is-copied { border-color: var(--bw-hi) }

.bw-reqRow__value { font: 500 13px/1 var(--bw-f); color: var(--bw-ink); white-space: nowrap }
.bw-reqRow__bank { display: flex; align-items: center; gap: 6px }
/* Длинное название («Банк Синара», «Датабанк») не имеет права распирать
   строку: номер и значок проверки важнее, и уехать они не должны. */
.bw-reqRow__bankName {
  font: 400 12px/1 var(--bw-f);
  color: var(--bw-ink2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 130px;
}
.bw-reqRow__meta { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3); white-space: nowrap }
.bw-reqRow__times { font: 400 10.5px/1 var(--bw-f); color: var(--bw-ink3) }

.bw-conflict {
  height: 20px;
  padding: 0 6px;
  border: 0;
  border-radius: 5px;
  background: var(--bw-amber-dim);
  color: var(--bw-amber);
  font: 700 11px/1 var(--bw-f);
  cursor: pointer;
}

.bw-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  flex: none;
  font: 700 10px/1 var(--bw-f);
  color: var(--bw-ink3);
}
.bw-mark.is-ok { color: var(--bw-hi) }
.bw-mark.is-bad { color: var(--bw-red) }
.bw-mark--ask { border: 0; border-radius: 5px; background: transparent; cursor: pointer }
.bw-mark--ask:hover { background: var(--bw-surf3) }
.bw-mark.is-spin {
  width: 11px;
  height: 11px;
  border: 2px solid var(--bw-line2);
  border-top-color: var(--bw-ink2);
  border-radius: 50%;
  animation: bw-spin .8s linear infinite;
  font-size: 0;
}

/* Второй значок проверки — SCAM NET рядом с Detecto. Компактная пилюля «SN»,
   стоит только когда добавляет знание (в ЧС / чисто там, где Detecto молчит). */
.bw-sn {
  display: inline-flex;
  align-items: center;
  height: 15px;
  padding: 0 4px;
  flex: none;
  border-radius: 4px;
  font: 700 8.5px/1 var(--bw-f);
  letter-spacing: .03em;
  color: var(--bw-ink3);
  background: var(--bw-surf3);
}
.bw-sn.is-ok { color: var(--bw-hi); background: var(--bw-hi-dim); }
.bw-sn.is-bad { color: var(--bw-red); background: var(--bw-red-dim); }

.bw-reqRow__del {
  width: 18px;
  height: 18px;
  flex: none;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--bw-ink3);
  font: 400 12px/1 var(--bw-f);
  cursor: pointer;
}
.bw-reqRow__del:hover { color: var(--bw-red) }

.bw-reqNote { font: 400 10.5px/1.3 var(--bw-f); color: var(--bw-amber); padding: 2px 0 }

.bw-reqAdd { display: flex; gap: 6px; margin-top: 1px }
.bw-reqAdd__input {
  flex: 1;
  min-width: 0;
  height: 28px;
  padding: 0 9px;
  border: 1px solid var(--bw-line2);
  border-radius: 8px;
  background: var(--bw-surf2);
  color: var(--bw-ink);
  font: 400 12px/1 var(--bw-f);
}
.bw-reqAdd__input:focus { outline: none; border-color: var(--bw-blue) }
.bw-reqAdd__btn {
  width: 28px;
  height: 28px;
  flex: none;
  border: 0;
  border-radius: 8px;
  background: var(--bw-surf3);
  color: var(--bw-ink2);
  font: 500 14px/1 var(--bw-f);
  cursor: pointer;
}

.bw-chatHead { flex: none; padding: 8px 12px 4px }

/* «Уехавшее» сообщение стоит в ленте наравне с остальными и выглядит так же:
   клиент контрагента отстал на одну сделку, но писал он про эту. Отличие
   только в подсказке при наведении. Отправленные РАНЬШЕ начала сделки в ленту
   не попадают вовсе — отсекает chat.js. */

/* ---------- лента ---------- */

.bw-chat {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 6px 14px 10px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

/* Пузырь рисует ОБЩИЙ рендерер; здесь только его вид внутри этого окна. */
.bw-win .by-msg {
  max-width: 70%;
  padding: 8px 11px;
  border-radius: 11px;
  background: var(--bw-surf2);
  align-self: flex-start;
  display: block;
  border: 0;
}
.bw-win .by-msg--me { align-self: flex-end; background: var(--bw-hi-dim) }
.bw-win .by-msg__text { display: block; font: 400 13px/1.45 var(--bw-f); color: var(--bw-ink); white-space: pre-wrap }
.bw-win .by-msg__time {
  display: block;
  margin-top: 3px;
  text-align: right;
  font: 400 10px/1 var(--bw-f);
  color: var(--bw-ink3);
  font-variant-numeric: tabular-nums;
}
/* Галочки прочтения нашего сообщения. Правило показа — общее с панелью под
   строкой списка (chatView.js), а стиль у каждого зрителя свой: пузырь один,
   файлов темы два, и класс без правила здесь означал бы галочку без цвета. */
.bw-win .by-msg__ticks { margin-left: 5px; font-size: 11px; letter-spacing: -1.5px; }
.bw-win .by-msg__ticks.is-read { color: var(--bw-hi); }
.bw-win .by-msg__ticks.is-sent { color: var(--bw-ink3); }
.bw-win .by-msg__note {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  font: 500 11px/1.3 var(--bw-f);
}
.bw-win .by-msg__note--ok { color: var(--bw-hi) }
.bw-win .by-msg__note--bad { color: var(--bw-red) }
.bw-win .by-msg__note--wait { color: var(--bw-ink3) }

.bw-win .by-msg--sys {
  max-width: 80%;
  align-self: flex-start;
  padding: 2px 0;
  background: transparent;
  font: 400 11.5px/1.45 var(--bw-f);
  color: var(--bw-ink3);
}
.bw-win .by-msg--sysLong summary { cursor: pointer; list-style: none }
.bw-win .by-msg--sysLong .by-msg__more::before { content: " ещё"; color: var(--bw-blue) }
.bw-win .by-msg--sysLong .by-msg__full { margin-top: 4px }

.bw-win .by-msg--event {
  align-self: center;
  max-width: 90%;
  padding: 3px 0;
  background: transparent;
  font: 600 11.5px/1.4 var(--bw-f);
  color: var(--bw-amber);
  text-align: center;
}
.bw-win .by-msg__eventTime { font-weight: 400; color: var(--bw-ink3); margin-left: 5px }

.bw-win .by-msg--file { display: flex; align-items: center; gap: 9px; padding: 8px 10px; flex-wrap: wrap }
.bw-win .by-msg__doc {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--bw-ink);
  font: 500 12.5px/1 var(--bw-f);
  cursor: pointer;
}
/* Плашка файла, который ещё отправляется: открывать нечего. */
.bw-win .by-msg__doc[disabled] { cursor: default; opacity: .8 }
/* В общей ленте значок файла — маска со скрепкой 13×13. Здесь тип файла
   назван словом в квадрате: по «PDF» и «MP4» видно, что открывать, ещё до
   клика. Маску обязательно гасим — иначе поверх квадрата остаётся скрепка. */
.bw-win .by-msg__docIcon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  flex: none;
  border-radius: 7px;
  background: var(--bw-surf3);
  color: var(--bw-ink2);
  font: 600 9.5px/1 var(--bw-f);
  -webkit-mask-image: none;
  mask-image: none;
}
.bw-win .by-msg__docIcon::before { content: "PDF" }
.bw-win .by-msg__docIcon--video {
  width: 26px;
  height: 26px;
  background: var(--bw-surf3);
}
.bw-win .by-msg__docIcon--video::before { content: "MP4"; font-size: 9.5px }
.bw-win .by-msg__check {
  width: 26px;
  height: 26px;
  flex: none;
  border: 1px solid var(--bw-line2);
  border-radius: 7px;
  background: transparent;
  color: var(--bw-ink2);
  font: 400 11px/1 var(--bw-f);
  cursor: pointer;
}
.bw-win .by-msg--withNote { flex-wrap: wrap }
.bw-win .by-msg--withNote .by-msg__note { flex: 1 0 100% }

/* Обёртка картинки МЕНЯЕТ здесь только вид, но не размеры.
   Размерами занимается общая лента (`bybit.css`), и делает это в два шага: до
   загрузки обёртка держит место сама (min-width/min-height, фон-заглушка, в
   `img` прозрачный пиксель 1×1), а с классом `is-loaded` минимумы снимаются и
   картинка получает `width/height: auto` при потолках. Так бокс обнимает файл,
   какой бы формы тот ни оказался.
   Заданная здесь `width: 230px` этот второй шаг ломала: потолок высоты сжимал
   вертикальный скриншот до ~125 px, а обёртка оставалась 230 — и по бокам
   картинки стояли поля серого фона шире её самой (владелец, 25.08.2026).
   Фон гасим ОТДЕЛЬНЫМ правилом с `is-loaded`: у общей ленты оно есть, но наше
   идёт позже при той же специфичности и иначе победило бы. */
.bw-win .by-msg__imgWrap {
  border-radius: 11px;
  cursor: pointer;
  background: var(--bw-surf3);
}
.bw-win .by-msg__imgWrap.is-loaded { background: none }
.bw-win .by-msg__img { border-radius: 11px }
.bw-win .by-msg__ask {
  height: 23px;
  padding: 0 8px;
  border: 1px solid var(--bw-line2);
  border-radius: 6px;
  background: transparent;
  color: var(--bw-ink2);
  font: 500 10.5px/1 var(--bw-f);
  cursor: pointer;
}
.bw-win .by-msg.is-flash { outline: 2px solid var(--bw-blue); outline-offset: 1px }
.bw-win .by-msg.is-bankFlash { outline: 1px solid var(--bw-amber); outline-offset: 1px }
.bw-win .by-msg.is-appearing { animation: bw-arrive .22s ease-out both }

.bw-phoneRef {
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  padding: 0;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
  cursor: pointer;
}
.bw-phoneRef:hover { color: var(--bw-blue) }
.bw-bankMark { background: var(--bw-amber-dim); color: var(--bw-amber); border-radius: 3px }

.bw-newHint {
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 58px;
  height: 3px;
  border: 0;
  border-radius: 3px;
  background: var(--bw-blue);
  opacity: 0;
  cursor: pointer;
}
.bw-newHint.is-blink { animation: bw-blink 1.1s ease-in-out 3 }
@keyframes bw-blink { 0%, 100% { opacity: 0 } 50% { opacity: .9 } }

/* ---------- строка отправки ---------- */

.bw-attachBar { flex: none; padding: 0 14px }
.bw-attachBar[hidden] { display: none }
.bw-attachChip {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 34px;
  padding: 0 9px;
  margin-bottom: 6px;
  border-radius: 9px;
  background: var(--bw-surf2);
}
.bw-attachChip__thumb { width: 24px; height: 24px; object-fit: cover; border-radius: 6px }
.bw-attachChip__icon {
  width: 18px;
  height: 18px;
  background: var(--bw-ink3);
  -webkit-mask: url("/img/skrepka.svg") center / contain no-repeat;
  mask: url("/img/skrepka.svg") center / contain no-repeat;
}
.bw-attachChip__name {
  flex: 1;
  min-width: 0;
  font: 400 11.5px/1 var(--bw-f);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bw-attachChip__size,
.bw-attachChip__status { font: 400 10px/1 var(--bw-f); color: var(--bw-ink3) }
.bw-attachChip__remove {
  width: 20px;
  height: 20px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--bw-ink3);
  font: 400 13px/1 var(--bw-f);
  cursor: pointer;
}

.bw-chatForm {
  flex: none;
  display: flex;
  align-items: flex-end;
  gap: 7px;
  padding: 9px 14px 12px;
  border-top: 1px solid var(--bw-line);
}
.bw-attach,
.bw-send {
  width: 30px;
  height: 30px;
  flex: none;
  display: grid;
  place-items: center;
  padding: 0;
  border-radius: 9px;
  cursor: pointer;
}
.bw-attach { border: 1px solid var(--bw-line2); background: var(--bw-surf2) }
.bw-attach__icon {
  width: 15px;
  height: 15px;
  background: var(--bw-ink3);
  -webkit-mask: url("/img/skrepka.svg") center / contain no-repeat;
  mask: url("/img/skrepka.svg") center / contain no-repeat;
}
.bw-attach:hover .bw-attach__icon { background: var(--bw-ink2) }

.bw-chatInput {
  flex: 1;
  min-width: 0;
  min-height: 30px;
  max-height: 140px;
  padding: 7px 10px;
  border: 1px solid var(--bw-line2);
  border-radius: 9px;
  background: var(--bw-surf2);
  color: var(--bw-ink);
  font: 400 12.5px/1.3 var(--bw-f);
  resize: none;
}
.bw-chatInput:focus { outline: none; border-color: var(--bw-blue) }

.bw-send {
  border: 1px solid color-mix(in srgb, var(--bw-hi) 45%, transparent);
  background: color-mix(in srgb, var(--bw-hi) 14%, transparent);
}
.bw-send__ico {
  width: 17px;
  height: 17px;
  background: url("/img/send.svg") center / contain no-repeat;
  transform: rotate(45deg) translate(1px, -1px);
}
.bw-send:hover { background: color-mix(in srgb, var(--bw-hi) 28%, transparent) }
.bw-send:active { transform: scale(.95) }
.bw-send:disabled { opacity: .5; cursor: default }

/* Кнопка шаблонов приходит из общего виджета — подгоняем к строке. */
.bw-chatForm .ctplBtn {
  height: 30px;
  padding: 0 10px;
  border: 1px solid var(--bw-line2);
  border-radius: 9px;
  background: var(--bw-surf2);
  color: var(--bw-ink2);
  font: 600 11.5px/1 var(--bw-f);
}
.bw-chatForm .ctplBtn:hover { background: var(--bw-surf3); color: var(--bw-ink) }

.bw-chatErr { font: 400 11px/1.35 var(--bw-f); color: var(--bw-red); padding: 4px 0 }
/* Несвежесть переписки: связь потеряна или биржа не отдаёт деталь. Янтарным —
   это оговорка, а не ошибка: лента живёт, но решение по ней принимать рано.
   Стоит над лентой, в колонке, — прокрутка её не уносит. */
.bw-chatStale { flex: none; font: 400 11px/1.35 var(--bw-f); color: var(--bw-amber); padding: 4px 14px }
/* Сообщение о неудавшейся отправке стоит НАД полем ввода, в самой колонке, а
   не в ленте: там его унесла бы прокрутка, а ближайшая перерисовка стёрла бы
   узел целиком. Отступы по бокам — как у полосы вложения, они соседи. */
.bw-col--chat > .bw-chatErr { flex: none; padding: 4px 14px }

.bw-fatal { grid-column: 1 / -1; padding: 20px; font: 400 12.5px/1.4 var(--bw-f); color: var(--bw-red) }

/* ---------- вкладки узкого окна ---------- */

.bw-tabs { display: none; gap: 4px }
.bw-tabs__btn {
  flex: 1;
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  border-radius: 8px;
  background: var(--bw-surf);
  color: var(--bw-ink2);
  font: 500 11.5px/1 var(--bw-f);
  cursor: pointer;
}
.bw-tabs__btn.is-active { background: var(--bw-surf3); color: var(--bw-ink) }

/* ============================================================
   ПЕРЕЛОМЫ ШИРИНЫ (считает order-window/layout.js → data-w)
   ============================================================ */

.bw-win[data-w="lg"] .bw-body { grid-template-columns: 300px 330px 344px minmax(380px, 1fr) }

.bw-win[data-w="md"] .bw-body { grid-template-columns: 300px 348px minmax(360px, 1fr) }
.bw-win[data-w="md"] .bw-band { grid-column: 1 / 3 }
.bw-win[data-w="md"] .bw-col--chat { grid-column: 3 }
.bw-win[data-w="md"] .bw-pair {
  display: flex;
  flex-direction: column;
  grid-column: 2;
  grid-row: 2;
  gap: 10px;
  min-height: 0;
  overflow-y: auto;
}
.bw-win[data-w="md"] .bw-pair > .bw-col { flex: none; overflow: visible }
.bw-win[data-w="md"] .bw-pair .bw-col__body { overflow: visible }
.bw-win[data-w="md"] .bw-pair .bw-col__head { position: sticky; top: 0; z-index: 2 }
.bw-win[data-w="md"] .bw-scoreChips,
.bw-win[data-w="sm"] .bw-scoreChips,
.bw-win[data-w="xs"] .bw-scoreChips { display: none }

/* Узкое окно: слово из метки уходит, стрелка остаётся. Убрать метку целиком
   нельзя — она единственное, что называет сегмент нажимаемым, а курсора-пальца
   на телефоне не существует вовсе. */
.bw-win[data-w="md"] .bw-risk__openTxt,
.bw-win[data-w="sm"] .bw-risk__openTxt,
.bw-win[data-w="xs"] .bw-risk__openTxt { display: none }
.bw-win[data-w="md"] .bw-risk__open,
.bw-win[data-w="sm"] .bw-risk__open,
.bw-win[data-w="xs"] .bw-risk__open { width: 24px; padding: 0; justify-content: center }

.bw-win[data-w="sm"] .bw-body {
  grid-template-columns: 292px minmax(420px, 1fr);
  grid-template-rows: auto auto minmax(0, 1fr);
}
.bw-win[data-w="sm"] .bw-band { grid-column: 1 / 3; grid-row: 1 }
.bw-win[data-w="sm"] .bw-tabsHost { display: block; grid-column: 2; grid-row: 2 }
.bw-win[data-w="sm"] .bw-tabs--sm { display: flex }
.bw-win[data-w="sm"] .bw-col--deal { grid-column: 1; grid-row: 2 / 4 }
.bw-win[data-w="sm"] .bw-col--cp,
.bw-win[data-w="sm"] .bw-col--scam,
.bw-win[data-w="sm"] .bw-col--chat { grid-column: 2; grid-row: 3; display: none }
.bw-win[data-w="sm"][data-tab="cp"] .bw-col--cp,
.bw-win[data-w="sm"][data-tab="scam"] .bw-col--scam,
.bw-win[data-w="sm"][data-tab="chat"] .bw-col--chat { display: flex }

.bw-win[data-w="xs"] {
  top: 0;
  left: 0;
  width: 100vw;
  max-width: 100vw;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 0;
  transform: none;
  border: 0;
  border-radius: 0;
  animation: none;
}
.bw-win[data-w="xs"] .bw-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px 8px 60px;
  overflow: hidden;
}
.bw-win[data-w="xs"] .bw-band { order: 1; flex: none; min-height: 68px; flex-wrap: wrap; align-items: center }
.bw-win[data-w="xs"] .bw-band__sep { display: none }
.bw-win[data-w="xs"] .bw-band__side { width: auto; flex: 1 0 100%; flex-direction: row; align-items: center; gap: 9px; padding: 8px 14px 0 }
.bw-win[data-w="xs"] .bw-band__sideBot { margin-left: auto }
.bw-win[data-w="xs"] .bw-band__timer { font-size: 17px }
/* Зазор обязателен: без него подпись «оценка риска» встаёт вплотную к строке
   стороны и читается её продолжением.

   Отступ и скругление плитки здесь сняты: сегмент занимает всю ширину полосы
   и выравнен по левому краю со строкой стороны над ним, а отступ сдвинул бы
   его вправо и это выравнивание разорвал. Подложка нажатия — во всю ширину. */
.bw-win[data-w="xs"] .bw-band__risk { flex: 1 0 100%; margin: 0; padding: 6px 14px 8px; border-radius: 0 }
.bw-win[data-w="xs"] .bw-tabsHost { order: 2; display: block; flex: none }
.bw-win[data-w="xs"] .bw-tabs--xs { display: flex }
.bw-win[data-w="xs"] .bw-tabs__btn { min-height: 44px }
.bw-win[data-w="xs"] .bw-col { order: 3; flex: 1; min-height: 0; display: none }
.bw-win[data-w="xs"][data-tab="dossier"] .bw-pair {
  display: flex;
  flex-direction: column;
  order: 3;
  gap: 8px;
  min-height: 0;
  overflow-y: auto;
}
.bw-win[data-w="xs"][data-tab="dossier"] .bw-col--scam { display: flex; order: 3; flex: none }
.bw-win[data-w="xs"][data-tab="dossier"] .bw-col--cp { display: flex; order: 4; flex: none }
.bw-win[data-w="xs"][data-tab="dossier"] .bw-pair .bw-col__body { overflow: visible }
.bw-win[data-w="xs"][data-tab="chat"] .bw-col--chat { display: flex }
.bw-win[data-w="xs"][data-tab="deal"] .bw-col--deal,
.bw-win[data-w="xs"][data-tab="notes"] .bw-col--deal { display: flex }
.bw-win[data-w="xs"][data-tab="deal"] .bw-notes,
.bw-win[data-w="xs"][data-tab="deal"] .bw-col__foot { display: none }
.bw-win[data-w="xs"][data-tab="notes"] .bw-kvs,
.bw-win[data-w="xs"][data-tab="notes"] .bw-col--deal .bw-shelf { display: none }

.bw-win[data-w="xs"] .bw-head { height: 44px; padding-top: var(--safe-top, 0) }
.bw-win[data-w="xs"] .bw-head__token,
.bw-win[data-w="xs"] .bw-head__rate { display: none }

/* Денежная кнопка прижата к низу экрана: решение всегда под большим пальцем.
   ABSOLUTE, а не FIXED — содержащим блоком становится само окно. И обязательно
   justify-self: stretch: на широком окне сегмент — элемент сетки, у которого от
   раскладки остаётся justify-self, а при нём пара left+right НЕ растягивает
   абсолютный бокс, а прижимает его к правому краю по содержимому. */
.bw-win[data-w="xs"] .bw-band__act {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: calc(8px + var(--safe-bottom, 0px));
  width: auto;
  justify-self: stretch;
  z-index: 3;
  padding: 0;
}
.bw-win[data-w="xs"] .bw-money,
.bw-win[data-w="xs"] .bw-actBusy { width: 100%; height: 44px }
.bw-win[data-w="xs"] .bw-metrics { grid-template-columns: 1fr 1fr }
.bw-win[data-w="xs"] .bw-attach,
.bw-win[data-w="xs"] .bw-send { width: 44px; height: 44px }
.bw-win[data-w="xs"] .bw-chatInput { min-height: 44px; max-height: 110px }
.bw-win[data-w="xs"] .bw-reqRow { min-height: 44px }

/* mobile.css поднимает ВСЕМ кнопкам min-height 40px ради тач-целей. Тонким
   элементам окна это ломает ритм — отбиваем адресно и ВНЕ media-запроса, где
   выигрывает специфичность, а не порядок файлов. */
.bw-win .bw-head__close,
.bw-win .bw-shelf__btn,
.bw-win .bw-find__head,
.bw-win .bw-pager__btn,
.bw-win .bw-note__del,
.bw-win .bw-reqRow__del,
.bw-win .bw-mark--ask,
.bw-win .bw-conflict,
.bw-win .bw-phoneRef,
.bw-win .bw-sysNotes__go,
.bw-win .bw-sysNotes__btn,
.bw-win .bw-cancelNote__btn,
.bw-win .bw-miniBtn,
.bw-win .bw-err__retry,
.bw-win .bw-tab,
.bw-win .bw-quiets__head,
.bw-win .bw-hisReqs__head,
.bw-win .bw-chatReqs__head,
.bw-win .bw-hist__head,
.bw-win .bw-reqAdd__btn,
.bw-win .by-msg__check,
.bw-win .by-msg__ask,
.bw-win .by-quickAdd,
.bw-win .by-cpHistRow { min-height: 0 }

/* ============================================================
   Окно «Подробная внешняя проверка» (js/ui/order-window/externalCheck.js)
   Слой поверх окна ордера в его же токенах (.bw-win).
   ============================================================ */
.bec-overlay {
  position: fixed; inset: 0; z-index: 10050;
  display: grid; place-items: center; padding: 58px 16px 20px;
  background: rgba(6, 7, 9, .62); backdrop-filter: blur(2px); overflow: auto;
  scrollbar-width: none;
}
.bec-overlay::-webkit-scrollbar { display: none; }
[data-theme="light"] .bec-overlay { background: rgba(30, 28, 25, .42); }

.bec-modal {
  /* Размер зависит от РАБОЧЕГО ПРОСТРАНСТВА и ни от чего больше.
     Была одна `max-height` — и окно тянулось за содержимым: переключил
     вкладку, раскрыл чек, свернул досье, и оно прыгало, унося кнопки
     из-под курсора. Приём тот же, что у самого окна ордера (`.bw-win`):
     высота задана, содержимое прокручивается внутри. Числа меньше — это
     диалог ПОВЕРХ него и обязан читаться как меньший. `dvh`, а не `vh`:
     на телефоне адресная строка прячется, и `vh` оставляет окно выше экрана. */
  width: min(1040px, calc(100vw - 48px));
  height: min(860px, calc(100dvh - 96px));
  display: flex; flex-direction: column;
  background: var(--bw-bg); color: var(--bw-ink); font: 14px/1.5 var(--bw-f);
  border: 1px solid var(--bw-line2); border-radius: 14px; overflow: hidden;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .6);
}
.bec-head { flex: none; display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--bw-surf); border-bottom: 1px solid var(--bw-line); }
.bec-head__t { font: 600 13.5px/1 var(--font-heading, var(--bw-f)); }
/* Свежесть данных: возраст последней актуализации BybitEye. Пусто — места не
   занимает. Старше часа — приглушённо-янтарным, старше недели — красным с точкой,
   чтобы старые данные бросались в глаза и звали переспросить. */
.bec-fresh { font: 500 11px/1 var(--bw-f); color: var(--bw-ink3); white-space: nowrap; }
.bec-fresh:empty { display: none; }
.bec-fresh.is-stale { color: var(--bw-amber); }
.bec-fresh.is-old { color: var(--bw-red); }
.bec-fresh.is-old::before {
  content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%;
  background: var(--bw-red); margin-right: 5px; vertical-align: 1px;
}
.bec-x { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 6px; color: var(--bw-ink2); background: var(--bw-surf2); border: 1px solid var(--bw-line); cursor: pointer; }
.bec-x svg { width: 14px; height: 14px; }

.bec-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 12px; scrollbar-width: none; }
.bec-scroll::-webkit-scrollbar { display: none; }

.bec-empty, .bec-plain { color: var(--bw-ink3); font-size: 13px; font-style: italic; padding: 8px 2px; }

/* Раскладка тела: колонка с gap. Секции-«карточки» текут в ряд (bec-flow) и
   переносятся; пустые в разметку не попадают вовсе (строит body в JS), поэтому
   пол-экрана заглушек «нет» больше нет. «Общие» стоят своей строкой ниже —
   таблица широкая. */
.bec-body { display: flex; flex-direction: column; gap: 10px; }
.bec-flow { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; }
.bec-flow > .bec-sec { flex: 1 1 300px; min-width: 0; }

.bec-sec { background: var(--bw-surf); border: 1px solid var(--bw-line); border-radius: 10px; overflow: hidden; }
.bec-sh { display: flex; align-items: center; gap: 8px; padding: 8px 12px 7px; border-bottom: 1px solid var(--bw-line); font: 600 10.5px/1 var(--bw-f); letter-spacing: .08em; text-transform: uppercase; color: var(--bw-ink2); }
.bec-sh .bec-n { margin-left: auto; font-weight: 600; color: var(--bw-ink3); background: var(--bw-surf2); border-radius: 20px; padding: 2px 8px; letter-spacing: 0; }
.bec-sb { padding: 9px 11px; }

.bec-chip { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 5px; font: 500 11px/1 var(--bw-f); color: var(--bw-ink2); background: var(--bw-surf2); white-space: nowrap; }
.bec-chip.is-bad { color: var(--bw-red); background: var(--bw-red-dim); }
.bec-chip.is-good { color: var(--bw-hi); background: var(--bw-hi-dim); }

.bec-who { display: flex; align-items: center; gap: 12px; padding: 12px; }
.bec-brand { width: 36px; height: 36px; border-radius: 9px; background: linear-gradient(150deg, #2bd576, #159a56); display: grid; place-items: center; flex: none; }
.bec-brand svg { width: 19px; height: 19px; }
.bec-who__main { flex: 1; min-width: 0; }
.bec-who__nick { font: 700 18px/1.1 var(--font-heading, var(--bw-f)); }
.bec-who__meta { display: flex; flex-wrap: wrap; gap: 2px 10px; margin-top: 3px; font: 400 11.5px/1.3 var(--bw-f); color: var(--bw-ink2); }
.bec-who__meta b { color: var(--bw-ink); font-variant-numeric: tabular-nums; }
.bec-vic { width: 40px; height: 40px; flex: none; display: grid; place-items: center; border-radius: 9px; color: #fff; }
.bec-vic.is-bad { background: var(--bw-red); } .bec-vic.is-ok { background: var(--bw-hi); }
.bec-vic svg { width: 21px; height: 21px; }
.bec-vbar { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-top: 1px solid var(--bw-line); flex-wrap: wrap; }
.bec-vbar__t { font: 700 13px/1 var(--font-heading, var(--bw-f)); }
.bec-vbar.is-bad .bec-vbar__t { color: var(--bw-red); } .bec-vbar.is-ok .bec-vbar__t { color: var(--bw-hi); }
.bec-vbar__tags { display: flex; gap: 6px; margin-left: auto; flex-wrap: wrap; }

.bec-pn + .bec-pn { margin-top: 6px; }
.bec-pn { border-radius: 7px; border: 1px solid var(--bw-line); background: var(--bw-surf2); padding: 6px 9px; }
.bec-pn.is-bad { background: var(--bw-red-dim); }
.bec-pn__top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bec-pn__num { font: 600 12.5px/1 var(--bw-f); font-variant-numeric: tabular-nums; }
.bec-pn__o { font: 500 10px/1 var(--bw-f); color: var(--bw-ink3); border: 1px solid var(--bw-line2); border-radius: 5px; padding: 2px 6px; }
.bec-pn__top .bec-chip { margin-left: auto; }
.bec-pn__c { margin-top: 7px; font: 400 12px/1.4 var(--bw-f); color: var(--bw-red); }
.bec-pn__d { font: 500 10px/1 var(--bw-f); color: var(--bw-ink3); margin-top: 4px; }

.bec-rev + .bec-rev { margin-top: 6px; }
.bec-rev { background: var(--bw-surf2); border: 1px solid var(--bw-line); border-radius: 7px; padding: 6px 9px; }
.bec-rev__h { display: flex; align-items: center; gap: 8px; margin-bottom: 3px; }
.bec-rev__who { font: 500 10.5px/1 var(--bw-f); color: var(--bw-ink3); font-variant-numeric: tabular-nums; }
.bec-rev__d { margin-left: auto; font: 500 10px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-rev__t { font: 400 12.5px/1.45 var(--bw-f); }

.bec-metrics { display: flex; flex-wrap: wrap; gap: 6px; }
.bec-m { display: flex; align-items: baseline; gap: 6px; background: var(--bw-surf2); border: 1px solid var(--bw-line); border-radius: 7px; padding: 6px 10px; }
.bec-m__v { font: 700 14px/1 var(--font-heading, var(--bw-f)); font-variant-numeric: tabular-nums; }
.bec-m__k { font: 400 11px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-m.is-warn .bec-m__v { color: var(--bw-amber); }
.bec-m.is-flag { border-color: color-mix(in srgb, var(--bw-blue) 40%, transparent); background: var(--bw-blue-dim); }
.bec-m.is-flag .bec-m__v { color: var(--bw-blue); }

/* История «Общих» скроллится ВНУТРИ себя (до ~7 строк видно), а не тянет всё
   окно: длинный список остаётся в своей рамке. */
.bec-tscroll { overflow: auto; max-height: 300px; scrollbar-width: none; }
.bec-tscroll::-webkit-scrollbar { display: none; }
/* Шапка таблицы липнет при прокрутке истории. */
.bec-ht thead th { position: sticky; top: 0; background: var(--bw-surf); z-index: 1; }
.bec-laststat { margin-top: 10px; font: 400 12px/1.4 var(--bw-f); color: var(--bw-ink2); }
.bec-laststat b { color: var(--bw-ink); font-variant-numeric: tabular-nums; }
.bec-ht { width: 100%; border-collapse: collapse; font: 400 12px/1 var(--bw-f); min-width: 520px; }
.bec-ht th { text-align: left; font: 600 9.5px/1 var(--bw-f); letter-spacing: .05em; text-transform: uppercase; color: var(--bw-ink3); padding: 9px 12px 7px; border-bottom: 1px solid var(--bw-line); white-space: nowrap; }
.bec-ht td { padding: 7px 12px; border-bottom: 1px solid var(--bw-line); white-space: nowrap; }
.bec-ht tr:last-child td { border-bottom: 0; }
.bec-amt { font-variant-numeric: tabular-nums; text-align: right; }
.bec-dt { color: var(--bw-ink2); font-variant-numeric: tabular-nums; }
.bec-merch { font-variant-numeric: tabular-nums; color: var(--bw-ink2); }
.bec-type { font: 600 10.5px/1 var(--bw-f); }
.bec-ap { font: 600 9.5px/1 var(--bw-f); color: var(--bw-red); background: var(--bw-red-dim); border-radius: 4px; padding: 2px 5px; margin-left: 5px; }
.bec-ht tr.is-ours td { background: var(--bw-hi-dim); }
.bec-merch.is-ours { color: var(--bw-hi); font-weight: 600; }
.bec-our { font: 600 9px/1 var(--bw-f); letter-spacing: .04em; text-transform: uppercase; margin-left: 5px; color: var(--bw-hi); background: var(--bw-hi-dim); border-radius: 4px; padding: 2px 5px; }

/* Кнопка ручной проверки в окне + спиннер (крутящийся круг, как везде). */
.bec-refresh {
  font: 600 11.5px/1 var(--bw-f); color: var(--bw-hi); background: var(--bw-hi-dim);
  border: 0; border-radius: 6px; padding: 6px 10px; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
}
.bec-refresh:hover { filter: brightness(1.1); }
.bec-refresh.is-busy { opacity: .75; cursor: default; }
.bec-spin {
  width: 12px; height: 12px; border: 2px solid var(--bw-line2);
  border-top-color: var(--bw-hi); border-radius: 50%;
  animation: bw-spin .8s linear infinite; display: inline-block;
}

/* ============================================================
   Вкладка Detecto в окне внешней проверки (28.08.2026)
   externalCheck/det.js + externalCheck/bee.js

   Новых токенов нет: всё от `--bw-*`, уже объявленных на `.bec-overlay`.
   `--drep-*` переназначаются на них же — ради этого у панели разбора чека и
   заведён свой корень.
   ============================================================ */

/* ---- СКРОЛЛЫ: у каждого блока свой, невидимый -------------------------
   Раньше прокручивалось ВСЁ тело окна: раскрыл досье в левой колонке — уехали
   и шапка контрагента, и правая колонка с реестром. Теперь наружная прокрутка
   выключена, а прокручиваются ленты внутри секций: соседний блок стоит на
   месте, шапка с вердиктом не уезжает никогда.

   Полосы скрыты (`scrollbar-width: none` + webkit), как и везде в портале.

   ВСЁ ЭТО — ТОЛЬКО ПОД `.bec-scroll--det`. У BybitEye своя раскладка (ряд
   карточек плюс широкая таблица «Общих» под ним), и она прокручивается телом
   целиком, как и прокручивалась. Сними область действия — и таблица истории
   окажется в окне без прокрутки, то есть обрезанной. Модификатор ставит
   оправа, а не `:has()`: класс на самом узле детерминирован и виден в разметке.

   Направление КОЛОНКОЙ обязательно. Со строчным флексом тело получает ширину
   по содержимому, а не по окну: на узком экране `.bec-body` вылезала за правый
   край на сотню пикселей (замерено). `min-width: 0` там же — без него
   флекс-ребёнок не сжимается ниже min-content. */
.bec-scroll--det { overflow: hidden; display: flex; flex-direction: column; }
.bec-scroll--det .bec-body { flex: 1; min-height: 0; min-width: 0; }
.bec-scroll--det .bec-id, .bec-scroll--det .bec-sub { flex: none; }

/* Ряд секций — сетка во всю оставшуюся высоту. `auto-fit` нужен ради
   одинокой секции: когда записей реестра нет, «Проверенные значения»
   занимают ряд целиком, а не половину с пустотой справа. */
.bec-scroll--det .bec-flow {
  flex: 1; min-height: 0; display: grid; gap: 10px; align-items: stretch;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
}
.bec-scroll--det .bec-flow > .bec-sec { min-width: 0; }
.bec-scroll--det .bec-sec { display: flex; flex-direction: column; min-height: 0; }
.bec-scroll--det .bec-sh { flex: none; }
.bec-scroll--det .bec-sb { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: none; }
.bec-scroll--det .bec-sb::-webkit-scrollbar { display: none; }

/* Лента чеков — своя прокрутка по той же причине: раскрытый разбор длиннее
   окна, и без неё он таскал бы за собой шапку контрагента. */
.bec-docs { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: none; padding-right: 1px; }
.bec-docs::-webkit-scrollbar { display: none; }
.bec-docs__load { padding: 0 2px 8px; }

/* Узкий экран: колонки встают в одну, и держать каждую на своей прокрутке
   бессмысленно — высоты не хватает обеим. Возвращаем прокрутку телу целиком. */
@media (max-width: 760px) {
  /* Шапка в один ряд не помещается: название, возраст данных, две вкладки,
     «Проверить заново» и крестик. Переносим её в две строки, а не ужимаем —
     ужатый крестик первым уезжает за край, и окно нечем закрыть. */
  .bec-head { flex-wrap: wrap; }
  /* Порядок НЕ переставляем: строка складывается сама, а перестановка через
     `order` разводит элементы по разным строкам непредсказуемо — крестик
     однажды встал в середину первой строки. `margin-left: auto` у вкладок
     снимаем (он прижимал их вправо и ломал перенос), а крестику даём — он
     обязан оказаться в конце СВОЕЙ строки, какой бы она ни получилась. */
  .bec-tabs { margin-left: 0; }
  .bec-x { margin-left: auto; }

  .bec-scroll--det { overflow-y: auto; }
  .bec-scroll--det .bec-flow { display: flex; flex-direction: column; }
  .bec-scroll--det .bec-sb, .bec-docs { overflow: visible; }
  .bec-scroll--det .bec-sec,
  .bec-scroll--det .bec-flow,
  .bec-scroll--det .bec-body { min-height: auto; flex: none; }
}

/* ---- Переключатель ИСТОЧНИКОВ в шапке --------------------------------- */
/* Заменяет .bec-src + .bec-srcsoon («Detecto — позже»). Пилюля: активная
   вкладка поднята подложкой, спящая — только текст. */
.bec-tabs {
  margin-left: auto; display: inline-flex; gap: 2px; padding: 2px;
  background: var(--bw-surf2); border: 1px solid var(--bw-line); border-radius: 8px;
}
.bec-tab {
  display: inline-flex; align-items: center; gap: 5px;
  font: 600 11.5px/1 var(--bw-f); color: var(--bw-ink3);
  background: transparent; border: 0; border-radius: 6px;
  padding: 5px 9px; cursor: pointer; white-space: nowrap;
}
.bec-tab svg { width: 13px; height: 13px; }
.bec-tab:hover { color: var(--bw-ink2); }
.bec-tab.is-on { color: var(--bw-ink); background: var(--bw-surf3); }
.bec-tab.is-on.is-bee { color: var(--bw-hi); }
.bec-tab.is-on.is-det { color: var(--bw-blue); }
/* Точка тревоги на СПЯЩЕЙ вкладке: у второго источника находка, а оператор
   смотрит на первый. Без неё переключаться было бы не за чем. */
.bec-tab__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--bw-red); }

/* Знак источника. Зелёный градиент занят глазом BybitEye — Detecto синий:
   два источника не имеют права выглядеть одинаково. */
.bec-brand.is-det { background: linear-gradient(150deg, #5b8cff, #3560d8); }

/* ---- Под-вкладки ВНУТРИ Detecto --------------------------------------- */
/* Намеренно НЕ пилюля: в шапке уже пилюля источников, и второй такой же ряд
   читался бы как один уровень. Здесь подчёркивание — «раздел внутри». */
.bec-sub {
  display: flex; align-items: center; gap: 20px;
  border-bottom: 1px solid var(--bw-line); padding: 0 2px;
}
.bec-subBtn {
  position: relative; display: inline-flex; align-items: center; gap: 7px;
  background: none; border: 0; padding: 9px 0 10px; cursor: pointer;
  font: 600 12px/1 var(--bw-f); color: var(--bw-ink3);
}
.bec-subBtn:hover { color: var(--bw-ink2); }
.bec-subBtn.is-on { color: var(--bw-ink); }
.bec-subBtn.is-on::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px;
  height: 2px; background: var(--bw-blue); border-radius: 2px;
}
.bec-subBtn__n {
  font: 600 10px/1 var(--bw-f); color: var(--bw-ink3);
  background: var(--bw-surf2); border-radius: 20px; padding: 3px 7px;
}
.bec-subBtn.is-alarm .bec-subBtn__n { color: var(--bw-red); background: var(--bw-red-dim); }

/* ---- Недостающие тона вердикта ---------------------------------------- */
/* У BybitEye вердикт двоичный, у Detecto шесть состояний, и три из них — не
   «да» и не «нет». Молчание источника обязано отличаться от чистоты. */
.bec-vic.is-warn { background: var(--bw-amber); }
.bec-vic.is-wait { background: var(--bw-blue); }
.bec-vic.is-none { background: var(--bw-surf3); color: var(--bw-ink2); }
.bec-vbar.is-warn .bec-vbar__t { color: var(--bw-amber); }
.bec-vbar.is-wait .bec-vbar__t { color: var(--bw-blue); }
.bec-vbar.is-none .bec-vbar__t { color: var(--bw-ink2); }
.bec-chip.is-warn { color: var(--bw-amber); background: var(--bw-amber-dim); }
.bec-chip.is-wait { color: var(--bw-blue); background: var(--bw-blue-dim); }
/* «Не спрашивали» / «выключен» — ПУНКТИР, а не заливка: у базового .bec-chip
   подложка ровно цвета строки значения, и залитый чип на ней пропадал.
   Пропавший чип читается как отсутствие тревоги — самое дорогое
   недоразумение окна: непроверенное обязано выглядеть НЕ как чистое. */
.bec-chip.is-none {
  color: var(--bw-ink3); background: transparent;
  border: 1px dashed var(--bw-line2); height: 20px; padding: 0 6px;
}

/* Оговорка под вердиктом: «проверено не всё» и «не спрашивали» без слов
   читаются как «ничего страшного». */
.bec-vnote { padding: 0 12px 10px; font: 400 11.5px/1.45 var(--bw-f); color: var(--bw-ink2); }
.bec-vnote b { color: var(--bw-ink); font-weight: 600; }

/* ---- ОТВЕТ ИСТОЧНИКА — рядом с UID, нашей вёрсткой -------------------- */
/* Раньше он лежал `<pre>`-свалкой в самом низу. Это ошибка приоритета: наш
   разбор берёт лишь то, на что заведены поля, а решает человек — и решает
   как раз по ответу. Тот же вывод уже сделан для чеков (`drep-sec--raw`).
   Поэтому: сверху наша вёрстка, дословный текст — в один щелчок рядом.
   Отдельных секций «Что понял разбор» и «Первоисточники» больше нет —
   это были те же данные вторым показом. */
.bec-ans { border-top: 1px solid var(--bw-line); padding: 10px 12px 12px; }
.bec-ans__cap {
  display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px;
  font: 600 10.5px/1 var(--bw-f); letter-spacing: .08em; text-transform: uppercase;
  color: var(--bw-ink3);
}
.bec-ans__line {
  font: 500 11.5px/1.3 var(--bw-f); letter-spacing: 0; text-transform: none;
  color: var(--bw-ink2); min-width: 0; flex: 1;
}
.bec-ans__raw {
  margin-left: auto; flex: none; font: 600 10.5px/1 var(--bw-f); letter-spacing: 0;
  text-transform: none; color: var(--bw-ink3); background: var(--bw-surf2);
  border: 1px solid var(--bw-line2); border-radius: 6px; padding: 4px 8px; cursor: pointer;
}
.bec-ans__raw:hover { color: var(--bw-ink); }
.bec-ans__raw.is-on { color: var(--bw-blue); border-color: var(--bw-blue); }
.bec-ans__m { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 9px; }
.bec-ans__mi {
  display: flex; align-items: baseline; gap: 6px; background: var(--bw-surf2);
  border: 1px solid var(--bw-line); border-radius: 7px; padding: 5px 9px;
}
.bec-ans__mv { font: 700 13px/1 var(--font-heading, var(--bw-f)); font-variant-numeric: tabular-nums; }
.bec-ans__mk { font: 400 10.5px/1 var(--bw-f); color: var(--bw-ink3); }

/* Цитата обвинения. Полоса слева, а не подложка: подложек в окне уже
   достаточно, а полоса отделяет ЧУЖИЕ слова от наших. */
.bec-q + .bec-q { margin-top: 8px; }
.bec-q { border-left: 2px solid var(--bw-red); padding-left: 10px; }
.bec-q__h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 3px; }
.bec-q__who { font: 600 11.5px/1 var(--bw-f); }
.bec-q__at { font: 500 10px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-q__pl {
  font: 500 9.5px/1 var(--bw-f); letter-spacing: .04em; text-transform: uppercase;
  color: var(--bw-ink3); border: 1px solid var(--bw-line2); border-radius: 4px; padding: 2px 5px;
}
.bec-q__t { font: 400 12.5px/1.45 var(--bw-f); }
/* Лента цитат — со своей прокруткой и потолком. Иначе «показать все N»
   раздувает шапку контрагента и выдавливает секции за нижний край: у частого
   контрагента цитат под десяток. С потолком геометрия окна не меняется вовсе,
   а список просто становится прокручиваемым. */
.bec-ans__q { max-height: 186px; overflow-y: auto; scrollbar-width: none; }
.bec-ans__q::-webkit-scrollbar { display: none; }
.bec-ans__more {
  margin-top: 8px; font: 600 11px/1 var(--bw-f); color: var(--bw-ink2);
  background: var(--bw-surf2); border: 1px solid var(--bw-line2); border-radius: 6px;
  padding: 6px 10px; cursor: pointer;
}
.bec-ans__more:hover { color: var(--bw-ink); border-color: var(--bw-blue); }

/* ---- «Проверенные значения» ------------------------------------------- */
.bec-val + .bec-val { margin-top: 6px; }
.bec-val {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  border-radius: 7px; border: 1px solid var(--bw-line);
  background: var(--bw-surf2); padding: 7px 9px;
}
.bec-val.is-bad { background: var(--bw-red-dim); }
.bec-val__k {
  font: 500 10px/1 var(--bw-f); color: var(--bw-ink3);
  border: 1px solid var(--bw-line2); border-radius: 5px; padding: 3px 6px; white-space: nowrap;
}
/* Само значение — КНОПКА: по номеру открывается досье. Выглядит как текст с
   пунктиром снизу, а не как кнопка: строка остаётся строкой. */
.bec-val__v {
  font: 600 12.5px/1 var(--bw-f); font-variant-numeric: tabular-nums;
  color: var(--bw-ink); background: none; border: 0; padding: 0; text-align: left;
}
.bec-val__v[data-dossier] { cursor: pointer; border-bottom: 1px dashed var(--bw-line2); }
.bec-val__v[data-dossier]:hover { color: var(--bw-blue); border-bottom-color: var(--bw-blue); }
.bec-val__o { font: 400 10.5px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-val .bec-chip { margin-left: auto; }
.bec-val__at { flex-basis: 100%; font: 500 10px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-val__at:empty { display: none; }

/* Досье раскрывается ПОД строкой номера. Отдельным слоем не делаем: это
   продолжение строки, а не самостоятельное окно. */
.bec-dos {
  flex-basis: 100%; margin-top: 8px; padding-top: 8px;
  border-top: 1px solid var(--bw-line2);
}
.bec-dos__cap {
  display: flex; align-items: center; gap: 8px; margin-bottom: 7px;
  font: 600 10px/1 var(--bw-f); letter-spacing: .08em; text-transform: uppercase; color: var(--bw-ink3);
}
.bec-dos__cap button {
  margin-left: auto; font: 600 10px/1 var(--bw-f); letter-spacing: 0; text-transform: none;
  color: var(--bw-ink3); background: var(--bw-surf3); border: 0; border-radius: 5px;
  padding: 4px 7px; cursor: pointer;
}
.bec-dos__cap button.is-on { color: var(--bw-blue); }
.bec-dos__grp { font: 600 11px/1 var(--bw-f); color: var(--bw-ink2); margin: 9px 0 4px; }
.bec-dos__grp:first-child { margin-top: 0; }

/* ---- Записи реестра ---------------------------------------------------- */
/* Реестр — НАША вечная память, он главнее ответа источника, поэтому своя
   секция, а не строка внутри значения. Оспоренная запись гаснет, но остаётся:
   удалять записи нельзя. */
.bec-mark + .bec-mark { margin-top: 5px; }
.bec-mark { border-radius: 7px; border: 1px solid var(--bw-line); background: var(--bw-red-dim); padding: 6px 8px 7px; }
.bec-mark.is-off { background: var(--bw-surf2); opacity: .72; }
/* Шапка записи НЕ переносится: значение · источник · ×N — слева, дата и
   «оспорить» — справа. Перенос ронял бы кнопку на свою строку, а именно от
   этого запись и раздувалась. Длинное имя источника ужимается многоточием. */
.bec-mark__h { display: flex; align-items: center; gap: 7px; min-width: 0; }
.bec-mark__v { font: 600 12px/1 var(--bw-f); font-variant-numeric: tabular-nums; flex: none; }
.bec-mark__src {
  font: 500 10.5px/1 var(--bw-f); color: var(--bw-ink2);
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.bec-mark__n { flex: none; font: 600 9.5px/1 var(--bw-f); color: var(--bw-ink3); background: var(--bw-surf2); border-radius: 20px; padding: 2px 6px; }
.bec-mark__at { margin-left: auto; flex: none; font: 500 10px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-mark__q { margin-top: 5px; font: 400 11.5px/1.4 var(--bw-f); color: var(--bw-red); }
.bec-mark.is-off .bec-mark__q { color: var(--bw-ink2); text-decoration: line-through; }
.bec-mark__d { margin-top: 3px; font: 400 10px/1.35 var(--bw-f); color: var(--bw-ink3); }
/* Кнопка стоит В ШАПКЕ и мерится по надписи: строкой во всю ширину она
   выглядела как главное действие карточки, хотя оспаривание — редкий разбор.
   Обводка без заливки: заливка на красной подложке спорит с цитатой. */
.bec-mark__act {
  flex: none; font: 600 10px/1 var(--bw-f); color: var(--bw-ink3);
  background: transparent; border: 1px solid var(--bw-line2); border-radius: 5px;
  padding: 4px 7px; cursor: pointer; white-space: nowrap;
}
.bec-mark__act:hover { color: var(--bw-ink); border-color: var(--bw-blue); }
.bec-mark__act.is-on { color: var(--bw-blue); border-color: var(--bw-blue); }
/* «Проверить» у значения без ответа — единственная кнопка списка, которая что-то
   МЕНЯЕТ (платный вопрос источнику): акцент, а не серая рамка. */
.bec-mark__act--ask { color: var(--bw-blue); border-color: var(--bw-blue-soft); }
.bec-mark__act--ask:hover { color: var(--bw-blue); background: var(--bw-blue-dim); }

/* Форма оспаривания — ЗДЕСЬ, а не в отдельном окне (решение владельца).
   Черновик обязан жить в замыкании: догон снимка перерисует форму. */
.bec-form { margin-top: 8px; }
.bec-form textarea {
  width: 100%; min-height: 62px; resize: vertical; box-sizing: border-box;
  font: 400 12px/1.45 var(--bw-f); color: var(--bw-ink);
  background: var(--bw-bg); border: 1px solid var(--bw-line2); border-radius: 7px; padding: 8px 9px;
}
.bec-form textarea:focus { outline: 2px solid var(--bw-blue); outline-offset: -1px; }
.bec-form__row { display: flex; align-items: center; gap: 8px; margin-top: 7px; }
.bec-form__hint { font: 400 10.5px/1.3 var(--bw-f); color: var(--bw-ink3); }
.bec-form__send {
  margin-left: auto; font: 600 11px/1 var(--bw-f); color: var(--bw-hi);
  background: var(--bw-hi-dim); border: 0; border-radius: 6px; padding: 7px 11px; cursor: pointer;
}
.bec-form__err {
  margin-top: 6px; font: 500 11px/1.4 var(--bw-f); color: var(--bw-red);
}
.bec-form__cancel {
  font: 600 11px/1 var(--bw-f); color: var(--bw-ink3);
  background: none; border: 0; padding: 7px 4px; cursor: pointer;
}

/* ---- Под-вкладка «Чеки» ------------------------------------------------ */
/* Показываем ТОЛЬКО разбор — сам файл живёт в просмотрщике вложений чата.
   Карточка свёрнута до строки: у ордера бывает до трёх чеков, и три
   развёрнутые панели — это экран без начала и конца. */
.bec-doc + .bec-doc { margin-top: 8px; }
.bec-doc { border: 1px solid var(--bw-line); border-radius: 9px; overflow: hidden; background: var(--bw-surf); }
/* Строка чека — НЕ кнопка целиком: рядом с раскрытием живёт «Открыть чек»,
   а кнопка внутри кнопки — невалидная разметка и съеденный клик. */
.bec-doc__h { display: flex; align-items: center; gap: 8px; padding-right: 10px; }
.bec-doc__toggle {
  display: flex; align-items: center; gap: 9px; flex: 1; min-width: 0; text-align: left;
  background: none; border: 0; padding: 10px 11px; cursor: pointer; color: inherit;
}
.bec-doc__toggle:hover { background: var(--bw-surf2); }
/* Кнопка есть ВСЕГДА, даже у свёрнутой строки: посмотреть сам чек нужно
   чаще, чем читать разбор целиком. Выключенная — когда сообщения нет в
   загруженной части переписки; молчать нельзя, иначе выглядит поломкой. */
.bec-doc__open {
  flex: none; display: inline-flex; align-items: center; gap: 5px;
  font: 600 10.5px/1 var(--bw-f); color: var(--bw-ink2);
  background: var(--bw-surf2); border: 1px solid var(--bw-line2); border-radius: 6px;
  padding: 6px 9px; cursor: pointer; white-space: nowrap;
}
.bec-doc__open:hover { color: var(--bw-ink); border-color: var(--bw-blue); }
.bec-doc__open[disabled] { opacity: .45; cursor: default; }
.bec-doc__open svg { width: 12px; height: 12px; }

/* Подвал панели разбора: он уходит в `docReportHtml({footer})` — снаружи
   панели кнопки остались бы без её фона и повисли отдельным куском. */
.bec-docFoot { display: flex; align-items: center; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.bec-docFoot button {
  font: 600 11px/1 var(--bw-f); color: var(--bw-ink2);
  background: var(--bw-surf2); border: 1px solid var(--bw-line2); border-radius: 6px;
  padding: 7px 11px; cursor: pointer;
}
.bec-docFoot button:hover { color: var(--bw-ink); }
.bec-docFoot .is-primary { color: var(--bw-blue); border-color: var(--bw-blue); }
.bec-docFoot__note { font: 400 10.5px/1.3 var(--bw-f); color: var(--bw-ink3); }
.bec-doc__dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--bw-ink3); }
.bec-doc--ok .bec-doc__dot { background: var(--bw-hi); }
.bec-doc--bad .bec-doc__dot { background: var(--bw-red); }
.bec-doc--warn .bec-doc__dot { background: var(--bw-amber); }
.bec-doc__t { font: 600 12.5px/1.3 var(--bw-f); min-width: 0; }
.bec-doc--bad .bec-doc__t { color: var(--bw-red); }
.bec-doc__meta { font: 400 11px/1.3 var(--bw-f); color: var(--bw-ink3); }
.bec-doc__at { margin-left: auto; flex: none; font: 500 10.5px/1 var(--bw-f); color: var(--bw-ink3); }
.bec-doc__caret { flex: none; color: var(--bw-ink3); font-size: 12px; }
.bec-doc__body { padding: 0 11px 11px; }

/* Панель разбора живёт в трёх хозяевах и красит себя от ГЛОБАЛЬНЫХ токенов
   темы. Внутри этого окна их надо переназначить на `--bw-*`, иначе панель
   встанет чужой по цвету заплаткой поверх окна ордера. Переназначение
   штатное — ради него у `.drep` и заведён свой корень. */
.bec-scroll .drep {
  --drep-fg: var(--bw-ink); --drep-mut: var(--bw-ink2); --drep-dim: var(--bw-ink3);
  --drep-bg: var(--bw-surf); --drep-inset: var(--bw-surf2); --drep-line: var(--bw-line);
  --drep-ok: var(--bw-hi); --drep-bad: var(--bw-red); --drep-warn: var(--bw-amber);
  --drep-bad-fg: var(--bw-red); --drep-warn-fg: var(--bw-amber);
}

/* ---- Общее ------------------------------------------------------------- */
.bec-pre {
  margin: 6px 0 0; padding: 10px 11px; white-space: pre-wrap; word-break: break-word;
  font: 400 11.5px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: var(--bw-ink2); background: var(--bw-surf2);
  border: 1px solid var(--bw-line); border-radius: 7px; max-height: 340px; overflow: auto;
  scrollbar-width: none;
}
.bec-pre::-webkit-scrollbar { display: none; }
.bec-note { font: 400 11.5px/1.5 var(--bw-f); color: var(--bw-ink3); font-style: italic; }
.bec-note--warn { color: var(--bw-amber); font-style: normal; margin-top: 6px; }
.bec-kv { display: flex; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--bw-line); font: 400 12px/1.4 var(--bw-f); }
.bec-kv:last-child { border-bottom: 0; }
.bec-kv > span { flex: none; width: 150px; color: var(--bw-ink3); }
.bec-kv > b { font-weight: 600; min-width: 0; word-break: break-word; }