/* ══════════════════════════════════════════════════════════════════════════════
   «План задание v2» - стили страницы (files/order-plan-v2.js рендерит разметку).

   Перенос 1:1 с утверждённого превью (правило «превью = контракт»,
   plans/2026-09-10-order-plan-v2-native.md). Все классы с префиксом op2-, чтобы
   не пересекаться с уже существующими в index.html .chip/.tbl/.veh/.row/.list и
   прочими общими именами - страница живёт внутри общего документа дашборда.

   Токены (--bg, --text, --green, --tint-*, --border-strong) объявлены в :root
   index.html. Шрифтовые и easing-токены в index.html объявлены НЕ в :root, а
   внутри #page-crm / #page-logistics-plan - поэтому объявляем свою копию тут же,
   в .op2-root (тот же приём, что у CRM).

   Тема тёмная и единственная (ГОСТ, раздел 1) - цвета заданы явно.
   ══════════════════════════════════════════════════════════════════════════════ */

.op2-root{
  --font-display:'Unbounded','Arial Narrow',sans-serif;
  --font-body:'Golos Text','Segoe UI',system-ui,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;
  --ease-out-strong:cubic-bezier(.22,.9,.28,1);
  --ease-out-soft:cubic-bezier(.25,.8,.35,1);
  --ease-overshoot:cubic-bezier(.34,1.45,.5,1);
  /* общий такт всех миганий страницы - как на «Планировке» (ГОСТ, запрет №9) */
  --op2-blink-tact:2400ms;
  font-family:var(--font-body);
  font-size:13px;
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}
.op2-root *{box-sizing:border-box;}
.op2-root button,.op2-root input,.op2-root select,.op2-root textarea{font-family:inherit;font-size:inherit;color:inherit;}
.op2-root button{cursor:pointer;}
.op2-root :focus-visible{outline:2px solid var(--blue);outline-offset:2px;}
.op2-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;}
.op2-dim{color:var(--muted);}
.op2-sm{font-size:11px;}
.op2-nowrap{white-space:nowrap;}
.op2-hidden{display:none!important;}
.op2-spacer{flex:1;}

/* ---------- шапка страницы и переключатель экранов (у admin) ---------- */
.op2-page-head{display:flex;align-items:baseline;gap:14px;padding:2px 0 12px;flex-wrap:wrap;}
.op2-page-head h2{font-family:var(--font-display);font-weight:600;font-size:19px;margin:0;letter-spacing:-.01em;}
.op2-page-head .op2-sub{color:var(--muted);font-size:12.5px;}
.op2-page-head .op2-sub-main{color:var(--text);font-size:14px;font-weight:500;}
/* лампочки присутствия (только admin) - как в Планировке: код капсом, ярко-красный = действует прямо сейчас */
.op2-presence{display:flex;gap:4px;margin-left:auto;align-items:center;}
.op2-presence + .op2-switch{margin-left:10px;}
.op2-pt{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:6px 8px;line-height:1;}
.op2-pt.op2-active{color:var(--tint-red);background:rgba(226,75,74,.16);border-color:rgba(226,75,74,.55);font-weight:600;animation:op2PresBlink 1.1s ease-in-out infinite;}
.op2-pt.op2-none{text-transform:none;letter-spacing:0;font-family:var(--font-body);}
@keyframes op2PresBlink{0%,100%{opacity:1;}50%{opacity:.55;}}
.op2-switch{display:flex;background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:3px;gap:3px;margin-left:auto;}
.op2-switch button{background:transparent;border:0;border-radius:8px;padding:7px 13px;color:var(--muted);font-weight:500;font-size:12.5px;transition:background .13s var(--ease-out-soft),color .13s;}
.op2-switch button.op2-on{background:var(--bg3);color:var(--text);}
.op2-switch button:hover{color:var(--text);}

.op2-screen{display:none;}
.op2-screen.op2-on{display:block;}

