  :root {
    --brand:        #2536C4;
    --brand-soft:   #E6E9FB;
    --brand-deep:   #1B2470;
    --ink:          #10143A;
    --ink-2:        #4A5074;
    --ink-3:        #7D83A3;
    --ground:       #F4F5FA;
    --surface:      #FFFFFF;
    --line:         #E3E5F0;
    --line-strong:  #CDD1E4;
    --ok:           #0F9A63;
    --ok-soft:      #E7F6EF;
    --ok-line:      #BFE6D3;
    --warn:         #B8791A;
    --warn-soft:    #FDF3E2;
    --danger:       #D93B44;
    --danger-soft:  #FDECEC;
    --burgundy:     #8E1B2E;
    --burgundy-soft:#F7E6E9;
    --shadow-sm:    0 1px 2px rgba(16,20,58,.06), 0 1px 3px rgba(16,20,58,.04);
    --shadow-md:    0 4px 16px rgba(16,20,58,.08), 0 1px 3px rgba(16,20,58,.05);
    --shadow-lg:    0 18px 48px rgba(16,20,58,.12);
    --r-sm: 8px; --r-md: 12px; --r-lg: 18px; --r-xl: 24px;
    --mono: ui-monospace, "Cascadia Mono", "SF Mono", Consolas, "Liberation Mono", monospace;
    --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", "Segoe UI Variable Text", Roboto, "Helvetica Neue", Arial, sans-serif;
  }

/* Атрибут hidden должен побеждать любой display из класса.
   У браузера [hidden] и класс весят одинаково, а класс объявлен позже — и
   кнопка с `display: inline-flex` оставалась на экране, хотя в разметке была
   спрятана. Поймано на кнопке кабинета: она висела на экране входа. */
