:root{
  --taxi:#ffcc00; --taxi-dark:#e0b000;
  --graphite:#232326; --grey:#6e7076;
  --line:#dcdcd8; --paper:#f4f4f1; --white:#fff;
  --stop:#b3302a; --ok:#2f7a3d;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--graphite);
  font-family:"PT Sans","Segoe UI",Tahoma,sans-serif; font-size:16px; line-height:1.5;
}
a{color:var(--graphite)}

/* ── шапка ── */
.bar{background:var(--graphite); color:#fff}
.bar .in{max-width:1180px; margin:0 auto; padding:13px 20px; display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.bar a{color:#fff; text-decoration:none}
.logo{font-weight:700; display:inline-flex; align-items:center; gap:9px}
.logomark{width:26px; height:26px; display:block}
.bar nav{display:flex; gap:18px}
.bar nav a{color:#c9c9cc; font-size:15px}
.bar nav a:hover{color:var(--taxi)}

/* ── выпадающие разделы меню ── */
.bar nav .grp{position:relative}
.bar nav .grp > button{background:none; border:none; padding:0; margin:0;
  color:#c9c9cc; font:inherit; font-size:15px; cursor:pointer}
.bar nav .grp > button:after{content:""; display:inline-block; margin-left:6px;
  border:4px solid transparent; border-top-color:#8a8a8f; vertical-align:2px}
.bar nav .grp > button:hover{color:var(--taxi)}
.bar nav .grp.on > button{color:var(--taxi)}
.bar nav .grp.on > button:after{border-top-color:var(--taxi)}
.bar nav .drop{display:none; position:absolute; top:100%; left:-14px; margin-top:11px;
  background:var(--graphite); border:1px solid #45454a; border-radius:3px;
  padding:6px 0; min-width:210px; z-index:20;
  box-shadow:0 6px 18px rgba(0,0,0,.35)}
.bar nav .grp.on .drop{display:block}
.bar nav .drop a{display:block; padding:8px 16px; font-size:15px; white-space:nowrap}
.bar nav .drop a:hover{background:#3a3a3f; color:var(--taxi)}
.who{margin-left:auto; color:#9a9a9f; font-size:15px}
.out{font-size:15px; border-bottom:1px solid #55555a}
.checks{display:flex; gap:2px; padding:0 0 0}
.checks i{flex:1; height:6px; background:var(--taxi)}
.checks i:nth-child(even){background:#3a3a3f}
.checks.solo{margin-bottom:22px}
.checks.solo i{height:11px}

.page{max-width:1180px; margin:0 auto; padding:26px 20px 70px}

h1{font-size:25px; margin:0 0 18px; letter-spacing:-.015em}
h2{font-size:18px; margin:32px 0 12px}
.dim{color:var(--grey); font-size:15px}
.nowrap{white-space:nowrap}

/* ── сообщения ── */
.msg{padding:11px 15px; border-radius:3px; margin-bottom:16px; border-left:4px solid}
.msg.ok{background:#eef6ef; border-color:var(--ok)}
.msg.error{background:#fdf2f1; border-color:var(--stop)}

/* ── вход ── */
.login{max-width:340px; margin:70px auto; background:var(--white);
  border:1px solid var(--line); border-radius:3px; padding:26px 28px 30px}
.login h1{font-size:21px; margin:0 0 3px}
.login .sub{margin:0 0 22px; color:var(--grey); font-size:15px}
.login label{display:block; font-size:14px; color:var(--grey); margin:0 0 4px}
.login input{width:100%; margin-bottom:16px}

/* ── поля ── */
input,select,textarea{
  font:inherit; color:inherit; padding:9px 11px;
  border:1px solid var(--line); border-radius:3px; background:var(--white); width:100%;
}
textarea{min-height:60px; resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid var(--graphite); outline-offset:1px}
label{font-size:14px; color:var(--grey)}
label i{font-style:normal; color:var(--stop); font-size:12px}

button,.go{
  font:inherit; font-weight:700; background:var(--taxi); color:var(--graphite);
  border:none; border-radius:3px; padding:10px 20px; cursor:pointer; width:auto;
}
button:hover,.go:hover{background:var(--taxi-dark)}
button:focus-visible{outline:2px solid var(--graphite); outline-offset:2px}
.cancel{margin-left:14px; font-size:15px; color:var(--grey)}

.box{background:var(--white); border:1px solid var(--line); border-radius:3px; padding:18px 20px 20px}
.row{display:grid; gap:12px; margin-bottom:14px}
.row.two{grid-template-columns:repeat(2,1fr)}
.row.four{grid-template-columns:repeat(4,1fr)}
.row .wide{grid-column:1 / -1}
@media(max-width:760px){.row.two,.row.four{grid-template-columns:1fr}}

/* ── таблицы ── */
.grid{width:100%; border-collapse:collapse; background:var(--white);
  border:1px solid var(--line); border-radius:3px; overflow:hidden}
.grid th{background:#ecece8; text-align:left; font-size:14px; color:var(--grey);
  padding:9px 12px; border-bottom:1px solid var(--line); font-weight:700}
.grid td{padding:9px 12px; border-bottom:1px solid var(--line); vertical-align:middle}
.grid tr:last-child td{border-bottom:none}
.grid tr.off td{color:#a5a5a0}
.acts{white-space:nowrap; text-align:right}
.acts a{font-size:14px; margin-right:12px}
.inline{display:inline-flex; gap:5px; align-items:center}
.inline button{padding:6px 12px; font-size:14px; font-weight:400;
  background:#ecece8; color:var(--graphite)}
.inline button:hover{background:var(--taxi)}
/* «Распознать реквизиты» — главное действие после загрузки, должно бросаться в глаза */
.inline button.recognize{background:var(--taxi);color:var(--graphite);font-weight:700;
  font-size:15px;padding:10px 22px;box-shadow:0 2px 0 var(--taxi-dark)}
.inline button.recognize:hover{background:var(--taxi-dark)}
.inline input{width:150px; padding:6px 9px; font-size:14px}

/* ── карточки обзора ── */
.cards{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:26px}
@media(max-width:760px){.cards{grid-template-columns:repeat(2,1fr)}}
.card{background:var(--white); border:1px solid var(--line);
  border-top:4px solid var(--taxi); border-radius:3px; padding:18px 20px}
.card.alarm{border-top-color:var(--stop)}
.card b{display:block; font-size:32px; line-height:1.1}
.card span{color:var(--grey); font-size:14px}

.note-box{background:var(--white); border:1px solid var(--line);
  border-radius:3px; padding:18px 20px}
.note-box p{margin:0; color:var(--grey)}
.note-box h1{margin:0 0 8px}

/* ── вкладки справочников ── */
.tabs{display:flex; flex-wrap:wrap; gap:4px; margin-bottom:8px}
.tabs a{padding:8px 14px; background:var(--white); border:1px solid var(--line);
  border-radius:3px; font-size:15px; text-decoration:none}
.tabs a:hover{border-color:var(--taxi)}
.tabs a.on{background:var(--graphite); color:#fff; border-color:var(--graphite)}

.filter{margin-bottom:14px}
.filter select{width:auto; min-width:220px}

.pager{display:flex; gap:5px; margin-top:16px; flex-wrap:wrap}
.pager a{padding:6px 11px; background:var(--white); border:1px solid var(--line);
  border-radius:3px; text-decoration:none; font-size:15px}
.pager a.on{background:var(--graphite); color:#fff}

/* ── блок 2: реестр и карточка ── */
.titlebar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.titlebar h1{margin:0 0 18px}
.titlebar form,.titlebar .go{margin-bottom:18px;text-decoration:none;display:inline-block}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.filters input{flex:2;min-width:220px}
.filters select{flex:1;min-width:150px;width:auto}
.filters button{flex:0}

.row-link{cursor:pointer}
.row-link:hover td{background:#fbfbf9}
.row-link a{text-decoration:none}

.pill{display:inline-block;padding:3px 9px;border-radius:2px;font-size:13px;
  background:#ecece8;white-space:nowrap}
.pill.s-new{background:#fdf2f1;color:#8e2721}
.pill.s-wait1,.pill.s-wait2{background:#fff6d6}
.pill.s-sent1,.pill.s-sent2,.pill.s-sent12{background:#eaf1f7}
.pill.s-done1{background:#eef6ef}
.pill.s-done{background:var(--taxi)}
.pill.s-paid{background:#eef6ef;color:#215c2c}

.statusline{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.statusline select{width:auto;min-width:230px}

.pane{margin-top:6px}
.pane .box h2:first-child{margin-top:0}
.chkline{display:flex;align-items:center;gap:9px;margin:0 0 10px;
  font-size:15px;color:var(--graphite)}
.chkline input{width:auto}

.warn-row td{background:#fdf7f6}
.req-mark{display:inline-block;margin-left:7px;font-size:12px;color:var(--stop)}
.acts input[type=file]{width:190px;padding:5px;font-size:13px}

/* ── блок 3: шаблоны ── */
.ph{display:inline-block;background:#ecece8;border-radius:2px;padding:1px 6px;
  font-family:Consolas,monospace;font-size:13px;margin:2px 3px 2px 0;white-space:nowrap}

/* ── блок 4: контроль и календарь ── */
.markform{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.markform button{padding:6px 12px;font-size:14px;font-weight:400;background:#ecece8}
.markform .b-ok:hover{background:#cfe6d4}
.markform .b-no:hover{background:#f7dcda}
.markform .b-stop{background:#f7dcda}
.more{position:relative}
.more summary{list-style:none;cursor:pointer;font-size:14px;padding:6px 12px;
  background:#ecece8;border-radius:3px;white-space:nowrap}
.more summary::-webkit-details-marker{display:none}
.morebox{position:absolute;right:0;top:calc(100% + 5px);z-index:20;width:245px;
  max-width:calc(100vw - 40px);
  background:#fff;border:1px solid var(--line);border-radius:3px;padding:12px;
  box-shadow:0 6px 18px rgba(0,0,0,.09);text-align:left}
/* На узких экранах всплывающее окно раскрывается строкой, а не поверх —
   иначе оно уезжает за край и в поля нельзя попасть */
@media(max-width:1100px){
  .more{position:static}
  .morebox{position:static;width:auto;max-width:none;margin-top:8px;box-shadow:none}
  .acts{white-space:normal;text-align:left}
}
.morebox label{display:block;margin-bottom:5px}
.morebox input{margin-bottom:8px}
.morebox hr{border:none;border-top:1px solid var(--line);margin:10px 0}

.picklist{max-height:330px;overflow:auto;border:1px solid var(--line);border-radius:3px;background:#fff}
.pick{display:flex;gap:10px;align-items:center;padding:8px 12px;
  border-bottom:1px solid var(--line);cursor:pointer;font-size:15px}
.pick:last-child{border-bottom:none}
.pick:hover{background:#fbfbf9}
.pick input{width:auto}

.monthnav{display:flex;align-items:center;gap:16px;margin-bottom:18px}
.monthnav a{font-size:15px}
.monthnav b{min-width:160px;text-align:center}

.cal{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line)}
.cal th{background:#ecece8;padding:7px;font-size:13px;color:var(--grey);
  border:1px solid var(--line);width:14.28%}
.cal td{border:1px solid var(--line);vertical-align:top;height:96px;padding:4px;width:14.28%}
.cal td.other{background:#f7f7f5}
.cal td.other .dnum{color:#b9b9b4}
.cal td.today{box-shadow:inset 0 0 0 2px var(--taxi)}
.dnum{font-size:13px;color:var(--grey);margin-bottom:3px}
.ev{display:block;font-size:12px;padding:2px 5px;margin-bottom:2px;border-radius:2px;
  text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  border-left:3px solid transparent}
.more-ev{font-size:11px;padding-left:5px}
.t-waybill{background:#fff6d6;border-left-color:#e0b000}
.t-payment{background:#eef6ef;border-left-color:var(--ok)}
.t-osgop{background:#eaf1f7;border-left-color:#3b6ea5}
.t-dk{background:#f3eef7;border-left-color:#7a5aa5}
.t-carrier{background:#fdf2f1;border-left-color:var(--stop)}
.legend{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.legend span{font-size:13px;padding:3px 9px;border-radius:2px;border-left:3px solid transparent}
.overdue{margin:8px 0 0;padding-left:18px}
.overdue li{margin-bottom:3px;font-size:14px}

/* ── блок 5: финансы ── */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:860px){.two-col{grid-template-columns:1fr}}
.paybox{background:#fff;border:1px solid var(--line);border-radius:3px;padding:14px 16px;margin-top:10px}
.paybox .row{margin-bottom:10px}
.sum-line{display:flex;justify-content:space-between;gap:16px;padding:8px 0;
  border-top:1px solid var(--line);font-weight:700}

/* ── распознавание документов ── */
.ocrbox{display:flex;justify-content:space-between;align-items:center;gap:20px;
  flex-wrap:wrap;background:#fff;border:1px solid var(--line);
  border-left:4px solid var(--taxi);border-radius:3px;padding:14px 18px;margin-bottom:14px}
.ocrbox .dim{font-size:14px;max-width:62ch;margin-top:3px}
.ocrbox button{white-space:nowrap}

/* ── версия 6: диагностика и миниатюры ── */
.ocrbtns{display:flex;gap:8px;flex-wrap:wrap}
.ocrbtns .b-over{background:#ecece8;font-weight:400}
.ocrbtns .b-over:hover{background:#dcdcd8}

.diag{background:#fff;border:1px solid var(--line);border-radius:3px;margin-bottom:14px}
.diag summary{cursor:pointer;padding:12px 18px;font-size:15px;list-style:none}
.diag summary::-webkit-details-marker{display:none}
.diag summary:before{content:"▸ ";color:var(--grey)}
.diag[open] summary:before{content:"▾ "}
.diagbox{padding:0 18px 18px;border-top:1px solid var(--line)}
.diagbox h4{margin:16px 0 8px;font-size:15px}
.diagbox code{background:#ecece8;padding:1px 5px;border-radius:2px;font-size:13px}
.rawtext{background:#f7f7f5;border:1px solid var(--line);border-radius:3px;
  padding:10px 12px;font-size:13px;white-space:pre-wrap;word-break:break-word;
  max-height:220px;overflow:auto;margin:0}

.thumbwrap{display:flex;gap:12px;align-items:flex-start}
.thumb{width:84px;height:62px;object-fit:cover;border:1px solid var(--line);
  border-radius:3px;background:#f7f7f5;display:block;flex:none}
.thumb:hover{border-color:var(--taxi)}
a.thumb.pdf{display:flex;align-items:center;justify-content:center;
  font-size:13px;color:var(--grey);text-decoration:none}

/* ── версия 7: подсветка и источники ── */
input.bad,textarea.bad{border-color:var(--stop);background:#fdf5f4}
.badhint{display:block;font-size:13px;color:var(--stop);margin-top:3px}
.src{font-style:normal;display:inline-block;width:15px;height:15px;line-height:15px;
  text-align:center;border-radius:2px;font-size:11px;margin-left:5px;vertical-align:middle}
.src-m{background:var(--ok);color:#fff}
.src-o{background:var(--taxi);color:var(--graphite)}
.src-c{background:#dcdcd8;color:var(--grey)}

/* ── версия 7.2: оплата строкой ── */
.paylink{font-size:14px;white-space:nowrap}
.payrow{display:grid;grid-template-columns:130px 150px 1fr 1fr auto;gap:12px;
  align-items:end;padding:6px 0}
.payrow label{display:block;margin-bottom:3px}
.payrow input[type=file]{padding:6px;font-size:13px}
.paygo button{white-space:nowrap}
@media(max-width:900px){.payrow{grid-template-columns:1fr}}

/* ── ИНН под формой сверки ── */
.inns{font-size:14px;color:var(--grey);padding-top:6px}
.inns b{color:var(--graphite);margin-right:10px}
.inns span{display:inline-block;margin-right:20px}
.inns code{background:#ecece8;padding:2px 7px;border-radius:2px;font-size:14px}

/* ── касса ── */
.kassa-now{background:#fff;border:1px solid var(--line);border-left:4px solid var(--taxi);
  border-radius:3px;padding:18px 22px;margin-bottom:18px;display:flex;
  align-items:baseline;gap:18px}
.kassa-now span{color:var(--grey);font-size:15px}
.kassa-now b{font-size:30px}
.num{text-align:right;white-space:nowrap}
.num.minus{color:var(--stop)}
.tabs{display:flex;gap:6px;margin-bottom:14px}
.tabs a{padding:8px 16px;background:#fff;border:1px solid var(--line);
  border-radius:3px;text-decoration:none;color:var(--graphite);font-size:15px}
.tabs a.on{background:var(--graphite);color:#fff;border-color:var(--graphite)}

/* ── контроль в карточке ── */
.ctlbox{background:#fff;border:1px solid var(--line);border-radius:3px;
  padding:18px 20px;margin-bottom:18px}
.ctlnow{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:10px}
.ctlnow b{font-size:17px}
.ctlrow{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-top:12px}
.ctlrow .wide{flex:1;min-width:260px}
.ctlrow input{min-width:150px}

/* ── место на диске ── */
.diskbar{height:10px;background:#ecece8;border-radius:5px;overflow:hidden}
.diskbar i{display:block;height:100%;background:var(--ok)}

/* ── отметки обзвона по ОСГОП ── */
.callmark{display:inline-flex;gap:5px;margin-left:10px;flex-wrap:wrap}
.callmark button{font-size:12px;padding:3px 9px;background:#ecece8;
  border:1px solid var(--line);font-weight:400}
.callmark button:hover{background:var(--taxi)}
.overdue li{margin-bottom:7px}

/* ── просроченное по видам ── */
.overdue-box details{margin-top:10px}
.overdue-box summary{cursor:pointer;padding:6px 0;font-size:15px;list-style:none}
.overdue-box summary::-webkit-details-marker{display:none}
.overdue-box summary:before{content:"▸ ";color:var(--grey)}
.overdue-box details[open] summary:before{content:"▾ "}

/* кнопка, выглядящая как ссылка (например «скопировать данные собственника») */
.linkbtn{background:none;border:none;padding:0;margin:0;font:inherit;
  color:var(--taxi);cursor:pointer;text-decoration:underline}
.linkbtn:hover{opacity:.8}

/* сворачиваемый блок (например «Разрешение») */
.foldblock{margin:18px 0}
.foldblock>summary{cursor:pointer;list-style:none;user-select:none}
.foldblock>summary::-webkit-details-marker{display:none}
.foldblock>summary:before{content:"▸ ";color:var(--grey)}
.foldblock[open]>summary:before{content:"▾ "}

/* поле с кнопкой копирования */
.fld-row{display:flex;gap:6px;align-items:stretch}
.fld-row input{flex:1;min-width:0}
.copybtn{flex:0 0 auto;width:34px;border:1px solid var(--line);border-radius:3px;
  background:#fafaf8;color:var(--grey);cursor:pointer;font-size:15px;line-height:1}
.copybtn:hover{background:#f0f0ed;color:var(--graphite)}
.copybtn.ok{color:var(--ok);border-color:var(--ok)}

/* строка поиска внутри таблицы База общая */
.grid tr.filters{display:table-row}
.grid tr.filters td{padding:6px 12px 10px;background:#f6f6f3;border-bottom:1px solid var(--line)}
.grid tr.filters input{width:100%;box-sizing:border-box;font-size:14px;padding:5px 8px}
.grid tr.filters-actions td{padding:8px 12px;background:#f6f6f3;border-bottom:2px solid var(--line)}

/* карточка клиента */
.client-grid{display:grid;grid-template-columns:320px 1fr;gap:28px;margin-top:16px}
.client-info{background:var(--white);border:1px solid var(--line);border-radius:4px;padding:16px 18px;align-self:start}
.client-info h2,.client-cars h2{margin:0 0 12px;font-size:18px}
.info-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dotted var(--line);font-size:15px}
.info-row:last-child{border-bottom:none}
.info-row span{color:var(--grey)}
@media(max-width:800px){.client-grid{grid-template-columns:1fr}}

/* блок подтверждения удаления заявки */
.delbox{margin:14px 0;padding:16px 18px;border:2px solid #c00;border-radius:4px;background:#fff5f5;max-width:560px}
.delbox b{color:#c00}
.delbox input{margin:8px 0;padding:7px 10px;width:220px}

/* окно изменения суммы: раскрывается в строке, не всплывает — иначе
   обрезается overflow:hidden таблицы .grid */
.inline-more{position:static}
.inline-more .morebox{position:static;width:auto!important;max-width:none;margin-top:8px;box-shadow:none}

/* заявки на аннулирование — светло-голубой фон и метка */
.grid tr.row-annul td{background:#eaf4fb}
.grid tr.row-annul:hover td{background:#dcecf7}
.annul-tag{display:inline-block;background:#3b7dbd;color:#fff;font-size:11px;
  padding:1px 7px;border-radius:9px;font-weight:700;vertical-align:middle}

/* строка юр. адреса ООО в карточке */
.firm-addr{margin:10px 0;padding:10px 12px;background:#f6f6f3;border:1px solid var(--line);
  border-radius:3px;font-size:14px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.firm-addr .copybtn{width:28px}

/* статус с портала на сводном экране */
.st-cell.st-ok{color:#1a7a2e;font-weight:600}
.st-cell.bad{color:#c00}

/* блок «СТС одним файлом» в форме подачи */
.sts-combined{margin:6px 0 10px;padding:10px 12px;background:#eef6ff;border:1px solid #cfe2f5;border-radius:3px;font-size:14px}
.sts-combined b{color:#1a5a8a}

/* кнопка «Добавить авто этому клиенту» */
.add-car-box{margin:14px 0;padding:12px 14px;background:#f0f8f2;border:1px solid #cfe8d5;border-radius:4px}
.add-car-box form{display:flex;align-items:center;gap:12px;flex-wrap:wrap}

/* пометка готовности заявки на МОСРЕГ (автопроверка) */
.mosreg-ok{display:inline-block;background:#1a7a2e;color:#fff;font-size:11px;
  padding:1px 7px;border-radius:9px;font-weight:700;vertical-align:middle}

/* Отметка «документ не нужен» в таблице документов */
.waivecell{white-space:nowrap;vertical-align:top}
.waive{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:13px}
.waive input{margin:0}

/* Блок «две страницы одним PDF» в карточке */
.combined-box{border:1px solid var(--line);border-radius:4px;padding:14px 16px;margin:18px 0}
.combined-box .grid td{vertical-align:middle}

/* Холсты подписи в карточке заявки */
.signrow{display:flex;gap:18px;flex-wrap:wrap;margin-top:12px}
.signbox{flex:1 1 320px;min-width:300px}
.sigpad{border:1px dashed var(--line);border-radius:3px;background:#fff;
        width:100%;height:150px;touch-action:none;display:block;margin-top:6px}
.signbox .sigbar{display:flex;justify-content:space-between;align-items:center;
                 margin-top:8px;gap:10px}
.signbox .sigbar button{margin-left:6px}

/* Раздел «Золотая Жаба»: таблица и выбор колонок сбоку */
.withcols{display:flex;gap:18px;align-items:flex-start}
.withcols > .grid, .withcols > .tablewrap{flex:1;min-width:0}
.tablewrap{overflow-x:auto}
.colbox{flex:0 0 210px;border:1px solid var(--line);border-radius:4px;
        padding:12px 14px;font-size:13px}
.colbox b{display:block;margin-bottom:8px}
.colbox .chkline{display:block;margin:3px 0}
.colbox button{margin-top:10px}
.colbox p{margin:8px 0 0}

/* Шапка раздела прилипает к верху: список бывает на пятьсот строк,
   и кнопки «Получить список» и «Скачать» не должны уезжать из виду */
.titlebar.zh-sticky{position:sticky; top:0; z-index:5; background:var(--paper);
  padding:10px 0 6px; margin-bottom:6px; border-bottom:1px solid var(--line)}
.colbox{position:sticky; top:74px; align-self:flex-start; max-height:calc(100vh - 100px);
  overflow-y:auto; background:var(--white)}

/* Сканы документов водителя */
.filerow{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:3px 0}
.filerow .dim{font-size:13px}

/* Перетаскивание документов */
.dropzone{border:2px dashed var(--line);border-radius:6px;padding:22px 18px;
  text-align:center;background:var(--white);margin:10px 0;transition:.15s}
.dropzone.over{border-color:var(--taxi);background:#fffdf3}
.dropzone b{display:block;margin-bottom:4px}
.dropzone .dim{font-size:14px}
#dropList{margin-top:8px}
.linklike{background:none;border:0;padding:0;color:#1a4d8f;text-decoration:underline;
  cursor:pointer;font:inherit}

/* Незаполненные поля заявки: видно, что не распозналось */
.fld input.empty{background:#fffaf0;border-color:#e3c98a}

/* Главное действие на странице — заметно крупнее остальных кнопок.
   «Новая заявка» нажимается десятки раз в день, искать её глазами
   среди одинаковых кнопок не должно приходиться */
.mainbtn{
  font-size:17px; font-weight:700; padding:13px 26px; border-radius:6px;
  background:var(--taxi); color:var(--graphite); border:2px solid var(--taxi-dark);
  box-shadow:0 2px 0 var(--taxi-dark); cursor:pointer;
}
.mainbtn:hover{background:#ffd633}
.mainbtn:active{transform:translateY(2px); box-shadow:none}

/* Плитки загрузки документов */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
       gap:12px;margin:12px 0}
.tile{border:2px dashed var(--line);border-radius:8px;padding:14px;background:var(--white);
      min-height:130px;display:flex;flex-direction:column;gap:6px;cursor:pointer;
      transition:.15s;text-align:left}
.tile:hover{border-color:var(--taxi-dark)}
.tile.over{border-color:var(--taxi);background:#fffdf3}
.tile.has{border-style:solid;border-color:var(--ok)}
.tile.need{border-color:#e0a0a0;background:#fffafa}
.tile b{font-size:15px}
.tile .dim{font-size:13px;margin-top:auto}
.tile .req-mark{font-size:12px}
.thumbs{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.thumbs .thumb{display:block;width:52px;height:52px;border:1px solid var(--line);
          border-radius:4px;overflow:hidden;background:#f2f2ef;font-size:12px;
          line-height:52px;text-align:center;color:var(--grey);cursor:zoom-in}
.thumbs .thumb:hover{border-color:var(--taxi-dark)}
.thumbs .thumb[draggable=true]{cursor:grab}
.thumbs .thumb.dragging{opacity:.4}
.thumbs .thumb{position:relative}
.thumb-x{position:absolute;top:1px;right:1px;width:18px;height:18px;line-height:17px;
  border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:14px;text-align:center;
  cursor:pointer;display:none}
.thumbs .thumb:hover .thumb-x{display:block}
.thumb-x:hover{background:#c0392b}
@media (hover:none){.thumb-x{display:block}}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}

/* Распознанный текст документа: смотрим как есть, без прикрас */
.ocr-text{background:var(--white);border:1px solid var(--line);border-radius:4px;
  padding:12px;white-space:pre-wrap;word-break:break-word;font-size:13px;
  line-height:1.45;max-height:480px;overflow:auto}

/* ── Карточка водителя: документы слева, реквизиты справа ── */
.docs-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:20px;align-items:start;margin-bottom:18px}
.docs-split .combined-box{margin:0}
.docs-split .titlebar{margin-top:0}
.docs-right #buhTable{width:100%;font-size:14px}
.docs-right .buh-title{width:34%}
.docs-right .buh-edit{width:1%;text-align:right}
.docs-right .rowedit input{width:130px}
/* На широком экране блок выходит за обычную ширину страницы,
   чтобы обеим половинам хватило места */
@media (min-width:1300px){
  .docs-split{width:min(1500px, calc(100vw - 48px));position:relative;
    left:50%;transform:translateX(-50%)}
}
@media (max-width:1000px){
  .docs-split{grid-template-columns:1fr}
}
/* Поле правки в строке показывается только по «изменить»: класс inline
   задаёт display и перебивал атрибут hidden — поля торчали во всех строках */
.rowedit[hidden]{display:none}
/* Одинаковые шапки двух половин — чтобы плитки и таблица начинались вровень */
.split-head{display:flex;align-items:center;justify-content:space-between;
  gap:10px;height:40px;margin-bottom:12px}
.split-head h3{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.split-head > span{white-space:nowrap;flex-shrink:0}
.split-head .cancel{margin-left:10px;font-size:14px}
button.go.small{padding:7px 14px;font-size:14px}
.docs-right #buhTable{margin:0}
.docs-right > p.dim{margin:10px 0 0;font-size:13px}