/* ---------- кнопки ---------- */
.op2-ghost{background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:6px 11px;font-size:12px;color:var(--text);transition:border-color .13s,color .13s;}
.op2-ghost:hover{border-color:var(--green);color:var(--green);}
.op2-ghost.op2-red{color:var(--tint-red);}
.op2-ghost.op2-red:hover{border-color:var(--red);}
.op2-dbtn{background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:7px 13px;font-size:12.5px;font-weight:500;transition:border-color .13s,background .13s,color .13s;}
.op2-dbtn:hover{border-color:var(--border-strong);background:var(--bg4);}
.op2-dbtn.op2-primary{background:var(--green);border-color:var(--green);color:#0b1511;}
.op2-dbtn.op2-primary:hover{background:#25b587;}
.op2-dbtn.op2-primary.op2-warn{background:var(--amber);border-color:var(--amber);}
.op2-dbtn.op2-primary.op2-warn:hover{background:#f5ad3d;}
.op2-dbtn.op2-primary.op2-blocked{background:var(--bg4);border-color:var(--border-strong);color:var(--muted);}
/* «Принять изменения и перевыпустить договор» (22.09) - БЕЗ .op2-primary, красный, не
   янтарный - тот же селектор-состав не конфликтует с .op2-primary.op2-warn выше (разный
   класс-набор), превью с этим цветом уже одобрено Владом. */
.op2-dbtn.op2-warn{background:var(--red);border-color:var(--red);color:#1a0d0d;}
.op2-dbtn.op2-warn:hover{background:#ea5f5e;}

/* ---------- sticky полоса управления ---------- */
.op2-bar{position:sticky;top:var(--op2-stick-top,0px);z-index:30;background:var(--bg2);border:1px solid var(--border);border-radius:12px;display:flex;align-items:center;gap:8px;padding:0 10px;flex-wrap:wrap;}
.op2-bar.op2-h48{min-height:48px;}
.op2-bar.op2-h44{min-height:44px;}
/* два ряда тулбара логиста (19.09, «Картограф» + фильтры на своей строке) - каждый
   .op2-bar сам по себе тоже sticky top:0, поэтому оба ряда независимо ЛЕЗЛИ БЫ друг на
   друга при скролле (у sticky нет автоматического стекинга по соседям). Группа - один
   sticky-контекст на оба ряда, дети внутри уже просто static и идут друг под другом. */
.op2-bar-group{position:sticky;top:var(--op2-stick-top,0px);z-index:30;display:flex;flex-direction:column;gap:8px;background:var(--bg);}
.op2-bar-group .op2-bar{position:static;}
.op2-tab{background:transparent;border:0;border-radius:8px;padding:6px 10px;color:var(--muted);font-size:12.5px;font-weight:500;transition:background .13s var(--ease-out-soft),color .13s,transform .13s var(--ease-out-soft);}
.op2-tab:hover{background:var(--bg3);color:var(--text);transform:translateX(1px);}
.op2-tab.op2-on{background:var(--bg3);color:var(--text);}

/* ---------- лента дат «Картограф» (18.09, заменила Вчера/Сегодня/Завтра/Пн/Вт/Неделя +
   всегда видимый календарь; канон - DESIGN_SYSTEM.md «Лента дат «Картограф»») ---------- */
.op2-weeknav{width:30px;height:30px;border-radius:8px;background:var(--bg3);border:1px solid var(--border);color:var(--muted);display:flex;align-items:center;justify-content:center;flex:none;transition:border-color .13s,color .13s,background .13s;}
.op2-weeknav:hover{border-color:var(--border-strong);color:var(--text);background:var(--bg4);}
.op2-weeknav:active{transform:translateY(1px);}
.op2-weeknav svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.op2-weekrow{display:flex;align-items:center;gap:4px;flex:none;}
/* плоский чип дня - высота вровень со стрелками/гормошкой (30px), день+число одной
   надписью, счётчик мелкой цифрой следом (тот же приём, что у .op2-tab .op2-cnt раньше) */
.op2-wchip{
  display:flex;align-items:center;gap:4px;height:30px;padding:0 8px;flex:none;
  border-radius:8px;background:var(--bg3);border:1px solid var(--border);
  font-size:12px;font-weight:500;color:var(--text);white-space:nowrap;
  transition:background .13s var(--ease-out-soft),border-color .13s var(--ease-out-soft),transform .13s var(--ease-out-soft);
}
.op2-wchip:hover{border-color:var(--border-strong);background:var(--bg4);transform:translateY(-1px);}
.op2-wchip:active{transform:translateY(0);}
.op2-wchip-cnt{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:10.5px;color:var(--muted);}
.op2-wchip-cnt-empty{color:var(--border-strong);}
/* якорь «сегодня» - акцентная обводка и жирный текст, даже если не выбран */
.op2-wchip-today{border-color:var(--green);font-weight:700;}
.op2-wchip-today .op2-wchip-cnt{color:var(--tint-green);}
/* выбранный день - заливка, как у существующего .op2-chip.op2-on */
.op2-wchip.op2-on{background:rgba(29,158,117,.20);border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green);font-weight:600;}
.op2-wchip.op2-on .op2-wchip-cnt{color:var(--tint-amber);}
/* выходные - читаются красным, как на любом календаре (Влад 18.09); --tint-red, НЕ базовый
   --red - тот занят под «требует внимания» (отбой/долг/штрафы, раздел 1 ГОСТа), обычная
   суббота не должна выглядеть как тревога рядом с реальными тревожными карточками дашборда.
   Снимается, если день выбран (зелёная заливка важнее) или это сегодня (якорь важнее). */
.op2-wchip-weekend:not(.op2-on):not(.op2-wchip-today) .op2-wchip-label{color:var(--tint-red);}
.op2-todaypill{flex:none;}
.op2-chip{background:transparent;border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:11.5px;color:var(--muted);transition:border-color .13s,color .13s,background .13s;}
.op2-chip:hover{border-color:var(--border-strong);color:var(--text);}
/* 11.09, Влад: «очень непонятно, нажата она или нет» - выбранный чип заливается зелёным,
   рамка зелёная, текст ярче и жирнее; в нажатом состоянии - вдавленная тень */
.op2-chip.op2-on{background:rgba(29,158,117,.20);border-color:var(--green);color:var(--text);font-weight:600;box-shadow:inset 0 0 0 1px var(--green);}
.op2-chip.op2-on:hover{background:rgba(29,158,117,.28);border-color:var(--green);}
.op2-chip:active{transform:translateY(1px);}
.op2-chip .op2-n{font-family:var(--font-mono);font-size:10.5px;margin-left:5px;color:var(--tint-amber);}
/* «От кого» - сворачиваемый ряд юрлиц (вариант А мозгового штурма, утверждён Владом
   11.09: «однозначно вариант А»). По умолчанию виден только выбранный чип + «Ещё · N» -
   клик раскрывает семь остальных тем же приёмом FLIP, что уже используется на
   «Планировке» для соседних карточек (ГОСТ, раздел 6): «Ещё» отъезжает в конец ряда и
   становится «×» (--ease-out-strong здесь = --ease-flip главного ГОСТа, тот же
   cubic-bezier), новые чипы входят каскадом по 35мс - тем же шагом, что несёт S.unfold(). */
.op2-chip.op2-ent-enter{animation:op2EntPop .22s var(--ease-overshoot) both;}
@keyframes op2EntPop{from{opacity:0;transform:translateY(3px) scale(.88);}to{opacity:1;transform:none;}}
.op2-chip.op2-ent-close{transition:transform .3s var(--ease-out-strong);}
/* «Тип техники» - устаревший тип (был в заявке, деактивирован в справочнике позже,
   11.09: сузили «Ещё» до 4 позиций) - тот же приём тусклой рамки, что у юрлица без
   банка/печати: чип виден и выбран, просто помечен, а не молча пропадает из формы. */
.op2-chip.op2-eq-gone{opacity:.55;border-style:dashed;border-color:var(--tint-amber);}
.op2-chip.op2-eq-gone.op2-on{background:rgba(239,159,39,.16);border-color:var(--tint-amber);box-shadow:none;}
.op2-sep{width:1px;height:22px;background:var(--border);margin:0 4px;}
.op2-search{background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:6px 10px;width:220px;color:var(--text);}
.op2-search::placeholder{color:var(--muted);}
.op2-dt{background:var(--bg3);border:1px solid var(--border);border-radius:8px;padding:5px 8px;color:var(--text);font-family:var(--font-mono);font-size:12px;color-scheme:dark;}

/* ---------- вердикт-полоса менеджера (ГОСТ, раздел 4 «Вердикт») ---------- */
.op2-verdict{position:relative;overflow:hidden;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin:12px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.op2-verdict::before{content:"";position:absolute;inset:0;background:var(--amber);opacity:.10;pointer-events:none;}
.op2-verdict.op2-good::before{background:var(--green);}
.op2-verdict__word{font-family:var(--font-display);font-weight:600;font-size:17px;letter-spacing:.01em;position:relative;}
.op2-verdict__sub{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-top:4px;position:relative;}
.op2-verdict__lever{text-align:right;position:relative;}
.op2-verdict__lever .op2-k{font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);}
.op2-verdict__lever .op2-v{font-family:var(--font-mono);font-size:25px;font-weight:600;line-height:1.05;font-variant-numeric:tabular-nums;}
.op2-verdict__lever .op2-f{font-size:11px;color:var(--muted);margin-top:2px;}
/* 29.09, Влад: крупно - подтверждённые и «из них наймом», разбивка - мелкой строкой ниже (превью утверждено) */
.op2-vbig{display:flex;align-items:flex-end;gap:28px;flex-wrap:wrap;position:relative;}
.op2-vbig__n{font-family:var(--font-display);font-weight:600;font-size:32px;line-height:1;font-variant-numeric:tabular-nums;}
.op2-vbig__ok .op2-vbig__n{color:var(--tint-green);}
.op2-vbig__hire .op2-vbig__n{color:var(--tint-orange);}
.op2-vbig__cap{font-family:var(--font-display);font-weight:500;font-size:12.5px;letter-spacing:.02em;margin-top:6px;}
.op2-vbig__cap small{display:block;font-family:var(--font-mono);font-weight:400;font-size:11px;color:var(--muted);letter-spacing:0;margin-top:3px;}
.op2-vbig__sep{width:1px;align-self:stretch;background:var(--border-strong);}
.op2-verdict .op2-verdict__sub{margin-top:10px;}
.op2-verdict__sub b{color:var(--text);font-weight:500;}
/* 29.09: «Свободны сегодня/завтра» внутри плашки (вариант А превью) - строка: крупные цифры | свободные | «Без машины» */
.op2-vmain{flex:1;min-width:0;position:relative;}
.op2-vrow{display:flex;align-items:center;gap:26px;flex-wrap:wrap;}
.op2-vrow .op2-verdict__lever{margin-left:auto;}
.op2-vfree{display:flex;flex-direction:column;gap:6px;}
.op2-vfd{display:flex;align-items:baseline;gap:10px;cursor:pointer;padding:3px 8px;margin:0 -8px;border-radius:8px;}
.op2-vfd:hover,.op2-vfd.op2-open{background:var(--bg3);}
.op2-vfd__k{font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);min-width:150px;}
.op2-vfd__n{font-family:var(--font-mono);font-size:20px;font-weight:600;line-height:1;min-width:26px;text-align:right;font-variant-numeric:tabular-nums;}
.op2-vfd__n.op2-zero{color:var(--muted);}
.op2-vfd__by{font-size:12px;color:var(--muted);}
.op2-vfd__by b{color:var(--text);font-weight:500;font-family:var(--font-mono);}
.op2-vfree-list{margin-top:10px;padding-top:8px;border-top:1px solid var(--border);font-size:12px;color:var(--muted);line-height:1.7;position:relative;}
.op2-vfree-list .op2-gos{font-family:var(--font-mono);color:var(--text);margin-right:8px;}
/* 30.09: цвет типа машины в «Свободны» - трал / борт / прикрытие */
.op2-t-tral{color:var(--tint-blue);}.op2-t-bort{color:var(--tint-purple);}.op2-t-cover{color:var(--tint-amber);}
@media (max-width:820px){.op2-vrow .op2-verdict__lever{margin-left:0;text-align:left;}.op2-vrow .op2-vbig__sep{display:none;}}

/* ---------- свободные машины сегодня/завтра ---------- */

/* ---------- таблицы: вариант «Рейс» (превью 12.09, вариант 3 - Влад: «точно так же, как в превью») ----------
   table-layout:fixed + colgroup (в JS, сумма 1180 = ноутбук с меню) - горизонтального скролла нет,
   на широком экране колонки растут пропорционально. Нефильтруемые ячейки в 2-3 строки. */
.op2-tblwrap{background:var(--bg2);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-top:12px;}
/* шапка таблицы липнет к странице - обёртка не прокручиваемая (clip), прокрутка только когда таблица шире (stickyHeadSync_) */
.op2-tblwrap.op2-x{overflow:clip;}
.op2-tblwrap.op2-x.op2-x-on{overflow:hidden;overflow-x:auto;}
/* «Примечание» (25.09) - видна при ширине таблицы от 1400px (сумма базовых колонок 1180 +
   200 под примечание + запас), см. noteCell_ в order-plan-v2.js. Ниже - колонки нет вовсе
   (col/th/td display:none), остальные колонки не сжимаются. */
.op2-tblwrap{container-type:inline-size;}
.op2-tbl .op2-notecol{display:none;}
@container (min-width:1400px){
  .op2-tbl col.op2-notecol{display:table-column;}
  .op2-tbl th.op2-notecol,.op2-tbl td.op2-notecol{display:table-cell;}
}
.op2-note{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;line-height:16px;font-size:12px;color:var(--muted);white-space:pre-line;}
table.op2-tbl{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0;font-size:12.5px;}
.op2-tbl th{position:sticky;top:var(--op2-th-top,0px);z-index:5;background:var(--bg2);text-align:left;padding:9px 8px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border);white-space:nowrap;overflow:hidden;cursor:pointer;user-select:none;}
.op2-tbl th .op2-s{opacity:.45;margin-left:3px;font-size:10px;}
.op2-tbl th.op2-on .op2-s{opacity:1;color:var(--text);}
.op2-tbl th.op2-num,.op2-tbl td.op2-num{text-align:right;}
.op2-tbl th.op2-c{text-align:center;}
.op2-tbl td{padding:5px 7px;vertical-align:middle;line-height:16px;overflow-wrap:anywhere;border-top:1px solid var(--border);}
.op2-tbl tbody tr{height:60px;transition:background .13s;}
.op2-tbl tbody tr:hover td{background:var(--bg-hover);}
.op2-tbl tbody tr.op2-open td{background:var(--bg3);}
/* полоска статуса 3px по левому краю строки - статус читается ещё до колонки */
.op2-tbl tbody tr td:first-child{box-shadow:inset 3px 0 0 var(--border-strong);padding-left:10px;}
.op2-tbl tbody tr.op2-st-ok td:first-child{box-shadow:inset 3px 0 0 var(--green);}
.op2-tbl tbody tr.op2-st-wait td:first-child{box-shadow:inset 3px 0 0 var(--amber);}
.op2-tbl tbody tr.op2-st-off td:first-child{box-shadow:inset 3px 0 0 var(--red);}
.op2-tbl tbody tr.op2-st-done td:first-child{box-shadow:inset 3px 0 0 var(--blue);}
/* № заявки - главный якорь и у менеджера, и у логиста (в Google-листе был крупными цифрами) */
.op2-no{font-family:var(--font-display);font-weight:600;font-size:19px;letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text);display:block;}
.op2-tbl tr.op2-st-off .op2-no{text-decoration:line-through;color:var(--muted);}
/* Значок договора (22.09, план plans/2026-09-22-contract-lifecycle-and-equipment-type-swap.md,
   превью одобрено Владом) - под номером заявки, та же ячейка. Зелёный - актуален (конвенция
   проекта: зелёный = «всё в порядке»), красный - устарел (мигание САМОЙ СТРОКИ - см.
   .op2-contract-stale выше, здесь только цвет значка). Кликабелен - см. NAV_SEL/обработчики
   в JS (reopenContractPdf_). */
.op2-contract{display:inline-flex;align-items:center;justify-content:center;width:19px;height:19px;
  border-radius:5px;margin-top:5px;cursor:pointer;}
.op2-contract svg{width:11px;height:11px;}
.op2-contract.op2-cok{background:rgba(29,158,117,.18);color:var(--tint-green);}
.op2-contract.op2-cstale{background:rgba(226,75,74,.22);color:var(--tint-red);}
.op2-tbl tr.op2-st-off td{color:var(--muted);}
/* отбой, который логист ещё не принял: строка мигает, пока не нажмёт «принять».
   ГОСТ, запрет №9: мигание привязано к незакрытому состоянию и гаснет само.
   21.09, Влад: «мигание есть в коде, но незаметно» - было чистое opacity (1 -> .55),
   слишком мягко на фоне уже статичной красной полоски слева у отбоя. Заменено на
   пульсацию ФОНОМ красным, тот же приём и та же длительность/кривая, что уже даёт
   заметный пульс новой заявке (op2NewPulse ниже, зелёным) - только цвет роли «отбой». */
.op2-tbl tbody tr.op2-unack{animation:op2OtBlink 1.6s ease-in-out infinite;}
@keyframes op2OtBlink{0%,100%{background:rgba(226,75,74,.16);}50%{background:transparent;}}
/* Договор устарел (22.09) - заявка изменилась после печати. Тот же пульс-фон/тайминг, что
   уже у отбоя (op2OtBlink) - переиспользуем keyframe, не заводим новый ради того же самого
   визуального языка. Левую полоску статуса (op2-st-ok/off/...) НЕ трогаем - у неё уже есть
   своё значение (статус заявки), путать со «договор устарел» не нужно, значка под номером
   и мигания фона достаточно. */
.op2-tbl tbody tr.op2-contract-stale{animation:op2OtBlink 1.6s ease-in-out infinite;}
.op2-tbl tbody tr.op2-new-halo{animation:op2Halo .3s var(--ease-out-soft) 1;}
@keyframes op2Halo{0%{background:rgba(29,158,117,.16);}100%{background:transparent;}}
.op2-tbl tbody tr.op2-ch-halo{animation:op2HaloB .3s var(--ease-out-soft) 1;}
@keyframes op2HaloB{0%{background:rgba(55,138,221,.16);}100%{background:transparent;}}
/* Влад 12.09 (вечер): «новая заявка - тоже зелёное мигание, логист должен принять» - по
   аналогии с отбоем (op2-unack выше), зелёным и БЕЗ авто-угасания по времени - гаснет только
   когда кто-то нажмёт «Принять» (needsAccept_ в JS решает состояние, не таймер). */
.op2-tbl tbody tr.op2-new-unack{animation:op2NewPulse 1.6s ease-in-out infinite;}
@keyframes op2NewPulse{0%,100%{background:rgba(29,158,117,.16);}50%{background:transparent;}}
.op2-tbl tfoot td{border-top:1px solid var(--border-strong);background:var(--bg3);padding:9px 10px;color:var(--muted);font-size:12px;}
.op2-tbl tfoot td.op2-num{color:var(--text);font-family:var(--font-mono);font-weight:600;font-size:13px;white-space:nowrap;}
/* 22.09, Влад: «три цифры внизу - зелёным подтверждённых, жёлтым не подтверждённых, красным
   отбой» - три суммы вместо одной общей, цвет = цвет статуса, как везде в таблице. */
.op2-tbl tfoot td.op2-mfoot{overflow:hidden;text-overflow:ellipsis;}
.op2-mfoot-n{margin-left:12px;}
.op2-mfoot-n:first-child{margin-left:0;}
.op2-mfoot-ok{color:var(--tint-green);}
.op2-mfoot-nz{color:var(--tint-amber);}
.op2-mfoot-ot{color:var(--tint-red);}
.op2-ell{overflow:hidden;text-overflow:ellipsis;}
/* фильтруемые колонки - один вид данных */
.op2-tbl .op2-person{display:block;overflow:hidden;text-overflow:ellipsis;}
.op2-time{font-family:var(--font-mono);font-size:12.5px;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums;}
.op2-time.op2-ask{font-family:var(--font-body);font-size:11.5px;font-weight:500;}
.op2-ask{color:var(--tint-amber);}
.op2-tbl td.op2-tech{font-size:12.5px;}
.op2-tbl td.op2-cust{font-size:12px;line-height:15px;hyphens:auto;overflow-wrap:break-word;}
/* 03.10: согласованный постоплатник - синий заказчик (отметка на юрлице в Справочниках) */
.op2-tbl td.op2-cust.op2-cust-pp{color:var(--blue);}
.op2-money{font-family:var(--font-mono);font-size:12.5px;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums;}
/* Светофор факт/прайс (22.09, admin-only, plans/2026-09-22-order-price-traffic-light.md) -
   те же токены цвета, что и у op2-mrg.op2-good/op2-bad чуть ниже, своя пара классов, чтобы
   не путать семантику "маржа наёмника" и "факт vs авторасчёт калькулятора". */
.op2-money.op2-price-good{color:var(--tint-green);}
.op2-money.op2-price-warn{color:var(--tint-amber);}
.op2-money.op2-price-bad{color:var(--tint-red);font-weight:600;}
.op2-money.op2-price-alarm::before{content:"!";display:inline-block;margin-right:4px;font-weight:700;}
/* маржа наёмника - второй строкой под ценой (Влад 21.09, превью вариант A): тот же моно,
   мельче; цвет только у процента по порогу 23% (зелёный/красный), сумма остаётся белой */
.op2-mrg{display:block;font-family:var(--font-mono);font-size:11px;font-weight:600;line-height:15px;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:.02em;cursor:help;}
.op2-mrg.op2-good{color:var(--tint-green);}
.op2-mrg.op2-bad{color:var(--tint-red);}
/* маршрут: город жирнее, улица muted, регион в title */
.op2-rt{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:16px;}
.op2-rt .op2-arr{color:var(--muted);margin-right:3px;}
.op2-rt b{font-weight:600;color:var(--text);}
.op2-rt .op2-rs{color:var(--muted);}
/* «Ссылка на Yandex» вместо сырого текста URL (Влад 13.09: «чисто эстетически», три правки
   того же дня - буква «Я» -> «Ссылка на координату Yandex» -> убрано «координату»): «Ссылка
   на» серым, «Y» красным, «andex» жирным белым. НЕ scoped к .op2-rt (14.09: тот же значок
   нужен и в дровере заявки, «Погрузка»/«Выгрузка» - не только в таблице) - self-contained. */
.op2-maplink{color:var(--muted);text-decoration:none;}
.op2-maplink:hover{text-decoration:underline;}
.op2-maplink .op2-maplink-y{color:var(--tint-red);font-weight:700;}
.op2-maplink b{font-weight:600;color:var(--text);}
/* груз: наименование над габаритом */
.op2-cg{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;line-height:16px;}
.op2-gab{display:block;line-height:16px;font-size:12px;}
.op2-gab .op2-neg{color:var(--tint-amber);font-weight:600;}
.op2-gab .op2-gb{color:var(--muted);}
.op2-gab .op2-dm{color:var(--muted);font-family:var(--font-mono);font-size:11px;}
/* машина: госномер / водитель / источник */
.op2-ln{display:flex;align-items:center;gap:6px;line-height:18px;min-height:18px;}
.op2-ln>*{flex-shrink:0;}
.op2-plate{font-family:var(--font-mono);font-size:13px;font-weight:500;letter-spacing:.01em;white-space:nowrap;color:var(--text);}
.op2-plate.op2-ok{color:var(--tint-green);}
.op2-plate.op2-off{color:var(--tint-red);}
.op2-plate.op2-was{color:var(--muted);text-decoration:line-through;}
/* Автостатус задания через бота (пилот «Длинномеры», 22.09) - без класса = белый/не
   отправлено (в тёмной теме это и есть var(--text)), дальше жёлтый/зелёный/красный.
   Красный отдельным классом от .op2-off - тот означает отбой по машине, разный смысл. */
.op2-plate.op2-bot-sent{color:var(--tint-amber);}
.op2-plate.op2-bot-accepted{color:var(--tint-green);}
.op2-plate.op2-bot-declined{color:var(--tint-red);}
.op2-plate[title]{cursor:help;}
.op2-tbl .op2-drv{display:block;line-height:16px;font-size:12.5px;color:var(--text);}
.op2-tbl .op2-drv.op2-dim{color:var(--muted);}
.op2-src{display:block;line-height:16px;font-size:11.5px;color:var(--muted);}
/* «Где машина» - точная копия .rh-omni из files/index.html (Планировка, Omnicomm-
   телематика). ЗАСКОУПЛЕНО под #page-order-plan - order-plan-v2.css грузится ОДНИМ <link>
   на весь SPA (project_preview_css_class_global_collision_gotcha в памяти проекта -
   неймспейс-коллизия классов между файлами уже ловили один раз, здесь та же ловушка
   исключена явным скоупом, а не совпадением имён). */
#page-order-plan .op2-src .rh-omni{margin-left:4px;}
/* 22.09, Влад: значок в Задании выше, чем в Планировке - сравнил в пикселях (getBoundingClientRect):
   было 20px против 13.5px там. Разгадка - НЕ разные размеры значка (padding/font-size/border
   байт-в-байт совпадали), а разное line-height ОКРУЖЕНИЯ: в Планировке .rh1 задаёт line-height:1
   на весь ряд, здесь значок сидит прямо в <td> с line-height:16px от .op2-tbl - без своего
   line-height значок наследовал чужую высоту строки. Фикс - задать line-height ПРЯМО на самом
   значке, чтобы больше не зависеть от того, в какой ячейке/таблице он окажется. */
#page-order-plan .rh-omni{display:inline-flex;align-items:center;gap:4px;padding:1px 7px;border-radius:10px;
  font-family:var(--font-mono);font-size:9.5px;font-weight:600;line-height:1;white-space:nowrap;cursor:pointer;vertical-align:1px;}