[hidden] { display: none !important; }

  @media (prefers-color-scheme: dark) {
    :root {
      --brand:        #7C8CFF;
      --brand-soft:   #232A55;
      --brand-deep:   #0B0E22;
      --ink:          #EEF0FB;
      --ink-2:        #AEB4D4;
      --ink-3:        #787FA5;
      --ground:       #0C0F20;
      --surface:      #14182E;
      --line:         #262C48;
      --line-strong:  #39406A;
      --ok:           #45C08C;
      --ok-soft:      #12281F;
      --ok-line:      #205742;
      --warn:         #E0A93F;
      --warn-soft:    #2B2314;
      --danger:       #F27078;
      --danger-soft:  #2E1519;
      --burgundy:     #E07A8C;
      --burgundy-soft:#35161D;
      --shadow-sm:    0 1px 2px rgba(0,0,0,.4);
      --shadow-md:    0 4px 16px rgba(0,0,0,.45);
      --shadow-lg:    0 18px 48px rgba(0,0,0,.55);
    }
  }
  :root[data-theme="dark"] {
    --brand:#7C8CFF; --brand-soft:#232A55; --brand-deep:#0B0E22;
    --ink:#EEF0FB; --ink-2:#AEB4D4; --ink-3:#787FA5;
    --ground:#0C0F20; --surface:#14182E; --line:#262C48; --line-strong:#39406A;
    --ok:#45C08C; --ok-soft:#12281F; --ok-line:#205742;
    --warn:#E0A93F; --warn-soft:#2B2314; --danger:#F27078; --danger-soft:#2E1519; --burgundy:#E07A8C; --burgundy-soft:#35161D;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 4px 16px rgba(0,0,0,.45); --shadow-lg:0 18px 48px rgba(0,0,0,.55);
  }
  :root[data-theme="light"] {
    --brand:#2536C4; --brand-soft:#E6E9FB; --brand-deep:#1B2470;
    --ink:#10143A; --ink-2:#4A5074; --ink-3:#7D83A3;
    --ground:#F4F5FA; --surface:#FFFFFF; --line:#E3E5F0; --line-strong:#CDD1E4;
    --ok:#0F9A63; --ok-soft:#E7F6EF; --ok-line:#BFE6D3;
    --warn:#B8791A; --warn-soft:#FDF3E2; --danger:#D93B44; --danger-soft:#FDECEC;
    --shadow-sm:0 1px 2px rgba(16,20,58,.06),0 1px 3px rgba(16,20,58,.04);
    --shadow-md:0 4px 16px rgba(16,20,58,.08),0 1px 3px rgba(16,20,58,.05);
    --shadow-lg:0 18px 48px rgba(16,20,58,.12);
  }

  * { box-sizing: border-box; }

  body {
    margin: 0;
    background: var(--ground);
    color: var(--ink);
    font-family: var(--sans);
    font-size: 15px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
  }

  .app { max-width: 1240px; margin: 0 auto; padding: 20px 20px 40px; }

  /* ---------- Header ---------- */
  .top {
    display: flex; align-items: center; gap: 14px;
    padding: 4px 2px 18px;
    flex-wrap: wrap;
  }
  .logo { display: flex; align-items: center; gap: 10px; }
  .logo-mark {
    width: 34px; height: 34px; border-radius: 10px;
    background: linear-gradient(140deg, var(--brand), var(--brand-deep));
    display: grid; place-items: center; color: #fff; flex: none;
    box-shadow: var(--shadow-sm);
  }
  .logo-name { font-weight: 700; letter-spacing: -.02em; font-size: 17px; }
  .logo-name span { color: var(--brand); }
  .top-sub {
    font-size: 12px; color: var(--ink-3); letter-spacing: .06em;
    text-transform: uppercase; font-weight: 600;
    border-left: 1px solid var(--line-strong); padding-left: 14px; margin-left: 4px;
  }
  .top-actions { margin-left: auto; display: flex; gap: 8px; }

  .ghost-btn {
    font: inherit; font-size: 13px; font-weight: 600;
    color: var(--ink-2); background: var(--surface);
    border: 1px solid var(--line); border-radius: 999px;
    padding: 7px 14px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 6px;
    transition: border-color .15s, color .15s, background .15s;
  }
  .ghost-btn:hover { border-color: var(--line-strong); color: var(--ink); }
  .ghost-btn:focus-visible, .send:focus-visible, .primary:focus-visible,
  .choice:focus-visible, .chip:focus-visible, .drop label:focus-within,
  input:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

  /* ---------- Стартовый экран ---------- */

  .launcher { padding: 10px 0 24px; }
  .launcher[hidden] { display: none; }

  .launcher-head { max-width: 640px; margin: 0 auto 26px; text-align: center; }
  .launcher-head h1 {
    margin: 0; font-size: 27px; line-height: 1.2; letter-spacing: -.02em;
    font-weight: 700; color: var(--ink);
  }
  .launcher-head p { margin: 10px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--ink-2); }

  /* Три в ряд на широком экране, в столбец на узком. Карточки одной высоты:
     разная длина описаний не должна делать один продукт «главнее» другого. */
  .products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  @media (max-width: 900px) { .products { grid-template-columns: minmax(0, 1fr); } }

  .product {
    font: inherit; text-align: left; cursor: pointer;
    display: flex; flex-direction: column;
    background: var(--surface); border: 1px solid var(--line-strong);
    border-radius: var(--r-xl); padding: 22px 20px 18px;
    box-shadow: var(--shadow-sm);
    transition: border-color .18s, box-shadow .18s, transform .14s;
  }
  .product:hover {
    border-color: var(--brand); box-shadow: var(--shadow-md);
    transform: translateY(-3px);
  }
  .product:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }

  .product .ico {
    width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center;
    background: var(--brand-soft); color: var(--brand); margin-bottom: 14px;
  }
  .product h2 { margin: 0; font-size: 17px; font-weight: 680; color: var(--ink); letter-spacing: -.01em; }
  .product .d { margin: 7px 0 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-2); flex: 1 1 auto; }

  .product .points { margin: 13px 0 0; padding: 0; list-style: none; display: grid; gap: 5px; }
  .product .points li {
    font-size: 12.5px; color: var(--ink-2); padding-left: 17px; position: relative; line-height: 1.45;
  }
  .product .points li::before {
    content: ''; position: absolute; left: 4px; top: 7px;
    width: 5px; height: 5px; border-radius: 50%; background: var(--brand);
  }

  .product .go {
    margin-top: 16px; display: inline-flex; align-items: center; gap: 7px;
    font-size: 13.5px; font-weight: 650; color: var(--brand);
  }
  .product:hover .go svg { transform: translateX(3px); }
  .product .go svg { transition: transform .16s; }

  .product .badge {
    align-self: flex-start; margin-bottom: 12px;
    font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
    padding: 3px 8px; border-radius: 6px; background: var(--ground); color: var(--ink-3);
  }
  .product .badge.ok { background: var(--ok-soft); color: var(--ok); }
  /* «бета-тестирование» — плашка сверху по центру карточки: сервис ещё
     дорабатывается, и это должно быть видно сразу (20.09.2026) */
  .product .beta-flag {
    position: absolute; top: 13px; left: 50%; transform: translateX(-50%);
    font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
    padding: 4px 10px; border-radius: 999px; white-space: nowrap;
    background: var(--warn-soft); color: var(--warn);
  }

  /* Пометка «чаще всего берут» в углу карточки. Абсолютом, а не в потоке:
     иначе она сдвинула бы иконку и разъехалась бы сетка карточек, у
     которых пометки нет. */
  .product { position: relative; }
  /* Список загруженных файлов под кнопкой. Показываем всё, что отправлено,
     включая непринятое: клиент должен видеть, что именно не дошло, — иначе он
     решит, что загрузил восемь файлов, а разбор пойдёт по семи. */
  .pile-list { display: grid; gap: 4px; margin-top: 8px; }
  .pile-item {
    display: flex; justify-content: space-between; gap: 10px;
    font-size: 12.5px; color: var(--ink-2);
    padding: 5px 10px; border-radius: 8px; background: var(--ground);
  }
  .pile-item span:last-child { color: var(--ink-3); white-space: nowrap; }
  .pile-item.bad { background: var(--bad-soft, #fdeaea); color: var(--bad, #b42318); }

  .top-flag {
    position: absolute; top: 13px; right: 13px;
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 11px; font-weight: 700; letter-spacing: .06em;
    padding: 3px 9px 3px 7px; border-radius: 999px;
    background: var(--ground); color: var(--ink-2);
  }
  /* Огонёк крупнее подписи: он тут и есть знак, а «TOP» при нём — подпись.
     Вровень по базовой линии его не поставить — эмодзи сидит выше, — поэтому
     выравниваем по центру и слегка опускаем. */
  .top-flag .fire { font-size: 17px; line-height: 1; transform: translateY(1px); }

  .launcher-foot {
    margin: 22px auto 0; max-width: 720px; text-align: center;
    font-size: 12px; line-height: 1.6; color: var(--ink-3);
  }

  /* ---------- Восстановленная переписка ---------- */

  /* Прошлый разговор показываем приглушённым и неактивным: кнопки в нём уже
     нажаты, поля отвечены. Живой — только то, что ниже разделителя. */
  .msg.replayed .bubble { opacity: .72; }
  .msg.replayed .widget,
  .msg.replayed .choice,
  .msg.replayed button:not([data-risk-more]) { pointer-events: none; }
  .msg.replayed .widget { filter: grayscale(.35); }

  /* «Заявка открыта из истории» — последняя тонированная панель в переписке.
     Синим полем она была из той же поры, что и зелёная карточка подтянутых
     данных, и по той же причине сбивала: цвет обещал важность, которой в
     служебной строке нет. Заказчик 03.09.2026: «везде меняй на белый, новый
     дизайн». */
  .resumed {
    display: block; padding: 10px 14px; border-radius: var(--r-md);
    background: var(--surface); border: 1px solid var(--line);
    color: var(--ink-2); font-size: 13px; line-height: 1.5;
  }
  .resumed b { color: var(--ink); }

  /* ---------- История запросов ---------- */

  .history { margin-top: 28px; }
  .history[hidden] { display: none; }
  /* Название компании в истории — не больше трёх строк: у совместных
     закупок в этом поле список из сорока учреждений.

     Обрезка висит на внутреннем элементе, а не на самой ячейке. На ячейке
     она ломала строку: `display:-webkit-box` выбивает `td` из табличной
     раскладки, и ячейка переставала слушаться `vertical-align` — название
     липло к верху строки, пока соседние поля стояли по центру, а нижняя
     граница шла обрывком. */
  .history td.org, .acc-history td.org { max-width: 320px; }
  .history td.org span, .acc-history td.org span {
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Стоимость запроса: итог строкой, разбор по сервисам под ним мелко.
     Итог отвечает на «сколько», разбор — на «за что», и второе не должно
     спорить с первым за внимание. */
  /* Итог запроса — не больше трёх строк, как и название компании. В нём
     лежит предмет закупки, а он бывает на абзац: «Поставка хозяйственных
     товаров для нужд учреждений ВАО г. Москвы в 2027-2028 годах (совместная
     закупка)». Без обрезки одна такая строка вытягивала всю таблицу.

     Обрезка на внутреннем элементе, а не на ячейке: `display:-webkit-box`
     выбивает `td` из табличной раскладки — та же грабля, что с `td.org`. */
  .history td.res, .acc-history td.res { max-width: 280px; }
  .history td.res span, .acc-history td.res span {
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .history td.spend, .acc-history td.spend { white-space: nowrap; }
  .history .spend-total, .acc-history .spend-total {
    display: block; font-weight: 650; color: var(--ink);
    font-variant-numeric: tabular-nums;
  }
  .history .spend-parts, .acc-history .spend-parts { display: block; margin-top: 2px; }
  .history .spend-part, .acc-history .spend-part {
    display: block; font-size: 11.5px; color: var(--ink-3);
    font-variant-numeric: tabular-nums;
  }

  /* Строка заявки, которую считают прямо сейчас. Метка нужна, чтобы её не
     приняли за прежнюю: в таблице «раньше вы здесь считали» она стоит первой
     и от соседних ничем не отличается. */
  .history tbody tr.now, .acc-history tbody tr.now { background: var(--brand-soft); }
  .history .now-tag, .acc-history .now-tag {
    display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
    background: var(--brand); color: #fff; font-size: 10px; font-weight: 700;
    letter-spacing: .02em; vertical-align: 1px;
  }

  .history-more {
    display: block; width: 100%; margin-top: 10px; padding: 11px;
    border: 1px solid var(--line-strong); border-radius: var(--r-md);
    background: var(--surface); font: inherit; font-size: 13px; font-weight: 650;
    color: var(--brand); cursor: pointer;
  }
  .history-more:hover { background: var(--brand-soft); }

  /* Вкладки истории: общая и отдельная по гарантиям */
  .htabs { display: flex; gap: 8px; margin: 0 0 14px; flex-wrap: wrap; }
  .ht {
    font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
    display: inline-flex; align-items: center; gap: 7px;
    padding: 7px 14px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
  }
  .ht:hover { border-color: var(--line-strong); }
  .ht span {
    font-size: 11.5px; font-weight: 700; color: var(--ink-3);
    background: var(--ground); border-radius: 999px; padding: 1px 7px;
  }
  .ht.on { background: var(--brand); border-color: var(--brand); color: #fff; }
  .ht.on span { background: rgba(255,255,255,.22); color: #fff; }
  @media (prefers-color-scheme: dark) {
    .ht.on { color: #0B0E22; }
    .ht.on span { background: rgba(0,0,0,.18); color: #0B0E22; }
  }
  :root[data-theme="light"] .ht.on { color: #fff; }
  :root[data-theme="light"] .ht.on span { background: rgba(255,255,255,.22); color: #fff; }

  /* Заголовок и таблица гарантий */
  .history .history-h {
    display: flex; align-items: baseline; gap: 10px; margin: 0 0 12px;
  }
  .history .history-h b { font-size: 15px; font-weight: 680; color: var(--ink); }
  .history .history-h span { font-size: 12.5px; color: var(--ink-3); }

  .history .tbl-wrap {
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-lg); box-shadow: var(--shadow-sm); overflow-x: auto;
  }
  .htbl.bg { width: 100%; border-collapse: collapse; font-size: 13px; }
  .htbl.bg th.r, .htbl.bg td.r { text-align: right; }
  .htbl.bg td.money { font-variant-numeric: tabular-nums; font-weight: 650; white-space: nowrap; }
  .htbl.bg td.term { font-size: 12px; color: var(--ink-2); line-height: 1.4; }
  /* 170, а не 220: в строке совместной закупки под нашим юр. лицом стоит ещё
     и заказчик, и при 220 таблица переставала помещаться — правый край с
     сроком и днями уходил за границу. Имена длиннее обрезаются многоточием,
     полное видно в подсказке. */
  .htbl.bg td.org { max-width: 170px; }
  /* У совместной закупки в строке два имени: наше юр. лицо и заказчик, на
     которого выпускается именно эта гарантия. Второе — мельче. */
  .htbl.bg td.org .who {
    display: block; font-size: 11.5px; color: var(--ink-3); margin-top: 2px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .htbl.bg .nowrap { white-space: nowrap; }
  /* Раздел «Заявки»: предмет закупки — не больше двух строк, полный текст в
     подсказке; длинный предмет растягивал строку на восемь строк (15.09.2026) */
  .htbl.bg.bids td.subj { min-width: 220px; max-width: 320px; }
  .htbl.bg.bids td.subj span {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; line-height: 1.4;
  }
  .htbl.bg.bids td.res { min-width: 200px; font-size: 12.5px; line-height: 1.4; }

  /* Статус — плашкой, как в основном сервисе: цвет тут несёт смысл, а не
     украшает, и по нему строку находят глазами. */
  .hst {
    display: inline-block; padding: 3px 10px; border-radius: 8px;
    font-size: 11.5px; font-weight: 650; white-space: nowrap;
  }
  .hst.draft { background: var(--ground); color: var(--ink-3); }
  .hst.work { background: #FDECC8; color: #7A5B00; }
  .hst.offer { background: var(--brand-soft); color: var(--brand); }
  .hst.done { background: #DCF0E4; color: #1E6B42; }

  .history-empty {
    font-size: 13px; color: var(--ink-3); margin: 0;
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-lg); padding: 18px;
  }

  .history-head {
    display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
    margin: 0 0 12px;
  }
  .history-head h2 { margin: 0; font-size: 15px; font-weight: 680; color: var(--ink); }
  .history-head .sub { font-size: 12.5px; color: var(--ink-3); }

  /* Таблица шире экрана на телефоне — крутим её саму, а не страницу. */
  .history-wrap {
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-lg); box-shadow: var(--shadow-sm); overflow-x: auto;
  }
  .history table, .acc-history table { width: 100%; border-collapse: collapse; font-size: 13px; }
  .history th, .acc-history th {
    text-align: left; font-weight: 650; color: var(--ink-3);
    font-size: 11.5px; letter-spacing: .04em; text-transform: uppercase;
    padding: 11px 14px; border-bottom: 1px solid var(--line); white-space: nowrap;
  }
  .history td, .acc-history td {
    padding: 11px 14px; border-bottom: 1px solid var(--line);
    color: var(--ink); vertical-align: middle;
  }
  .history tr:last-child td, .acc-history tr:last-child td { border-bottom: none; }
  .history tbody tr, .acc-history tbody tr { cursor: pointer; transition: background .14s; }
  .history tbody tr:hover, .acc-history tbody tr:hover { background: var(--brand-soft); }
  .history .num, .acc-history .num { font-variant-numeric: tabular-nums; white-space: nowrap; }
  .history .dim, .acc-history .dim { color: var(--ink-3); }
  .history .mono, .acc-history .mono { font-family: var(--mono); font-size: 12px; }

  .history .kind, .acc-history .kind {
    display: inline-block; padding: 3px 9px; border-radius: 999px;
    font-size: 11.5px; font-weight: 650; white-space: nowrap;
    background: var(--ground); color: var(--ink-2);
  }
  .history .kind.tender, .acc-history .kind.tender { background: var(--brand-soft); color: var(--brand); }
  .history .kind.counterparty, .acc-history .kind.counterparty { background: var(--warn-soft); color: var(--warn); }
  .history .kind.guarantee, .acc-history .kind.guarantee { background: var(--ok-soft); color: var(--ok); }

  .history .open, .acc-history .open { color: var(--brand); font-weight: 650; white-space: nowrap; }

  /* ---------- Layout ---------- */
  .grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, .85fr);
    gap: 20px; align-items: start;
  }
  /* `display: grid` сильнее браузерного правила для [hidden] — без этой
     строки скрытый чат остаётся на экране под витриной. */
  .grid[hidden] { display: none; }
  @media (max-width: 940px) { .grid { grid-template-columns: minmax(0,1fr); } }

  .panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-xl);
    box-shadow: var(--shadow-md);
    overflow: hidden;
  }

  /* ---------- Stepper ---------- */
  .rail {
    display: flex; align-items: center; gap: 8px;
    padding: 14px 20px; border-bottom: 1px solid var(--line);
    background: var(--surface); flex-wrap: wrap;
    min-height: 57px;
  }
  .rail-title { font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); margin-right: 4px; }
  .step {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: 13px; font-weight: 600; color: var(--ink-3);
    padding: 5px 12px 5px 6px; border-radius: 999px;
    border: 1px solid transparent; transition: all .3s ease;
  }
  .step .dot {
    width: 20px; height: 20px; border-radius: 50%;
    display: grid; place-items: center; flex: none;
    font-size: 11px; font-weight: 700;
    background: var(--ground); color: var(--ink-3);
    border: 1px solid var(--line-strong);
    transition: all .3s ease;
  }
  .step.active { color: var(--brand); background: var(--brand-soft); border-color: transparent; }
  .step.active .dot { background: var(--brand); color: #fff; border-color: var(--brand); }
  .step.done { color: var(--ok); }
  .step.done .dot { background: var(--ok-soft); color: var(--ok); border-color: var(--ok-line); }
  .rail-sep { width: 14px; height: 1px; background: var(--line-strong); }
  @media (max-width: 560px) { .rail-sep { display: none; } }

  /* ---------- Chat ---------- */
  .chat {
    height: min(66vh, 640px); min-height: 420px;
    overflow-y: auto; overflow-x: hidden;
    padding: 22px 20px 8px;
    display: flex; flex-direction: column; gap: 14px;
    scroll-behavior: smooth;
  }
  @media (prefers-reduced-motion: reduce) { .chat { scroll-behavior: auto; } }

  .msg { display: flex; gap: 10px; max-width: 100%; animation: rise .34s cubic-bezier(.2,.7,.3,1) both; }
  @keyframes rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { .msg, .row-in { animation: none !important; } }

  .avatar {
    width: 30px; height: 30px; border-radius: 9px; flex: none;
    background: linear-gradient(140deg, var(--brand), var(--brand-deep));
    display: grid; place-items: center; color: #fff; margin-top: 2px;
  }
  .bubble {
    background: var(--ground);
    border: 1px solid var(--line);
    border-radius: 4px 16px 16px 16px;
    padding: 11px 15px; max-width: 90%;
  }
  .bubble p { margin: 0; }
  .bubble p + p { margin-top: 8px; }
  .bubble b { font-weight: 650; }
  .bubble .muted { color: var(--ink-2); font-size: 13.5px; }

  /* Кнопка в реплике бота. Строчной она липла к тексту сверху, а снизу
     наоборот отращивала лишний зазор: строчный элемент тянет за собой место
     под базовую линию, и реплика выглядела съехавшей. */
  .bubble .primary {
    display: block; margin-top: 12px;
    padding: 9px 16px; font-size: 13.5px;
  }

  .msg.me { flex-direction: row-reverse; }
  .msg.me .bubble {
    background: var(--brand); border-color: var(--brand); color: #fff;
    border-radius: 16px 4px 16px 16px;
    font-variant-numeric: tabular-nums;
  }
  :root[data-theme="dark"] .msg.me .bubble,
  .msg.me .bubble { color: #fff; }
  @media (prefers-color-scheme: dark) { .msg.me .bubble { background: #3B49B8; border-color: #3B49B8; } }
  :root[data-theme="dark"] .msg.me .bubble { background: #3B49B8; border-color: #3B49B8; }
  :root[data-theme="light"] .msg.me .bubble { background: var(--brand); border-color: var(--brand); }
  .msg.me .avatar { background: var(--line-strong); color: var(--ink-2); font-size: 12px; font-weight: 700; }

  .typing { display: flex; gap: 4px; padding: 4px 2px; }
  .typing i {
    width: 6px; height: 6px; border-radius: 50%; background: var(--ink-3);
    animation: blink 1.2s infinite ease-in-out;
  }
  .typing i:nth-child(2) { animation-delay: .18s; }
  .typing i:nth-child(3) { animation-delay: .36s; }
  @keyframes blink { 0%,60%,100% { opacity: .25; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

  /* Панель долгого ожидания: шаг, часы и список того, что делаем. Ширину
     держим фиксированной — иначе пузырь дёргается на каждом шаге. */
  .wait { min-width: min(340px, 72vw); max-width: 100%; }
  .wait-h { display: flex; align-items: center; gap: 8px; }
  /* Название шага должно ужиматься и переноситься, а часы — нет.
     Заказчик 27.08.2026 на телефоне: «время справа чуть уехало». Уезжало
     потому, что у flex-элемента ширина по умолчанию не меньше содержимого:
     «Извлекаю текст, сканы распознаю» в одну строку занимало почти весь
     пузырь и выталкивало часы за край. min-width: 0 разрешает перенос. */
  .wait-now { flex: 1 1 auto; min-width: 0; font-weight: 650; font-size: 14px; }
  .wait-t {
    flex: none; margin-left: auto; font-family: var(--mono); font-size: 12.5px;
    color: var(--ink-3); font-variant-numeric: tabular-nums;
  }
  /* На узком экране панель занимает пузырь целиком: 340 пикселей минимума
     вместе с аватаром и полями чата в 390 не помещаются. */
  @media (max-width: 560px) { .wait { min-width: 0; width: 100%; } }
  .wait-spin {
    width: 13px; height: 13px; flex: none; border-radius: 50%;
    border: 2px solid var(--brand-soft); border-top-color: var(--brand);
    animation: waitspin .8s linear infinite;
  }
  @keyframes waitspin { to { transform: rotate(360deg); } }

  .wait-bar {
    height: 3px; margin: 9px 0 10px; border-radius: 2px;
    background: var(--line); overflow: hidden;
  }
  .wait-bar i {
    display: block; height: 100%; width: 6%; border-radius: 2px;
    background: var(--brand); transition: width .5s ease;
  }

  .wait-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
  .wait-steps li {
    position: relative; padding-left: 20px;
    font-size: 13px; color: var(--ink-3); line-height: 1.35;
  }
  /* Кружок слева: пустой — впереди, с точкой — идёт, галочка — пройдено. */
  .wait-steps li::before {
    content: ''; position: absolute; left: 3px; top: 5px;
    width: 8px; height: 8px; border-radius: 50%;
    border: 1.5px solid var(--line-strong, var(--line)); box-sizing: border-box;
  }
  .wait-steps li.now { color: var(--ink); font-weight: 600; }
  .wait-steps li.now::before { border-color: var(--brand); background: var(--brand); }
  .wait-steps li.done { color: var(--ink-2); }
  .wait-steps li.done::before {
    border-color: var(--brand); background: var(--brand);
  }
  .wait-steps li.done::after {
    content: ''; position: absolute; left: 5.5px; top: 7px;
    width: 3px; height: 6px; box-sizing: border-box;
    border: solid #fff; border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
  }
  .wait-note {
    margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--line);
    font-size: 12.5px; color: var(--ink-3);
  }
  /* Пустое примечание не должно оставлять черту: до объяснения там ничего нет */
  .wait-note:empty { display: none; }
  /* Объяснение задержки заметнее общего текста: человек его ждёт, а не читает
     мимоходом — он на второй минуте гадает, не зависло ли всё. */
  .wait-note.wait-why { color: var(--ink-2); font-weight: 500; }

  /* ---------- Inline widgets ---------- */
  .widget { margin-top: 12px; }
  .widget.locked { opacity: .55; pointer-events: none; }

  .field-label { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 6px; }
  .field-row { display: flex; gap: 8px; flex-wrap: wrap; }
  .field-row input {
    flex: 1 1 220px; min-width: 0;
    font: inherit; font-family: var(--mono); font-size: 14px; letter-spacing: .02em;
    padding: 11px 14px; border-radius: var(--r-md);
    border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink);
    transition: border-color .15s, box-shadow .15s;
  }
  .field-row input::placeholder { color: var(--ink-3); letter-spacing: normal; }
  .field-row input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); outline: none; }
  /* Уточняющее поле: меньше основных параметров, чтобы не спорить с ними
     за внимание. */
  .f.small { margin-top: 14px; }
  .f.small label { font-size: 12.5px; color: var(--ink-2); }
  .f.small input { padding: 8px 11px; font-size: 13px; }
  .f.small .hint { font-size: 11.5px; }

  .field-row input.bad { border-color: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
  .field-row input.plain { font-family: var(--sans); }

  .primary {
    font: inherit; font-weight: 650; font-size: 14px;
    background: var(--brand); color: #fff; border: 1px solid var(--brand);
    padding: 11px 20px; border-radius: var(--r-md); cursor: pointer;
    transition: filter .15s, transform .06s;
  }
  .primary:hover { filter: brightness(1.08); }
  .primary:active { transform: translateY(1px); }
  .primary[disabled] { opacity: .45; cursor: not-allowed; }
  @media (prefers-color-scheme: dark) { .primary { color: #0B0E22; } }
  :root[data-theme="dark"] .primary { color: #0B0E22; }
  :root[data-theme="light"] .primary { color: #fff; }

  .err { color: var(--danger); font-size: 13px; margin-top: 7px; display: none; }
  .err.on { display: block; }
  .hint { color: var(--ink-3); font-size: 12.5px; margin-top: 7px; }

  .chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 9px; }
  .chip.num { font-family: var(--mono); }
  .chip {
    font: inherit; font-size: 12.5px; font-weight: 600;
    background: var(--surface); border: 1px dashed var(--line-strong); color: var(--ink-2);
    padding: 5px 11px; border-radius: 999px; cursor: pointer;
  }
  .chip:hover { border-color: var(--brand); color: var(--brand); border-style: solid; }

  /* Подсказка из профиля: рядом крестик, чтобы убрать её насовсем.
     Крестик показывается по наведению и по фокусу с клавиатуры — иначе он
     стоит в глазах у всех подсказок сразу и спорит с самим номером. */
  .chipw { display: inline-flex; align-items: center; position: relative; }
  .chipw.dropable .chip { padding-right: 26px; }

  /* Название юрлица бывает длинным — обрезаем строкой, полное висит
     подсказкой вместе с ИНН. */
  /* Юр. лица в кабинете */
  .acc-inns { display: grid; gap: 6px; margin-bottom: 6px; }
  .acc-inn {
    display: flex; align-items: center; gap: 10px;
    border: 1px solid var(--line); border-radius: var(--r-md);
    padding: 8px 10px 8px 12px;
  }
  .acc-inn > div { flex: 1; min-width: 0; }
  .acc-inn b {
    display: block; font-size: 13px; font-weight: 650; color: var(--ink);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .acc-inn span { font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
  .acc-x {
    flex: none; font: inherit; font-size: 17px; line-height: 1;
    width: 24px; height: 24px; display: grid; place-items: center;
    border: 0; border-radius: 999px; background: none; color: var(--ink-3); cursor: pointer;
  }
  .acc-x:hover { background: var(--ground); color: var(--warn); }

  .chipw .chip {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .chipx {
    position: absolute;
    right: 4px;
    font: inherit;
    font-size: 15px;
    line-height: 1;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 999px;
    background: none;
    color: var(--ink-3);
    cursor: pointer;
    opacity: 0;
    transition: opacity .12s, color .12s, background .12s;
  }

  .chipw:hover .chipx,
  .chipx:focus-visible { opacity: 1; }
  .chipx:hover { color: var(--stop, #B3261E); background: var(--ground); }

  /* На касании наведения нет — крестик виден сразу. */
  @media (hover: none) { .chipx { opacity: .6; } }

  .choices { display: grid; gap: 10px; margin-top: 12px; }
  .choice {
    font: inherit; text-align: left; cursor: pointer;
    background: var(--surface); border: 1px solid var(--line-strong);
    border-radius: var(--r-lg); padding: 14px 16px;
    display: grid; grid-template-columns: 34px 1fr; gap: 13px; align-items: start;
    transition: border-color .18s, box-shadow .18s, transform .12s;
  }
  .choice:hover { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); transform: translateY(-1px); }
  .choice .ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); }
  .choice .t { display: block; font-weight: 650; color: var(--ink); }
  .choice .d { display: block; font-size: 13px; color: var(--ink-2); margin-top: 3px; }
  .choice .tag {
    display: inline-block; margin-top: 8px; font-size: 11px; font-weight: 700;
    letter-spacing: .05em; text-transform: uppercase;
    padding: 3px 8px; border-radius: 6px; background: var(--ground); color: var(--ink-3);
  }
  .choice .tag.ok { background: var(--ok-soft); color: var(--ok); }
  .choice .tag.accent { background: var(--brand-soft); color: var(--brand); }
  .choice .tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
  .choice .tags .tag { margin-top: 0; }

  /* ---------- Pulled data card (integration) ----------

     Белая, как карточка компании и всё остальное в переписке. Зелёным полем
     она была с тех пор, когда цветной блок означал «данные подтянулись сами».
     Рядом с новыми карточками это читалось как другой источник или другой
     род сообщения, хотя ни то ни другое не менялось. Заказчик 03.09.2026:
     «давай дизайн обновим на белый, как и все».

     Зелёной осталась одна галочка — ровно то, что здесь нужно заметить
     по диагонали: параметры зафиксированы. Так же, как в карточке компании
     цветом горит только метка «действующее». */
  .pulled {
    margin-top: 12px; border: 1px solid var(--line); background: var(--surface);
    border-radius: var(--r-lg); padding: 14px 16px;
  }
  .pulled-head {
    display: flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 700;
    letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3);
    margin-bottom: 10px;
  }
  .pulled-head svg { color: var(--ok); flex-shrink: 0; }
  .pulled dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 5px 14px; font-size: 13.5px; }
  .pulled dt { color: var(--ink-2); white-space: nowrap; }
  .pulled dd { margin: 0; color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

  /* Карточка компании из ЕГРЮЛ.
     Название — заголовок, а не строка таблицы: ради него человек и вводил ИНН.
     Номера сведены в одну тихую строку — их сверяют, а не читают. Статус
     вынесен меткой и краснеет, когда компания не действующая: это здесь
     единственное, что нужно заметить даже по диагонали. */
  .cocard {
    margin-top: 12px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: var(--r-lg);
    padding: 14px 16px;
  }

  .cc-top {
    display: flex; align-items: baseline; gap: 10px;
    flex-wrap: wrap; margin-bottom: 3px;
  }

  .cc-name {
    font-size: 15px; font-weight: 700; color: var(--ink);
    line-height: 1.3; overflow-wrap: anywhere;
  }

  .cc-state {
    margin-left: auto; flex-shrink: 0;
    font-size: 11px; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase;
    padding: 3px 8px; border-radius: 999px;
    color: var(--ok); background: var(--ok-soft);
  }
  .cc-state.bad { color: var(--danger); background: var(--danger-soft); }

  .cc-ids {
    font-size: 12px; color: var(--ink-3);
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere; margin-bottom: 9px;
  }

  .cc-row {
    display: grid; grid-template-columns: 13px 1fr; gap: 9px;
    align-items: start; margin-top: 6px;
    font-size: 13px; line-height: 1.45; color: var(--ink);
  }
  .cc-row svg { margin-top: 3px; color: var(--ink-3); }
  .cc-row .cc-post { color: var(--ink-2); }

  .cc-src {
    margin-top: 11px; padding-top: 9px;
    border-top: 1px solid var(--line);
    font-size: 11.5px; color: var(--ink-3);
  }

  /* ---------- Проверка поставщика ----------
     Цветом кодируется только то, что банк действительно так и прочитает:
     стоп — красный, вопрос — жёлтый, чисто — зелёный. «Не проверили» серое,
     но не спрятанное: пустая проверка не должна выглядеть как пройденная. */
  .risk { margin-top: 12px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-lg); overflow: hidden; }
  .risk-head { display: flex; align-items: center; gap: 9px; padding: 12px 15px; border-bottom: 1px solid var(--line); }
  .risk-head .v { font-size: 13.5px; font-weight: 700; color: var(--ink); }
  .risk-head .who { font-size: 11.5px; color: var(--ink-3); margin-left: auto; white-space: nowrap; }
  .risk.stop .risk-head { background: var(--danger-soft); }
  .risk.attention .risk-head { background: var(--warn-soft); }
  .risk.ok .risk-head { background: var(--ok-soft); }

  /* `display: grid` сильнее браузерного правила для [hidden] — без второй
     строки свёрнутые проверки видны все и кнопка «показать остальные»
     разворачивает уже развёрнутое. Та же ловушка, что и у `.grid` выше. */
  .risk-list { display: grid; }
  .risk-list[hidden] { display: none; }
  .risk-item { display: grid; grid-template-columns: 8px 1fr; gap: 10px; padding: 10px 15px; border-top: 1px solid var(--line); font-size: 13px; }
  .risk-list .risk-item:first-child { border-top: none; }
  .risk-item .dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; background: var(--ink-3); }
  .risk-item.stop .dot { background: var(--danger); }
  .risk-item.attention .dot { background: var(--warn); }
  .risk-item.ok .dot { background: var(--ok); }
  .risk-item .t { font-weight: 650; color: var(--ink); }
  .risk-item .s { color: var(--ink-2); }
  .risk-item .by { color: var(--ink-3); font-size: 11.5px; }
  .risk-item ul { margin: 5px 0 0; padding-left: 16px; color: var(--ink-2); font-size: 12.5px; }

  .risk-more {
    width: 100%; border: none; border-top: 1px solid var(--line); background: transparent;
    padding: 10px; font: inherit; font-size: 12.5px; color: var(--brand); cursor: pointer;
  }
  .risk-more:hover { background: var(--ground); }
  .risk-foot { padding: 10px 15px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-3); }

  /* ---------- Разбор проверки ----------
     Панель рисков цветная, разбор — нет: цвет там кодирует статус реестра,
     то есть факт, а здесь идёт мнение модели, и красить его так же значит
     выдавать одно за другое. Остаётся только точка слева — она связывает
     пункт с той же строкой в панели выше. */
  .rd { margin-top: 12px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-lg); overflow: hidden; }
  .rd-head { display: flex; align-items: center; gap: 9px; padding: 12px 15px; border-bottom: 1px solid var(--line); font-size: 13.5px; font-weight: 700; color: var(--ink); }
  .rd-head .who { font-size: 11.5px; font-weight: 500; color: var(--ink-3); margin-left: auto; white-space: nowrap; }
  .rd-sum { margin: 0; padding: 12px 15px; font-size: 13.5px; color: var(--ink); border-bottom: 1px solid var(--line); }
  .rd-t { padding: 10px 15px 0; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
  .rd-list { display: grid; }
  .rd-list[hidden] { display: none; }
  /* Что в плюс — тем же списком, что и минусы, но с зелёной точкой: это тот
   же вес и то же чтение, просто в другую сторону. */
.rd-plus { margin-top: 14px; }
.rd-plus > b { display: block; font-size: 13px; margin-bottom: 6px; color: var(--ink); }

/* Дела — нумерованным списком: у них есть порядок, самое важное первым. */
.rd-todo {
  margin: 6px 0 0; padding-left: 22px; font-size: 14px; line-height: 1.5;
  color: var(--ink-2);
}
.rd-todo li { margin-bottom: 6px; }
.rd-todo li::marker { color: var(--brand); font-weight: 700; }

.rd-item { display: grid; grid-template-columns: 8px 1fr; gap: 10px; padding: 10px 15px; font-size: 13px; }
  .rd-item .dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; background: var(--ink-3); }
  .rd-item.stop .dot { background: var(--danger); }
  .rd-item.attention .dot { background: var(--warn); }
  .rd-item.ok .dot { background: var(--ok); }
  .rd-item .t { font-weight: 650; color: var(--ink); }
  .rd-item .s { color: var(--ink-2); }
  .rd-item .ask { margin-top: 5px; font-size: 12.5px; color: var(--ink-2); border-left: 2px solid var(--line-strong); padding-left: 9px; }
  .rd-item .ask.muted { color: var(--ink-3); }
  .rd-gaps { padding: 11px 15px; border-top: 1px solid var(--line); font-size: 12.5px; color: var(--ink-2); }
  .rd-gaps b { display: block; margin-bottom: 4px; color: var(--ink); font-size: 12px; }
  .rd-gaps ul { margin: 0; padding-left: 16px; }
  .rd-foot { padding: 10px 15px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-3); }

  /* Длинное значение в карточке — две строки и раскрытие по клику. Полное
     название заказчика занимает пять строк и выталкивает всё остальное. */
  .row dd.clip {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; cursor: pointer;
  }
  .row dd.clip::after { content: ' ⌄'; color: var(--ink-3); }
  .row dd.clip.open { -webkit-line-clamp: unset; }
  .row dd.clip.open::after { content: ' ⌃'; }

  /* ---------- Карточка анализа тендера ---------- */
  /* Строки разбора проявляются по очереди — как реплики в чате */
  .row.reveal { animation: rowIn .26s both; }
  @keyframes rowIn { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { .row.reveal { animation: none; } }

  .grp-note { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--ink-3); font-variant-numeric: tabular-nums; }
  .card-note {
    margin: 2px 0 8px; padding: 9px 11px; border-radius: var(--r-md);
    background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 26%, transparent);
    font-size: 12px; line-height: 1.5; color: var(--ink-2);
  }

  .card-wait { padding: 4px 0 2px; font-size: 12.5px; color: var(--ink-3); }
  /* Кнопка расчёта в карточке: узкая колонка, поэтому одной строкой и без
     подписи — общий смысл вынесен под раздел. */
  .card-calc {
    display: block; margin-top: 2px; padding: 0; border: none; background: none;
    font: inherit; font-size: 11.5px; font-weight: 600; color: var(--brand);
    text-align: left; cursor: pointer;
  }
  .card-calc:hover { text-decoration: underline; }
  .card-calc-note { font-size: 11.5px; color: var(--ink-3); line-height: 1.45; }

  .grp-open {
    display: block; width: 100%; margin-top: 10px; padding: 10px 12px;
    border: 1px solid var(--line-strong); border-radius: var(--r-md);
    background: var(--surface); font: inherit; font-size: 13px; font-weight: 650;
    color: var(--brand); text-align: left; cursor: pointer;
  }
  .grp-open:hover { background: var(--brand-soft); }
  .grp-open span { display: block; margin-top: 2px; font-size: 11.5px; font-weight: 500; color: var(--ink-3); }

  /* Вход в разбор из ленты чата. Сам разбор — окном: два десятка условий с
     цитатами читают целиком, а лента для этого не годится. */
  .rt { margin-top: 12px; padding: 14px 15px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); }
  .rt-t { font-size: 14px; font-weight: 700; color: var(--ink); }
  .rt-s { margin: 4px 0 11px; font-size: 13px; color: var(--ink-2); }

  /* ---------- Разбор закупки ----------
     Две колонки: слева что смотрели, справа что нашли. Прочерк справа — это
     ответ «не нашли», а не пустая клетка, поэтому он виден, а не пропущен. */
  .tr { margin-top: 12px; border: 1px solid var(--line); background: var(--surface); border-radius: var(--r-lg); overflow: hidden; }
  /* В окне разбор занимает его целиком: рамка и отступ сверху там лишние */
  .pane > .tr { margin-top: 0; border: none; }
  .pane > .tr > .tr-head { display: none; }
  .tr-head { display: flex; align-items: center; gap: 9px; padding: 12px 15px; border-bottom: 1px solid var(--line); font-size: 13.5px; font-weight: 700; color: var(--ink); }
  .tr-head .who { font-size: 11.5px; font-weight: 500; color: var(--ink-3); margin-left: auto; white-space: nowrap; }

  .tr-group {
    padding: 11px 15px 6px; font-size: 11px; font-weight: 700;
    letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3);
    border-top: 1px solid var(--line); background: var(--ground);
  }
  .tr-group:first-of-type { border-top: none; }

  .tr-row { display: grid; grid-template-columns: 1fr minmax(38%, 44%); gap: 14px; padding: 10px 15px; border-top: 1px solid var(--line); font-size: 13px; }
  .tr-group + .tr-row { border-top: none; }
  .tr-t { font-weight: 650; color: var(--ink); }
  .tr-h { margin-top: 2px; font-size: 12px; color: var(--ink-3); }
  .tr-val .lead { display: block; font-weight: 700; color: var(--ink); margin-bottom: 3px; }
  .tr-val .v { color: var(--ink); }
  .tr-val .lead + .v { color: var(--ink-2); font-size: 12.5px; }
  .tr-val .dash { color: var(--ink-3); cursor: help; }
  .tr-n { margin-top: 4px; font-size: 12.5px; color: var(--ink-2); }
  .tr-s { margin-top: 4px; font-size: 11.5px; color: var(--ink-3); cursor: help; }

  /* Цветом отмечается только сработавший порог. Пока порогов нет, разбор
     одноцветный — и это честно: оценки мы не делали. */
  .tr-row.risk .tr-t { color: var(--danger); }
  .tr-row.attention .tr-t { color: var(--warn); }

  /* Расчёт гарантии — у каждого вида обеспечения свой: человек нажимает
     напротив той строки, которую ему считать, и вид гарантии уезжает вместе
     с номером закупки. */
  .tr-calc {
    display: block; margin-top: 9px; padding: 9px 12px;
    border: 1px solid var(--brand); border-radius: var(--r-md);
    background: var(--brand-soft); font: inherit; font-size: 12.5px;
    font-weight: 650; color: var(--brand); text-align: left; cursor: pointer;
  }
  .tr-calc:hover { background: var(--brand); color: #fff; }
  @media (prefers-color-scheme: dark) { .tr-calc:hover { color: #0B0E22; } }
  :root[data-theme="dark"] .tr-calc:hover { color: #0B0E22; }
  :root[data-theme="light"] .tr-calc:hover { color: #fff; }
  .tr-calc span { display: block; margin-top: 1px; font-size: 11.5px; font-weight: 500; opacity: .75; }

  .tr-list { margin: 6px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--ink-2); }
  .tr-list[hidden] { display: none; }
  .tr-val .risk-more { border: none; padding: 4px 0; text-align: left; width: auto; }

  .tr-docs { padding: 4px 15px 12px; font-size: 12.5px; color: var(--ink-2); }
  .tr-docs[hidden] { display: none; }
  .tr-docs ul { margin: 0; padding-left: 16px; }
  .tr-docs p { margin: 7px 0 0; color: var(--ink-3); }
  .tr-foot { padding: 10px 15px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ink-3); }

  @media (max-width: 620px) {
    .tr-row { grid-template-columns: 1fr; gap: 4px; }
  }

  /* ---------- Проверка контрагента окном ----------
     Разделы свёрстаны теми же строками, что и разбор закупки: слева что
     смотрели, справа что увидели и кто это сказал. Отличий три — подпись под
     заголовком раздела, оценка проверки шапкой над фактами и раздел, которому
     не хватает источника: он не прячется, а говорит, какого именно. */
  .dv-hint {
    display: block; margin-top: 3px; font-size: 11.5px; font-weight: 500;
    letter-spacing: 0; text-transform: none; color: var(--ink-3);
  }

  .dv-verdict {
    padding: 9px 15px; border-top: 1px solid var(--line);
    font-size: 12.5px; color: var(--ink-2); background: var(--ground);
  }
  .dv-verdict b { color: var(--ink); }
  .dv-verdict.stop { background: var(--danger-soft); }
  .dv-verdict.stop b { color: var(--danger); }
  .dv-verdict.attention { background: var(--warn-soft); }
  .dv-verdict.attention b { color: var(--warn); }

  /* Статус строки словами, а не только цветом: «требует внимания» и «источник
     не подключён» — разные вещи, и по одному оттенку их не отличить. */
  .dv-mark { margin-top: 4px; font-size: 11.5px; font-weight: 650; color: var(--ink-3); }
  .dv-mark.stop { color: var(--danger); }
  .dv-mark.attention { color: var(--warn); }
  .dv-mark.ok { color: var(--ok); }

  .dv-need {
    margin: 0 15px 12px; padding: 10px 13px;
    border: 1px dashed var(--line-strong); border-radius: var(--r-md);
    font-size: 12.5px; color: var(--ink-2); background: var(--ground);
  }
  .dv-need.silent { border-style: solid; border-color: var(--warn); color: var(--ink-2); }

  .dv-take { padding: 12px 15px 4px; }

  /* Плотность. Проверка контрагента — это тридцать разделов подряд, и воздух,
     уместный в разборе закупки, здесь превращается в бесконечную прокрутку.
     Строки ужимаем. Подпись источника под значением пока остаётся: заказчик
     смотрит, откуда взялся каждый факт, — уберём её в самом конце, и тогда
     раздел станет ещё короче. */
  .overlay.dossier .tr-row { padding: 7px 15px; font-size: 12.5px; align-items: baseline; }
  .overlay.dossier .tr-group { padding: 9px 15px 5px; }
  .overlay.dossier .tr-h { font-size: 11.5px; }
  .overlay.dossier .tr-list { margin-top: 4px; font-size: 12px; }
  .overlay.dossier .tr-s { margin-top: 2px; font-size: 11px; }
  .overlay.dossier .dv-mark { margin-top: 2px; }
  .overlay.dossier .dv-need { margin: 0 15px 10px; padding: 8px 12px; }
  .overlay.dossier .mchips { padding: 12px 15px 4px; }
  .overlay.dossier .mchip { min-width: 96px; padding: 7px 12px; }
  .overlay.dossier .stages { padding: 10px 15px; }

  /* ---------- Графики ----------
     Один ряд — один график, поэтому легенды нет: подпись сверху и называет
     ряд. Цифра стоит у последнего столбца — он и есть ответ «сколько сейчас»;
     остальные значения приходят подсказкой при наведении. */
  .dv-charts {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 14px; padding: 12px 15px 4px;
  }
  .dv-chart { margin: 0; }
  .dv-chart figcaption {
    font-size: 11px; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase; color: var(--ink-3); margin-bottom: 6px;
  }
  .dv-chart svg { width: 100%; height: auto; display: block; overflow: visible; }
  .ch-b { fill: var(--brand); }
  .ch-b.down { fill: var(--danger); }
  .ch-zero { stroke: var(--line-strong); stroke-width: 1; }
  .ch-x { fill: var(--ink-3); font-size: 9px; text-anchor: middle; }
  .ch-v { fill: var(--ink); font-size: 10px; font-weight: 700; text-anchor: middle; }
  .ch-up { fill: var(--ok); font-size: 9px; font-weight: 700; text-anchor: middle; }
  .ch-down { fill: var(--danger); font-size: 9px; font-weight: 700; text-anchor: middle; }

  /* ---------- Таблицы раздела ----------
     Суммы вправо и табличными цифрами: разряды встают друг под другом, и
     величины сравниваются без чтения. Шапка липкая — у списка закупок сто
     строк, и без неё к третьему экрану непонятно, где какая колонка. */
  .dv-table { margin: 10px 15px 14px; }
  .dv-table-head {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-bottom: 7px;
  }
  .dv-table-t {
    font-size: 11px; font-weight: 700; letter-spacing: .04em;
    text-transform: uppercase; color: var(--ink-3);
  }
  .dv-table-n { font-size: 12px; color: var(--ink-2); }
  /* Второе поле поиска — в таблицах реестров. Вид у него был свой: прямые
     углы и рамка без лупы. Приводим к тому же, что и `.find`: два поля с
     одной работой на одном экране обязаны выглядеть одинаково. */
  .dv-find {
    margin-left: auto; min-width: 240px; flex: 1 1 240px;
    padding: 7px 12px 7px 32px; font: inherit; font-size: 12.5px;
    border: 1px solid var(--line); border-radius: 999px;
    background: var(--surface); color: var(--ink);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23838AA6' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.6-3.6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: 11px 50%;
    transition: border-color .14s, box-shadow .14s;
    -webkit-appearance: none; appearance: none;
  }
  .dv-find::placeholder { color: var(--ink-3); }
  .dv-find:hover { border-color: var(--line-strong); }
  .dv-find:focus {
    outline: none; border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
  }
  .dv-find::-webkit-search-cancel-button {
    -webkit-appearance: none; appearance: none;
    width: 13px; height: 13px; cursor: pointer;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%23838AA6' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center/contain no-repeat;
  }

  .dv-table-wrap {
    max-height: 420px; overflow: auto;
    border: 1px solid var(--line); border-radius: var(--r-md);
  }
  .dv-table table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
  .dv-table th {
    position: sticky; top: 0; z-index: 1;
    background: var(--ground); text-align: left; font-weight: 700;
    font-size: 11px; letter-spacing: .03em; text-transform: uppercase;
    color: var(--ink-3); padding: 8px 12px; white-space: nowrap;
    border-bottom: 1px solid var(--line);
  }
  .dv-table td {
    padding: 7px 12px; border-top: 1px solid var(--line);
    color: var(--ink-2); vertical-align: top;
  }
  .dv-table tbody tr:first-child td { border-top: none; }
  .dv-table tbody tr:hover td { background: var(--ground); }
  .dv-table tr[hidden] { display: none; }
  .dv-table .num {
    text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap;
    color: var(--ink);
  }
  .dv-table td:first-child { color: var(--ink); font-weight: 600; }
  .dv-table tr.accent td {
    background: var(--brand-soft); font-weight: 700; color: var(--ink);
  }
  .dv-table-f { margin-top: 6px; font-size: 12px; color: var(--ink-3); }
  .dv-table-s { margin-top: 5px; font-size: 11px; color: var(--ink-3); }

  /* Сводка проверки в карточке справа. Колонка узкая, поэтому значение идёт
     под названием, а не рядом: в две колонки «Исполнительные производства»
     не помещается ни при какой ширине. */
  .cp { display: grid; gap: 9px; }
  .cp-row { display: grid; gap: 2px; }
  .cp-row dt { font-size: 11.5px; color: var(--ink-3); }
  .cp-row dd { margin: 0; font-size: 13px; font-weight: 600; color: var(--ink); }
  .cp-row .cp-n {
    display: block; margin-top: 1px;
    font-size: 11.5px; font-weight: 500; color: var(--ink-2);
  }
  .cp-more {
    display: block; margin-top: 1px; padding: 0; border: none; background: none;
    font: inherit; font-size: 11.5px; font-weight: 600; color: var(--brand);
    cursor: pointer; text-align: left;
  }
  .cp-more:hover { text-decoration: underline; }
  .cp-more.on { color: var(--ink-3); }
  .cp-list {
    margin: 4px 0 0; padding-left: 14px; font-size: 12px; font-weight: 500;
    color: var(--ink-2); display: grid; gap: 2px;
  }
  .cp-list[hidden] { display: none; }
  .cp-row.risk dd { color: var(--danger); }
  .cp-row.attention dd { color: var(--warn); }

  /* ---------- Окно проверки ----------

     Вид собран по референсам заказчика (SaaS-панели): серое полотно, на нём
     белые карточки со скруглением и мягкой тенью, крупные числа с цветной
     дельтой, статусы — бейджами, а не цветным текстом.

     Плотность при этом остаётся фокусовской: карточка — это не воздух ради
     воздуха, а граница смысла. Тридцать три раздела свёрнуты, и карточка
     показывает, где кончается один и начинается другой. */
  .overlay.dossier .modal { background: var(--ground); }
  .overlay.dossier .mbody { background: var(--ground); }
  .overlay.dossier .pane { padding: 14px 16px 20px; }

  .dv-head {
    display: flex; align-items: flex-start; gap: 18px; flex-wrap: wrap;
    padding: 18px 20px 16px; background: var(--surface);
    border-bottom: 1px solid var(--line);
  }
  .dv-who { flex: 1 1 320px; min-width: 0; }
  .dv-name { font-size: 21px; font-weight: 750; letter-spacing: -.015em; color: var(--ink); }
  .dv-meta { margin-top: 5px; font-size: 12.5px; color: var(--ink-3); line-height: 1.55; }
  .dv-verdict-top { text-align: right; }
  .dv-verdict-top b {
    display: inline-block; font-size: 13px; font-weight: 700;
    padding: 7px 14px; border-radius: 999px;
  }
  .dv-verdict-top.stop b { background: var(--danger-soft); color: var(--danger); }
  .dv-verdict-top.attention b { background: var(--warn-soft); color: var(--warn); }
  .dv-verdict-top.ok b { background: var(--ok-soft); color: var(--ok); }
  .dv-verdict-top span {
    display: block; margin-top: 5px; font-size: 11.5px; color: var(--ink-3);
  }

  /* Плитки — отдельные карточки, как в референсах: подпись, крупное число,
     под ним дельта. */
  /* Высота у плиток общая, и так и надо: ряд одинаковых кубиков читается как
     ряд, а разной высоты — как обломки. Пробовал `align-items: start`, чтобы
     каждая села по своему содержимому, — стало хуже: пустота ушла, а ровная
     линия низа сломалась, и выигрыша не осталось.
     Ряд укорачивается иначе — сокращением подписей у самой высокой плитки. */
  .dv-stats {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px; padding: 14px 16px; background: var(--ground);
  }
  /* Внутри полотна плитки идут первым рядом виджетов, а не полосой под
     шапкой: своя серая подложка и свои отступы там лишние — их даёт полотно. */
  .pane > .dv-stats { padding: 0 0 12px; background: transparent; }

  .dv-stat {
    background: var(--surface); padding: 12px 14px;
    border: 1px solid var(--line); border-radius: var(--r-lg);
    box-shadow: var(--shadow-sm);
  }
  .dv-stat-l {
    display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .05em;
    text-transform: uppercase; color: var(--ink-3);
  }
  .dv-stat-v {
    display: block; margin-top: 6px; font-size: 19px; font-weight: 750;
    letter-spacing: -.02em; color: var(--ink);
    font-variant-numeric: tabular-nums; white-space: nowrap;
  }
  .dv-stat-n { display: block; margin-top: 4px; font-size: 11.5px; color: var(--ink-2); font-weight: 600; }
  .dv-stat-x { display: block; margin-top: 2px; font-size: 11px; color: var(--ink-3); }

  /* Уровень риска. Цвет несёт смысл, поэтому рядом всегда слово: «высокий»
     читается и в чёрно-белой печати, и тем, кто цвета различает иначе. */
  .dv-risk { padding: 12px 14px; border-radius: 12px; background: var(--ground); }
  .dv-risk-l {
    display: inline-block; padding: 3px 11px; border-radius: 999px;
    font-size: 12px; font-weight: 700; text-transform: lowercase;
    background: var(--ink-3); color: #fff;
  }
  .dv-risk.lvl-ok .dv-risk-l { background: var(--ok); }
  .dv-risk.lvl-warn .dv-risk-l { background: var(--warn); }
  .dv-risk.lvl-bad .dv-risk-l { background: var(--danger); }
  .dv-risk-t { margin: 8px 0 0; font-size: 13px; color: var(--ink-2); }
  .dv-risk-s { margin-top: 10px; font-size: 12.5px; }
  .dv-risk-s b { display: block; margin-bottom: 4px; }
  .dv-risk-s ul { margin: 0; padding-left: 18px; color: var(--ink-2); }
  .dv-stat.risk .dv-stat-v { color: var(--danger); }
  .dv-stat.attention .dv-stat-v { color: var(--warn); }

  /* Раздел — карточка. Свёрнут по умолчанию; в заголовке светофор, название и
     суть одной строкой. */
  .dv-sec {
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-lg); margin-bottom: 10px; overflow: hidden;
    box-shadow: var(--shadow-sm);
  }
  .dv-sec > summary {
    display: flex; align-items: baseline; gap: 10px; cursor: pointer;
    padding: 12px 16px; list-style: none; font-size: 13px;
  }
  .dv-sec > summary::-webkit-details-marker { display: none; }
  .dv-sec > summary:hover { background: var(--ground); }
  .dv-sec[open] > summary { border-bottom: 1px solid var(--line); }
  .dv-sec-t { font-weight: 700; color: var(--ink); flex: none; }
  .dv-sec-s {
    color: var(--ink-3); font-size: 12.5px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; min-width: 0;
  }
  .dv-sec-h { padding: 10px 16px 0 16px; font-size: 11.5px; color: var(--ink-3); }
  .dv-sec > summary .dv-dot { margin: 0; flex: none; align-self: center; }
  .dv-dot.none, .dv-dot.ok { background: var(--ok); }
  .dv-dot.no_data, .dv-dot.unavailable, .dv-dot.planned { background: var(--line-strong); }
  .dv-sec .tr-row:first-of-type { border-top: none; }
  .dv-sec .tr-group { border-top: none; }

  /* Статус строки — бейджем, как в референсах, а не цветным текстом. */
  .dv-mark {
    display: inline-block; margin-top: 5px; padding: 2px 9px;
    border-radius: 999px; font-size: 11px; font-weight: 700;
    background: var(--ground); color: var(--ink-3);
  }
  .dv-mark.stop { background: var(--danger-soft); color: var(--danger); }
  .dv-mark.attention { background: var(--warn-soft); color: var(--warn); }
  .dv-mark.ok { background: var(--ok-soft); color: var(--ok); }

  /* Факты в два-три узких столбца: на широком окне строка «название — значение»
     оставляла полэкрана пустоты справа. Название сверху мелким, значение под
     ним — так столбец получается узким, а строка короткой. */
  .dv-facts {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
    gap: 0;
  }
  .dv-facts .tr-row {
    grid-template-columns: 1fr; gap: 3px; padding: 10px 16px;
    border-top: 1px solid var(--line);
  }
  .dv-facts .tr-t { font-size: 11.5px; font-weight: 600; color: var(--ink-3); }
  .dv-facts .tr-val .v { font-weight: 650; color: var(--ink); }
  .dv-facts .tr-n { margin-top: 3px; }
  .dv-facts .tr-s { margin-top: 3px; }
  /* Первая строка каждого столбца без верхней черты — иначе она дублирует
     границу заголовка. */
  .dv-facts .tr-row:nth-child(-n+2) { border-top: none; }
  @media (max-width: 900px) {
    .dv-facts .tr-row:nth-child(2) { border-top: 1px solid var(--line); }
  }

  /* Дельта — тоже пилюлей: «−50%» должно ловиться взглядом. */
  .tr-d {
    display: inline-block; padding: 1px 7px; border-radius: 999px;
    font-weight: 700; white-space: nowrap; font-size: 11.5px;
  }
  .tr-d.up { background: var(--ok-soft); color: var(--ok); }
  .tr-d.down { background: var(--danger-soft); color: var(--danger); }
  .dv-take .rd-sum { margin: 0 0 10px; }
  .dv-take .rd-list { margin: 0; }

  /* Метка на вкладке: тяжёлое видно, не открывая её. */
  .dv-dot {
    display: inline-block; width: 6px; height: 6px; margin-left: 6px;
    border-radius: 50%; vertical-align: middle;
  }
  .dv-dot.stop { background: var(--danger); }
  .dv-dot.attention { background: var(--warn); }
  .stage.on .dv-dot { background: currentColor; }

  /* ---------- Upload ---------- */
  .drop { display: grid; gap: 8px; margin-top: 12px; }
  .doc {
    display: flex; align-items: center; gap: 11px;
    border: 1px solid var(--line-strong); border-radius: var(--r-md);
    padding: 10px 12px; background: var(--surface);
    transition: border-color .2s, background .2s;
  }
  .doc.filled { border-color: var(--ok-line); background: var(--ok-soft); }
  /* Файл уходит на сервер сразу при выборе, поэтому у строки есть ещё два
     состояния: пока идёт отправка и когда сервер её не принял. */
  .doc.busy { border-color: var(--brand); }
  .doc.bad { border-color: var(--danger); background: var(--danger-soft); }
  .doc.bad .nm small { color: var(--danger); font-weight: 600; }
  .doc.busy .nm small { color: var(--brand); font-weight: 600; }
  .doc.busy label, .doc[data-busy] label { opacity: .55; pointer-events: none; }
  .doc .fi { width: 30px; height: 30px; border-radius: 8px; background: var(--ground); display: grid; place-items: center; color: var(--ink-3); flex: none; }
  .doc.filled .fi { background: #fff2; color: var(--ok); }
  .doc .nm { flex: 1; min-width: 0; }
  .doc .nm b { display: block; font-size: 13.5px; font-weight: 620; }
  .doc .nm small { color: var(--ink-3); font-size: 12px; }
  .doc.filled .nm small { color: var(--ok); font-weight: 600; }
  .doc .req { color: var(--danger); }
  .doc label {
    font-size: 12.5px; font-weight: 650; color: var(--brand); cursor: pointer;
    padding: 6px 12px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--surface);
    white-space: nowrap;
  }
  .doc label:hover { border-color: var(--brand); }
  .doc input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }

  /* ---------- Offers ---------- */
  .offers { display: grid; gap: 9px; margin-top: 12px; }
  .offer {
    display: grid; grid-template-columns: 30px 1fr auto; gap: 12px; align-items: center;
    border: 1px solid var(--line-strong); border-radius: var(--r-lg);
    padding: 12px 14px; background: var(--surface); position: relative;
  }
  .offer.best { border-color: var(--ok); box-shadow: 0 0 0 3px var(--ok-soft); }
  .offer .bank-ic { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-weight: 700; font-size: 12px; }

  /* Логотип ложится поверх буквенного значка и закрывает его целиком.
     Подложка белая: знаки нарисованы для белого фона, на цветном половина
     из них теряется. Буквы остаются видны там, где файла ещё нет. */
  .bank-ic {
    position: relative; overflow: hidden; flex: none;
    width: 30px; height: 30px; border-radius: 8px;
    display: grid; place-items: center;
    color: #fff; font-weight: 700; font-size: 12px;
  }
  .bank-ic img {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: contain; padding: 2px; background: #fff;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .09);
  }
  .offer .bn { display: block; font-weight: 650; font-size: 14px; }
  .offer .bm { display: block; font-size: 12px; color: var(--ink-3); margin-top: 2px; }
  .offer .price { text-align: right; font-family: var(--mono); font-weight: 700; font-size: 15px; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .offer .price small { display: block; font-family: var(--sans); font-weight: 600; font-size: 11px; color: var(--ink-3); }
  .badge-best {
    position: absolute; top: -9px; right: 12px;
    background: var(--ok); color: #fff; font-size: 10px; font-weight: 700;
    letter-spacing: .06em; text-transform: uppercase; padding: 2px 8px; border-radius: 5px;
  }
  @media (prefers-color-scheme: dark) { .badge-best { color: #0B0E22; } }
  :root[data-theme="dark"] .badge-best { color: #0B0E22; }
  :root[data-theme="light"] .badge-best { color: #fff; }

  /* ---------- Composer ---------- */
  .composer {
    display: flex; gap: 9px; align-items: center;
    padding: 13px 20px; border-top: 1px solid var(--line); background: var(--surface);
  }
  .composer input {
    flex: 1; min-width: 0; font: inherit; font-size: 14.5px;
    padding: 11px 16px; border-radius: 999px;
    border: 1px solid var(--line-strong); background: var(--ground); color: var(--ink);
  }
  .composer input:focus { outline: none; border-color: var(--brand); background: var(--surface); box-shadow: 0 0 0 3px var(--brand-soft); }
  .composer input:disabled { opacity: .6; }
  .send {
    width: 42px; height: 42px; flex: none; border-radius: 50%;
    background: var(--brand); border: none; color: #fff; cursor: pointer;
    display: grid; place-items: center; transition: filter .15s;
  }
  .send:hover { filter: brightness(1.1); }
  .send:disabled { opacity: .35; cursor: not-allowed; }
  @media (prefers-color-scheme: dark) { .send { color: #0B0E22; } }
  :root[data-theme="dark"] .send { color: #0B0E22; }
  :root[data-theme="light"] .send { color: #fff; }

  /* ---------- Side card ---------- */
  .side { position: sticky; top: 20px; }
  .side-head {
    padding: 16px 18px 14px; border-bottom: 1px solid var(--line);
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
  }
  .side-head h2 { margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -.01em; }
  .side-head .sub { font-size: 12px; color: var(--ink-3); margin-top: 2px; }
  /* display: flex сильнее браузерного [hidden] — та же ловушка, что у
     .grid и .risk-list. В анализе тендера кольцо прячется. */
  .completeness[hidden] { display: none; }
  .completeness { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--ink-2); font-variant-numeric: tabular-nums; }
  .ring { width: 34px; height: 34px; flex: none; }
  .ring circle { fill: none; stroke-width: 4; }
  .ring .bg { stroke: var(--line); }
  .ring .fg { stroke: var(--brand); stroke-linecap: round; transition: stroke-dasharray .6s cubic-bezier(.2,.7,.3,1); }

  .card-body { padding: 6px 18px 18px; }
  .group { padding-top: 14px; }
  .group + .group { border-top: 1px solid var(--line); margin-top: 4px; }
  .group-t {
    font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--ink-3); margin-bottom: 9px; display: flex; align-items: center; gap: 7px;
  }
  .group-t .n { color: var(--line-strong); font-family: var(--mono); }
  .grp-edit {
    margin-left: auto; font: inherit; font-size: 11px; font-weight: 700;
    letter-spacing: .06em; text-transform: uppercase; color: var(--brand);
    background: none; border: none; cursor: pointer; padding: 0;
  }
  .grp-edit:hover { text-decoration: underline; }
  .grp-edit { display: inline-flex; align-items: center; }
  .det {
    margin-top: 4px; padding-top: 4px;
    animation: rowin .3s cubic-bezier(.2,.7,.3,1) both;
  }
  .sub-t {
    font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
    color: var(--ink-3); margin: 12px 0 4px; padding-top: 10px;
    border-top: 1px dashed var(--line);
  }
  .det .sub-t:first-child { border-top: none; padding-top: 0; margin-top: 8px; }

  .row { display: grid; grid-template-columns: 42% 1fr; gap: 10px; padding: 5px 0; font-size: 13.5px; align-items: baseline; }
  .row dt { color: var(--ink-3); }
  .row dd { margin: 0; color: var(--ink-3); font-weight: 500; overflow-wrap: anywhere; }
  .row.set dd { color: var(--ink); font-weight: 620; font-variant-numeric: tabular-nums; }
  .row.set dd.mono { font-family: var(--mono); font-size: 13px; }
  /* Номера контрактов под суммой комплекта: приглушены и мельче — сумма
     здесь главное, номера справка. Межстрочный интервал плотнее
     обычного: их бывает три, и с обычным строка комплекта разъезжается
     на пол-карточки. */
  .row.set dd .set-nums { margin-top: 5px; }
  /* Номер и сумма контракта в одной строке: номер слева, сумма прижата
     вправо — так столбец сумм читается сверху вниз, а не выискивается в
     тексте. Приглушены и мельче: главное в строке комплекта — его потолок. */
  .row.set dd .set-num {
    display: flex; justify-content: space-between; gap: 8px;
    font-size: 12px; line-height: 1.7; font-weight: 500; color: var(--ink-3);
  }
  .row.set dd .set-num .mono { font-family: var(--mono); }
  .row.set dt { color: var(--ink-2); }
  .row.set { animation: rowin .45s cubic-bezier(.2,.7,.3,1) both; }
  @keyframes rowin { from { opacity: .2; transform: translateX(-6px); } to { opacity: 1; transform: none; } }
  .src {
    display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    background: var(--line-strong); margin-right: 7px; vertical-align: middle;
  }
  .row.set.auto .src { background: var(--ok); }
  .row.set.manual .src { background: var(--brand); }

  .legend { display: flex; gap: 14px; flex-wrap: wrap; padding: 14px 18px; border-top: 1px solid var(--line); font-size: 11.5px; color: var(--ink-3); }
  .legend span { display: inline-flex; align-items: center; gap: 6px; }

  .note {
    margin-top: 16px; padding: 13px 16px; border-radius: var(--r-lg);
    background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 28%, transparent);
    color: var(--ink-2); font-size: 12.5px; line-height: 1.55;
  }
  .note b { color: var(--ink); }

  .docs-list { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }
  .doc-pill {
    font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 6px;
    background: var(--ok-soft); color: var(--ok); border: 1px solid var(--ok-line);
  }
  .doc-pill.pending { background: var(--ground); color: var(--ink-3); border-color: var(--line); }

  /* ---------- Карточка тендера ---------- */
  .tender-card {
    flex: 1; min-width: 0;
    background: color-mix(in srgb, var(--brand) 6%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--brand) 16%, transparent);
    border-radius: var(--r-lg); padding: 14px 16px;
  }

  /* Номер и закон — одной строкой: закон это метка закупки, а не её свойство
     наравне с суммой, и отдельная строка внизу ему велика. */
  .tc-top { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
  .tender-card h3 {
    margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -.01em;
    min-width: 0; overflow-wrap: anywhere;
  }
  .tc-law {
    flex: none; font-size: 11.5px; font-weight: 700; letter-spacing: .01em;
    color: var(--brand); background: var(--brand-soft);
    padding: 3px 9px; border-radius: 999px;
  }

  .tc-who { font-size: 13px; line-height: 1.45; }
  .tc-who b {
    display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px;
  }
  .tc-who > span { color: var(--ink); font-weight: 600; }
  .tc-who .none { color: var(--ink-3); font-weight: 400; }
  .tc-hint { display: block; font-size: 12px; color: var(--ink-3); margin-top: 5px; }

  .tc-customers {
    margin: 0; padding-left: 18px; font-size: 12.5px; line-height: 1.45;
    color: var(--ink); font-weight: 600;
    max-height: 132px; overflow-y: auto;
  }
  /* Каждое имя — не больше двух строк: полное висит подсказкой. */
  .tc-customers li {
    margin-bottom: 3px;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .tc-who > span {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Предмет закупки — сплошным текстом, не парой «ключ-значение»: это
     единственное поле карточки, которое читают, а не сверяют. Длинное
     обрезаем: под ним ещё цифры, ради которых карточку и открыли. */
  .tc-subj {
    font-size: 13px; line-height: 1.45; color: var(--ink-2);
    margin-top: 10px;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Цифры — сеткой по две в ряд. Строками во всю ширину они давали пустое
     поле между ключом и значением, и глаз терял пару. */
  .tc-facts {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 1px; margin-top: 12px;
    background: color-mix(in srgb, var(--brand) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--brand) 12%, transparent);
    border-radius: var(--r-md); overflow: hidden;
  }
  .tc-fact {
    background: var(--surface); padding: 8px 11px; min-width: 0;
  }
  .tc-fact.wide { grid-column: span 1; }
  .tc-fact b {
    display: block; font-size: 11px; font-weight: 600; color: var(--ink-3);
    margin-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .tc-fact span {
    font-size: 13.5px; font-weight: 700; color: var(--ink);
    font-variant-numeric: tabular-nums; overflow-wrap: anywhere;
  }

  .tc-link {
    display: inline-block; margin-top: 11px; font-size: 12.5px;
    color: var(--brand); font-weight: 650; text-decoration: none;
  }
  .tc-link:hover { text-decoration: underline; }

  .tc-note { margin: 0; padding: 9px 0 0; font-size: 12px; line-height: 1.45; color: var(--ink-2);
             border-top: 1px solid color-mix(in srgb, var(--brand) 13%, transparent); }

  /* Карточка в разделе «Тендеры»: заказчик, НМЦК и обеспечения — одним рядом
     вместо плиток сверху (заказчик 16.09.2026) */
  .tc-wide .tc-top { flex-wrap: wrap; }
  .tc-method { font-size: 12.5px; color: var(--ink-2); }
  /* предмет закупки — крупно и жирно: плохо читался (заказчик 16.09.2026) */
  .tc-wide .tc-subj { font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.35; margin-top: 8px; }
  .tc-link-top { margin: 0 0 0 auto; }
  .tc-row {
    display: grid; grid-template-columns: minmax(0, 2.2fr) repeat(3, minmax(0, 1fr));
    gap: 16px; align-items: start;
  }
  .tc-main b {
    display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px;
  }
  .tc-main > span { display: block; font-size: 17px; font-weight: 750; color: var(--ink);
                    font-variant-numeric: tabular-nums; line-height: 1.25; overflow-wrap: anywhere; }
  .tc-main .none { color: var(--ink-3); font-weight: 400; }
  /* нацрежим в шапке карточки: сколько позиций и какая мера у скольких */
  .tc-nr {
    display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px;
    margin-top: 12px; padding: 9px 11px; border-radius: var(--r-md);
    background: var(--surface); border: 1px solid color-mix(in srgb, var(--brand) 12%, transparent);
    font-size: 13px;
  }
  .tc-nr > b { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
  .tc-nr-total { color: var(--ink-2); }
  .tc-nr-body { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; }
  .tc-nr-src { font-size: 12px; color: var(--ink-2); }
  .tc-nr-none { color: var(--ink-2); }
  .tc-nr .bid-regime { font-weight: 700; }
  .tc-nr .bid-bad { color: #e03131; }
  .tc-nr .bid-unk { color: #c47f00; }
  .tc-nr .bid-ok { color: #2f9e44; }
  .tc-main small { display: block; font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
  .tc-wide .tc-fact .tc-left {
    display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px;
    font-style: normal; font-size: 11.5px; font-weight: 700;
    background: var(--brand-soft); color: var(--brand);
  }
  .tc-wide .tc-fact .tc-left.soon { background: #FDF1DC; color: #9A5B06; }
  .tc-wide .tc-fact .tc-left.hot { background: #FBE7E6; color: #B42318; }
  .tc-wide .tc-fact .tc-left.over { background: var(--ground); color: var(--ink-3); }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .tc-wide .tc-fact .tc-left.soon { background: rgba(230, 160, 40, .18); color: #F2C46D; }
    :root:not([data-theme="light"]) .tc-wide .tc-fact .tc-left.hot { background: rgba(220, 70, 60, .18); color: #F4A29B; }
  }
  :root[data-theme="dark"] .tc-wide .tc-fact .tc-left.soon { background: rgba(230, 160, 40, .18); color: #F2C46D; }
  :root[data-theme="dark"] .tc-wide .tc-fact .tc-left.hot { background: rgba(220, 70, 60, .18); color: #F4A29B; }
  @media (max-width: 760px) {
    .tc-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tc-row-who { grid-column: 1 / -1; }
    .tc-link-top { margin-left: 0; }
  }

  /* ---------- Чекбоксы и мини-формы в чате ---------- */
  .check, .f > label.check { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-weight: 600; font-size: 13.5px; margin: 4px 0; }
  .check input { position: absolute; width: 1px; height: 1px; opacity: 0; }
  .check .box {
    width: 20px; height: 20px; border-radius: 6px; flex: none;
    border: 1.5px solid var(--line-strong); background: var(--surface);
    display: grid; place-items: center; color: transparent; transition: all .15s;
  }
  .check input:checked + .box { background: var(--brand); border-color: var(--brand); color: #fff; }
  .check input:focus-visible + .box { outline: 2px solid var(--brand); outline-offset: 2px; }
  @media (prefers-color-scheme: dark) { .check input:checked + .box { color: #0B0E22; } }
  :root[data-theme="dark"] .check input:checked + .box { color: #0B0E22; }

  .opts { display: flex; gap: 8px; flex-wrap: wrap; }
  .opt {
    font: inherit; font-size: 13px; font-weight: 620; cursor: pointer;
    padding: 9px 14px; border-radius: 10px; background: var(--surface);
    border: 1px solid var(--line-strong); color: var(--ink-2);
  }
  .opt:hover { border-color: var(--brand); color: var(--brand); }
  .opt.on { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); }
  .linkbtn {
    font: inherit; font-size: 13px; font-weight: 650; cursor: pointer;
    background: none; border: none; color: var(--brand); padding: 8px 0; text-align: left;
  }
  .linkbtn:hover { text-decoration: underline; }

  /* ---------- Таблица банков ---------- */
  .tbl-wrap { overflow-x: auto; }
  table.banks { width: 100%; border-collapse: collapse; font-size: 13.5px; min-width: 880px; }
  .banks th {
    text-align: left; padding: 0 11px 12px; white-space: nowrap;
    font-size: 12px; font-weight: 700; color: var(--ink-2); letter-spacing: .01em;
  }
  .b-name { align-items: center; }
  .banks td { padding: 9px 11px; border-top: 1px solid var(--line); vertical-align: middle; }
  /* Колонка банка не должна растягивать таблицу: имя в одну строку,
     пояснение под ним обрезается — подробности открываются «Просмотром». */
  .banks td:first-child, .banks th:first-child { max-width: 300px; }
  .bn2 { display: block; white-space: nowrap; }
  .bs2 {
    display: block; font-size: 11.5px; font-weight: 500; color: var(--ink-3); margin-top: 1px;
    max-width: 250px; overflow: hidden; text-overflow: ellipsis;
  }
  .banks tbody tr:hover td { background: color-mix(in srgb, var(--brand) 4%, transparent); }
  .banks tr.best td { background: color-mix(in srgb, var(--ok) 6%, transparent); }
  .banks tr.off td { opacity: .55; }
  .b-name { display: flex; align-items: center; gap: 10px; font-weight: 650; white-space: nowrap; }
  /* Отказы свёрнуты, пока есть что покупать: клиенту нужен список банков,
     которые его возьмут, а два десятка отказов сверху этот список топят.
     Разворачиваются кнопкой; когда не подошёл никто, класса на таблице нет
     и прятать нечего. */
  .banks:not(.show-rejects) tr.rej { display: none; }
  .banks tr.split-btn td { padding: 0; border-top: 1px solid var(--line-strong); }
  .banks tr.split-btn button {
    width: 100%; border: none; background: var(--ground); color: var(--brand);
    font: inherit; font-size: 12.5px; font-weight: 650; padding: 10px;
    cursor: pointer; text-align: center;
  }
  .banks tr.split-btn button:hover { background: var(--line); }

  /* Граница между предложениями и отказами: дальше те же колонки означают
     другое, поэтому у них свой заголовок, а не просто пустая строка. */
  .banks tr.split td {
    background: var(--ground); border-top: 1px solid var(--line-strong);
    font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
    color: var(--ink-3); font-weight: 650; padding: 8px 11px;
  }

  /* Причина отказа занимает место денежных колонок. Перенос по словам
     обязателен: причин бывает несколько, и в одну строку они не лягут. */
  .banks td.why-cell {
    white-space: normal; color: var(--ink-2); font-size: 12.5px; line-height: 1.45;
  }
  .banks tr.off td.why-cell { color: var(--ink-2); }

  /* По названию открывается карточка банка — курсор об этом и говорит */
  .banks .b-name { cursor: pointer; }
  .banks .b-name:hover .bn2 { text-decoration: underline; }
  /* Денежная клетка: число слева, знак рубля прижат вправо — как в боевой
     CRM. Одинаковая ширина колонок держит цифры в столбик, иначе строки
     невозможно сравнивать глазами. */
  .cell-green, .cell-num {
    display: flex; align-items: center; gap: 10px; min-width: 128px;
    padding: 8px 12px; border-radius: 9px;
    font-family: var(--mono); font-variant-numeric: tabular-nums; white-space: nowrap;
  }
  .cell-green > i, .cell-num > i { margin-left: auto; font-style: normal; opacity: .6; }
  .cell-green {
    background: var(--ok-soft); border: 1px solid var(--ok-line); color: var(--ok); font-weight: 700;
  }
  .cell-num { background: var(--ground); border: 1px solid transparent; color: var(--ink-2); }
  .cell-num.plus { color: var(--ok); }

  .pill {
    display: inline-block; font-size: 12px; font-weight: 650; padding: 8px 14px;
    border-radius: 9px; white-space: nowrap; min-width: 138px;
  }
  .pill.offer  { background: var(--brand-soft); color: var(--brand); }
  .pill.review { background: var(--ok-soft); color: var(--ok); }
  .pill.reject { background: var(--danger-soft); color: var(--danger); }
  .btn-sm {
    font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; white-space: nowrap;
    padding: 9px 16px; border-radius: 9px; border: 1px solid var(--brand);
    background: var(--brand); color: #fff;
  }
  .btn-sm:hover { filter: brightness(1.08); }
  .btn-sm:disabled { opacity: .4; cursor: not-allowed; filter: none; }
  .btn-sm.soft { background: var(--brand-soft); color: var(--brand); border-color: transparent; }
  @media (prefers-color-scheme: dark) { .btn-sm { color: #0B0E22; } .btn-sm.soft { color: var(--brand); } }
  :root[data-theme="dark"] .btn-sm { color: #0B0E22; }
  :root[data-theme="dark"] .btn-sm.soft { color: var(--brand); }
  :root[data-theme="light"] .btn-sm { color: #fff; }
  :root[data-theme="light"] .btn-sm.soft { color: var(--brand); }
  /* ---------- Карточка банка («Просмотр») ---------- */
  .bank-card .modal.narrow { max-width: 560px; }
  .bc-head { display: flex; align-items: center; gap: 12px; padding: 18px 20px 14px; border-bottom: 1px solid var(--line); }
  .bc-name { display: block; font-size: 16px; font-weight: 700; margin-bottom: 5px; }
  .bc-body { padding: 18px 20px; overflow-y: auto; display: grid; gap: 14px; }
  .bc-block { border: 1px solid var(--line); border-radius: var(--r-md); padding: 12px 14px; }
  .bc-block.warn { background: var(--warn-soft); border-color: color-mix(in srgb, var(--warn) 28%, transparent); }
  .bc-block > b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 7px; }
  .bc-block ul { margin: 0; padding-left: 17px; font-size: 13px; line-height: 1.55; color: var(--ink-2); display: grid; gap: 4px; }
  .bc-note { margin: 0; font-size: 12.5px; color: var(--ink-3); line-height: 1.5; }

  .tag-best {
    display: inline-block; margin-left: 8px; font-size: 10px; font-weight: 700;
    letter-spacing: .05em; text-transform: uppercase; padding: 3px 7px; border-radius: 5px;
    background: var(--ok); color: #fff; vertical-align: middle;
  }
  @media (prefers-color-scheme: dark) { .tag-best { color: #0B0E22; } }
  :root[data-theme="dark"] .tag-best { color: #0B0E22; }
  .tbl-note { font-size: 12.5px; color: var(--ink-3); padding: 14px 4px 0; }

  /* ---------- Анкета заявки (модальное окно) ---------- */
  .overlay {
    position: fixed; inset: 0; z-index: 60;
    background: rgba(11, 14, 34, .45); backdrop-filter: blur(3px);
    display: grid; place-items: center; padding: 18px;
    animation: fade .18s both;
  }
  @keyframes fade { from { opacity: 0; } to { opacity: 1; } }
  @keyframes pop { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }

  .modal {
    width: min(1120px, 100%); max-height: 92vh;
    display: flex; flex-direction: column; min-height: 0;
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-xl); box-shadow: var(--shadow-lg); overflow: hidden;
    animation: pop .3s cubic-bezier(.2,.7,.3,1) both;
  }
  .modal.wide { width: min(1240px, 100%); }

  /* Пульт «Выбор банка» — вкладка того же окна. Колонок вдвое больше, чем у
     клиентской таблицы, поэтому окну разрешено занять всю ширину: заказчик
     02.09.2026 «открывать можно на весь экран по ширине». */
  .modal.pult-wide { width: min(2000px, 100%); }

  table.banks.pult { min-width: 1900px; }
  table.banks.pult th { font-size: 10.5px; white-space: normal; }
  table.banks.pult td { padding: 6px 8px; }
  table.banks.pult .nm { font-weight: 600; white-space: nowrap; }
  .pult-bank { display: flex; align-items: center; gap: 9px; }

  /* Риски во вкладке: сверху выжимка, важное карточками, остальное свёрнуто.
     Первая версия раскладывала всё поровну и оставляла дыру справа. */
  .riski-okno { padding: 0; border: 0; background: transparent; }
  .riski-verdict { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 14px 16px; border-radius: var(--r-md); background: var(--ground); }
  .riski-verdict b { font-size: 15px; }
  .riski-verdict .who { color: var(--ink-3); font-size: 13px; }
  .riski-counts { margin-left: auto; display: flex; gap: 7px; }
  .riski-counts i { font-style: normal; font-size: 12px; font-weight: 600;
    padding: 4px 10px; border-radius: 999px; background: var(--surface);
    color: var(--ink-2); }
  .riski-counts i.stop { background: var(--danger-soft); color: var(--danger); }
  .riski-counts i.attention { background: var(--warn-soft); color: var(--warn); }
  .riski-counts i.ok { background: var(--ok-soft); color: var(--ok); }

  .riski-okno.stop .riski-verdict { background: var(--danger-soft); }
  .riski-okno.stop .riski-verdict b { color: var(--danger); }
  .riski-okno.attention .riski-verdict { background: var(--warn-soft); }
  .riski-okno.attention .riski-verdict b { color: var(--warn); }
  .riski-okno.ok .riski-verdict { background: var(--ok-soft); }
  .riski-okno.ok .riski-verdict b { color: var(--ok); }

  .riski-izza { margin: 12px 2px 14px; font-size: 13px; color: var(--ink-2); }

  /* Важное — карточками. `auto-fit`, а не `auto-fill`: пустые колонки
     схлопываются, и единственная карточка занимает всю ширину, а не половину
     с дырой справа — ровно то, из-за чего первая раскладка не понравилась. */
  .riski-vazhno { display: grid; gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(430px, 1fr)); }
  .riski-card { padding: 12px 14px;
    border: 1px solid var(--line); border-left-width: 3px;
    border-radius: var(--r-md); background: var(--surface); }
  .riski-card.stop { border-left-color: var(--danger); }
  .riski-card.attention { border-left-color: var(--warn); }
  .riski-card .risk-item { padding: 0; border: 0; }

  /* Итог блока — цветом, а не только числом: зелёная полоса слева видна
     раньше, чем прочитано слово «чисто». Серая — значит внутри есть то,
     на что никто не смотрел. */
  .riski-ostalnoe { margin-top: 4px; border-left: 3px solid var(--ink-3);
    border-radius: var(--r-md); }
  .riski-ostalnoe.chisto { border-left-color: var(--ok); }
  .riski-ostalnoe > summary { cursor: pointer; font-size: 13px; font-weight: 600;
    color: var(--ink-2); padding: 10px 14px; background: var(--ground);
    border-radius: var(--r-md); list-style: none; display: flex;
    align-items: center; gap: 10px; }
  .riski-ostalnoe > summary::-webkit-details-marker { display: none; }
  .riski-ostalnoe > summary::before { content: '▸'; color: var(--ink-3); }
  .riski-ostalnoe[open] > summary::before { content: '▾'; }
  .riski-ostalnoe > summary .riski-counts { margin-left: auto; }
  /* Остальные проверки — строками в колонки, а не блоками рядом: блоки
     разной высоты оставляли полэкрана пустоты. */
  .riski-spisok { columns: 3; column-gap: 22px; margin: 14px 0 0; padding: 0;
    list-style: none; }
  .riski-spisok > li { break-inside: avoid; padding: 8px 0 8px 15px;
    position: relative; font-size: 13px; border-bottom: 1px solid var(--line); }
  .riski-spisok > li::before { content: ''; position: absolute; left: 0;
    top: 13px; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }
  .riski-spisok > li.unavailable::before,
  .riski-spisok > li.no_data::before,
  .riski-spisok > li.planned::before { background: var(--ink-3); }
  .riski-spisok > li.attention::before { background: var(--warn); }
  .riski-spisok > li.stop::before { background: var(--danger); }

  /* Смысл целиком, до двух строк: одной строкой с обрезкой он терялся. */
  .riski-строка { display: block; }
  .riski-строка b { font-weight: 600; }
  .riski-строка span { display: -webkit-box; -webkit-line-clamp: 2;
    -webkit-box-orient: vertical; overflow: hidden; color: var(--ink-3);
    margin-top: 2px; }

  /* Раскрытие — только там, где есть что раскрывать. */
  .riski-подробнее > summary { cursor: pointer; list-style: none; }
  .riski-подробнее > summary::-webkit-details-marker { display: none; }
  .riski-подробнее > summary b::after { content: ' ▸'; color: var(--ink-3);
    font-weight: 400; }
  .riski-подробнее[open] > summary b::after { content: ' ▾'; }
  .riski-подробнее[open] > summary span { -webkit-line-clamp: unset; }
  /* Точки маркеров возвращаем: внешний список их снял для себя, а внутри
     это обычное перечисление, и без них строки слипаются. */
  .riski-подробнее ul { margin: 6px 0 2px; padding-left: 16px;
    color: var(--ink-2); list-style: disc; }
  .riski-подробнее ul li { margin: 2px 0; }

  .riski-okno .risk-foot { margin-top: 14px; }
  @media (max-width: 1400px) { .riski-spisok { columns: 2; } }
  @media (max-width: 900px) {
    .riski-vazhno { grid-template-columns: 1fr; }
    .riski-spisok { columns: 1; }
  }
  }
  /* Колонки с галочками сжимаем: таблица и так в два десятка колонок, и
     каждый лишний пиксель гонит горизонтальную полосу дальше. */
  table.banks.pult .uzko { width: 58px; text-align: center; padding: 6px 4px; }
  .pult .pf { width: 96px; }
  .pult .pf.link { width: 150px; }
  .pult .pf { width: 108px; font: inherit; font-size: 13px; padding: 7px 9px;
    border: 1px solid transparent; border-radius: 9px; background: var(--ground);
    color: var(--ink-2); text-align: right; font-variant-numeric: tabular-nums; }
  .pult .pf.link { width: 170px; text-align: left; }
  .pult .pf:focus { outline: 2px solid var(--brand); background: var(--surface);
    color: var(--ink); }
  /* Коэффициент приходит из тарифной сетки, стоимость — то, что увидит
     клиент. Заказчик выделяет их цветом, и мы повторяем: на два десятка
     колонок глазу нужны опоры. */
  .pult .pf.setka { background: #D8E8FB; color: var(--ink); }
  .pult .pf.itog { background: #FBEFC4; color: var(--ink); font-weight: 600; }
  .pult select { font: inherit; font-size: 13px; padding: 7px 9px;
    border: 1px solid var(--line); border-radius: 9px;
    background: var(--surface); color: var(--ink-2); }
  .pult input[type=checkbox] { width: 17px; height: 17px; accent-color: var(--brand); }
  .pult-foot { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
  .pult-hard { display: flex; align-items: center; gap: 8px; margin-top: 12px;
    font-size: 13px; color: var(--ink-2); }
  .pult-hard input { width: 17px; height: 17px; accent-color: var(--brand); }
  @media (prefers-color-scheme: dark) {
    .pult .pf.setka { background: #1E3550; }
    .pult .pf.itog { background: #4A3D14; }
  }
  @media (prefers-reduced-motion: reduce) { .overlay, .modal { animation: none; } }

  .mchips { display: flex; gap: 9px; padding: 16px 18px 6px; overflow-x: auto; scrollbar-width: thin; flex: none; }
  .mchip { background: var(--ground); border-radius: var(--r-md); padding: 9px 14px; min-width: 118px; flex: none; }
  .mchip b { display: block; font-size: 11px; font-weight: 700; color: var(--brand); letter-spacing: .02em; margin-bottom: 3px; }
  .mchip span { font-size: 13.5px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }

  /* Переносим, а не прокручиваем: в узком окне последняя вкладка уезжала
     за край и обрезалась, а прокрутку в шапке никто не ищет. */
  .stages { display: flex; flex-wrap: wrap; gap: 7px; padding: 14px 18px; }
  .stage {
    flex: none; padding: 8px 15px; border-radius: 10px;
    font-size: 13px; font-weight: 600; white-space: nowrap;
    background: var(--ground); color: var(--ink-3);
  }
  .stage.on { background: var(--brand); color: #fff; }

  @media (prefers-color-scheme: dark) { .stage.on { color: #0B0E22; } }
  :root[data-theme="dark"] .stage.on { color: #0B0E22; }
  :root[data-theme="light"] .stage.on { color: #fff; }
  .stage.dim { opacity: .45; }

  /* Вкладки гарантий на экране банков: у каждой своя сумма, и цена банка
     считается именно от неё. */
  /* Строго одна строка: список тянется по ширине, кнопки не переносятся. */
  .gtabs {
    display: flex; align-items: center; gap: 8px; flex-wrap: nowrap;
    padding: 0 18px 14px; min-width: 0;
  }
  .gt-h {
    font-size: 11px; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--ink-3); margin-right: 2px;
  }
  .gt {
    font: inherit; text-align: left; cursor: pointer;
    background: var(--ground); border: 1px solid transparent;
    border-radius: 10px; padding: 7px 13px; color: var(--ink-2);
    display: grid; gap: 1px; max-width: 260px;
  }
  .gt b {
    font-size: 12.5px; font-weight: 650; color: inherit;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .gt span { font-size: 12px; opacity: .8; font-variant-numeric: tabular-nums; }
  .gt:hover { border-color: var(--line-strong); }
  .gt.on { background: var(--brand); color: #fff; border-color: var(--brand); }
  @media (prefers-color-scheme: dark) { .gt.on { color: #0B0E22; } }
  :root[data-theme="dark"] .gt.on { color: #0B0E22; }
  :root[data-theme="light"] .gt.on { color: #fff; }

  .gt-sel {
    font: inherit; font-size: 13px; flex: 1 1 auto; min-width: 0;
    padding: 8px 11px; border-radius: 10px;
    border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink);
  }
  .gt-sel:focus { outline: none; border-color: var(--brand); }
  .gt-of { flex: none; font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; }

  /* Пока идёт пересчёт под другого заказчика — таблица гаснет и не кликается.
     Показывать старые цены под новым именем нельзя даже секунду. */
  .pane.busy { opacity: .45; pointer-events: none; transition: opacity .12s; }
  /* ---------- Разбор закупки: окно по макету 2 ----------
   *
   * Слева оглавление разделов, справа условия; шапка с предметом, заказчиком и
   * шестью плитками наверху. Собрано по макету, который заказчик утвердил
   * 27.08.2026 — «давай на этом остановимся, заливаем на основной сервер».
   *
   * Прежнее оглавление было строкой чипов над содержимым (.stages.rv-nav).
   * Правила под него убраны: разделов восемь, в строку они не помещались, и
   * функция, которая их рисовала, больше не вызывается. Оставлять их нельзя
   * было и по другой причине — имя .rv-nav теперь принадлежит боковому
   * оглавлению, и старая рамка снизу рисовалась бы поперёк него.
   */
  /* Прокручивается окно целиком, а не одна колонка условий. Заказчик
     27.08.2026: «давай закреп снимем от верхних полей, пусть вся страница
     скролится вниз, так удобнее будет».
   *
     Раньше шапка с предметом, заказчиком и плитками стояла намертво, а
     ездила только правая колонка — на ноутбуке под условия оставалась
     четверть высоты окна. Теперь наверх уезжает всё, и условия читаются во
     весь экран. */
  .modal.wide.rv2 { width: min(1280px, 100%); overflow-y: auto; overflow-x: hidden; }

  /* Ряд с кнопками. Заказчик 27.08.2026: «кнопка прилипла к менюшке, надо её
     чуть выше поднять» — своего отступа у ряда не было вовсе, и кнопка
     читалась заодно с шапкой. */
  .rv-top { display: flex; align-items: center; gap: 10px; padding: 16px 22px 14px; flex: none; }
  .rv-pdf {
    display: inline-flex; align-items: center; gap: 8px;
    font: inherit; font-size: 13px; font-weight: 600; padding: 8px 14px 8px 12px;
    cursor: pointer; border-radius: var(--r-md);
    border: 1px solid var(--line); background: var(--surface); color: var(--ink);
    transition: border-color .12s;
  }
  .rv-pdf:hover { border-color: var(--line-strong); }
  /* Значок красный и привычной формы — заказчик 27.08.2026: «сделаем какой-то
     значок PDF, красный, привычную иконку». Цвет берёт currentColor, поэтому
     задаём его на самой иконке, а не на кнопке: надпись остаётся чернильной. */
  .rv-pdf-i { flex: none; color: var(--danger); }
  .rv-x {
    margin-left: auto; flex: none;
    font: inherit; font-size: 19px; line-height: 1; width: 34px; height: 34px;
    cursor: pointer; border-radius: var(--r-md);
    border: 1px solid var(--line); background: var(--ground); color: var(--ink-2);
  }
  .rv-x:hover { color: var(--ink); border-color: var(--line-strong); }

  /* Шапка: предмет с заказчиком отдельно, числа отдельно.
     Заказчик 27.08.2026: «предмет, контракты и заказчик как-то некрасиво,
     давай на два кубика разобьём». Предмет и заказчик — текст, его читают
     строкой; закон, номер, НМЦК, сроки и обеспечения — числа, их сверяют
     взглядом. Смешивать эти два способа чтения в одном блоке не выходит. */
  .rv-cap { padding: 0 22px 18px; flex: none; }
  /* Плитки — отдельными блоками на светлой подложке, как в утверждённом
     макете: подложка --ground, скругление, просвет, внешней рамки нет.
     При переносе я собрал их одной белой таблицей с рамкой, и заказчик
     27.08.2026 это заметил: «сами формы другого цвета, чем на макете».

     Предмет и заказчик стали первыми двумя плитками того же ряда — до этого
     они стояли отдельным блоком сверху, и шапка занимала треть экрана. */
  /* Подпись плитки. Прописные и разрядка вместо крупного кегля: подпись должна
     называть число, а не спорить с ним. */
  .rv-l {
    display: block; font-size: 10.5px; font-weight: 700;
    letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3);
  }
  .rv-who b {
    display: block; margin-top: 6px; font-size: 15.5px; font-weight: 650;
    line-height: 1.4; color: var(--ink);
  }
  /* Плитки одной рамкой, разделены линиями — так они читаются как одна
     таблица, а не как шесть отдельных карточек. auto-fit вместо шести колонок:
     в узком окне ряд переносится, а не сжимает «Обеспечение контракта» до
     нечитаемого. */
  /* Шесть плиток в один ряд помещаются только на широком мониторе. В окне
     около тысячи пикселей на плитку остаётся полторы сотни, и девятнадцать
     цифр номера извещения ломаются на две строки — заказчик 27.08.2026:
     «очень криво макет перенёсся». Поэтому три в ряд, шесть — только когда
     ширины действительно хватает.

     Разделители сделаны просветом сетки, а не рамкой у плитки: при переносе
     на второй ряд рамки пришлось бы гасить по номеру колонки, а просвет
     работает при любом числе колонок сам. */
  /* Шесть равных квадратиков в один ряд — так решил заказчик 27.08.2026:
     «надо всё в одну строчку, шесть кубиков, первый и второй предмет закупки
     и заказчик, и они должны быть более квадратники, как были».

     Ряд узкий, поэтому длинное значение уходит на свой кегль: девятнадцать
     цифр номера извещения и название заказчика в плитку на две сотни
     пикселей крупным шрифтом не ложатся. */
  .rv-tiles {
    display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px;
  }
  .rv-tile {
    padding: 10px 12px; min-width: 0;
    background: var(--ground); border-radius: var(--r-md);
  }
  /* Предмет и заказчик — текст в три-четыре строки, остальные плитки в одну.
     Ряд тянется по самой высокой, и числа в соседних плитках должны стоять
     под своими подписями, а не висеть по центру пустоты. */
  .rv-tile { align-self: stretch; }
  .rv-tile b {
    display: block; margin-top: 5px; font-size: 16.5px; font-weight: 700;
    letter-spacing: -.015em; line-height: 1.25; color: var(--ink);
    font-variant-numeric: tabular-nums; overflow-wrap: anywhere;
  }
  /* Девятнадцать цифр номера извещения не влезают в плитку ни при трёх
     колонках на телефоне, ни при шести на большом мониторе: на них уходит
     около двухсот пикселей, а плитка уже. Уменьшать кегль у всех плиток
     ради одной — терять читаемость НМЦК и процентов, поэтому длинному
     значению даётся свой размер. Порог в четырнадцать знаков подобран по
     живым данным: короче него все значения, кроме номера и даты подачи
     с часовым поясом. */
  .rv-tile b.long { font-size: 12.5px; letter-spacing: 0; line-height: 1.35; }
  /* Предмет закупки на пятнадцать строк растягивал весь ряд, и рядом с ним
     пять плиток стояли пустыми. Подрезаем до четырёх строк, остальное — по
     кнопке под плиткой. Текст в разметке остаётся целиком: поиск по странице
     и копирование должны находить его весь, а не видимую часть. */
  .rv-tile b.clamp {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4;
    line-clamp: 4; overflow: hidden;
  }
  .rv-tile small { display: block; margin-top: 4px; font-size: 12px; color: var(--ink-3); }
  /* Список заказчиков под плиткой. Своя прокрутка, потому что семнадцать
     названий по три строки каждое растянут шапку на два экрана — а шапка
     нужна для того, чтобы окинуть закупку взглядом, а не читать её. */
  .rv-tile-more {
    margin-top: 6px; padding: 0; border: 0; background: none; cursor: pointer;
    font: inherit; font-size: 12px; font-weight: 600; color: var(--brand);
  }
  .rv-tile-more:hover { text-decoration: underline; }
  .rv-tile-list {
    margin: 8px 0 0; padding-left: 16px; max-height: 150px; overflow-y: auto;
    font-size: 12px; line-height: 1.45; color: var(--ink-2);
  }
  .rv-tile-list li { margin-bottom: 3px; }
  .rv-link { color: var(--brand); font-weight: 600; text-decoration: none; }
  .rv-link:hover { text-decoration: underline; }
  /* Тип процедуры. Заказчик 27.08.2026: «электронный аукцион чуть пожирнее,
     выделим. Не сильно, но чуть-чуть» — до этого он тонул серой мелочью под
     законом, хотя от него зависит и площадка, и порядок подачи. */
  .rv-tile small.rv-proc { color: var(--ink-2); font-weight: 600; }

  /* Тело: оглавление и условия. Прокручивается правая колонка, а не окно
     целиком — иначе оглавление уезжает вверх ровно тогда, когда нужно. */
  .rv-body {
    display: grid; grid-template-columns: 252px minmax(0, 1fr);
    border-top: 1px solid var(--line);
  }
  /* Оглавление липнет к верху своей колонки: разделов восемь, и уезжать им
     вместе с условиями незачем — переключаются между ними на любой глубине
     прокрутки. Шапку это не держит, она уходит наверх целиком. */
  .rv-nav {
    padding: 16px 14px 18px; border-right: 1px solid var(--line);
    position: sticky; top: 0; align-self: start;
  }
  .rv-nav-h {
    margin: 0 0 8px 10px; font-size: 10.5px; font-weight: 700;
    letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3);
  }
  /* Пункты были серыми — заказчик 27.08.2026: «разделы какие-то тусклые».
     Между ними переключаются постоянно; серый уместен у счётчика, но не у
     названия раздела. */
  .rv-nav-i {
    display: flex; align-items: center; gap: 10px; width: 100%;
    font: inherit; font-size: 14px; font-weight: 550; text-align: left;
    cursor: pointer; padding: 9px 11px; margin-bottom: 2px;
    border: 0; border-radius: var(--r-md); background: transparent; color: var(--ink);
    transition: background .12s;
  }
  .rv-nav-i:hover { background: var(--ground); }
  .rv-nav-i.on { background: var(--brand-soft); color: var(--brand-deep); font-weight: 700; }
  @media (prefers-color-scheme: dark) { .rv-nav-i.on { color: var(--ink); } }
  :root[data-theme="dark"] .rv-nav-i.on { color: var(--ink); }
  :root[data-theme="light"] .rv-nav-i.on { color: var(--brand-deep); }
  /* Точка у пункта: жёлтая — внутри есть риск или «внимание». По ней видно,
     куда смотреть, не открывая раздел. */
  .rv-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; background: var(--line-strong); }
  .rv-dot.hot { background: var(--warn); }
  .rv-nav-i.on .rv-dot { background: var(--brand); }
  .rv-cnt { margin-left: auto; font-size: 12px; color: var(--ink-3); }

  .rv-promo { margin-top: 16px; padding: 14px; border-radius: var(--r-md); background: var(--ground); }
  .rv-promo b { display: block; font-size: 13.5px; }
  .rv-promo p { margin: 6px 0 12px; font-size: 12.5px; color: var(--ink-3); line-height: 1.45; }
  .rv-docs-btn {
    font: inherit; font-size: 13px; font-weight: 650; cursor: pointer;
    padding: 9px 16px; border: 0; border-radius: var(--r-md);
    background: var(--brand); color: #fff;
  }
  @media (prefers-color-scheme: dark) { .rv-docs-btn { color: #0B0E22; } }
  :root[data-theme="dark"] .rv-docs-btn { color: #0B0E22; }
  :root[data-theme="light"] .rv-docs-btn { color: #fff; }
  .rv-docs ul { margin: 12px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--ink-2); line-height: 1.6; }
  .rv-docs li { overflow-wrap: anywhere; }
  .rv-missing { margin: 10px 0 0; font-size: 12.5px; color: var(--warn); line-height: 1.5; }

  .rv-main { padding: 18px 22px 22px; }
  /* Заголовок раздела. Заказчик 27.08.2026: «в разделах чуть шрифт увеличить,
     более ярко подсветить, чтобы видно было, что это разделы». Прежний кегль
     тонул между шапкой и строками — он был лишь на полтора пункта крупнее
     ответа. Двадцать первый плюс отметка цветом слева читаются как начало
     нового куска даже боковым зрением при прокрутке. */
  .rv-sec-h {
    display: flex; align-items: baseline; gap: 12px; position: relative;
    margin: 0 0 16px; padding: 0 0 12px 14px; border-bottom: 1px solid var(--line);
  }
  .rv-sec-h::before {
    content: ""; position: absolute; left: 0; top: 2px; width: 4px; height: 20px;
    border-radius: 2px; background: var(--brand);
  }
  .rv-sec-h h2 { margin: 0; font-size: 21px; font-weight: 750; letter-spacing: -.02em; color: var(--ink); }
  .rv-sec-c { margin-left: auto; font-size: 12.5px; color: var(--ink-3); }

  /* Строки разбора: слева условие, справа ответ.
   *
   * Вес перевёрнут — подпись плотнее ответа. Заказчик 27.08.2026: «названия
   * пунктов неяркие, ответы очень яркие, как-то наоборот должно быть».
   *
   * Обычно делают наоборот, и мы так и начинали. Но этот список читают не
   * подряд, а поиском: человек ищет глазами нужное условие и только потом
   * читает ответ. Значит взгляд должно ловить условие, а ответ — ждать, пока
   * до него дойдут. Размер остался за ответом: он крупнее на полпункта, так
   * что иерархия не пропала, а поменяла носителя.
   *
   * Сорок строк подряд сливаются — «сливается как-то, может, цветом
   * выделять». Цветом, но там, где он что-то значит:
   *   1. через строку — слабая подложка, держит взгляд на своей строке, когда
   *      ответ уехал вправо на две строки;
   *   2. строки со статусом — полоса слева, жёлтая или красная: по ней видно,
   *      где смотреть, не читая;
   *   3. наведение — подсветка всей строки: на широком экране глаз теряет
   *      строку между условием слева и ответом справа.
   */
  /* Ширина колонки условий — доля строки, а не двести пятьдесят пикселей.
     Фиксированная бралась из макета, где под условия было больше тысячи
     пикселей и четверть строки. В настоящем окне рядом стоит оглавление, на
     условия остаётся около семисот, и та же колонка занимала уже больше
     трети: у коротких названий вроде «НМЦК» справа оставалась пустота в
     полторы сотни пикселей, а ответ читался как отброшенный к правому краю.
     Заказчик 27.08.2026 показал это на закупке 0354200027526000251. */
  .rv-row {
    position: relative; display: grid;
    grid-template-columns: minmax(140px, 30%) minmax(0, 1fr); gap: 22px;
    padding: 15px 14px 15px 16px; border-radius: var(--r-md);
    border-bottom: 1px solid var(--line); transition: background .12s;
  }
  .rv-sec > .rv-row { border-bottom: 1px solid var(--line); }
  .rv-sec > :last-child { border-bottom: 0; }
  /* Подложка лавандовая, а не серая: серый на белом при слабой заливке почти
     не виден. Сила подобрана по двум отвергнутым — 55% «слишком слабая», 62%
     «слишком сильная»; тридцать четыре ровно посередине. */
  /* Считаем по прямым детям раздела: первый из них — заголовок, поэтому
     чётные дети и есть чётные строки, независимо от того, пара это или
     одиночное условие. */
  .rv-sec > :nth-child(even) { background: color-mix(in srgb, var(--brand-soft) 34%, transparent); }
  .rv-sec > .rv-row:hover { background: color-mix(in srgb, var(--brand-soft) 70%, transparent); }
  /* Полоса статуса — в поле отступа: она метит строку, а не сдвигает её. */
  .rv-row.is-warn::before, .rv-row.is-risk::before {
    content: ""; position: absolute; left: 4px; top: 14px; bottom: 14px; width: 3px;
    border-radius: 2px;
  }
  .rv-row.is-warn::before { background: var(--warn); }
  .rv-row.is-risk::before { background: var(--danger); }

  .rv-k { font-size: 14.5px; font-weight: 680; color: var(--ink); line-height: 1.4; padding-top: 1px; }
  .rv-hint { display: block; margin-top: 3px; font-size: 12px; font-weight: 500; color: var(--ink-3); line-height: 1.4; }
  .rv-a { min-width: 0; }
  /* Ответ обычным начертанием: 500 в этой гарнитуре читается как полужирный —
     заказчик 27.08.2026, третий заход: «слишком жирные они выглядят».
     Разницу с подписью держит размер, вес отдан подписи целиком. */
  .rv-v { display: block; font-size: 15px; font-weight: 470; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; }
  /* Краткий ответ первой строкой, подробности под ним и мельче: «Ограничение,
     ПП № 1875» берётся глазом сразу, полная формулировка — если нужна. */
  .rv-lead { display: block; font-weight: 700; margin-bottom: 3px; }
  .rv-lead + .rv-rest { display: block; font-size: 13px; color: var(--ink-2); line-height: 1.5; }
  .rv-row.empty .rv-k { color: var(--ink-2); }
  .rv-row.empty .rv-v { color: var(--ink-3); font-weight: 550; }
  .rv-n { margin: 6px 0 0; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
  .rv-badge {
    float: right; margin-left: 10px; padding: 2px 8px; border-radius: 999px;
    font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  }
  .rv-badge.warn { background: var(--warn-soft); color: var(--warn); }
  .rv-badge.risk { background: var(--danger-soft); color: var(--danger); }

  /* Источник и цитата — одной группой слева, а не по разным краям строки:
     раньше между надписью и словом «цитата» лежало полполя пустоты, и связь
     между ними распадалась. */
  .rv-src {
    display: inline-flex; align-items: center; gap: 10px; margin-top: 9px;
    font: inherit; font-size: 11.5px; text-align: left; cursor: pointer;
    padding: 4px 10px; border: 1px solid var(--line); border-radius: 999px;
    background: var(--surface); color: var(--ink-3); max-width: 100%;
  }
  .rv-src:hover { border-color: var(--line-strong); color: var(--ink-2); }
  .rv-more { flex: none; color: var(--brand); font-weight: 650; }
  /* Цитату показываем как есть, с переносами строк: у документов для участия
     она с 27.08.2026 берётся целиком, а там список пунктов, и склеенный в
     абзац он нечитаем. Высоту ограничиваем — иначе одна цитата уносит
     остальные условия за нижний край. */
  .rv-quote {
    margin-top: 9px; padding: 11px 13px; border-radius: var(--r-md);
    background: var(--ground); border-left: 2px solid var(--line-strong);
    font-size: 12.5px; line-height: 1.6; color: var(--ink-2);
    white-space: pre-wrap; overflow-wrap: anywhere;
    max-height: 320px; overflow-y: auto;
  }

  .rv-foot {
    display: flex; align-items: center; gap: 16px; padding: 14px 22px; flex: none;
    border-top: 1px solid var(--line); background: var(--ground);
    position: sticky; bottom: 0;
  }
  .rv-foot p { margin: 0; font-size: 12px; color: var(--ink-3); line-height: 1.5; }
  .rv-foot .btn-line { margin-left: auto; flex: none; }

  @media (max-width: 880px) {
    .rv-body { grid-template-columns: 1fr; }
    .rv-nav { border-right: 0; border-bottom: 1px solid var(--line); position: static; }
    .rv-row { grid-template-columns: 1fr; gap: 6px; }
  }

  /* Телефон. Заказчик 27.08.2026: «разбор, который открывается основной, он
     тоже очень криво открывается, можем под мобильную версию нормальную
     вёрстку сделать».
   *
   * Окно занимает экран целиком: рамка, скругления и поля вокруг съедали
   * тридцать шесть пикселей ширины из трёхсот девяноста — на телефоне это
   * заметная доля, а показывать сквозь них нечего, за окном всё равно
   * затемнение.
   *
   * Прокрутка при этом одна на всё окно, а не отдельная у колонки условий:
   * вложенная прокрутка пальцем ловится плохо — попадаешь то в окно, то в
   * колонку. Поэтому тело перестаёт быть сеткой с прокруткой внутри и просто
   * течёт сверху вниз: оглавление, потом условия.
   */
  @media (max-width: 620px) {
    .overlay.review { padding: 0; place-items: stretch; }
    .overlay.review .modal { max-height: 100%; border: 0; border-radius: 0; }
    .rv-top { padding: 12px 14px 10px; }
    .rv-cap { padding: 0 14px 14px; }
    .rv-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* На двух колонках телефона плитка сужается до полутора сотен: номеру
       извещения нужен ещё меньший кегль и поля потеснее. */
    .rv-tile { padding: 10px 12px; }
    .rv-tile b.long { font-size: 12.5px; }
    .rv-body { display: block; }
    .rv-nav { padding: 12px 10px 14px; position: static; }
    .rv-main { padding: 16px 14px 20px; }
    /* Оглавление в строку: восемь разделов столбиком отодвигают сами условия
       на второй экран, а нужны они по одному разу. */
    .rv-nav-list { display: flex; flex-wrap: wrap; gap: 6px; }
    .rv-nav-list .rv-nav-i { width: auto; margin: 0; padding: 7px 11px; font-size: 13px; }
    .rv-nav-list .rv-cnt { margin-left: 4px; }
    .rv-sec-h h2 { font-size: 19px; }
    .rv-row { padding: 13px 12px 13px 14px; }
    .rv-k { font-size: 14px; }
    .rv-v { font-size: 14.5px; }
    .rv-quote { max-height: 240px; }
    .rv-foot { flex-wrap: wrap; gap: 10px; padding: 12px 14px; }
    .rv-foot .btn-line { width: 100%; margin-left: 0; }
  }
  /* Любая нажимаемая вкладка выглядит как остальные. Правило было написано
     под `data-tab` — вкладки анкеты, — а «Риски», «Документы» и «Выбор банка»
     кнопки того же вида с другими признаками, и им доставалась рамка кнопки
     от браузера: они читались как что-то особое, чуть ли не служебное.
     Заказчик 03.09.2026: «как будто риски и документы не видны клиенту, не
     надо их визуально выделять». */
  button.stage { cursor: pointer; border: none; font: inherit; font-size: 13px; font-weight: 600; }
  button.stage:hover:not(.on) { background: var(--brand-soft); color: var(--brand); }
  .mbody[hidden] { display: none; }
  .sumline {
    display: flex; gap: 12px; align-items: baseline; justify-content: space-between;
    background: var(--ground); border-radius: var(--r-md);
    padding: 9px 13px; margin-bottom: 16px; font-size: 12.5px; color: var(--ink-2);
  }
  .sumline b { color: var(--ink); font-weight: 650; }
  .sumline .linkbtn { padding: 0; flex: none; font-size: 12.5px; }

  .mbody {
    flex: 1; min-height: 0; display: grid;
    grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
    border-top: 1px solid var(--line); overflow: hidden;
  }
  /* min-width: 0 обязателен. Колонка сетки по умолчанию не уже своего
     содержимого, и одна широкая таблица растягивает её, а с ней и всё окно:
     на телефоне это выглядит как «вёрстка поехала» — текст обрезан справа,
     плитки уходят за край. */
  .pane { padding: 20px 20px 24px; overflow-y: auto; min-height: 0; min-width: 0; }
  .pane.left { border-right: 1px solid var(--line); }
  .pane.ai { background: color-mix(in srgb, var(--brand) 7%, var(--surface)); }
  @media (max-width: 880px) {
    /* Ровно та же оговорка: «1fr» это «minmax(auto, 1fr)», то есть колонка
       шириной с содержимое. На широком экране выше стоит minmax(0, …), а
       здесь стояло голое 1fr — отсюда и разъезжалось только на телефоне. */
    .mbody { grid-template-columns: minmax(0, 1fr); overflow-y: auto; }
    .pane { overflow: visible; }
    .pane.left { border-right: none; border-bottom: 1px solid var(--line); }
  }

  .pane-t { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 14px; }

  .f { margin-bottom: 15px; }
  .f > label { display: block; font-size: 13px; font-weight: 650; margin-bottom: 6px; }
  .f > label i { color: var(--danger); font-style: normal; }
  .f input {
    width: 100%; font: inherit; font-family: var(--mono); font-size: 14px;
    padding: 11px 13px; border-radius: var(--r-md);
    border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink);
    transition: border-color .15s, box-shadow .15s, background .15s;
  }
  .f input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
  .f input[readonly] { background: var(--ground); color: var(--ink-2); border-style: dashed; cursor: default; }
  .f.gap input { border-color: var(--warn); background: var(--warn-soft); }
  .f.bad input { border-color: var(--danger); box-shadow: 0 0 0 3px var(--danger-soft); }
  .f .src-tag {
    display: inline-flex; align-items: center; gap: 5px; margin-top: 6px;
    font-size: 11.5px; font-weight: 600; color: var(--ok);
  }
  .f .src-tag.warn { color: var(--warn); }
  .f .src-tag.edit { color: var(--brand); }
  .f .src-tag i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; }
  .f .fe { color: var(--danger); font-size: 12.5px; margin-top: 6px; display: none; }
  .f.bad .fe { display: block; }
  /* Дата с календарём справа: текстовое поле главное, кнопка открывает
     системный выбор даты, сам системный input спрятан за кнопкой. */
  .f .date-wrap { position: relative; }
  .f .date-wrap input:not(.cal-native) { padding-right: 44px; }
  .f .date-wrap .cal {
    position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
    width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
    border: 0; border-radius: 8px; background: transparent; color: var(--ink-3); cursor: pointer;
  }
  .f .date-wrap .cal:hover { background: var(--brand-soft); color: var(--brand); }
  .f .date-wrap .cal-native {
    position: absolute; right: 6px; top: 50%; width: 32px; height: 32px; margin-top: -16px;
    opacity: 0; padding: 0; border: 0; pointer-events: none;
  }
  .two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  @media (max-width: 460px) { .two { grid-template-columns: 1fr; } }

  .ai-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
  .ai-head h3 { margin: 0; font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
  .ai-tools { display: flex; align-items: center; gap: 8px; flex: none; }
  .ai-tools button {
    font: inherit; font-size: 12px; font-weight: 650; cursor: pointer;
    background: transparent; border: none; color: var(--brand); padding: 4px 2px;
  }
  .ai-tools .vote {
    width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center;
    border: 1px solid color-mix(in srgb, var(--brand) 22%, transparent); color: var(--ink-3);
  }
  .ai-tools .vote.on { background: var(--brand); color: #fff; border-color: var(--brand); }
  @media (prefers-color-scheme: dark) { .ai-tools .vote.on { color: #0B0E22; } }
  :root[data-theme="dark"] .ai-tools .vote.on { color: #0B0E22; }

  .ai-doc { font-size: 13.5px; line-height: 1.62; color: var(--ink-2); }
  .ai-doc h4 {
    margin: 18px 0 8px; font-size: 12.5px; font-weight: 700; color: var(--ink);
    letter-spacing: .04em; text-transform: uppercase;
  }
  .ai-doc h4:first-child { margin-top: 6px; }
  .ai-doc ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
  .ai-doc li { padding-left: 15px; position: relative; }
  .ai-doc li::before {
    content: ""; position: absolute; left: 3px; top: .62em;
    width: 4px; height: 4px; border-radius: 50%; background: color-mix(in srgb, var(--brand) 55%, transparent);
  }
  .ai-doc b { color: var(--ink); font-weight: 650; }
  .ai-doc .nf { color: var(--warn); font-weight: 650; }
  .ai-doc .sum { color: var(--ink); font-weight: 700; font-variant-numeric: tabular-nums; }

  /* ---------- Итог разбора ----------
     Ради этих цифр весь разбор и делается, поэтому они стоят над отчётом, а
     не в его конце: читать полотно, чтобы найти сумму, никто не будет.
     Плитки те же, что в шапке окна, — одна и та же цифра не должна выглядеть
     в двух местах по-разному. */
  .verdict {
    border: 1px solid color-mix(in srgb, var(--brand) 30%, transparent);
    border-radius: var(--r-lg); background: var(--surface);
    padding: 14px 15px 13px; margin: 12px 0 16px;
  }
  .verdict .v-t {
    font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: var(--brand); margin-bottom: 10px;
    display: flex; align-items: center; gap: 8px;
  }

  /* Согласие прогонов — точками, а не словами.
     Разбор идёт несколькими проходами; сколько из них сошлось, менеджеру
     надо видеть с одного взгляда, а клиенту читать про внутреннюю кухню
     сервиса незачем. Заполненная точка — прогон, давший тот же результат. */
  .runs-dots { display: inline-flex; gap: 3px; margin-left: auto; }
  .runs-dots i {
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--line-strong);
  }
  .runs-dots i.on { background: var(--ok); }
  .runs-dots.part i.on { background: var(--warn); }

  /* Список прогонов — временно, на время настройки промпта. Потом останутся
     только точки: клиенту важен итог, а не то, как он получен. */
  .v-runs {
    margin-top: 11px; padding: 9px 12px; border-radius: var(--r-md);
    background: var(--ground); font-size: 12.3px; color: var(--ink-2);
  }
  .v-runs > b {
    display: block; font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase;
    color: var(--ink-3); font-weight: 700; margin-bottom: 6px;
  }
  .v-run { display: flex; align-items: baseline; gap: 9px; padding: 2px 0; }
  .v-run .n {
    width: 15px; height: 15px; flex: none; border-radius: 50%; background: var(--line);
    color: var(--ink-3); font-size: 10px; font-weight: 700;
    display: inline-flex; align-items: center; justify-content: center;
  }
  .v-run .s { font-weight: 650; font-variant-numeric: tabular-nums; min-width: 118px; }
  .v-run .s i { font-style: normal; font-weight: 500; color: var(--warn); }
  .v-run .d { color: var(--ink-3); font-variant-numeric: tabular-nums; }
  .v-run .d b { color: var(--ink-2); font-weight: 650; }
  .v-grid { display: flex; gap: 9px; flex-wrap: wrap; }
  .v-cell { background: var(--ground); border-radius: var(--r-md); padding: 9px 14px; flex: 1 1 auto; min-width: 150px; }
  .v-cell b {
    display: block; font-size: 11px; font-weight: 700; color: var(--brand);
    letter-spacing: .02em; margin-bottom: 3px;
  }
  .v-cell span { font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink); }
  .v-cell .v-none { color: var(--warn); font-weight: 650; font-size: 13px; }

  /* Совместная закупка: своя плитка на каждого заказчика.
     Заказчик 26.08.2026: «две суммы, два срока, можно с названием заказчика,
     в таком же виде, как сейчас одна». Поэтому внутри — та же .v-grid. */
  /* Совместный лот — первой строкой итога, чтобы было понятно сразу */
  .v-lot {
    font-size: 13px;
    color: var(--ink-2);
    background: var(--ground);
    border-radius: var(--r-md);
    padding: 8px 12px;
    margin-bottom: 12px;
    line-height: 1.4;
  }
  .v-lot b { color: var(--ink); }

  .v-joint { margin-top: 12px; }
  .v-joint .v-t { margin-bottom: 8px; }

  .v-jrow {
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 10px 12px;
    margin-bottom: 8px;
  }
  .v-jrow:last-child { margin-bottom: 0; }

  .v-jname {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 13px;
    font-weight: 650;
    color: var(--ink);
    margin-bottom: 8px;
    line-height: 1.35;
  }

  .v-jname .n {
    flex: none;
    font-size: 11px;
    font-weight: 700;
    color: var(--brand);
    background: var(--ground);
    border-radius: 999px;
    min-width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
  }

  .v-jsub { font-size: 12px; color: var(--ink-3); margin-top: 6px; }

  /* Переключатель заказчиков над параметрами гарантии */
  .jtabs {
    background: var(--ground);
    border-radius: var(--r-md);
    padding: 10px 12px;
    margin-bottom: 14px;
  }

  .jt-h { font-size: 12px; color: var(--ink-3); margin-bottom: 8px; }

  .jt-row { display: flex; gap: 6px; flex-wrap: wrap; }

  .jt {
    font: inherit;
    font-size: 13px;
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink-2);
    cursor: pointer;
  }

  .jt:hover { border-color: var(--ink-3); }
  .jt.on { background: var(--brand); border-color: var(--brand); color: #fff; }
  /* В тёмной теме --brand светлый, и белый текст на нём не читается — так же,
     как у .stage.on выше. */
  @media (prefers-color-scheme: dark) { .jt.on { color: #0B0E22; } }
  :root[data-theme="dark"] .jt.on { color: #0B0E22; }
  :root[data-theme="light"] .jt.on { color: #fff; }

  .jt-sel {
    font: inherit;
    font-size: 13px;
    width: 100%;
    padding: 7px 10px;
    border-radius: var(--r-md);
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink);
  }

  .jt-name {
    font-size: 12.5px;
    color: var(--ink);
    font-weight: 600;
    margin-top: 8px;
    line-height: 1.35;
  }

  /* Оговорка под параметрами гарантии. Негромко, но читаемо: это не ошибка и
     не предупреждение, а рамка, в которой стоит понимать цифры выше. */
  .disclaimer {
    margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line);
    font-size: 12.5px; line-height: 1.55; color: var(--ink-3);
  }
  .disclaimer p { margin: 0 0 7px; }
  .disclaimer p:last-child { margin-bottom: 0; }
  .disclaimer b { color: var(--ink-2); font-weight: 650; }

  /* Примечание под параметрами — как в основном сервисе. Сюда выносится
     развилка: за основу взята бо́льшая сумма, а при каком условии заплатят
     меньше, клиент обязан прочитать до того, как согласится с цифрой. */
  .v-note {
    margin-top: 11px; padding: 10px 12px; border-radius: var(--r-md);
    background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 28%, transparent);
    font-size: 12.8px; line-height: 1.5; color: var(--ink-2);
  }
  .v-note b { color: var(--ink); }

  /* Красное предупреждение — сильнее жёлтого примечания. Жёлтым мы помечаем
     оговорку, которую полезно прочитать; красным — то, из-за чего итоговая
     сумма может оказаться неверной. Полоса слева, а не рамка целиком: рамка
     на цветной подложке спорит с соседним примечанием, а полоса выстраивает
     их в очередь по важности. */
  .v-alarm {
    margin-top: 11px; padding: 11px 13px 11px 14px; border-radius: var(--r-md);
    background: var(--danger-soft); border-left: 3px solid var(--danger);
    font-size: 12.8px; line-height: 1.5; color: var(--ink-2);
  }
  .v-alarm b { color: var(--danger); }
  .v-alarm p { margin: 7px 0 0; }
  .v-alarm p b { color: var(--ink); }


  .v-foot {
    margin-top: 12px; display: flex; align-items: center; gap: 11px; flex-wrap: wrap;
    font-size: 12.5px;
  }
  .v-same { color: var(--ok); font-weight: 600; }
  .v-diff { color: var(--ink-3); }
  .v-foot button {
    border: none; background: var(--brand); color: #fff;
    border-radius: var(--r-sm); padding: 8px 14px; font: inherit; font-size: 12.5px;
    font-weight: 650; cursor: pointer; flex: none;
  }
  .v-foot button:hover { background: var(--brand-deep); }

  /* Пока модель читает документацию, панель обязана показывать, что процесс
     идёт, и что именно сейчас читается. Пустое место или застывшая заглушка
     читаются как «зависло», и человек уходит. */
  .ai-wait { display: grid; gap: 14px; }
  .ai-wait-head { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--ink-2); }
  .ai-wait-head b { color: var(--ink); font-weight: 650; }
  .ai-spin {
    width: 15px; height: 15px; flex: none; border-radius: 50%;
    border: 2px solid color-mix(in srgb, var(--brand) 22%, transparent);
    border-top-color: var(--brand); animation: spin .7s linear infinite;
  }
  @keyframes spin { to { transform: rotate(360deg); } }
  .ai-wait-step { font-size: 12.5px; color: var(--ink-3); min-height: 1.4em; }

  /* Курсор в конце текста, который сейчас печатается */
  .ai-doc .cur::after {
    content: ""; display: inline-block; width: 2px; height: 1em;
    background: var(--brand); margin-left: 2px; vertical-align: -.15em;
    animation: blink .9s step-end infinite;
  }
  @keyframes blink { 50% { opacity: 0; } }

  .ai-skel { display: grid; gap: 9px; padding: 8px 0; }
  .ai-skel span {
    height: 11px; border-radius: 6px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--brand) 12%, transparent), color-mix(in srgb, var(--brand) 22%, transparent), color-mix(in srgb, var(--brand) 12%, transparent));
    background-size: 300% 100%; animation: shim 1.1s linear infinite;
  }
  @keyframes shim { from { background-position: 100% 0; } to { background-position: -100% 0; } }

  .warnbox {
    display: flex; gap: 10px; padding: 12px 14px; border-radius: var(--r-md);
    background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 32%, transparent);
    font-size: 12.8px; line-height: 1.5; color: var(--ink-2); margin-bottom: 16px;
  }
  .warnbox b { color: var(--ink); }
  .warnbox svg { flex: none; color: var(--warn); margin-top: 1px; }

  .sugg {
    font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; margin-top: 8px;
    background: var(--surface); border: 1px dashed var(--warn); color: var(--warn);
    padding: 5px 11px; border-radius: 999px;
  }
  .sugg:hover { background: var(--warn-soft); }

  .mfoot {
    display: flex; gap: 10px; align-items: center;
    padding: 14px 18px; border-top: 1px solid var(--line); background: var(--surface);
  }
  .mfoot .spacer { flex: 1; }
  .mfoot .why { font-size: 12px; color: var(--ink-3); }
  .btn-line {
    font: inherit; font-weight: 650; font-size: 14px; cursor: pointer;
    background: var(--surface); color: var(--brand);
    border: 1px solid var(--brand); padding: 11px 20px; border-radius: var(--r-md);
  }
  .btn-line:hover { background: var(--brand-soft); }

  .reopen { display: flex; gap: 10px; align-items: center; margin-top: 12px; }
  .offer .cm { font-size: 11.5px; color: var(--ink-3); }
  .more-btn {
    font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; color: var(--brand);
    background: transparent; border: 1px dashed var(--line-strong); border-radius: var(--r-md);
    padding: 9px 14px; width: 100%;
  }
  .more-btn:hover { border-color: var(--brand); border-style: solid; }

  /* Пояснения внутри отчёта: у строк отступы свои, а у абзаца их не было —
     текст выезжал за край карточки. */
  .tr > .muted { margin: 0; padding: 8px 15px 12px; font-size: 12.5px; }

  /* Закон, по которому исполнен контракт: 44-ФЗ и 223-ФЗ принимаются оба,
     но заказчику в заявке важно видеть, какой именно. */
  .exp-law {
    display: inline-block; padding: 1px 7px; margin-right: 2px;
    border-radius: 999px; background: var(--brand-soft); color: var(--brand-deep);
    font-size: 10.5px; font-weight: 700; letter-spacing: .02em;
  }

  /* ---------- Дашборд проверки контрагента ----------

     Полотно из карточек: ряды выровнены по ширине (12 · 4+4+4 · 8+4 · 6+6),
     иначе неполный ряд оставляет дыру и полотно идёт лесенкой. */
  .dgrid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 12px; }
  .dw {
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-md); box-shadow: var(--shadow-sm); overflow: hidden;
    display: flex; flex-direction: column;
  }
  .dw-head { display: flex; align-items: center; gap: 9px; padding: 13px 16px 0; }
  .dw-head h3 { margin: 0; font-size: 13.5px; font-weight: 700; }
  .dw-head .pill { margin-left: auto; }
  .dw-head .pill + .dw-exp { margin-left: 8px; }
  .dw-exp { margin-left: auto; font-size: 11.5px; padding: 4px 10px; }
  .dw-body { padding: 12px 16px 16px; }
  .dw-12 { grid-column: span 12; } .dw-8 { grid-column: span 8; }
  .dw-6 { grid-column: span 6; } .dw-4 { grid-column: span 4; }
  @media (max-width: 1100px) { .dw-8, .dw-6, .dw-4 { grid-column: span 12; } }

  .dw-kv { display: grid; margin: 0; }
  .dw-kv > div {
    display: flex; gap: 12px; padding: 8px 0; border-top: 1px solid var(--line);
  }
  .dw-kv > div:first-child { border-top: none; }
  .dw-kv dt { flex: 0 0 40%; margin: 0; font-size: 12.5px; color: var(--ink-3); }
  .dw-kv dd { margin: 0; font-size: 13px; font-weight: 600; }
  .dw-sub {
    display: block; margin-top: 2px; font-size: 11.5px; font-weight: 500;
    color: var(--ink-2);
  }

  .dw-vs { display: grid; gap: 7px; margin-bottom: 12px; }
  .dw-v { display: flex; gap: 9px; align-items: flex-start; font-size: 12.5px; }
  .dw-v .dv-dot { margin-top: 5px; }
  .dw-v b { display: block; font-size: 12.5px; }
  .dw-v span span { color: var(--ink-2); }
  .dw-detail {
    margin: 6px 0 10px 17px; padding-left: 9px; font-size: 12px;
    color: var(--ink-2); border-left: 2px solid var(--line);
  }
  .dw-dash { margin: 0; font-size: 12.5px; color: var(--ink-3); }
  .dw-label {
    margin: 0; font-size: 10.5px; font-weight: 700; letter-spacing: .07em;
    text-transform: uppercase; color: var(--ink-3);
  }
  .dw-more {
    width: 100%; margin-top: 8px; padding: 8px; font: inherit; font-size: 12.5px;
    color: var(--ink-2); background: transparent; cursor: pointer;
    border: 1px dashed var(--line-strong); border-radius: var(--r-sm);
  }

  .dw-rel {
    display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px;
    margin-bottom: 8px; border-radius: var(--r-sm); background: var(--ground);
    font-size: 12.5px;
  }
  .dw-rel b { display: block; }
  .dw-rel span span { color: var(--ink-2); }
  .dw-rel .btn-line { margin-left: auto; font-size: 11.5px; padding: 4px 10px; }

  .dw-egs { display: grid; gap: 8px; margin-top: 10px; }
  .dw-egs[hidden] { display: none; }
  .dw-eg {
    display: grid; grid-template-columns: 74px 1fr; gap: 10px;
    padding-bottom: 8px; font-size: 12px; color: var(--ink-2);
    border-bottom: 1px solid var(--line);
  }
  .dw-eg:last-child { border-bottom: none; padding-bottom: 0; }
  .dw-eg-d { color: var(--ink); font-weight: 650; font-variant-numeric: tabular-nums; }

  /* Вкладки внутри карточки */
  .dw-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
  .dw-tab {
    font: inherit; font-size: 12px; padding: 5px 12px; cursor: pointer;
    border-radius: 999px; border: 1px solid var(--line);
    background: var(--surface); color: var(--ink-2);
  }
  .dw-tab.on {
    background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 650;
  }
  .dw-pane[hidden] { display: none; }

  /* Разбор моделью */
  .dw-take { display: grid; gap: 14px; }

  /* Две колонки остались у разбора заказчика (`.dw-cols.cu`): там в обеих
     половинах текст одной природы и одной длины, и колонки не рвутся. Блок
     «Что мы увидели» из них ушёл — см. ниже, почему. */
  .dw-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
  @media (max-width: 900px) { .dw-cols { grid-template-columns: 1fr; } }

  /* Доводы «в плюс» — плитками в поток. Это короткие факты, и в колонку они
     занимали треть её ширины, оставляя две трети пустыми. Плитки набирают
     строку целиком, сколько бы доводов ни пришло. */
  .dw-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
  .dw-chip {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 11px 5px 9px; border-radius: 999px;
    background: var(--ok-soft); border: 1px solid var(--ok-line);
    font-size: 12.5px; color: var(--ink);
  }
  .dw-chip::before {
    content: ""; width: 6px; height: 6px; border-radius: 50%;
    background: var(--ok); flex: none;
  }

  /* Тревоги — карточками во всю ширину. Это объяснения на две-три строки, и
     половина экрана рвала им каждую строку посередине. */
  .dw-warns { display: grid; gap: 8px; margin-top: 7px; }
  .dw-warn {
    padding: 10px 12px 10px 13px; border-radius: var(--r-sm);
    background: var(--warn-soft); border-left: 3px solid var(--warn);
    font-size: 12.5px; line-height: 1.5; color: var(--ink-2);
  }

  /* Разбор заказчика */
  .cu-kind { margin: 2px 0 0; font-size: 16px; font-weight: 700; color: var(--ink); }
  .cu-sum {
    margin: 2px 0 0; font-size: 20px; font-weight: 750; color: var(--ink);
    font-variant-numeric: tabular-nums; letter-spacing: -.02em;
  }
  .cu-why { margin: 3px 0 0; font-size: 12.5px; color: var(--ink-2); }
  /* Пояснение, почему цифры именно такие: у крупного заказчика в реестре
     тысячи дел, а тут три десятка. Без него счёт не сходится на глазах. */
  .cu-note {
    margin: 8px 0 0; padding: 8px 10px; background: var(--ground);
    border-radius: var(--r-md); font-size: 12px; color: var(--ink-2);
  }
  .cu-cases { margin: 10px 0 0; padding: 0; list-style: none; }
  .cu-cases li {
    display: grid; grid-template-columns: auto auto; gap: 2px 10px;
    padding: 6px 0; border-top: 1px solid var(--line);
  }
  .cu-case-n { font-family: var(--mono); font-size: 12px; color: var(--ink-2); }
  .cu-case-s {
    text-align: right; font-size: 12.5px; font-weight: 700;
    font-variant-numeric: tabular-nums;
  }
  .cu-case-t {
    grid-column: 1 / -1; font-size: 11.5px; color: var(--ink-3);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .dw-list { margin: 7px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
  .dw-list li {
    position: relative; padding-left: 16px; font-size: 12.5px; color: var(--ink-2);
  }
  .dw-list li::before {
    content: ""; position: absolute; left: 0; top: 6px;
    width: 6px; height: 6px; border-radius: 2px; background: var(--line-strong);
  }
  .dw-list.plus li::before { background: var(--ok); }
  .dw-list.minus li::before { background: var(--warn); }
  .dw-list.stop li::before { background: var(--danger); }
  .dw-list.ask li::before { background: var(--brand); }
  .dw-out {
    padding: 12px 14px; border-radius: var(--r-sm); background: var(--ground);
    font-size: 12.5px; color: var(--ink-2);
  }
  .dw-line { margin: 8px 0 0; font-size: 13.5px; color: var(--ink); }

  /* Разворот карточки на весь экран */
  .dw-hole { visibility: hidden; }
  .dw-over {
    position: fixed; inset: 0; z-index: 60; padding: 24px;
    background: rgba(16, 20, 58, .45); backdrop-filter: blur(2px);
    display: flex; align-items: stretch; justify-content: center;
  }
  .dw-over[hidden] { display: none; }
  .dw-over > .dw { width: min(1280px, 100%); max-height: 100%; grid-column: auto; }
  .dw-over .dw-body { overflow: auto; }
  .dw-over .dv-table-wrap { max-height: none; }
  .dw-over-x { position: absolute; top: 14px; right: 18px; z-index: 61; }

  /* Реестр: точки, фильтры, карточки */
  .reg { display: grid; gap: 10px; }
  .reg-roles { display: flex; gap: 18px; flex-wrap: wrap; }
  .reg-role {
    flex: 1 1 140px; min-width: 120px; padding: 0; text-align: left; font: inherit;
    background: transparent; border: none; color: var(--ink-3); cursor: pointer;
  }
  .reg-role b {
    display: block; font-size: 16px; font-weight: 750; letter-spacing: -.02em;
  }
  .reg-role span { display: block; margin-top: 2px; font-size: 12.5px; }
  .reg-role i {
    display: block; height: 3px; margin-top: 7px; border-radius: 2px;
    background: var(--line); font-style: normal;
  }
  .reg-role.on { color: var(--ink); }
  .reg-role.on i { background: var(--brand); }
  .reg-role:disabled { opacity: .55; cursor: default; }

  .reg-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
  .reg-chip {
    font: inherit; font-size: 12px; padding: 5px 12px; cursor: pointer;
    border-radius: 999px; border: 1px solid var(--line);
    background: var(--surface); color: var(--ink-2);
  }
  .reg-chip.on {
    background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 650;
  }
  .reg-sort { margin-left: auto; display: flex; gap: 6px; align-items: center; }

  /* Поиск по реестру. Правила у него не было вовсе — поле рисовал браузер:
     чёрная рамка в один пиксель, прямые углы, чужой шрифт. Рядом с круглыми
     фишками фильтра это выглядело деталью из другого приложения. Заказчик
     27.08.2026: «совершенно кривое окошко, очень старое как-то выглядит».

     Лупа нарисована фоном, а не значком в разметке: поле создаётся кодом в
     трёх местах, и вставлять туда svg значило бы держать три копии одного
     рисунка. Крестик очистки у `type=search` в вебките свой — оставляем его,
     но приводим к нашему цвету. */
  .find {
    flex: 1 1 200px; min-width: 160px; max-width: 320px;
    font: inherit; font-size: 12.5px; color: var(--ink);
    padding: 7px 12px 7px 32px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--surface);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23838AA6' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.6-3.6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: 11px 50%;
    transition: border-color .14s, box-shadow .14s;
    -webkit-appearance: none; appearance: none;
  }
  .find::placeholder { color: var(--ink-3); }
  .find:hover { border-color: var(--line-strong); }
  .find:focus {
    outline: none; border-color: var(--brand);
    box-shadow: 0 0 0 3px var(--brand-soft);
  }
  .find::-webkit-search-cancel-button {
    -webkit-appearance: none; appearance: none;
    width: 13px; height: 13px; cursor: pointer;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%23838AA6' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E") center/contain no-repeat;
  }

  .reg-plot {
    position: relative; padding: 8px 6px 2px; border-radius: var(--r-sm);
    background: var(--ground);
  }
  .reg-plot svg { width: 100%; height: auto; display: block; overflow: visible; }
  .plot-band { fill: var(--line); fill-opacity: .28; }
  .plot-grid { stroke: var(--line-strong); stroke-width: 1; stroke-dasharray: 2 4; }
  .plot-base { stroke: var(--line-strong); stroke-width: 1.5; }
  .plot-tick { stroke: var(--line-strong); stroke-width: 1; }
  .plot-t { fill: var(--ink-3); font-size: 10px; font-weight: 600; }
  .plot-dot { stroke: var(--surface); stroke-width: 1.5; cursor: pointer; }
  .plot-dot.hot { stroke-width: 3; }
  .plot-dot.win { fill: var(--ok); }
  .plot-dot.against { fill: var(--danger); }
  .plot-dot.by { fill: var(--ink-2); }
  .plot-dot.closed { fill-opacity: .4; }

  .reg-tip {
    position: absolute; z-index: 6; width: 260px; pointer-events: none;
    padding: 10px 12px; transform: translate(-50%, -100%);
    background: var(--surface); border: 1px solid var(--line);
    border-radius: var(--r-sm); box-shadow: var(--shadow-md);
  }
  .reg-tip[hidden] { display: none; }
  .reg-tip-h {
    display: flex; gap: 8px; align-items: center; font-size: 12px; color: var(--ink-2);
  }
  .reg-tip-n { margin: 6px 0 0; font-size: 13px; font-weight: 650; color: var(--ink); }
  .reg-tip-s {
    margin: 3px 0 0; font-size: 15px; font-weight: 750;
    font-variant-numeric: tabular-nums; color: var(--ink);
  }
  .reg-tip-w { margin: 6px 0 0; font-size: 12px; color: var(--ink-2); }

  .reg-list { display: grid; gap: 8px; }
  .reg-card {
    padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--r-sm);
    background: var(--surface);
  }
  .reg-card.hit { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
  .reg-card-t { display: flex; gap: 9px; align-items: baseline; flex-wrap: wrap; }
  .reg-card-d {
    font-size: 12.5px; color: var(--ink-2); font-variant-numeric: tabular-nums;
  }
  .reg-card-no { font-family: var(--mono); font-size: 12px; color: var(--ink-2); }
  a.reg-card-no {
    color: var(--brand); text-decoration: none; border-bottom: 1px dotted currentColor;
  }
  .reg-card-s {
    margin-left: auto; font-weight: 750; font-variant-numeric: tabular-nums;
  }
  .reg-card-n { margin: 4px 0 0; font-size: 13px; font-weight: 600; }
  .reg-card-m { margin: 3px 0 0; font-size: 12.5px; color: var(--ink-2); }
  .reg-card-m b { font-weight: 600; color: var(--ink); }

/* --------------------------------------------------------------------------
   Вход и личный кабинет
   --------------------------------------------------------------------------
   Форма приходит не первым экраном, а на «начать»: витрину и описание
   продуктов гость смотрит свободно, и решает, нужно ли ему это, до того как
   его о чём-то попросят. Решение заказчика 31.08.2026.

   Регистрация и вход остались одной карточкой — человек редко помнит, заводил
   он здесь аккаунт или нет, и две отдельные страницы заставляли бы его
   вспоминать. Но открывается всегда регистрация. */

.gate {
  min-height: 70vh;
  display: grid;
  place-items: center;
  padding: 40px 20px;
}

.gate-card {
  width: 100%;
  max-width: 400px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 28px 26px 22px;
  box-shadow: var(--shadow-soft, 0 1px 2px rgba(0, 0, 0, .04));
}

.gate-card h1 { font-size: 22px; margin: 0 0 8px; color: var(--ink); }

/* Огонёк в заголовке регистрации — тот же знак, что на витрине и на полосе
   пробы.

   Выравниваем не базовой линией, а flex-центром: у эмодзи своя метрика, и
   `vertical-align` его не слушается — знак повисал выше строки. Центр
   надёжнее, потому что не зависит от того, какой шрифт подставит система под
   эмодзи. */
#gate-title {
  display: flex;
  align-items: center;
  gap: 8px;
}

.gate-fire {
  font-size: 19px;
  line-height: 1;
  flex-shrink: 0;
}

.gate-sub {
  margin: 0 0 20px;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink-2);
}

.gate-card .f { margin-bottom: 14px; }
.gate-card .primary { width: 100%; }

.gate-err {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--bad, #b3261e);
  background: var(--bad-soft, rgba(179, 38, 30, .08));
  border-radius: var(--r-sm);
  padding: 8px 11px;
}

/* «Забыли пароль?» — справа под полем, мелко: это запасной ход, а не
   равноправная кнопка рядом с «Войти». */
/* Поле пароля с глазком. Кнопка лежит поверх поля справа, поэтому полю
   нужен правый отступ — иначе длинный пароль уезжает под неё. */
.pw { position: relative; }
.pw > input { width: 100%; padding-right: 44px; }
.pw-eye {
  position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
  width: 32px; height: 32px; padding: 0; border: 0; background: none;
  cursor: pointer; border-radius: 8px; color: var(--ink-3);
  display: flex; align-items: center; justify-content: center;
}
.pw-eye:hover { color: var(--ink-2); background: var(--ground); }
.pw-eye svg { display: block; }

.gate-forgot { margin: -6px 0 14px; text-align: right; font-size: 13px; }
/* То же место, что у ошибки, но без тревоги: «письмо ушло» — не сбой. */
.gate-err.ok { background: var(--ok-soft); color: var(--ok); }

.gate-switch {
  margin: 16px 0 0;
  font-size: 13px;
  color: var(--ink-2);
  text-align: center;
}

.gate-switch .linkbtn { font-size: 13px; }

/* Вкладки «Регистрация | Вход». Открывается всегда регистрация: новых здесь
   больше, чем возвращающихся, и предлагать им надо пробу, а не турникет. Но
   вход стоит рядом и на виду — человек с аккаунтом не должен искать его
   глазами среди мелкого шрифта. */

.gate-tabs {
  display: flex;
  gap: 4px;
  margin: 0 0 18px;
  padding: 3px;
  background: var(--ground);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}

.gate-tab {
  flex: 1;
  border: 0;
  background: none;
  padding: 8px 10px;
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink-2);
  border-radius: var(--r-sm);
  cursor: pointer;
}

.gate-tab.on {
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}

/* Куда человек шёл, когда его остановила форма. */
.gate-intent {
  margin: 0 0 14px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--brand-deep);
  background: var(--brand-soft);
  border-radius: var(--r-sm);
  padding: 9px 12px;
}

/* В тёмной теме `--brand-deep` почти чёрный, и на тёмной же плашке он
   пропадает. Там читаемее обычный основной цвет текста. */
:root[data-theme="dark"] .gate-intent { color: var(--ink); }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .gate-intent { color: var(--ink); }
}

/* Подсказка под полем — зачем нам это поле. Про ИНН объяснить надо: без
   объяснения лишнее поле в форме читается как назойливость. */
.gate-hint {
  margin: 6px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--ink-3);
}

/* Найденная компания на втором шаге регистрации. Тот же смысл, что у карточки
   в чате: человек должен узнать свою фирму, а не поверить строке цифр. */
.gate-company {
  margin: 0 0 14px;
  padding: 12px 14px;
  background: var(--ground);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}

.gate-company .gc-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.35;
}

.gate-company .gc-line {
  margin-top: 4px;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--ink-2);
}

.gate-company .gc-warn { color: var(--danger); font-weight: 600; }

.gate-company .gc-ask {
  margin-top: 9px;
  color: var(--ink);
  font-weight: 600;
}

/* «Назад» на втором шаге — к почте и паролю. Не кнопка: уводить взгляд с
   основного действия ей незачем. */
.gate-back {
  display: block;
  margin: 12px auto 0;
  font-size: 13px;
}

/* --- страница тарифов ---
   Отдельной ссылкой /tariffs: платёжный сервис требует, чтобы описание услуги,
   цены и реквизиты были публично доступны. Разметку собирает сервер, поэтому
   классы здесь простые и без зависимости от скрипта. */

.tariffs {
  max-width: 900px;
  margin: 0 auto;
  padding: 32px 20px 64px;
}

.tariffs-head { text-align: center; margin-bottom: 32px; }
.tariffs-head h1 { font-size: 28px; margin: 0 0 10px; color: var(--ink); }

.tariffs-head p {
  margin: 0 auto;
  max-width: 620px;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink-2);
}

.tariffs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 12px;
}

.tariff {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 22px 20px;
  box-shadow: var(--shadow-sm);
}

.tariff .t-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--brand);
}

.tariff .t-price {
  margin-top: 10px;
  font-size: 30px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.1;
}

.tariff .t-period { font-size: 12.5px; color: var(--ink-3); }

.tariff .t-n {
  margin-bottom: 2px;
  margin-top: 14px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink);
}



.tariff .t-note {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--ink-2);
}

/* Проба — полосой под тарифами, а не четвёртой плиткой в ряду. В ряду человек
   сравнивает цены, а у пробы цены нет: она бы читалась как «тариф за 0 ₽».
   И это ссылка-кнопка: единственное, чего мы ждём от читателя страницы, —
   попробовать, а не дочитать.

   Белая, как плитки тарифов: синяя заливка спорила с ними за внимание и
   выглядела рекламной вставкой, а не частью прейскуранта. Выделяем не цветом
   фона, а огоньком и рамкой — тем же приёмом, что и «TOP» на витрине. */
.tariffs-try {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin: 0 0 12px;
  padding: 15px 20px;
  text-decoration: none;
  background: var(--surface);
  border: 1px solid var(--brand);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
}
.tariffs-try:hover { box-shadow: var(--shadow-md); }

/* Огонёк крупнее подписи — он тут и есть знак. Эмодзи сидит выше базовой
   линии, поэтому центрируем и слегка опускаем, как в `.top-flag`. */
.tariffs-try .tt-fire {
  font-size: 22px; line-height: 1; transform: translateY(1px); flex-shrink: 0;
}

.tariffs-try .tt-c { flex: 1 1 260px; }

.tariffs-try .tt-n {
  display: block; font-size: 16px; font-weight: 700; color: var(--ink);
}
.tariffs-try .tt-d {
  display: block; margin-top: 2px; font-size: 13px; color: var(--ink-2);
}
.tariffs-try .tt-go {
  font-size: 14px; font-weight: 700; color: var(--brand); white-space: nowrap;
}

.tariffs-vat {
  margin: 0 0 32px;
  font-size: 12.5px;
  color: var(--ink-3);
  text-align: center;
}

.tariffs-block { margin-bottom: 26px; }

.tariffs-block h2 {
  font-size: 16px;
  margin: 0 0 8px;
  color: var(--ink);
}

.tariffs-block p {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-2);
}

/* Оферта. Мельче основного текста и с отбивкой между пунктами: её читают не
   подряд, а ищут в ней нужный абзац. */
/* Класс намеренно `oferta`, а не `offer`: `.offer` в этом файле уже занят
   карточкой банка в подборе — она сетка на три колонки, и оферта под ней
   разъезжалась в столбик с наложением строк.

   Свёрнута по умолчанию: восемь разделов простынёй под прейскурантом мешают
   читать то, за чем человек пришёл. Раскрывается нативным <details> — без
   скрипта и с текстом, который всё равно лежит в разметке: проверяющему из
   платёжного сервиса он виден. */
.oferta {
  margin-top: 40px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.oferta > summary {
  cursor: pointer;
  list-style: none;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  background: var(--surface);
  /* Якорь для стрелки: без него она считает края от страницы и уезжает
     к правому краю окна. */
  position: relative;
  padding-right: 44px;
}
.oferta > summary::-webkit-details-marker { display: none; }
.oferta > summary:hover { border-color: var(--line-strong); }

.oferta > summary .of-h {
  display: block; font-size: 15px; font-weight: 700; color: var(--ink);
}
.oferta > summary .of-x {
  display: block; margin-top: 2px; font-size: 12.5px; color: var(--ink-2);
}

/* Своя стрелка вместо треугольника браузера: он рисуется по-разному и не
   слушается цвета. Поворачивается при раскрытии. */
.oferta > summary::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  width: 8px; height: 8px;
  margin-top: -6px;
  border-right: 2px solid var(--ink-3);
  border-bottom: 2px solid var(--ink-3);
  transform: rotate(45deg);
  transition: transform .15s;
}
.oferta[open] > summary::after {
  transform: rotate(-135deg);
  margin-top: -2px;
}

.oferta[open] > summary { margin-bottom: 18px; }

.oferta h3 {
  margin: 22px 0 8px;
  font-size: 14px;
  color: var(--ink);
}

.oferta p { font-size: 13px; line-height: 1.65; margin-bottom: 6px; }
.oferta .oferta-lead { font-size: 14px; color: var(--ink); }
.oferta .oferta-sub { padding-left: 18px; }

/* Два варианта суммы: без аванса и с ним. Кнопки, а не радиокнопки: человек
   не «отмечает опцию», а подставляет число в поле — и должен видеть, какое
   именно. Выбранный помечаем, чтобы после подстановки было понятно, где он. */
.sumvars { margin-top: 12px; display: grid; gap: 7px; }

.sumvars .sv-t {
  font-size: 11.5px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: var(--ink-3);
}

.sumvars .sv {
  display: block; width: 100%; text-align: left; cursor: pointer;
  padding: 10px 12px; border: 1px solid var(--line);
  background: var(--surface); border-radius: var(--r-md); font: inherit;
}
.sumvars .sv:hover { border-color: var(--line-strong); }
.sumvars .sv.on { border-color: var(--brand); background: var(--brand-soft); }

/* «Посчитать оба» — третий выход, а не третья сумма: у него нет числа. Но
   рамка у него та же, что у вариантов: пунктирная читалась как «недоступно»
   и терялась рядом со сплошными. Заказчик 04.09.2026: «давай такую же рамку,
   а то она менее заметная». Отличает его теперь не рамка, а отступ сверху и
   синий заголовок вместо суммы. */
.sumvars .sv-both { margin-top: 6px; }
.sumvars .sv-both .sv-n { font-size: 13.5px; color: var(--brand); }

.sumvars .sv-n {
  display: block; font-size: 15px; font-weight: 700; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
.sumvars .sv-d {
  display: block; margin-top: 2px; font-size: 12px; line-height: 1.45;
  color: var(--ink-2);
}

.req-name { font-size: 14.5px; font-weight: 600; color: var(--ink); }

.req-line {
  margin-top: 5px;
  font-size: 13.5px;
  color: var(--ink-2);
}

.req-line span {
  display: inline-block;
  min-width: 74px;
  color: var(--ink-3);
}

/* Строка над продуктами: что мы начислили или почему не начислили. */
.launcher-note {
  margin: 0 auto 22px;
  max-width: 720px;
  font-size: 13.5px;
  line-height: 1.5;
  text-align: center;
  color: var(--ink);
  background: var(--ok-soft);
  border: 1px solid var(--ok-line);
  border-radius: var(--r-md);
  padding: 10px 16px;
}

.launcher-note.warn {
  background: var(--warn-soft);
  border-color: var(--warn);
}

/* --- кабинет --- */

.acc-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
}

.acc-name { font-size: 17px; font-weight: 700; color: var(--ink); }
.acc-mail { font-size: 13px; color: var(--ink-2); margin-top: 2px; }

.acc-warn {
  font-size: 11.5px;
  color: var(--warn, #8a5a00);
  background: var(--warn-soft, rgba(138, 90, 0, .1));
  border-radius: 999px;
  padding: 1px 8px;
  margin-left: 6px;
}

.acc-actions { display: flex; gap: 8px; }

.acc-body {
  grid-template-columns: minmax(280px, 360px) 1fr;
  overflow-y: auto;
}

.acc-pane { padding: 18px 20px; }

.acc-h {
  font-size: 12px;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin: 0 0 12px;
}

.acc-pane form + .acc-h { margin-top: 26px; }
.acc-pane .f { margin-bottom: 12px; }

.acc-hint {
  margin: 0 0 12px;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--ink-3);
}

.acc-msg {
  margin: 0 0 10px;
  font-size: 13px;
  border-radius: var(--r-sm);
  padding: 7px 10px;
}

.acc-msg.ok { color: var(--good, #1e6b3a); background: var(--good-soft, rgba(30, 107, 58, .08)); }
.acc-msg.bad { color: var(--bad, #b3261e); background: var(--bad-soft, rgba(179, 38, 30, .08)); }

.acc-history { border-left: 1px solid var(--line); }
.acc-history .history-head { margin-bottom: 10px; }
.acc-history .history-head h2:empty { display: none; }

@media (max-width: 860px) {
  .acc-body { grid-template-columns: 1fr; }
  .acc-history { border-left: 0; border-top: 1px solid var(--line); }
}

/* Остаток запросов и тарифы в кабинете */

.acc-quota {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--line);
  background: var(--ground);
}

.acc-quota.out { background: var(--danger-soft); }

.acc-q-n {
  font-size: 22px;
  font-weight: 750;
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.acc-quota.out .acc-q-n { color: var(--danger); }
.acc-q-t { font-size: 13px; color: var(--ink-2); }

/* Вкладки кабинета. Тарифы вынесены отдельно: в общем столбце с профилем,
   юрлицами и паролем до них надо было прокрутить весь кабинет. */
.acc-tabs { display: flex; gap: 4px; padding: 3px; background: var(--ground); border-radius: 999px; }
.acc-tab {
  border: 0; background: none; font: inherit; font-size: 13px; font-weight: 600;
  color: var(--ink-3); padding: 6px 14px; border-radius: 999px; cursor: pointer;
}
.acc-tab.on { background: var(--surface); color: var(--ink); box-shadow: 0 1px 2px rgba(0,0,0,.08); }

/* Вкладка тарифов — одна широкая колонка вместо двух: три тарифа рядом
   читаются как выбор, а столбиком — как длинный список. */
.acc-billing { display: block; }
.acc-pane-wide { max-width: 900px; margin: 0 auto; }
.acc-pane-wide .acc-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.acc-pane-wide .acc-plan { display: flex; flex-direction: column; }
.acc-pane-wide .acc-plan-d { flex: 1; }
/* Почта в профиле: значение, состояние и кнопка в одну строку. */
.acc-mail-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-height: 34px; }
.acc-mail-v { color: var(--ink); overflow-wrap: anywhere; }
.acc-ok { font-size: 12px; font-weight: 600; color: var(--ok); }

.acc-payer { max-width: 640px; margin-bottom: 6px; }
.acc-payer select.plain { width: 100%; }
/* Плательщик чипами (09.09.2026) */
.acc-payer-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.acc-chip { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--surface); cursor: pointer; font: inherit; text-align: left; color: var(--ink); }
.acc-chip b { font-size: 13.5px; }
.acc-chip span { font-size: 12px; color: var(--ink-3); }
.acc-chip.on { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.acc-chip-other { border-style: dashed; }
/* Юрлица с папками (09.09.2026) */
.acc-companies-pane { border-left: 1px solid var(--line); }
.acc-company { border: 1px solid var(--line); border-radius: 12px; margin-bottom: 10px; background: var(--surface); }
.acc-company-h { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 14px; cursor: pointer; }
.acc-company-sub { font-size: 12.5px; margin-top: 3px; }
.acc-company-acts { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.acc-primary { display: inline-block; font-size: 11.5px; color: #1f7a3a; background: #e6f6ea; border-radius: 999px; padding: 1px 8px; margin-left: 6px; vertical-align: middle; }
/* Папка юрлица (17.09.2026): группа — шапка с кнопкой справа, файлы строками */
.acc-folder { border-top: 1px solid var(--line); padding: 12px 14px 14px; display: grid; gap: 14px; background: var(--ground); border-radius: 0 0 12px 12px; }
.acc-folder-g { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.acc-folder-h { display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; flex-wrap: wrap; }
.acc-folder-t { font-weight: 650; font-size: 13.5px; color: var(--ink); }
.acc-folder-n { font-weight: 500; font-size: 12px; color: var(--ink-3); margin-left: 4px; }
.acc-files { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 2px; }
.acc-files li { display: flex; align-items: center; gap: 10px; padding: 6px 4px; border-radius: 8px; font-size: 13px; }
.acc-files li:hover { background: var(--ground); }
.acc-file-ext { flex: none; width: 38px; height: 26px; display: grid; place-items: center; border-radius: 6px;
  background: var(--brand-soft); color: var(--brand); font-size: 10.5px; font-weight: 700; letter-spacing: .02em; }
.acc-file-main { min-width: 0; flex: 1; }
.acc-file-main a { color: var(--ink); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.acc-file-main a:hover { color: var(--brand); text-decoration: underline; }
.acc-file-meta { font-size: 12px; color: var(--ink-3); margin-top: 1px; }
.acc-files li .acc-x { margin-left: auto; opacity: .5; }
.acc-files li:hover .acc-x { opacity: 1; }
.acc-upload { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.acc-upload select.plain { max-width: 260px; font-size: 12.5px; padding: 6px 10px; border-radius: var(--r-md); }
.acc-upload-btn { display: inline-flex; align-items: center; padding: 6px 12px; border: 1px solid var(--brand); border-radius: var(--r-md);
  color: var(--brand); background: var(--surface); font-size: 12.5px; font-weight: 650; cursor: pointer; white-space: nowrap; }
.acc-upload-btn:hover { background: var(--brand-soft); }
.acc-upload-btn:focus-within { outline: 2px solid var(--brand); outline-offset: 2px; }
/* Карточка «Добавить юр. лицо» — пунктиром, в ряд с карточками юрлиц (11.09.2026) */
/* «Добавить юр. лицо» — карточка в ряд с юрлицами: текст слева, поле с
   кнопкой одним блоком справа (заказчик 17.09.2026: «топорная форма») */
.acc-add-company { display: flex; align-items: center; justify-content: space-between; gap: 12px 20px; flex-wrap: wrap;
  border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; margin-top: 4px; background: var(--ground); }
.acc-add-text { min-width: 0; flex: 1 1 240px; }
.acc-add-t { display: flex; align-items: center; gap: 8px; font-weight: 650; font-size: 14px; color: var(--ink); }
.acc-add-plus { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%;
  background: var(--brand-soft); color: var(--brand); font-weight: 700; font-size: 15px; line-height: 1; }
.acc-add-hint { margin: 4px 0 0 30px; font-size: 12.5px; }
.acc-add-row { display: flex; align-items: stretch; flex: 1 1 300px; max-width: 420px; }
.acc-add-row input.plain { flex: 1 1 auto; min-width: 0; padding: 10px 14px; font-size: 14px; font-family: var(--sans);
  background: var(--surface); border: 1px solid var(--line-strong); border-right: 0; border-radius: var(--r-md) 0 0 var(--r-md); }
.acc-add-row input.plain:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.acc-add-row .primary { flex: 0 0 auto; padding: 10px 18px; border-radius: 0 var(--r-md) var(--r-md) 0; }
.acc-add-company .acc-msg { flex-basis: 100%; }
.acc-add-company .acc-msg { margin: 8px 0 0; }

@media (max-width: 860px) {
  .acc-pane-wide .acc-plans { grid-template-columns: 1fr; }
}

/* Строка счёта с крестиком: сама ссылка тянется, кнопка стоит справа. */
.acc-bill-row { display: flex; align-items: center; gap: 6px; }
.acc-bill-row .acc-bill { flex: 1; min-width: 0; }

.acc-plans { display: grid; gap: 8px; margin-bottom: 6px; }

.acc-plan {
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  padding: 10px 12px;
  background: var(--surface);
}

.acc-plan.on { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.acc-plan-t { display: flex; align-items: baseline; gap: 8px; }
.acc-plan-p { margin-left: auto; font-weight: 700; font-variant-numeric: tabular-nums; }
.acc-plan-d { font-size: 12.5px; color: var(--ink-2); margin: 3px 0 8px; }

/* Счета в кабинете */

.acc-bills { display: grid; gap: 6px; margin-bottom: 6px; }

.acc-bill {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: var(--r-sm);
  background: var(--surface);
  color: var(--ink);
  text-decoration: none;
  font-size: 13px;
}

.acc-bill:hover { border-color: var(--line-strong); }
.acc-bill b { font-variant-numeric: tabular-nums; }
.acc-bill span { color: var(--ink-2); }

.acc-bill-s { margin-left: auto; font-size: 12px; }
.acc-bill-s.paid { color: var(--ok); }
.acc-bill-s.cancelled { color: var(--ink-3); }
.acc-bill-s.refunded { color: var(--warn, #a86400); }

/* Вкладки отчёта: старый промпт со скриптом и новый начисто */

.rep-tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.rep-tab {
  font: inherit;
  font-size: 12.5px;
  color: var(--ink-2);
  background: var(--ground);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 12px;
  cursor: pointer;
}

.rep-tab:hover { border-color: var(--line-strong); color: var(--ink); }
.rep-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 600; }

.rep-note {
  margin: 0 0 14px;
  font-size: 12.5px;
  color: var(--ink-3);
  line-height: 1.45;
}


/* ---------- Досье контрагента на телефоне ----------
   Окно это самое плотное в сервисе: плитки, таблицы, графики и длинные
   строки вроде списка телефонов. На узком экране всё то же самое должно
   читаться сверху вниз, а не уезжать вправо — горизонтальная прокрутка
   страницы читается как поломка, и человек не понимает, что часть данных
   просто за краем.

   Заказчик 30.08.2026: «с телефона в этих больших окнах едет вёрстка». */
@media (max-width: 620px) {
  /* Плитки — по одной в ряд. Две помещаются только по ширине, но не по
     смыслу: значение в них крупное, и в половину экрана оно переносится
     посреди числа. */
  .dv-stats { grid-template-columns: 1fr; gap: 8px; padding: 12px; }
  .dv-stat { padding: 10px 12px; }

  /* Ключ над значением, а не рядом: сорок процентов ширины под подпись
     оставляют значению полтора слова. */
  .dw-kv > div { flex-direction: column; gap: 2px; }
  .dw-kv dt { flex: none; }

  /* Адреса почты, телефоны, названия организаций — рвём по любому месту:
     иначе одна длинная строка снова растягивает окно. */
  .dw-kv dd, .dv-stat-v, .tr-row, .dv-verdict, .dv-need {
    overflow-wrap: anywhere;
  }

  /* Таблица шире экрана не растягивает окно, а прокручивается внутри себя.
     Полоса прокрутки у неё своя — это и подсказывает, что там есть ещё
     колонки. */
  .dv-table { margin: 10px 12px 12px; }
  .dv-table-wrap { max-height: 60vh; }

  /* Графику хватает всей ширины: в две колонки столбцы становятся уже
     подписи под ними. */
  .dv-charts { grid-template-columns: 1fr; padding: 10px 12px 4px; }

  /* Полотно виджетов — в одну колонку, без внутренних отступов по 20px:
     на экране в 375 точек они съедают десятую часть ширины. */
  .dgrid { gap: 10px; }
  .dw-body { padding: 10px 12px 12px; }
  .dw-head { padding: 11px 12px 0; }
}


/* ---------- Гарантия на телефоне: параметры и предложения банков ----------
   Те же две болезни, что и в досье: сетки в две колонки на 375 точках и
   таблица шире экрана. Лечится тем же — колонки в одну, таблице своя
   прокрутка, а имя банка при этой прокрутке остаётся на месте.

   Заказчик 30.08.2026: «в продукте банковская гарантия так же сделаем — там,
   где параметры рассчитываем и где предложения банков». */
@media (max-width: 620px) {
  /* Поля анкеты — по одному в ряд. Две колонки в анкете переключались только
     на 460 точках: между 460 и 620 «Сумма» и «Срок» стояли рядом, и в каждое
     помещалось по три цифры. */
  .two { grid-template-columns: 1fr; }

  /* Предложение банка: значок, название и цена не помещаются в строку —
     цена уходит под название, к левому краю. Прижимать её вправо на узком
     экране незачем: сравнивать всё равно приходится по вертикали. */
  .offer { grid-template-columns: 30px minmax(0, 1fr); gap: 10px; padding: 11px 12px; }
  .offer .price { grid-column: 2; text-align: left; margin-top: 2px; }

  /* Таблица банков остаётся таблицей: колонок в ней десяток, и карточками
     они читаются хуже, чем строкой. Но имя банка при горизонтальной
     прокрутке должно оставаться на виду — иначе непонятно, чья это цена. */
  table.banks { min-width: 720px; font-size: 12.5px; }
  .banks th, .banks td { padding: 8px 9px; }
  .banks td:first-child, .banks th:first-child {
    position: sticky; left: 0; z-index: 2;
    max-width: 160px; background: var(--surface);
    box-shadow: 1px 0 0 var(--line);
  }
  .banks tr.best td:first-child { background: color-mix(in srgb, var(--ok) 6%, var(--surface)); }
  .bs2 { max-width: 140px; }

  /* Ряд предложений внизу окна — тоже в столбик. */
  .offers { gap: 8px; }
}


/* ---------- Любое большое окно на телефоне — во весь экран ----------
   Окно разбора тендера так и открывалось, а параметры гарантии и список
   банков оставались «карточкой» с полями по 18 точек с каждой стороны. На
   экране в 375 точек это десятая часть ширины, и содержимое из карточки
   вылезало: таблица банков, плитки, длинные значения. Выглядело как поехавшая
   вёрстка, хотя причина была в рамке вокруг.

   Заказчик 30.08.2026: «пока плывёт вёрстка в банковской гарантии — с
   телефона, и в параметрах, и в банках». */
@media (max-width: 620px) {
  /* Размытия под окном нет намеренно. Окно и так во весь экран, фона за ним
     не видно, а Safari на iOS при прокрутке внутри такого блока перерисовывает
     его с артефактами: строки наезжают друг на друга, и выглядит это как
     сломанная вёрстка. Убираем и размытие, и полупрозрачность. */
  .overlay {
    padding: 0; place-items: stretch;
    backdrop-filter: none; -webkit-backdrop-filter: none;
    background: var(--surface);
  }
  .modal, .modal.wide {
    width: 100%; max-height: 100%;
    border: 0; border-radius: 0;
  }

  /* Подвал: кнопки в строку и во всю ширину, подпись — отдельной строкой под
     ними. Раньше «Параметры верны, подобрать банки» переносилось в три строки
     и подвал съедал треть экрана. */
  .mfoot { flex-wrap: wrap; gap: 8px; padding: 10px 12px; }
  .mfoot .spacer { display: none; }
  .mfoot button { flex: 1 1 auto; min-width: 0; }
  .mfoot .why { flex: 1 0 100%; order: 3; font-size: 11.5px; line-height: 1.4; }
  /* Шапка окна и полоса шагов теснее: на узком экране им хватает 14 точек. */
  .mchips { padding: 12px 14px 4px; }
  .stages { padding: 10px 14px; gap: 6px; }
  .stage { padding: 7px 12px; font-size: 12.5px; }
  .pane { padding: 14px 12px 18px; }

  /* Прокрутка внутри окна. На iOS без этого прокручивается страница за окном,
     а само окно стоит — и до полей внизу (цена победителя, процент аванса)
     добраться нельзя. overscroll-behavior не даёт «пробить» прокрутку насквозь
     и утянуть страницу, когда список кончился. */
  .mbody {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  /* Поля во всю ширину и покрупнее: на телефоне в них попадают пальцем, а
     шрифт мельче 16 точек Safari встречает принудительным зумом страницы. */
  .f input, .f select, .f textarea { font-size: 16px; }
  .opts { flex-wrap: wrap; }
  .opt { flex: 1 1 auto; }
}

/* Дата расчёта над таблицей банков: заявка — документ на дату, и цены в ней
   те, что были посчитаны, а не сегодняшние. */
.b-when {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-bottom: 12px; padding: 10px 12px;
  background: var(--warn-soft); border-radius: var(--r-md);
  font-size: 12.5px; color: var(--ink-2);
}
.b-when button { margin-left: auto; }
@media (max-width: 620px) {
  .b-when { gap: 8px; }
  .b-when button { margin-left: 0; width: 100%; }
}

/* ---------- Разделы продуктов ----------
   Заказчик 03.09.2026: у ключевых продуктов должны быть свои разделы, куда
   «проваливаются» и работают только с этим продуктом. Полоса значков слева
   стоит на всю высоту окна и не уезжает при прокрутке: из раздела в раздел
   переходят чаще, чем читают страницу до конца. */
.nav {
  position: fixed; left: 0; top: 0; bottom: 0; width: 78px; z-index: 40;
  display: flex; flex-direction: column; gap: 4px; padding: 14px 8px;
  background: var(--surface); border-right: 1px solid var(--line);
}
.nav-b {
  font: inherit; cursor: pointer; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 5px;
  padding: 9px 4px; border-radius: var(--r-md);
  border: 1px solid transparent; background: none; color: var(--ink-3);
}
.nav-b span {
  font-size: 10.5px; font-weight: 600; line-height: 1.15;
}
.nav-b:hover { background: var(--ground); color: var(--ink-2); }
.nav-b.on { background: var(--brand-soft); color: var(--brand); }
.nav-b:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
/* Значок крупнее подписи: полосу читают по значкам, подпись — подсказка. */
.nav-b svg { width: 21px; height: 21px; }

body.with-nav .app { padding-left: 98px; }

/* В разделе — вся ширина экрана. Витрина и диалог живут в колонке 1240 точек:
   текст, который читают, длинными строками читать нельзя. В разделе читают не
   текст, а таблицу на двенадцать столбцов, и обрезать её ради колонки значит
   загнать половину столбцов под горизонтальную прокрутку. Заказчик
   03.09.2026: «давай в этих разделах использовать всю ширину экрана». */
body.ws-open .app { max-width: none; }
body.with-nav .nav { display: flex; }

/* На узком экране полоса ложится строкой внизу — иначе она съедает треть
   ширины, а таблице раздела и без того тесно. */
@media (max-width: 820px) {
  .nav {
    top: auto; right: 0; width: auto; flex-direction: row;
    justify-content: space-around; padding: 6px 4px;
    border-right: none; border-top: 1px solid var(--line);
  }
  body.with-nav .app { padding-left: 20px; padding-bottom: 90px; }
  .nav-b { flex: 1 1 0; gap: 3px; }
}

/* ---------- Раздел: общая рама ---------- */
.ws-head {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 0 16px;
}
.ws-head h1 { margin: 0; font-size: 20px; font-weight: 700; letter-spacing: -.2px; }
.ws-head .ws-sub { font-size: 13px; color: var(--ink-3); }
.ws-head .ws-right { margin-left: auto; display: flex; gap: 8px; align-items: center; }

/* Кнопка и поиск — строкой слева, над тем, что они отбирают. Заказчик
   03.09.2026: «сначала добавить тендер, а справа строка поиска». Внутри
   узкой колонки списка они стояли столбиком и занимали два этажа; в строку
   над разделом читаются как одно действие и одно поле к нему. */
.ws-tools {
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  margin: 0 0 14px;
}
/* Название раздела живёт в этой же строке: своей строкой оно съедало полсотни
   точек высоты, а таблице они нужнее. */
.ws-tools h1 {
  margin: 0 4px 0 0; font-size: 19px; font-weight: 700; letter-spacing: -.2px;
  white-space: nowrap;
}
.ws-tools .ws-sub { font-size: 12.5px; color: var(--ink-3); margin-right: 6px; }
.ws-tools .ws-search { flex: 1 1 auto; max-width: 420px; }
.ws-tools .primary { flex: none; }

.ws-search {
  flex: 1 1 260px; max-width: 420px;
  padding: 9px 13px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--surface);
  font: inherit; font-size: 13.5px; color: var(--ink);
}
.ws-search:focus { border-color: var(--brand); outline: none; }

/* Чипсы статусов — как в боевой CRM: ими отбирают, а не украшают. */
.ws-chips { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; }
.ws-chip {
  font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 13px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
}
.ws-chip:hover { border-color: var(--line-strong); }
.ws-chip.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.ws-chip b { font-weight: 700; opacity: .65; }
.ws-chip.on b { opacity: .85; }

.ws-empty {
  font-size: 13.5px; color: var(--ink-3); margin: 0;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 26px 20px; text-align: center;
}
.ws-more {
  display: block; margin: 14px auto 0; font: inherit; font-size: 13px;
  font-weight: 600; cursor: pointer; padding: 8px 18px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
}
.ws-more:hover { border-color: var(--line-strong); color: var(--ink); }

/* ---------- Раздел со списком слева и работой справа ----------
   Так устроены «Тендеры» и «Контрагенты»: слева перещёлкивают, справа
   читают. Список липкий и крутится сам — разбор длинный, и уезжать вместе
   с ним списку нельзя, иначе до следующей закупки надо прокручивать назад. */
.ws-split {
  display: grid; grid-template-columns: 320px minmax(0, 1fr);
  gap: 16px; align-items: start;
}
.ws-list {
  position: sticky; top: 16px;
  max-height: calc(100vh - 130px); overflow-y: auto;
  display: flex; flex-direction: column; gap: 6px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); padding: 8px;
}
.ws-item {
  font: inherit; cursor: pointer; text-align: left;
  display: flex; flex-direction: column; gap: 3px;
  padding: 10px 12px; border-radius: var(--r-md);
  border: 1px solid transparent; background: none; color: var(--ink);
}
.ws-item:hover { background: var(--ground); }
.ws-item.on { background: var(--brand-soft); border-color: var(--brand); }
.ws-i-no { font-size: 13px; font-weight: 680; font-variant-numeric: tabular-nums; }
.ws-i-sub {
  font-size: 12px; color: var(--ink-2);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ws-i-when { font-size: 11.5px; color: var(--ink-3); }

.ws-pane {
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r-lg); overflow: hidden; min-height: 320px;
}
/* Разбор внутри раздела — тот же, что в окне, но без ширины окна и без его
   прокрутки: крутится страница целиком. */
.ws-rv .rv-body { max-height: none; }
.ws-rv .rv-main { overflow: visible; }

@media (max-width: 900px) {
  .ws-split { grid-template-columns: 1fr; }
  .ws-list { position: static; max-height: 300px; }
}

/* Очередь разбора в окне «Добавить тендеры»: номер и что с ним сейчас. */
.modal.add-tenders {
  width: min(560px, 100%); display: flex; flex-direction: column;
}
.at-head {
  display: flex; align-items: center; gap: 10px; padding: 16px 20px 12px;
}
.at-head h2 { margin: 0; font-size: 17px; font-weight: 700; }
.at-head .rv-x { margin-left: auto; }
.at-body { padding: 0 20px 4px; overflow-y: auto; }
.at-foot {
  display: flex; gap: 10px; align-items: center;
  padding: 14px 20px 18px; border-top: 1px solid var(--line); margin-top: 14px;
}
.modal.add-tenders textarea {
  width: 100%; font: inherit; font-size: 14px; line-height: 1.5;
  padding: 10px 12px; border-radius: var(--r-md);
  border: 1px solid var(--line); background: var(--surface); color: var(--ink);
  font-variant-numeric: tabular-nums; resize: vertical;
}
.ws-queue { display: flex; flex-direction: column; gap: 4px; margin: 12px 0 0; }
.ws-q {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px; border-radius: var(--r-md); background: var(--ground);
  font-size: 13px;
}
.ws-q-no { font-variant-numeric: tabular-nums; font-weight: 620; }
.ws-q-s { margin-left: auto; font-size: 12px; color: var(--ink-3); }
.ws-q-s.work { color: var(--ink-2); }
.ws-q-s.ok { color: #1E6B42; font-weight: 650; }
.ws-q-s.bad { color: var(--bad, #B42318); }
.ws-q-t { font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; min-width: 34px; text-align: right; }
.ws-q-act:empty { display: none; }
.ws-q-open {
  padding: 4px 12px; border-radius: var(--r-md); border: 1px solid var(--accent, #2E37C8);
  background: var(--accent, #2E37C8); color: #fff; font: inherit; font-size: 12px; font-weight: 650; cursor: pointer;
}
.ws-q-open:hover { filter: brightness(1.08); }
.ws-q-open:focus-visible { outline: 2px solid var(--accent, #2E37C8); outline-offset: 2px; }

/* Панель проверки внутри раздела: та же, что во вкладке заявки, только с
   отступом от края — там её держит окно, здесь держать нечему. */
.ws-riski { padding: 16px; }

/* Черта в пульте: выше — кого предлагаем, ниже — не прошедшие по рискам.
   Строка-заголовок, а не просто цвет: границу должно быть видно глазом при
   прокрутке таблицы на двадцать столбцов. */
.banks.pult tr.pult-cherta td {
  background: var(--ground); border-top: 2px solid var(--line-strong);
  font-size: 12.5px; font-weight: 680; color: var(--ink-2);
  padding: 9px 12px; position: sticky; left: 0;
}
.banks.pult tr.pult-cherta span {
  font-weight: 500; color: var(--ink-3); margin-left: 10px;
}
/* Чем банк не устроил — под его именем, мелким. Свёрнуто одной строкой,
   по щелчку раскрывается целиком: причин бывает три, и в строке таблицы на
   двадцать столбцов они не помещаются, а понять их надо точно. */
.pult-why {
  display: block; margin-top: 2px; max-width: 220px; width: 100%;
  font: inherit; font-size: 11px; color: var(--ink-3);
  text-align: left; cursor: pointer; padding: 0;
  background: none; border: 0;
}
.pult-why:hover { color: var(--ink-2); }
.pult-why:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
.pw-short {
  display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Знак «+2»: причин больше одной, и это видно до раскрытия. */
.pult-why .pw-short b { font-weight: 700; color: var(--ink-2); }
.pw-full { display: none; }

.pult-why.open { max-width: 260px; }
.pult-why.open .pw-short { display: none; }
.pult-why.open .pw-full {
  display: block; margin-top: 2px; padding: 7px 9px;
  background: var(--ground); border-radius: var(--r-md);
  white-space: normal; line-height: 1.45;
}
.pw-full b { display: block; color: var(--ink-2); margin-bottom: 3px; }
.pw-full ul { margin: 0; padding-left: 15px; }
.pw-full li { margin: 2px 0; }

/* ---------- Список тендеров: строка как в Тендерплане ---------- */
.ws-i-name {
  font-size: 13px; font-weight: 660; line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.ws-i-line {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 11.5px; color: var(--ink-3);
}
.ws-i-no { font-size: 11.5px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.ws-i-tag {
  font-size: 10px; font-weight: 700; letter-spacing: .3px;
  padding: 2px 6px; border-radius: 5px;
  background: var(--ground); color: var(--ink-2); border: 1px solid var(--line);
}
.ws-i-soon { font-style: normal; color: #B4540A; font-weight: 650; }
.ws-i-gone { font-style: normal; color: var(--ink-3); }
.ws-i-line i { font-style: normal; }
.ws-i-sum {
  font-size: 12.5px; font-weight: 680; color: var(--ink);
  font-variant-numeric: tabular-nums;
}
/* Готовность разбора. Галочка — самое частое состояние, и она должна
   читаться, не отвлекая: цвет спокойный, вес обычный. */
.ws-i-st { font-style: normal; margin-left: auto; font-size: 11px; }
.ws-i-st.ok { color: #1E6B42; font-weight: 650; }
.ws-i-st.work { color: #B4540A; }
.ws-i-st.bad { color: var(--bad, #B42318); }
.ws-i-st.none { color: var(--ink-3); }

/* ---------- Краткий разбор справа ---------- */
.ws-brief { padding: 18px 18px 20px; }
.ws-brief-h {
  font-size: 13px; font-weight: 750; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-2); margin: 0 0 12px;
}
/* Краткий разбор — строками в одной рамке (заказчик 16.09.2026: «плитки —
   плохо, нужны строчные варианты»): слева название, справа значение жирно,
   «Цитата» справа в строке, цитата раскрывается под строкой. */
.ws-k-grid {
  border: 1px solid color-mix(in srgb, var(--brand) 16%, var(--line));
  border-radius: var(--r-lg); background: var(--surface); overflow: hidden;
}
.ws-k {
  display: grid; grid-template-columns: minmax(140px, 22%) minmax(0, 1fr) minmax(0, 0.85fr);
  align-items: baseline; column-gap: 16px; row-gap: 6px;
  padding: 11px 16px; border-top: 1px solid color-mix(in srgb, var(--brand) 9%, var(--line));
}
.ws-k:first-child { border-top: 0; }
.ws-k:nth-child(even) { background: color-mix(in srgb, var(--brand) 3%, var(--surface)); }
.ws-k-top { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.ws-k-t { font-size: 14px; color: var(--ink-2); line-height: 1.4; }
/* ответы — жирно, но мельче: крупновато (заказчик 16.09.2026) */
.ws-k-v { font-size: 13.5px; font-weight: 700; color: var(--ink); line-height: 1.4; overflow-wrap: anywhere; }
.ws-k-v .dash { color: var(--ink-3); font-weight: 400; }
/* Цветом помечаем только то, что требует внимания: если красить всё, глаз
   перестаёт видеть разницу. */
.ws-k.risk .ws-k-v { color: var(--bad, #B42318); }
.ws-k.attention .ws-k-v { color: #B4540A; }
.ws-k-badge {
  flex: none; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 1px 7px; border-radius: 999px;
}
.ws-k-badge.risk { background: #FBE7E6; color: #B42318; }
.ws-k-badge.warn { background: #FDF1DC; color: #9A5B06; }
.ws-k-q {
  justify-self: end; padding: 2px 0; border: 0; background: none; white-space: nowrap;
  font: inherit; font-size: 12.5px; font-weight: 650; color: var(--brand); cursor: pointer;
}
.ws-k-q:hover { text-decoration: underline; }
.ws-k-q:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; border-radius: 4px; }
.ws-k-quote {
  grid-column: 1 / -1; font-size: 13px; line-height: 1.5; color: var(--ink-2);
  padding: 9px 12px; border-radius: 8px; background: var(--ground);
}
.ws-k-quote p { margin: 0 0 4px; font-style: italic; }
.ws-k-src { display: block; font-size: 12px; color: var(--ink-3); }
/* начало цитаты третьим столбцом — одной строкой, серым курсивом (16.09.2026) */
/* ячейка цитаты: текст до края столбца двумя строками, «Цитата» — в правом
   нижнем углу (заказчик 16.09.2026) */
.ws-k-qcell { min-width: 0; position: relative; }
.ws-k-qp { min-width: 0; font-size: 11.5px; font-style: italic; color: var(--ink-3); line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; }
/* «Цитата» поверх конца текста, высоту строки не добавляет (16.09.2026) */
.ws-k { --ws-k-bg: var(--surface); }
.ws-k:nth-child(even) { --ws-k-bg: color-mix(in srgb, var(--brand) 3%, var(--surface)); }
.ws-k-qcell .ws-k-q { position: absolute; right: 0; bottom: 0; font-size: 11.5px; line-height: 1.35; padding: 0 0 0 28px;
  background: linear-gradient(90deg, transparent, var(--ws-k-bg) 24px); }
.ws-k-qp:hover { color: var(--ink-2); }
@media (max-width: 640px) {
  .ws-k-qp { display: none; }
  .ws-k { grid-template-columns: minmax(0, 1fr) auto; }
  .ws-k-v { grid-column: 1 / -1; grid-row: 2; }
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ws-k-badge.risk { background: rgba(220, 70, 60, .18); color: #F4A29B; }
  :root:not([data-theme="light"]) .ws-k-badge.warn { background: rgba(230, 160, 40, .18); color: #F2C46D; }
}
:root[data-theme="dark"] .ws-k-badge.risk { background: rgba(220, 70, 60, .18); color: #F4A29B; }
:root[data-theme="dark"] .ws-k-badge.warn { background: rgba(230, 160, 40, .18); color: #F2C46D; }
.ws-openfull { margin-top: 16px; }
.ws-full:empty { display: none; }

/* Полотно досье внутри раздела: то же, что в окне, только без модального
   обрамления и с отступом от края. */
.ws-dv-body { padding: 18px; }

/* Плитки шапки в разделе шире не становятся, а места у них вдвое меньше:
   слева стоит список. Жёсткие шесть колонок ломали слова по буквам —
   раскладываем по месту, минимум 150 точек на плитку. */
.ws-rv .rv-tiles { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

/* Полный разбор внутри раздела. Он рисован для окна в 1280 точек и делит
   себя на оглавление и колонку условий; в разделе слева уже стоит список
   закупок, и на три колонки места нет — значение ломалось по буквам.
   Поэтому здесь он в одну колонку, а оглавление строкой сверху: ровно так
   же, как на узком экране. */
.ws-full .rv-body { display: block; }
.ws-full .rv-nav {
  border-right: 0; border-bottom: 1px solid var(--line); position: static;
  padding: 12px 14px 14px;
}
.ws-full .rv-nav-list { display: flex; flex-wrap: wrap; gap: 6px; }
.ws-full .rv-nav-list .rv-nav-i {
  width: auto; margin: 0; padding: 6px 11px; font-size: 12.5px;
}
.ws-full .rv-nav-list .rv-cnt { margin-left: 4px; }
.ws-full .rv-main { padding: 16px 18px 20px; }
.ws-full .rv-row { grid-template-columns: 1fr; gap: 6px; }

/* ---------- Окно заведения гарантии ---------- */
/* Свои юрлица подсказкой под полем ИНН: их у менеджера несколько, а по
   памяти набирают с ошибкой в одной цифре. */
.z-inns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.z-inn-b {
  font: inherit; font-size: 12px; cursor: pointer;
  display: inline-flex; align-items: baseline; gap: 6px;
  padding: 5px 10px; border-radius: 999px;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
}
.z-inn-b:hover { border-color: var(--brand); color: var(--brand); }
/* Выбранная компания горит так же, как выбранный вид гарантии: один выбор —
   один способ его показать. */
.z-inn-b.on {
  border-color: var(--brand); background: var(--brand-soft);
  color: var(--brand); font-weight: 600;
}
.z-inn-b.on span { color: var(--brand); opacity: .75; }
.z-inn-b span { font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }

/* Найденная компания — в строке с подписью поля, справа. Своей строки она
   не занимает, а прочитать её надо один раз: убедиться, что ИНН тот. */
.z-lab { display: flex; align-items: baseline; gap: 8px; }
.z-org {
  margin-left: 6px; min-width: 0; max-width: 100%;
  display: inline-flex; align-items: baseline; gap: 6px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Выбранная компания выглядит так же, как подсказка рядом: одна и та же
   сущность не должна рисоваться двумя способами. */
.z-org b {
  font-size: 12px; font-weight: 650; color: var(--ink);
  padding: 3px 10px; border-radius: 999px;
  border: 1px solid var(--line-strong); background: var(--surface);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.z-org span { font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.z-org.идёт, .z-org.плохо { font-size: 12px; font-weight: 600; }
.z-org.идёт { color: var(--ink-3); font-weight: 500; }
.z-org.плохо { color: var(--bad, #B42318); }

.z-hello {
  padding: 22px; border-radius: var(--r-lg); background: var(--ground);
  font-size: 13.5px; color: var(--ink-2);
}
.z-hello b { display: block; margin-bottom: 6px; color: var(--ink); font-size: 14.5px; }
.z-hello p { margin: 0; line-height: 1.55; }

/* Кнопка «Далее», пока не хватает полей: бледная, но нажимаемая — нажал и
   узнал, чего именно не хватает, вместо того чтобы гадать. */
.pale { opacity: .55; }

/* Карточка закупки в разделе: между кубиками и кратким разбором. */
.ws-card { padding: 14px 18px 0; }

/* Заявка на участие в правой половине раздела «Тендеры» */
.ws-bid { padding: 14px 18px 24px; border-top: 1px solid var(--line); margin-top: 12px; }
/* блок заявки внутри раздела «Документы для участия» полного разбора */
.rv-sec .ws-bid.rv-bid { padding: 16px 0 8px; }
.ws-bid .bid-start-cost { margin-top: 8px; font-size: 12.5px; }
.ws-bid .bid-meta { color: var(--ink2, #5a6272); font-size: 13px; margin: 4px 0 8px; }
.ws-bid .bid-part { margin: 8px 0; }
.ws-bid .bid-part ul { margin: 4px 0 0 18px; padding: 0; }
.ws-bid .bid-mode { margin: 14px 0; }
.ws-bid .bid-choice { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 10px; margin-top: 8px; }
.ws-bid .bid-card {
  display: grid; gap: 4px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--surface); cursor: pointer; transition: border-color .15s, box-shadow .15s, background .15s;
}
.ws-bid .bid-card input { position: absolute; opacity: 0; width: 0; height: 0; }
.ws-bid .bid-card:hover { border-color: var(--brand); }
.ws-bid .bid-card.on { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 6%, var(--surface)); box-shadow: 0 0 0 3px var(--brand-soft); }
.ws-bid .bid-card-t { font-weight: 650; font-size: 13.5px; }
.ws-bid .bid-card-d { font-size: 12.5px; color: var(--ink-2); line-height: 1.45; }
.ws-bid .bid-own { margin: 10px 0 0; display: grid; gap: 8px; }
.ws-bid .bid-own textarea { width: 100%; font: inherit; font-size: 13px; padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); color: var(--ink); }
.ws-bid .bid-own .primary { justify-self: start; padding: 10px 18px; font-size: 13.5px; }
.ws-bid .bid-attach { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; cursor: pointer; }
.ws-bid .bid-attach input { position: absolute; opacity: 0; width: 0; height: 0; }
.ws-bid .bid-attach-btn { font-weight: 600; font-size: 13px; padding: 8px 14px; border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); }
.ws-bid .bid-attach:hover .bid-attach-btn { border-color: var(--brand); color: var(--brand); }
.ws-bid .bid-attach-list { font-size: 12.5px; }
.ws-bid .drag { outline: 2px dashed var(--brand); outline-offset: 4px; border-radius: var(--r-md); background: var(--brand-soft, #eef0ff); }
.ws-bid .bid-attach-list::after { content: ' · или перетащите сюда'; color: var(--ink-2); }
.ws-bid .bid-pos { margin: 10px 0; }
.ws-bid .bid-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 4px; }
.ws-bid .bid-table th, .ws-bid .bid-table td { text-align: left; padding: 4px 6px; border-bottom: 1px solid var(--line); vertical-align: top; }
.ws-bid tr.bid-ok td:last-child { color: #2f9e44; }
.ws-bid tr.bid-bad td:last-child { color: #e03131; }
.ws-bid tr.bid-unk td:last-child { color: #c47f00; }
.ws-bid span.bid-ok { color: #2f9e44; }
.ws-bid .bid-ok-note, .tech-modal .bid-ok-note { color: #2f9e44; background: #eef9f0; border-radius: 8px; padding: 6px 10px; }
/* Заготовки для документов участника: не часть заявки (10.09.2026) */
.ws-bid .bid-doc.tpl { border-style: dashed; }
.ws-bid .bid-doc.tpl .bid-doc-ico { background: #f3f4f6; color: #6b7280; }
/* Соседние графы ТЗ под характеристиками: единица, адрес, срок (10.09.2026) */
.tech-modal .tz-graphs { margin-top: 8px; padding-top: 6px; border-top: 1px dashed #d7dbe6; }
.tech-modal .tz-graph { color: #6b7280; font-size: 12px; line-height: 1.5; }
.tech-modal .tz-graph-n { color: #9aa1ad; }
/* Форм заказчика в документации нет — собрано по нашим шаблонам (10.09.2026) */
.ws-bid .bid-warn-note, .tech-modal .bid-warn-note { color: #8a6d1f; background: #fff8e6; border-radius: 8px; padding: 6px 10px; }
.ws-bid .bid-build-issues ul { margin: 6px 0 4px 18px; }
.ws-bid .bid-build-issues li { margin-bottom: 3px; }
/* Крестик в этом окне был описан только для `.tech-modal` и выходил серой
   полосой во всю ширину (заказчик 10.09.2026: «крестик какой-то плохой»). */
.prelaunch-modal { max-width: 520px; padding: 22px 24px; position: relative; }
.prelaunch-modal .prelaunch-x {
  position: absolute; top: 12px; right: 12px; width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); border-radius: 50%; background: #fff;
  color: var(--ink-2); font-size: 17px; line-height: 1; cursor: pointer; padding: 0;
}
.prelaunch-modal .prelaunch-x:hover { border-color: var(--brand); color: var(--brand); }
.prelaunch-bonus { background: #eef2ff; border-radius: 10px; padding: 10px 12px; }
/* Кнопки в одну строку, слева направо: звонок первым (10.09.2026) */
.prelaunch-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.prelaunch-actions .ws-more { padding: 9px 16px; }
.prelaunch-actions button.ждём { opacity: .6; }
/* Подтверждение после записи: отдельный блок, а не подпись под кнопками */
.prelaunch-done {
  background: #eef9f0; color: #2f6b3d; border-radius: 10px;
  padding: 12px 14px; line-height: 1.55; font-size: 14px;
}
/* Телефон из профиля подсвечен: человек должен убедиться, что он верный */
.prelaunch-phone input.prelaunch-known { border-color: var(--brand); background: #f7f8ff; }
.prelaunch-modal h3 { margin: 0 0 8px; font-size: 19px; }
.prelaunch-modal p { margin: 0 0 14px; color: var(--ink-2); line-height: 1.5; }
.prelaunch-phone { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 600; margin-bottom: 12px; }
.prelaunch-phone input { padding: 9px 12px; border: 1px solid var(--line); border-radius: 10px; font: inherit; }
.prelaunch-modal .bid-actions { justify-content: flex-start; }
.ws-bid .bid-step { margin: 10px 0 4px; }
.ws-bid .bid-step .bid-actions { justify-content: flex-start; }
.ws-bid .bid-price.over { background: #fdeeee; }
.ws-bid .bid-price-over { color: #c62828; font-size: 12.5px; margin: 4px 0 2px; }
.tech-modal .money-input.over, .ws-bid .bid-price.over input#bid-price-total { border-color: #c62828; color: #c62828; }
.tech-modal .tech-price-over { color: #c62828; font-size: 11px; line-height: 1.25; margin-top: 3px; }
.ws-bid .bid-price-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 8px 0 4px; }
.ws-bid .bid-price-row label { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; font-weight: 600; }
.ws-bid .bid-price-row input, .ws-bid .bid-price-row select { padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
.ws-bid .bid-price-row .ws-more { margin: 0; }
.tech-modal .tech-price input { width: 120px; }
.ws-bid .bid-price { background: #eef4ff; border-radius: 10px; padding: 10px 12px; margin: 10px 0; }
.ws-bid .bid-simple { background: var(--surface-2, #f3f4f6); border-radius: 10px; padding: 10px 12px; }
.ws-bid .bid-sub { font-size: 12.5px; font-weight: 650; color: var(--ink-2); margin: 8px 0 2px; }
.ws-bid ul.bid-platform li { color: var(--ink-3); }
.ws-bid span.bid-unk { color: #c47f00; }
.ws-bid span.bid-bad { color: #e03131; }
.ws-bid .bid-wait { margin: 6px 0 4px; }
.ws-bid mark.vague { background: #fff3a8; color: inherit; padding: 0 2px; border-radius: 3px; }
.ws-bid mark.vague.range { background: #ffe08a; }
.ws-bid mark.changed { background: #d3f5d9; color: inherit; padding: 0 2px; border-radius: 3px; }
.ws-bid mark.manual { background: #cfe6ff; color: inherit; padding: 0 2px; border-radius: 3px; }
.ws-bid mark.unsure { background: #ffd9b3; color: inherit; padding: 0 2px; border-radius: 3px; cursor: help; }
.ws-bid mark.own { background: #c9efd1; color: inherit; padding: 0 2px; border-radius: 3px; cursor: help; }
.ws-bid .tl-note.tz-from-name { background: #eef2ff; color: #3b4a80; border-left: 3px solid #8fa0e0; }
.ws-bid .tl-note.tz-from-name.warn { background: #fff4e5; color: #7a4a00; border-left-color: #f0a640; }
/* Имя класса не «choice»: так называются кнопки выбора в чате, и пометка
   становилась блоком во всю ширину. `nowrap` — чтобы «20-120» не рвалось
   пополам: в ячейке стоит overflow-wrap: anywhere (11.09.2026). */
/* Подсказка «Что приложить» под пунктом состава: отдельный блок, чтобы не
   сливалась с самим пунктом (заказчик 11.09.2026) */
.ws-bid .bid-hint { margin: 4px 0 10px; padding: 6px 10px; border-left: 3px solid var(--line-strong); background: rgba(127, 140, 180, .08); color: var(--ink-2); font-size: 12.5px; line-height: 1.45; border-radius: 0 6px 6px 0; }
.ws-bid .bid-hint-l { display: block; font-size: 10.5px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 2px; }
.ws-bid mark.ask { display: inline; background: #ece0ff; color: #5b3aa6; padding: 0 2px; border-radius: 3px; cursor: help; box-shadow: inset 0 -2px 0 #b79bec; white-space: nowrap; overflow-wrap: normal; }
.ws-bid .bid-legend mark { cursor: default; }
.ws-bid .tl-badnote { font-size: 11.5px; margin-left: 4px; white-space: nowrap; }
.ws-bid mark.bad { background: #ffc9c9; color: #a1262d; font-weight: 600; padding: 0 2px; border-radius: 3px; cursor: help; }
.ws-bid .bid-nr { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.ws-bid .bid-nr > b { display: block; font-size: 15px; margin-bottom: 6px; }
.ws-bid .bid-nr ul { list-style: none; margin: 8px 0; padding: 0; display: grid; gap: 8px; }
.ws-bid .bid-nr li { padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); }
.ws-bid .bid-nr .bid-nr-h { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; font-weight: 600; }
.ws-bid .bid-nr .bid-nr-h .bid-regime { margin-left: 0; font-size: 13px; }
.ws-bid .bid-nr .bid-nr-h .dim { font-weight: 400; }
.ws-bid .bid-nr .bid-nr-d { margin-top: 3px; color: var(--ink-2); font-size: 13.5px; }
.ws-bid .bid-nr > .dim { font-size: 13.5px; margin-top: 4px; }
.ws-bid .bid-mode-note { display: grid; gap: 8px; margin: 10px 0; padding: 10px 14px; border-left: 3px solid var(--warn, #e0a030); background: var(--surface-2, var(--surface)); border-radius: 0 var(--r-md) var(--r-md) 0; font-size: 13px; line-height: 1.5; }
.ws-bid .bid-mode-note .bid-attach { position: relative; }
.ws-bid .bid-mode-note .bid-regime { margin-left: 0; }
.ws-bid .bid-mode-note .bid-mode-done { color: var(--ok, #1d8a3c); font-weight: 600; }
.ws-bid .bid-mode-note .bid-registry-actions { margin: 0; align-items: center; }
.ws-bid .bid-registry-done { margin-top: 8px; }
.ws-bid .bid-registry-done ul { margin: 4px 0; }
.ws-bid .bid-confirm { margin: 10px 0; padding: 12px 14px; border: 1px solid #f1b8b8; border-radius: var(--r-md); background: #fff5f5; font-size: 13.5px; line-height: 1.5; }
.ws-bid .bid-confirm ul { margin: 6px 0; padding-left: 18px; }
.ws-bid .bid-confirm p { margin: 6px 0 8px; }
.ws-bid .bid-actions.bid-final { flex-direction: column; align-items: stretch; gap: 8px; }
.ws-bid .bid-actions.bid-final button { width: 100%; }
.ws-bid .bid-actions.bid-final .bid-secondary { width: auto; align-self: center; padding-left: 22px; padding-right: 22px; }
.ws-bid .bid-restart-row { margin: 4px 0 10px; }
.ws-bid .bid-restart { background: none; border: 0; padding: 0; color: var(--ink-2); font: inherit; font-size: 12.5px; text-decoration: underline dotted; cursor: pointer; }
.ws-bid .bid-restart:hover { color: var(--brand); }
.ws-bid .manual-tag { color: #1c64c2; }
.tech-modal .tech-edit { outline: none; cursor: text; }
.tech-modal .tech-edit:focus { box-shadow: inset 0 0 0 2px var(--brand-soft); background: var(--surface); }
.tech-modal .tech-tools { width: 130px; font-size: 12px; }
.tech-modal .tech-field { width: 100%; font: inherit; font-size: 12px; padding: 4px 6px; margin-top: 4px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--ink); }
.tech-modal .tech-field.saved { border-color: #1c64c2; background: #eef5ff; }
.tech-modal .tech-until { display: grid; gap: 2px; }
.tech-modal { position: relative; }
.tech-modal .pane > .bid-actions { justify-content: center; }
.tech-modal .tech-x {
  position: sticky; top: 0; float: right; z-index: 2; margin: -6px -8px 0 0;
  width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface);
  font-size: 22px; line-height: 1; color: var(--ink-2); cursor: pointer;
}
.tech-modal .tech-x:hover { border-color: var(--brand); color: var(--brand); }
.tech-modal .tech-valid { font-size: 11.5px; font-weight: 600; }
.tech-modal .tech-bulk { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin: 0 0 12px; font-size: 13px; }
.tech-modal tr.tech-filters th, .tech-modal tr.tech-bulk th { font-weight: 500; background: var(--ground); vertical-align: top; }
.tech-modal tr.tech-filters select, .tech-modal tr.tech-filters input, .tech-modal tr.tech-bulk input {
  width: 100%; font: inherit; font-size: 12px; padding: 4px 6px; margin: 2px 0; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--ink); }
.tech-modal tr.tech-bulk button { font-size: 12.5px; padding: 6px 10px; }
.tech-modal .tech-bulk { display: table-row; }
.tech-modal .tech-bulk input { font: inherit; font-size: 12.5px; padding: 5px 8px; border: 1px solid var(--line-strong); border-radius: 6px; margin-left: 4px; }
.tech-modal .tech-reset { margin-left: 6px; border: 1px solid var(--line-strong); background: var(--surface); border-radius: 6px; cursor: pointer; padding: 1px 6px; }
/* «Ошибка в характеристиках — указать ТЗ» (15.09.2026) */
.tech-modal .tech-tzfix, .tech-modal .tech-tzrevert {
  border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-2);
  border-radius: 6px; cursor: pointer; padding: 2px 7px; font: inherit; font-size: 11.5px; text-align: left; }
.tech-modal .tech-tzfix { display: block; margin-top: 6px; }
/* «Исходная позиция» — кусок ТЗ по этой строке; спокойная кнопка рядом с
   предупреждающей «Указать ТЗ» (заказчик 20.09.2026) */
.tech-modal .tech-tzsrc { display: block; margin-top: 6px; font: inherit; font-size: 11.5px; cursor: pointer; text-align: left;
  border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-2); border-radius: 6px; padding: 2px 7px; }
.tech-modal .tech-tzsrc:hover, .tech-modal .tech-tzsrc:focus-visible { border-color: var(--brand); color: var(--brand); }
.tech-modal .tech-tzfix:hover, .tech-modal .tech-tzrevert:hover,
.tech-modal .tech-tzfix:focus-visible, .tech-modal .tech-tzrevert:focus-visible { border-color: var(--brand); color: var(--brand); }
/* «Ошибка в характеристиках — указать ТЗ» не терялась среди серых кнопок
   (заказчик 16.09.2026): цвет предупреждения и значок */
.tech-modal .tz-fix-btn, .tech-modal .tech-tzfix {
  border: 1px solid var(--warn); background: var(--warn-soft); color: var(--warn); font-weight: 600; }
.tech-modal .tz-fix-btn::before, .tech-modal .tech-tzfix::before { content: "⚠\FE0E"; margin-right: 6px; }
.tech-modal .tz-fix-btn:hover, .tech-modal .tz-fix-btn:focus-visible,
.tech-modal .tech-tzfix:hover, .tech-modal .tech-tzfix:focus-visible {
  background: var(--warn); border-color: var(--warn); color: var(--surface); }
.tech-modal .tech-tzfixed { margin-top: 6px; display: grid; gap: 3px; justify-items: start; }
.tzfix-modal { max-width: 1180px; }
.tzfix-modal .tzfix-lead { margin: 4px 0 12px; line-height: 1.5; max-width: 90ch; }
.tzfix-modal .tzfix-tabs { padding: 0 0 12px; }
.tzfix-modal .tzfix-tab { max-width: 680px; }
.tzfix-modal select, .tzfix-modal .tzfix-pages, .tzfix-modal input[type="file"] {
  width: 100%; font: inherit; font-size: 13.5px; padding: 7px 10px;
  border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); color: var(--ink); }
.tzfix-modal .tzfix-pages { max-width: 220px; }
.tzfix-modal .tzfix-textarea { width: 100%; min-height: 200px; resize: vertical; font: inherit; font-size: 13.5px; line-height: 1.45;
  padding: 8px 10px; border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); color: var(--ink); }
.tzfix-modal .tzfix-open { font-size: 13px; margin-top: -4px; }
.tzfix-modal .tzfix-err { margin: 12px 0 0; padding: 8px 12px; border-radius: var(--r-md); border: 1px solid #f1b8b8; background: #fff5f5; color: #9b1c1c; font-size: 13px; }
.tzfix-modal .tzfix-actions { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px; }
.tzfix-modal .tzfix-wait { display: grid; gap: 6px; justify-items: start; padding: 18px 0 6px; font-size: 14px; }
.tzfix-modal .tzfix-wait #tzfix-clock { font-variant-numeric: tabular-nums; }
.tzfix-modal .tzfix-scroll { overflow-x: auto; }
.tzfix-modal .tzfix-table td { vertical-align: top; }
.tzfix-modal .tzfix-table td:nth-child(4), .tzfix-modal .tzfix-table td:nth-child(5) { width: 38%; min-width: 240px; }
.tzfix-modal .tzfix-text { white-space: pre-wrap; max-height: 240px; overflow: auto; font-size: 12.5px; line-height: 1.45; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.tzfix-modal .tzfix-lab { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); margin: 6px 0 2px; }
.tzfix-modal tr.tzfix-none td { color: var(--ink-3); }
.tzfix-modal .tzfix-pick { width: 18px; height: 18px; cursor: pointer; }
.tzfix-modal .tzfix-pick:disabled { cursor: not-allowed; }
.tzfix-modal .tzfix-edit {
  width: 100%; font: inherit; font-size: 12.5px; line-height: 1.45; padding: 6px 8px; resize: vertical;
  border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--ink); }
.tzfix-modal .tzfix-edit:focus-visible { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.tzfix-modal div.tzfix-edit { white-space: pre-wrap; overflow: auto; max-height: 340px; cursor: text; }
.tzfix-modal .tzfix-undo { margin-left: 8px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); border-radius: 6px; cursor: pointer; padding: 0 7px; font-size: 13px; line-height: 1.5; vertical-align: middle; }
.tzfix-modal .tzfix-undo:hover, .tzfix-modal .tzfix-undo:focus-visible { border-color: var(--brand); color: var(--brand); }
.tzfix-modal div.tzfix-edit:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.tzfix-modal div.tzfix-edit:empty::before { content: attr(data-placeholder); color: var(--ink-3); }
/* «Что-то не так в форме — исправить поля» (15.09.2026) */
.ws-bid .bid-formfix-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 10px 0 4px; }
.ws-bid .bid-formfix-row .dim { font-size: 12.5px; }
.formfix-modal { max-width: 920px; }
.formfix-modal .formfix-lead { margin: 4px 0 12px; line-height: 1.5; max-width: 90ch; }
.formfix-modal .formfix-bar { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 16px; }
.formfix-modal .formfix-bar .fb-lab { flex: 1 1 320px; margin-bottom: 0; }
.formfix-modal .formfix-only { display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; padding-bottom: 9px; }
.formfix-modal .formfix-open { font-size: 13px; padding-bottom: 9px; }
.formfix-modal .formfix-list { margin-top: 12px; overflow-x: auto; }
.formfix-modal .formfix-table td { vertical-align: top; }
.formfix-modal .formfix-table td:first-child { width: 42%; font-size: 13px; }
.formfix-modal .formfix-table textarea {
  width: 100%; font: inherit; font-size: 13px; padding: 6px 8px; resize: vertical;
  border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); color: var(--ink); }
.formfix-modal .formfix-table textarea:focus-visible { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.formfix-modal tr.formfix-need td:first-child { box-shadow: inset 3px 0 0 #e0a030; }
.formfix-modal .formfix-was { font-size: 11.5px; margin-top: 2px; }
.formfix-modal .formfix-ok { margin: 12px 0 0; font-size: 13px; color: var(--ok, #1d8a3c); }
.ws-bid .bid-vague { font-size: 12px; margin: 2px 0 4px; }
.ws-bid .bid-folder { display: grid; gap: 10px; padding: 12px 14px; margin: 0 0 12px; border: 1px dashed var(--line-strong); border-radius: var(--r-md); background: var(--surface-2, var(--surface)); }
.ws-bid .bid-folder .bid-attach { position: relative; }
.ws-bid .bid-folder-list { display: grid; gap: 6px; }
.ws-bid .bid-folder-list .bid-doc { display: flex; align-items: center; gap: 10px; }
.ws-bid .bid-folder-list .bid-doc-x { border: 0; background: none; color: var(--ink-2); font-size: 16px; cursor: pointer; padding: 0 4px; }
.ws-bid .bid-folder-list .bid-doc-x:hover { color: var(--danger, #c0392b); }
.ws-bid .bid-from-files { font-size: 12.5px; line-height: 1.5; }
.ws-bid .bid-folder-p { margin: 0; font-size: 13.5px; }
/* всех данных хватает — надпись зелёной плашкой (заказчик 17.09.2026) */
.bid-folder-p.bid-folder-ok { background: var(--ok-soft); border: 1px solid var(--ok-line); color: var(--ink);
  padding: 8px 12px; border-radius: 10px; font-weight: 600; justify-self: start; }
.ws-bid .bid-folder-chat { margin: 4px 0 10px; }
.ws-bid .bid-own-done { font-size: 13.5px; line-height: 1.5; }
.ws-bid .bid-own-done .bid-actions { margin: 6px 0 0; }
/* Три источника нацрежима: документация, печатная форма ЕИС, перечни ОКПД2 */
.ws-bid .bid-nr-src { margin: 12px 0 4px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--r-md); font-size: 13.5px; line-height: 1.5; }
.ws-bid .bid-nr-src > b { display: block; margin-bottom: 4px; }
.ws-bid .bid-nr-src-row { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 12px; padding: 7px 0; border-top: 1px dashed var(--line); }
.ws-bid .bid-nr-src-k { color: var(--ink-3); font-weight: 600; }
.ws-bid .bid-nr-src-diff ul { margin: 6px 0 0 18px; }
.ws-bid .bid-nr-src-ok { margin-top: 8px; font-weight: 600; }
@media (max-width: 700px) { .ws-bid .bid-nr-src-row { grid-template-columns: minmax(0, 1fr); gap: 2px; } }
/* Что уточнить и чего не нашли — жёлтым, как примечание в гарантиях
   (заказчик 15.09.2026: «не очень видно, это важный пункт») */
.ws-bid .bid-gaps, .ws-bid .bid-missing {
  background: var(--warn-soft, #fff8e6) !important;
  border: 1px solid color-mix(in srgb, var(--warn, #e0a030) 26%, transparent);
  border-left: 3px solid var(--warn, #e0a030);
}
.ws-bid .bid-gaps { margin: 10px 0; padding: 10px 14px; border-left: 3px solid var(--warn, #e0a030); background: var(--surface-2, var(--surface)); border-radius: 0 var(--r-md) var(--r-md) 0; font-size: 13.5px; line-height: 1.5; }
.ws-bid .bid-gaps .bid-actions { margin: 8px 0 0; }
.ws-bid .bid-need { margin: 0; padding-left: 18px; font-size: 13.5px; line-height: 1.5; }
.ws-bid .bid-need i { font-style: normal; }
.ws-bid .bid-missing { margin: 10px 0; padding: 10px 14px; border-left: 3px solid var(--warn, #e0a030); background: var(--surface-2, var(--surface)); border-radius: 0 var(--r-md) var(--r-md) 0; font-size: 13.5px; line-height: 1.5; }
.ws-bid .bid-missing .bid-missing-actions { margin: 10px 0 0; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ws-bid .bid-missing .bid-attach { margin: 0; }
.ws-bid .bid-missing .bid-attach-btn, .ws-bid .bid-missing .ws-more { border-radius: 999px; padding: 10px 18px; font-size: 14px; font-weight: 600; line-height: 1.2; margin: 0; }
.ws-bid .bid-missing .bid-attach { position: relative; }
.ws-bid .bid-missing .bid-questions { margin-top: 8px; }
.ws-bid .bid-rest { margin: 10px 0; font-size: 13.5px; }
.ws-bid .bid-rest summary { cursor: pointer; }
.ws-bid .bid-rest .link { color: var(--brand); text-decoration: underline dotted; }
.ws-bid .bid-remind ul { margin: 4px 0 0 18px; padding: 0; font-size: 13.5px; }
.ws-bid .bid-from-files i { font-style: normal; }
.ws-bid .bid-q { display: grid; grid-template-columns: minmax(180px, 1fr) 2fr; gap: 8px; align-items: center; margin: 6px 0; font-size: 13px; }
.ws-bid .bid-q i { display: block; font-style: normal; font-size: 11.5px; }
.ws-bid .bid-q input, .ws-bid .bid-q select { font: inherit; padding: 7px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); color: var(--ink); }
.ws-bid .bid-actions button + button { margin-left: 8px; }
.ws-bid .bid-regime { font-size: 12px; font-weight: 600; margin-left: 6px; white-space: nowrap; }
.tech-modal { max-width: none; width: calc(100vw - 32px); max-height: calc(100vh - 32px); overflow: auto; padding: 18px 22px; }
.tech-modal .bid-table td, .tech-modal .bid-table th { vertical-align: top; }
.tech-modal .tech-table { width: 100%; table-layout: fixed; }
/* Ширины — только ячейкам самой таблицы техчасти (`> tbody > tr >`): раньше
   правила по nth-child доставали и вложенную таблицу параметров, и её
   столбец «Было» ломался в столбик по букве (заказчик 09.09.2026). */
.tech-modal .tech-table > tbody > tr > th:nth-child(1), .tech-modal .tech-table > tbody > tr > td:nth-child(1) { width: 64px; }
.tech-modal #tech-f-n { padding-left: 4px; padding-right: 4px; }
.tech-modal .tech-table > tbody > tr > th:nth-child(2), .tech-modal .tech-table > tbody > tr > td:nth-child(2) { width: 12%; overflow-wrap: anywhere; }
.tech-modal .tech-table > tbody > tr > th:nth-child(3), .tech-modal .tech-table > tbody > tr > td:nth-child(3) { width: 120px; }
.tech-modal .tech-table > tbody > tr > th:nth-child(4), .tech-modal .tech-table > tbody > tr > td:nth-child(4) { width: 130px; }
.tech-modal .tech-table > tbody > tr > th:nth-child(5), .tech-modal .tech-table > tbody > tr > td:nth-child(5) { width: 150px; }
.tech-modal .tech-table > tbody > tr > th:nth-child(8), .tech-modal .tech-table > tbody > tr > td:nth-child(8) { width: 130px; }
/* Столбец цены: узкий, «было/стало» шире — иначе таблица едет (заказчик
   09.09.2026: «поехала вёрстка»). */
.tech-modal .tech-table.with-price > tbody > tr > th:nth-child(6), .tech-modal .tech-table.with-price > tbody > tr > td:nth-child(6) { width: 152px; }
.tech-modal .tech-table.with-price > tbody > tr > th:nth-child(8), .tech-modal .tech-table.with-price > tbody > tr > td:nth-child(8) { width: auto; }
.tech-modal .tech-table.with-price > tbody > tr > th:nth-child(9), .tech-modal .tech-table.with-price > tbody > tr > td:nth-child(9) { width: 130px; }
/* Цена компактно: «за ед.» и «всего» друг под другом, подпись слева */
.tech-modal .tech-price label { display: flex; align-items: center; gap: 4px; margin-bottom: 3px; }
.tech-modal .tech-price label > span { flex: 0 0 30px; font-size: 10px; }
.tech-modal .tech-price input { width: 92px; max-width: 100%; text-align: right; margin: 0; padding-left: 4px; padding-right: 4px; }
.tech-modal #tech-price-total { width: 118px; text-align: right; }
.tech-modal .tech-price .tech-qty { font-size: 11px; margin: 2px 0 4px; }
.tech-modal td.tech-price { overflow: hidden; }
.tech-modal .tech-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.45; }
/* Построчные блоки «было» / «стало»: высоты выравниваются попарно из
   скрипта, перед таблицей показателей — разделитель. */
.tech-modal .tech-text .tl { padding: 1px 0; box-sizing: border-box; }
.tech-modal .tech-text .tl.tl-sep { margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--line-strong); }
.tech-modal .tech-row > td { border-top: 1px solid var(--line); padding-top: 10px; }
.tech-modal .tech-params-row > td { padding-top: 0; padding-bottom: 12px; }
.tech-modal .tech-actions { justify-content: center; align-items: center; margin-top: 16px; }
.tech-modal .tech-note { text-align: center; margin-top: 10px; font-size: 12.5px; }
.tech-modal .tech-verbatim { margin-top: 8px; font-size: 12.5px; }
.tech-modal .tech-text .tl.tl-note { font-size: 12px; color: var(--ink-3); padding-bottom: 6px; margin-bottom: 4px; border-bottom: 1px dashed var(--line-strong); }
/* Подпись про источник стоит под текстом — черта сверху, а не снизу */
.tech-modal .tech-text .tl.tl-note.tz-from-name { margin: 8px 0 0; padding: 6px 0 0; border-bottom: 0; border-top: 1px dashed var(--line-strong); }
.tech-modal .tech-text .tl.tl-note.fixed { color: #8a5a00; }
/* Позиция из таблицы ТЗ: заголовок строки над обоими столбцами, значение
   построчно, высоты слева и справа попарно (заказчик 12.09.2026) */
.tech-modal .tech-text .tl-group { margin-bottom: 6px; }
.tech-modal .tech-text .tl.tl-head { font-size: 11.5px; line-height: 1.35; color: var(--ink-3); padding: 6px 0 2px; border-bottom: 1px solid var(--line); }
.tech-modal .tech-text .tl.tl-line { padding: 2px 0; border-bottom: 1px dotted var(--line); }
.tech-modal .tech-text .tl.tl-ghost { user-select: none; }
/* Все позиции табличные: «было» и «стало» одной ширины (12.09.2026) */
.tech-modal .tech-table.rows-mode > tbody > tr > th:nth-child(6), .tech-modal .tech-table.rows-mode > tbody > tr > td:nth-child(6) { width: 32%; }
.tech-modal .tech-table.rows-mode > tbody > tr > th:nth-child(7), .tech-modal .tech-table.rows-mode > tbody > tr > td:nth-child(7) { width: 32%; }
/* Со столбцом цены «было» и «стало» сдвигаются на седьмой и восьмой: ширины
   в режиме строк переносим за ними (заказчик 09.09.2026: «вёрстка поплыла»). */
.tech-modal .tech-table.rows-mode.with-price > tbody > tr > th:nth-child(6), .tech-modal .tech-table.rows-mode.with-price > tbody > tr > td:nth-child(6) { width: 152px; }
.tech-modal .tech-table.rows-mode.with-price > tbody > tr > th:nth-child(7), .tech-modal .tech-table.rows-mode.with-price > tbody > tr > td:nth-child(7) { width: 30%; }
.tech-modal .tech-table.rows-mode.with-price > tbody > tr > th:nth-child(8), .tech-modal .tech-table.rows-mode.with-price > tbody > tr > td:nth-child(8) { width: 30%; }
.tech-modal .tech-table.rows-mode > tbody > tr > th:nth-child(2), .tech-modal .tech-table.rows-mode > tbody > tr > td:nth-child(2) { width: 10%; }
.tech-modal .tech-text .tl-head .tl-name { color: var(--ink-3); }
.tech-modal .tech-text .tl.tl-val-only { padding: 3px 0; border-bottom: 1px dotted var(--line); }
.tech-modal .tz-src-btn { display: inline-block; margin: 0 0 0 10px; font-size: 12.5px; padding: 4px 10px; vertical-align: middle; text-transform: none; letter-spacing: 0; font-weight: 600; text-decoration: none; }
.tech-modal .pane-t { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 0; }
.tz-src-modal { max-width: 1400px; }
/* Окно исходника: шапка с кнопками наверху, снимки прокручиваются до конца
   (заказчик 20.09.2026: «не могу пролистать до конца») */
.tz-src-modal .pane { display: flex; flex-direction: column; max-height: calc(100vh - 90px); }
.tz-src-wrap { overflow: auto; flex: 1 1 auto; min-height: 0; }
.tz-src-wrap table.tz-src { border-collapse: collapse; font-size: 12.5px; line-height: 1.4; }
.tz-src-wrap table.tz-src td { border: 1px solid var(--line-strong); padding: 4px 8px; vertical-align: top; min-width: 60px; }
.tz-src-wrap table.tz-src tr:first-child td { font-weight: 600; background: var(--surface-2, #f3f4f6); }
.tz-src-wrap .tz-src-pos { font-weight: 600; margin: 12px 0 6px; }
.tz-pdf-modal .pane { display: flex; flex-direction: column; height: 100%; }
.tz-pdf-modal .tz-pdf-frame { flex: 1 1 auto; width: 100%; min-height: 70vh; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.tech-modal .tl-fixed, .tech-modal .tl-instr { display: inline-block; font-size: 10.5px; line-height: 1.3; padding: 0 5px; border-radius: 999px; margin-left: 6px; vertical-align: middle; cursor: help; }
.tech-modal .tl-fixed { background: #fff1d6; color: #8a5a00; }
.tech-modal .tl-instr { background: #e6f6ea; color: #1f7a3a; }
.tz-src-wrap pre.tz-src-text { white-space: pre-wrap; overflow-wrap: anywhere; font: 12.5px/1.5 -apple-system, "Segoe UI", Roboto, sans-serif; margin: 0; }
.tech-modal .tech-params { margin-top: 4px; }
.tech-modal .tech-params summary { cursor: pointer; color: var(--brand); font-size: 12.5px; }
.tech-modal .tech-params .bid-table { margin-top: 6px; width: auto; max-width: 1100px; table-layout: auto; }
.tech-modal .tech-params .bid-table th, .tech-modal .tech-params .bid-table td { width: auto; }
.tech-modal .tech-params .bid-table td:nth-child(1) { min-width: 220px; }
.tech-modal .tech-params .bid-table td:nth-child(2), .tech-modal .tech-params .bid-table td:nth-child(3) { min-width: 180px; }
.ws-bid .bid-actions { display: flex; gap: 8px; margin-top: 12px; }
.ws-bid .bid-files { margin: 8px 0 0 18px; padding: 0; }
.ws-bid .bid-actions .primary { padding: 10px 18px; font-size: 13.5px; }
.ws-bid .bid-actions .ws-more { padding: 10px 16px; }
.ws-bid .bid-docs { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; margin-top: 8px; }
.ws-bid .bid-doc {
  display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center;
  padding: 9px 12px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface);
  text-decoration: none; color: var(--ink); transition: border-color .15s, box-shadow .15s;
}
.ws-bid .bid-doc:hover { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); }
.ws-bid .bid-doc-origin { font-weight: 600; }
.ws-bid .bid-doc-origin.customer { color: #1f7a3a; }
.ws-bid .bid-doc-origin.ours { color: #8a5a00; }
.ws-bid .bid-doc-origin.warn { color: var(--warn); }
/* Снимок исходной таблицы ТЗ — страницы документации картинками */
/* Снимок страницы: по умолчанию вписан в окно, масштаб меняется кнопками
   (заказчик 20.09.2026: «на ноутбуке слишком крупно») */
.tz-src-wrap .tz-src-img { display: block; width: var(--tz-zoom, 100%); max-width: none; height: auto;
  margin: 0 auto 14px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
/* Подсветка позиции на странице ТЗ: рамка поверх снимка (21.09.2026) */
.tz-src-wrap .tz-src-page { position: relative; }
.tz-src-wrap .tz-src-mark { position: absolute; left: 0; right: 0; border: 2px solid var(--warn);
  background: rgba(214, 158, 46, .12); border-radius: 4px; pointer-events: none; }
.tz-src-zoom { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; }
.tz-src-zoom .tz-src-btn { min-width: 34px; text-align: center; }
.tz-src-zoom .tz-zoom-val { font-size: 12px; color: var(--ink-2); min-width: 44px; text-align: center; }
.ws-bid .bid-doc.zip { background: color-mix(in srgb, var(--brand) 6%, var(--surface)); border-color: color-mix(in srgb, var(--brand) 25%, transparent); }
.ws-bid .bid-doc-ico { grid-row: 1 / 3; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-align: center; padding: 8px 0; border-radius: 8px; background: var(--brand-soft); color: var(--brand); }
.ws-bid .bid-doc.zip .bid-doc-ico { background: var(--brand); color: #fff; }
/* значок по расширению: Excel зелёный, pdf красный (16.09.2026) */
.ws-bid .bid-doc .bid-doc-ico.ext-xls { background: #E3F2E8; color: #1D6F42; }
.ws-bid .bid-doc .bid-doc-ico.ext-pdf { background: #FBE7E6; color: #B42318; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ws-bid .bid-doc .bid-doc-ico.ext-xls { background: rgba(46, 160, 96, .18); color: #7DD3A0; }
  :root:not([data-theme="light"]) .ws-bid .bid-doc .bid-doc-ico.ext-pdf { background: rgba(220, 70, 60, .18); color: #F4A29B; }
}
:root[data-theme="dark"] .ws-bid .bid-doc .bid-doc-ico.ext-xls { background: rgba(46, 160, 96, .18); color: #7DD3A0; }
:root[data-theme="dark"] .ws-bid .bid-doc .bid-doc-ico.ext-pdf { background: rgba(220, 70, 60, .18); color: #F4A29B; }
.ws-bid .bid-doc-name { font-size: 13px; font-weight: 600; line-height: 1.3; }
.ws-bid .bid-doc-meta { font-size: 11.5px; color: var(--ink-3); }

/* Поля заведения: сами цифры моноширинные — так ИНН и номер извещения
   читаются по разрядам, — а подсказка обычным шрифтом и покрупнее.
   Заказчик 03.09.2026: моноширинная подсказка выглядела жирной и мелкой. */
.zavod .f input { font-size: 15px; }
.zavod .f input::placeholder {
  font-family: var(--sans); font-size: 15px; font-weight: 400;
  letter-spacing: normal; color: var(--ink-3);
}

/* Юрлиц много — вместо стены плашек выпадающий список. */
.z-inns-sel { display: block; }
.z-inns-sel select {
  width: 100%; font: inherit; font-size: 14px; color: var(--ink);
  padding: 10px 12px; border-radius: var(--r-md);
  border: 1px solid var(--line-strong); background: var(--surface);
}
.z-inns-sel select:focus { outline: none; border-color: var(--brand); }

/* ---------- Вкладка «Документы» ---------- */
.dk { padding: 16px 18px 20px; }
.dk-tabs { display: flex; gap: 8px; margin: 0 0 16px; }
.dk-tab {
  font: inherit; font-size: 13px; font-weight: 620; cursor: pointer;
  padding: 8px 16px; border-radius: var(--r-md);
  border: 1px solid var(--line); background: var(--surface); color: var(--ink-2);
}
.dk-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.dk-h {
  font-size: 13px; font-weight: 700; color: var(--brand);
  margin: 20px 0 10px;
}
.dk-h:first-child { margin-top: 0; }
/* Четыре колонки, как в основном сервисе: реквизиты читают глазами по
   строкам, а не листают столбиком на два экрана. */
.dk-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px 16px;
}
.dk-f { min-width: 0; }
.dk-f label {
  display: block; font-size: 12px; font-weight: 620; color: var(--ink-2);
  margin-bottom: 5px;
}
.dk-f input {
  width: 100%; font: inherit; font-size: 13.5px; padding: 9px 12px;
  border-radius: var(--r-md); border: 1px solid var(--line-strong);
  background: var(--surface); color: var(--ink);
}
.dk-f input:focus { outline: none; border-color: var(--brand); }
/* Пришедшее из ЕГРЮЛ — только для чтения: банк сверяется с реестром, и
   расходиться с ним карточка не должна. */
.dk-ro {
  padding: 9px 12px; border-radius: var(--r-md); background: var(--ground);
  font-size: 13.5px; color: var(--ink-2); min-height: 38px;
  overflow-wrap: anywhere;
}
.dk-foot { display: flex; align-items: center; gap: 12px; margin-top: 18px; }

.dk-doc {
  display: grid; grid-template-columns: 1fr auto; align-items: center;
  gap: 8px 12px; padding: 11px 14px; margin-bottom: 8px;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--surface);
}
.dk-doc.есть { border-color: var(--ok, #1E6B42); }
.dk-doc-t { grid-column: 1 / -1; font-size: 13px; font-weight: 620; }
.dk-doc-t .req { color: var(--danger, #B42318); font-style: normal; }
.dk-empty { font-size: 12.5px; color: var(--ink-3); }
.dk-file {
  display: flex; align-items: center; gap: 10px; min-width: 0;
  font-size: 12.5px; color: var(--ink-2);
}
.dk-file .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dk-file .sz { color: var(--ink-3); flex: none; }
.dk-del {
  font: inherit; font-size: 15px; line-height: 1; cursor: pointer;
  border: 0; background: none; color: var(--ink-3); padding: 2px 6px;
}
.dk-del:hover { color: var(--danger, #B42318); }
.dk-add {
  font-size: 12.5px; font-weight: 620; color: var(--brand); cursor: pointer;
  white-space: nowrap;
}
.dk-add input { display: none; }

/* ---------- Ожидание с шагами ---------- */
/* Не крутилка, а список шагов: видно, что именно происходит, и ждать
   становится понятно. Пройденное гаснет, текущее подсвечено. */
.wt { padding: 26px 22px; }
.wt-t { font-size: 15px; font-weight: 680; margin-bottom: 14px; }
.wt-l { list-style: none; margin: 0; padding: 0; }
.wt-l li {
  position: relative; padding: 6px 0 6px 26px;
  font-size: 13.5px; color: var(--ink-3);
  transition: color .2s;
}
.wt-l li::before {
  content: ''; position: absolute; left: 6px; top: 13px;
  width: 7px; height: 7px; border-radius: 50%; background: var(--line-strong);
}
.wt-l li.on { color: var(--ink); font-weight: 600; }
.wt-l li.on::before {
  background: var(--brand);
  animation: wt-pulse 1s ease-in-out infinite;
}
.wt-l li.done { color: var(--ink-2); }
.wt-l li.done::before { background: var(--ok, #1E6B42); }
@keyframes wt-pulse {
  0%, 100% { box-shadow: 0 0 0 0 var(--brand-soft); }
  50% { box-shadow: 0 0 0 6px var(--brand-soft); }
}
@media (prefers-reduced-motion: reduce) {
  .wt-l li.on::before { animation: none; }
}

/* --- обратная связь --- */
/* Окно поуже основного: в нём два поля и картинки, а не анкета. */
.otzyv-m { max-width: 560px; }
.otzyv-place { margin: 0 0 10px; font-size: 13px; color: var(--ink-3); }
.otzyv-place b { color: var(--ink-2); font-weight: 600; }

/* Подпись над полем: textarea занимает всю ширину окна, потому что писать в
   неё будут абзац, а не два слова. */
.fb-lab { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.fb-lab > span { font-size: 13px; font-weight: 600; }
.fb-lab > span i { font-style: normal; font-weight: 400; color: var(--ink-3); }
.otzyv-m textarea {
  width: 100%; font: inherit; font-size: 14px; line-height: 1.5;
  padding: 10px 12px; border-radius: var(--r-md); resize: vertical;
  border: 1px solid var(--line); background: var(--surface); color: var(--ink);
}
.otzyv-m textarea:focus-visible {
  outline: none; border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--brand-soft);
}

/* Зона вставки. Первая строка про Ctrl+V, а не про выбор файла: скриншот в
   Windows делают в буфер, и «выберите файл» отправляет человека сохранять
   картинку на диск — лишний шаг, на котором сообщение и теряется. */
.fb-drop {
  display: flex; flex-direction: column; gap: 4px; align-items: center;
  text-align: center; cursor: pointer; margin-top: 4px;
  padding: 16px 14px; border-radius: var(--r-md);
  border: 1px dashed var(--line-strong); background: var(--surface-2, transparent);
  transition: border-color .15s, background .15s;
}
.fb-drop:hover, .fb-drop:focus-visible, .fb-drop.over {
  border-color: var(--brand); background: var(--brand-soft);
}
.fb-drop b { font-size: 13.5px; font-weight: 600; }
.fb-drop span { font-size: 12.5px; color: var(--ink-3); }
.fb-pick {
  font: inherit; font-size: 12.5px; color: var(--brand); text-decoration: underline;
  background: none; border: 0; padding: 0; cursor: pointer;
}

.fb-thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.fb-thumb { position: relative; }
.fb-thumb img {
  display: block; height: 76px; width: auto; max-width: 140px; object-fit: cover;
  border-radius: var(--r-sm); border: 1px solid var(--line-strong);
}
.fb-thumb-x {
  position: absolute; top: -6px; right: -6px; width: 20px; height: 20px;
  border-radius: 50%; border: 0; cursor: pointer; line-height: 1;
  background: var(--ink); color: #fff; font-size: 14px;
}

.fb-done { display: flex; flex-direction: column; gap: 6px; padding: 18px 0 10px; text-align: center; }
.fb-done b { font-size: 16px; font-weight: 600; }
.fb-done span { font-size: 13.5px; color: var(--ink-2); }

.rv-ask { margin: 10px 0 0; font-size: 13px; color: var(--ink-3); }
.rv-ask button {
  font: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
  color: var(--brand); background: none; border: 0; padding: 2px 5px; border-radius: 7px;
}
.rv-ask button:hover { background: var(--brand-soft); }

/* Надпись над полем — единственное объяснение, как этим окном пользоваться,
   и читают её один раз. Поэтому она темнее и плотнее обычной подсказки. */
.modal.add-tenders .ws-hint {
  font-weight: 500; color: var(--ink-2);
}
/* А образец в поле, наоборот, бледнее: это пример, а не значение, и человек
   не должен принимать его за уже введённый номер. */
.modal.add-tenders textarea::placeholder { color: var(--ink-3); opacity: .55; }

/* --- найденные закупки до запуска разбора --- */
.ws-found { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.ws-found:empty { display: none; }
.ws-found-h { font-size: 12.5px; color: var(--ink-3); }
.ws-card {
  border: 1px solid var(--line); border-radius: var(--r-md);
  padding: 10px 12px; display: flex; flex-direction: column; gap: 4px;
  background: var(--surface);
}
/* Ненайденное не прячем и не выбрасываем молча: человек должен увидеть, что
   номер прочитан, но закупки по нему нет, — чаще всего это опечатка. */
.ws-card.bad { border-style: dashed; }
.ws-card.bad p { font-size: 12.5px; color: var(--warn-ink, #9A5B06); margin: 0; }
.ws-card-t { display: flex; align-items: center; gap: 8px; }
.ws-card-t b { font-size: 13px; font-weight: 600; }
.ws-law { font-size: 11.5px; font-weight: 600; color: var(--ink-2); }
/* НМЦК прижата вправо и весит столько же, сколько номер: это вторая цифра,
   по которой закупку узнают в списке. */
.ws-nmck {
  margin-left: auto; font-size: 13px; font-weight: 600; white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.ws-x {
  margin-left: 4px; width: 22px; height: 22px; line-height: 1; cursor: pointer;
  border: 0; border-radius: 50%; background: none; color: var(--ink-3); font-size: 16px;
}
.ws-x:hover { background: var(--surface-2, rgba(0,0,0,.05)); color: var(--ink); }
.ws-subj { margin: 0; font-size: 13.5px; line-height: 1.45; }
.ws-meta { margin: 0; font-size: 12.5px; color: var(--ink-3); }

/* Заказчик слева, срок справа. Заказчик длинный и жмётся, срок не жмётся
   никогда: он короткий и важнее — по нему решают, браться ли. */
.ws-bottom { display: flex; align-items: center; gap: 10px; }
.ws-cust {
  flex: 1; min-width: 0; font-size: 12.5px; color: var(--ink-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ws-till {
  flex: none; font-size: 12px; font-weight: 600; white-space: nowrap;
  padding: 3px 9px; border-radius: 999px;
  background: var(--brand-soft); color: var(--brand);
}
.ws-till.past { background: #FFF3DF; color: #9A5B06; }

/* Две вкладки обратной связи. Полоса та же, что у этапов заявки, только
   короче: два состояния одного окна, а не путь. */
.otzyv-tabs { padding: 0 20px 12px; gap: 6px; }
.otzyv-m .at-body { padding-top: 2px; }

/* «Главная» стоит у логотипа, а не в правой группе кнопок: это перемещение
   по сервису, а не действие над заявкой. */
.top .logo { display: flex; align-items: center; gap: 10px; }
#home-btn { margin-left: 14px; }

/* «Начать заново» над карточкой заявки: оно про этот разговор, а не про
   поля заявки. Слева, у края карточки, и крупнее обычной кнопки шапки —
   внутри панели оно липло к углу и читалось как часть карточки. */
.side-top { display: flex; justify-content: flex-start; margin-bottom: 12px; }
.side-top .ghost-btn {
  font-size: 14px; font-weight: 600; padding: 10px 16px; gap: 8px;
  border-radius: var(--r-md);
}


/* Кто поставил сумму и срок — под самой цифрой, в разделе гарантий. Наш
   расчёт бледный: он тут норма, а правка руками — событие, и её надо
   замечать, не вчитываясь. Клиенту эти подписи не рисуются вовсе. */
.src-by {
  display: block; margin-top: 2px; font-size: 11px; font-weight: 400;
  white-space: nowrap; color: var(--ink-3);
}
.src-by.client { color: #9A5B06; }
.src-by.staff { color: var(--brand); font-weight: 600; }



/* Прошедшая закупка. Не ошибка и не предупреждение о поломке — сообщение о
   том, в каком состоянии закупка, поэтому тон спокойный, серо-синий, а не
   янтарный: янтарным рядом говорит незаполненное поле, и два тревожных
   блока подряд перестают читаться. */
.pastbox {
  display: flex; gap: 9px; align-items: flex-start;
  margin: 0 0 14px; padding: 11px 13px; border-radius: var(--r-md);
  background: var(--brand-soft); color: var(--ink-2); font-size: 13px;
  line-height: 1.5;
}
.pastbox svg { flex: none; margin-top: 1px; color: var(--brand); }
.pastbox b { color: var(--ink); font-weight: 600; }


/* Рамка пакета документов под перетаскиванием. Подсвечиваем весь блок, а не
   строку с кнопкой: бросают в него целиком. */
.drop.over {
  outline: 2px dashed var(--brand); outline-offset: 3px;
  background: var(--brand-soft); border-radius: var(--r-md);
}
.drop.over * { pointer-events: none; }


/* «Чего не хватает» — красным и заметно. Класс `bad` на подсказке ставился с
   первого дня, а правила под него не было: сообщение рисовалось тем же серым,
   что и обычная подсказка рядом, и человек его не замечал. */
.hint.bad {
  color: var(--danger); font-weight: 600;
  background: var(--danger-soft); border-radius: var(--r-sm);
  padding: 8px 11px; margin-top: 8px;
}

/* Кнопка в работе: бегущие точки (12.09.2026) */
button.busy { opacity: .85; cursor: progress; }
.dots i { font-style: normal; animation: dot-blink 1.2s infinite; }
.dots i:nth-child(2) { animation-delay: .2s; }
.dots i:nth-child(3) { animation-delay: .4s; }
@keyframes dot-blink { 0%, 60%, 100% { opacity: .2; } 30% { opacity: 1; } }
/* Номер закупки в шапке окна разбора */
.tech-modal .tech-tender { margin-left: 10px; font-size: 12.5px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--ink-3); font-family: var(--mono, monospace); }

/* Раздел «Заявки» и мастер подготовки к подаче (13.09.2026) */
.history .kind.bid, .acc-history .kind.bid { background: var(--brand-soft); color: var(--brand); }
.stars i { font-style: normal; color: var(--line-2, #cfd3e0); font-size: 14px; letter-spacing: 1px; }
.stars i.on { color: #E3A008; }
.overlay.bid-master .mbody { grid-template-columns: minmax(0, 1fr); }
.overlay.bid-master .modal { position: relative; }
.overlay.bid-master .tech-x { position: absolute; right: 10px; top: 8px; }
.overlay.bid-master #bm-pane { padding: 16px 22px 28px; }
.overlay.bid-master .ws-bid { max-width: 1100px; }
/* Шаги окна заявки — вкладки: чужие части скрыты (15.09.2026) */
.overlay.bid-master .bm-off { display: none !important; }
/* Первый экран окна заявки — как у гарантии: слева параметры, справа
   карточка закупки (заказчик 15.09.2026) */
.overlay.bid-master #bm-pane.bm-start-on { padding: 0; }
.overlay.bid-master .bm-start {
  display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); min-height: 100%;
}
.overlay.bid-master .bm-start > .pane { overflow: visible; }
.overlay.bid-master .bm-start .f input[readonly] { cursor: default; }
.overlay.bid-master .bm-start .z-inn-b { cursor: default; }
.overlay.bid-master .bm-start .check { cursor: default; }
@media (max-width: 880px) {
  .overlay.bid-master .bm-start { grid-template-columns: minmax(0, 1fr); }
  .overlay.bid-master .bm-start > .pane.left { border-right: none; border-bottom: 1px solid var(--line); }
}
.overlay.bid-master #bm-nr-next { margin-top: 14px; }
.bid-rate textarea { width: 100%; box-sizing: border-box; margin-top: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; font: inherit; font-size: 14px; background: var(--surface); color: var(--ink); resize: vertical; }
.bid-stars { display: flex; align-items: center; gap: 4px; margin-top: 10px; }
.bid-stars button { border: 0; background: none; font-size: 28px; line-height: 1; color: var(--line-2, #cfd3e0); cursor: pointer; padding: 0 2px; transition: color .12s, transform .12s; }
.bid-stars button.on { color: #E3A008; }
.bid-stars button:hover { transform: scale(1.12); }
.bid-stars-hint { margin-left: 10px; font-size: 13px; color: var(--ink-3); }
.bid-rate-row { display: flex; align-items: center; gap: 12px; margin-top: 8px; flex-wrap: wrap; }
.bid-rate .bid-actions { margin-top: 10px; align-items: center; gap: 12px; }
.bid-rated .stars i { font-size: 16px; }
.overlay.bid-zavod .mchip { min-width: 140px; }

/* Просмотр заявки клиента администратором (14.09.2026): плашка сверху,
   изменения отключены */
.view-as-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 3000;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  padding: 8px 18px; font-size: 13px;
  background: #FFF4D6; color: #5A4200; border-bottom: 1px solid #F0D48A;
}
.view-as-bar b { font-weight: 700; }
.view-as-bar .spacer { flex: 1; }
.view-as-bar a { color: inherit; font-weight: 600; }
body.view-as { padding-top: 38px; }
:root[data-theme="dark"] .view-as-bar { background: #3A2E0A; color: #F5DFA0; border-color: #5C4A12; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .view-as-bar { background: #3A2E0A; color: #F5DFA0; border-color: #5C4A12; } }

/* нацрежим отдельным разделом полного разбора — блок во всю ширину (16.09.2026) */
.rv-row.rv-row-nr { display: block; }
.rv-row.rv-row-nr .rv-a.ws-bid { padding: 4px 0 8px; border-top: 0; margin-top: 0; }
.tc-platform a { color: var(--brand); text-decoration: none; font-weight: 600; }
.tc-platform a:hover { text-decoration: underline; }
.tc-wide .tc-pos { margin-top: 4px; font-size: 13px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.tc-main small.tc-main-note { font-size: 12px; font-weight: 500; color: var(--ink-3); margin-top: 3px; }
/* текстовый ответ вместо суммы — тем же шрифтом, что подписи сумм, чуть мельче цифр (16.09.2026) */
.tc-main > span.tc-main-text { font-size: 15px; font-weight: 700; }

/* Вход в подготовку заявки из полного разбора (16.09.2026): текст слева,
   кнопка справа, стоимость мелко под кнопкой; на узком — друг под другом */
.bid-go {
  display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap;
  margin-top: 8px; padding: 16px 18px; border-radius: var(--r-lg);
  background: color-mix(in srgb, var(--brand) 6%, var(--surface));
  border: 1px solid color-mix(in srgb, var(--brand) 18%, transparent);
}
.bid-go-text { flex: 1 1 320px; min-width: 0; }
.bid-go-h { font-size: 15px; font-weight: 750; color: var(--ink); margin-bottom: 4px; }
.bid-go-text p { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-2); }
.bid-go-act { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: none; }
.bid-go-act .primary { white-space: nowrap; }
.bid-go-cost { font-size: 12px; color: var(--ink-3); }
@media (max-width: 640px) {
  .bid-go-act { width: 100%; align-items: stretch; text-align: center; }
  .bid-go-act .primary { white-space: normal; }
}

/* «Товары» — позиции из печатной формы ЕИС (16.09.2026) */
.rv-row.rv-row-goods { display: block; }
.gp-h { margin: 10px 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); }
.gp-wrap { overflow-x: auto; border: 1px solid color-mix(in srgb, var(--brand) 14%, var(--line)); border-radius: var(--r-md); }
.gp-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.gp-table th { text-align: left; font-size: 11.5px; font-weight: 650; color: var(--ink-3); padding: 8px 10px;
  background: color-mix(in srgb, var(--brand) 5%, var(--surface)); border-bottom: 1px solid var(--line); white-space: nowrap; }
.gp-table td { padding: 9px 10px; border-top: 1px solid color-mix(in srgb, var(--brand) 8%, var(--line)); vertical-align: top; }
.gp-table tbody tr:first-child td { border-top: 0; }
.gp-table td.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.gp-table tfoot td { font-weight: 700; border-top: 1px solid var(--line); }
.gp-name { font-weight: 650; color: var(--ink); }
.gp-code { white-space: nowrap; font-variant-numeric: tabular-nums; color: var(--ink-2); }
.gp-more { margin-top: 6px; padding: 0; border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 650; color: var(--brand); cursor: pointer; }
.gp-more:hover { text-decoration: underline; }
.gp-chars { margin-top: 8px; }
.gp-chars table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.gp-chars td { padding: 5px 8px; border-top: 1px dashed var(--line); vertical-align: top; }
.gp-chars td:first-child { color: var(--ink-2); width: 40%; }
.gp-chars td:last-child { width: 30%; font-size: 12px; }

/* Крестик окна банков (16.09.2026) */
.modal.b-modal { position: relative; }
.modal.b-modal .b-x { position: absolute; top: 12px; right: 14px; width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink-2); font-size: 20px; line-height: 1;
  cursor: pointer; z-index: 2; }
.modal.b-modal .b-x:hover, .modal.b-modal .b-x:focus-visible { border-color: var(--brand); color: var(--brand); }
.modal.b-modal .mchips { padding-right: 56px; }

/* Аванс в шапке карточки тендера (16.09.2026): сумма как у обеспечения,
   процент — зелёной меткой ниже; колонка заказчика уже, чтобы подписи не переносились */
.tc-row.tc-row-5 { grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr)); gap: 14px; }
.tc-row.tc-row-5 .tc-main b { min-height: 3em; display: flex; align-items: flex-end; }
.tc-advance small.tc-adv { display: inline-block; margin-top: 5px; font-size: 12.5px; font-weight: 700; line-height: 1.3;
  color: var(--ok); background: var(--ok-soft); padding: 1px 9px; border-radius: 999px; }
.tc-advance .tc-adv-text { color: var(--ok); }
@media (max-width: 900px) { .tc-row.tc-row-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Подпись «Предмет закупки» — как у заказчика, блок чуть ниже (16.09.2026) */
.tc-wide .tc-subj-box { margin-top: 14px; }
.tc-wide .tc-subj-box > b { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px; }
.tc-wide .tc-subj-box .tc-subj { margin-top: 0; }

/* Линейка сроков исполнения договора (16.09.2026) */
/* те же поля, что у «Краткого разбора», и отступ от карточки сверху */
.tl-box { padding: 20px 18px 0; }
.tl-row { display: flex; align-items: flex-start; gap: 0; padding: 4px 4px 0; }
.tl-seg { min-width: 0; flex: 1 1 0; display: flex; flex-direction: column; gap: 3px; padding: 0 2px; }
/* поставка — шире, как приёмка и оплата вместе: под ней больше сведений (16.09.2026) */
.tl-seg.tl-do { flex: 2 1 0; }
.tl-info { font-size: 11.5px; color: var(--ink-2); text-align: center; line-height: 1.3; padding: 0 6px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tl-bar { position: relative; height: 26px; display: flex; align-items: center; justify-content: center; }
.tl-bar::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 6px; margin-top: -3px; border-radius: 999px; }
.tl-do .tl-bar::before { background: color-mix(in srgb, var(--brand) 55%, transparent); }
.tl-acc .tl-bar::before { background: color-mix(in srgb, var(--warn) 60%, transparent); }
.tl-pay .tl-bar::before { background: color-mix(in srgb, var(--ok) 60%, transparent); }
.tl-ico { position: relative; z-index: 1; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
  background: var(--surface); border: 1.5px solid currentColor; }
.tl-do .tl-ico { color: var(--brand); } .tl-acc .tl-ico { color: var(--warn); } .tl-pay .tl-ico { color: var(--ok); }
.tl-name { font-size: 12px; font-weight: 700; color: var(--ink-2); text-align: center; }
/* сроки — тем же шрифтом, что сведения над линейкой, чуть жирнее (16.09.2026) */
.tl-term { font-size: 11.5px; font-weight: 600; color: var(--ink-2); text-align: center; line-height: 1.3; overflow-wrap: anywhere; }
.tl-dot { flex: none; width: 92px; display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.tl-dot i { width: 12px; height: 12px; margin-top: 7px; border-radius: 50%; background: var(--ink-2); box-shadow: 0 0 0 3px var(--surface), 0 0 0 4px var(--line-strong); }
.tl-dot span { font-size: 11.5px; font-weight: 650; color: var(--ink-2); line-height: 1.25; }
.tl-note { margin: 6px 0 0; font-size: 11.5px; color: var(--ink-3); }
@media (max-width: 640px) { .tl-dot { width: 64px; } .tl-name { font-size: 11px; } .tl-term { font-size: 11px; } }

/* Одинокая плитка на новой строке — полосой в одну строку (16.09.2026) */
.dv-stat.dv-stat-line { grid-column: 1 / -1; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; padding: 9px 14px; }
.dv-stat.dv-stat-line .dv-stat-v { margin-top: 0; font-size: 16px; }
.dv-stat.dv-stat-line .dv-stat-n, .dv-stat.dv-stat-line .dv-stat-x { margin-top: 0; }

/* сведения над линейкой: одинаковая высота блока у всех этапов и у точек */
.tl-row { --tl-top: 0px; }
.tl-top { min-height: var(--tl-top); display: flex; flex-direction: column; justify-content: flex-end; gap: 1px; font-size: 11.5px; padding-bottom: 4px; }
.tl-top .tl-info { -webkit-line-clamp: 1; white-space: nowrap; text-overflow: ellipsis; display: block; line-height: 16px; height: 16px; }
.tl-dot { padding-top: calc(var(--tl-top) + 4px); }

/* Совместный лот в карточке: метка и первые заказчики в две строки (16.09.2026) */
.tc-joint .tc-joint-h { display: block; font: inherit; font-size: 13px; font-weight: 700; color: var(--brand); margin: 0 0 3px; padding: 0;
  border: 0; background: none; cursor: pointer; text-align: left; }
.tc-joint .tc-joint-h:hover { text-decoration: underline; }
.tc-joint .tc-joint-h i { font-style: normal; font-size: 11px; }
.tc-joint .tc-joint-all { margin: 2px 0 0; padding-left: 20px; font-size: 13px; line-height: 1.45; font-weight: 600; color: var(--ink);
  max-height: 260px; overflow-y: auto; }
.tc-who.tc-joint > span.tc-joint-list { font-weight: 600; }

/* Кнопки под числами в шапке карточки тендера (16.09.2026) */
.tc-main .tc-act { display: inline-block; margin-top: 7px; padding: 3px 10px; border: 0; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: 11.5px; font-weight: 650; color: #fff; background: var(--brand); line-height: 1.4; white-space: nowrap; }
.tc-main .tc-act:hover { filter: brightness(1.1); }
.tc-main .tc-act:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }

/* Окно заявки (17.09.2026): главная кнопка шага — в подвале; «Разобрать
   заново» — кнопкой; «УТОЧНИТЬ» — жёлтым; «О товаре» — с отступом */
.bm-in-foot { display: none !important; }
#bm-foot-act:empty { display: none; }
.ws-bid .bid-restart { border: 1px solid var(--line-strong); border-radius: var(--r-md); padding: 7px 14px; background: var(--surface);
  color: var(--ink-2); font-size: 13px; text-decoration: none; }
.ws-bid .bid-restart:hover { border-color: var(--brand); color: var(--brand); }
.ws-bid .bid-goods { margin-top: 18px; }
.ws-bid .bid-goods .bid-actions { margin: 8px 0 4px; }
.bid-note-utoch { margin: 10px 0 0; font-size: 13px; color: var(--ink-3); }
mark.bid-utoch { background: #FFE58A; color: #3A2F00; padding: 0 4px; border-radius: 3px; font-weight: 600; }

/* Крестик «удалить разбор из списка» (17.09.2026): виден при наведении и на выбранной строке */
.ws-item { position: relative; }
.ws-i-x { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; display: grid; place-items: center;
  border-radius: 50%; color: var(--ink-3); font-size: 15px; line-height: 1; opacity: 0; transition: opacity .12s; }
.ws-item:hover .ws-i-x, .ws-item.on .ws-i-x, .ws-i-x:focus-visible { opacity: 1; }
.ws-i-x:hover { background: var(--line); color: var(--ink); }
@media (hover: none) { .ws-i-x { opacity: 1; } }
.ws-item .ws-i-name { padding-right: 18px; }

/* Файл профиля: что из него взяли (17.09.2026); «О товаре» — кнопка справа от подписи */
.bid-doc .bid-doc-used { color: var(--ok, #2E7D4F); font-size: 12.5px; }
.ws-bid .bid-goods-row { display: flex; align-items: center; justify-content: space-between; gap: 8px 16px; flex-wrap: wrap; margin: 4px 0 8px; }
.ws-bid .bid-goods-row .ws-more { margin: 0; flex: none; }

/* Работы и услуги: «характеристики не указываются» — зелёным, это хорошая
   новость, а не предупреждение (заказчик 21.09.2026, 32616360607) */
.bid-simple-ok { background: var(--ok-soft) !important; border: 1px solid var(--ok-line, #BFE6D3); }
.bid-simple-ok > b { color: var(--ok); }

/* Приглашение оценить заявку в конце собранных документов (21.09.2026) */
.bid-rate-ask { background: var(--brand-soft, #eef0ff); border-radius: 14px; padding: 14px 18px; margin-top: 14px; }
.bid-rate-ask .bid-stars { margin-top: 6px; }

/* Данные компании — свёрнуто, список по кнопке (21.09.2026) */
.bid-folder-details { margin: 4px 0 10px; }
.bid-folder-details > summary { cursor: pointer; list-style: none; color: var(--ink-2); font-size: 14px; }
.bid-folder-details > summary::-webkit-details-marker { display: none; }
.bid-folder-toggle { color: var(--brand); margin-left: 6px; text-decoration: underline; text-underline-offset: 3px; }
.bid-folder-details[open] .bid-folder-toggle { font-size: 0; }
.bid-folder-details[open] .bid-folder-toggle::after { content: "скрыть"; font-size: 14px; }
.bid-folder-details .bid-folder-list { margin-top: 8px; }

/* Бланк формы не нашли: поискать ещё раз / загрузить свой (21.09.2026) */
.bid-blank-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.bid-blank-upload { cursor: pointer; }
.bid-blank-upload.busy { opacity: .6; pointer-events: none; }

/* Редактор формы целиком (21.09.2026): лист как в Word, правится любое место */
.formfix-modal { max-width: 1100px; }
.formfix-modal .formfix-kind { margin: 12px 0 0; padding: 8px 12px; border-radius: 8px; font-size: 13px; line-height: 1.5; background: var(--brand-soft); color: var(--ink); }
.formfix-modal .formfix-kind-client { background: #FFF6DC; color: #5B4300; }
.formfix-modal .formfix-kind-tpl { background: var(--ground); color: var(--ink-2); }
.formfix-modal .formfix-doc { margin-top: 12px; padding: 20px 24px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); max-height: 62vh; overflow: auto; display: flex; flex-direction: column; gap: 2px; }
.formfix-modal .formfix-doc textarea { display: block; width: 100%; box-sizing: border-box; resize: none; overflow: hidden; min-height: 26px; font: 14px/1.45 "Times New Roman", Georgia, serif; color: var(--ink); background: transparent; border: 1px solid transparent; border-radius: 4px; padding: 3px 6px; }
.formfix-modal .formfix-doc textarea:hover { border-color: var(--line-strong); }
.formfix-modal .formfix-doc textarea:focus-visible { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-soft); background: var(--surface); }
.formfix-modal .formfix-doc textarea.formfix-need { background: #FFF3B8; color: #1d1d1d; }
.formfix-modal .formfix-doc textarea.formfix-edited { background: #DDEBFF; color: #10143A; }
.formfix-modal .formfix-gap { height: 8px; }
.formfix-modal .formfix-twrap { overflow-x: auto; margin: 6px 0; }
.formfix-modal .formfix-t { border-collapse: collapse; width: 100%; }
.formfix-modal .formfix-t td { border: 1px solid var(--line-strong); padding: 0; vertical-align: top; min-width: 70px; }
.formfix-modal .formfix-t textarea { font-size: 13px; border-radius: 0; }
.formfix-modal .formfix-mark { background: #FFF3B8; color: #1d1d1d; padding: 0 3px; border-radius: 3px; }
.formfix-modal .formfix-doc > * { flex-shrink: 0; }

/* «С формой что-то не так» (21.09.2026) */
.formfix-modal .formfix-trouble-bar { margin-top: 10px; }
.formfix-modal .formfix-trouble { margin-top: 10px; padding: 12px 14px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); display: flex; flex-direction: column; gap: 6px; }
.formfix-modal .formfix-tr-t { font-weight: 600; margin-bottom: 2px; }
.formfix-modal .formfix-tr-opt { display: flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }
.formfix-modal .formfix-tr-sub { margin: 0 0 4px 26px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.formfix-modal .formfix-tr-sub select { max-width: 100%; }
.formfix-modal .formfix-tr-sub textarea { width: 100%; box-sizing: border-box; }
.formfix-modal .formfix-tr-sub .dim { flex-basis: 100%; font-size: 12.5px; }
.formfix-modal .formfix-tr-msg { font-size: 13px; color: var(--ink-2); min-height: 1em; }

/* «Загрузить форму» — одно окно, любой способ (22.09.2026) */
.blank-up-modal { max-width: 720px; }
.blank-up-modal .blank-up-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; margin-top: 14px; padding: 28px 16px; border: 2px dashed var(--line-strong); border-radius: 12px; text-align: center; cursor: pointer; background: var(--ground); }
.blank-up-modal .blank-up-drop.drag, .blank-up-modal .blank-up-drop:focus-visible { border-color: var(--brand); background: var(--brand-soft); outline: none; }
.blank-up-modal .blank-up-big { font-weight: 600; color: var(--ink); }
.blank-up-modal .blank-up-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.blank-up-modal .blank-up-item { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 8px; }
.blank-up-modal .blank-up-item img { width: 56px; height: 40px; object-fit: cover; border-radius: 4px; border: 1px solid var(--line); }
.blank-up-modal .blank-up-ext { width: 56px; text-align: center; font-size: 12px; font-weight: 700; color: var(--brand); }
.blank-up-modal .blank-up-name { flex: 1; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.blank-up-modal .blank-up-item .tech-x { position: static; }

/* Выписки ФНС: кнопка обновления справа от списка (22.09.2026) */
.bid-extracts-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.bid-extracts-row > ul { flex: 1 1 320px; margin: 6px 0; }
.bid-extracts-btn { flex: 0 0 auto; margin-top: 6px; }

/* «Разобрать документацию заново» — серьёзное действие: бордовым, по центру,
   в окне заявки и в чате одинаково (заказчик 22.09.2026) */
.ws-bid .bid-restart-row { display: flex; justify-content: center; margin: 10px 0 12px; }
.ws-bid #bid-start.bid-restart { border: 1px solid var(--burgundy); color: var(--burgundy); background: var(--burgundy-soft);
  border-radius: var(--r-md); padding: 8px 18px; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.ws-bid #bid-start.bid-restart:hover { background: var(--burgundy); color: #fff; border-color: var(--burgundy); }
.ws-bid #bid-start.bid-restart:focus-visible { outline: 2px solid var(--burgundy); outline-offset: 2px; }

/* Скриншоты паспорта в «Свои — из паспортов и ссылок» (22.09.2026) */
.bid-shots { margin: 8px 0; padding: 10px 12px; border: 1px dashed var(--line-strong); border-radius: 10px; font-size: 13px; outline: none; }
.bid-shots.on, .bid-shots:focus { border-color: var(--brand); background: var(--brand-soft, transparent); }
.bid-shots-list { display: flex; flex-wrap: wrap; gap: 8px; }
.bid-shots-list:not(:empty) { margin-top: 8px; }
.bid-shot { position: relative; display: inline-block; }
.bid-shot img { display: block; height: 72px; max-width: 140px; object-fit: cover; border-radius: 6px; border: 1px solid var(--line); }
.bid-shot button { position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); font-size: 13px; line-height: 1; cursor: pointer; padding: 0; }

/* «Открыть полный разбор» — заметная, но не главная: мягкая заливка бренда
   вместо белой (заказчик 22.09.2026, 32616386192: «белую совсем не видно») */
.ws-bid .ws-more.bid-tech-accent { background: var(--brand-soft); border-color: var(--brand); color: var(--brand); font-weight: 600; }
.ws-bid .ws-more.bid-tech-accent:hover { background: var(--brand); color: #fff; }
.ws-bid .bid-goods-row > span { color: var(--ink-2, var(--ink)); }
