/* Колонка разбора чека окна документов (`js/ui/detecto/receiptReview.js`).
 *
 * Эталон вида — `docs/design/receipt-window-mockup.html` (правая колонка),
 * согласован владельцем 26–27.09.2026. Свой корень токенов `.rrv`, всё — от
 * ГЛОБАЛЬНЫХ токенов темы (`--text`, `--muted`, `--page-bg-2`, `--primary`,
 * `--border`), как у `detecto-doc.css`: колонка живёт в окне просмотрщика, и
 * чужие переменные дали бы невидимый текст в одной из тем.
 *
 * Моноширинного шрифта нет намеренно — ровные колонки цифр даёт
 * `tabular-nums` (решение проекта, см. `detecto-doc.css`).
 *
 * Разбор — БЕЗ прокрутки (владелец): плотность как в макете, провалов строками
 * не больше четырёх, прокручивается только прежний разбор бота и дословный
 * ответ. */

.rrv {
  --rrv-tx: var(--text);
  --rrv-mut: var(--muted);
  --rrv-dim: color-mix(in srgb, var(--text) 42%, transparent);
  --rrv-s1: var(--page-bg-2);
  --rrv-s2: color-mix(in srgb, var(--text) 4%, var(--page-bg-2));
  --rrv-s3: color-mix(in srgb, var(--text) 8%, var(--page-bg-2));
  --rrv-hair: color-mix(in srgb, var(--text) 8%, transparent);
  --rrv-hair2: color-mix(in srgb, var(--text) 13%, transparent);
  --rrv-hov: color-mix(in srgb, var(--text) 7%, transparent);
  --rrv-sel: color-mix(in srgb, var(--text) 22%, transparent);
  --rrv-hi: rgba(255, 255, 255, 0.06);
  --rrv-border: var(--border);

  --rrv-ok: var(--primary);
  --rrv-okA: color-mix(in srgb, var(--primary) 14%, transparent);
  --rrv-own: #86b4ff;
  --rrv-ownA: rgba(134, 180, 255, 0.14);
  --rrv-warn: #f0b54d;
  --rrv-warnA: rgba(240, 181, 77, 0.14);
  --rrv-bad: #ff6b63;
  --rrv-badA: rgba(255, 107, 99, 0.14);
  --rrv-warnTx: #ffe2ad;
  --rrv-badTx: #ffd3d0;
  --rrv-skel: color-mix(in srgb, var(--text) 6%, transparent);
  --rrv-skel2: color-mix(in srgb, var(--text) 12%, transparent);
  --rrv-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  /* Дословный ответ — моноширинно: общего токена моноширинного шрифта у сайта нет. */
  --rrv-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, "Liberation Mono", monospace;

  display: grid;
  /* строки чекеров · компактный итог со шкалой и сверкой · вкладки · разбор · повтор */
  grid-template-rows: auto minmax(0, auto) auto minmax(100px, 1fr) auto;
  /* Подсказка новичку (`.rrv-tip`) встаёт поверх колонки от её угла. */
  position: relative;
  /* Колонка — ровно ширина окна. Без этого неявный столбец сетки был `auto`
     и растягивался до min-content самого широкого ребёнка (строка статуса
     операции с nowrap-подписями — 459 px), и на телефоне 412 px вся колонка
     уезжала за правый край: плашки «ПРОШЁЛ», время и счёт секций обрезались
     (снимки владельца 27.09.2026). Сторож `receipt_review_mobile`. */
  grid-template-columns: minmax(0, 1fr);
  height: 100%;
  min-width: 0;
  min-height: 0;
  color: var(--rrv-tx);
  background: var(--rrv-s1);
  font: 14px/1.55 var(--font-ui);
  font-variant-numeric: tabular-nums;
  /* Раскладку решает своя ширина: границу «документ | разбор» тянут. */
  container: rrv / inline-size;
  /* Всё внутри пишет третья сторона: длинная строка без пробелов не распирает колонку. */
  overflow-wrap: anywhere;
}

/* Светлая тема портала: акценты темнее, иначе на молочном фоне 2–3:1. */
[data-theme="light"] .rrv {
  --rrv-hi: rgba(255, 255, 255, 0.9);
  --rrv-ok: #139a55;
  --rrv-okA: rgba(19, 154, 85, 0.12);
  --rrv-own: #2f6fd8;
  --rrv-ownA: rgba(47, 111, 216, 0.11);
  --rrv-warn: #b7791f;
  --rrv-warnA: rgba(214, 145, 40, 0.14);
  --rrv-bad: #d23b33;
  --rrv-badA: rgba(210, 59, 51, 0.1);
  --rrv-warnTx: #7a4f0f;
  --rrv-badTx: #8f1f19;
}

/* `mobile.css` поднимает ВСЕМ кнопкам min-height 40px ради тач-целей; здесь
   кнопки мелкие и в строке. Отбиваем адресно и вне media — весом класса. */
.rrv button {
  min-height: 0;
  font-family: inherit;
}

.rrv b {
  font-weight: 600;
}

/* ---- повтор файла ----
   Полоса стоит МЕЖДУ разбором и нижним блоком: ответ приходит позже колонки,
   и место ей отдаёт растяжимая строка разбора — ни строки чекеров, ни вкладки,
   ни нижний блок не сдвигаются (приёмка плавности 27.09.2026). Появление —
   transform/opacity. */
.rrv-dup {
  margin: 6px 18px 0;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 8px 12px;
  border-radius: 11px;
  background: var(--rrv-badA);
  color: var(--rrv-badTx);
  font-size: 12.5px;
  animation: rrv-rowIn 0.5s var(--rrv-ease) both;
}
.rrv-dup svg {
  width: 15px;
  height: 15px;
  color: var(--rrv-bad);
}
.rrv-dup > span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-dup__go {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  background: var(--rrv-hov);
  color: var(--rrv-tx);
  font-size: 12px;
  cursor: pointer;
}

/* ---- «Итог платежа» (макет `payment-alert`, владелец 27.09.2026, «Без совета») ----
   Тревога стоит внутри общей сводки после карточек чекеров. Зелёный итог
   говорит строка статуса и полная таблица ниже; красное и жёлтое сохраняют
   свой заголовок, причины и прицел на документ.
   Появление — один раз (`rrv--shown` гасит въезд), блик и два кольца у
   красной — классом `is-alarm`, который колонка ставит ТОЛЬКО при переходе в
   красный и снимает таймером: перерисовка снимком их не перезапускает.
   Анимации — только transform/opacity/box-shadow. */