#page-order-plan .rh-omni i{width:5px;height:5px;border-radius:50%;flex:none;display:block;}
#page-order-plan .rh-omni.live{background:rgba(55,138,221,.16);border:1px solid rgba(55,138,221,.4);color:var(--tint-blue);}
#page-order-plan .rh-omni.live i{background:#378ADD;animation:opRhOmniBlink 1.3s ease-in-out infinite;}
#page-order-plan .rh-omni.idle{background:rgba(239,159,39,.14);border:1px solid rgba(239,159,39,.4);color:var(--tint-amber);}
#page-order-plan .rh-omni.idle i{background:#EF9F27;animation:opRhOmniHazard 1s step-end infinite;}
#page-order-plan .rh-omni.off{background:rgba(139,137,128,.12);border:1px solid rgba(139,137,128,.3);color:var(--muted);opacity:.75;}
#page-order-plan .rh-omni.off i{background:#8b8980;}
@keyframes opRhOmniBlink{0%,100%{opacity:1;}50%{opacity:.25;}}
@keyframes opRhOmniHazard{0%,100%{opacity:1;}50%{opacity:.15;}}
@media(prefers-reduced-motion:reduce){#page-order-plan .rh-omni i{animation:none;}}
.op2-tag{display:inline-block;font-family:var(--font-mono);font-size:9.5px;font-weight:600;letter-spacing:.08em;line-height:14px;padding:0 4px;border-radius:4px;margin-right:4px;vertical-align:1px;white-space:nowrap;}
.op2-tag.op2-tg-hire{color:var(--tint-blue);background:rgba(55,138,221,.16);}
.op2-tag.op2-tg-own{color:var(--muted);background:var(--bg4);}
.op2-tag.op2-tg-role{color:var(--muted);background:var(--bg4);letter-spacing:.04em;margin:0 0 0 4px;}
.op2-sub{display:block;line-height:16px;font-size:12px;color:var(--tint-amber);}
.op2-sub .op2-plate{font-size:12px;color:var(--tint-amber);}
.op2-sub .op2-arr{color:var(--muted);}
/* 30.09: рейсы одной машины - поле в форме, таблица ходок, подпись под машиной */
.op2-trips-n{font-family:var(--font-mono);font-size:15px;font-weight:600;min-width:34px;text-align:center;font-variant-numeric:tabular-nums;}
.op2-tripsbox{margin-top:8px;}
.op2-trips-tbl{width:100%;border-collapse:collapse;font-size:13px;}
.op2-trips-tbl th{text-align:left;font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);font-weight:500;padding:4px 6px;border-bottom:1px solid var(--border);}
.op2-trips-tbl td{padding:4px 6px;border-bottom:1px solid var(--border);}
.op2-trips-tbl input{width:96px;padding:5px 8px;}
.op2-trips-tbl input.op2-trips-ed{border-color:var(--amber);color:var(--tint-amber);}
.op2-trips-no{font-family:var(--font-mono);color:var(--muted);width:44px;}
.op2-sub.op2-trip{color:var(--tint-blue);}
/* 01.10: черновик формы - «Есть несохранённая заявка» и «Закрыть без сохранения?» */
.op2-draftbar,.op2-closeguard{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 14px;margin:0 0 12px;border-radius:10px;font-size:13px;}
.op2-draftbar{background:rgba(125,185,238,.10);border:1px solid rgba(125,185,238,.35);}
.op2-closeguard{background:rgba(239,159,39,.12);border:1px solid var(--amber);}
.op2-draftbar b,.op2-closeguard b{font-weight:600;}
.op2-draftbar-acts{margin-left:auto;display:inline-flex;gap:8px;}
/* 30.09: дополнительные адреса погрузки/выгрузки */
/* подпись поля тянется, кнопки «По месту» и «+ Ещё …» стоят рядом у правого края (30.09, Влад: «разъехались») */
.op2-lbl-flex > span:first-child{flex:1;min-width:0;}
.op2-xadd{text-transform:none;letter-spacing:normal;font-weight:600;font-size:11px;padding:3px 10px;border-radius:999px;border:1px dashed var(--amber);background:transparent;color:var(--tint-amber);cursor:pointer;white-space:nowrap;flex:none;}
.op2-xadd:hover{background:rgba(239,159,39,.12);}
.op2-xadd[disabled]{opacity:.4;cursor:default;}
.op2-xpwrap[hidden]{display:none;}
.op2-xpwrap{display:flex;flex-direction:column;gap:10px;}
.op2-xpt{border-left:2px solid var(--amber);padding-left:10px;}
.op2-xpt-t{color:var(--tint-amber);}
.op2-xpt-ops{margin-left:auto;display:inline-flex;gap:4px;}
.op2-xpt-op{width:24px;height:22px;border-radius:6px;border:1px solid var(--border-strong);background:var(--bg3);color:var(--muted);cursor:pointer;font-size:12px;line-height:1;padding:0;}
.op2-xpt-op:hover:not([disabled]){color:var(--text);}
.op2-xpt-op[disabled]{opacity:.35;cursor:default;}
.op2-xpt-rm:hover:not([disabled]){color:var(--tint-red);border-color:var(--tint-red);}
.op2-xpt-contact{margin-top:6px;}
.op2-xpmore{display:inline-block;margin:2px 6px 0 0;padding:0 6px;border-radius:5px;background:rgba(125,185,238,.14);color:var(--tint-blue);font-size:11px;font-weight:600;white-space:nowrap;}
/* 18.09, «Перенести» - подпись под госномером/статусом на обеих строках (клон .op2-sub,
   свой цвет: у старой заявки - "ушла" (красноватый оттенок ГОСТа), у новой - "пришла"
   (зелёный) - тот же принцип цвета, что op2-tg-hire/op2-plate.op2-ok уже используют для
   "откуда/куда" в других местах этого файла, не новый акцент). Кликабельная - переход к
   связанной заявке (jumpToOrder_). */
