:root {
  --bg:#f6f8f7; --card:#fff;
  --line:#e2e7e5; --line-strong:#c6d0cc;
  --ink:#1c2024; --muted:#6b7480;
  --acc:#1E8E5A; --acc-dark:#166b45; --acc-soft:#e8f4ee;
  --warn:#D9741C; --warn-soft:#FDF1E3; --warn-ink:#8a4b00;
  --danger:#D64545; --danger-dark:#b83a3a;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink);
       font:15px/1.5 -apple-system,Segoe UI,Roboto,Arial,sans-serif; }
.topbar { display:flex; align-items:center; gap:16px; padding:12px 24px;
          background:var(--card); border-bottom:1px solid var(--line); }
.brand { font-weight:600; text-decoration:none; color:var(--ink); }
.topbar nav { margin-left:auto; display:flex; align-items:center; gap:16px; }
main { max-width:960px; margin:0 auto; padding:24px; }
h1 { font-size:22px; } h2 { font-size:17px; margin-top:28px; }
a { color:var(--acc); }
.hint { color:var(--muted); font-size:13px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:20px; }
.narrow { max-width:380px; }
.card label { display:block; margin-bottom:14px; }
.card input[type=text], .card input[type=password], .card input[type=email] {
  display:block; width:100%; padding:8px; margin-top:4px;
  border:1px solid var(--line); border-radius:6px; }