.rrv-payslot {
  padding: 6px 0 0;
  min-width: 0;
}
.rrv-payslot:empty {
  display: none;
}
.rrv-pay {
  --rrv-c: var(--rrv-ok);
  --rrv-cA: var(--rrv-okA);
  --rrv-cTx: var(--rrv-tx);
  position: relative;
  border-radius: 13px;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(180deg, color-mix(in srgb, var(--rrv-c) 10%, var(--rrv-s2)), var(--rrv-s2));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rrv-c) 35%, transparent);
  min-width: 0;
}
.rrv:not(.rrv--shown) .rrv-pay,
.rrv-pay.is-alarm {
  animation: rrv-payIn 0.5s var(--rrv-ease) both;
}
@keyframes rrv-payIn {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.rrv-pay--bad {
  --rrv-c: var(--rrv-bad);
  --rrv-cA: var(--rrv-badA);
  --rrv-cTx: var(--rrv-badTx);
}
.rrv-pay--warn {
  --rrv-c: var(--rrv-warn);
  --rrv-cA: var(--rrv-warnA);
  --rrv-cTx: var(--rrv-warnTx);
}
.rrv-pay--sk {
  --rrv-c: var(--rrv-dim);
}
/* Полоса слева и один бегущий блик у пришедшего красного. */
.rrv-pay::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--rrv-c);
}
.rrv-pay--bad::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(100deg, transparent 30%, color-mix(in srgb, var(--rrv-c) 22%, transparent) 50%, transparent 70%);
  transform: translateX(-100%);
}
.rrv-pay--bad.is-alarm::after {
  animation: rrv-paySweep 1.4s 0.25s var(--rrv-ease) 1 forwards;
}
@keyframes rrv-paySweep {
  to {
    transform: translateX(100%);
  }
}
.rrv-pay__hd {
  display: flex;
  align-items: center;
  gap: 10px;
  /* Высота шапки постоянная — у каркаса и у карточки одна (CLS 0). */
  box-sizing: border-box;
  height: 38px;
  padding: 0 10px 0 12px;
  min-width: 0;
}
.rrv-pay__mark {
  width: 24px;
  height: 24px;
  border-radius: 7px;
  display: grid;
  place-items: center;
  flex: none;
  background: var(--rrv-cA);
  color: var(--rrv-c);
}
.rrv-pay__mark svg {
  width: 16px;
  height: 16px;
}
.rrv-pay--bad.is-alarm .rrv-pay__mark {
  animation: rrv-payRing 1.6s 0.3s ease-out 2;
}
@keyframes rrv-payRing {
  0% {
    box-shadow: 0 0 0 0 color-mix(in srgb, var(--rrv-c) 45%, transparent);
  }
  100% {
    box-shadow: 0 0 0 10px transparent;
  }
}
.rrv-pay__tt {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
}
.rrv-pay__tt small {
  display: flex;
  align-items: center;
  gap: 6px;
  font: 600 9.5px var(--font-ui);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rrv-c);
}
.rrv-pay__tt b {
  display: block;
  font: 600 13px/1.25 var(--font-heading);
  color: var(--rrv-tx);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-pay__cnt {
  flex: none;
  font: 700 11px var(--font-ui);
  padding: 3px 8px;
  border-radius: 7px;
  background: var(--rrv-cA);
  color: var(--rrv-c);
}
/* Тело: одна высота у зелёной, жёлтой и красной с одной строкой. */
.rrv-pay__bd {
  min-height: 36px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-top: 1px solid color-mix(in srgb, var(--rrv-c) 18%, transparent);
  min-width: 0;
}
.rrv-pay--sk .rrv-pay__bd {
  padding: 0 14px 0 16px;
}
.rrv-pay__iss {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.rrv-pay__it {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  gap: 1px 12px;
  align-items: baseline;
  padding: 4px 10px 4px 12px;
  cursor: pointer;
  transition: background-color 0.2s;
  min-width: 0;
}
.rrv-pay__it.is-nopin,
.rrv-pay__it.is-nohit {
  cursor: default;
}
.rrv-pay__it + .rrv-pay__it {
  border-top: 1px dashed var(--rrv-hair2);
}
.rrv-pay__it:hover,
.rrv-pay__it.is-hov {
  background-color: var(--rrv-hov);
}
.rrv-pay__k {
  font-size: 12px;
  color: var(--rrv-mut);
}
.rrv-pay__v {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.rrv-pay__want,
.rrv-pay__got {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-pay__want {
  font-size: 12px;
  color: var(--rrv-dim);
}
.rrv-pay__got {
  font-size: 13px;
  font-weight: 600;
  color: var(--rrv-cTx);
}
.rrv-pay__want i,
.rrv-pay__got i {
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  color: var(--rrv-mut);
}
.rrv-pay__got mark {
  background: color-mix(in srgb, var(--rrv-c) 30%, transparent);
  color: inherit;
  border-radius: 3px;
  padding: 0 1px;
}
/* Источник и пояснение под значениями: длинное имя банка не сжимается
   боковым столбцом, слова другого чекера видны целиком. */
.rrv-pay__side {
  grid-column: 2;
  flex-wrap: wrap;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  align-self: center;
  min-width: 0;
}
.rrv-pay__who {
  display: flex;
  align-items: center;
  gap: 4px;
}
/* «прочитано:» перед D/O — метки о прочтении чека, не о том, кто сверял (27.09.2026). */
.rrv-pay__by {
  font-size: 10px;
  color: var(--rrv-dim);
  white-space: nowrap;
}
.rrv-pay__who i {
  font: 600 9.5px var(--font-ui);
  font-style: normal;
  padding: 2px 6px;
  border-radius: 5px;
  background: var(--rrv-hov);
  color: var(--rrv-mut);
}
.rrv-pay__who i.on {
  background: var(--rrv-cA);
  color: var(--rrv-c);
}
.rrv-pay__aim {
  max-width: 140px;
  font-size: 11px;
  color: var(--rrv-dim);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Чипы — ОДНОЙ строкой: тело карточки одной высоты у всех тонов; длинное
   значение режется многоточием (целиком — в подсказке и в таблице внизу). */
.rrv-pay__chips {
  display: flex;
  flex-wrap: nowrap;
  overflow: hidden;
  gap: 6px;
  padding: 6px 10px 6px 12px;
  min-width: 0;
}
.rrv-pay__chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  height: 24px;
  padding: 0 9px;
  border-radius: 7px;
  background: var(--rrv-hov);
  font-size: 12px;
  color: var(--rrv-mut);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
/* Места не хватает — первым ужимается реквизит (самый длинный), затем
   банк, потом прочие; ни один не исчезает совсем (min-width). */
.rrv-pay__chip {
  flex-shrink: 0;
}
.rrv-pay__chip[data-k="phone"] {
  flex-shrink: 4;
  min-width: 84px;
}
.rrv-pay__chip[data-k="bank"] {
  flex-shrink: 1;
  min-width: 60px;
}
.rrv-pay__chip::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--rrv-dim);
}
.rrv-pay__chip--ok::before {
  background: var(--rrv-ok);
}
.rrv-pay__chip--warn::before {
  background: var(--rrv-warn);
}
.rrv-pay__chip--bad::before {
  background: var(--rrv-bad);
}
.rrv-pay__chip b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
  color: var(--rrv-tx);
}
.rrv-pay__chip--off b {
  color: var(--rrv-mut);
}
.rrv-pay__why {
  padding: 4px 10px 6px 12px;
  font-size: 12px;
  color: var(--rrv-cTx);
  line-height: 1.4;
}
.rrv-pay__iss + .rrv-pay__chips {
  padding-top: 2px;
}

/* ---- подсказка новичку: «i» и всплывающая строка поверх колонки ----
   Раскрытие ничего не сдвигает: узел стоит абсолютно от угла колонки. На
   телефоне открывается нажатием (`title` там не виден). */
.rrv-i {
  position: relative;
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  padding: 0;
  margin: 0 0 0 5px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--rrv-mut);
  font: inherit;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  cursor: help;
  vertical-align: -0.18em;
  transition: color 150ms ease, background-color 150ms ease;
}
.rrv-i > svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; pointer-events: none; }
.rrv-i .rrv-i__dot { fill: currentColor; stroke: none; }
.rrv-i:focus-visible { outline: 2px solid var(--rrv-own); outline-offset: 2px; }
/* Цель касания шире значка — без роста самой кнопки. */
.rrv-i::before {
  content: "";
  position: absolute;
  inset: -7px;
}
.rrv-i:hover,
.rrv-i[aria-expanded="true"] {
  color: var(--rrv-tx);
  background-color: var(--rrv-s3);
}
.rrv-tip {
  position: absolute;
  z-index: 6;
  left: 8px;
  top: 8px;
  width: max-content;
  max-width: min(300px, calc(100% - 16px));
  padding: 8px 11px;
  border-radius: 10px;
  background: var(--rrv-s3);
  box-shadow: 0 0 0 1px var(--rrv-hair2), 0 10px 28px rgba(0, 0, 0, 0.28);
  color: var(--rrv-tx);
  font-size: 12.5px;
  line-height: 1.45;
  white-space: pre-line;
  pointer-events: none;
}
.rrv-tip[hidden] {
  display: none;
}
.rrv-tip.is-on {
  animation: rrv-tipIn 0.15s var(--rrv-ease) both;
}
@keyframes rrv-tipIn {
  from {
    opacity: 0;
    transform: translateY(-3px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
/* ---- строки чекеров ---- */
.rrv-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 18px 8px;
}
.rrv-rows:empty {
  display: none;
}
.rrv-row {
  --rrv-c: var(--rrv-dim);
  --rrv-glow: transparent;
  position: relative;
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 7px 12px;
  border-radius: 13px;
  background: var(--rrv-s2);
  box-shadow: inset 0 1px 0 var(--rrv-hi), 0 0 0 1px var(--rrv-hair);
  overflow: hidden;
  isolation: isolate;
  animation: rrv-rowIn 0.5s var(--rrv-ease) both;
  cursor: pointer;
  transition: box-shadow 0.2s;
  outline: none;
}
.rrv-row + .rrv-row {
  animation-delay: 0.08s;
}
.rrv-row:hover,
.rrv-row:focus-visible {
  box-shadow: inset 0 1px 0 var(--rrv-hi), 0 0 0 1px var(--rrv-hair2);
}
.rrv-row.is-sel {
  box-shadow: inset 0 1px 0 var(--rrv-hi), 0 0 0 1px var(--rrv-sel);
}
.rrv-row::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(90deg, transparent 55%, var(--rrv-glow) 100%);
}
.rrv-row--ok {
  --rrv-c: var(--rrv-ok);
  --rrv-glow: var(--rrv-okA);
}
.rrv-row--own {
  --rrv-c: var(--rrv-own);
  --rrv-glow: var(--rrv-ownA);
}
.rrv-row--warn {
  --rrv-c: var(--rrv-warn);
  --rrv-glow: var(--rrv-warnA);
}
.rrv-row--bad {
  --rrv-c: var(--rrv-bad);
  --rrv-glow: var(--rrv-badA);
}
.rrv-row--off {
  --rrv-c: var(--rrv-dim);
}

/* Вспышка рамки у пришедшего вердикта. Появление `rrv-rowIn` остаётся в
   списке ПЕРВЫМ: анимация с тем же именем переживает смену класса, а без него
   снятие `is-arrived` заново запускало появление — строка гасла и въезжала
   второй раз (приёмка плавности 27.09.2026). */
.rrv-row.is-arrived {
  animation: rrv-rowIn 0.5s var(--rrv-ease) both, rrv-arrive 1.2s var(--rrv-ease);
}
@keyframes rrv-arrive {
  0% {
    box-shadow: inset 0 1px 0 var(--rrv-hi), 0 0 0 1px var(--rrv-c), 0 0 0 0 var(--rrv-c);
  }
  40% {
    box-shadow: inset 0 1px 0 var(--rrv-hi), 0 0 0 1px var(--rrv-c), 0 0 0 6px transparent;
  }
  100% {
    box-shadow: inset 0 1px 0 var(--rrv-hi), 0 0 0 1px var(--rrv-hair);
  }
}
@keyframes rrv-rowIn {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* «Проверяется»: волна по строке и бегущая рамка. */
@property --rrv-angle {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}
.rrv-row--scan {
  --rrv-c: var(--rrv-ok);
  --rrv-glow: color-mix(in srgb, var(--rrv-ok) 18%, transparent);
}
.rrv-row--scan::after {
  background: linear-gradient(90deg, transparent 30%, var(--rrv-glow) 60%, transparent 90%);
  background-size: 220% 100%;
  animation: rrv-sweep 1.6s linear infinite;
}
.rrv-row--scan::before {
  --rrv-angle: 0deg;
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 14px;
  padding: 1px;
  z-index: 1;
  pointer-events: none;
  background: conic-gradient(from var(--rrv-angle), transparent 0 70%, var(--rrv-own) 82%, var(--rrv-ok) 90%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: rrv-beam 1.4s linear infinite;
}
@keyframes rrv-sweep {
  from {
    background-position: 120% 0;
  }
  to {
    background-position: -100% 0;
  }
}
@keyframes rrv-beam {
  to {
    --rrv-angle: 360deg;
  }
}
.rrv-spin {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid var(--rrv-okA);
  border-top-color: var(--rrv-ok);
  animation: rrv-rot 0.8s linear infinite;
}
@keyframes rrv-rot {
  to {
    transform: rotate(360deg);
  }
}
.rrv-shimmer {
  background: linear-gradient(90deg, var(--rrv-mut) 0 35%, var(--rrv-tx) 50%, var(--rrv-mut) 65% 100%);
  background-size: 250% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: rrv-sh 1.6s linear infinite;
}
@keyframes rrv-sh {
  from {
    background-position: 100% 0;
  }
  to {
    background-position: -50% 0;
  }
}

/* Значок строки с прорисовкой линии. */
.rrv-ico {
  width: 30px;
  height: 30px;
  color: var(--rrv-c);
}
.rrv-ico__bg {
  fill: currentColor;
  opacity: 0.15;
}
.rrv-ico__ln {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 26;
  stroke-dashoffset: 26;
  animation: rrv-draw 0.7s 0.2s var(--rrv-ease) forwards;
}
@keyframes rrv-draw {
  to {
    stroke-dashoffset: 0;
  }
}
.rrv-main {
  min-width: 0;
}
.rrv-name {
  display: flex;
  gap: 6px;
  align-items: center;
  font: 600 10px var(--font-ui);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rrv-dim);
}
.rrv-name > .rrv-i { margin: 0; }
.rrv-name small {
  letter-spacing: 0;
  text-transform: none;
  font: 400 11px var(--font-ui);
}
.rrv-say {
  margin-top: 3px;
  font: 600 15.5px/1.25 var(--font-heading);
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-sub {
  margin-top: 2px;
  color: var(--rrv-mut);
  font-size: 12.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}
.rrv-side time {
  font-size: 11px;
  color: var(--rrv-dim);
}
.rrv-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 9px;
  border-radius: 7px;
  font: 600 10.5px var(--font-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rrv-c, var(--rrv-mut));
  background: color-mix(in srgb, var(--rrv-c, var(--rrv-mut)) 14%, transparent);
  white-space: nowrap;
}
.rrv-act {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 28px;
  padding: 0 11px;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
  background: var(--rrv-hov);
  box-shadow: inset 0 0 0 1px var(--rrv-hair2);
  color: var(--rrv-tx);
  font: 500 12px var(--font-ui);
}
.rrv-act:hover {
  background: var(--rrv-s3);
}
.rrv-act small {
  color: var(--rrv-dim);
  font-size: 11px;
}

/* ---- вкладки ---- */
.rrv-tabs {
  margin: 0 18px;
  justify-self: start;
  display: flex;
  gap: 2px;
  flex-wrap: wrap;
  max-width: calc(100% - 36px);
}
.rrv-tabs:empty { display: none; }
.rrv-tab {
  height: 24px;
  min-height: 24px;
  padding: 0 7px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--rrv-mut);
  font: 500 12px var(--font-ui);
  cursor: pointer;
  white-space: nowrap;
  transition: color 160ms ease, background-color 160ms ease;
}
.rrv-tab:hover { color: var(--rrv-tx); background: var(--rrv-s2); }
.rrv-tab[aria-selected="true"] {
  color: var(--rrv-tx);
  background: var(--rrv-s3);
}
.rrv-tab:focus-visible { outline: 2px solid var(--rrv-own); outline-offset: 2px; }
.rrv-tab .rrv-cnt { min-width: 0; height: auto; padding: 0; margin-left: 4px; background: none; font-size: 10px; }
.rrv-tab .rrv-cnt.is-zero { display: none; }

/* ---- вкладки разбора ---- */
.rrv-panes {
  position: relative;
  min-height: 0;
}
/* Пересобираемые вкладки — в своей обёртке; «Заметки» — стойкий сосед. */
.rrv-panes__main {
  position: absolute;
  inset: 0;
}
/* Разбор задуман без прокрутки, но на низком окне (900×800) он не помещался и
   провал с «Дословным ответом» были недоступны: прокрутка — ВНУТРИ вкладки и
   только когда не помещается, тонкая; колонка целиком не прокручивается. */
.rrv-pane {
  position: absolute;
  inset: 0;
  padding: 10px 20px 8px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--rrv-hair2) transparent;
  opacity: 0;
  transform: translateY(6px);
  pointer-events: none;
  transition: opacity 0.25s var(--rrv-ease), transform 0.25s var(--rrv-ease);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.rrv-pane.is-on {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
/* Дословный ответ: прокрутка в обе стороны (длинные строки источника). */
.rrv-pane--scroll {
  overflow: auto;
  scrollbar-width: thin;
}
.rrv-expert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 16px;
  align-items: start;
}
.rrv-expert h4 {
  margin: 0;
  font: 600 15px/1.3 var(--font-heading);
  letter-spacing: -0.01em;
}
.rrv-expert p {
  margin: 0;
  grid-column: 1;
  color: var(--rrv-mut);
  font-size: 12.5px;
  line-height: 1.5;
}
.rrv-sev {
  grid-row: 1 / 3;
  grid-column: 2;
  align-self: start;
}
.rrv-sev--ok {
  --rrv-c: var(--rrv-ok);
}
.rrv-sev--warn {
  --rrv-c: var(--rrv-warn);
}
.rrv-sev--bad {
  --rrv-c: var(--rrv-bad);
}
.rrv-ident {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 12px;
  color: var(--rrv-mut);
  font-size: 12px;
}
.rrv-ident b {
  color: var(--rrv-tx);
  font-weight: 500;
}
.rrv-ident--inline { display: block; }
.rrv-ident__tail { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; vertical-align: baseline; }
.rrv-ident__tail .rrv-i { margin: 0; align-self: center; }
.rrv-ident code {
  font: 400 11px var(--font-ui);
  color: var(--rrv-dim);
}
.rrv-alert {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 7px 12px;
  border-radius: 10px;
  font-size: 12.5px;
  line-height: 1.45;
  background: var(--rrv-badA);
  color: var(--rrv-badTx);
}
.rrv-alert--warn {
  background: var(--rrv-warnA);
  color: var(--rrv-warnTx);
}
.rrv-alert svg {
  flex: none;
  width: 15px;
  height: 15px;
  margin-top: 1px;
}
.rrv-secs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 18px;
}
.rrv-sec {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  height: 21px;
  font-size: 12.5px;
  color: var(--rrv-mut);
  min-width: 0;
}
.rrv-sec__t {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-sec i {
  font-size: 11px;
  color: var(--rrv-dim);
  font-style: normal;
}
.rrv-sec__m {
  width: 16px;
  height: 16px;
  border-radius: 5px;
  display: grid;
  place-items: center;
  background: var(--rrv-hov);
  color: var(--rrv-dim);
}
.rrv-sec__m svg {
  width: 10px;
  height: 10px;
}
.rrv-sec--ok .rrv-sec__m {
  background: var(--rrv-okA);
  color: var(--rrv-ok);
}
.rrv-sec--warn .rrv-sec__m {
  background: var(--rrv-warnA);
  color: var(--rrv-warn);
}
.rrv-sec--bad .rrv-sec__m {
  background: var(--rrv-badA);
  color: var(--rrv-bad);
}
.rrv-sec--warn .rrv-sec__t,
.rrv-sec--bad .rrv-sec__t {
  color: var(--rrv-tx);
}
.rrv-fails {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.rrv-fail {
  border-radius: 9px;
  background: var(--rrv-s2);
  box-shadow: inset 0 0 0 1px var(--rrv-hair);
  padding: 0 12px;
  height: 32px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  font-size: 12.5px;
  white-space: nowrap;
  cursor: pointer;
  transition: box-shadow 0.2s, background-color 0.2s;
}
.rrv-fail:hover,
.rrv-fail.is-on {
  box-shadow: inset 0 0 0 1px var(--rrv-sel);
  background: var(--rrv-s3);
}
.rrv-fail__txt {
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-fail b {
  font-weight: 500;
}
.rrv-cmp {
  color: var(--rrv-dim);
}
.rrv-cmp em {
  font-style: normal;
  color: var(--rrv-tx);
  font-size: 11.5px;
}
.rrv-fail__tag {
  font: 500 10px var(--font-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.rrv-fail--bad .rrv-fail__tag {
  color: var(--rrv-bad);
}
.rrv-fail--warn .rrv-fail__tag {
  color: var(--rrv-warn);
}
.rrv-pin {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  color: var(--rrv-dim);
}
.rrv-pin svg {
  width: 13px;
  height: 13px;
}
/* Прицела нет: место на чеке не показать (замечание про файл целиком, текст
   не нашёлся на документе, просмотрщик подсвечивать не умеет). Ячейку держим. */
.rrv-fail.is-nopin .rrv-pin,
.rrv-fail.is-nohit .rrv-pin,
.rrv--nohl .rrv-pin {
  visibility: hidden;
}
.rrv-fail.is-nopin {
  cursor: default;
}
.rrv-more {
  color: var(--rrv-dim);
  font-size: 11.5px;
  padding-left: 12px;
}
.rrv-foot {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--rrv-dim);
  font-size: 11.5px;
}
.rrv-foot__hist {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-foot__acts {
  display: flex;
  gap: 12px;
  flex: none;
}
.rrv-link {
  padding: 0;
  border: 0;
  background: none;
  color: var(--rrv-mut);
  font: inherit;
  cursor: pointer;
  border-bottom: 1px dashed var(--rrv-hair2);
}
.rrv-link:hover {
  color: var(--rrv-tx);
}
.rrv-raw {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}
.rrv-raw pre {
  margin: 0;
  width: 100%;
  white-space: pre-wrap;
  font: 12px/1.5 var(--rrv-mono);
  color: var(--rrv-mut);
}
.rrv-note {
  border-radius: 12px;
  padding: 16px;
  background: var(--rrv-s2);
  box-shadow: inset 0 0 0 1px var(--rrv-hair);
  color: var(--rrv-mut);
  font-size: 13px;
}
.rrv-note b {
  display: block;
  color: var(--rrv-tx);
  font: 600 15px var(--font-heading);
  margin-bottom: 6px;
}
/* ---- ответ Detecto без разбора сайта (бот, старые строки): тот же новый вид ----
   Прежней панели `.drep` в колонке нет (владелец 27.09.2026). Итог — цветом
   уровня, обоснование — до двух строк (целиком — в подсказке и «дословно»). */
.rrv-expert--ok h4 {
  color: var(--rrv-ok);
}
.rrv-expert--warn h4 {
  color: var(--rrv-warn);
}
.rrv-expert--bad h4 {
  color: var(--rrv-bad);
}
.rrv-expert__why {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}
.rrv-notice,
.rrv-facts {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
/* Замечания источника и наши нюансы переносятся (у нюанса бывает по 70 знаков),
   «Неточность» — справа, невидимой до наведения. */
.rrv-notice .rrv-fails {
  gap: 4px;
}
.rrv-notice .rrv-fail,
.rrv-notice .rrv-fail:has(.rrv-flag) {
  height: auto;
  min-height: 28px;
  padding: 4px 12px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  white-space: normal;
  line-height: 1.4;
}
.rrv-notice .rrv-fail__txt {
  overflow: visible;
}
/* Пусто — серые слова в строку с подписью: «не смотрели» не читается как «чисто». */
.rrv-notice--quiet {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 10px;
}
.rrv-notice--quiet .rrv-cap {
  margin-bottom: 0;
}
.rrv-notice__quiet {
  min-width: 0;
  color: var(--rrv-dim);
  font-size: 12.5px;
}
/* Сетка нашей тех-инспекции: счёта «пройдено/всего» нет — итог словом справа. */
.rrv-secs--facts .rrv-sec {
  grid-template-columns: 16px auto minmax(0, 1fr);
}
.rrv-sec__v {
  min-width: 0;
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-secs--facts .rrv-sec i {
  font-size: 11.5px;
  color: var(--rrv-mut);
}
.rrv-secs--facts .rrv-sec--warn i {
  color: var(--rrv-warn);
}
.rrv-secs--facts .rrv-sec--bad i {
  color: var(--rrv-bad);
}
/* Факт без оценки — значок-чёрточка, как у «не смотрели», текст обычный. */
.rrv-sec--info .rrv-sec__m {
  background: var(--rrv-hov);
  color: var(--rrv-dim);
}
.rrv-facts__none {
  margin: 0;
  color: var(--rrv-dim);
  font-size: 12.5px;
}

/* ---- вкладка «Файл» ---- */
.rrv-kv {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 6px 14px;
  font-size: 12.5px;
  margin: 0;
}
.rrv-kv dt {
  color: var(--rrv-mut);
}
.rrv-kv dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}
/* ---- компактная сводка сразу под карточками: операция, шкала, все поля ---- */
.rrv-summary {
  /* На низком окне раскрытая сверка не отнимает всю высоту у вкладки. */
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  margin: 0 18px 6px;
  min-width: 0;
  border-top: 1px solid var(--rrv-hair);
  border-bottom: 1px solid var(--rrv-hair);
}
.rrv-payslot:not(:empty) + .rrv-bottom {
  padding-top: 4px;
}
.rrv-bottom {
  background: none;
  padding: 6px 0 7px;
}
/* Строка статуса — ОДНА и фиксированной высоты: итог сверки приходит позже
   (`/doc` OCHKARIK) и переносом второй строкой толкал бы низ (ревью 27.09.2026,
   CLS). Не помещается — подпись и итог режутся многоточием, целиком — в подсказке. */
.rrv-opline {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  height: 26px;
  min-width: 0;
}
.rrv-opst {
  --rrv-c: var(--rrv-warn);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 26px;
  padding: 0 9px;
  border-radius: 8px;
  font: 600 13px var(--font-heading);
  color: var(--rrv-c);
  background: color-mix(in srgb, var(--rrv-c) 13%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rrv-c) 30%, transparent);
  white-space: nowrap;
  flex: none;
}
.rrv-opst--ok {
  --rrv-c: var(--rrv-ok);
}
.rrv-opst--bad {
  --rrv-c: var(--rrv-bad);
}
.rrv-opst i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--rrv-c);
}
.rrv-lbl {
  color: var(--rrv-mut);
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Итог сверки несёт объяснение и бывает длинным: режется многоточием
   (`title` — целиком), подпись уступает место первой. */
.rrv-res {
  margin-left: auto;
  flex: 0 1 auto;
  min-width: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--rrv-mut);
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-lbl {
  flex: 0 1000 auto;
  min-width: 0;
}
.rrv-res--ok {
  color: var(--rrv-ok);
}
.rrv-res--warn {
  color: var(--rrv-warn);
}
.rrv-res--bad {
  color: var(--rrv-bad);
}

.rrv-tl {
  --rrv-time-count: 5;
  --rrv-time-small: 3;
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--rrv-time-count, 5), minmax(0, 1fr));
  margin: 8px 0 6px;
}
.rrv-tl__item {
  position: relative;
  min-width: 0;
  padding-top: 15px;
}
.rrv-tl__seg {
  position: absolute;
  top: 20px;
  left: 0;
  right: 0;
  height: 1px;
  border-radius: 2px;
  background: var(--rrv-ok);
  transform-origin: left;
  animation: rrv-grow 0.9s var(--rrv-ease) both;
}
.rrv-tl__item.is-first .rrv-tl__seg { left: 50%; }
.rrv-tl__item.is-last .rrv-tl__seg { right: 50%; }
.rrv-tl__seg.is-warn {
  background: var(--rrv-warn);
}
@keyframes rrv-grow {
  from {
    transform: scaleX(0);
  }
  to {
    transform: none;
  }
}
.rrv-tl__pt {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  width: 100%;
  min-width: 0;
  min-height: 0;
  border: 0;
  padding: 0;
  background: none;
  cursor: pointer;
  white-space: nowrap;
  animation: rrv-fade 0.5s var(--rrv-ease) both;
}
@keyframes rrv-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.rrv-tl__pt i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-top: 0;
  background: var(--rrv-s1);
  box-shadow: inset 0 0 0 2px var(--rrv-ok);
}
.rrv-tl__pt.is-warn i {
  box-shadow: inset 0 0 0 2px var(--rrv-warn);
  background: var(--rrv-warn);
}
.rrv-tl__pt b {
  white-space: normal;
  font: 500 11.5px var(--font-ui);
  color: var(--rrv-tx);
}
.rrv-tl__pt span {
  font-size: 11px;
  color: var(--rrv-mut);
}
.rrv-tl__pt.is-warn span,
.rrv-tl__pt.is-warn b {
  color: var(--rrv-warn);
}
.rrv-tl__gap {
  position: absolute;
  top: 0;
  left: -50%;
  width: 100%;
  text-align: center;
  font: 500 11px var(--font-ui);
  color: var(--rrv-dim);
  padding: 0 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rrv-tl__gap.is-warn {
  color: var(--rrv-warn);
}
.rrv-tl-note {
  margin: 3px 0;
  font-size: 11px;
  color: var(--rrv-warn);
  overflow-wrap: anywhere;
}

/* Краткая сверка: одна строка ордера, исключения и раскрытие по месту. */
.rrv-brief { margin-top: 4px; min-width: 0; }
.rrv-brief__row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; align-items: baseline; font-size: 13px; }
.rrv-brief__value { display: flex; flex-wrap: wrap; gap: 5px; min-width: 0; overflow-wrap: anywhere; font-weight: 500; }
.rrv-brief__sources { display: flex; gap: 9px; flex-wrap: wrap; }
.rrv-brief__source { font-size: 11px; color: var(--rrv-mut); white-space: nowrap; }
.rrv-brief__source.is-ok { color: var(--rrv-ok); }
.rrv-brief__source.is-bad { color: var(--rrv-bad); }
.rrv-brief__source.is-q { color: var(--rrv-warn); }
.rrv-brief__sep { color: var(--rrv-dim); }
.rrv-brief__context { display: flex; align-items: baseline; flex-wrap: wrap; gap: 3px 9px; margin-top: 4px; min-width: 0; font-size: 11.5px; color: var(--rrv-mut); }
.rrv-brief__context { justify-content: space-between; }
.rrv-brief__context > span { overflow-wrap: anywhere; min-width: 0; }
.rrv-brief__context .rrv-i { vertical-align: middle; }
.rrv-brief__label { color: var(--rrv-mut); font-size: 11.5px; }
.rrv-brief__reading { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 5px; align-items: baseline; min-width: 0; }
.rrv-brief__reading > small { flex: none; font-size: 11px; }
.rrv-brief__exception { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px 12px; margin-top: 6px; min-width: 0; font-size: 11.5px; border-left: 2px solid var(--rrv-warn); padding-left: 7px; }
.rrv-brief__exception > .rrv-brief__label { grid-column: 1 / -1; }
.rrv-brief__reading .rrv-mk { white-space: normal; overflow-wrap: anywhere; }
.rrv-brief__exception[data-rrv-mrow="status"] .rrv-brief__reading { grid-column: 1 / -1; }
@container rrv (max-width: 440px) {
  .rrv-brief__exception { grid-template-columns: minmax(0, 1fr); }
}

.rrv-brief__exception[data-rrv-tone="bad"] { border-color: var(--rrv-bad); }
.rrv-match-toggle { display: inline-flex; align-items: center; gap: 4px; border: 0; background: none; padding: 0; min-height: 22px; color: var(--rrv-mut); font: 11.5px var(--font-ui); cursor: pointer; white-space: nowrap; margin-left: auto; padding-right: 3px; }
.rrv-match-toggle[aria-expanded="true"] > .rrv-grp__chev { transform: rotate(90deg); }
[data-rrv-match-body][hidden] { display: none !important; }
[data-rrv-match-body] { padding-top: 8px; }
@container rrv (max-width: 410px) {
  .rrv-tl--six { grid-template-columns: repeat(var(--rrv-time-small, 3), minmax(0, 1fr)); row-gap: 10px; }
  .rrv-tl--six .rrv-tl__item:nth-child(3) .rrv-tl__seg { right: 50%; }
  .rrv-tl--six .rrv-tl__item:nth-child(4) .rrv-tl__seg { left: 50%; }
  .rrv-tl--six .rrv-tl__item:nth-child(4) .rrv-tl__gap { left: 0; }
  .rrv-tl--six .rrv-tl__item:nth-child(4) .rrv-tl__gap::before { content: "↳ "; }
}
@media (pointer: coarse) {
  .rrv .rrv-tab, .rrv .rrv-tl__pt, .rrv .rrv-match-toggle { min-height: 40px; }
}
.rrv-tl__source {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 10px;
  margin: 0 4px 5px;
  font: 11px var(--font-ui);
  color: var(--rrv-mut);
}
.rrv-tl__source b {
  font-weight: 600;
  color: var(--rrv-tx);
}

/* Столбцы значений — равными долями: в ячейке чекера теперь ЗНАЧЕНИЕ из чека
   (жалоба владельца 27.09.2026), а не одно «совпало»; длинное режется
   многоточием, целиком — в подсказке. Ни один столбец не фиксирован шире
   телефона. */
.rrv-mt {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  column-gap: 12px;
  font-size: 12.5px;
}
.rrv-mt--och {
  grid-template-columns: 74px repeat(3, minmax(0, 1fr));
}
.rrv-mt > div {
  height: 23px;
  display: flex;
  align-items: center;
  border-top: 1px solid var(--rrv-hair);
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  cursor: default;
}
.rrv-mt > div[data-rrv-note] {
  height: auto;
  min-height: 23px;
  align-self: stretch;
  padding-block: 3px;
  white-space: normal;
  overflow: visible;
}
.rrv-mt > div[data-rrv-hl]:not([data-rrv-hl=""]) {
  cursor: pointer;
}
.rrv-mt .rrv-h {
  height: 19px;
  border-top: 0;
  font: 600 9.5px var(--font-ui);
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--rrv-dim);
}
.rrv-f {
  color: var(--rrv-mut);
}
/* Ячейка — флекс: многоточие ставит только внутренний блок, не сам флекс. */
.rrv-num > span,
.rrv-mt .rrv-h > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rrv-mt .is-hov {
  background: var(--rrv-hov);
}
.rrv-mk {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  color: var(--rrv-mut);
}
.rrv-mk::before {
  content: "";
  width: 15px;
  height: 15px;
  border-radius: 50%;
  flex: none;
  box-shadow: inset 0 0 0 1.3px var(--rrv-dim);
}
.rrv-mk--y::before {
  box-shadow: inset 0 0 0 20px var(--rrv-okA), inset 0 0 0 1.3px var(--rrv-ok);
}
.rrv-mk--x {
  color: var(--rrv-bad);
}
.rrv-mk--x::before {
  box-shadow: inset 0 0 0 20px var(--rrv-badA), inset 0 0 0 1.3px var(--rrv-bad);
}
.rrv-mk--q {
  color: var(--rrv-tx);
}
.rrv-mk--n {
  color: var(--rrv-dim);
}
.rrv-mk span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rrv-mk {
  max-width: 100%;
}
.rrv-mk.has-note {
  display: grid;
  grid-template-columns: 15px minmax(0, 1fr);
  column-gap: 7px;
  row-gap: 2px;
  align-items: start;
}
.rrv-mk.has-note::before { grid-column: 1; grid-row: 1; }
.rrv-mk.has-note > span { grid-column: 2; grid-row: 1; }
.rrv-mk__note {
  grid-column: 2;
  grid-row: 2;
  display: block;
  min-width: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  color: var(--rrv-dim);
  font-size: 10.5px;
  line-height: 1.35;
}
/* Значение без отметки: сверки у чекера нет — только прочитанное; и слово
   вместо значения («не сверяли», «по карте не сверяется») — тоже без кружка. */