.op2-sub.op2-transfer{cursor:pointer;background:none;border:0;padding:0;font:inherit;text-align:left;display:block;}
.op2-sub.op2-transfer:hover{text-decoration:underline;}
.op2-sub.op2-transfer-out{color:var(--tint-red);}
.op2-sub.op2-transfer-in{color:var(--tint-green);}
/* «новое» - см. isNewWeek_() в JS, статичный бейдж (НЕ анимация - будет висеть на многих
   строках одновременно всю неделю, мигание такой плотности било бы по глазам сильнее, чем
   помогало) рядом с номером заявки, пока не пройдёт 7 дней с создания. Та же приглушённая
   заливка своим hue, что уже даёт .op2-tag.op2-tg-hire/op2-tg-own - не новый визуальный
   акцент, просто ещё один цвет тега в уже утверждённой ГОСТом семье. */
.op2-tag.op2-tg-new{color:var(--tint-green);background:rgba(29,158,117,.16);margin-left:5px;vertical-align:2px;}
/* плитка машины: клик - пикер, зажать - перемещение (ГОСТ, раздел 6) */
.op2-veh{display:block;cursor:pointer;border-radius:8px;padding:2px 6px;margin:-2px -6px;transition:background .13s;touch-action:none;}
.op2-veh:hover{background:var(--bg4);}
/* кнопки логиста */
.op2-dok{width:22px;height:22px;flex:0 0 22px;margin:-3px 0;border-radius:50%;border:1px solid var(--border-strong);background:transparent;color:var(--muted);font-size:12px;line-height:20px;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:border-color .13s,color .13s,background .13s;}
.op2-dok:hover{border-color:var(--green);color:var(--tint-green);}
.op2-dok.op2-on{background:rgba(29,158,117,.18);border-color:var(--green);color:var(--tint-green);}
.op2-slot{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:26px;border:1.5px dashed var(--border-strong);border-radius:10px;background:transparent;color:var(--muted);font-size:12px;cursor:pointer;padding:0 8px;transition:border-color .13s,color .13s;}
.op2-slot:hover{border-color:var(--green);color:var(--text);}
.op2-slot .op2-nd{margin:0;flex:0 0 6px;}
.op2-slot.op2-ot{border-style:solid;border-color:var(--red);color:var(--tint-red);}
.op2-slot.op2-ot:hover{background:rgba(226,75,74,.10);color:var(--tint-red);}
.op2-slot.op2-new{border-style:solid;border-color:var(--green);color:var(--tint-green);}
.op2-slot.op2-new:hover{background:rgba(29,158,117,.12);color:var(--tint-green);}
.op2-mini{height:20px;border:1px solid var(--border-strong);border-radius:7px;background:transparent;color:var(--muted);font-size:11px;padding:0 7px;cursor:pointer;margin-left:auto;white-space:nowrap;}
.op2-mini:hover{color:var(--text);}
/* статус: знак + короткое слово одним цветом; точка «под данные» перед знаком */
.op2-tbl td.op2-stc{padding-left:4px;padding-right:4px;}
.op2-st{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:14px;border-radius:6px;}
.op2-st .op2-g{font-size:14px;line-height:16px;display:flex;align-items:center;gap:4px;}
.op2-st .op2-g .op2-nd{margin:0;}
.op2-st .op2-g .op2-sq{display:inline-block;width:10px;height:10px;border-radius:2px;background:currentColor;}
.op2-st .op2-w{font-size:10.5px;font-weight:600;white-space:nowrap;}
.op2-st.op2-ok{color:var(--tint-green);}
.op2-st.op2-wait{color:var(--tint-amber);}
.op2-st.op2-off{color:var(--tint-red);}
.op2-st.op2-done{color:var(--tint-blue);}
/* быстрый статус у менеджера: клик по статусу - варианты прямо в строке */
.op2-mgr-tbl td.op2-stc{cursor:pointer;}
.op2-mgr-tbl td.op2-stc:hover .op2-st{outline:1px solid var(--border-strong);}
/* 13.10: своя заявка логиста - статус кликабелен и в таблице логиста */
.op2-tbl td.op2-stc-own{cursor:pointer;}
.op2-tbl td.op2-stc-own:hover .op2-st{outline:1px solid var(--border-strong);}
.op2-ttype{display:inline-block;background:var(--bg3);border:1px solid var(--border);border-radius:6px;padding:2px 7px;font-size:11px;color:var(--text);}
.op2-code{font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;}
/* Влад 12.09: одобренный вариант «Цветная фамилия» (превью person_columns_variants) - колонки
   «Мен.»/«Лог.». Цвет - inline style по человеку (PERSON_COLOR_ в JS), тут только форма. */
.op2-person{font-weight:600;font-size:12.5px;white-space:nowrap;color:var(--text);}
/* «Лог.» в таблице логиста - клик открывает пикер смены логиста (openLogPop); в таблице
   менеджера класс не ставится (logCodeCell_ без clickable), там это просто текст. */
.op2-logpick,.op2-mgrpick{cursor:pointer;}
.op2-logpick:hover .op2-person,.op2-mgrpick:hover .op2-person{text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px;}
/* чип статуса - поповер смены статуса у менеджера, пометка «новая», карточка */
.op2-st-chip{font-family:var(--font-mono);font-size:9.5px;text-transform:uppercase;letter-spacing:.04em;padding:2px 6px;border-radius:5px;background:var(--bg3);color:var(--muted);}
.op2-st-chip.op2-ok{background:rgba(29,158,117,.15);color:var(--tint-green);}
.op2-st-chip.op2-nz{background:rgba(239,159,39,.15);color:var(--tint-amber);}
.op2-st-chip.op2-ot{background:rgba(226,75,74,.15);color:var(--tint-red);}
.op2-st-chip.op2-done{background:rgba(55,138,221,.15);color:var(--tint-blue);}
.op2-stpop{position:fixed;z-index:1600;display:none;flex-direction:column;gap:2px;padding:6px;overflow-y:auto;background:var(--bg3);border:1px solid var(--border-strong);border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.4),0 16px 32px rgba(0,0,0,.5);}
.op2-stpop.op2-open{display:flex;}
.op2-stpop button{display:flex;align-items:center;gap:10px;background:transparent;border:0;border-radius:6px;padding:7px 10px;color:var(--text);font-size:12px;text-align:left;cursor:pointer;min-width:200px;}
.op2-stpop button:hover{background:var(--bg-hover);}
.op2-stpop button.op2-cur{opacity:.55;cursor:default;}
.op2-stpop button .op2-dim{margin-left:auto;}
/* «под данные» - мигающая точка состояния (ГОСТ, запрет №9, расширение от 30.08) */
/* 18.09, «Перенести» - поповер выбора даты, ТОТ ЖЕ .op2-stpop каркас и та же вёрстка
   кнопок в столбик, что у смены статуса/логиста/менеджера (openStPop/openMgrPop/
   openLogPop) - никаких своих чипов/рядов, только заголовок сверху. Первый заход
   изобрёл отдельный op2-dp-row с чипами - Влад сверил с одобренным превью и справедливо
   заметил расхождение, править обратно на то же самое, чем поповер выглядел бы «как все». */
.op2-dp-title{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--muted);text-transform:uppercase;padding:6px 10px 4px;white-space:nowrap;}
.op2-nd{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--amber);margin-right:6px;vertical-align:middle;animation:op2NdBlink var(--op2-blink-tact) ease-in-out infinite;}
@keyframes op2NdBlink{0%,100%{opacity:1;}50%{opacity:.25;}}
.op2-dot-amber{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--amber);margin-right:6px;vertical-align:middle;}
.op2-tel{color:var(--text);}
.op2-tel:hover{color:var(--green);}
.op2-hire{font-family:var(--font-mono);font-size:9px;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:5px;background:rgba(55,138,221,.15);color:var(--tint-blue);display:inline-block;margin-bottom:2px;}

/* перетаскивание плитки машины: зажать 450 мс -> режим перемещения (ГОСТ, раздел 6) */
body.op2-moving{cursor:grabbing;user-select:none;}
body.op2-moving .op2-veh:not(.op2-lift){cursor:grabbing;}
.op2-veh.op2-lift{opacity:.35;}
.op2-log-body tr.op2-drop{background:rgba(29,158,117,.14)!important;outline:1px dashed var(--green);outline-offset:-1px;}
.op2-log-body tr.op2-drop td{color:var(--text);}
.op2-mvghost{position:fixed;z-index:1700;pointer-events:none;background:var(--bg4);border:1px solid var(--green);border-radius:10px;padding:6px 10px;box-shadow:0 12px 30px rgba(0,0,0,.5);display:flex;flex-direction:column;gap:2px;transform:rotate(-1.5deg);}
.op2-mvghost .op2-gos{font-family:var(--font-mono);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;}
.op2-mvghost .op2-drv{font-size:11px;color:var(--muted);}

