:root{
    --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --bg:#f6f8fb; --card:#fff;
    --navy:#0d1526; --accent:#2563eb; --accent-soft:#eff4ff;
    --ok:#15803d; --ok-bg:#e9f7ef; --warn:#b45309; --warn-bg:#fdf3e3;
    --bad:#b91c1c; --bad-bg:#fdecec; --manual:#475569; --manual-bg:#eef2f7;
  }
  *{box-sizing:border-box}
  /* без этого правила атрибут hidden не работает: явный display у класса
     (.app{display:flex}, .login{display:flex}) перебивает [hidden] из браузера */
  [hidden]{display:none !important}
  body{margin:0;font:15px/1.5 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg)}
  a{color:inherit;text-decoration:none}
  .app{display:flex;min-height:100vh}
  aside{width:250px;background:var(--navy);color:#cbd5e1;padding:22px 18px;flex:0 0 250px}
  aside .brand{color:#fff;font-weight:600;font-size:16px}
  aside .brand span{display:block;color:#7c8ba1;font-weight:400;font-size:12px;margin-top:3px}
  nav{margin-top:26px}
  nav a{display:block;padding:9px 12px;border-radius:8px;color:#c2ccdb;font-size:14px;margin-bottom:4px}
  nav a:hover{background:#16223a;color:#fff}
  nav a.active{background:var(--accent);color:#fff}
  aside .who{margin-top:28px;padding-top:16px;border-top:1px solid #1e2a44;font-size:13px;color:#8fa0b8}
  aside .who b{color:#e5ecf6;display:block;font-weight:500;font-size:14px;margin-bottom:2px}
  main{flex:1;min-width:0}
  .wrap{padding:26px 30px 60px;max-width:1180px}
  h1{font-size:22px;margin:0 0 4px}
  h2{font-size:16px;margin:24px 0 10px}
  .sub{color:var(--muted);font-size:13.5px;margin-bottom:20px}
  .grid{display:grid;gap:18px}
  .two{grid-template-columns:1.55fr 1fr}
  .even{grid-template-columns:1fr 1fr}
  .card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px}
  .card h3{margin:0 0 14px;font-size:15px}
  label{display:block;font-size:13px;color:#334155;margin:14px 0 6px;font-weight:500}
  input,select,textarea{width:100%;padding:10px 12px;border:1px solid #cfd8e6;border-radius:9px;font:14px inherit;background:#fff;color:var(--ink)}
  input:focus,select:focus,textarea:focus{outline:2px solid var(--accent-soft);border-color:var(--accent)}
  .drop{border:1.5px dashed #b9c6da;border-radius:10px;padding:18px;text-align:center;color:var(--muted);font-size:13.5px;background:#fbfcfe}
  .drop b{color:var(--ink);display:block;margin-bottom:4px;font-size:14px}
  .hint{font-size:12.5px;color:var(--muted);margin-top:6px}
  button{font:14px inherit;border:0;border-radius:9px;padding:11px 18px;background:var(--accent);color:#fff;cursor:pointer;
    transition:background .16s ease,box-shadow .16s ease,transform .06s ease}
  /* подсветка при наведении: те же кнопки, но заметно светлее/темнее фона */
  button:hover:not(:disabled){background:#1d4ed8;box-shadow:0 4px 14px rgba(37,99,235,.28)}
  button:focus-visible{outline:2px solid #93b4f5;outline-offset:2px}
  button:active:not(:disabled){transform:translateY(1px);box-shadow:none}
  button.ghost{background:#fff;border:1px solid #cfd8e6;color:#334155}
  button.ghost:hover:not(:disabled){background:var(--accent-soft);border-color:#9dbdf0;color:#12325a;box-shadow:none}
  button:disabled{opacity:.55;cursor:default}
  .back-link{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--muted);
    margin-bottom:14px;padding:6px 10px;border-radius:8px;transition:background .16s ease,color .16s ease}
  .back-link:hover{background:var(--accent-soft);color:var(--accent)}
  .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
  .actions{margin-top:20px;display:flex;gap:10px}
  table{width:100%;border-collapse:collapse;font-size:13.5px}
  th,td{text-align:left;padding:10px 12px;border-bottom:1px solid #eef2f7;vertical-align:top}
  th{font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:#7b8798;font-weight:600}
  tbody tr:hover{background:#fafcff}
  .pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap}
  .p-ok{background:var(--ok-bg);color:var(--ok)}
  .p-warn{background:var(--warn-bg);color:var(--warn)}
  .p-bad{background:var(--bad-bg);color:var(--bad)}
  .p-manual{background:var(--manual-bg);color:var(--manual)}
  .p-pending{background:#f1f5f9;color:#7b8798}
  .p-run{background:var(--accent-soft);color:var(--accent)}
  .bar{height:6px;background:#eef2f7;border-radius:99px;overflow:hidden;min-width:90px}
  .bar i{display:block;height:100%;background:var(--accent)}
  .tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0 6px}
  .tile{background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 16px}
  .tile .n{font-size:24px;font-weight:600;line-height:1.1}
  .tile .t{font-size:12.5px;color:var(--muted);margin-top:4px}
  .steps{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
  .step{flex:1 1 150px;background:#fbfcfe;border:1px solid var(--line);border-radius:10px;padding:11px 13px;font-size:13px;color:var(--muted)}
  .step.done{border-color:#cfe9d8;background:#f4fbf7;color:var(--ok)}
  .step.current{border-color:#c7d8fb;background:var(--accent-soft);color:var(--accent);font-weight:500}
  .step b{display:block;color:inherit;font-weight:600;font-size:12.5px;margin-bottom:2px}
  .meta{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:8px}
  .meta div{font-size:13px}
  .meta span{display:block;color:var(--muted);font-size:12px;margin-bottom:2px}
  .doc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:44px 52px;max-width:900px;margin:0 auto;box-shadow:0 1px 3px rgba(15,23,42,.05)}
  .doc h1{font-size:18px;text-align:center;margin-bottom:20px}
  .doc .stamp{border:1px solid #f2d9a8;background:#fff7e6;color:#8a5a00;font-size:12.5px;border-radius:9px;padding:10px 13px;margin-bottom:20px}
  .doc .case{border-left:3px solid #e2e8f0;padding:0 0 0 16px;margin:0 0 20px}
  .doc .case b{display:block;margin-bottom:3px}
  .doc .case p{margin:4px 0;font-size:14px}
  .doc .case .lbl{font-weight:600}
  .doc .case .ev{color:var(--muted);font-size:12.5px}
  /* работа эксперта с черновиком: действия по замечанию, правка, флаги ревью */
  .doc .case-na{opacity:.6}
  .doc .case-acts{gap:6px;margin-top:8px;flex-wrap:wrap}
  .doc .edit-form{display:grid;gap:8px;margin-top:10px}
  .doc .edit-form label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600}
  .doc .edit-form textarea{width:100%;box-sizing:border-box;font:inherit;font-size:14px}
  .doc .review-flags{border:1px solid #f5c26b;background:#fff8eb;border-radius:8px;padding:10px 14px;margin:0 0 18px;font-size:14px}
  .doc .review-flags p{margin:6px 0}
  /* общее правило input{width:100%} растягивало галочку на всю строку: подпись уезжала вправо */
  .doc .review-flags .check{display:flex;gap:10px;align-items:center;margin:12px 0 0;padding:10px 12px;border-radius:8px;background:#fff;border:1px solid #f0c674;font-size:14px;font-weight:600;color:var(--ink);cursor:pointer}
  .doc .review-flags .check input{width:18px;height:18px;flex:none;margin:0;padding:0;accent-color:var(--accent)}
  .doc .sign{margin-top:32px;font-size:14px;color:#334155}
  .empty{color:var(--muted);font-size:14px;padding:18px 0}
  .login{position:fixed;inset:0;background:var(--navy);display:flex;align-items:center;justify-content:center;z-index:9}
  .login .box{background:#fff;border-radius:14px;padding:32px 34px 26px;width:min(430px,92vw)}
  .login .box h1{font-size:19px;margin-bottom:6px}
  .login .box .sub{margin-bottom:6px}
  aside .who button{margin-top:10px;width:100%;background:#16223a;color:#cbd5e1;padding:8px 12px;font-size:13px}
  aside .who button:hover{background:#1d2b46;color:#fff}
  .role{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11.5px;background:#1d2b46;color:#9fb3d1;margin-top:4px}

  /* таблицы и блоки доработки не должны выезжать за карточку */
  .card{overflow-x:auto}
  table th, table td{overflow-wrap:anywhere}
  tr.row-sub > td{background:#f8fafc;border-top:0;padding:10px 16px}
  .rev-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
  .rev-line button{width:auto;margin:0;padding:10px 16px}
  .rev-files{display:flex;gap:8px;flex-wrap:wrap;font-size:13px}
  /* «Исправить все замечания»: вид документа — вторичная подпись внутри кнопки */
  .revise-btn{display:inline-flex;align-items:baseline;gap:8px;background:#fff;color:#1b3a5b;
    border:1px solid #b9cde3;box-shadow:none;padding:7px 14px;font-weight:600}
  .revise-btn:hover{background:#eef4fb;border-color:#8fb2d4}
  .revise-doc{font-size:12px;font-weight:400;opacity:.7}
  /* два заключения по видам экспертизы: каждая группа — отдельная рамка */
  .dl-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:0 0 18px}
  .dl-lead{grid-column:1/-1;margin:0;font-size:13px;color:var(--muted)}
  .dl-variant{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
  .dl-variant .hint{flex:1 1 220px}
  .dl-group{border:1px solid #d6e0ee;border-radius:10px;background:#fff;padding:12px 16px}
  .dl-group h3{margin:0 0 10px;font-size:15px}
  /* файлы доработки — кнопки, а не текст со разделителями */
  .file-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border:1px solid #cfdcef;border-radius:8px;background:#fff;color:#1d3557;font:13px/1.2 inherit;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .12s ease,border-color .12s ease}
  .file-btn:hover{background:#f2f7ff;border-color:#9dbdf0;color:#12325a}
  .file-btn:active{background:#e8f1ff}
  .main-action{padding:11px 24px;font-size:15px;font-weight:600;border-radius:9px}
  .rev-files a{white-space:nowrap}
  /* заключение: шире лист, колонки таблиц предсказуемы */
  .doc{max-width:1040px}
  .doc table{table-layout:fixed}
  .doc table th:first-child{width:27%}
  .doc table th:nth-child(2){width:17%}
  .doc table th:nth-child(3){width:19%}
  /* чек-лист: узкие служебные колонки, широкий текст требования */
  /* «Критичность» не переносится и берёт ширину по содержимому (width:1% + nowrap),
     «Что проверяется» остаётся гибкой и переносится */
  .card table.checklist{table-layout:auto}
  .checklist th:nth-child(1){width:46px}
  .checklist th:nth-child(2){width:60px}
  .checklist th:nth-child(3),.checklist td:nth-child(3){width:1%;white-space:nowrap;overflow-wrap:normal}
  .checklist th:nth-child(4){width:auto}
  .checklist th:nth-child(5){width:150px}
  .checklist th:nth-child(6){width:27%}
  .checklist td{vertical-align:top}
  tr.row-link{cursor:pointer;transition:background .12s ease}
  tr.row-link:hover{background:#f6f9ff}
  tr.row-link:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;background:#f6f9ff}
  .checklist .pill{white-space:normal}
  /* статус-пилюля не должна наезжать на соседнюю колонку: переносим текст */
  .doc table td{overflow-wrap:anywhere}
  .doc table .pill{white-space:normal;max-width:100%}
  /* списки: фиксированные колонки, заголовки и даты в одну строку */
  .card table{table-layout:fixed}
  table th{white-space:nowrap}
  td.nowrap{white-space:nowrap}
  td.cell-login{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}
  .rev-files .sep{color:#cbd5e1}

  /* мобильный режим: плитки, метаданные и таблицы не должны разъезжаться */
  .doc .meta div{overflow-wrap:anywhere}
  @media (max-width: 720px){
    .wrap{padding:18px 14px 48px}
    .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .meta{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
    .doc{padding:24px 18px;max-width:100%}
    .doc table{table-layout:auto;font-size:12px}
    .doc h1{font-size:16px}
    .pill{white-space:normal;max-width:100%}
    .card table{min-width:0}
    td.cell-login{white-space:normal;overflow:visible}
    .bar{min-width:60px}
  }
  /* широкие таблицы внутри документа прокручиваются в карточке, а не ломают страницу */
  .doc{overflow-x:auto}
  @media (max-width: 720px){ .doc table{min-width:520px} }

  /* чек-лист в рабочей области уже ~770px: шесть колонок не читаются, строки становятся карточками */
  @media (max-width: 1100px){
    .checklist thead,.checklist colgroup{display:none}
    .checklist,.checklist tbody,.checklist tr,.checklist td{display:block;width:auto}
    .card table.checklist{table-layout:auto}
    .checklist td,.checklist td:nth-child(3){width:auto;border:0;padding:3px 0}
    .checklist td[data-label]:before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:2px}
    .checklist tbody tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 14px;padding:14px 0;border-top:1px solid var(--line)}
    .checklist tbody tr:first-child{border-top:0}
    .checklist td:nth-child(4),.checklist td:nth-child(5),.checklist td:nth-child(6){grid-column:1/-1}
    .checklist td:nth-child(4){margin-top:6px}
  }
  /* мобильные списки: карточки вместо сжатой таблицы */
  @media (max-width: 720px){
    .table-list thead{display:none}
    .table-list, .table-list tbody, .table-list tr, .table-list td{display:block;width:auto}
    .table-list colgroup{display:none}
    .table-list tr{padding:14px 0;border-top:1px solid var(--line)}
    .table-list tbody tr:first-child{border-top:0}
    .table-list td{border:0;padding:3px 0;white-space:normal}
    .table-list td[data-label]:before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:2px}
    .table-list tr.row-sub{border-top:0;padding:0 0 12px}
    .table-list tr.row-sub > td{background:transparent;padding:0}
    .table-list .rev-line{align-items:flex-start;flex-direction:column;gap:8px}
    /* чек-лист на телефоне: служебные поля в две колонки, тексты на всю ширину */
    .checklist tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
    .checklist td:nth-child(1),.checklist td:nth-child(2),.checklist td:nth-child(3){padding-top:0}
    .checklist td:nth-child(4),.checklist td:nth-child(5),.checklist td:nth-child(6){grid-column:1/-1}
    .checklist td:nth-child(4){margin-top:6px}
    .pill{white-space:nowrap}
  }
  @media (max-width: 720px){
    .rev-files{flex-direction:column;gap:6px}
    .dl-groups{grid-template-columns:1fr}
    /* на телефоне кнопки скачивания — в одну строку: столбиком они занимали весь первый экран */
    .dl-group .row{flex-direction:row;flex-wrap:nowrap;gap:8px}
    .dl-group .row button{flex:1;width:auto;padding:8px 6px}
    .rev-files .sep{display:none}
  }
  /* статусы в таблицах не должны наезжать на соседнюю колонку */
  .table-list .pill{white-space:normal;max-width:100%}

/* главная страница кабинета: что делаем и чем проверяем */
.about-list{margin:10px 0 0;padding-left:18px;display:grid;gap:9px;font-size:14px;line-height:1.55;color:#33415c}
.about-list li::marker{color:#2f6bff}
.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}
.metric{background:#f4f7fc;border:1px solid #e2e9f4;border-radius:12px;padding:12px;display:grid;gap:2px}
.metric b{font-size:26px;line-height:1.1;color:#0d1526}
.metric span{font-size:12px;color:#62718a}
@media (max-width:640px){.metrics{grid-template-columns:1fr}.metric{display:flex;align-items:baseline;gap:8px}}
.list-group{font-size:16px;margin:22px 0 10px}
.list-group .hint{font-weight:400;font-size:13px}

/* --- рабочее место эксперта: фильтры, список позиций, карточка, панель решения --- */
.ws{background:#fff;border:1px solid var(--line);border-radius:12px;margin:0 0 18px;box-shadow:0 1px 3px rgba(15,23,42,.05)}
.ws-filters{display:flex;flex-wrap:wrap;gap:6px;padding:12px 14px;border-bottom:1px solid var(--line)}
.ws-filters .chip,.dl-variant .chip{background:#f1f5f9;border:1px solid transparent;color:#334155;border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer}
.ws-filters .chip b{font-weight:700;margin-left:4px}
.ws-filters .chip.on,.dl-variant .chip.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.ws-body{display:grid;grid-template-columns:minmax(260px,34%) 1fr;min-height:420px}
.ws-list{border-right:1px solid var(--line);max-height:68vh;overflow:auto}
.ws-row{display:grid;grid-template-columns:44px 1fr auto;gap:8px;align-items:start;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid #eef2f7;padding:10px 12px;cursor:pointer;font:inherit;color:var(--ink);border-radius:0}
.ws-row:hover{background:#f8fafc}
.ws-row.on{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent)}
.ws-row.done .ws-t{color:var(--muted)}
.ws-n{font-weight:700;font-size:13px}
.ws-t{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ws-m{display:flex;gap:4px;align-items:center}
.ws-m i{font-style:normal;font-size:11px;font-weight:700;border-radius:4px;padding:1px 5px}
.ws-flag{background:#fde68a;color:#7c4a03}
.ws-crit{background:#fee2e2;color:#b91c1c}
.ws-lbl{color:#047857}
.ws-pane.doc{border:0;border-radius:0;box-shadow:none;padding:18px 22px;max-width:none;margin:0;max-height:68vh;overflow:auto}
.ws-status{font-size:12.5px;color:var(--muted);margin-bottom:10px;text-transform:lowercase}
.ws-bar{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;justify-content:flex-end;padding:12px 16px;border-top:1px solid var(--line);background:#fff;border-radius:0 0 12px 12px;font-size:14px}
.ws-bar > span{margin-right:auto}
.ws-check{display:flex;gap:8px;align-items:center;margin:0;font-weight:600;color:var(--ink);font-size:14px}
.ws-check input{width:18px;height:18px;margin:0;padding:0;flex:none;accent-color:var(--accent)}
.doc-details{margin:0 0 18px}
.doc-details > summary{cursor:pointer;font-weight:600;padding:10px 0;color:#334155}
@media (max-width:900px){
  .ws-body{grid-template-columns:1fr}
  .ws-list{border-right:0;border-bottom:1px solid var(--line);max-height:40vh}
  .ws-pane.doc{max-height:none;padding:14px}
  /* на телефоне панель решения — в конце рабочего места: закреплённая, она закрывала четверть экрана */
  .ws-bar{justify-content:stretch;position:static}
  .ws-bar .main-action{width:100%}
}
/* главная заказчика: главное действие и последние заявки */
.home-actions{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;justify-content:space-between;margin-top:18px}
.home-actions h3{margin:0 0 4px}
.home-actions .row{gap:10px;flex-wrap:wrap}
.home-about{margin-top:18px}
.home-about > summary{cursor:pointer;font-weight:600;padding:8px 0}
/* проверка ИИ на рабочем месте эксперта */
.ws-ai{white-space:nowrap}
.ws-m i.ai-ok{background:var(--ok-bg,#e9f7ef);color:var(--ok,#15803d)}
.ws-m i.ai-bad{background:var(--bad-bg,#fdecec);color:var(--bad,#b91c1c)}
.ws-m i.ai-warn{background:var(--warn-bg,#fdf3e3);color:var(--warn,#b45309)}
.ws-m i.ai-mute{background:var(--manual-bg,#eef2f7);color:var(--manual,#475569)}
.ai-box{border-radius:8px;padding:8px 12px;margin:0 0 10px;font-size:13.5px;border:1px solid var(--line,#e2e8f0)}
.ai-box.ai-ok{background:var(--ok-bg,#e9f7ef)}
.ai-box.ai-bad{background:var(--bad-bg,#fdecec)}
.ai-box.ai-warn{background:var(--warn-bg,#fdf3e3)}
.ai-box.ai-mute{background:var(--manual-bg,#eef2f7)}
.ai-note{font-size:13.5px;margin:0 0 10px;padding:8px 12px;border-radius:8px;background:var(--accent-soft,#eff4ff);color:var(--ink,#0f172a)}
.ai-note.ai-off{background:var(--surface,#f1f5f9);color:var(--muted,#64748b)}