.rrv-mk--v::before,
.rrv-mk--n::before {
  display: none;
}
.rrv-mt__span--2 {
  grid-column: span 2;
}
/* «Ждал» OCHKARIK, когда он сверял с другим, чем столбец «Ждём по ордеру». */
.rrv-mk__w {
  color: var(--rrv-dim);
  font-size: 10.5px;
}
/* Место под примечание держится и пустым (приходит с `/doc` позже колонки). */
.rrv-mt__note {
  margin: 3px 0 0;
  min-height: 1.3em;
  color: var(--rrv-dim);
  font-size: 10.5px;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- скелетон ---- */
.rrv-skrow {
  height: 66px;
  border-radius: 13px;
  background: var(--rrv-s2);
  box-shadow: 0 0 0 1px var(--rrv-hair);
  display: grid;
  grid-template-columns: 30px 1fr 90px;
  gap: 14px;
  align-items: center;
  padding: 0 14px;
}
.rrv-sk {
  border-radius: 6px;
  background: linear-gradient(90deg, var(--rrv-skel) 0 40%, var(--rrv-skel2) 50%, var(--rrv-skel) 60% 100%);
  background-size: 250% 100%;
  animation: rrv-skel 1.2s linear infinite;
}
@keyframes rrv-skel {
  from {
    background-position: 100% 0;
  }
  to {
    background-position: -50% 0;
  }
}

/* Телефон: строка статуса одна, и подпись «статус операции в чеке» уступает
   место итогу сверки — иначе «Сверка по OCHKARIK: сумма не совпала» резалась бы
   до «Сверка по OCHKAR…». Подпись — флекс-ребёнок, не ячейка сетки. */
@container rrv (max-width: 460px) {
  .rrv-lbl {
    display: none;
  }
}

/* Узкая колонка (границу тянут): сверка без столбца OCHKARIK не помещается —
   ужимаем подписи, а не прячем данные. */
@container rrv (max-width: 420px) {
  .rrv-mt,
  .rrv-mt--och {
    column-gap: 8px;
  }
  .rrv-mt {
    grid-template-columns: 58px minmax(0, 1fr) minmax(0, 1fr);
  }
  .rrv-mt--och {
    grid-template-columns: 58px repeat(3, minmax(0, 1fr));
  }
  .rrv-mk {
    gap: 5px;
  }
  .rrv-mk::before {
    width: 12px;
    height: 12px;
  }
  .rrv-secs {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Появление — ОДИН раз на файл. Области колонки переписываются при каждой
   смене своей разметки (нажали «Спросить», пришёл вердикт), и без этого
   правила строки чекеров заново въезжали, значки заново прорисовывались, а
   шкала времени заново росла — на каждом таком такте (приёмка плавности
   27.09.2026). `rrv--shown` ставит колонка после первого показа; пришедшая
   строка при этом только вспыхивает рамкой. */
.rrv--shown .rrv-row:not(.is-arrived),
.rrv--shown .rrv-tl__seg,
.rrv--shown .rrv-tl__pt {
  animation: none;
}
.rrv--shown .rrv-row.is-arrived {
  animation: rrv-arrive 1.2s var(--rrv-ease);
}
.rrv--shown .rrv-ico__ln {
  animation: none;
  stroke-dashoffset: 0;
}

@media (prefers-reduced-motion: reduce) {
  .rrv *,
  .rrv *::before,
  .rrv *::after {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001s !important;
  }
  .rrv-ico__ln {
    stroke-dashoffset: 0;
  }
}

/* ---- счётчик заметок на вкладке ---- */
.rrv-cnt {
  display: inline-grid;
  place-items: center;
  min-width: 18px;
  height: 18px;
  margin-left: 6px;
  padding: 0 5px;
  border-radius: 6px;
  background: var(--rrv-warnA);
  color: var(--rrv-warn);
  font: 600 10.5px var(--font-ui);
  font-variant-numeric: tabular-nums;
  transition: background-color 0.2s, color 0.2s;
}
.rrv-cnt.is-zero {
  background: var(--rrv-hov);
  color: var(--rrv-dim);
}

/* ---- «Неточность» у замечания: видна при наведении, место держит всегда
   (ловушка №4: наведение не меняет размеров строки) ---- */
.rrv-fail:has(.rrv-flag) {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
}
.rrv-flag {
  visibility: hidden;
  height: 22px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: var(--rrv-hov);
  color: var(--rrv-mut);
  font: 500 11px var(--font-ui);
  cursor: pointer;
}
.rrv-fail:hover .rrv-flag,
.rrv-fail:focus-within .rrv-flag,
.rrv-fail.is-on .rrv-flag {
  visibility: visible;
}
.rrv-flag:hover {
  color: var(--rrv-tx);
}

/* ---- вкладка OCHKARIK: причины бота длинные — строка переносится ---- */
.rrv-och .rrv-fail {
  height: auto;
  min-height: 32px;
  padding: 7px 12px;
  align-items: start;
  white-space: normal;
  line-height: 1.45;
}
.rrv-och .rrv-fail__txt {
  overflow: visible;
}
/* Ступень причины — второй строкой под текстом: справа столбцом она сжимала
   текст причины до пары слов в строке на телефоне (стенд 412 px, 27.09.2026). */
.rrv-och .rrv-fail,
.rrv-och .rrv-fail:has(.rrv-flag) {
  grid-template-columns: auto minmax(0, 1fr) auto;
  row-gap: 2px;
}
.rrv-och .rrv-pin {
  grid-row: 1 / 3;
}
/* Текст причины — во всю ширину строки; «Неточность» — во второй строке справа
   (невидимая до наведения, она иначе отнимала у текста столбец). */
.rrv-och .rrv-fail__txt {
  grid-column: 2 / 4;
  grid-row: 1;
}
.rrv-och .rrv-flag {
  grid-column: 3;
  grid-row: 2;
}
.rrv-och .rrv-fail__tag {
  grid-column: 2;
  grid-row: 2;
  letter-spacing: 0.04em;
  line-height: 1.3;
}
.rrv-och .rrv-pin {
  margin-top: -1px;
}
.rrv-och .rrv-flag {
  margin-top: -2px;
}
.rrv-och__r--certain {
  box-shadow: inset 3px 0 0 var(--rrv-bad), inset 0 0 0 1px var(--rrv-hair);
}
.rrv-och__r--not_proof,
.rrv-och__r--resaved {
  box-shadow: inset 3px 0 0 var(--rrv-warn), inset 0 0 0 1px var(--rrv-hair);
}
.rrv-och__r--none .rrv-fail__tag {
  color: var(--rrv-dim);
}
.rrv-och__h,
.rrv-cap {
  display: block;
  margin-bottom: 4px;
  color: var(--rrv-dim);
  font: 500 10px var(--font-ui);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.rrv-och__lim p,
.rrv-och__note {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
}
.rrv-och__lim p {
  color: var(--rrv-mut);
}
.rrv-och__note {
  color: var(--rrv-mut);
}
/* Итог вкладки — цветом вердикта (строки бота со значками сняты, 27.09.2026). */
.rrv-och__head--ok h4 {
  color: var(--rrv-ok);
}
.rrv-och__head--warn h4 {
  color: var(--rrv-warn);
}
.rrv-och__head--bad h4 {
  color: var(--rrv-bad);
}

/* ---- группы проверок OCHKARIK: строка как секция Detecto, тело раскрывается ----
   Наведение меняет только цвет фона (ловушка №4: размеры не трогаем); раскрытие —
   по клику, внутри прокручиваемой вкладки: верх колонки и низ не двигаются. */
.rrv-grps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.rrv-grp__h {
  width: 100%;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) 8px;
  align-items: center;
  column-gap: 6px;
  row-gap: 2px;
  min-height: 46px;
  padding: 6px;
  border: 0;
  border-radius: 7px;
  background: none;
  color: var(--rrv-mut);
  font: 12.5px var(--font-ui);
  text-align: left;
  cursor: pointer;
  transition: background-color 0.15s;
}
.rrv-grp__h:hover,
.rrv-grp__h:focus-visible {
  background-color: var(--rrv-hov);
  outline: none;
}
.rrv-grp__t {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-grp__h i {
  font-size: 11px;
  color: var(--rrv-dim);
  font-style: normal;
}
.rrv-grp__chev {
  width: 6px;
  height: 6px;
  border-right: 1.5px solid var(--rrv-dim);
  border-bottom: 1.5px solid var(--rrv-dim);
  transform: rotate(-45deg);
  transition: transform 0.2s var(--rrv-ease);
}
.rrv-grp.is-open .rrv-grp__chev {
  transform: rotate(45deg);
}
.rrv-grp--ok .rrv-grp__h .rrv-sec__m,
.rrv-gi--ok .rrv-sec__m {
  background: var(--rrv-okA);
  color: var(--rrv-ok);
}
.rrv-grp--warn .rrv-grp__h .rrv-sec__m,
.rrv-gi--warn .rrv-sec__m {
  background: var(--rrv-warnA);
  color: var(--rrv-warn);
}
.rrv-grp--bad .rrv-grp__h .rrv-sec__m,
.rrv-gi--bad .rrv-sec__m {
  background: var(--rrv-badA);
  color: var(--rrv-bad);
}
.rrv-grp--warn .rrv-grp__t,
.rrv-grp--bad .rrv-grp__t {
  color: var(--rrv-tx);
}
.rrv-grp--bad .rrv-grp__h i {
  color: var(--rrv-bad);
}
.rrv-grp--warn .rrv-grp__h i {
  color: var(--rrv-warn);
}
.rrv-grp__b {
  display: none;
  flex-direction: column;
  gap: 4px;
  margin: 2px 0 6px 30px;
}
.rrv-grp.is-open .rrv-grp__b {
  display: flex;
}
.rrv-grp__hint {
  margin: 0 0 2px;
  color: var(--rrv-dim);
  font-size: 11.5px;
  line-height: 1.4;
}
.rrv-gi {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  align-items: start;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.4;
}
.rrv-gi .rrv-sec__m {
  margin-top: 1px;
}
.rrv-gi--off .rrv-gi__t {
  color: var(--rrv-mut);
}
.rrv-gi small {
  display: block;
  color: var(--rrv-dim);
  font-size: 11px;
}
.rrv-gi__detail {
  color: var(--rrv-mut);
  font-size: 11.5px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.rrv-grp__more {
  align-self: flex-start;
  font-size: 11.5px;
}
.rrv-grp__quiet {
  display: none;
  flex-direction: column;
  gap: 3px;
}
.rrv-grp__quiet.is-plain,
.rrv-grp.is-more .rrv-grp__quiet {
  display: flex;
}
.rrv-grp__quiet .rrv-gi {
  color: var(--rrv-mut);
  font-size: 12px;
}

/* ---- поля чека: «подпись — значение», прицел у поля с боксами ---- */
.rrv-flds {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.rrv-fld {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  height: 27px;
  padding: 0 4px 0 6px;
  border-top: 1px solid var(--rrv-hair);
  border-radius: 6px;
  font-size: 12.5px;
  cursor: pointer;
  transition: background-color 0.15s;
}
.rrv-fld:hover,
.rrv-fld.is-on {
  background-color: var(--rrv-hov);
}
.rrv-fld.is-nopin {
  cursor: default;
}
.rrv-fld__k {
  min-width: 0;
  color: var(--rrv-mut);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-fld__v {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rrv-fld.is-miss .rrv-fld__v {
  color: var(--rrv-dim);
}
.rrv-fld.is-nopin .rrv-pin,
.rrv-fld.is-nohit .rrv-pin {
  visibility: hidden;
}
@container rrv (max-width: 420px) {
  .rrv-fld {
    grid-template-columns: 118px minmax(0, 1fr) 20px;
    gap: 8px;
  }
  .rrv-flds.has-flag .rrv-fld {
    grid-template-columns: 104px minmax(0, 1fr) auto 20px;
  }
  .rrv-pay__it {
    grid-template-columns: 52px minmax(0, 1fr);
    column-gap: 8px;
  }
  /* Узкие строки сохраняют отдельный ряд источника и пояснения. */
  .rrv-pay__aim {
    max-width: 96px;
  }
  .rrv-grp__b {
    margin-left: 12px;
  }
}
/* Заголовок группы и «i» с её подсказкой — рядом (кнопка в кнопке недопустима). */
.rrv-grp__row {
  display: flex;
  align-items: center;
  min-width: 0;
}
.rrv-grp__row .rrv-grp__h {
  flex: 1 1 auto;
  min-width: 0;
}
.rrv-grp__row .rrv-i {
  margin: 0 4px 0 2px;
}
.rrv-grps__cap {
  display: flex;
  align-items: center;
  padding: 0 6px;
}
.rrv-grps__cap .rrv-och__h {
  margin-bottom: 0;
}
/* Верх тела группы: подсказка сервера и «Неточность» к группе целиком. */
.rrv-grp__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}
.rrv-grp__top .rrv-grp__hint {
  min-width: 0;
}
.rrv-grp__top .rrv-flag {
  flex: none;
}
.rrv-grp:hover .rrv-grp__top .rrv-flag {
  visibility: visible;
}
/* «Неточность» у проверки группы и у поля — место держит всегда (ловушка №4). */
.rrv-gi.has-flag {
  grid-template-columns: 16px minmax(0, 1fr) auto;
}
.rrv-gi:hover .rrv-flag,
.rrv-gi:focus-within .rrv-flag,
.rrv-fld:hover .rrv-flag,
.rrv-fld:focus-within .rrv-flag {
  visibility: visible;
}
.rrv-flds.has-flag .rrv-fld {
  grid-template-columns: 132px minmax(0, 1fr) auto 20px;
}
/* Справочная проверка — «i», серым: на цвет не влияет (0.69.0). */
.rrv-gi--info .rrv-sec__m {
  background: color-mix(in srgb, var(--rrv-own) 12%, transparent);
  color: var(--rrv-own);
}
.rrv-gi--info .rrv-gi__t {
  color: var(--rrv-mut);
}
/* Выведено ядром, а не прочитано из чека (0.69.0): курсивом и приглушённо,
   с подписью «вычислено» — чтобы не путать с напечатанным. */
.rrv-gi--derived .rrv-sec__m {
  background: var(--rrv-hov);
  color: var(--rrv-mut);
}
.rrv-gi--derived .rrv-gi__t,
.rrv-fld.is-derived .rrv-fld__v,
.rrv-mk.is-derived > span {
  font-style: italic;
  color: var(--rrv-mut);
}
.rrv-fld__d,
.rrv-mk__d {
  font-style: normal;
  font-size: 10.5px;
  color: var(--rrv-dim);
  letter-spacing: 0.02em;
}
/* «i» шкалы времени — в углу над концом шкалы, своё место. */
.rrv-tl__i {
  position: absolute;
  right: 7px;
  top: -14px;
  margin: 0;
}

/* «Разбор сейчас не идёт» — штатно, не ошибка: спокойная серая плашка. */
.rrv-calm {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 7px 12px;
  border-radius: 10px;
  background: var(--rrv-hov);
  color: var(--rrv-mut);
  font-size: 12.5px;
  line-height: 1.45;
}
.rrv-calm svg {
  flex: none;
  width: 15px;
  height: 15px;
  margin-top: 1px;
}
.rrv-calm b {
  color: var(--rrv-tx);
  font-weight: 500;
}

/* ---- вкладка «Заметки» (узел стойкий; прокручивается только список) ---- */
.rrv-pane--notes {
  gap: 10px;
  overflow: hidden;
}
.rrv-pane--notes[hidden] {
  display: none;
}
.rrn-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-right: 4px;
  scrollbar-width: thin;
  scrollbar-color: var(--rrv-hair2) transparent;
}
.rrn-empty {
  color: var(--rrv-dim);
  font-size: 12.5px;
  padding: 8px 2px;
}
.rrn-empty[hidden] {
  display: none;
}
.rrn-note {
  flex: none;
  border-radius: 11px;
  padding: 10px 12px;
  background: var(--rrv-s2);
  box-shadow: inset 0 0 0 1px var(--rrv-hair);
  animation: rrv-rowIn 0.4s var(--rrv-ease) both;
  transition: box-shadow 0.6s var(--rrv-ease);
}
.rrn-note.is-fresh {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rrv-ok) 45%, transparent);
}
.rrn-nh {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-size: 11.5px;
  color: var(--rrv-dim);
}
.rrn-nh b {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--rrv-tx);
  font-weight: 500;
  font-size: 12.5px;
}
.rrn-nh b small {
  color: var(--rrv-dim);
  font-weight: 400;
}
.rrn-nh time {
  margin-left: auto;
  flex: none;
  font-size: 11px;
}
.rrn-tag {
  flex: none;
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 7px;
  border-radius: 6px;
  font: 600 10px var(--font-ui);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: var(--rrv-hov);
  color: var(--rrv-mut);
}
/* Виды заметок про OCHKARIK (27.09.2026) и старые — по прежней теме. */
.rrn-tag--wrong {
  background: var(--rrv-badA);
  color: var(--rrv-bad);
}
.rrn-tag--missed {
  background: var(--rrv-warnA);
  color: var(--rrv-warn);
}
.rrn-tag--idea,
.rrn-tag--old-ochkarik {
  background: var(--rrv-ownA);
  color: var(--rrv-own);
}
.rrn-tag--old-detecto {
  background: var(--rrv-hov);
  color: var(--rrv-mut);
  letter-spacing: 0.02em;
  text-transform: none;
}
.rrn-eng {
  flex: none;
  color: var(--rrv-dim);
  font-size: 10.5px;
}
.rrn-del {
  flex: none;
  height: 22px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: none;
  color: var(--rrv-dim);
  font: 500 11px var(--font-ui);
  cursor: pointer;
  transition: color 0.15s, background-color 0.15s;
}
.rrn-del:hover {
  color: var(--rrv-tx);
  background: var(--rrv-hov);
}
.rrn-del.is-ask {
  color: var(--rrv-bad);
  background: var(--rrv-badA);
}
.rrn-del[disabled] {
  opacity: 0.5;
  cursor: default;
}
.rrn-ref {
  margin-top: 6px;
  padding-left: 8px;
  border-left: 2px solid var(--rrv-hair2);
  color: var(--rrv-mut);
  font-size: 11.5px;
}
.rrn-note p {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
}
.rrn-compose {
  flex: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px;
  border-radius: 12px;
  background: var(--rrv-s2);
  box-shadow: inset 0 0 0 1px var(--rrv-hair2);
  transition: box-shadow 0.2s;
}
.rrn-compose:focus-within {
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--rrv-ok) 55%, transparent), 0 0 0 3px var(--rrv-okA);
}
/* Строка «про что» — ОДНОЙ высоты при любой ссылке на замечание: ссылка
   сжимается многоточием, а не переносится. Иначе запись заметки (ссылка
   снимается) меняла высоту поля и двигала его вниз (стенд 27.09.2026). */
.rrn-top {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.rrn-topic {
  flex: none;
}
@container rrv (max-width: 460px) {
  .rrn-top > span:first-child {
    display: none;
  }
}
.rrn-top > span:first-child {
  flex: none;
  white-space: nowrap;
  margin-right: 2px;
  color: var(--rrv-dim);
  font-size: 11.5px;
}
.rrn-topic {
  height: 24px;
  padding: 0 9px;
  border: 0;
  border-radius: 7px;
  background: var(--rrv-hov);
  color: var(--rrv-mut);
  font: 500 11.5px var(--font-ui);
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s, box-shadow 0.15s;
}
.rrn-topic[aria-pressed="true"] {
  background: var(--rrv-s3);
  color: var(--rrv-tx);
  box-shadow: inset 0 0 0 1px var(--rrv-hair2);
}
.rrn-refChip {
  flex: 0 1 auto;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  height: 24px;
  padding: 0 6px 0 9px;
  border-radius: 7px;
  background: var(--rrv-warnA);
  color: var(--rrv-warnTx);
  font-size: 11.5px;
  animation: rrv-rowIn 0.3s var(--rrv-ease) both;
}
.rrn-refChip[hidden] {
  display: none;
}
.rrn-refChip > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rrn-refChip button {
  padding: 0 2px;
  border: 0;
  background: none;
  color: inherit;
  font-size: 13px;
  line-height: 1;
  cursor: pointer;
}
.rrn-text {
  resize: none;
  min-height: 38px;
  max-height: 90px;
  padding: 2px 4px;
  border: 0;
  outline: 0;
  background: none;
  color: var(--rrv-tx);
  font: 13px/1.45 var(--font-ui);
}
.rrn-text::placeholder {
  color: var(--rrv-dim);
}
.rrn-bot {
  display: flex;
  align-items: center;
  gap: 8px;
}
.rrn-bot small {
  min-width: 0;
  color: var(--rrv-dim);
  font-size: 11px;
}
.rrn-bot small.is-bad {
  color: var(--rrv-bad);
}
.rrn-send {
  margin-left: auto;
  flex: none;
  min-width: 108px;
  height: 30px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: var(--rrv-ok);
  color: #06140c;
  font: 600 12px var(--font-ui);
  cursor: pointer;
  transition: opacity 0.15s;
}
.rrn-send:disabled {
  opacity: 0.35;
  cursor: default;
}
/* Класс «занято» со своим видом (ловушка №7): замок — флаг и `disabled`. */
.rrn-send.is-busy {
  opacity: 0.7;
  cursor: progress;
}

/* Кнопки остаются на месте; подробности идут под всей сеткой. */
.rrv-grps { column-gap: 6px; row-gap: 0; }
.rrv-grp { display: contents; }
.rrv-grps__cap { grid-column: 1 / -1; order: -1; margin-bottom: 6px; }
.rrv-grp__row { order: 0; margin-bottom: 6px; min-width: 0; }
.rrv-grp__h {
  min-height: 44px; padding: 7px 9px; grid-template-columns: 12px minmax(0, 1fr) 6px;
  column-gap: 6px; row-gap: 3px; border: 1px solid transparent; border-radius: 9px;
  color: var(--rrv-tx); background-color: var(--rrv-s2);
  transition: background-color 160ms var(--rrv-ease), border-color 160ms var(--rrv-ease);
}
.rrv-grp__h:hover { background-color: var(--rrv-s3); }
.rrv-grp__t { font-size: 12px; font-weight: 500; }
.rrv-grp__h i { grid-column: 2; grid-row: 2; font-size: 10px; color: var(--rrv-mut); }
.rrv-grp__h .rrv-grp__chev { grid-column: 3; grid-row: 1 / 3; width: 5px; height: 5px; }
.rrv-grp__h .rrv-sec__m { width: 12px; height: 12px; border-radius: 50%; font-size: 10px; background: transparent; }
.rrv-grp.is-open .rrv-grp__h { border-color: var(--rrv-sel); background-color: var(--rrv-s3); }
.rrv-grp--warn .rrv-grp__h { border-color: var(--rrv-warnA); }
.rrv-grp--bad .rrv-grp__h { border-color: var(--rrv-badA); }
.rrv-grp__b { order: 1; grid-column: 1 / -1; margin: 0; min-width: 0; overflow: hidden; overflow-wrap: anywhere; }
.rrv-grp.is-open .rrv-grp__b { animation: none; }
.rrv-grp__content { flex: 0 0 auto; display: flex; flex-direction: column; gap: 5px; margin-bottom: 6px; padding: 12px; background-color: var(--rrv-s2); border: 1px solid var(--rrv-hair); border-radius: 10px; }
.rrv-grp__top { padding-bottom: 6px; margin-bottom: 3px; border-bottom: 1px solid var(--rrv-hair); }
.rrv-grp__top b { display: block; margin-bottom: 4px; font-size: 12.5px; font-weight: 500; color: var(--rrv-tx); }
.rrv-grp__top > div { min-width: 0; }
.rrv-grp__h:focus-visible, .rrv-read-toggle:focus-visible { outline: 2px solid var(--rrv-own); outline-offset: 2px; }
.by-viewer__body--split:has(.rrv), .rrv-pane, .rrv-panes, .rrv-summary { overflow-anchor: none; }
.rrv-och__lim { padding: 8px 10px; border-left: 2px solid var(--rrv-warn); background: var(--rrv-warnA); border-radius: 6px; }
.rrv-och__lim .rrv-och__h { color: var(--rrv-warn); }
.rrv-read-toggle {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 36px;
  padding: 6px 8px; border: 1px solid var(--rrv-hair); border-radius: 8px;
  background: transparent; color: var(--rrv-mut); font: 12.5px var(--font-ui); text-align: left; cursor: pointer;
}
.rrv-read-toggle small { margin-left: auto; color: var(--rrv-dim); }
.rrv-read-toggle:hover { background-color: var(--rrv-hov); }
.rrv-read-toggle[aria-expanded="true"] .rrv-grp__chev { transform: rotate(45deg); }
.rrv-och__read .rrv-flds:not([hidden]) { margin-top: 6px; }
@keyframes rrv-disclose {
  from { opacity: 0; transform: translateY(-3px); }
  to { opacity: 1; transform: translateY(0); }
}
@container rrv (max-width: 540px) { .rrv-grps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container rrv (max-width: 280px) { .rrv-grps { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) {
  .rrv-grp.is-open .rrv-grp__b, .rrv-och__read .rrv-flds:not([hidden]) { animation: none; }
}
.rrv [data-rrv-read-body][hidden] { display: none !important; }

/* Общая история ID: отдельный контекст внутри компактной сводки, без новой плитки PDF. */
.rrv .rrv-operation[hidden], .rrv .rrv-operation__details[hidden], .rrv .rrv-operation__toggle[hidden] { display: none !important; }
.rrv-operation { min-width: 0; margin: 6px 0; }
.rrv .rrv-operation__alert { padding: 7px 8px; gap: 7px; border-radius: 8px; }
.rrv-operation__mark { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 17px; height: 17px; margin-top: 1px; border: 1px solid currentColor; border-radius: 50%; font-size: 11px; font-weight: 700; }
.rrv-operation__message { min-width: 0; flex: 1; }
.rrv-operation__message b { display: block; font-size: 12px; font-weight: 600; }
.rrv-operation__message > span { display: block; margin-top: 2px; color: var(--rrv-mut); font-size: 11px; line-height: 1.4; }
.rrv .rrv-operation__toggle { flex: none; align-self: flex-start; padding: 3px 5px; min-height: 26px; border: 0; border-radius: 5px; background: transparent; color: inherit; font: inherit; font-size: 11px; line-height: 1.4; cursor: pointer; transition: background-color 160ms ease; }
.rrv .rrv-operation__toggle:hover { background-color: var(--rrv-hov); }
.rrv .rrv-operation__toggle:focus-visible { outline: 2px solid var(--rrv-own); outline-offset: 2px; }
.rrv-operation__details { min-width: 0; padding: 0 8px; overflow-wrap: anywhere; }
.rrv-operation__item { padding: 7px 0; border-bottom: 1px solid var(--rrv-hair); font-size: 12px; line-height: 1.45; }
.rrv-operation__item:last-child { border-bottom: 0; }
.rrv-operation__item > b { display: block; font-weight: 600; }
.rrv-operation__item > p { margin: 2px 0 0; }
.rrv-operation__item > small { display: block; margin-top: 3px; color: var(--rrv-mut); font-size: 11px; }
@media (pointer: coarse) { .rrv .rrv-operation__toggle { min-height: 40px; } }
@container rrv (max-width: 330px) { .rrv .rrv-operation__alert { flex-wrap: wrap; } .rrv .rrv-operation__toggle { margin-left: 24px; } }

/* Пояснение расхождения не вытесняет банковское название и не обрезается. */
.rrv-pay__side { flex-direction: row; align-items: baseline; gap: 4px 10px; }
.rrv-pay__aim { max-width: none; white-space: normal; overflow-wrap: anywhere; }
.rrv-pay__want, .rrv-pay__got { white-space: normal; overflow-wrap: anywhere; }

/* Сводка: одна ось чтения, без разлетающихся подписей (28.09.2026). */
.rrv-bottom .rrv-opline { flex-wrap: wrap; height: auto; min-height: 26px; gap: 4px 10px; }
.rrv-bottom .rrv-lbl { flex: 0 1 auto; font-size: 11px; white-space: normal; }
.rrv-bottom .rrv-lbl:empty { display: none; }
.rrv-bottom .rrv-opst { font-size: 12px; height: 24px; }
.rrv-bottom .rrv-res { margin-left: 0; text-align: left; white-space: normal; overflow: visible; font-size: 12px; line-height: 18px; }
.rrv-bottom .rrv-brief { margin-top: 8px; }
.rrv-bottom .rrv-brief__row { justify-content: flex-start; align-items: center; gap: 4px 12px; }
.rrv-bottom .rrv-brief__value { font-size: 14px; line-height: 20px; }
.rrv-bottom .rrv-brief__sources { gap: 8px; }
.rrv-bottom .rrv-brief__context { align-items: center; margin-top: 2px; gap: 3px 8px; font-size: 12px; }
.rrv-bottom .rrv-brief__context > span { display: inline-flex; align-items: center; gap: 4px; }
.rrv-bottom .rrv-brief__exception { grid-template-columns: minmax(0, 1fr); gap: 3px; padding: 6px 8px; border-left-width: 2px; background: color-mix(in srgb, var(--muted) 5%, transparent); border-radius: 0 6px 6px 0; }
.rrv-bottom .rrv-brief__reading { grid-template-columns: 62px minmax(0, 1fr); align-items: baseline; }
.rrv-bottom .rrv-brief__reading .rrv-mk { font-size: 12px; line-height: 18px; }
.rrv-bottom .rrv-tl { margin-top: 10px; margin-bottom: 0; }
.rrv-pay--warn .rrv-pay__hd { min-height: 30px; padding-top: 5px; padding-bottom: 5px; }
.rrv-pay--warn .rrv-pay__bd:empty { display: none; }

/* Findings with the same reliability share a quiet, compact surface. */
.rrv-reasons { margin: 8px 0; padding: 9px 12px; border: 1px solid var(--rrv-hair); border-left: 3px solid var(--rrv-warn); border-radius: 10px; background: var(--rrv-hov); }
.rrv-reasons--bad { border-left-color: var(--rrv-bad); }
.rrv-reasons__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; color: var(--rrv-warn); font-size: 10px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.rrv-reasons--bad .rrv-reasons__head { color: var(--rrv-bad); }
.rrv-reasons__head small { font-size: 11px; font-variant-numeric: tabular-nums; }
.rrv-reasons ul { list-style: none; margin: 4px 0 0; padding: 0; }
.rrv-reasons__item { position: relative; display: flex; align-items: baseline; gap: 7px; padding: 6px 0; font-size: 12px; line-height: 1.45; }
.rrv-reasons__item + .rrv-reasons__item { border-top: 1px solid var(--rrv-hair); }
.rrv-reasons__item > span:not(.rrv-pin) { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.rrv-reasons__item .rrv-pin { position: static; flex: none; width: 14px; }
.rrv-reasons__item .rrv-flag { position: static; flex: none; visibility: visible; opacity: 0; }
.rrv-reasons__item:hover .rrv-flag, .rrv-reasons__item:focus-within .rrv-flag { opacity: 1; }
.rrv-reasons__item .rrv-flag:focus-visible { outline: 2px solid var(--rrv-own); outline-offset: 2px; }
.rrv .rrv-rerun { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 28px; height: 28px; min-height: 28px; padding: 5px; border: 1px solid var(--rrv-hair); border-radius: 8px; color: var(--rrv-mut); background: transparent; cursor: pointer; transition: color 160ms ease, background-color 160ms ease; }
.rrv .rrv-rerun:hover { color: var(--rrv-tx); background-color: var(--rrv-hov); }
.rrv .rrv-rerun:focus-visible { outline: 2px solid var(--rrv-own); outline-offset: 2px; }
.rrv-rerun svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.rrv .rrv-rerun:not(:disabled):active { transform: scale(.9); background: var(--rrv-sel); }
.rrv .rrv-rerun.is-busy {
  position: relative;
  color: var(--rrv-own);
  background: color-mix(in srgb, var(--rrv-own) 10%, var(--rrv-s2));
  border-color: color-mix(in srgb, var(--rrv-own) 45%, var(--rrv-hair));
  cursor: progress;
}
.rrv .rrv-rerun.is-busy svg {
  transform-origin: center;
  animation: rrv-rerun-turn 1s linear infinite;
}
@keyframes rrv-rerun-turn { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .rrv .rrv-rerun.is-busy svg { animation: none; }
  .rrv .rrv-rerun:not(:disabled):active { transform: none; }
}
@media (pointer: coarse) { .rrv .rrv-rerun { width: 40px; height: 40px; min-height: 40px; } .rrv-reasons__item .rrv-flag { opacity: 1; } }

.rrv-reasons__item { box-shadow: none; }
.rrv-side:has(.rrv-rerun) { flex-direction: row; align-items: center; gap: 8px; }
.rrv-rerun-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
@container rrv (max-width: 390px) {
  .rrv-row[data-rrv-row="ochkarik"] .rrv-name small { display: none; }
}
@container rrv (max-width: 340px) {
  .rrv-row[data-rrv-row="ochkarik"] .rrv-rerun-meta { display: none; }
}