/* ---------- поповер пикера машин ---------- */
.op2-pop{position:fixed;z-index:1600;width:380px;max-height:60vh;display:flex;flex-direction:column;background:var(--bg3);border:1px solid var(--border-strong);border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.4),0 16px 32px rgba(0,0,0,.5);opacity:0;transform:scale(.96);transform-origin:top left;pointer-events:none;transition:opacity .15s var(--ease-out-strong),transform .15s var(--ease-out-strong);}
.op2-pop.op2-open{opacity:1;transform:scale(1);pointer-events:auto;}
.op2-pop .op2-ph{padding:10px 10px 8px;border-bottom:1px solid var(--border);display:flex;gap:8px;align-items:center;}
.op2-pop .op2-ph input{flex:1;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:7px 10px;color:var(--text);height:32px;}
.op2-pop .op2-ph .op2-ctx{font-family:var(--font-mono);font-size:10px;color:var(--muted);white-space:nowrap;}
.op2-pop .op2-pb{overflow:auto;flex:1;padding:6px 0;}
.op2-pop .op2-sec{font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding:8px 12px 4px;display:flex;justify-content:space-between;}
.op2-pop .op2-sec .op2-ln{flex:1;height:1px;background:var(--border);align-self:center;margin:0 8px;}
.op2-pop .op2-vi{display:flex;align-items:center;gap:10px;min-height:40px;padding:0 12px;cursor:pointer;transition:background .13s;}
.op2-pop .op2-vi:hover{background:var(--bg4);}
.op2-pop .op2-vi.op2-sel{background:var(--bg4);box-shadow:inset 0 0 0 1px var(--green);}
.op2-pop .op2-vi.op2-off{cursor:default;color:var(--muted);}
.op2-pop .op2-vi.op2-off:hover{background:transparent;}
.op2-pop .op2-vi .op2-gos{font-family:var(--font-mono);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;width:118px;flex:none;}
.op2-pop .op2-vi.op2-off .op2-gos{color:var(--muted);}
.op2-pop .op2-vi .op2-ty{font-size:11px;color:var(--muted);width:78px;flex:none;}
.op2-pop .op2-vi .op2-rt{margin-left:auto;font-size:11px;color:var(--muted);text-align:right;white-space:nowrap;}
.op2-pop .op2-vi .op2-rt b{color:var(--text);font-weight:500;}
.op2-pop .op2-vi.op2-act .op2-gos{font-family:var(--font-body);font-weight:500;width:auto;}
.op2-pop .op2-vi.op2-hired-item{border-top:1px solid var(--border);margin-top:6px;color:var(--text);}
.op2-pop .op2-vi.op2-hired-item .op2-gos{width:auto;font-family:var(--font-body);font-size:12.5px;font-weight:500;}
.op2-pop .op2-pf{padding:10px;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:flex-end;align-items:center;flex-wrap:wrap;}
.op2-pop .op2-pf .op2-cur{margin-right:auto;font-size:11px;color:var(--muted);}
.op2-pop .op2-pf .op2-cur b{color:var(--text);font-weight:500;}
/* второй шаг пикера - наёмник */
.op2-pop .op2-hstep{padding:10px 12px 4px;display:none;flex-direction:column;gap:8px;overflow:auto;}
.op2-pop.op2-hired .op2-pb{display:none;}
.op2-pop.op2-hired .op2-hstep{display:flex;}
/* карточка наёмника - панель справа во всю высоту (05.10, превью examples/preview-hired-ergonomics.html) */
.op2-pop .op2-hhead{display:none;}
.op2-pop.op2-hired{top:16px!important;bottom:16px;left:auto!important;right:16px;width:480px;max-width:calc(100vw - 32px);max-height:none;border-radius:16px;transform-origin:right center;}
.op2-pop.op2-hired .op2-ph{display:none;}
.op2-pop.op2-hired .op2-hhead{display:block;position:relative;padding:16px 46px 12px 18px;border-bottom:1px solid var(--border);}
.op2-hhead .op2-hh-eb{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);}
.op2-hhead .op2-hh-t{font-size:15px;font-weight:600;margin-top:3px;}
.op2-hhead .op2-hh-s{font-size:12px;color:var(--muted);margin-top:2px;}
.op2-hhead .op2-hh-x{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;}
.op2-hhead .op2-hh-x:hover{color:var(--text);border-color:var(--border-strong);}
.op2-pop.op2-hired .op2-hstep{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:14px 18px 10px;gap:10px;}
.op2-hsec-t{font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:6px;}
/* статус перевозчика - плашка в строке и меню */
.op2-csline{display:block;margin-top:2px;}
.op2-cspill{display:inline-flex;align-items:center;gap:3px;border:0;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:600;line-height:16px;white-space:nowrap;font-family:var(--font-body);}
button.op2-cspill{cursor:pointer;}
button.op2-cspill:hover{filter:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);}
.op2-cspill.op2-cs-neg{color:#1a1204;background:var(--amber);}
.op2-cspill.op2-cs-ok{color:#fff;background:var(--green);}
.op2-cspill.op2-cs-go{color:#fff;background:var(--blue);}
.op2-cspill.op2-cs-no{color:#fff;background:var(--red);}
.op2-csdot{width:8px;height:8px;border-radius:50%;flex:none;}
.op2-csdot.op2-cs-neg{background:var(--amber);}
.op2-csdot.op2-cs-ok{background:var(--green);}
.op2-csdot.op2-cs-go{background:var(--blue);}
.op2-csdot.op2-cs-no{background:var(--red);}
.op2-cssep{height:1px;background:var(--border);margin:4px 2px;}
.op2-stpop button.op2-csdel{color:var(--red);}

/* ---------- поля формы ---------- */
.op2-fld{display:flex;flex-direction:column;gap:4px;}
.op2-fld label{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
/* быстрая кнопка «База» у адреса погрузки/выгрузки - только у логиста (Влад 12.09: «даже
   просто должна быть кнопка... нажал быстро и всё», «это только логистов»). Лейбл-обёртка
   .op2-lbl-flex - точечно, а не через общий «.op2-fld label» - у других лейблов формы (напр.
   «Под данные»/«Наличные») внутри лежит чекбокс + текст, и space-between развалил бы их
   на разные края строки; здесь трогаем только адресную пару. Кнопка - обычный текст, не
   наследует uppercase/letter-spacing лейбла, чтобы «База» читалась как кнопка, не как заголовок. */
.op2-lbl-flex{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.op2-addr-base{text-transform:none;letter-spacing:normal;font-weight:600;font-size:11px;color:var(--muted);background:transparent;border:1px dashed var(--border-strong);border-radius:999px;padding:3px 10px;flex:none;transition:border-color .13s,color .13s;}
.op2-addr-base:hover{border-color:var(--green);color:var(--green);}
.op2-fld input,.op2-fld select,.op2-fld textarea{background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:8px 10px;color:var(--text);min-height:34px;width:100%;}
.op2-fld input:focus,.op2-fld select:focus,.op2-fld textarea:focus{outline:none;border-color:var(--blue);}
.op2-fld input[type=date]{color-scheme:dark;}
.op2-fld .op2-hint{font-size:11px;color:var(--muted);}
.op2-fld .op2-hint.op2-warn{color:var(--tint-amber);}
.op2-fld .op2-hint.op2-okc{color:var(--muted);font-family:var(--font-mono);font-size:10.5px;}
/* 18.09: дата существующей заявки - заблокирована (см. renderForm, editing), тот же
   box-shape что и .op2-fld input, но explicit "неактивно" - штриховая рамка, курсор
   not-allowed, приглушённый текст. */
.op2-locked{background:var(--bg2);border:1px dashed var(--border);border-radius:8px;padding:8px 10px;min-height:34px;display:flex;align-items:center;gap:6px;color:var(--muted);cursor:not-allowed;box-sizing:border-box;}
.op2-lock-ic{font-size:11px;opacity:.7;}
.op2-fld .op2-cb{min-height:0;width:auto;margin-right:6px;}
.op2-g2{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;}
.op2-margin{display:flex;justify-content:space-between;align-items:baseline;background:var(--bg2);border:1px solid var(--border);border-radius:8px;padding:8px 10px;}
.op2-margin .op2-k{font-size:11px;color:var(--muted);}
.op2-margin .op2-v{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:13px;}
.op2-margin .op2-v.op2-pos{color:var(--tint-green);}
.op2-margin .op2-v.op2-neg{color:var(--tint-red);}
.op2-cstat{display:flex;gap:4px;flex-wrap:wrap;}
/* Реестр партнёра в форме наёмника (24.09) - строки чипов «выбрать, а не печатать»; сами чипы - .op2-chip. */
.op2-hfleet{display:flex;flex-direction:column;gap:6px;margin:0 0 12px;}
.op2-hfleet-row{display:grid;grid-template-columns:118px 1fr;gap:6px;align-items:start;}
.op2-hfleet-chips{display:flex;flex-wrap:wrap;gap:6px;}
.op2-hfleet-k{font-size:11px;color:var(--muted);padding-top:5px;}
.op2-cstat .op2-chip{padding:3px 8px;font-size:11px;}

/* ---------- тост (единственный канал обратной связи, ГОСТ раздел 4) ---------- */
.op2-toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,14px);opacity:0;z-index:1800;background:var(--bg4);border:1px solid var(--border-strong);border-radius:10px;padding:9px 14px;font-size:12.5px;display:flex;align-items:center;gap:12px;max-width:min(92vw,1100px);transition:opacity .32s ease,transform .32s var(--ease-out-strong);pointer-events:none;}
.op2-toast.op2-show{opacity:1;transform:translate(-50%,0);pointer-events:auto;}
.op2-toast .op2-tick{color:var(--tint-green);font-weight:600;}
.op2-toast .op2-warn{color:var(--tint-amber);font-weight:600;}
.op2-toast .op2-bad{color:var(--tint-red);font-weight:600;}
.op2-toast button{background:transparent;border:1px solid var(--border-strong);border-radius:6px;padding:4px 9px;color:var(--text);font-size:12px;white-space:nowrap;flex:none;}
.op2-toast button:hover{border-color:var(--green);color:var(--green);}
.op2-toast button:disabled{color:var(--muted);border-color:var(--border);cursor:default;}

/* ---------- шторка 760 (ГОСТ, раздел 4 «Шторка») ---------- */
.op2-scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .32s ease;z-index:1500;}
.op2-scrim.op2-open{opacity:1;pointer-events:auto;}
/* шторка - плавающая скруглённая панель с отступом от краёв экрана (перенос
   утверждённого превью 12.09: «закруглённая и воздушная, не прибита к краям»),
   шире прежней (960 вместо 760) - золотому сечению нужен простор, чтобы Сегодня/
   Завтра/иконка-календарь и Габарит/Негабарит помещались в одну строку без переноса */
.op2-drawer{position:fixed;top:16px;right:16px;bottom:16px;width:1040px;max-width:calc(100vw - 32px);background:var(--bg3);border:1px solid var(--border-strong);border-radius:16px;box-shadow:0 2px 6px rgba(0,0,0,.35),0 20px 50px rgba(0,0,0,.35);overflow:hidden;transform:translateX(calc(100% + 24px));transition:transform .38s var(--ease-overshoot);z-index:1501;display:flex;flex-direction:column;}
.op2-drawer.op2-open{transform:translateX(0);}
.op2-drawer .op2-dh{padding:18px 22px 12px;border-bottom:1px solid var(--border);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
.op2-drawer .op2-dh h3{margin:0;font-family:var(--font-display);font-size:14px;font-weight:600;}
.op2-drawer .op2-dh .op2-sub{color:var(--muted);font-size:12px;}
.op2-drawer .op2-dh .op2-x{margin-left:auto;background:var(--bg4);border:1px solid var(--border);border-radius:6px;padding:4px 9px;color:var(--text);font-size:12px;}
.op2-drawer .op2-dh .op2-x:hover{border-color:var(--green);color:var(--green);}
.op2-drawer .op2-db{overflow:auto;padding:6px 22px 22px;flex:1;}
.op2-drawer .op2-df{position:sticky;bottom:0;background:var(--bg3);border-top:1px solid var(--border);padding:12px 22px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.op2-drawer .op2-df .op2-del{margin-right:auto;background:transparent;border:0;color:var(--tint-red);font-size:12px;padding:6px 4px;}
.op2-drawer .op2-df .op2-del:hover{text-decoration:underline;}
.op2-cbar{background:var(--bg4);border:1px solid rgba(239,159,39,.35);border-radius:8px;padding:8px 12px;font-size:12px;margin:12px 0 0;display:flex;align-items:center;gap:10px;}
.op2-cbar b{color:var(--tint-amber);font-weight:600;}
.op2-cbar button{margin-left:auto;}
.op2-cbar.op2-pendbar{flex-wrap:wrap;}
.op2-cbar.op2-pendbar button{margin-left:0;}
.op2-cbar.op2-pendbar .op2-grow{flex:1 1 100%;}
.op2-sect{margin-top:18px;}
.op2-sect .op2-t{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding:0 0 8px;border-top:1px solid var(--border);padding-top:12px;}
.op2-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px;}
.op2-full{grid-column:1/-1;}
@media (max-width:820px){.op2-grid2{grid-template-columns:1fr;}.op2-g2{grid-template-columns:1fr;}.op2-cols{grid-template-columns:1fr;}}
.op2-seg{display:flex;gap:4px;align-items:center;flex-wrap:wrap;}
.op2-seg .op2-chip{padding:5px 11px;}
/* 21.09 - модификаторы типа техники («Коники» у длинномера, «8 осей»/«Раздвижение в
   ширину» у Faymonville, «Длинные аппарели» у трала) - перенос 1:1 утверждённого превью
   https://claude.ai/artifact/MRsjazcRwwjsx4yTonNR5q. Пунктирная рамка - тот же приём,
   что уже читается в проекте как «не основной вид» (.op2-eq-gone ниже) - здесь means «это
   не тип, а комплектация уже выбранного типа», сплошная при op2-on. [hidden] - у типов
   без модификаторов (Панелевоз/Тент/Машина прикрытия) строка не рисуется вообще. */
.op2-mods{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px;padding-top:8px;border-top:1px dashed var(--border);}
.op2-mods[hidden]{display:none;}
.op2-chip.op2-mod{border-style:dashed;}
.op2-chip.op2-mod.op2-on{border-style:solid;}
/* «Менеджеры» в тулбаре логиста (19.09) переиспользует .op2-seg (та же гармошка, что
   «От кого»/«Тип техники» выше), но в тулбаре чипы должны быть той же высоты, что
   соседние .op2-chip - паддинг формы (5px 11px) чуть крупнее под drawer. */
.op2-bar .op2-seg .op2-chip{padding:4px 10px;}
.op2-mgr-dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px;vertical-align:1px;}
.op2-timerow{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.op2-timerow input{width:92px;font-family:var(--font-mono);font-size:13px;text-align:center;}
.op2-stp{background:var(--bg2);border:1px solid var(--border);border-radius:8px;height:34px;width:34px;color:var(--text);flex:none;}
.op2-stp:hover{border-color:var(--border-strong);}
.op2-qk{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap;}
.op2-qk .op2-chip{font-family:var(--font-mono);}

/* форма менеджера/логиста - золотое сечение (перенос утверждённого превью 1:1,
   plans/2026-09-12-order-plan-v2-manager-form-redesign-port.md): «Когда и для
   кого» + «Откуда - куда» слева, «Что везём» + «Деньги» карточками справа,
   «Примечание» полной шириной под колонками. Значения (gap, padding) - те же,
   что в самом превью, не приблизительные. */
.op2-cols{display:grid;grid-template-columns:1.618fr 1fr;gap:20px;align-items:start;margin-top:18px;}
.op2-cols .op2-main>.op2-sect:first-child{margin-top:0;}
.op2-main .op2-grid2{margin-bottom:16px;}
.op2-main .op2-grid2:last-child{margin-bottom:0;}
.op2-side{display:flex;flex-direction:column;gap:14px;}
.op2-card{background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:14px 16px;}
.op2-card .op2-fld + .op2-fld,.op2-card .op2-fld + .op2-grid2,.op2-card .op2-grid2 + .op2-fld{margin-top:10px;}
.op2-card .op2-grid2{gap:10px;}
.op2-card .op2-sect{margin-top:0;}
.op2-card .op2-sect .op2-t{border-top:0;padding:0 0 10px;}

/* дата - иконка-календарь вместо всегда видимого <input type=date> (Влад 11.09) -
   сам input остаётся в DOM (скрыт визуально), showPicker() его открывает */
.op2-datewrap{position:relative;display:inline-flex;}
.op2-calbtn{width:34px;height:34px;border-radius:8px;background:var(--bg2);border:1px solid var(--border);color:var(--muted);display:flex;align-items:center;justify-content:center;flex:none;transition:border-color .13s,color .13s;}
.op2-calbtn:hover{border-color:var(--border-strong);}
.op2-calbtn.op2-on{border-color:var(--green);color:var(--green);}
.op2-calbtn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.op2-dt-hidden{position:absolute;inset:0;opacity:0;pointer-events:none;width:34px;height:34px;}

/* «Под данные» - единственная оставшаяся подсказка спрятана за точку (Влад 11.09:
   «оставь подсказку только по данные») */
.op2-nd-fld{position:relative;flex-direction:row;align-items:center;gap:0;}
.op2-info-dot{width:16px;height:16px;border-radius:50%;border:1px solid var(--border-strong);background:transparent;color:var(--muted);font-family:var(--font-mono);font-size:10px;display:inline-flex;align-items:center;justify-content:center;flex:none;margin-left:6px;transition:border-color .13s,color .13s;}
.op2-info-dot:hover,.op2-info-dot.op2-open{border-color:var(--blue);color:var(--blue);}
.op2-info-pop{position:absolute;left:0;top:calc(100% + 6px);z-index:20;width:280px;background:var(--bg4);border:1px solid var(--border-strong);border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,.4),0 16px 32px rgba(0,0,0,.5);padding:10px 12px;font-size:11.5px;color:var(--muted);line-height:1.55;opacity:0;transform:translateY(-4px) scale(.97);pointer-events:none;transition:opacity .15s var(--ease-out-strong),transform .15s var(--ease-out-strong);}
.op2-info-pop.op2-open{opacity:1;transform:none;pointer-events:auto;}

/* «Контакт заказчика» - скрыт за кнопкой, пока не нажали (Влад 11.09: «почти никто
   не вводит») - #op2-f-custcontact всегда в DOM (collectForm читает его безусловно),
   op2-collapsed только прячет визуально */
.op2-add-contact{display:flex;align-items:center;gap:6px;height:34px;border-radius:8px;border:1px dashed var(--border-strong);background:transparent;color:var(--muted);font-size:12px;padding:0 10px;width:100%;transition:border-color .13s,color .13s;}
.op2-add-contact:hover{border-color:var(--green);color:var(--green);}
.op2-add-contact svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;flex:none;}
/* op2-contact-ph - невидимый дублёр подписи, ТОЛЬКО чтобы кнопка «+Контакт заказчика»
   стояла на той же высоте, что инпут «Заказчик» рядом (у него есть подпись сверху,
   у голой кнопки без этого распорка съезжала выше - подмечено Владом 12.09) */
.op2-contact-ph{opacity:0;pointer-events:none;}
.op2-contact-fld:not(.op2-collapsed) .op2-add-contact,.op2-contact-fld:not(.op2-collapsed) .op2-contact-ph{display:none;}
.op2-contact-fld.op2-collapsed .op2-contact-lbl,.op2-contact-fld.op2-collapsed input,.op2-contact-fld.op2-collapsed .op2-hint{display:none;}

/* Повторить N раз сегодня (Влад 11.09: N одинаковых машин, интервал 30 мин/час, время каждой поправить сразу) */
.op2-rb-list{display:flex;flex-direction:column;gap:4px;margin-top:8px;} /* без своего скролла - список растёт во всю шторку (Влад 11.09: «окно длиннее») */
.op2-rb-row{display:flex;align-items:center;gap:8px;padding:5px 8px;background:var(--bg2);border:1px solid var(--border);border-radius:8px;}
.op2-rb-row .op2-rb-no{font-family:var(--font-mono);font-size:11px;color:var(--muted);width:22px;flex:none;}
.op2-rb-row input{width:70px;font-family:var(--font-mono);font-size:13px;text-align:center;background:transparent;border:1px solid var(--border);border-radius:6px;padding:4px 2px;color:var(--text);}
.op2-rb-row input:focus{border-color:var(--border-strong);}
.op2-rb-rm{margin-left:auto;flex:none;background:transparent;border:0;color:var(--muted);font-size:16px;line-height:1;width:22px;height:22px;border-radius:50%;cursor:pointer;}
.op2-rb-rm:hover{background:rgba(226,75,74,.14);color:var(--tint-red);}
.op2-rb-day{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:8px 0 2px;}
.op2-rb-row .op2-rb-stp{height:26px;width:34px;font-size:11px;border-radius:6px;}
.op2-rb-row .op2-rb-rm{margin-left:auto;}
.op2-rb-count{display:flex;align-items:center;gap:8px;}
.op2-rb-count .op2-rb-n{font-family:var(--font-mono);font-size:20px;font-weight:600;width:34px;text-align:center;}
.op2-sugg{position:relative;}
.op2-sugg .op2-list{position:absolute;left:0;right:0;top:100%;margin-top:4px;background:var(--bg4);border:1px solid var(--border-strong);border-radius:8px;z-index:5;display:none;overflow:hidden;max-height:260px;overflow-y:auto;}
.op2-sugg.op2-open .op2-list{display:block;}
.op2-sugg .op2-list .op2-sec{font-family:var(--font-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding:7px 10px 3px;}
.op2-sugg .op2-list .op2-it{padding:7px 10px;cursor:pointer;display:flex;justify-content:space-between;gap:10px;}
/* карточка груза в подсказках (Влад: «сделай красивее читабельнее») - две колонки, метрики моноширинным блоком справа */
.op2-sugg .op2-list .op2-it.op2-cargo-it{align-items:center;padding:9px 12px;gap:14px;}
.op2-cargo-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.op2-cargo-name{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.op2-cargo-sub{font-size:11px;color:var(--muted);text-transform:lowercase;}
.op2-cargo-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;flex:none;font-family:var(--font-mono);white-space:nowrap;}
.op2-cargo-w{font-size:13px;font-weight:600;color:var(--tint-amber);}
.op2-cargo-dims{font-size:11px;color:var(--muted);}
.op2-sugg .op2-list .op2-it:hover{background:var(--bg3);}
.op2-sugg .op2-list .op2-it .op2-m{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);}
.op2-kv{display:flex;justify-content:space-between;gap:16px;padding:7px 0;border-bottom:1px solid var(--border);font-size:12.5px;}
.op2-kv .op2-k{color:var(--muted);flex:none;}
.op2-kv .op2-v{text-align:right;font-weight:500;min-width:0;overflow-wrap:anywhere;}
.op2-vehcard{background:var(--bg2);border:1px solid var(--border);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;margin-top:8px;}
.op2-vehcard .op2-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.op2-vehcard .op2-top .op2-gos{font-family:var(--font-mono);font-size:15px;font-weight:600;}
.op2-vehcard .op2-top .op2-gos.op2-ok{color:var(--tint-green);} /* водитель подтвердил - как в таблице */
.op2-vehcard .op2-top .op2-by{margin-left:auto;font-size:11px;color:var(--muted);}
.op2-vehcard .op2-line{font-size:12.5px;display:flex;gap:14px;flex-wrap:wrap;}
.op2-vehcard .op2-line .op2-k{color:var(--muted);}
.op2-vehcard .op2-acts{display:flex;gap:8px;margin-top:4px;flex-wrap:wrap;}
.op2-vehcard .op2-line.op2-docs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.op2-vehcard .op2-line.op2-docs .op2-k{margin-right:4px;}
.op2-vehcard .op2-dl{padding:4px 9px;font-size:11.5px;}
.op2-vehcard .op2-dl.op2-soon{color:var(--muted);border-style:dashed;}
.op2-hist{list-style:none;margin:0;padding:0;}
.op2-hist li{display:flex;gap:10px;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px;}
.op2-hist li .op2-tm{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);width:110px;flex:none;}
.op2-hist li .op2-who{color:var(--text);font-weight:500;}

/* ---------- «Задание водителю» - модалка с готовым текстом ---------- */
.op2-dmod-scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:1800;display:none;align-items:center;justify-content:center;padding:20px;}
.op2-dmod-scrim.op2-open{display:flex;}
.op2-dmod{width:100%;max-width:600px;background:var(--bg2);border:1px solid var(--border-strong);border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.5);overflow:hidden;}
.op2-dmod .op2-dh{padding:16px 20px 10px;border-bottom:1px solid var(--border);display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
.op2-dmod .op2-dh h3{margin:0;font-family:var(--font-display);font-size:14px;font-weight:600;}
.op2-dmod pre{margin:0;padding:16px 20px;font-family:var(--font-body);font-size:13.5px;line-height:1.55;color:var(--text);white-space:pre-wrap;max-height:60vh;overflow:auto;}
.op2-dmod pre b{color:var(--muted);font-weight:600;font-size:11px;letter-spacing:.08em;}
.op2-dmod .op2-acts{display:flex;gap:8px;padding:12px 20px 16px;border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;}
.op2-dmod .op2-acts a.op2-ghost,.op2-dmod .op2-acts a.op2-dbtn{text-decoration:none;display:inline-flex;align-items:center;}
.op2-dmod .op2-acts .op2-hint{margin-left:auto;font-size:11px;color:var(--muted);}

/* ---------- легенда, служебное ---------- */
.op2-legend{color:var(--muted);font-size:12px;line-height:1.6;margin:10px 2px 0;}
.op2-legend i{font-style:normal;font-weight:600;}
.op2-legend .op2-lg{color:var(--tint-green);}
.op2-legend .op2-la{color:var(--tint-amber);}
.op2-legend .op2-lr{color:var(--tint-red);}
.op2-legend .op2-lb{color:var(--tint-blue);}
.op2-legend .op2-nd{margin:0 3px 2px 0;}
.op2-legend .op2-tag{vertical-align:0;}
.op2-copybtn{display:inline-flex;align-items:center;gap:6px;}

/* скелет, пока не пришли me/заявки - страница не должна быть пустой */
.op2-skel{display:flex;flex-direction:column;gap:10px;padding:4px 0;}
.op2-skel-line{height:14px;border-radius:6px;background:var(--bg3);}
.op2-skel-block{height:120px;border-radius:12px;background:var(--bg2);border:1px solid var(--border);}

@media (prefers-reduced-motion:reduce){
  .op2-root *,.op2-pop,.op2-drawer,.op2-toast,.op2-scrim,.op2-mvghost{animation:none!important;transition:none!important;}
}

/* строка «Сохранить в справочник» в подсказках заказчика (поиск по ИНН) */
.op2-sugg .op2-list .op2-it.op2-inn-row{cursor:default;}
.op2-sugg .op2-list .op2-it.op2-inn-row:hover{background:transparent;}
.op2-inn-save{font-size:12px;}

/* площадки заказчика в подсказках адреса (26.09) - 1:1 одобренное превью examples/preview-customer-sites.html:
   название + метка точки, ниже адрес целиком (переносится, не режется); число заявок справа */
.op2-sugg .op2-list .op2-it.op2-site-it{align-items:flex-start;padding:8px 10px;}
.op2-site-l{display:flex;flex-direction:column;gap:2px;min-width:0;}
.op2-site-t{font-weight:600;font-size:13px;color:var(--text);display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.op2-site-a{font-size:12px;color:var(--muted);overflow-wrap:anywhere;}
.op2-sugg .op2-list .op2-it.op2-site-it .op2-m{white-space:nowrap;}
.op2-site-chip{font-size:10.5px;font-weight:600;border-radius:5px;padding:1px 7px;letter-spacing:.02em;white-space:nowrap;}
.op2-site-chip.op2-ok{background:rgba(29,158,117,.16);color:var(--tint-green);}
.op2-site-chip.op2-no{background:rgba(239,159,39,.16);color:var(--tint-amber);}
/* 15.10 - контрагент не действует по ЕГРЮЛ (банкрот, ликвидация) в подсказке заказчика/перевозчика */
.op2-site-chip.op2-bad{background:rgba(226,75,74,.16);color:var(--tint-red);}
/* «Запомнить точку для площадки» под адресом - только у выбранной площадки без точки */
.op2-sitept{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap;}
.op2-sitept[hidden]{display:none;}
.op2-sitept input{flex:1 1 220px;min-width:0;width:auto;}
.op2-sitept .op2-ghost{flex:none;white-space:nowrap;}
/* «Сохранить как площадку заказчика» (Б-5) - та же кнопка-призрак, одна в строке под адресом */
.op2-sitesave{margin-top:6px;}
.op2-sitesave[hidden]{display:none;}

/* ---------- вкладка «Аналитика» (admin) - перенос 1:1 утверждённого превью
   https://claude.ai/artifact/MpTDTn3hicChW41mASoFKg, plans/2026-09-20-order-plan-
   analytics-history.md. Курсорный свет - канонический .p2-light (index.html, ГОСТ
   раздел 7), не отдельный класс - see LIGHT_GRID_SEL_ в index.html.

   ВСЕ селекторы ниже - через .op2-root, НЕ голым классом: превью писало p2-bars/
   p2-bar-row/p2-money-* без префикса (одностраничный черновик, коллизий не бывает), но в
   живом index.html эти же имена УЖЕ заняты (.p2-bars/.p2-bar-row и т.п. - главная
   страница, #cost-cards/#chart-vehicles-bars) - order-plan-v2.css подключен ГЛОБАЛЬНО
   (один <link> на все страницы SPA, не только на «Задание»), голый класс тут же
   переопределил бы чужую вёрстку на главной. Разметка (HTML/JS) остаётся 1:1 с превью -
   меняется только то, ЧЕМ она достаётся в CSS. ---------- */
.op2-root .an-section{margin-top:26px;}
.op2-root .an-section:first-of-type{margin-top:0;}
.op2-root .an-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap;}
.op2-root .an-section-title{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);}
.op2-root .an-section-sub{font-size:12px;color:var(--muted);}