button { padding:8px 16px; border:0; border-radius:6px; background:var(--acc);
         color:#fff; cursor:pointer; font-size:14px; }
.linklike { background:none; color:var(--acc); padding:0; }
.inline { display:inline; }
.msg { padding:10px 14px; border-radius:8px; background:#eef4ff; margin-bottom:16px; }
.msg.error { background:#ffeceb; }
.toolbar { display:flex; gap:14px; align-items:center; margin:16px 0; }
.toolbar .spacer { flex:1; }
.toolbar .active { font-weight:600; }
.tiles { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; }
.rows .tile { margin-bottom:12px; }
.tile { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; }
.tile h3 { margin:0 0 8px; font-size:16px; }
.grid { width:100%; border-collapse:collapse; background:var(--card); }
.grid th, .grid td { border:1px solid var(--line); padding:8px 10px; text-align:left; }
ul.plain, ol.stages, ul.feed { list-style:none; padding:0; }
ol.stages li, ul.feed li { background:var(--card); border:1px solid var(--line);
                           border-radius:8px; padding:10px 14px; margin-bottom:8px; }
.stage.approved { border-left:3px solid #2f9e44; }
.stage.active { border-left:3px solid var(--acc); }
.stage.rejected { border-left:3px solid var(--danger); }
.tag { background:#eef2f7; border-radius:4px; padding:1px 6px; font-size:12px; color:var(--muted); }

/* Условия согласования и отметка о правке — обязаны бросаться в глаза */
.banner { border-radius:10px; padding:14px 16px; margin:16px 0; border:1px solid; }
.banner ul { margin:8px 0 6px; padding-left:20px; }
.banner.conditions { background:var(--warn-soft); border-color:var(--warn); }
.banner.changed { background:#fdeceb; border-color:#e8a09a; }
.banner.info { background:#eef4ff; border-color:#b9cdf5; }
.banner .ok { color:#2f9e44; font-size:13px; }
.banner .warn { color:var(--warn-ink); font-size:13px; }
.badge { background:var(--warn); color:#5c3d00; border-radius:4px; padding:1px 6px; font-size:12px; }
.verdict { font-size:13px; margin-top:4px; }
li.revision { border-left:3px solid var(--warn); padding-left:8px; }
.feed .ev-condition, .feed .ev-revision { border-left:3px solid var(--warn); }
.feed .ev-decision { border-left:3px solid #2f9e44; }
.feed .ev-info_requested { border-left:3px solid var(--acc); }

/* ---- Спринт 1: формы, действия, метаданные ---- */
.crumbs { color: var(--muted); font-size: 13px; margin: 0 0 6px; }
.lead { font-size: 16px; color: #33383f; max-width: 60ch; }
.template-link { margin: 14px 0 22px; }
.template-link a { font-weight: 600; }

.form .field { margin-bottom: 16px; }
.form label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 5px; }
.form input[type=text], .form input[type=date], .form input[type=file],
.form textarea, .form select {
  width: 100%; padding: 8px 10px; border: 1px solid var(--line);
  border-radius: 6px; font: inherit; background: #fff;
}
.form textarea { resize: vertical; }
.form .hint { display: block; margin-top: 4px; }
.form .err { display: block; color: #c0392b; font-size: 13px; margin-top: 4px; }
.field.has-error input, .field.has-error textarea { border-color: #c0392b; }
.form ul { list-style: none; padding: 0; margin: 0; }
.form ul li { margin: 2px 0; }
.form ul label { display: inline; font-weight: 400; }
.actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.actions .cancel { color: var(--muted); font-size: 14px; }
button.secondary { background: #eef2f7; color: #1c1f24; }
button.danger { background: var(--danger); }
button.small { padding: 5px 12px; font-size: 13px; }
button[disabled] { opacity: .45; cursor: not-allowed; }
.danger-link { color: var(--danger); font-size: 14px; }
.withdraw { margin-top: 28px; }
.compact { padding: 14px 16px; }
.checkline { display: flex; align-items: center; gap: 8px; font-weight: 400 !important; font-size: 14px; }
.checkline input { width: auto; }

dl.meta { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 12px 0 20px;
          padding-bottom: 14px; border-bottom: 1px solid var(--line); }
dl.meta dt { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
dl.meta dd { margin: 0; font-size: 15px; }

.tile.link { display: block; text-decoration: none; color: inherit; }
.tile.link:hover { border-color: var(--acc); }
.tile.link h3 { color: var(--acc); }

.org-list li { display: flex; align-items: center; gap: 10px; padding: 10px 14px;
               background: var(--card); border: 1px solid var(--line);
               border-radius: 8px; margin-bottom: 8px; }
.org-list li.has-pending { border-left: 3px solid var(--acc); }
.counter { margin-left: auto; background: var(--acc); color: #fff;
           border-radius: 99px; padding: 1px 9px; font-size: 13px; font-weight: 600; }

.stage-top { display: flex; align-items: center; gap: 10px; }
.stage.current { box-shadow: 0 0 0 2px rgba(30,142,90,.18); }
.pill { margin-left: auto; font-size: 12px; border-radius: 99px; padding: 1px 9px;
        background: #eef2f7; color: var(--muted); }
.pill.approved { background: #e6f4ea; color: #2f9e44; }
.pill.active { background: var(--acc-soft); color: var(--acc); }
.pill.rejected { background: #fdecea; color: var(--danger); }
.verdict.v-reject { color: var(--danger); }
.verdict.v-request_info { color: var(--warn-ink); }
.current-version { background: var(--card); border: 1px solid var(--line);
                   border-radius: 8px; padding: 10px 14px; }
.files li { padding: 6px 0; }
.verdicts { border-top: 1px solid var(--line); padding-top: 14px; }

/* Радиокнопки и флажки внутри форм */
.form input[type=radio], .form input[type=checkbox] {
  width: auto; display: inline-block; margin: 0; flex: none; }
.form .field > div > div > label {
  display: flex; align-items: center; gap: 9px;
  font-weight: 400; font-size: 15px; margin-bottom: 6px; }
.form .field > div > div:last-child > label { margin-bottom: 0; }
.fieldname { display:block; font-weight:600; font-size:14px; margin-bottom:5px; }

/* Плашка режима показа — намеренно заметная, чтобы о нём не забыли */
.impersonation { background:#4a3b12; color:#ffe9a8; border-bottom:1px solid #6b551c; }
.imp-inner { max-width:960px; margin:0 auto; padding:8px 24px;
             display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:14px; }
.imp-badge { background:var(--warn); color:#3a2d08; border-radius:4px;
             padding:1px 8px; font-size:11px; font-weight:700;
             letter-spacing:.06em; text-transform:uppercase; }
.impersonation strong { color:#fff; }
.impersonation select { padding:4px 8px; border-radius:6px; border:1px solid #6b551c;
                        background:#2f2609; color:#ffe9a8; font:inherit; font-size:13px; }
button.light { background:var(--warn); color:#3a2d08; }
.switcher { margin-left:auto; }

/* ================= Спринт 1.1: меню, шапка заявки, две колонки ============ */
.topbar { gap: 22px; }
.mainnav { display: flex; align-items: center; gap: 18px; }
.mainnav a { text-decoration: none; font-weight: 600; font-size: 14.5px; }
.mainnav a:hover { text-decoration: underline; }
.nav-counter { display: inline-block; margin-left: 6px; background: var(--acc);
               color: #fff; border-radius: 99px; padding: 0 7px;
               font-size: 12px; font-weight: 700; vertical-align: 1px; }
.usernav { margin-left: auto; display: flex; align-items: center; gap: 16px; font-size: 14px; }
.usernav .who { color: var(--muted); }

main.wide { max-width: 1180px; }

.crumbs .sep { color: var(--muted); }
.backchip { margin-left: 14px; font-size: 13px; background: #eef2f7;
            border-radius: 99px; padding: 2px 10px; text-decoration: none; }
.backchip:hover { background: #dfeee7; }

.ticket-title { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 6px 0 18px; }
.ticket-title h1 { margin: 0; }
.status-pill { display: inline-block; border-radius: 99px; padding: 2px 12px;
               font-size: 13px; font-weight: 600; background: #eef2f7; color: #445; }
.status-pill.big { font-size: 14px; padding: 5px 16px; }
.status-pill.s-on_approval { background: var(--acc-soft); color: var(--acc-dark); }
.status-pill.s-in_progress { background: var(--warn-soft); color: var(--warn-ink); }
.status-pill.s-done { background: #e6f4ea; color: #23703a; }
.status-pill.s-rejected { background: #fdecea; color: #b3241f; }
.status-pill.s-cancelled { background: #eceff2; color: #5c6570; }
.status-pill.s-info { background: #fdf0e0; color: #8a4b00; }

.ticket-grid { display: grid; grid-template-columns: minmax(0,1fr) 260px; gap: 28px; align-items: start; }
.ticket-main { min-width: 0; }
.ticket-main h2:first-child { margin-top: 0; }

.ticket-side { position: sticky; top: 16px; display: flex; flex-direction: column; gap: 14px; }
.side-block { background: var(--card); border: 1px solid var(--line);
              border-radius: 10px; padding: 14px 16px; }
.side-block h3 { margin: 0 0 10px; font-size: 13px; text-transform: uppercase;
                 letter-spacing: .05em; color: var(--muted); font-weight: 700; }
.side-meta { margin: 0; font-size: 14px; }
.side-meta dt { color: var(--muted); font-size: 12px; margin-top: 8px; }
.side-meta dt:first-child { margin-top: 0; }
.side-meta dd { margin: 1px 0 0; }
.side-current { background: var(--acc-soft); border-radius: 6px; padding: 8px 10px; margin-bottom: 10px;
                font-size: 13.5px; word-break: break-word; }
.side-label { display: block; font-size: 11px; text-transform: uppercase;
              letter-spacing: .05em; color: var(--muted); margin-bottom: 2px; }
.side-files { list-style: none; padding: 0; margin: 0; font-size: 13.5px; }
.side-files li { padding: 7px 0; border-top: 1px solid var(--line); word-break: break-word; }
.side-files li:first-child { border-top: 0; }
.side-files li.revision { border-left: 3px solid var(--warn); padding-left: 8px; }
.side-files .hint { display: block; font-size: 12px; margin-top: 2px; }
.side-action { display: inline-block; margin-top: 10px; font-size: 13.5px; }

.side-stages { list-style: none; padding: 0; margin: 0; }
.side-stages .st { border-left: 3px solid var(--line); padding: 8px 0 8px 10px;
                   margin-bottom: 6px; font-size: 13.5px; }
.side-stages .st:last-child { margin-bottom: 0; }
.side-stages .st-name { font-weight: 600; }
.side-stages .hint { font-size: 12px; }
.side-stages .st.approved { border-left-color: #2f9e44; }
.side-stages .st.active { border-left-color: var(--acc); background: #f4f8ff; border-radius: 0 6px 6px 0; }
.side-stages .st.rejected { border-left-color: var(--danger); }
.side-stages .st.pending { opacity: .65; }
.st-verdict { font-size: 12.5px; margin-top: 3px; color: #2f9e44; }
.st-verdict.v-reject { color: var(--danger); }
.st-verdict.v-request_info { color: var(--warn-ink); }

.ack-inline { background: var(--warn-soft); border: 1px solid var(--warn); border-radius: 8px;
              padding: 12px 14px; margin-bottom: 18px; }
.ack-title { font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.ack-inline ul { margin: 0 0 8px; padding-left: 20px; font-size: 14px; }
.ack-check { font-weight: 600 !important; }

@media (max-width: 900px) {
  .ticket-grid { grid-template-columns: 1fr; }
  .ticket-side { position: static; }
  .topbar { flex-wrap: wrap; }
}

/* ============== Спринт 1.2: ветки, роли, файлы-плитки, запрос ============== */
.orgname { color: var(--muted); text-decoration: none; font-size: 14px;
           border-left: 1px solid var(--line); padding-left: 16px; }
.orgname:hover { color: var(--ink, #1c1f24); }
.nav-counter.attention { background: var(--warn); }

/* Рассмотреть: строка-ветка кликабельна целиком */
.branch-list li { margin-bottom: 8px; }
.branch-list a { display: flex; align-items: center; gap: 10px;
                 padding: 14px 16px; background: var(--card);
                 border: 1px solid var(--line); border-left: 3px solid var(--acc);
                 border-radius: 8px; text-decoration: none; color: inherit; }
.branch-list a:hover { background: #f3faf6; border-color: var(--acc); }
.branch-name { font-weight: 600; font-size: 15.5px; }
.branch-name .hint { font-weight: 400; }
.branch-list .counter { margin-left: auto; }
.branch-list .empty { color: var(--muted); }
.fresh-dot { background: var(--warn); color: #fff; border-radius: 99px;
             padding: 1px 8px; font-size: 11px; font-weight: 700;
             text-transform: uppercase; letter-spacing: .04em; }
.fresh-dot.small { display: inline-block; width: 8px; height: 8px; padding: 0;
                   border-radius: 50%; }
td.mark { width: 18px; }

.flag { display: inline-block; background: var(--acc-soft); color: var(--acc-dark);
        border-radius: 4px; padding: 1px 7px; font-size: 11.5px; font-weight: 600;
        margin-left: 6px; vertical-align: 1px; }
.flag.warnflag { background: var(--warn-soft); color: var(--warn-ink); }

/* Обсуждение: кто и в какой роли */
.who-line { display: flex; align-items: center; gap: 9px; flex-wrap: wrap;
            margin-bottom: 3px; }
.who-line strong { font-size: 14.5px; }
.role { font-size: 11.5px; color: var(--muted); background: #eef2f7;
        border-radius: 4px; padding: 1px 7px; }

/* Файлы плитками */
.file-tiles { display: flex; flex-wrap: wrap; gap: 8px; }
.file { flex: none; }
.file summary { list-style: none; cursor: pointer; }
.file summary::-webkit-details-marker { display: none; }
.file .ext { display: flex; align-items: center; justify-content: center;
             width: 52px; height: 58px; border: 1px solid var(--line-strong);
             border-radius: 6px; background: #fff; font-size: 11px; font-weight: 700;
             color: #55606b; letter-spacing: .03em; }
.file:hover .ext { border-color: var(--acc); color: var(--acc); }
.file.revision .ext { border-color: var(--warn); color: var(--warn-ink); background: var(--warn-soft); }
.file[open] .ext { border-color: var(--acc); box-shadow: 0 0 0 2px rgba(30,142,90,.18); }
.file[open] { width: 100%; }
.file-info { margin-top: 8px; font-size: 13.5px; word-break: break-word; }
.file-info .hint { display: block; margin-top: 3px; font-size: 12px; }
.side-current-line { margin: 12px 0 0; font-size: 13px; word-break: break-word; }

details.upload { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
details.upload > summary { cursor: pointer; font-size: 13.5px; color: var(--acc); }
.side-form { margin-top: 10px; }
.side-form .field { margin-bottom: 10px; }
.side-form input[type=text], .side-form input[type=file] { font-size: 12.5px; }
.side-form .checkline { font-size: 12.5px; }

/* Запрос информации отдельной строкой и в своём окне */
.askrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 12px 0 4px; }
.ask-dialog { border: 1px solid var(--line-strong); border-radius: 10px;
              padding: 20px 22px; max-width: 460px; width: calc(100% - 32px); }
.ask-dialog::backdrop { background: rgba(20,28,38,.45); }
.ask-dialog h3 { margin: 0 0 6px; font-size: 17px; }
.ask-dialog textarea { width: 100%; margin-top: 12px; padding: 8px 10px;
                       border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.ask-dialog .actions { margin-top: 14px; }

/* ==================== Спринт 2: доска и кабинет куратора ================== */
.orgname img { height: 22px; width: auto; vertical-align: -5px; margin-right: 7px; }

.tabs { display: flex; align-items: center; gap: 4px; margin: 18px 0 22px;
        border-bottom: 1px solid var(--line); }
.tabs a { padding: 8px 14px; text-decoration: none; color: var(--muted);
          font-size: 14.5px; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.tabs a:hover { color: #1c1f24; }
.tabs a.active { color: var(--acc); border-bottom-color: var(--acc); font-weight: 600; }
.tabs .spacer { flex: 1; }

.two-col { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); gap: 28px;
           align-items: start; }
.two-col h2:first-child { margin-top: 0; }
.rowactions { line-height: 1.8; }
.rowactions form { display: inline; }
.rowactions .linklike { font-size: 13px; }
.rowactions form + form::before { content: "·"; color: var(--line-strong); margin: 0 6px; }
.tag.curator { background: var(--acc-soft); color: var(--acc-dark); }
.tag.on { background: #e6f4ea; color: #23703a; }
.tag.off { background: #f3f4f6; color: #5c6570; }

/* Доска */
.board { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
.col { flex: 0 0 250px; background: #eef1f5; border-radius: 10px; padding: 10px; }
.col.done { background: #e9f2ec; }
.col-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; padding: 0 2px; }
.col-name { font-size: 13px; font-weight: 700; text-transform: uppercase;
            letter-spacing: .04em; color: #4a5560; line-height: 1.25; }
.col-count { margin-left: auto; background: #fff; border-radius: 99px;
             padding: 0 8px; font-size: 12px; font-weight: 700; color: #4a5560; }
.col-body { display: flex; flex-direction: column; gap: 8px; }
.bcard { display: block; background: #fff; border: 1px solid var(--line);
         border-radius: 8px; padding: 10px 12px; text-decoration: none; color: inherit; }
.bcard:hover { border-color: var(--acc); }
.bkey { display: block; font-size: 12px; font-weight: 700; color: var(--acc); }
.btitle { display: block; font-size: 13.5px; margin-top: 2px; }
.bcard.waiting { border-left: 3px solid var(--warn); }
.bcard.s-rejected { border-left: 3px solid var(--danger); }
.bcard.s-cancelled { border-left: 3px solid #9aa4ae; }
.bcard.s-done { border-left: 3px solid #2f9e44; }
.col-body .empty { padding: 6px 2px; font-size: 13px; }
.archive-link { display: block; text-align: center; font-size: 13px; padding: 6px; }

@media (max-width: 900px) { .two-col { grid-template-columns: 1fr; } }

details.addbox { margin-bottom: 20px; }
details.addbox > summary { cursor: pointer; display: inline-block; font-weight: 600;
                           color: var(--acc); font-size: 14.5px; padding: 4px 0; }
.addform { max-width: 460px; margin-top: 12px; }
.grid.members td { vertical-align: top; }
.grid.members td:first-child { width: 30%; }
.logo-preview { height: 34px; width: auto; vertical-align: -10px; margin-left: 6px;
                background: #fff; border: 1px solid var(--line); border-radius: 4px;
                padding: 2px 4px; }

/* ---- Спринт 2.1: задержки и вмешательство куратора ---- */
.banner.stuck { background: var(--warn-soft); border-color: var(--warn); }
.banner.stuck strong { display: block; margin-bottom: 4px; }
.banner.stuck form { margin-top: 8px; }
.flag.curatorflag { background: var(--warn-soft); color: var(--warn-ink); }
.stuck-hint { margin: 14px 0; }
details.stuckbox, details.curatorbox { margin: 14px 0; }
details.stuckbox > summary { cursor: pointer; color: var(--warn-ink); font-size: 14px; }
details.curatorbox > summary { cursor: pointer; color: var(--warn-ink); font-weight: 600; font-size: 14.5px; }
details.curatorbox .card { margin-top: 10px; border-left: 3px solid var(--warn); }
.curator-close { border-top: 1px solid var(--line); padding-top: 12px; margin-top: 12px; }
.curator-close .linklike { font-size: 14px; }
.assignments { margin: 4px 0 0; padding: 0; list-style: none; font-size: 12.5px; }
.assignments li { color: var(--muted); }
.assignments .st { color: #1c1f24; }

/* ---- Фирменные цвета: белая основа, зелёный и оранжевый акценты ---- */
.brand { display: inline-flex; align-items: center; gap: 8px; }
.brandmark { width: 22px; height: 22px; }
.badge { background: var(--warn-soft); color: var(--warn-ink); }
.status-pill.s-in_progress { background: var(--warn-soft); color: var(--warn-ink); }
.status-pill.s-on_approval { background: var(--acc-soft); color: var(--acc-dark); }
.status-pill.s-info { background: var(--warn-soft); color: var(--warn-ink); }
.flag { background: var(--warn-soft); color: var(--warn-ink); }
.flag.warnflag { background: var(--warn-soft); color: var(--warn-ink); }
.flag.curatorflag { background: var(--acc-soft); color: var(--acc-dark); }
.tag.curator { background: var(--acc-soft); color: var(--acc-dark); }
.pill.active { background: var(--acc-soft); color: var(--acc-dark); }
.ack-inline { background: var(--warn-soft); border-color: var(--warn); }
.banner.conditions { background: var(--warn-soft); border-left-color: var(--warn); }
.banner.info { background: var(--acc-soft); border-left-color: var(--acc); }
.banner.stuck { background: var(--warn-soft); border-color: var(--warn); }
details.curatorbox > summary { color: var(--acc-dark); }
details.curatorbox .card { border-left-color: var(--acc); }
/* На наведении цвет кнопки не меняется — только текст белеет и появляется ободок */
button:hover { color: #fff; box-shadow: 0 0 0 3px rgba(30,142,90,.18); }
button.secondary:hover { background: var(--acc); color: #fff; }
button.danger:hover { box-shadow: 0 0 0 3px rgba(214,69,69,.18); }
button.light:hover { color: #3a2d08; box-shadow: 0 0 0 3px rgba(224,122,31,.25); }
button[disabled]:hover { color: inherit; box-shadow: none; }
.linklike:hover { color: var(--acc-dark); box-shadow: none; }
.danger-link:hover { color: #b83a3a; box-shadow: none; }
.col.done { background: var(--acc-soft); }

/* Выбор действия в блоке куратора */
.choice { border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px;
          margin-bottom: 12px; }
.choice > .checkline { font-weight: 600 !important; margin-bottom: 8px; }
.choice-control { margin-left: 26px; }
select.choice-control { width: calc(100% - 26px); padding: 8px 10px;
                        border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.choice .hint { display: block; margin: 6px 0 0 26px; }
.outcomes { display: flex; gap: 18px; flex-wrap: wrap; }
.outcomes .checkline { font-weight: 400 !important; }
input[type=radio], input[type=checkbox] { accent-color: var(--acc); }
.status-pill.s-in_progress, .status-pill.s-info { border: 1px solid var(--warn); }

/* ---------------- Спринт 3: редактор маршрута ---------------- */
.stages-editor { margin-top: 18px; }
.stage-card { background: var(--card); border: 1px solid var(--line);
              border-left: 3px solid var(--acc); border-radius: 10px;
              padding: 14px 16px; margin-bottom: 12px; }
.stage-card.off { border-left-color: var(--line-strong); background: #fbfcfc; }
.stage-head { display: flex; align-items: center; gap: 12px; }
.stage-num { flex: none; width: 26px; height: 26px; border-radius: 50%;
             background: var(--acc-soft); color: var(--acc-dark);
             display: inline-flex; align-items: center; justify-content: center;
             font-size: 13px; font-weight: 700; }
.stage-card.off .stage-num { background: #eef1f0; color: var(--muted); }
.stage-name { flex: 1; }
.stage-name input { width: 100%; padding: 7px 10px; border: 1px solid var(--line);
                    border-radius: 6px; font: inherit; font-weight: 600; }
.stage-tools { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.stage-tools .linklike { font-size: 13px; }
.stage-tools .linklike[disabled] { opacity: .3; cursor: default; }

.stage-body { display: grid; grid-template-columns: 260px minmax(0, 1fr);
              gap: 20px; margin-top: 12px; padding-left: 38px; }
.stage-body label { display: block; font-size: 13px; color: var(--muted);
                    margin-bottom: 4px; }
.stage-body label.mt { margin-top: 12px; }
.stage-body select, .stage-body input[type=text] { width: 100%; padding: 7px 10px;
        border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.stage-body .checkline { font-size: 14px; color: var(--ink); }
.stage-body .hint { display: block; margin-top: 5px; }
.approvers { max-height: 132px; overflow-y: auto; border: 1px solid var(--line);
             border-radius: 6px; padding: 8px 10px; background: #fff; }
.approvers ul { list-style: none; margin: 0; padding: 0; }
.approvers li { margin: 3px 0; }
.approvers label { display: flex; align-items: center; gap: 8px; margin: 0;
                   font-size: 14px; color: var(--ink); cursor: pointer; }
.approvers input { flex: none; }

.sticky-save { position: sticky; bottom: 0; background: var(--bg);
               padding: 14px 16px; margin: 4px -16px 0;
               border-top: 1px solid var(--line-strong);
               box-shadow: 0 -6px 14px rgba(20,30,25,.06); }

@media (max-width: 900px) {
  .stage-body { grid-template-columns: 1fr; padding-left: 0; }
  .stage-head { flex-wrap: wrap; }
}

/* ---- Поиск людей вместо списка галочек ---- */
.picker { position: relative; }
.picker-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.chip { display: inline-flex; align-items: center; gap: 6px; background: var(--acc-soft);
        color: var(--acc-dark); border-radius: 99px; padding: 3px 6px 3px 11px;
        font-size: 13.5px; }
.chip-x { background: none; border: 0; color: var(--acc-dark); cursor: pointer;
          font-size: 15px; line-height: 1; padding: 0 4px; border-radius: 99px; }
.chip-x:hover { background: rgba(30,142,90,.18); color: var(--acc-dark); box-shadow: none; }
.picker-input { width: 100%; padding: 7px 10px; border: 1px solid var(--line);
                border-radius: 6px; font: inherit; }
.picker-results { position: absolute; z-index: 20; left: 0; right: 0; top: 100%;
                  margin-top: 4px; background: #fff; border: 1px solid var(--line-strong);
                  border-radius: 8px; box-shadow: 0 8px 20px rgba(20,30,25,.12);
                  max-height: 240px; overflow-y: auto; }
.picker-row { display: block; width: 100%; text-align: left; background: none;
              border: 0; border-bottom: 1px solid var(--line); padding: 8px 12px;
              cursor: pointer; color: var(--ink); border-radius: 0; }
.picker-row:last-child { border-bottom: 0; }
.picker-row:hover { background: var(--acc-soft); color: var(--ink); box-shadow: none; }
.picker-row strong { display: block; font-size: 14px; }
.picker-row span { display: block; font-size: 12px; color: var(--muted); }
.picker-none { padding: 10px 12px; font-size: 13.5px; color: var(--muted); }
.approvers { display: none; }

/* ---- Стадия подачи и боковые стадии ---- */
.section-title { font-size: 13px; font-weight: 700; text-transform: uppercase;
                 letter-spacing: .05em; color: var(--muted); margin: 22px 0 10px; }
.section-title .hint { text-transform: none; letter-spacing: 0; font-weight: 400;
                       margin-left: 8px; }
.stage-card.submission { border-left-color: var(--warn); }
.stage-card.submission .stage-num { background: var(--warn-soft); color: var(--warn-ink); }
.stage-card.side { border-left-style: dashed; }
.stage-card.side .stage-num { background: #eef1f0; color: var(--muted); }
.stage-col ul { list-style: none; padding: 0; margin: 0; }
.stage-col ul label { display: flex; align-items: center; gap: 8px; font-size: 14px;
                      color: var(--ink); margin: 4px 0; }
.ask-dialog select { width: 100%; padding: 8px 10px; margin-top: 6px;
                     border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.ask-dialog label { display: block; font-size: 13px; color: var(--muted); margin-top: 10px; }
.banner.sideway { background: #f2f0fa; border-left-color: #7c67d6; }
.banner.sideway strong { display: block; margin-bottom: 4px; }

/* ---- Срок действия и пересмотр доступа ---- */
.banner.recert { background: var(--warn-soft); border-left-color: var(--warn); }
.banner.recert strong { display: block; margin-bottom: 4px; }
.banner.recert form { margin-top: 8px; display: flex; gap: 8px; }
.termrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
           border-top: 1px solid var(--line); padding-top: 14px; }
.termrow .fieldname { margin: 0; }
.ask-dialog input[type=date] { width: 100%; padding: 8px 10px; margin-top: 12px;
                               border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.feed .ev-recert, .feed .ev-recert_manager, .feed .ev-expired { border-left: 3px solid var(--warn); }

/* ===== Спринт 5: рамка особых указаний, прогресс кворума ================== */
/* Условие словами и срок — распоряжения одного рода, и рамка это показывает */
.extras-frame { background: var(--warn-soft); border: 1px solid var(--warn);
                border-radius: 8px; padding: 12px 14px; margin-bottom: 18px; }
.extras-frame > .ack-title { margin-bottom: 10px; }
.extras-frame .ack-title .hint { font-weight: 400; }
.extras-frame .field:last-child { margin-bottom: 0; }
.extras-frame textarea, .extras-frame input[type=text] { background: #fff; }
/* Таймер исполнителю — жирным: его теряют чаще, чем условие словами */
.ack-term { font-weight: 700; font-size: 14.5px; margin: 0 0 8px; }

/* Стадия «нужны все»: часть виз собрана — оранжевый, «в процессе» */
.side-stages .st.partial { border-left-color: var(--warn); background: var(--warn-soft);
                           border-radius: 0 6px 6px 0; }
.st-quorum { font-size: 12.5px; margin-top: 3px; color: var(--warn-ink); font-weight: 600; }

/* Приглашение подать заявку со страницы «Мои заявки» */
.portal-links { display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
                margin: 0 0 18px; }
.button-link { display:inline-block; padding:8px 16px; border-radius:6px;
               background:var(--acc); color:#fff; text-decoration:none; font-size:14px; }
.button-link:hover { color:#fff; box-shadow:0 0 0 3px rgba(30,142,90,.18); }

/* Правило заполнения стадии: поимённо или «руководитель инициатора» */
.source-choice ul { list-style: none; padding: 0; margin: 0 0 10px; }
.source-choice label { display: inline; font-weight: 400; font-size: 13.5px; }
.source-choice input { width: auto; margin-right: 6px; }
.people-box.muted { opacity: .4; }
.mgr-hint { display: block; margin-top: 8px; }

/* Фильтр архива решений — одной строкой, чтобы не занимал пол-экрана */
.filterbar { display: flex; align-items: flex-end; gap: 14px; flex-wrap: wrap;
             margin-bottom: 18px; }
.filterbar .field { margin: 0; }
.filterbar .field label { display: block; font-size: 12px; color: var(--muted);
                          text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.filterbar input { padding: 8px; border: 1px solid var(--line); border-radius: 6px;
                   font-size: 14px; }
.filterbar .field.narrowdate input { width: 165px; }
.filterbar .actions { margin: 0; }

/* Кабинет куратора: почта */
.mailactions { margin: 18px 0 8px; }

/* «Рассмотреть»: оба списка на одном экране */
h2.first { margin-top: 18px; }
.grid tr.row-fresh td { background: #f4f8ff; }
.free { color: var(--warn-ink); }

/* Распоряжения исполнителю: срок и условие одним списком, одним шрифтом */
.ack-list { list-style: none; margin: 0 0 10px; padding: 0; font-size: 14.5px; }
.ack-list li { margin: 4px 0; line-height: 1.5; }
.ack-list .marker { font-weight: 700; margin-right: 4px; }
.ack-list .hint { margin-left: 4px; }
/* Само время действия доступа — единственное, что выделено цветом */
.term-when { color: var(--danger); font-weight: 700; }
.takerow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.takerow .hint { flex: 1 1 340px; }

/* Норматив времени (SLA) */
.sla-summary { border: 1px solid var(--line); border-left: 3px solid var(--acc);
               border-radius: 8px; padding: 12px 16px; margin-bottom: 18px;
               background: var(--card); }
.sla-summary .hint { margin-top: 4px; }
.sla-ok { color: #2f9e44; font-weight: 600; }
.sla-late { color: var(--danger); font-weight: 600; }
.sla-timer { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
             border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px;
             margin-bottom: 16px; background: var(--card); font-size: 14px; }
.sla-timer.late { border-color: var(--danger); background: #fdecea; }
.sla-timer.ok { border-color: #bfe3cd; background: var(--acc-soft); }
.st-sla { font-size: 12.5px; margin-top: 3px; }

/* Отзыв выданного доступа — то же исполнение со знаком минус */
.banner.revoke { background: #fdecea; border-left-color: var(--danger); }
.badge.revoke { background: var(--danger); color: #fff; }
.status-pill.s-revoking { background: #fdecea; color: var(--danger); }
.status-pill.s-revoked { background: #eef2f7; color: #1c1f24; }
.side-stages .st.revocation { border-left-color: var(--danger); }
.sla-fields { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
              margin: 10px 0 8px; }
.sla-fields label { font-size: 13.5px; font-weight: 600; margin: 0; }
.sla-fields input[type=number] { width: 90px; padding: 6px 8px;
              border: 1px solid var(--line); border-radius: 6px; }

/* Рабочее время — одна настройка из двух полей */
.worktime-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
                margin-top: 4px; }
.worktime-row input[type=time] { width: auto; padding: 8px;
                border: 1px solid var(--line); border-radius: 6px; }
.worktime-row .dash { color: var(--muted); }
.worktime-row .hint { flex: 1 1 260px; }

/* ===================== Отчёты ============================================= */
/* Статусные цвета графиков живут отдельно от красного в интерфейсе: пара
   «уложились / не уложились» обязана различаться при дальтонизме, и она
   подобрана под это, а не под кнопки. Разница подтверждена расчётом, но
   в 6–8 попадает впритык — поэтому обе доли ВСЕГДА подписаны словами. */
:root { --chart-ok: #1E8E5A; --chart-late: #9E3A55; --chart-grid: #E4EAE7; }

.period-note { max-width: 74ch; margin: -6px 0 22px; }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
         gap: 14px; margin-bottom: 26px; }
.tile { border: 1px solid var(--line); border-radius: 8px; background: var(--card);
        padding: 14px 16px; }
.tile .num { display: block; font-size: 26px; font-weight: 700; line-height: 1.1;
             font-variant-numeric: tabular-nums; }
.tile .cap { display: block; font-size: 12.5px; color: var(--muted); margin-top: 4px; }
.tile.quiet .num { color: var(--muted); }

/* Плитка-галочка: цифра и фильтр — одно и то же действие над одними и теми же
   заявками, поэтому и элемент один. Цветная полоса слева связывает плитку с
   линией на графике; снятая галочка гасит и то, и другое. */
.tile.pick { display: block; cursor: pointer; position: relative;
             padding-left: 18px; user-select: none; }
.tile.pick::before { content: ""; position: absolute; left: 0; top: -1px; bottom: -1px;
                     width: 4px; border-radius: 8px 0 0 8px; background: var(--c); }
.tile.pick input { position: absolute; top: 12px; right: 12px; margin: 0;
                   width: auto; cursor: pointer; }
.tile.pick .num { padding-right: 22px; }
.tile.pick .swatch { display: block; height: 12px; margin-top: 8px; }
.tile.pick:hover { border-color: var(--c); }
/* Выключенная плитка не исчезает: ноль заявок и «спрятал линию» — разные вещи,
   и цифра должна остаться читаемой.
   Содержимое гасим соседним селектором — он работает везде; полосу слева гасит
   :has(), и если браузер его не знает, теряется только оттенок полосы. */
.tile.pick input:not(:checked) ~ * { opacity: .45; }
.tile.pick:has(input:not(:checked)) { background: var(--bg); }
.tile.pick:has(input:not(:checked))::before { background: var(--muted); }

/* Готовые периоды */
.filterbar.periods { padding-block: 12px; gap: 8px; align-items: center; }
.plabel { font-size: 12px; color: var(--muted); text-transform: uppercase;
          letter-spacing: .04em; margin-right: 4px; }
.pbtn { display: inline-block; padding: 6px 14px; border: 1px solid var(--line);
        border-radius: 6px; font-size: 14px; text-decoration: none;
        color: var(--ink); background: var(--card); }
.pbtn:hover { border-color: var(--acc); color: var(--acc-dark); }
.pbtn.on { background: var(--acc); border-color: var(--acc); color: #fff; }
.pbtn.on:hover { color: #fff; }

.chart { border: 1px solid var(--line); border-radius: 8px; background: var(--card);
         padding: 16px 18px 12px; margin-bottom: 22px; }
.chart-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
              margin-bottom: 14px; }
.chart-title { font-weight: 600; font-size: 14.5px; }
/* Свои имена, а не .col: на доске заявок класс с таким именем уже есть,
   и колонки графика подхватывали его фон. */
.columns { display: flex; align-items: flex-end; gap: 6px; overflow-x: auto;
           height: 190px; padding-bottom: 2px; }
.chart-col { flex: 1 1 26px; min-width: 26px; height: 100%; display: flex;
             flex-direction: column; align-items: center; justify-content: flex-end;
             background: none; padding: 0; }
.chart-col .val { font-size: 12px; color: var(--muted); margin-bottom: 3px;
                  font-variant-numeric: tabular-nums; }
.chart-col .bar { width: 100%; background: var(--acc); border-radius: 4px 4px 0 0;
                  display: block; }
.chart-col .bar.any { min-height: 3px; }
.chart-col .tick { font-size: 11px; color: var(--muted); margin-top: 6px;
                   border-top: 1px solid var(--chart-grid); width: 100%;
                   text-align: center; padding-top: 4px; }

.split { display: flex; gap: 2px; height: 10px; border-radius: 5px;
         overflow: hidden; background: var(--line); max-width: 320px; }
.split .seg { display: block; height: 100%; }
.split .seg.ok { background: var(--chart-ok); }
.split .seg.late { background: var(--chart-late); }
.split-legend { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px;
                font-size: 12.5px; }
.lg { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); }
.lg::before { content: ""; width: 9px; height: 9px; border-radius: 2px; }
.lg.ok::before { background: var(--chart-ok); }
.lg.late::before { background: var(--chart-late); }
.lg.late { color: var(--chart-late); font-weight: 600; }

.num-cell { font-variant-numeric: tabular-nums; }
.inbar { display: block; height: 4px; border-radius: 2px; background: var(--line);
         margin-top: 6px; max-width: 220px; }
.inbar span { display: block; height: 100%; border-radius: 2px; background: var(--acc); }
.w-third { width: 34%; } .w-half { width: 38%; }
.narrow-table { max-width: 460px; }
.exportline { margin: 10px 0 30px; font-size: 14px; }
.filterbar select { padding: 8px; border: 1px solid var(--line); border-radius: 6px;
                    font-size: 14px; background: var(--card); color: var(--ink); }

/* ---------- График движения заявок ---------- */
.plot { width: 100%; }
.plot svg { display: block; max-width: 100%; }
.series-toggle { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 12px; }
.lgs { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px;
       cursor: pointer; font-weight: 400; margin: 0; }
.lgs input { width: auto; margin: 0; }
.lgs .swatch { width: 20px; height: 0; border-top: 2px solid var(--c);
               display: inline-block; }
.lgs .swatch[data-dash="6 3"] { border-top-style: dashed; }
.lgs .swatch[data-dash="2 3"] { border-top-style: dotted; }
.lgs .swatch[data-dash="8 3 2 3"] { border-top-style: dashed; }
/* Когда скрипт нарисовал образец, рамка-заглушка больше не нужна. */
.lgs .swatch.drawn { width: 26px; height: 12px; border-top: 0;
                     vertical-align: middle; }
.lgs input:not(:checked) ~ * { opacity: .45; }
.asdata { margin-top: 12px; font-size: 13.5px; }
.asdata summary { cursor: pointer; color: var(--acc-dark); }
.scrollx { overflow-x: auto; }
.grid.mini td, .grid.mini th { padding: 5px 9px; font-size: 13px; }
.printhead { display: none; }

/* ---------- Печать: то же, что на экране, но без интерфейса ----------
   Отдельный PDF-движок на сервере тянул бы за собой тяжёлые зависимости
   ради того, что браузер и так умеет. Печать даёт настоящий PDF на
   несколько десятков килобайт — текст остаётся текстом, а не картинкой. */
@media print {
  @page { size: A4 portrait; margin: 14mm 12mm; }
  .topbar, .tabs, .filterbar, .impersonation, .exportline, .asdata,
  .msg, #print-report, .crumbs { display: none !important; }
  .printhead { display: block; margin-bottom: 14px; padding-bottom: 8px;
               border-bottom: 1px solid #999; }
  .printhead strong { display: block; font-size: 17px; }
  .printhead span { font-size: 12px; color: #444; }
  body { background: #fff; color: #000; }
  main, main.wide { max-width: none; padding: 0; }
  h1 { display: none; }
  h2 { font-size: 15px; margin: 16px 0 8px; }
  .card, .chart, .tile { border-color: #bbb; box-shadow: none; }
  .tiles { grid-template-columns: repeat(6, 1fr); gap: 8px; }
  .tile .num { font-size: 19px; }
  .tile .cap { font-size: 10px; }
  .grid td, .grid th { padding: 4px 6px; font-size: 10.5px; }
  .chart, table, .split-legend, tr { break-inside: avoid; }
  .hint { color: #555; }
  a { text-decoration: none; color: inherit; }
  /* Полоса прокрутки на бумаге обрезала бы правые столбцы. */
  .scrollx { overflow: visible; }
  /* Правая рамка таблицы иначе приходится ровно на обрез страницы. */
  .grid { table-layout: auto; width: calc(100% - 2px); }
  .w-third { width: 26%; } .w-half { width: 34%; }
  /* Галочки-фильтры — орган управления, а не содержание отчёта: в файле,
     который передают другому человеку, они только сбивают с толку. */
  .tile.pick input { display: none; }
  .tile.pick .num { padding-right: 0; }
  .lgs { font-size: 11px; }
  /* Подсказка «снимите галочку» на бумаге бессмысленна; оговорка о том,
     как считаются цифры, наоборот — нужна получателю файла. */
  .chart-head .hint, .print-note { display: none; }
}

/* ---------- Таблица правил ----------
   Ввод переменного объёма: строк столько, сколько нужно заявителю. Ячейка —
   многострочная намеренно: перечень адресов должен быть виден целиком, а не
   уезжать за правый край однострочного поля. */
.tablefield { margin-top: 6px; }
.rules { width: 100%; border-collapse: collapse; min-width: 640px; }
.rules th { text-align: left; font-size: 13px; padding: 0 8px 6px 0;
            vertical-align: bottom; font-weight: 600; }
.rules th .hint { display: block; font-weight: 400; font-size: 11.5px;
                  margin-top: 2px; }
.rules th .req { color: var(--danger); margin-left: 2px; }
.rules td { padding: 0 8px 8px 0; vertical-align: top; }
.rules textarea { width: 100%; min-width: 130px; padding: 7px 8px; font-size: 14px;
                  border: 1px solid var(--line); border-radius: 6px;
                  font-family: inherit; resize: vertical; background: var(--card);
                  color: var(--ink); }
.rules textarea:focus { border-color: var(--acc); outline: none;
                        box-shadow: 0 0 0 2px var(--acc-soft); }
.rules .rownum { padding-top: 10px; color: var(--muted); font-size: 13px;
                 font-variant-numeric: tabular-nums; }
.rules .rowacts { padding-top: 6px; }
.rules .rowacts button { background: none; border: 0; color: var(--muted);
                         cursor: pointer; font-size: 15px; line-height: 1;
                         padding: 4px 5px; box-shadow: none; }
.rules .clone:hover { color: var(--acc); background: none; box-shadow: none; }
.rules .drop:hover { color: var(--danger); background: none; box-shadow: none; }
.w-num { width: 1%; white-space: nowrap; }
.ruleacts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
            margin-top: 4px; }

/* Показ согласующему: каждый объект отдельной строчкой, как его и вводили */
.rules-view .rownum { color: var(--muted); font-variant-numeric: tabular-nums; }
.rules-view ul.objects { list-style: none; margin: 0; padding: 0; }
.rules-view ul.objects li { font-variant-numeric: tabular-nums; }
.rules-view td { vertical-align: top; }

/* Редактор колонок в настройках ветки */
.grid.cols input[type=text] { width: 100%; padding: 6px 8px; font-size: 13.5px;
                              border: 1px solid var(--line); border-radius: 6px;
                              background: var(--card); color: var(--ink); }
.grid.cols input.tiny { width: 52px; padding: 6px; font-size: 13.5px;
                        border: 1px solid var(--line); border-radius: 6px;
                        background: var(--card); color: var(--ink); }
.grid.cols tr.fresh td { background: var(--bg); }

/* Состояние настройки: видно прямо там, где её меняют */
.state { font-size: 13.5px; margin: 0 0 12px; padding-left: 18px; position: relative; }
.state::before { content: ""; position: absolute; left: 0; top: .45em;
                 width: 8px; height: 8px; border-radius: 50%; }
.state.on { color: var(--acc-dark); }
.state.on::before { background: var(--acc); }
.state.off { color: var(--muted); }
.state.off::before { background: var(--muted); }