.op2-root .an-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px;position:relative;perspective:1400px;}
.op2-root .an-kpi{position:relative;background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;transition:border-color .12s ease-out,background-color .12s ease-out,transform .12s ease-out;will-change:transform;overflow:hidden;}
.op2-root .an-kpi:hover{border-color:var(--border-strong);background:var(--bg-hover);transform:translateY(-1px) translateZ(22px);}
.op2-root .an-kpi-label{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:10px;}
.op2-root .an-kpi-trio{display:flex;align-items:baseline;justify-content:center;gap:9px;}
.op2-root .an-kpi-ghost{font-family:var(--font-mono);font-size:13px;font-weight:500;color:var(--muted);opacity:.6;}
.op2-root .an-kpi-val{font-family:var(--font-mono);font-size:19px;font-weight:600;color:var(--text);line-height:1;}
.op2-root .an-kpi-daylabels{display:flex;justify-content:center;gap:9px;margin-top:6px;}
.op2-root .an-kpi-daylabels span{font-size:9px;color:var(--muted);opacity:.7;letter-spacing:.03em;width:34px;text-align:center;}
.op2-root .an-kpi-daylabels span.today{color:var(--tint-green);opacity:1;font-weight:600;}
.op2-root .an-kpi-grid > *:not(.p2-light),.op2-root .an-money-grid > *:not(.p2-light){position:relative;z-index:1;}

.op2-root .an-money-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;position:relative;perspective:1400px;}
.op2-root .an-money{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;transition:border-color .12s ease-out,background-color .12s ease-out,transform .12s ease-out;will-change:transform;}
.op2-root .an-money:hover{border-color:var(--border-strong);background:var(--bg-hover);transform:translateY(-1px) translateZ(22px);}
.op2-root .an-money-label{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;}
.op2-root .an-money-val{font-family:var(--font-mono);font-size:25px;font-weight:600;color:var(--text);line-height:1.05;font-variant-numeric:tabular-nums;}
.op2-root .an-money-sub{font-size:11.5px;color:var(--muted);margin-top:6px;}
/* разбивка «Не подтверждено»/«Отбой» (Влад 20.09: «добавь ещё стоимости неподтверждённых
   заявок и стоимости отбитых заявок») - те же цветовые роли, что у статусов заявок везде
   в проекте (amber = не подтверждено, red = отбой), мельче основной суммы. */
.op2-root .an-money-break{margin-top:10px;padding-top:10px;border-top:1px solid var(--border);display:grid;gap:4px;}
.op2-root .an-money-break .row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:11.5px;}
.op2-root .an-money-break .k{color:var(--muted);}
.op2-root .an-money-break .k.amber{color:var(--tint-amber);}
.op2-root .an-money-break .k.red{color:var(--tint-red);}
.op2-root .an-money-break .v{font-family:var(--font-mono);color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums;}

/* по менеджерам - 3 равные колонки (Влад 20.09: «плитки Тралы/Длинномеры сделай чуть
   меньше, добавь третий блок - топ менеджеров по сумме подтверждённых») */
.op2-root .an-mgr-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;}
@media (max-width:1180px){.op2-root .an-mgr-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:700px){.op2-root .an-mgr-grid{grid-template-columns:1fr;}}
.op2-root .an-card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;}
.op2-root .card-title-an{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;}
.op2-root .an-card .p2-bars{display:grid;gap:7px;}
.op2-root .an-card .p2-bar-row{display:grid;grid-template-columns:112px 1fr 40px;align-items:center;gap:10px;min-height:24px;}
.op2-root .an-card .p2-bar-label{font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.op2-root .an-card .p2-bar-track{height:6px;border-radius:3px;overflow:hidden;background:var(--bg3);}
.op2-root .an-card .p2-bar-fill{height:100%;border-radius:3px;background:var(--blue);transition:width .5s ease;}
.op2-root .an-card .p2-bar-val{font-family:var(--font-mono);font-size:12px;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text);}

/* топ по сумме - трио вчера/сегодня/завтра на менеджера (тот же язык, что an-kpi-trio/
   an-kpi-ghost выше - тусклое прошлое/будущее, яркое сегодня); сортировка - по «сегодня». */
/* 21.09 - колонки расширены под ПОЛНЫЕ рубли ("962 560 ₽" вместо "0,96") - Влад:
   «в денежных блоках хочу видеть полные цифры, а не сокращённые». */
.op2-root .p2-money-head{display:grid;grid-template-columns:1fr repeat(3,74px);gap:6px;margin-bottom:6px;padding:0 2px;}
.op2-root .p2-money-head span{font-size:9px;color:var(--muted);text-align:right;letter-spacing:.03em;}
.op2-root .p2-money-head span.today{color:var(--tint-green);font-weight:600;}
.op2-root .p2-money-list{display:grid;gap:7px;}
.op2-root .p2-money-row{display:grid;grid-template-columns:1fr repeat(3,74px);align-items:baseline;gap:6px;min-height:20px;}
.op2-root .p2-money-name{font-size:12px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.op2-root .p2-money-row .ghost{font-family:var(--font-mono);font-size:10px;color:var(--muted);opacity:.65;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.op2-root .p2-money-row .val{font-family:var(--font-mono);font-size:10.5px;font-weight:600;color:var(--text);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}

@media (prefers-reduced-motion:reduce){
  .op2-root .an-kpi,.op2-root .an-money{transition:none!important;}
  .op2-root .an-kpi:hover,.op2-root .an-money:hover{transform:none!important;}
}

/* ── Конструктор договора-заявки (модальное окно поверх drawer, Влад 21.09) ── */
/* Клонирует drawer: тот же фон/рамка/тень/скругление, свой scrim уровнем выше (1600+). */
.op2-cc-scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .28s ease;z-index:1600;}
.op2-cc-scrim.op2-open{opacity:1;pointer-events:auto;}
.op2-cc{position:fixed;left:50%;top:50%;width:600px;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);transform:translate(-50%,-50%) translateY(12px) scale(.98);opacity:0;pointer-events:none;background:var(--bg3);border:1px solid var(--border-strong);border-radius:16px;box-shadow:0 2px 6px rgba(0,0,0,.35),0 20px 50px rgba(0,0,0,.35);z-index:1601;display:flex;flex-direction:column;overflow:hidden;transition:transform .32s var(--ease-overshoot),opacity .2s ease;}
.op2-cc.op2-open{transform:translate(-50%,-50%);opacity:1;pointer-events:auto;}
@media (prefers-reduced-motion:reduce){.op2-cc{transition:none;}}
.op2-cc .op2-cc-hd{padding:18px 22px 12px;border-bottom:1px solid var(--border);}
.op2-cc .op2-cc-hd h3{margin:0;font-family:var(--font-display);font-size:14px;font-weight:600;}
.op2-cc .op2-cc-hd .op2-sub{display:block;margin-top:5px;color:var(--muted);font-size:12px;line-height:1.45;}
.op2-cc .op2-cc-body{overflow:auto;padding:4px 22px 6px;flex:1;}
.op2-cc-sec{padding-top:14px;}
.op2-cc-k{display:flex;align-items:baseline;gap:8px;margin-bottom:9px;}
.op2-cc-k .op2-n{font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:.07em;color:var(--muted);}
.op2-cc-k .op2-t{font-size:13px;font-weight:600;}
.op2-cc-k .op2-auto{margin-left:auto;font-size:11px;color:var(--muted);font-family:var(--font-mono);}
.op2-cc-dl{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.op2-cc-dl .op2-hint{grid-column:1/-1;font-size:11.5px;color:var(--muted);line-height:1.5;}
.op2-cc-dl .op2-hint.op2-warn{color:var(--tint-red);}
.op2-cc-opts{display:flex;flex-direction:column;gap:7px;}
.op2-cc-opt{position:relative;display:flex;flex-direction:column;gap:5px;text-align:left;background:var(--bg2);border:1.5px solid var(--border);border-radius:12px;padding:11px 13px 11px 42px;cursor:pointer;transition:border-color .15s,background .15s;color:var(--text);font:inherit;width:100%;}
.op2-cc-opt:hover{border-color:var(--border-strong);}
.op2-cc-opt .op2-cc-radio{position:absolute;left:13px;top:13px;width:17px;height:17px;border-radius:50%;border:1.5px solid var(--border-strong);background:var(--bg3);display:flex;align-items:center;justify-content:center;}
.op2-cc-opt .op2-cc-radio::after{content:'';width:8px;height:8px;border-radius:50%;background:var(--green);transform:scale(0);transition:transform .18s var(--ease-overshoot);}
.op2-cc-opt.op2-on{border-color:var(--green);background:rgba(29,158,117,.10);}
.op2-cc-opt.op2-on .op2-cc-radio{border-color:var(--green);}
.op2-cc-opt.op2-on .op2-cc-radio::after{transform:scale(1);}
.op2-cc-opt .op2-row1{display:flex;align-items:baseline;justify-content:space-between;gap:10px;}
.op2-cc-opt .op2-ttl{font-size:13px;font-weight:600;}
.op2-cc-opt .op2-badge{font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;border-radius:5px;white-space:nowrap;}
.op2-cc-opt .op2-badge.op2-safe{background:rgba(29,158,117,.14);color:var(--green);}
.op2-cc-opt .op2-badge.op2-risk{background:rgba(239,159,39,.16);color:var(--tint-amber);}
.op2-cc-opt .op2-desc{font-size:11.5px;color:var(--muted);line-height:1.45;}
.op2-cc-opt .op2-cc-step{display:none;align-items:center;gap:10px;margin-top:4px;padding-top:9px;border-top:1px dashed var(--border);}
.op2-cc-opt.op2-on .op2-cc-step{display:flex;}
.op2-cc-step .op2-lbl{font-size:11.5px;color:var(--muted);}
.op2-cc-step .op2-ctl{display:flex;align-items:center;border:1px solid var(--border-strong);border-radius:8px;overflow:hidden;background:var(--bg3);}
.op2-cc-step button{width:28px;height:28px;border:0;background:transparent;color:var(--text);font-size:15px;cursor:pointer;line-height:1;}
.op2-cc-step button:hover{background:var(--bg4);}
.op2-cc-step button:disabled{opacity:.3;cursor:default;}
.op2-cc-step .op2-nn{width:34px;text-align:center;font-family:var(--font-mono);font-weight:600;font-size:13.5px;font-variant-numeric:tabular-nums;}
.op2-cc-step .op2-cap{font-size:11px;color:var(--muted);}
.op2-cc-opt .op2-cc-warn{display:none;gap:8px;margin-top:4px;padding-top:9px;border-top:1px dashed var(--border);font-size:11.5px;color:var(--tint-amber);line-height:1.45;}
.op2-cc-opt.op2-on .op2-cc-warn{display:flex;}
.op2-cc-pv{margin:16px 0 6px;background:var(--bg2);border:1px solid var(--border);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:9px;}
.op2-cc-pv .op2-k{font-family:var(--font-mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);}
.op2-cc-pvr{display:grid;grid-template-columns:88px 1fr;gap:10px;font-size:12.5px;line-height:1.45;padding-top:8px;border-top:1px dashed var(--border);}
.op2-cc-pvr:first-of-type{border-top:0;padding-top:0;}
.op2-cc-pvr .op2-l{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);padding-top:2px;letter-spacing:.03em;}
.op2-cc-pvr b{font-weight:600;}
.op2-cc .op2-cc-ft{border-top:1px solid var(--border);padding:12px 22px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--bg3);}
.op2-cc .op2-cc-ft .op2-meta{font-size:11px;color:var(--muted);line-height:1.5;margin-right:auto;font-family:var(--font-mono);}
.op2-cc .op2-dbtn:disabled{opacity:.45;cursor:not-allowed;}
@media (max-width:520px){.op2-cc-dl{grid-template-columns:1fr;}.op2-cc-pvr{grid-template-columns:1fr;gap:3px;}}
/* 15.10 - оплата заявки: подсказка под статусом, список поступлений, светофор в диалоге риска и карточке */
.op2-paynote{font-size:11.5px;color:var(--muted);line-height:1.45;margin-top:2px;}
.op2-paynote.op2-warn{color:var(--amber);}
#op2-f-payx:empty{display:none;}
#op2-f-payx input{margin-top:6px;}
.op2-paylist{display:flex;flex-direction:column;gap:4px;margin-top:6px;max-height:260px;overflow:auto;}
.op2-payrow{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:baseline;padding:7px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg3);cursor:pointer;transition:border-color .12s ease-out,background-color .12s ease-out;}
.op2-payrow:hover{border-color:var(--border-strong);}
.op2-payrow.op2-on{border-color:var(--green);background:rgba(29,158,117,.12);}
.op2-payrow.op2-off{opacity:.5;cursor:not-allowed;}
.op2-payamt{font-size:13px;font-weight:600;white-space:nowrap;}
.op2-paywho{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.op2-paymeta{grid-column:1/-1;}
.op2-light{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--bg4);border:1px solid var(--border-strong);vertical-align:middle;margin:0 5px 2px 0;}
.op2-light-green{background:var(--green);border-color:var(--green);}
.op2-light-yellow{background:var(--amber);border-color:var(--amber);}
.op2-light-red{background:var(--red);border-color:var(--red);}
.op2-payrisk-client{margin-top:12px;padding-top:10px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:5px;font-size:12.5px;}