﻿* { box-sizing: border-box; }
:root {
  --bento-radius: 22px;
  --bento-radius-sm: 16px;
  --bento-shadow: 0 2px 10px rgba(30, 35, 70, 0.05), 0 10px 24px rgba(30, 35, 70, 0.05);
  --bento-shadow-hover: 0 4px 14px rgba(30, 35, 70, 0.08), 0 16px 32px rgba(30, 35, 70, 0.08);
}
body {
  margin: 0;
  font-family: 'Segoe UI', Arial, sans-serif;
  background: #eef0f5;
  color: #1f2330;
  font-size: 15px;
  line-height: 1.45;
}

.hidden { display: none !important; }

/* ЭКРАН АВТОРИЗАЦИИ */
.login-screen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(160deg, #eaf3fc 0%, #dce9f8 100%);
}
.login-card {
  background: #fff;
  border-radius: var(--bento-radius);
  padding: 36px 40px;
  width: 360px;
  box-shadow: var(--bento-shadow-hover);
}
.login-brand { justify-content: center; margin-bottom: 4px; }
.login-brand h1 { color: #1f2330; font-size: 18px; }
.login-welcome { text-align: center; color: #1f2330; font-size: 14px; font-weight: 500; margin: 14px 0 4px; }
.login-subtitle { text-align: center; color: #5e6275; font-size: 13px; margin: 0 0 22px; }
.login-label {
  display: block; font-size: 12px; color: #5e6275; margin-bottom: 14px;
}
.login-label select, .login-label input {
  display: block; width: 100%; margin-top: 6px;
  padding: 9px 10px; border: 1px solid #d6dceb; border-radius: 8px;
  font-size: 14px; background: #f8fafd;
}
.login-error {
  background: #fff0f0; color: #c92a2a; border: 1px solid #ffc9c9;
  border-radius: 8px; padding: 8px 12px; font-size: 12px; margin-bottom: 12px;
}
.login-submit {
  width: 100%; padding: 11px; border: none; border-radius: 8px;
  background: #4c6ef5; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer;
  margin-top: 6px;
}
.login-submit:hover { background: #3b5fe0; }

/* Код сотрудника (П.12; с 31.07 свободный формат — буквы/цифры): поле на экране входа.
   letter-spacing .5em снят — для буквенных кодов разрядка нечитаема. */
#login-pin, #login-pin2 {
  text-align: center; font-size: 18px; font-family: inherit; width: 100%;
}
.pin-field { position: relative; display: block; }
.pin-field .pin-eye {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  border: none; background: none; cursor: pointer; font-size: 16px;
  padding: 6px 8px; line-height: 1; opacity: .55; min-height: 32px;
}
.pin-field .pin-eye:hover { opacity: 1; }
.pin-field input { padding-right: 40px; }
.login-pin-hint {
  background: #f3f6ff; border: 1px solid #dbe4ff; border-radius: 8px;
  padding: 9px 12px; font-size: 12px; color: #3b4a6b; margin: 0 0 12px; line-height: 1.45;
}
.login-pin-back {
  width: 100%; margin-top: 8px; padding: 8px; border: none; background: none;
  color: #5e6275; font-size: 12px; cursor: pointer;
}
.login-pin-back:hover { color: #1f2330; text-decoration: underline; }

/* ГЛАВНЫЙ ЭКРАН — БЕНТО */
.home-content { padding: 32px; }
.home-title { font-size: 20px; font-weight: 700; color: #1f2330; margin-bottom: 18px; }

.home-sections {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  grid-auto-rows: 1fr;
  gap: 18px;
}
.home-section-card {
  position: relative;
  border: none; border-radius: var(--bento-radius);
  padding: 28px 26px; cursor: pointer;
  box-shadow: var(--bento-shadow);
  transition: box-shadow .2s, transform .2s;
  overflow: hidden;
  min-height: 140px;
  display: flex; flex-direction: column; justify-content: center;
  background: linear-gradient(150deg, #eef1ff 0%, #ffffff 65%);
}
.home-section-card:nth-child(4n+1) { background: linear-gradient(150deg, #e7f0ff 0%, #ffffff 65%); }
.home-section-card:nth-child(4n+2) { background: linear-gradient(150deg, #f1ebff 0%, #ffffff 65%); }
.home-section-card:nth-child(4n+3) { background: linear-gradient(150deg, #e6fbf0 0%, #ffffff 65%); }
.home-section-card:nth-child(4n+4) { background: linear-gradient(150deg, #fff3e0 0%, #ffffff 65%); }
.home-section-card:hover { box-shadow: var(--bento-shadow-hover); transform: translateY(-3px); }
.home-section-card h3 { margin: 0 0 8px; font-size: 19px; font-weight: 700; color: #1f2330; }
.home-section-card p { margin: 0; font-size: 14px; color: #6b7086; max-width: 90%; }

.top-nav { display: flex; flex-direction: column; align-items: stretch; gap: 6px; width: 100%; }
.articles-table-row .art-name { font-weight: 600; color: #1f2330; }
.articles-table-row .art-stage { color: #868ba3; font-size: 12px; text-align: right; }

.table-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; margin-bottom: 14px; flex-wrap: wrap;
}
.table-toolbar .search-input { flex: 1 1 280px; margin: 0; }
.page-size-label { font-size: 13px; color: #5e6275; display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.page-size-label select {
  padding: 8px 12px; border-radius: var(--bento-radius-sm); border: none;
  box-shadow: var(--bento-shadow); font-size: 13px; background: #fff;
}

.pagination { display: flex; gap: 6px; margin-top: 16px; flex-wrap: wrap; }
.pagination button {
  background: #fff; border: none; border-radius: 10px; padding: 8px 14px;
  font-size: 13px; cursor: pointer; box-shadow: var(--bento-shadow); color: #1f2330;
}
.pagination button.active { background: #4c6ef5; color: #fff; }
.pagination button:hover:not(.active) { box-shadow: var(--bento-shadow-hover); }

.pagination-export-btn {
  background: #2b8a3e; color: #fff; border: none; border-radius: var(--bento-radius-sm);
  padding: 10px 16px; font-size: 13px; cursor: pointer; box-shadow: var(--bento-shadow);
}
.pagination-export-btn:hover { background: #237032; }

.rating-hint { font-size: 13px; color: #5e6275; margin: -8px 0 14px; }
.rating-table th { font-size: 12px; line-height: 1.4; }
.rating-table .factory-id { font-weight: 700; color: #4c6ef5; white-space: nowrap; }
.fac-sum-link { cursor: pointer; }
.fac-sum-link:hover { text-decoration: underline; }
.rating-weight { font-weight: 400; color: #868ba3; font-size: 11px; }
.rating-input {
  width: 48px; padding: 6px; border-radius: 6px; border: 1px solid #d6dceb;
  text-align: center; font-size: 13px;
}
.rating-total { white-space: nowrap; color: #1f2330; }

/* OTIF */
.modal-otif-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin: 10px 0 16px; flex-wrap: wrap;
}
.modal-otif-label {
  font-size: 12px; color: #5e6275; display: flex; flex-direction: column; gap: 4px;
}
.modal-otif-label input[type="date"] {
  padding: 7px 10px; border: 1px solid #d6dceb; border-radius: 8px; font-size: 13px;
}

.otif-badge {
  display: inline-block; font-size: 11px; font-weight: 600; padding: 3px 9px;
  border-radius: 10px; margin-top: 6px;
}
.otif-badge.otif-ontime { background: #ecfdf3; color: #2b8a3e; }
.otif-badge.otif-risk { background: #fff8e1; color: #b8860b; }
.otif-badge.otif-late { background: #fff0f0; color: #c92a2a; }
.otif-badge.otif-none { background: #f1f2f6; color: #868ba3; }

.otif-summary { margin-bottom: 22px; }
.otif-card {
  background: #fff; border-radius: var(--bento-radius); padding: 24px 28px;
  box-shadow: var(--bento-shadow);
}
.otif-big { font-size: 48px; font-weight: 800; line-height: 1; }
.otif-big.otif-big-good { color: #2b8a3e; }
.otif-big.otif-big-warn { color: #b8860b; }
.otif-big.otif-big-bad { color: #c92a2a; }
.otif-big-label { font-size: 13px; color: #5e6275; margin: 8px 0 14px; }
.otif-breakdown { display: flex; gap: 10px; flex-wrap: wrap; }
.otif-chip {
  font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 10px;
}
.otif-chip.otif-risk { background: #fff8e1; color: #b8860b; }
.otif-chip.otif-late { background: #fff0f0; color: #c92a2a; }
.otif-chip.otif-none { background: #f1f2f6; color: #868ba3; }

.articles-page-table {
  width: 100%; border-collapse: collapse; background: #fff;
  border: none; border-radius: var(--bento-radius); overflow: hidden; font-size: 14px;
  box-shadow: var(--bento-shadow);
}
.articles-page-table th {
  background: #f4f5fa; text-align: left; padding: 12px 16px; color: #5e6275;
  font-weight: 600; border-bottom: 1px solid #e4e6ef;
}
.articles-page-table td {
  padding: 12px 16px; border-bottom: 1px solid #eef0f5; color: #1f2330;
}
.articles-page-table tbody tr:hover { background: #f4f5fa; cursor: pointer; }
.articles-page-table tr:last-child td { border-bottom: none; }

.user-chip {
  color: #cfd2dc; font-size: 13px; background: #2e3347;
  padding: 10px 14px; border-radius: 12px; border: none; cursor: pointer;
  width: 100%; text-align: left; margin-bottom: 4px;
}
.user-chip:hover { background: #3a3f59; color: #fff; }
.user-chip-bottom { margin-top: auto; margin-bottom: 10px; }

.sidebar-logo {
  line-height: 0;
  padding: 4px 18px 10px;
  text-align: center;
}
.sidebar-logo img { display: inline-block; max-width: 55%; height: auto; max-height: 32px; object-fit: contain; }

.logout-btn {
  position: fixed; bottom: 24px; right: 24px; z-index: 40;
  background: #fff; color: #c92a2a; border: 1px solid #ffc9c9;
  padding: 10px 20px; border-radius: 24px; font-size: 13px; font-weight: 600; cursor: pointer;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
.logout-btn:hover { background: #fff0f0; }

.impersonation-banner {
  position: fixed; top: 0; left: 0; right: 0; z-index: 60;
  background: #6a3fd6; color: #fff; text-align: center;
  font-size: 12px; font-weight: 600; padding: 6px 0; letter-spacing: .3px;
}

.exit-impersonation-btn {
  color: #6a3fd6; border-color: #d9cdf5; background: #fff;
}
.exit-impersonation-btn:hover { background: #f7f3ff; }

.employee-name { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.profile-tasks-count {
  font-size: 32px; font-weight: 700; color: #4c6ef5; margin-bottom: 4px;
}
.profile-tasks-count::after { content: ' задач(и) в работе'; font-size: 13px; color: #868ba3; font-weight: 400; }
.team-center-hint { color: #868ba3; font-size: 13px; margin: -8px 0 16px; }
.team-center-summary { display: flex; gap: 22px; margin-bottom: 16px; font-size: 13px; color: #5e6275; }
.team-center-summary .stat strong { color: #1f2330; font-size: 15px; }
.team-center-summary .stat.warn strong { color: #e03131; }
@keyframes sticker-bounce-kf {
  0% { transform: translateY(0) scale(1); }
  30% { transform: translateY(-18px) scale(1.05); }
  55% { transform: translateY(0) scale(0.96); }
  75% { transform: translateY(-6px) scale(1.02); }
  100% { transform: translateY(0) scale(1); }
}

.tasks-btn {
  background: transparent; color: #cfd2dc; border: none; cursor: pointer;
  padding: 10px 14px; border-radius: 12px; font-size: 13px;
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
}
.tasks-btn:hover { background: #2e3347; color: #fff; }
.tasks-count {
  background: #4c6ef5; color: #fff; font-size: 11px; font-weight: 700;
  border-radius: 10px; padding: 1px 7px; min-width: 16px; text-align: center;
  margin-left: auto;
}
.tasks-list { display: flex; flex-direction: column; gap: 8px; }
.task-item {
  border: none; border-radius: var(--bento-radius-sm); padding: 10px 12px; cursor: pointer;
  background: #f4f5fa;
}
.task-item:hover { background: #ebedf7; }
.task-item .task-card-name { font-weight: 600; font-size: 14px; color: #1f2330; }
.task-item .task-stage { font-size: 12px; color: #868ba3; margin-top: 2px; }
.tasks-empty { font-size: 13px; color: #868ba3; text-align: center; padding: 10px 0; }


.file-condition { margin: 10px 0; background: #f8f9fc; border: 1px solid #e5e7eb; border-radius: 9px; padding: 12px 14px; }
.file-condition-label { font-size: 13px; font-weight: 700; margin-bottom: 8px; color: #374151; }
.file-condition-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.file-condition-item { display: flex; align-items: center; gap: 6px; }
.file-condition-link {
  display: inline-block; font-size: 12px; color: #2b8a3e; background: #ecfdf3;
  border: 1px solid #b2f2bb; border-radius: 6px; padding: 4px 10px; text-decoration: none;
}
.file-condition-remove {
  background: #fff0f0; color: #c92a2a; border: 1px solid #ffc9c9; border-radius: 6px;
  width: 22px; height: 22px; line-height: 1; cursor: pointer; font-size: 12px;
}
.file-condition-empty {
  display: inline-block; font-size: 12px; color: #868ba3; margin-bottom: 6px;
}
.file-condition-add {
  display: block; font-size: 12px; color: #4c6ef5; cursor: pointer;
}
.file-condition-input { display: block; font-size: 12px; margin-top: 4px; }

.toast {
  position: fixed; bottom: 24px; left: 24px; z-index: 70;
  background: #1f2330; color: #fff; padding: 14px 18px; border-radius: 10px;
  font-size: 13px; max-width: 320px; cursor: pointer;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
  transition: opacity .3s, transform .3s;
}
.toast.hidden { opacity: 0; transform: translateY(10px); pointer-events: none; }
.toast strong { display: block; margin-bottom: 4px; color: #82c91e; font-size: 11px; text-transform: uppercase; }
.back-btn {
  background: transparent; border: none; color: #9aa0b4; font-size: 13px; cursor: pointer; padding: 0;
}
.back-btn:hover { color: #fff; }

.modal-stage-entry-date { font-size: 12px; color: #6b7080; margin-bottom: 6px; }
.modal-stage-outcome {
  font-size: 12px; line-height: 1.4; color: #3d4657; margin-bottom: 8px;
  background: #f1f4fb; border-left: 3px solid #4c6ef5; border-radius: 0 6px 6px 0;
  padding: 7px 10px;
}
.modal-stage-outcome:empty { display: none; }
.modal-corner-btns {
  position: absolute; top: 14px; right: 46px;
  display: flex; flex-direction: row-reverse; gap: 8px; align-items: center; z-index: 5;
}
.modal-files-corner-btn {
  background: #4c6ef5; border: none; border-radius: 20px; padding: 7px 14px; font-size: 12px;
  color: #fff; font-weight: 600; cursor: pointer; box-shadow: 0 3px 8px rgba(76,110,245,.35);
  white-space: nowrap;
}
.modal-files-corner-btn:hover { background: #3b5fe0; }
.modal-1c-corner-btn { background: #2f9e44; box-shadow: 0 3px 8px rgba(47,158,68,.35); }
.modal-1c-corner-btn:hover { background: #258a3a; }
.modal-history-corner-btn { background: #7950f2; box-shadow: 0 3px 8px rgba(121,80,242,.35); }
.modal-history-corner-btn:hover { background: #6741d9; }
.modal-dates-corner-btn { background: #1098ad; box-shadow: 0 3px 8px rgba(16,152,173,.35); }
.modal-dates-corner-btn:hover { background: #0c8599; }

.cond-group-header {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: #6b7280; margin: 14px 0 6px; padding-bottom: 5px;
  border-bottom: 1.5px solid #e5e7eb;
}

.modal-history-content { padding: 4px 0 8px; }
.mh-entry {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 10px 0; border-bottom: 1px solid #f0f2f8; position: relative;
}
.mh-entry:last-child { border-bottom: none; }
.mh-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #d1d5e8; border: 2px solid #a0a8c8;
  flex-shrink: 0; margin-top: 4px;
}
.mh-dot-current { background: #4c6ef5; border-color: #4c6ef5; }
.mh-body { display: flex; flex-direction: column; gap: 2px; }
.mh-stage { font-size: 13px; font-weight: 600; color: #1f2330; }
.mh-entry-current .mh-stage { color: #4c6ef5; }
.mh-date { font-size: 12px; color: #6b7280; }
.approval-condition { border: 1px solid #e3e5ee; border-radius: 8px; padding: 10px; margin-bottom: 8px; }
.approval-status { font-size: 12px; color: #6b7080; margin-top: 6px; }
.approval-status.approval-done { color: #2f9e44; font-weight: 600; }
.approval-status.approval-rejected { color: #e03131; font-weight: 600; }
.approval-actions { display: flex; gap: 8px; margin-top: 8px; }
.approval-approve-btn { background: #2f9e44; color: #fff; border: none; border-radius: 6px; padding: 6px 12px; cursor: pointer; }
.approval-reject-btn { background: #e03131; color: #fff; border: none; border-radius: 6px; padding: 6px 12px; cursor: pointer; }
.approval-reject-comment { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.approval-reject-comment textarea { min-height: 60px; padding: 6px; border-radius: 6px; border: 1px solid #ccc; }
.approval-reject-confirm { align-self: flex-start; background: #e03131; color: #fff; border: none; border-radius: 6px; padding: 6px 12px; cursor: pointer; }
.card-photo { width: 50%; height: auto; object-fit: contain; border-radius: 6px; margin: 6px 0; display: block; }
.articles-source-note { font-size: 12px; color: #6b7080; margin: -4px 0 14px; }
.articles-tab { padding: 7px 16px; border-radius: 8px; border: 1px solid #e4e6ef; background: #f4f5fa; color: #5e6275; font-size: 13px; cursor: pointer; transition: background 0.15s, color 0.15s, border-color 0.15s; font-weight: 500; }
.articles-tab:hover { background: #e8eaf2; }
.articles-tab.articles-tab-active { background: var(--accent); color: #fff; border-color: var(--accent); }
.articles-tab:not(.articles-tab-active) .articles-vyvod-count { background: #e4e6ef; color: #5e6275; }

.modal-product-photo { margin: 4px 0 10px; }
.modal-product-photo-empty {
  width: 100%; height: 100px; border: 1px dashed #c7c9d6; border-radius: 8px;
  display: flex; align-items: center; justify-content: center; color: #9aa0b4; font-size: 12px;
}
.modal-product-photo-upload {
  display: inline-block; margin-top: 6px; font-size: 12px; color: #3a55c9; cursor: pointer;
}
.modal-product-photo-upload input { display: none; }
/* Галерея фото новинки (множественная загрузка) */
.mpp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 6px; }
.mpp-thumb { position: relative; }
.mpp-thumb img { width: 100%; height: 96px; object-fit: cover; border-radius: 8px; display: block; cursor: zoom-in; }
.mpp-del {
  position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; border: none; border-radius: 50%;
  background: rgba(20,24,40,.72); color: #fff; font-size: 14px; line-height: 1; cursor: pointer; padding: 0;
}
.mpp-del:hover { background: #c0392b; }
/* Тех-пак артикула (загрузка файлов сотрудниками) */
.tp-section { border: 1px solid #e3e6f0; border-radius: 10px; padding: 12px 14px; margin-bottom: 14px; background: #fafbff; }
.tp-head { font-weight: 700; font-size: 14px; margin-bottom: 8px; }
.tp-count { font-weight: 500; color: #8a90a6; font-size: 12px; margin-left: 6px; }
.tp-empty { color: #9aa0b4; font-size: 12px; padding: 4px 0; }
.tp-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.tp-item { display: flex; align-items: center; gap: 8px; }
.tp-link { color: #3a55c9; text-decoration: none; font-size: 13px; }
.tp-link:hover { text-decoration: underline; }
.tp-del { border: none; background: #ffe3e3; color: #c0392b; border-radius: 6px; width: 22px; height: 22px; cursor: pointer; font-size: 12px; }
.tp-del:hover { background: #ffc9c9; }
.tp-add { display: inline-block; font-size: 12px; color: #2f7a2f; cursor: pointer; font-weight: 600; }
.tp-add input { display: none; }
.tp-subhead, .tp-head { color: #2a2f45; }
.tp-subhead { font-weight: 700; font-size: 12px; color: #8a90a6; margin: 10px 0 6px; text-transform: uppercase; letter-spacing: .3px; }
/* Перетаскивание подразделов карточки (режим админа) */
.corner-draggable { cursor: grab; }
.corner-draggable:active { cursor: grabbing; }
.corner-dragging { opacity: .5; outline: 2px dashed #4263eb; }
/* Вход по профилям (московский офис) */
.login-profiles { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 4px; max-height: 52vh; overflow-y: auto; }
.login-profile {
  display: flex; align-items: center; gap: 10px; width: 100%; text-align: left;
  padding: 8px 12px; border: 1px solid #e3e6f0; border-radius: 10px; background: #fff; cursor: pointer;
  transition: background .12s, border-color .12s;
}
.login-profile:hover { background: #f3f6ff; border-color: #b9c6f5; }
.login-profile-sel { border-color: #4263eb; background: #eef3ff; }
.login-profile-txt { display: flex; flex-direction: column; line-height: 1.25; flex: 1; min-width: 0; }
.login-profile-name { font-weight: 600; color: #1f2540; font-size: 14px; }
.login-profile-role { font-size: 11px; color: #8a90a6; }
.login-profile-go { font-size: 12px; color: #3a55c9; font-weight: 600; }
.login-profile-lock { font-size: 14px; }
.login-profile-admin { border-style: dashed; }
/* Инлайн-редактирование админом (двойной клик — переименовать, правый клик — цвет) */
body.admin-mode .ui-editable { outline: 1px dashed rgba(66,99,235,.45); outline-offset: 2px; cursor: context-menu; }
body.admin-mode .ui-editable:hover { outline-color: #4263eb; background: rgba(66,99,235,.06); }
/* Скрытие любого пункта админом (Паша 30.07): ✕ на пункте, ↩ на скрытом, скрытое — всем не видно */
.ui-hidden { display: none !important; }
.ui-hidden-dim { opacity: .5; filter: grayscale(.4); outline: 1px dashed #adb5bd !important; }
.ui-hidden-dim:hover { opacity: .85; }
.ui-editable { position: relative; }
.ui-hide-btn, .ui-restore {
  display: inline-flex; align-items: center; justify-content: center;
  width: 16px; height: 16px; margin-left: 6px; border-radius: 50%;
  font-size: 10px; line-height: 1; cursor: pointer; vertical-align: middle; flex: none;
}
.ui-hide-btn { background: #ffe3e3; color: #e03131; border: 1px solid #ffc9c9; }
.ui-hide-btn:hover { background: #e03131; color: #fff; }
.ui-restore { background: #d3f9d8; color: #2f9e44; border: 1px solid #b2f2bb; }
.ui-restore:hover { background: #2f9e44; color: #fff; }
/* Фильтры доски (статус/фабрика/переводчик/сброс) */
.board-search-wrap { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.board-filter-sel {
  padding: 6px 10px; border: 1px solid #dde0ea; border-radius: 8px; background: #fff;
  font-size: 12.5px; color: #2a2f45; cursor: pointer; max-width: 220px;
}
.board-filter-translator { display: inline-flex; gap: 6px; }
.board-filter-reset {
  border: none; background: transparent; color: #8a90a6; font-size: 12px; cursor: pointer; padding: 6px 8px; border-radius: 8px;
}
.board-filter-reset:hover { background: #f1f3f9; color: #444; }
.board-filter-reset-on { color: #c0392b; font-weight: 600; }
/* Кнопка «Перейти на след. стадию →» на мини-карточке */
.card-advance-btn {
  border: 1px solid #2f9e44; background: #ebfbee; color: #2b8a3e; border-radius: 16px;
  font-size: 11.5px; font-weight: 700; padding: 3px 10px; cursor: pointer; margin-top: 4px;
}
.card-advance-btn:hover { background: #d3f9d8; }

:root { --sidebar-width: 230px; }

.page-section { margin-left: var(--sidebar-width); }
body.impersonating .page-section { margin-top: 28px; }
.back-btn-light {
  background: transparent; border: none; color: #5e6275; font-size: 13px; cursor: pointer; padding: 0;
}
.back-btn-light:hover { color: #1f2330; }

.board-subheader {
  background: #161a2c; padding: 10px 32px; display: flex; align-items: center;
  gap: 14px; border-bottom: 1px solid #262b45;
  position: sticky; top: 0; z-index: 21;
}
body.impersonating .board-subheader { top: 28px; }
.board-subheader .board-tabs { margin: 0; }

/* БОКОВОЕ МЕНЮ */
.topbar {
  position: fixed; top: 0; left: 0; bottom: 0; width: var(--sidebar-width);
  background: #161a2c;
  color: #fff;
  padding: 20px 14px;
  border-right: 1px solid #262b45;
  overflow-y: auto;
  z-index: 30;
}
body.impersonating .topbar { top: 28px; }
.topbar-row { display: flex; flex-direction: column; align-items: stretch; gap: 10px; height: 100%; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand-dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #4c6ef5; box-shadow: 0 0 0 4px rgba(76,110,245,0.25);
  flex-shrink: 0;
}
.topbar h1 { margin: 0; font-size: 15px; font-weight: 600; color: #f1f2f6; letter-spacing: .2px; text-align: left; }

.brand-link {
  background: none; border: none; cursor: pointer; padding: 0 0 14px 0;
  border-bottom: 1px solid #262b45; margin-bottom: 6px; width: 100%;
}
.brand-link:hover h1 { color: #fff; }

.board-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.board-tabs button {
  background: transparent;
  color: #9aa0b4;
  border: none;
  padding: 12px 18px;
  border-radius: 0;
  cursor: pointer;
  font-size: 14px;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.board-tabs button:hover { color: #d7d9e6; }
.board-tabs button.active { color: #fff; border-bottom: 2px solid #4c6ef5; font-weight: 600; }

.back-btn-inline { display: block; margin-bottom: 14px; }

.stats-bar {
  display: flex;
  gap: 22px;
  padding: 14px 32px;
  background: #fff;
  border-bottom: 1px solid #e4e6ef;
  font-size: 13px;
  color: #5e6275;
}
.stats-bar .stat strong { color: #1f2330; font-size: 15px; }
.stats-bar .stat.warn strong { color: #e03131; }
.stats-bar .stat.ok strong { color: #2f9e44; }

.board-container {
  display: flex;
  gap: 14px;
  padding: 14px 20px;
  overflow-x: auto;
  height: calc(100vh - 152px);
  align-items: flex-start;
  box-sizing: border-box;
}

/* Автопрокрутка при перетаскивании карточки: подсветка края, к которому едем (Паша 30.07) */
.board-container { position: relative; scroll-behavior: auto; }
.board-container.board-edge-left::before,
.board-container.board-edge-right::after {
  content: ''; position: sticky; top: 0; align-self: stretch; width: 64px; flex: none;
  pointer-events: none; z-index: 5; border-radius: 8px;
}
.board-container.board-edge-left::before {
  left: 0; margin-right: -64px;
  background: linear-gradient(90deg, rgba(59,91,219,.20), rgba(59,91,219,0));
}
.board-container.board-edge-right::after {
  right: 0; margin-left: -64px;
  background: linear-gradient(270deg, rgba(59,91,219,.20), rgba(59,91,219,0));
}
.board-container-column > .board-container { padding: 8px 28px 20px; }

.stage-column {
  background: #e9ecf5;
  border-radius: var(--bento-radius);
  min-width: 310px;
  max-width: 345px;
  padding: 0;
  flex-shrink: 0;
  border: none;
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
/* 0-стадия «План новинки» — визуально отделена (цвет + отступ-разрыв справа) */
.stage-column.stage-plan0 {
  background: #fff4e6; border: 2px solid #ffd8a8;
  margin-right: 26px; position: relative; overflow-y: auto;
}
.stage-column.stage-plan0::after {
  content: ''; position: absolute; right: -15px; top: 8%; bottom: 8%; width: 2px;
  background: repeating-linear-gradient(#ced4da 0 6px, transparent 6px 12px);
}
.stage-column.stage-plan0 .stage-column-header { border-bottom-color: #ffd8a8; }
.pn0-zero { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:#e8590c; color:#fff; font-size:12px; font-weight:800; }
/* Раздел «План новинок» (30.07): 0-стадия переехала сюда с доски — слева план/факт, справа
   её карточки. На доске разработки этой колонки больше нет. */
.pn0-grid { display:flex; gap:16px; align-items:flex-start; overflow-x:auto; padding-bottom:6px; }
.pn0-grid .stage-plan0 { max-height:none; margin-right:26px; flex:0 0 auto; }
.pn0-cards { display:flex; gap:14px; flex:0 0 auto; }
.pn0-cards .stage-column { max-height:none; }
@media (max-width: 900px) { .pn0-grid { flex-wrap:wrap; } .pn0-grid .stage-plan0 { margin-right:0; } .pn0-grid .stage-plan0::after { display:none; } }
/* Сводка: одна крупная величина «закрыто плана» + полоса, остальное — подчинённые чипы.
   Шапка блока (.pn0-head/.pn0-title/.pn0-sub) и плашка «план не утверждён» (.pn0-draft)
   убраны по просьбе Паши 29.07 — блок начинается сразу со сводки. */
.pn0-prog { margin: 8px 13px 0; padding: 9px 11px 10px; background: #fff; border-radius: 10px; position: relative; }
.pn0-prog-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 11px; color: #7d6549; margin-bottom: 6px; }
.pn0-prog-top b { font-size: 15px; font-weight: 800; color: #2b3240; }
.pn0-prog-pct { position: absolute; right: 11px; bottom: 8px; font-size: 10px; font-weight: 700; color: #97764f; }
.pn0-bar { height: 6px; border-radius: 4px; background: #f1e3d3; overflow: hidden; }
.pn0-bar > i { display: block; height: 100%; border-radius: 4px; background: #e8590c; }
.pn0-bar-big { height: 9px; }
.pn0-bar-big > i { background: linear-gradient(90deg, #f08c00, #e8590c); }
.pn0-chips { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; margin: 6px 13px 2px; }
.pn0-chip { background: #fff; border-radius: 9px; padding: 7px 8px; text-align: center; line-height: 1.15; cursor: default; }
.pn0-chip b { display: block; font-size: 16px; font-weight: 800; }
.pn0-chip span { font-size: 10px; color: #8a7660; }
.pn0-chip-need b { color: #e03131; }
/* Пояснение к сводке: почему новинок больше, чем закрыто плана (Паша 30.07) */
.pn0-why { margin: 6px 13px 0; padding: 7px 10px; background: #fff8f0; border-left: 3px solid #f08c00; border-radius: 0 8px 8px 0; font-size: 11px; line-height: 1.4; color: #7d6549; cursor: help; }
.pn0-why b { color: #d9480f; font-weight: 800; }
.pn0-chip-all b { color: #1971c2; }
.pn0-list { padding: 6px 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.pn0-sep { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #97764f; padding: 8px 4px 2px; border-top: 1px dashed #e8d5bd; margin-top: 2px; }
.pn0-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 4px 8px; background: #fff; border-radius: 8px; padding: 7px 10px; }
.pn0-row .pn0-bar { grid-column: 1 / -1; margin-top: 3px; }
.pn0-row-need { background: #fff0e6; }
.pn0-row-off { background: #f7f4f0; }
.pn0-row-off .pn0-cat, .pn0-row-off .pn0-fact { color: #7a8290; }
.pn0-cat { font-size: 12px; font-weight: 600; color: #2b3240; }
.pn0-nums { font-size: 13px; font-weight: 700; color: #495057; white-space: nowrap; cursor: help; }
.pn0-fact { color: #1971c2; }
.pn0-slash { font-size: 10px; font-weight: 600; color: #9aa3b2; }
.pn0-plan { color: #2b3240; }
.pn0-ok { font-size: 11px; color: #2b8a3e; font-weight: 600; }
.pn0-add { font-size: 11px; font-weight: 700; color: #fff; background: #e8590c; border: none; border-radius: 7px; padding: 4px 9px; cursor: pointer; white-space: nowrap; }
.pn0-add:hover { background: #d9480f; }
.stage-column-header { padding: 12px 14px 8px; flex-shrink: 0; }
.stage-column-header h3 { margin: 0 0 2px; font-size: 14px; color: #1f2330; font-weight: 600; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; line-height: 1.25; }
.stage-responsible { font-size: 11px; color: #868ba3; }
/* «Образ результата» стадии — что итогово получаем (поле note стадии) */
.stage-outcome {
  margin-top: 5px; font-size: 11px; line-height: 1.35; color: #4a5568;
  background: #f1f4fb; border-left: 3px solid #4c6ef5; border-radius: 0 5px 5px 0;
  padding: 5px 7px;
}
.stage-count {
  display: inline-flex; align-items: center; justify-content: center;
  background: #4c6ef5; color: #fff; border-radius: 10px;
  font-size: 10px; font-weight: 700; padding: 1px 7px; line-height: 1.4;
  flex-shrink: 0;
}
.stage-cards { flex: 1; overflow-y: auto; min-height: 0; padding: 8px 9px 10px; }
.stage-cards::-webkit-scrollbar { width: 3px; }
.stage-cards::-webkit-scrollbar-track { background: transparent; }
.stage-cards::-webkit-scrollbar-thumb { background: #c5c9dc; border-radius: 3px; }

.card {
  background: #fff;
  border-radius: var(--bento-radius-sm);
  padding: 8px 10px;
  margin-bottom: 6px;
  box-shadow: var(--bento-shadow);
  border: none;
  cursor: pointer;
  transition: box-shadow .15s, transform .1s;
}
.card:active { transform: scale(0.98); }
.card.dragging { opacity: 0.4; }
.stage-column.drag-over { background: #dde2f5; outline: 2px dashed #4c6ef5; outline-offset: -4px; }
.card:hover { box-shadow: var(--bento-shadow-hover); transform: translateY(-1px); }
.card .card-name { font-weight: 600; font-size: 13px; line-height: 1.35; color: #1f2330; }
/* верх карточки: крупное фото + чипы (артикул/название/фабрика/статус — все одного размера) */
.card-top { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 8px; }
.card-photo-big { width: 60px; height: 60px; object-fit: cover; border-radius: 8px; border: 1px solid #e5e7eb; flex: none; background: #f3f4f8; }
.card-chips { display: flex; flex-wrap: wrap; gap: 5px; flex: 1; min-width: 0; }
.card-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 600; padding: 3px 10px;
  border-radius: 20px; border: 1px solid transparent; line-height: 1.3;
}
.chip-article { background: #4c6ef5; color: #fff; }
.chip-name { background: #f5f6fa; color: #3a3f58; border-color: #e5e7eb; max-width: 100%; white-space: normal; }
.chip-factory { background: #eef3ff; color: #3a54cc; border-color: #c7d4fd; }
.chip-translator { background: #f3f0ff; color: #6741d9; border-color: #d0bfff; }
.chip-line { background: #f3eefb; color: #6741d9; border-color: #ddd0f5; }
.card-meta { display: flex; align-items: center; gap: 7px; }
.card-meta .progress-bar { flex: 1; margin: 0; }
.card .progress-bar { background: #e1e3e8; border-radius: 3px; height: 4px; overflow: hidden; }
.card .progress-bar-fill { height: 100%; background: #4c6ef5; border-radius: 3px; }
.progress-pill { font-size: 10px; color: #868ba3; white-space: nowrap; flex-shrink: 0; font-variant-numeric: tabular-nums; }
.card-badges { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 5px; }
.card.kanban-hidden { display: none; }
/* статусы стадии ещё не все выполнены, но дедлайн не превышен — СИНЯЯ метка (Паша 28.07);
   у просроченных поверх действует красный контур .card-late-outline (!important) */
.card.blocked-indicator { border-left: 3px solid #4263eb; }
/* board search bar */
.board-search-wrap { padding: 7px 20px; background: #f8f9fc; border-bottom: 1px solid #e4e6ef; display: flex; align-items: center; gap: 12px; }
.board-search { width: 240px; padding: 6px 11px; border: 1px solid #dde0ec; border-radius: 8px; font-size: 13px; background: #fff; color: #1f2330; outline: none; }
.board-search:focus { border-color: #4c6ef5; box-shadow: 0 0 0 2px rgba(76,110,245,.1); }
.board-search-count { font-size: 12px; color: #868ba3; }

.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.4);
  display: flex; align-items: center; justify-content: center;
}
.modal-overlay.hidden { display: none; }
.modal {
  background: #fff; border-radius: var(--bento-radius); padding: 28px;
  width: 540px; max-height: 84vh; overflow-y: auto; position: relative;
  box-shadow: var(--bento-shadow-hover);
}
/* карточка артикула шире — чтобы 5 угловых кнопок не выпирали за край */
#card-modal .modal { width: 720px; max-width: 94vw; padding-top: 20px; }
/* угловые кнопки: резервируем справа место под ✕ (padding-right), чтобы он не наезжал */
#card-modal .modal-corner-btns { position: static; margin: 0 0 14px 0; padding-right: 46px; justify-content: flex-end; flex-wrap: wrap; row-gap: 6px; }
.modal h2 { font-size: 20px; }
.modal-close {
  position: absolute; top: 14px; right: 18px; border: none; background: none;
  font-size: 24px; cursor: pointer; color: #888;
}
#modal-main-view { padding-top: 26px; }
.modal-title-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.modal-title-row h2 { margin: 0; }
/* Название + тип изделия в одну строку (тип справа от названия) */
.modal-title-line { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.modal-type-chip {
  display: inline-block; padding: 3px 10px; border-radius: 20px; white-space: nowrap;
  background: #f3f0ff; color: #6741d9; border: 1px solid #d0bfff; font-size: 13px; font-weight: 600;
}
.modal-title-row .modal-responsible { flex: 0 1 auto; text-align: right; }
.modal-responsible { color: #5e6275; font-size: 13px; margin: 0; white-space: nowrap; }
.modal-responsible .mr-role { color: #3a54cc; font-weight: 600; }
.modal-conditions label {
  display: block; margin: 12px 0; font-size: 15px; cursor: pointer;
}
.modal-conditions input[type="text"] {
  width: 100%; padding: 6px 8px; margin-top: 4px; border: 1px solid #ccc; border-radius: 6px;
}
.modal-conditions input[type="checkbox"] { margin-right: 8px; }
.modal-blockers {
  background: #fff0f0; border: 1px solid #ffc9c9; border-radius: 8px;
  padding: 10px 14px; margin-top: 12px; font-size: 13px; color: #c92a2a;
}
.modal-blockers.hidden { display: none; }
.modal-blockers ul { margin: 6px 0 0; padding-left: 18px; }
.modal-actions { display: flex; gap: 10px; margin-top: 16px; }
.modal-actions button {
  flex: 1; padding: 10px; border-radius: 8px; border: none; cursor: pointer; font-size: 14px;
}
/* Приоритет кнопок карточки (аудит 30.07): было наоборот — «Сохранить» серым
   #e9ecef (вид неактивной), а редкий и необратимый переход стадии — акцентом.
   Люди отмечали условия и закрывали модалку, не нажав «серое». Теперь частое
   действие первичное, переход стадии — вторичный, но по-прежнему заметный. */
#modal-save { background: #4c6ef5; color: #fff; font-weight: 600; }
#modal-save:hover { background: #3b5bdb; }
#modal-advance { background: #fff; color: #3a54cc; box-shadow: inset 0 0 0 1.5px #c9d4f7; font-weight: 600; }
#modal-advance:hover { background: #eef1ff; box-shadow: inset 0 0 0 1.5px #4c6ef5; }
.confirm-modal { width: 360px; }
.confirm-modal p { font-size: 14px; color: #1f2330; margin: 0 0 16px; line-height: 1.5; }
#confirm-cancel { background: #e9ecef; }
#confirm-ok { background: #c92a2a; color: #fff; }

.admin-override {
  margin-top: 16px; padding: 14px; border: 1px dashed #c9b8ff;
  border-radius: 10px; background: #f7f3ff;
}
.admin-override h3 { margin: 0 0 4px; font-size: 13px; color: #6a3fd6; }
.admin-override select {
  width: 100%; padding: 8px; border-radius: 6px; border: 1px solid #d9cdf5; margin-bottom: 8px;
}
#admin-move-btn {
  width: 100%; padding: 9px; border: none; border-radius: 6px;
  background: #6a3fd6; color: #fff; cursor: pointer; font-size: 13px;
}

.search-block { margin-top: 32px; width: 100%; }
.search-label { display: block; font-size: 16px; font-weight: 600; color: #1f2330; margin-bottom: 10px; }
.search-input {
  width: 100%; padding: 14px 16px; border: none; border-radius: var(--bento-radius-sm);
  font-size: 16px; box-shadow: var(--bento-shadow); background: #fff;
}
.search-result { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.search-item {
  background: #fff; border: none; border-radius: var(--bento-radius-sm); padding: 12px 14px;
  cursor: pointer; box-shadow: var(--bento-shadow);
}
.search-item:hover { box-shadow: var(--bento-shadow-hover); }
.search-empty { font-size: 12px; color: #868ba3; }

.employees-list { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.employee-card {
  background: #fff; border: none; border-radius: var(--bento-radius-sm); padding: 18px 20px;
  box-shadow: var(--bento-shadow);
}
.employee-inactive { opacity: 0.6; background: #f7f7f9; }
.employee-toggle-btn {
  background: #fff0f0; color: #c92a2a; border: 1px solid #ffc9c9; border-radius: 6px;
  padding: 6px 12px; font-size: 12px; cursor: pointer; white-space: nowrap;
}
.employee-toggle-btn:hover { background: #ffe3e3; }
.employee-inactive .employee-toggle-btn {
  background: #ecfdf3; color: #2b8a3e; border-color: #b2f2bb;
}
.employee-inactive .employee-toggle-btn:hover { background: #d3f9d8; }
.employee-name { font-size: 16px; font-weight: 600; color: #1f2330; }

/* ЭКРАН КОНТРОЛЯ */
.control-summary {
  display: flex; gap: 16px; margin-bottom: 24px; flex-wrap: wrap;
}
.control-stat {
  background: #fff; border-radius: var(--bento-radius-sm); padding: 18px 24px;
  box-shadow: var(--bento-shadow); font-size: 13px; color: #5e6275; min-width: 140px;
}
.control-stat strong { display: block; font-size: 30px; font-weight: 800; color: #1f2330; line-height: 1.1; margin-bottom: 4px; }
.control-stat.control-stat-warn strong { color: #e03131; }

.control-block { margin-bottom: 28px; }
.control-block-title {
  font-size: 15px; font-weight: 700; color: #1f2330; margin-bottom: 12px;
  padding-bottom: 8px; border-bottom: 1px solid #e4e6ef;
}
.control-empty { font-size: 13px; color: #2b8a3e; background: #ecfdf3; border-radius: 8px; padding: 12px 16px; }
.control-row { cursor: pointer; }
.control-missing { font-size: 12px; color: #5e6275; max-width: 240px; }
.control-days {
  display: inline-block; font-size: 12px; font-weight: 700; padding: 3px 9px;
  border-radius: 10px;
}
.control-days.control-days-warn { background: #fff8e1; color: #b8860b; }
.control-days.control-days-hot { background: #fff0f0; color: #c92a2a; }

.control-funnel-board {
  background: #fff; border-radius: var(--bento-radius-sm); padding: 18px 22px;
  box-shadow: var(--bento-shadow); margin-bottom: 14px;
}
.control-funnel-board-name { font-size: 14px; font-weight: 700; color: #1f2330; margin-bottom: 12px; }
.control-funnel-board-name strong { color: #4c6ef5; }
.control-funnel-stages { display: flex; flex-direction: column; gap: 8px; }
.control-funnel-stage { display: flex; align-items: center; gap: 12px; }
.control-funnel-stage-name { font-size: 13px; color: #5e6275; width: 200px; flex-shrink: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.control-funnel-bar-wrap { flex: 1; background: #eef0f5; border-radius: 4px; height: 10px; overflow: hidden; }
.control-funnel-bar { height: 100%; background: #4c6ef5; border-radius: 4px; min-width: 4px; transition: width .3s; }
.control-funnel-count { font-size: 13px; font-weight: 700; color: #1f2330; width: 24px; text-align: right; }

.fab {
  position: fixed; bottom: 90px; right: 24px;
  background: #4c6ef5; color: #fff; border: none;
  padding: 14px 20px; border-radius: 30px; font-size: 14px; cursor: pointer;
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

/* ── OTIF Dashboard ─────────────────────────────────── */
.od-root { padding: 0 4px; }
/* «План новинок» под-вкладкой доски: тот же блок, что на экране, но без внешних отступов */
.pn-board-wrap { flex: 1; min-width: 0; }
.home-content.pn-in-board { padding: 4px 2px; }
.home-content.pn-in-board .home-title { margin-top: 0; }

.od-page-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 24px; flex-wrap: wrap; gap: 12px;
}
.od-page-sub { font-size: 13px; color: #8a8fa8; margin: 0; }

/* KPI cards row */
.od-kpi-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 14px; margin-bottom: 20px;
}
.od-soft-otif-note {
  background: #f5f7ff; border: 1px solid #dde3fa; border-radius: 10px;
  padding: 10px 14px; font-size: 13px; color: #4a4f6b; margin-bottom: 20px;
}
.od-kpi-card {
  background: #fff; border-radius: 16px; padding: 18px 20px;
  box-shadow: var(--bento-shadow); display: flex; flex-direction: column; gap: 4px;
  border-left: 4px solid #e2e6f0; transition: box-shadow .2s;
}
.od-kpi-card:hover { box-shadow: var(--bento-shadow-hover); }
.od-kpi-accent  { border-left-color: #4c6ef5; }
.od-kpi-warn    { border-left-color: #f59f00; }
.od-kpi-danger  { border-left-color: #e03131; }
.od-kpi-good    { border-left-color: #2f9e44; }
.od-kpi-icon  { font-size: 20px; }
.od-kpi-value { font-size: 30px; font-weight: 800; line-height: 1.1; margin: 2px 0; }
.od-kpi-label { font-size: 12px; font-weight: 600; color: #5e6275; text-transform: uppercase; letter-spacing: .4px; }
.od-kpi-sub   { font-size: 12px; color: #9399b0; margin-top: 2px; }
.od-val-good  { color: #2f9e44; }
.od-val-warn  { color: #f59f00; }
.od-val-bad   { color: #e03131; }
.od-val-blue  { color: #4c6ef5; }
.od-sub-neg   { color: #e03131 !important; }
.od-sub-pos   { color: #2f9e44 !important; }
@media (max-width: 900px) { .od-row-two { grid-template-columns: 1fr; } }

/* Generic section card */
.od-section {
  background: #fff; border-radius: 16px; padding: 20px 24px;
  box-shadow: var(--bento-shadow); margin-bottom: 0;
}
.od-section + .od-section { margin-top: 16px; }

.od-section-header {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px;
  flex-wrap: wrap;
}
.od-section-title { font-size: 15px; font-weight: 700; margin: 0; color: #1f2330; }
.od-title-hint { font-size: 12px; font-weight: 400; color: #8a8fa8; }
.od-section-badge {
  background: #eef3ff; color: #3a54cc; font-size: 11px; font-weight: 600;
  padding: 3px 10px; border-radius: 20px; margin-left: auto;
}

/* Historical bars */
.od-hist-meta { font-size: 12px; color: #8a8fa8; margin-bottom: 14px; }
.od-hist-target-tick {
  position: absolute; top: -4px; bottom: -4px;
  width: 2px; background: #4c6ef5; border-radius: 2px;
  transform: translateX(-50%);
}
.od-hist-target-tick::after {
  content: ''; position: absolute; top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 6px; height: 6px; background: #4c6ef5; border-radius: 50%;
}

/* Bar colours */
.od-bar-good { background: linear-gradient(90deg, #2f9e44, #51cf66); }
.od-bar-warn { background: linear-gradient(90deg, #e67700, #fcc419); }
.od-bar-bad  { background: linear-gradient(90deg, #c92a2a, #ff6b6b); }

/* Delta colours */
.od-delta-ok   { color: #2f9e44; font-weight: 600; }
.od-delta-risk { color: #f59f00; font-weight: 600; }
.od-delta-late { color: #e03131; font-weight: 600; }

/* Tracker chips */
.od-tracker-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.od-tcount {
  font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 20px;
}
.od-tcount-late  { background: #fff0f0; color: #e03131; border: 1px solid #ffcccc; }
.od-tcount-risk  { background: #fff8e6; color: #d97706; border: 1px solid #fcd97a; }
.od-tcount-ok    { background: #edfaf2; color: #2f9e44; border: 1px solid #b2f2bb; }
.od-tcount-none  { background: #f5f6fa; color: #8a8fa8; border: 1px solid #dde0ea; }

/* Tracker table */
.od-table-wrap { overflow-x: auto; }
.od-table {
  width: 100%; border-collapse: collapse; font-size: 13px; min-width: 680px;
}
.od-table th {
  text-align: left; padding: 9px 12px; background: #f8f9ff;
  border-bottom: 2px solid #e2e6f0; color: #5e6275;
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
}
.od-table td { padding: 8px 12px; border-bottom: 1px solid #f0f2f8; vertical-align: middle; }
.od-table tr:hover td { background: #f8f9ff; }
.od-tr-late td { background: #fff8f8; }
.od-tr-risk td { background: #fffbee; }
.od-td-name { font-weight: 600; color: #1f2330; max-width: 200px; }
.od-td-board, .od-td-stage { color: #5e6275; }
.od-td-date { white-space: nowrap; font-variant-numeric: tabular-nums; color: #3a3f52; }
.od-td-delta { font-weight: 700; white-space: nowrap; }

/* Mini progress bar in tracker */
.od-cond-bar {
  height: 5px; background: #eef0f7; border-radius: 4px; overflow: hidden;
  width: 64px; margin-bottom: 3px;
}
.od-cond-fill { height: 100%; background: #4c6ef5; border-radius: 4px; transition: width .3s; }
.od-cond-label { font-size: 10px; color: #8a8fa8; }

/* ── Real DB OTIF section ────────────────────────────── */
.od-db-otif-grid { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; }
.od-db-row {
  display: grid;
  grid-template-columns: 80px 1fr 52px 180px;
  align-items: center; gap: 10px;
}
.od-db-month { font-size: 12px; color: #5e6275; white-space: nowrap; }
.od-db-bar-wrap { position: relative; }
.od-db-bar-bg {
  background: #f0f2f8; border-radius: 6px; height: 18px;
  overflow: visible; position: relative;
}
.od-db-bar-fill { height: 100%; border-radius: 6px; transition: width .4s ease; }
.od-db-pct { font-size: 13px; font-weight: 700; text-align: right; }
.od-db-meta { font-size: 11px; color: #5e6275; }
.od-db-total { color: #9399b0; }
.od-db-note { font-size: 11px; color: #8a8fa8; margin-top: 12px; }

/* ── Finance screen ──────────────────────────────────── */
.fin-root { padding: 0 4px; }
.fin-page-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  margin-bottom: 24px; flex-wrap: wrap; gap: 12px;
}
.fin-page-sub { font-size: 13px; color: #8a8fa8; margin: 0; }
.fin-updated-badge {
  background: #f0f8f0; border: 1px solid #b2dfb2; color: #2f7a2f;
  border-radius: 10px; padding: 5px 14px; font-size: 12px; white-space: nowrap;
}

/* Finance KPI row */
.fin-kpi-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 14px; margin-bottom: 20px;
}
.fin-kpi-card {
  background: #fff; border-radius: 16px; padding: 16px 18px;
  box-shadow: var(--bento-shadow); display: flex; flex-direction: column; gap: 4px;
  border-left: 4px solid #e2e6f0;
}
.fin-kpi-blue   { border-left-color: #4c6ef5; }
.fin-kpi-green  { border-left-color: #2f9e44; }
.fin-kpi-orange { border-left-color: #f59f00; }
.fin-kpi-icon  { font-size: 18px; }
.fin-kpi-value { font-size: 22px; font-weight: 800; color: #1f2330; line-height: 1.2; }
.fin-kpi-label { font-size: 11px; font-weight: 700; color: #5e6275; text-transform: uppercase; letter-spacing: .4px; }
.fin-kpi-sub   { font-size: 11px; color: #9399b0; }
.fin-val-wb  { color: #4263eb; }
.fin-val-oz  { color: #e67700; }

/* Finance section card */
.fin-section {
  background: #fff; border-radius: 16px; padding: 20px 24px;
  box-shadow: var(--bento-shadow); margin-bottom: 16px;
}
.fin-table-section { margin-bottom: 0; }

/* Finance bar chart */
/* ── Финансы: понятный график выручка/маржа ── */
.fin-chart2 { padding: 4px 0 0; }
.fin-chart2-legend { display: flex; gap: 20px; margin-bottom: 18px; font-size: 13px; color: #5f6275; }
.fc-leg { display: flex; align-items: center; gap: 6px; }
.fc-sw { width: 13px; height: 13px; border-radius: 3px; display: inline-block; }
.fc-sw-rev { background: #4c6ef5; }
.fc-sw-mg { background: #2f9e44; }
.fin-chart2-plot { display: flex; align-items: flex-end; gap: 10px; height: 240px; border-bottom: 2px solid #e5e7eb; padding-top: 22px; }
.fc-group { flex: 1; display: flex; flex-direction: column; align-items: center; height: 100%; justify-content: flex-end; min-width: 0; }
.fc-bars { display: flex; align-items: flex-end; gap: 5px; height: 100%; width: 100%; justify-content: center; }
.fc-bar { width: 30px; max-width: 42%; border-radius: 6px 6px 0 0; position: relative; min-height: 3px; transition: opacity .15s; }
.fc-bar:hover { opacity: .82; }
.fc-bar-rev { background: #4c6ef5; }
.fc-bar-mg { background: #2f9e44; }
.fc-val { position: absolute; top: -18px; left: 50%; transform: translateX(-50%); font-size: 12px; font-weight: 700; color: #3a3f58; white-space: nowrap; }
.fc-month { font-size: 13px; color: #5f6275; margin-top: 8px; font-weight: 600; text-align: center; }
.fc-partial { display: block; font-size: 10px; color: #e8590c; font-weight: 400; }
.fin-chart2-axis { font-size: 11px; color: #9096ab; margin-top: 10px; }

/* Finance detail table */
.fin-detail-table { min-width: 700px; }
.fin-tr-partial td { background: #fff8f8; color: #9399b0; }
.fin-partial-tag {
  font-size: 10px; background: #ffeaea; color: #e03131;
  border-radius: 4px; padding: 1px 5px; margin-left: 6px; vertical-align: middle;
}
.fin-note { font-size: 11px; color: #9399b0; margin-top: 12px; line-height: 1.5; }

/* Finance: sales by article */
.fin-sales-highlights {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px; margin-bottom: 18px;
}
.fin-sales-card {
  border-radius: 14px; padding: 14px 18px; display: flex; flex-direction: column; gap: 4px;
}
.fin-sales-best  { background: #f0f8f0; border: 1px solid #b2dfb2; }
.fin-sales-worst { background: #fff5f0; border: 1px solid #f3c6ae; }
.fin-sales-card-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: #5e6275; }
.fin-sales-card-article { font-size: 16px; font-weight: 800; color: #1f2330; }
.fin-sales-card-stats { font-size: 12px; color: #5e6275; }
.fin-sales-search-row {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin-bottom: 12px; flex-wrap: wrap;
}
.fin-sales-search-row .search-input { max-width: 320px; }
.fin-note-inline { font-size: 11px; color: #9399b0; white-space: nowrap; }
.fin-sales-table { min-width: 640px; }
.fin-sales-rank { color: #9399b0; font-variant-numeric: tabular-nums; }

/* ── 1C badges in card modal ─────────────────────────── */
.modal-1c-badges {
  display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 10px;
}
.badge-1c {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 600; padding: 3px 10px;
  border-radius: 20px; border: 1px solid transparent;
}
.badge-1c-novelty  { background: #eef3ff; color: #3a54cc; border-color: #c7d4fd; }
.badge-1c-regular  { background: #edfaf2; color: #2f7a2f; border-color: #b2dfb2; }
.badge-1c-phaseout { background: #fff0f0; color: #c92a2a; border-color: #ffcccc; }
.badge-1c-date     { background: #f5f6fa; color: #5e6275; border-color: #dde0ea; }
.badge-1c-novcolors{ background: #fff9db; color: #a5730b; border-color: #ffe999; }
.badge-1c-trusy    { background: #f3e8ff; color: #7c3aed; border-color: #e0c8ff; }
.badge-1c-swim     { background: #e3fafc; color: #0b7285; border-color: #99e9f2; }
.card-set-badge    { background: #f3e8ff; color: #7c3aed; }

/* ═══ Состав набора попозиционно в карточке (Паша 29.07) ═══ */
.modal-set-items { margin: 10px 0 14px; border: 1px solid #e6e9f5; border-radius: 14px; background: #fbfbff; overflow: hidden; }
.msi-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding: 10px 14px; background: #f3f0ff; border-bottom: 1px solid #e6e9f5; }
.msi-head-t { font-weight: 800; font-size: 13px; color: #5f3dc4; }
.msi-head-sub { font-size: 12px; color: #6b7089; }
.msi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 10px; padding: 12px 14px; }
.msi-item { display: flex; gap: 10px; background: #fff; border: 1px solid #eef0f8; border-radius: 12px; padding: 10px; }
.msi-photo { width: 84px; min-width: 84px; height: 84px; border-radius: 9px; background: #f5f6fb; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.msi-photo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.msi-noimg { font-size: 11px; color: #9096ab; text-align: center; padding: 0 6px; }
.msi-body { flex: 1; min-width: 0; }
.msi-title { font-weight: 700; font-size: 13px; color: #1f2330; margin-bottom: 4px; }
.msi-row { font-size: 12px; color: #495057; margin-top: 3px; word-break: break-word; }
.msi-art b { color: #1971c2; }
/* ── 🆕 Календарь новинок НАШЕГО процесса (Паша 29.07): источник — доска разработки ── */
.nc-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 12px; }
.nc-tile { background: #fff; border: 1px solid #e6e9f5; border-radius: 12px; padding: 12px 14px; }
.nc-tile-n { font-size: 24px; font-weight: 800; color: #1f2330; line-height: 1.1; }
.nc-tile-l { font-size: 12px; color: #6b7089; margin-top: 3px; }
.nc-tile-late { border-color: #ffc9c9; background: #fff5f5; } .nc-tile-late .nc-tile-n { color: #e03131; }
.nc-tile-today { border-color: #ffe8a3; background: #fffbf0; } .nc-tile-today .nc-tile-n { color: #b06d0a; }

.nc-pipe { display: flex; gap: 4px; align-items: flex-end; overflow-x: auto; padding: 12px 10px 6px; background: #fff; border: 1px solid #e6e9f5; border-radius: 12px; margin-bottom: 12px; }
.nc-pipe-col { flex: 1 0 84px; display: flex; flex-direction: column; align-items: center; gap: 3px; background: none; border: 0; cursor: pointer; padding: 2px; border-radius: 8px; }
.nc-pipe-col:hover { background: #f3f5ff; }
.nc-pipe-on { background: #eef1ff; outline: 1px solid #c3ccff; }
.nc-pipe-bar { width: 26px; background: linear-gradient(180deg, #748ffc, #3b5bdb); border-radius: 5px 5px 0 0; }
.nc-pipe-n { font-size: 12px; font-weight: 700; color: #1f2330; }
.nc-pipe-name { font-size: 10px; color: #6b7089; text-align: center; line-height: 1.15; height: 24px; overflow: hidden; }

.nc-group { margin-bottom: 14px; }
.nc-group-head { display: flex; align-items: baseline; gap: 10px; padding: 9px 14px; background: #f3f0ff; border: 1px solid #e6e9f5; border-radius: 10px 10px 0 0; }
.nc-head-late { background: #fff5f5; border-color: #ffc9c9; }
.nc-group-title { font-weight: 800; font-size: 14px; color: #5f3dc4; }
.nc-group-sum { font-size: 12px; color: #6b7089; }
.nc-late { color: #e03131; }
.nc-group .table-scroll { border: 1px solid #e6e9f5; border-top: 0; border-radius: 0 0 10px 10px; }
.nc-table { width: 100%; min-width: 860px; border-collapse: collapse; background: #fff; }
.nc-table th { font-size: 11px; text-transform: uppercase; letter-spacing: .3px; color: #868ba3; text-align: left; padding: 7px 10px; border-bottom: 1px solid #eef0f8; font-weight: 700; }
.nc-table td { padding: 8px 10px; border-bottom: 1px solid #f4f5fa; font-size: 13px; color: #1f2330; vertical-align: middle; }
.nc-row { cursor: pointer; }
.nc-row:hover { background: #f8f9ff; }
.nc-late-row { background: #fff8f8; }
.nc-row.nc-late td:first-child { box-shadow: inset 3px 0 0 #e03131; }
.nc-row.nc-today td:first-child { box-shadow: inset 3px 0 0 #f59f00; }
.nc-td-photo { width: 46px; }
.nc-photo { width: 38px; height: 38px; object-fit: cover; border-radius: 7px; background: #f5f6fb; }
.nc-nophoto { display: inline-block; width: 38px; height: 38px; border-radius: 7px; background: #f5f6fb; color: #c3c7d6; text-align: center; line-height: 38px; font-size: 12px; }
.nc-type { font-size: 11px; color: #868ba3; margin-top: 1px; }
.nc-td-cat { min-width: 130px; }
.nc-cat { font-size: 12px; font-weight: 600; color: #5f3dc4; }
.nc-search { border: 1px solid #dee2e6; border-radius: 7px; padding: 5px 10px; font-size: 12px; background: #fff; min-width: 190px; }
.nc-search:focus { outline: 2px solid #c3ccff; outline-offset: 0; border-color: #748ffc; }
.nc-date-inp { border: 1px solid #dee2e6; border-radius: 6px; padding: 3px 6px; font-size: 12px; font-weight: 600; background: #fff; color: #1f2330; cursor: pointer; font-family: inherit; }
.nc-date-inp:hover { border-color: #748ffc; background: #f8f9ff; }
.nc-date-inp:focus { outline: 2px solid #c3ccff; outline-offset: 0; border-color: #748ffc; }
.nc-td-stage { min-width: 190px; }
.nc-stage-name { font-size: 12px; font-weight: 600; }
.nc-prog { height: 4px; background: #eef0f8; border-radius: 3px; margin: 4px 0 2px; overflow: hidden; }
.nc-prog span { display: block; height: 100%; background: #3b5bdb; border-radius: 3px; }
.nc-prog-l { font-size: 10px; color: #9096ab; }
.nc-dl { font-size: 12px; font-weight: 600; }
.nc-dl-note { font-size: 11px; color: #868ba3; }
.nc-late .nc-dl-note { color: #e03131; font-weight: 600; }
.nc-today .nc-dl-note { color: #b06d0a; font-weight: 600; }
.nc-src { font-size: 10px; color: #9096ab; }
.nc-td-resp { min-width: 150px; }

/* Правка карточки: название/тип/фабрика/ответственный/дата входа (Паша 29.07, для всех) */
.modal-edit-btn { font-size: 12px; font-weight: 600; color: #3b5bdb; background: #eef1ff; border: 1px solid #d0d9ff; border-radius: 8px; padding: 4px 10px; cursor: pointer; }
.modal-edit-btn:hover { background: #dfe4ff; }
.modal-edit-panel { margin: 10px 0 14px; padding: 14px; background: #f8f9ff; border: 1px solid #e3e7fb; border-radius: 12px; }
.mep-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px 14px; }
.mep-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: #5b6178; }
.mep-field.mep-wide { grid-column: 1 / -1; }
.mep-field input, .mep-field select { font: inherit; font-weight: 400; font-size: 13px; color: #1f2330; padding: 7px 9px; border: 1px solid #d7dbe8; border-radius: 8px; background: #fff; }
.mep-field input:focus, .mep-field select:focus { outline: 2px solid #a9b6ff; outline-offset: 0; border-color: #a9b6ff; }
.mep-actions { display: flex; align-items: center; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
.mep-save { font-size: 13px; font-weight: 600; color: #fff; background: #3b5bdb; border: 0; border-radius: 8px; padding: 8px 16px; cursor: pointer; }
.mep-save:hover { background: #2f4bc4; }
.mep-hint { font-size: 11px; color: #868ba3; }
.msi-photo img { cursor: zoom-in; }
/* Ручная подгрузка эскиза позиции набора (Паша 29.07) */
.msi-upload { display: inline-block; margin-top: 6px; font-size: 11px; font-weight: 600; color: #3b5bdb; background: #eef1ff; border: 1px dashed #c3ccff; border-radius: 7px; padding: 3px 8px; cursor: pointer; }
.msi-upload:hover { background: #dfe4ff; border-color: #a9b6ff; }
.msi-upload input { display: none; }
.msi-upload-busy { color: #6b7089; background: #f1f3f7; border-style: solid; border-color: #e6e9f5; cursor: progress; }
.badge-1c-cat      { background: #fff4e6; color: #d9480f; border-color: #ffd8a8; }
.badge-1c-type     { background: #f3f0ff; color: #6741d9; border-color: #d0bfff; }

/* ── Фабрики: Цены ───────────────────────────────────────────────── */
.fp-toolbar {
  display: flex; align-items: center; gap: 12px; margin-bottom: 10px; flex-wrap: wrap;
}
.fp-select {
  padding: 8px 10px; border: 1px solid #d6dceb; border-radius: 8px;
  font-size: 13px; background: #f8fafd; min-width: 220px;
}
.fp-count { font-size: 12px; color: #5e6275; }
.fp-table-wrap { overflow-x: auto; }
.fp-table th, .fp-table td { vertical-align: middle; }
.fp-photo-cell { width: 64px; text-align: center; }
.fp-article-photo {
  width: 52px; height: 52px; object-fit: cover; border-radius: 8px;
  cursor: pointer; border: 1px solid #d6dceb;
  transition: opacity .15s;
}
.fp-article-photo:hover { opacity: .8; }
.fp-photo-btn {
  font-size: 11px; color: #5e6275; background: #f0f2f8;
  border: 1px dashed #c4c9de; border-radius: 8px;
  padding: 6px 8px; cursor: pointer; white-space: nowrap;
}
.fp-photo-btn:hover { background: #e4e7f5; }
.fp-article { font-family: monospace; font-size: 13px; font-weight: 600; color: #1f2330; }
.fp-name { font-size: 13px; color: #3a3f58; max-width: 200px; }
.fp-factory-cell { font-size: 12px; color: #5e6275; max-width: 220px; }
.fp-price { font-weight: 700; color: #2a5c91; font-size: 14px; white-space: nowrap; }
.fp-sizes-col { max-width: 380px; font-size: 12px; color: #3a3f58; }
.fp-price-col { white-space: nowrap; }
.fp-line { padding: 2px 0; line-height: 1.5; border-bottom: 1px dashed #eef0f5; }
.fp-line:last-child { border-bottom: none; }
.fp-line-price { font-size: 12px; font-weight: 600; color: #0f6e56; }
.fp-price-higher { color: #e8590c; }
.fp-date { font-size: 12px; color: #5e6275; white-space: nowrap; }

/* ── Поиск новых фабрик ─────────────────────────────────────────── */
.fp-prospects-hint { font-size: 13px; color: #5e6275; margin: 2px 0 14px; }
.fp-prospects-table th, .fp-prospects-table td { vertical-align: middle; }
.prospect-name { font-weight: 600; color: #1f2330; }
.prospect-contact { font-size: 12px; color: #3a3f58; }
.prospect-note { font-size: 12px; color: #5e6275; max-width: 220px; word-break: break-word; overflow-wrap: break-word; }
.prospect-editable { cursor: text; }
.prospect-editable:hover { background: #f3f6ff; }
.cell-edit-input {
  width: 100%; min-width: 80px; border: 1.5px solid #4f7ef8; border-radius: 5px;
  padding: 3px 6px; font-size: 13px; font-family: inherit; outline: none;
  background: #fff; box-shadow: 0 0 0 3px rgba(79,126,248,0.12);
}
.prospect-actions { white-space: nowrap; } .prospect-del-btn {
  background: none; border: 1px solid #dde0ea; border-radius: 6px;
  cursor: pointer; padding: 3px 7px; font-size: 13px;
  transition: background .15s;
}
.prospect-del-btn:hover { background: #fff0f0; }
.prospect-status {
  display: inline-block; padding: 2px 10px; border-radius: 20px;
  font-size: 12px; font-weight: 500; border: 1px solid transparent;
}
.prospect-s-active   { background: #edfaf2; color: #2f7a2f; border-color: #b2dfb2; }
.prospect-s-talks    { background: #eef3ff; color: #3a54cc; border-color: #c7d4fd; }
.prospect-s-samples  { background: #fff8e6; color: #9a6200; border-color: #fce8a0; }
.prospect-s-test     { background: #f0fffe; color: #176b7a; border-color: #b2e6ec; }
.prospect-s-frozen   { background: #f0f2f8; color: #7a8299; border-color: #cdd0e0; }
.prospect-s-rejected { background: #fff0f0; color: #c92a2a; border-color: #ffcccc; }

.prospect-yn {
  display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 12px;
  font-weight: 600; border: 1px solid transparent;
}
.prospect-yn-yes     { background: #edfaf2; color: #2f7a2f; border-color: #b2dfb2; }
.prospect-yn-no      { background: #fff0f0; color: #c92a2a; border-color: #ffcccc; }
.prospect-yn-unknown { background: #f5f6fa; color: #868ba3; border-color: #dde0ea; }

.prospect-rating {
  display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 12px;
  font-weight: 700; border: 1px solid transparent;
}
.prospect-rating-high { background: #edfaf2; color: #2f7a2f; border-color: #b2dfb2; }
.prospect-rating-mid  { background: #fff8e6; color: #9a6200; border-color: #fce8a0; }
.prospect-rating-low  { background: #fff0f0; color: #c92a2a; border-color: #ffcccc; }

.pm-rating-preview {
  background: #f5f6fa; border-radius: 8px; padding: 10px 12px; margin: 4px 0 12px;
  font-size: 14px; font-weight: 600; color: #1f2330;
}
.pm-rating-preview #pm-rating-preview-value { color: #3a54cc; }
.pm-rating-hint { font-size: 12px; font-weight: 400; color: #868ba3; margin-top: 4px; }
.pc-table td.od-td-name { vertical-align: top; }
.pc-export-bar .pagination-export-btn { text-decoration: none; display: inline-block; }

/* ── Переключатель вида ── */
/* Подвкладки календаря: с 7-й кнопкой («Таймлайн сезона») полоска перестала влезать в узкий
   экран и растягивала страницу по горизонтали — переносим на вторую строку. */
.pc-view-toggle { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.pc-vtab {
  background: #fff; border: 1px solid #dde0ea; border-radius: 8px;
  padding: 7px 14px; font-size: 13px; cursor: pointer; color: #5f6275; transition: all .15s;
}
.pc-vtab:hover { background: #f3f6ff; }
.pc-vtab-active { background: #4f7ef8; border-color: #4f7ef8; color: #fff; font-weight: 600; }

/* ── Гант по одному артикулу (поиск) ── */
.pcg2-searchbar { position: relative; max-width: 440px; margin-bottom: 18px; }
.pcg2-search { display: flex; align-items: center; gap: 8px; border: 1.5px solid #dde0ea; border-radius: 10px; padding: 0 12px; background: #fff; }
.pcg2-search:focus-within { border-color: #4f7ef8; box-shadow: 0 0 0 3px rgba(79,126,248,.12); }
.pcg2-search input { flex: 1; border: none; outline: none; padding: 11px 0; font-size: 15px; background: transparent; color: #1f2330; }
.pcg2-search-ic { color: #9096ab; font-size: 15px; }
.pcg2-clear { border: none; background: none; font-size: 22px; color: #9096ab; cursor: pointer; line-height: 1; padding: 0 2px; }
.pcg2-clear:hover { color: #e03131; }
.pcg2-suggest { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #fff; border: 1px solid #dde0ea; border-radius: 10px; box-shadow: 0 6px 22px rgba(30,35,70,.14); z-index: 30; max-height: 340px; overflow-y: auto; }
.pcg2-sg { display: flex; align-items: center; gap: 10px; padding: 9px 12px; cursor: pointer; border-bottom: 1px solid #f1f2f6; }
.pcg2-sg:last-child { border-bottom: none; }
.pcg2-sg:hover { background: #f3f6ff; }
.pcg2-sg-art { font-weight: 600; font-size: 14px; color: #1f2330; }
.pcg2-sg-fac { font-size: 12px; color: #9096ab; }
.pcg2-sg-ok { margin-left: auto; font-size: 10px; color: #0f6e56; background: #e1f5ee; padding: 2px 8px; border-radius: 8px; }
.pcg2-sg-no { margin-left: auto; font-size: 10px; color: #8a6d1a; background: #faeeda; padding: 2px 8px; border-radius: 8px; }
.pcg2-sg-empty { padding: 14px; color: #9096ab; font-size: 13px; }
.pcg2-hint { text-align: center; padding: 44px 20px; color: #6b7089; font-size: 14px; line-height: 1.8; }
.pcg2-hint-big { font-size: 17px; font-weight: 600; color: #3a3f58; }
.pcg2-hint-sub { font-size: 12px; color: #9096ab; }
.pcg2-info { display: flex; align-items: center; gap: 14px; background: #f8f9fc; border: 1px solid #e5e7eb; border-radius: 12px; padding: 12px 16px; margin-bottom: 14px; }
.pcg2-photo { width: 54px; height: 54px; object-fit: cover; border-radius: 8px; border: 1px solid #e5e7eb; flex: none; }
.pcg2-info-main { flex: 1; min-width: 0; }
.pcg2-info-top { display: flex; align-items: baseline; gap: 10px; }
.pcg2-info-art { font-size: 19px; font-weight: 700; color: #1f2330; }
.pcg2-info-fac { font-size: 13px; color: #6b7089; }
.pcg2-info-meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; color: #5f6275; margin-top: 4px; }
.pcg2-open { border: 1px solid #4f7ef8; color: #4f7ef8; background: #fff; border-radius: 8px; padding: 8px 14px; font-size: 13px; cursor: pointer; white-space: nowrap; }
.pcg2-open:hover { background: #eef3ff; }
.pcg2-warn { background: #fff6f6; border: 1px solid #f2b8b8; color: #c92a2a; border-radius: 9px; padding: 9px 14px; font-size: 13px; margin-bottom: 12px; }
.pcg2-cal { display: flex; border: 1px solid #e5e7eb; border-radius: 10px; overflow: hidden; background: #fff; }
.pcg2-lcol { flex: none; width: 212px; border-right: 1.5px solid #e5e7eb; }
.pcg2-lhead { height: 44px; padding: 0 12px 6px; display: flex; align-items: flex-end; font-size: 11px; font-weight: 600; color: #5f6275; background: #f8f9fc; border-bottom: 1.5px solid #e5e7eb; box-sizing: border-box; }
.pcg2-lrow { height: 34px; display: flex; align-items: center; padding: 0 12px; border-bottom: 1px solid #f1f2f6; box-sizing: border-box; }
.pcg2-lrow:last-child { border-bottom: none; }
.pcg2-lname { font-size: 12px; color: #3a3f58; }
.pcg2-scroll { overflow-x: auto; flex: 1; }
.pcg2-rhead { position: relative; height: 44px; background: #f8f9fc; border-bottom: 1.5px solid #e5e7eb; }
.pcg2-months { position: relative; height: 22px; }
.pcg2-month { position: absolute; top: 0; font-size: 11px; font-weight: 600; color: #6b7089; padding: 4px; border-left: 1px solid #e5e7eb; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-transform: capitalize; }
.pcg2-weeks { position: relative; height: 22px; }
.pcg2-wtick { position: absolute; top: 0; font-size: 10px; color: #b4b2a9; padding-left: 2px; border-left: 1px solid #f1f2f6; height: 100%; box-sizing: border-box; }
.pcg2-rbody { position: relative; }
.pcg2-today { position: absolute; top: 0; bottom: 0; width: 2px; background: #e8590c; z-index: 3; }
.pcg2-track { position: relative; height: 34px; border-bottom: 1px solid #f1f2f6; box-sizing: border-box; }
.pcg2-track:last-child { border-bottom: none; }
.pcg2-row-summary .pcg2-track { background: #fafbff; }
.pcg2-dot { position: absolute; top: 10px; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.1); z-index: 2; }
.pcg2-dot-lbl { position: absolute; top: 9px; font-size: 11px; color: #5f6275; white-space: nowrap; }
.pcg2-foot { font-size: 11px; color: #9096ab; margin-top: 8px; }
/* группы (раскрывающиеся блоки) */
.pcg2-grp { height: 36px; display: flex; align-items: center; gap: 8px; padding: 0 12px; background: #f3f5fb; border-bottom: 1px solid #e5e7eb; box-sizing: border-box; cursor: pointer; font-weight: 600; font-size: 12px; color: #2c3350; }
.pcg2-grp:hover { background: #eaeefb; }
.pcg2-chev { font-size: 10px; color: #6b7089; transition: transform .15s; }
.pcg2-grp.pcg2-collapsed .pcg2-chev { transform: rotate(-90deg); }
.pcg2-grp-name { flex: 1; }
.pcg2-grp-cnt { font-size: 10px; padding: 1px 7px; border-radius: 8px; font-weight: 600; }
.pcg2-grp-track { height: 36px; border-bottom: 1px solid #e5e7eb; background: #f3f5fb; position: relative; box-sizing: border-box; cursor: pointer; }
.pcg2-grp-track:hover { background: #eaeefb; }
.pcg2-gbar { position: absolute; top: 13px; height: 10px; border-radius: 4px; opacity: .55; }
.pcg2-lrow.pcg2-child { height: 30px; padding-left: 26px; }
.pcg2-track.pcg2-child { height: 30px; }
.pcg2-lname-late { color: #e03131; font-weight: 600; }
.pcg2-hidden { display: none !important; }
.pcg2-dot-late { box-shadow: 0 0 0 2px rgba(224,49,49,.3); }
/* вкладка «Фабрики» произв. календаря */
.fn-note { font-size: 12px; color: #6b7089; margin-bottom: 14px; background: #f8f9fc; border: 1px solid #e5e7eb; border-radius: 9px; padding: 8px 12px; }
.fn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 14px; }
.fn-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 14px 16px; }
.fn-card-late { border-color: #f2b8b8; }
.fn-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.fn-code { font-size: 16px; font-weight: 700; color: #1f2330; }
.fn-sup { font-size: 11px; color: #9096ab; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fn-flow { margin-bottom: 12px; }
.fn-flow-num { font-size: 24px; font-weight: 700; color: #1f2330; display: inline-block; margin-right: 6px; }
.fn-flow-lbl { display: inline-block; font-size: 12px; color: #6b7089; }
.fn-flow-bar { display: flex; height: 8px; border-radius: 4px; overflow: hidden; margin-top: 6px; background: #eef0f5; }
.fn-seg-late { background: #e03131; }
.fn-seg-soon { background: #f59f00; }
.fn-seg-later { background: #37b24d; }
.fn-flow-caption { font-size: 11px; color: #6b7089; margin-top: 4px; }
.fn-late-txt { color: #c92a2a; font-weight: 600; }
.fn-sec { border-top: 1px solid #f1f2f6; padding-top: 8px; margin-top: 8px; }
.fn-sec-title { font-size: 11px; font-weight: 600; color: #5f6275; margin-bottom: 5px; }
.fn-ev { font-size: 12px; color: #3a3f58; padding: 2px 0; }
.fn-ev-date { font-weight: 600; color: #3a54cc; margin-right: 4px; }
.fn-ev-cnt { color: #9096ab; font-size: 11px; }
.fn-none { font-size: 11px; color: #b4b2a9; }
.fn-msg { padding: 4px 0; border-bottom: 1px dashed #f1f2f6; }
.fn-msg:last-child { border-bottom: none; }
.fn-msg-meta { font-size: 10px; color: #9096ab; font-weight: 600; }
.fn-msg-txt { font-size: 12px; color: #3a3f58; line-height: 1.4; margin-top: 1px; }

/* Плановые даты по этапам (в модалке карточки) */
.modal-stage-plans {
  background: #f7f8fc; border: 1px solid #e4e7f2; border-radius: 10px;
  padding: 12px 14px; margin: 0 0 16px;
}
.modal-stage-plans.hidden { display: none; }
.msp-rows { display: flex; flex-direction: column; gap: 6px; }
.msp-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; font-size: 13px; color: #1f2330;
}
.msp-row input[type="date"] {
  padding: 5px 8px; border: 1px solid #d6dceb; border-radius: 8px; font-size: 12px;
}

/* ── Каталог продукции ─────────────────────────────────────────────────────── */
.catalog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
  margin-top: 16px;
}
.catalog-card {
  background: #fff;
  border: 1px solid #e4e7f5;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(44,50,80,.07);
  display: flex;
  flex-direction: column;
  transition: box-shadow .15s;
}
.catalog-card:hover { box-shadow: 0 4px 16px rgba(44,50,80,.14); }
.catalog-card-photo {
  width: 100%;
  height: 160px;
  background: #f2f4fb;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.catalog-card-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.catalog-no-photo {
  font-size: 11px;
  color: #787e93;
}
.catalog-card-body {
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.catalog-card-article {
  font-family: monospace;
  font-size: 13px;
  font-weight: 700;
  color: #2a5c91;
}
.catalog-card-title {
  font-size: 13px;
  font-weight: 600;
  color: #1f2330;
  line-height: 1.3;
}
.catalog-card-meta {
  font-size: 11px;
  color: #6b7080;
}

/* ── Карточки канбана — расширенный вид ───────────────────────────────────── */
.card-type-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 4px 0 2px;
}
/* Тип изделия — фиолетовый (как в модалке), категория 1С — оранжевый. Единый язык. */
.card-type-chip {
  font-size: 10px;
  font-weight: 700;
  background: #f3f0ff;
  color: #6741d9;
  border-radius: 8px;
  padding: 1px 7px;
}
.card-cat-chip {
  font-size: 10px;
  font-weight: 600;
  background: #fff4e6;
  color: #d9480f;
  border-radius: 8px;
  padding: 1px 7px;
}
.card-chip-unknown {
  font-size: 10px;
  background: #f1f3f5;
  color: #868e96;
  border-radius: 8px;
  padding: 1px 7px;
}
/* Факты из таблицы разработки (в модалке карточки) */
.modal-dev-facts { margin: 8px 0; }
.df-box { border: 1px solid #e3e6ec; border-radius: 10px; background: #fbfcfe; overflow: hidden; }
.df-sum { cursor: pointer; padding: 9px 12px; font-weight: 700; font-size: 13px; color: #2b3240; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.df-cnt { background: #4c6ef5; color: #fff; border-radius: 10px; padding: 0 8px; font-size: 11px; }
.df-src { font-weight: 500; font-size: 11px; color: #868e96; margin-left: auto; }
.df-src-tag { font-size: 11px; opacity: .8; }
/* Плашка «синк протух» (мониторинг данных) */
.sync-warning { position: fixed; top: 0; left: 0; right: 0; z-index: 9000; background: #e03131; color: #fff;
  font-size: 13px; line-height: 1.35; padding: 9px 18px; text-align: center; box-shadow: 0 2px 10px rgba(0,0,0,.2); }
.sync-warning b { font-weight: 800; }
.badge-1c-type2 { background: #f5f6fa; color: #5e6275; border-color: #dde0ea; }
.card-1c-badge {
  margin: 2px 0;
}
.card-files-pill {
  font-size: 11px;
  color: #5e6275;
  margin-left: auto;
  white-space: nowrap;
}

/* ── ABC-анализ ────────────────────────────────────────────────────────────── */
.abc-summary-row {
  display: flex;
  gap: 16px;
  margin: 14px 0 10px;
}
.abc-summary-card {
  flex: 1;
  border-radius: 10px;
  padding: 14px 16px;
  min-width: 0;
}
.abc-grade {
  font-size: 18px;
  font-weight: 800;
  margin-bottom: 4px;
}
.abc-count {
  font-size: 13px;
  color: #3a3f58;
  margin-bottom: 2px;
}
.abc-rev {
  font-size: 15px;
  font-weight: 700;
  color: #1f2330;
}
.abc-pct {
  font-size: 13px;
  color: #3a3f58;
}
.abc-hint {
  font-size: 11px;
  color: #868ba3;
  margin-top: 4px;
}
.abc-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  border-radius: 6px;
  padding: 2px 8px;
  letter-spacing: .05em;
}
.abc-badge-a { background: #ebfbee; color: #2f9e44; }
.abc-badge-b { background: #fff9db; color: #e67700; }
.abc-badge-c { background: #fff5f5; color: #e03131; }

/* ── Модал карточки каталога ───────────────────────────────────────────────── */
.catalog-item-modal-box {
  position: relative;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 40px rgba(30,35,60,.22);
  max-width: 860px;
  width: 95vw;
  max-height: 90vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.catalog-item-modal-close {
  position: absolute;
  top: 14px;
  right: 16px;
  z-index: 10;
  background: rgba(255,255,255,.85);
  border: none;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: #3a3f58;
}
.catalog-item-modal-close:hover { background: #e8eeff; }
.catalog-item-modal-inner {
  display: flex;
  flex: 1;
  overflow: hidden;
}
.catalog-item-modal-photo {
  width: 42%;
  min-width: 220px;
  background: #f2f4fb;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
.catalog-item-modal-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.catalog-item-modal-info {
  flex: 1;
  padding: 28px 28px 24px;
  overflow-y: auto;
}
.cim-sku {
  font-family: monospace;
  font-size: 13px;
  color: #868ba3;
  margin-bottom: 4px;
  letter-spacing: .04em;
}
.cim-title {
  font-size: 20px;
  font-weight: 700;
  color: #1f2330;
  line-height: 1.3;
  margin-bottom: 8px;
}
.cim-section-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #868ba3;
  margin: 18px 0 8px;
}
.cim-props {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #e8eeff;
  border-radius: 8px;
  overflow: hidden;
}
.cim-prop {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid #e8eeff;
  gap: 12px;
}
.cim-prop:last-child { border-bottom: none; }
.cim-prop:nth-child(even) { background: #f8f9ff; }
.cim-prop-key {
  font-size: 12px;
  color: #868ba3;
  min-width: 140px;
  flex-shrink: 0;
}
.cim-prop-val {
  font-size: 13px;
  color: #1f2330;
}

/* ── Фильтр-селект (каталог, УТП) ────────────────────────────────────────── */
.filter-select {
  height: 38px;
  padding: 0 10px;
  border: 1.5px solid #dde2f5;
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
  color: #1f2330;
  cursor: pointer;
  outline: none;
  min-width: 130px;
  max-width: 200px;
}
.filter-select:focus { border-color: #6879e3; }

/* ── УТП — сетка карточек ────────────────────────────────────────────────── */
.utp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
  margin-top: 16px;
}
.utp-card {
  background: #fff;
  border: 1.5px solid #e8eeff;
  border-radius: 14px;
  padding: 16px;
  transition: box-shadow 0.18s, border-color 0.18s;
}
.utp-card:hover {
  box-shadow: 0 4px 18px rgba(104,121,227,0.13);
  border-color: #b0baee;
}
.utp-card-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.utp-card-article {
  font-size: 17px;
  font-weight: 700;
  color: #3040b0;
}
.utp-card-brand {
  font-size: 13px;
  font-weight: 600;
  background: #eef0ff;
  color: #5260cc;
  border-radius: 6px;
  padding: 2px 8px;
}
.utp-card-name {
  font-size: 14px;
  font-weight: 600;
  color: #1f2330;
  margin-bottom: 6px;
}
.utp-card-meta {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.utp-card-points {
  margin: 8px 0 0 0;
  padding-left: 18px;
  font-size: 12px;
  color: #374151;
  line-height: 1.6;
}
.utp-card-points li {
  margin-bottom: 2px;
}

/* ── УТП — модал ─────────────────────────────────────────────────────────── */
.utp-item-modal-box {
  background: #fff;
  border-radius: 18px;
  width: 720px;
  max-width: 96vw;
  max-height: 88vh;
  overflow-y: auto;
  padding: 32px 36px 28px;
  position: relative;
}
.utp-modal-top {
  margin-bottom: 14px;
}
.utp-modal-name {
  font-size: 18px;
  font-weight: 700;
  color: #1f2330;
  margin-top: 6px;
}
.utp-modal-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1.5px solid #e8eeff;
}
.utp-modal-meta-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
}
.utp-modal-meta-key {
  font-size: 11px;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.utp-modal-section {
  margin-bottom: 18px;
}
.utp-modal-section-title {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #6879e3;
  margin-bottom: 8px;
}
.utp-modal-list {
  margin: 0;
  padding-left: 20px;
  font-size: 13px;
  color: #1f2330;
  line-height: 1.75;
}
.utp-modal-list li { margin-bottom: 4px; }
.utp-modal-text {
  font-size: 13px;
  color: #374151;
  line-height: 1.75;
  margin: 0;
  white-space: pre-line;
}
.utp-size-chart-link {
  display: inline-block;
  font-size: 13px;
  color: #6879e3;
  text-decoration: none;
  font-weight: 600;
  margin-top: 2px;
}
.utp-size-chart-link:hover { text-decoration: underline; }

/* ── УТП — карточки с фото ───────────────────────────────────────────────── */
.utp-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
.utp-card-photo-wrap {
  width: 100%;
  background: #f0f2f8;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.utp-card-photo-img {
  width: 100%;
  height: auto;
  max-height: 200px;
  object-fit: contain;
  display: block;
}
.utp-card-body {
  padding: 14px 16px 16px;
}

/* ── УТП — модал двухколоночный ──────────────────────────────────────────── */
.utp-item-modal-box {
  width: 900px;
  max-width: 96vw;
  padding: 0;
  overflow: hidden;
}
.utp-modal-layout {
  display: flex;
  min-height: 500px;
}
.utp-modal-photo-col {
  width: 300px;
  flex-shrink: 0;
  background: #f0f2f8;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: sticky;
  top: 0;
  align-self: flex-start;
}
.utp-modal-photo-img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  image-rendering: -webkit-optimize-contrast;
}
.utp-modal-info-col {
  flex: 1;
  padding: 28px 30px 28px;
  overflow-y: auto;
  max-height: 85vh;
}

/* ── УТП — форма добавления/редактирования ───────────────────────────────── */
.utp-edit-form { display: flex; flex-direction: column; gap: 14px; }
.utp-edit-row  { display: flex; gap: 14px; }
.utp-edit-row .utp-edit-field { flex: 1; }
.utp-edit-field { display: flex; flex-direction: column; gap: 5px; }
.utp-edit-field label { font-size: 12px; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: 0.4px; }
.utp-edit-field input,
.utp-edit-field textarea {
  border: 1.5px solid #dde2f5;
  border-radius: 8px;
  padding: 8px 11px;
  font-size: 13px;
  font-family: inherit;
  color: #1f2330;
  resize: vertical;
  outline: none;
  transition: border-color 0.15s;
}
.utp-edit-field input:focus,
.utp-edit-field textarea:focus { border-color: #6879e3; }
.utp-photo-upload-area {
  position: relative;
  border: 2px dashed #c5cbe8;
  border-radius: 10px;
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
  padding: 12px;
}
.utp-photo-upload-area:hover { border-color: #6879e3; background: #f5f6ff; }
#utp-photo-placeholder { display: flex; flex-direction: column; align-items: center; gap: 6px; color: #6b7280; font-size: 13px; position: relative; }
.btn-danger { background: #fee2e2; color: #b91c1c; border: none; border-radius: 8px; padding: 8px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
.btn-danger:hover { background: #fecaca; }
.utp-card { position: relative; }
.utp-card-edit-btn { display: none; position: absolute; top: 8px; right: 8px; background: rgba(255,255,255,0.9); border: 1px solid #e5e7eb; border-radius: 6px; padding: 3px 7px; font-size: 13px; cursor: pointer; z-index: 2; }
.utp-card:hover .utp-card-edit-btn { display: inline-block; }

/* ── Plan Novinka form ─────── */
.pn-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.pn-form-full { grid-column: 1 / -1; }

/* ── Plan Novinka tabs ─────── */
.pn-tabs { display: flex; gap: 4px; margin-bottom: 18px; border-bottom: 2px solid #e5e7eb; }
.pn-tab { background: none; border: none; border-bottom: 2px solid transparent; margin-bottom: -2px; padding: 8px 18px; font-size: 14px; font-weight: 600; color: #6b7280; cursor: pointer; transition: color .15s, border-color .15s; }
.pn-tab.active { color: #4f46e5; border-bottom-color: #4f46e5; }
.pn-tab:hover:not(.active) { color: #374151; }

/* ── Новинки из 1С grid ─────── */
.pn-onec-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; margin-top: 12px; }
.pn-onec-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; }
.pn-onec-photo { height: 140px; background: #f8f9fa; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.pn-onec-photo img { max-width: 100%; max-height: 140px; object-fit: contain; }
.pn-onec-body { padding: 10px 12px; flex: 1; display: flex; flex-direction: column; gap: 4px; }
.pn-onec-article { font-size: 13px; font-weight: 700; color: #2a5c91; font-family: monospace; }
.pn-onec-name { font-size: 12px; color: #374151; line-height: 1.4; flex: 1; }
.pn-onec-type { font-size: 11px; color: #6b7280; }
.pn-onec-date { font-size: 11px; color: #6741d9; font-weight: 600; }
.pn-onec-sales { font-size: 11px; color: #2f9e44; }
.pn-onec-footer { padding: 8px 12px; border-top: 1px solid #f3f4f6; display: flex; gap: 6px; align-items: center; }
.pn-onec-planned-badge { font-size: 11px; font-weight: 600; color: #6741d9; background: #6741d918; padding: 2px 8px; border-radius: 10px; }
.pn-onec-add-btn { font-size: 11px; font-weight: 600; background: #4f46e5; color: #fff; border: none; border-radius: 7px; padding: 4px 12px; cursor: pointer; }
.pn-onec-add-btn:hover { background: #4338ca; }

/* ── Nav active highlight ─────── */
.tasks-btn.nav-active {
  background: rgba(99, 102, 241, 0.12) !important;
  color: #4f46e5 !important;
  font-weight: 700;
}

/* ── Catalog view toggle ─────── */
.catalog-view-btn {
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 7px;
  padding: 5px 10px;
  font-size: 16px;
  cursor: pointer;
  color: #6b7280;
  line-height: 1;
  transition: background .15s, color .15s;
}
.catalog-view-btn:hover { background: #e5e7eb; color: #374151; }
.catalog-view-btn-active { background: #4f46e5 !important; color: #fff !important; border-color: #4f46e5 !important; }

/* ── Catalog list view ─────── */
.catalog-list-view { width: 100%; overflow-x: auto; margin-top: 8px; }
.catalog-list-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.catalog-list-table thead th { background: #f8f9fa; border-bottom: 2px solid #e5e7eb; padding: 8px 10px; text-align: left; font-size: 12px; font-weight: 600; color: #6b7280; white-space: nowrap; }
.catalog-list-table tbody tr { border-bottom: 1px solid #f3f4f6; transition: background .12s; cursor: pointer; }
.catalog-list-table tbody tr:hover { background: #f8f9fb; }
.catalog-list-table td { padding: 6px 10px; vertical-align: middle; }
.catalog-list-photo-cell { width: 64px; padding: 4px 6px !important; }
.catalog-list-thumb { width: 54px; height: 54px; object-fit: contain; border-radius: 6px; background: #f8f9fa; display: block; }
.catalog-list-article { font-weight: 700; color: #2a5c91; font-family: monospace; font-size: 12px; white-space: nowrap; }

/* ── Team center status ─────── */
.tc-status-btn { border: none; border-radius: 10px; padding: 2px 10px; font-size: 11px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.tc-status-open { background: #fef3c7; color: #92400e; }
.tc-status-open:hover { background: #fde68a; }
.tc-status-resolved { background: #d1fae5; color: #065f46; }
.tc-status-resolved:hover { background: #a7f3d0; }

/* ── Glossary ─────── */
.glossary-body { max-width: 860px; }
.glossary-section { margin-bottom: 32px; }
.glossary-section-title { font-size: 16px; font-weight: 700; color: #1f2330; margin: 0 0 12px; padding-bottom: 6px; border-bottom: 2px solid #e5e7eb; }
.glossary-dl { margin: 0; display: grid; grid-template-columns: 220px 1fr; gap: 6px 16px; align-items: baseline; }
.glossary-dl dt { font-weight: 700; color: #2a5c91; font-size: 13px; padding: 4px 0; }
.glossary-dl dd { margin: 0; font-size: 13px; color: #374151; line-height: 1.5; padding: 4px 0; border-bottom: 1px solid #f3f4f6; }
.glossary-dl dt { border-bottom: 1px solid #f3f4f6; }

/* ── Правая панель редактирования (Plan Novinka) ─── */
.pn-panel-overlay {
  position: fixed; inset: 0; background: rgba(15,20,50,0.35); z-index: 1100;
  transition: opacity .2s;
}
.pn-panel-overlay.hidden { display: none; }

.pn-panel {
  position: fixed; top: 0; right: 0; bottom: 0; width: 380px;
  background: #fff; z-index: 1101; display: flex; flex-direction: column;
  box-shadow: -4px 0 24px rgba(15,20,50,0.15);
  transform: translateX(100%); transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.pn-panel.pn-panel-open { transform: translateX(0); }

.pn-panel-header {
  display: flex; align-items: flex-start; justify-content: space-between;
  padding: 18px 18px 14px; border-bottom: 1px solid #e5e7eb; gap: 10px;
}
.pn-panel-article-tag {
  font-size: 11px; font-weight: 700; color: #4f46e5;
  background: #eef2ff; padding: 2px 9px; border-radius: 10px;
  display: inline-block; margin-bottom: 5px; font-family: monospace;
}
.pn-panel-title { font-size: 15px; font-weight: 700; color: #1f2330; line-height: 1.3; }
.pn-panel-close-btn {
  background: none; border: none; font-size: 22px; color: #6b7280;
  cursor: pointer; padding: 0 4px; line-height: 1; flex-shrink: 0; margin-top: -2px;
}
.pn-panel-close-btn:hover { color: #374151; }

.pn-panel-body { flex: 1; overflow-y: auto; padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; }
.pn-panel-footer {
  padding: 12px 18px; border-top: 1px solid #e5e7eb;
  display: flex; gap: 8px; justify-content: flex-end;
}

/* ── Пагинация Plan Novinka ─── */
.pn-pagination-bar {
  display: flex; align-items: center; gap: 16px; padding: 10px 4px;
  font-size: 13px; color: #6b7280; flex-wrap: wrap;
}
.pn-pag-info { flex: 1; min-width: 120px; }
.pn-pag-controls { display: flex; align-items: center; gap: 6px; }
.pn-pag-btn {
  background: #f3f4f6; border: 1px solid #e5e7eb; border-radius: 6px;
  padding: 3px 10px; font-size: 16px; cursor: pointer; color: #374151;
  line-height: 1.4;
}
.pn-pag-btn:hover:not(:disabled) { background: #e5e7eb; }
.pn-pag-btn:disabled { opacity: .4; cursor: default; }
.pn-pag-page { font-size: 13px; color: #374151; min-width: 50px; text-align: center; }
.pn-pag-size { display: flex; align-items: center; gap: 6px; }
.pn-pag-size label { font-size: 13px; color: #6b7280; }
.pn-pag-size select {
  border: 1px solid #e5e7eb; border-radius: 6px; padding: 3px 8px;
  font-size: 13px; background: #f9fafb; cursor: pointer;
}
.ref-block {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 16px 18px 12px;
}
.ref-table { width: 100%; }
.ref-table th:first-child, .ref-table td.ref-num { width: 40px; text-align: center; color: #6b7280; }
.ref-table td.ref-count { text-align: right; color: #4b5563; font-variant-numeric: tabular-nums; }
.ref-size-tag {
  display: inline-block; background: #f0f4fa; border: 1px solid #dde3f0;
  border-radius: 5px; padding: 2px 10px; font-size: 13px;
  font-weight: 600; color: #2a5c91; font-family: monospace;
}
code.ref-code {
  background: #f3f4f6; border-radius: 4px; padding: 2px 7px;
  font-size: 12px; color: #6b7280; font-family: monospace;
}
.ref-pag-bar { margin-top: 10px; }

/* ==== План новинки — недельный Ганта (перенос из Excel «Произв план 2.0») ==== */
.np-head-bar { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; flex-wrap:wrap; margin:6px 0 12px; }
.np-title { font-size:17px; font-weight:700; color:#1c4587; }
.np-sub { font-size: 12px; color:#4b5563; margin-top:3px; max-width:640px; }
.np-legend { display:flex; flex-direction:column; gap:5px; font-size:12px; color:#374151; }
.np-lg { display:flex; align-items:center; gap:6px; }
.np-lg i { width:22px; height:13px; border-radius:3px; display:inline-block; }
.np-lg .np-bar-plan { background:#bcd6ee; }
.np-lg .np-bar-fact { background:#c6e0b4; }
.np-lg-holi { background:#ffe0b2; }

.np-scroll { max-height:72vh; overflow:auto; border:1px solid #e5e7eb; border-radius:10px; background:#fff; scrollbar-color:#94a3b8 #eef1f5; scrollbar-width:auto; }
/* всегда заметная полоса прокрутки снизу */
.np-scroll::-webkit-scrollbar { height:16px; width:14px; }
.np-scroll::-webkit-scrollbar-track { background:#eef1f5; }
.np-scroll::-webkit-scrollbar-thumb { background:#94a3b8; border-radius:8px; border:3px solid #eef1f5; }
.np-scroll::-webkit-scrollbar-thumb:hover { background:#5b6b7f; }
.np-scroll::-webkit-scrollbar-corner { background:#eef1f5; }
table.np-gantt { border-collapse:separate; border-spacing:0; font-size:12px; width:max-content; }
table.np-gantt th, table.np-gantt td { border-right:1px solid #eef0f2; border-bottom:1px solid #eef0f2; }

/* левая закреплённая колонка + прилипающие углы шапки */
.np-th-corner { position:sticky; left:0; background:#1c4587; color:#fff; width:300px; min-width:300px; max-width:300px; text-align:left; padding:6px 10px; font-weight:700; }
.np-th-holi-corner { top:0; z-index:13; background:#fff7ec; height:40px; }
.np-th-corner-month { top:40px; z-index:13; }
.np-th-stagehdr { top:62px; z-index:13; vertical-align:middle; }
.np-cell-stage { position:sticky; left:0; z-index:4; background:#fff; width:300px; min-width:300px; max-width:300px; text-align:left; padding:7px 10px; vertical-align:middle; }
.np-stage-row:nth-child(even) .np-cell-stage { background:#fbfcfe; }
.np-st-name { font-weight:600; color:#1f2937; line-height:1.25; }
.np-st-meta { display:flex; justify-content:space-between; gap:8px; font-size:11px; color:#6b7280; margin-top:3px; }
.np-st-owner { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:180px; }
.np-st-dates { white-space:nowrap; color:#4b5563; font-weight:600; }
.np-st-note { font-size: 10px; color:#b06d0a; margin-top:2px; }

/* блок-заголовок */
.np-block-head { background:#f4f7fb !important; font-weight:700; color:#1f2937; font-size:12px; }
.np-block-badge { font-size:10px; font-weight:700; padding:1px 6px; border-radius:4px; margin-right:4px; }
.np-block-fill { background:#f4f7fb; height:22px; }

/* шапка месяцев / недель / праздников — прилипают сверху */
.np-th-month { position:sticky; top:40px; z-index:9; background:#1c4587; color:#fff; font-weight:700; text-align:center; padding:3px 4px; font-size:11px; height:22px; }
.np-th-week { position:sticky; top:62px; z-index:9; background:#eef1f5; color:#111; font-weight:700; width:30px; min-width:30px; max-width:30px; text-align:center; padding:5px 1px; writing-mode:vertical-rl; transform:rotate(180deg); font-size:10px; height:52px; }
.np-th-week-holi { background:#ffe0b2; color:#7a4d00; box-shadow:inset 0 2px 0 #f0a020; }
.np-th-holi { position:sticky; top:0; z-index:8; width:30px; min-width:30px; max-width:30px; height:40px; padding:0; background:#fff7ec; vertical-align:bottom; }
.np-th-holi-on { position:relative; z-index:12; overflow:visible; }
.np-holi-pill { position:absolute; left:-1px; bottom:5px; white-space:nowrap; background:#ffdfa6; border:1px solid #e0912a; color:#5f3600; font-weight:700; font-size:12px; line-height:1; padding:4px 10px; border-radius:12px; box-shadow:0 2px 5px rgba(0,0,0,.16); }
.np-holi-stem { position:absolute; left:1px; bottom:-1px; width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent; border-top:6px solid #e0912a; }

/* ячейки недель + полосы */
.np-wk { width:30px; min-width:30px; max-width:30px; height:38px; padding:2px; text-align:center; vertical-align:middle; }
.np-wk-holi { background:#fff6e6; box-shadow:inset 1px 0 0 #f0c078; }
.np-bar { height:22px; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:11px; }
.np-bar-plan { background:#bcd6ee; color:#1c4587; }
.np-bar-fact { background:#c6e0b4; color:#2f5e1f; }
/* Таймлайн сезона (вкладка «как у Катарины»): смешанное окно факт+план и служебные подписи */
.tl-bar-mixed { background:linear-gradient(90deg,#c6e0b4,#bcd6ee); color:#2f5e1f; }
.np-lg .tl-bar-mixed { background:linear-gradient(90deg,#c6e0b4,#bcd6ee); }
.tl-goal-empty { color:#adb5bd; }
.tl-nodata { color:#adb5bd; font-style:italic; }
.tl-export { font-size:12px; padding:6px 12px; margin-right:10px; white-space:nowrap; }
/* «усы» разброса: неделя вне основной массы, но внутри min…max по выборке */
.tl-whisk { height:3px; background:repeating-linear-gradient(90deg,#c3ccff 0 4px,transparent 4px 7px); border-radius:2px; }
.np-lg .tl-lg-whisk { background:repeating-linear-gradient(90deg,#c3ccff 0 4px,transparent 4px 7px); }
.tl-next { font-size:10px; color:#6b7089; }
.tl-now { font-size:10px; font-weight:700; color:#3b5bdb; background:#eef1ff; border-radius:6px; padding:1px 5px; }
.np-th-today, .np-wk-today { background:#fff2f2; box-shadow:inset 1px 0 0 #f08080; }

.np-foot { font-size: 11px; color:#6b7280; margin-top:10px; line-height:1.4; }
.np-foot code { background:#f3f4f6; padding:1px 4px; border-radius:3px; font-size:11px; }

/* ==== Заказы в производстве ==== */
.ord-stats { display:flex; gap:12px; flex-wrap:wrap; margin:6px 0 14px; }
.ord-stat { flex:1; min-width:130px; background:#fff; border:1px solid #e9ecef; border-radius:10px; padding:12px 14px; text-align:center; }
.ord-stat-num { font-size:22px; font-weight:800; color:#1f2937; }
.ord-stat-lbl { font-size:12px; color:#6b7280; margin-top:3px; }
.ord-stat-alert { border-color:#ffc9c9; background:#fff5f5; }
.ord-stat-alert .ord-stat-num { color:#e03131; }
/* Задача в карточке стадии: ответственный (сверху), задача · срок (справа) */
.cond-task { border:1px solid #eef0f4; border-radius:9px; padding:9px 11px; margin-bottom:8px; background:#fff; }
.cond-task-resp { font-size: 11px; color:#6741d9; font-weight:600; margin-bottom:4px; }
.cond-task-row { display:flex; align-items:flex-start; gap:12px; justify-content:space-between; }
.cond-task-main { flex:1; min-width:0; }
.cond-task-srok { white-space:nowrap; font-size:12px; font-weight:600; color:#1c7ed6; background:#e7f2fd; border-radius:7px; padding:3px 9px; margin-top:1px; }
.cond-task-srok.cond-task-opt { color:#868ba3; background:#f1f3f7; font-weight:500; }
.cond-task-name { font-size: 13px; color:#2b3240; margin-bottom:5px; }
.cond-task-check { display:flex; align-items:flex-start; gap:8px; font-size: 13px; color:#2b3240; cursor:pointer; }
.cond-task-check input { margin-top:3px; }
.cond-task-select { width:100%; padding:6px 9px; border:1px solid #d1d5db; border-radius:7px; font-size:13px; }
.cond-task-text { display:block; font-size: 13px; color:#2b3240; }
.cond-task-text input { display:block; width:100%; margin-top:5px; padding:6px 9px; border:1px solid #d1d5db; border-radius:7px; }
/* Пункт-дата (напр. фактическая дата запуска производства — в 1С такого факта нет) */
.cond-task-date { display:block; font-size: 13px; color:#2b3240; }
.cond-task-date input { display:block; margin-top:5px; padding:6px 9px; border:1px solid #d1d5db; border-radius:7px; }

/* «Всё ОК» — мультивыбор всех чек-листов стадии */
.cond-allok { background:#eef4ff; border:1px solid #cfe0ff; border-radius:8px; padding:8px 10px; margin-bottom:10px; }
.cond-allok-label { display:flex; align-items:center; gap:8px; font-weight:600; color:#1c4587; font-size:13px; cursor:pointer; }
.bx-emp { display:flex; gap:9px; align-items:center; background:#fff; border:1px solid #edeef2; border-radius:8px; padding:6px 9px; text-decoration:none; cursor:pointer; transition:border-color .12s, box-shadow .12s; }
.bx-emp:hover { border-color:#4c6ef5; box-shadow:0 2px 8px rgba(76,110,245,.15); }
/* Ссылка на профиль Битрикс в ответственных стадии */
.bx-profile-link { color:inherit; text-decoration:none; border-bottom:1px dashed #a9b6e6; cursor:pointer; }
.bx-profile-link:hover { color:#4c6ef5; border-bottom-color:#4c6ef5; }
.card-sample-ok { background:#ebfbee !important; color:#2f9e44 !important; }

/* Фото артикула в финансах */
.fin-art-photo-cell { text-align:center; width:52px; }
.fin-art-photo { width:44px; height:44px; object-fit:contain; border-radius:5px; vertical-align:middle; }
.fin-art-nophoto { color:#d1d5db; font-size:20px; }

/* Статус артикула активен/не активен */
.art-status-cell { white-space:nowrap; }
.art-status { font-size:12px; font-weight:600; }
.art-status-on { color:#2f9e44; }
.art-status-off { color:#e03131; }
.art-toggle-btn { margin-left:8px; border:1px solid #d1d5db; background:#fff; border-radius:6px; padding:3px 8px; font-size: 11px; cursor:pointer; color:#4b5563; }
.art-toggle-btn:hover { border-color:#4c6ef5; color:#4c6ef5; }
.art-row-off { background:#fff7f7; opacity:.75; }

/* Годовой OTIF KPI */
.od-year-kpi { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; background:#f5f8ff; border:1px solid #e0e9fb; border-radius:10px; padding:12px 16px; margin-bottom:12px; }
.od-year-kpi-label { font-size:14px; font-weight:600; color:#3a3f58; }
.od-year-kpi-val { font-size:28px; font-weight:800; }
.od-year-kpi-sub { font-size: 12px; color:#6b7280; }

/* Стадийный чекбокс в колонке доски (Катарина: двигать все артикулы разом) */
.stage-bulk { display:flex; align-items:center; gap:6px; margin-top:6px; font-size: 11px; color:#1c4587; font-weight:600; cursor:pointer; background:#eef4ff; border:1px solid #cfe0ff; border-radius:8px; padding:5px 8px; }
.stage-bulk input { cursor:pointer; }

/* Alarm-замечание на карточке */
.card-alarm-badge { background:#ffe3e3 !important; color:#c92a2a !important; }
/* Вопрос по фабрике ждёт решения человека (ответственный по фабрике не определяется) */
.card-facflag-badge { background:#fff3bf !important; color:#8a6100 !important; }
.modal-alarm { margin:8px 0; }
.alarm-active { background:#fff5f5; border:1px solid #ffc9c9; border-radius:8px; padding:8px 10px; display:flex; align-items:center; gap:10px; justify-content:space-between; }
.alarm-active .alarm-text { color:#c92a2a; font-weight:600; font-size:13px; }
.alarm-clear-btn { border:1px solid #ffa8a8; background:#fff; color:#c92a2a; border-radius:6px; padding:4px 10px; font-size:12px; cursor:pointer; white-space:nowrap; }
.mh-audit-row { display:flex; gap:10px; align-items:baseline; padding:5px 0; border-bottom:1px solid #f4f5f7; font-size: 12px; }
.mh-audit-time { color:#9096a8; white-space:nowrap; font-variant-numeric:tabular-nums; min-width:104px; }
.mh-audit-event { flex:1; color:#2b3240; }
.mh-audit-who { color:#4c6ef5; font-weight:600; white-space:nowrap; }

/* Отгрузки (таблица Анны из 1С) */
.shp-stats { display:flex; gap:12px; flex-wrap:wrap; margin:6px 0 14px; }
.shp-table { width:100%; border-collapse:separate; border-spacing:0; font-size:12px; }
.shp-table thead th { background:#1c4587; color:#fff; font-weight:700; text-align:center; padding:8px 8px; font-size:11px; line-height:1.3; position:sticky; top:0; }
.shp-table tbody td { padding:6px 8px; border-top:1px solid #eef0f2; vertical-align:middle; }
.shp-fac-row td { background:#eef1f8; font-weight:700; color:#1f2330; font-size:12px; }
.shp-fc { font-weight:600; color:#2a5c91; white-space:nowrap; }
.shp-ar { font-family:monospace; font-size:12px; }
.shp-num { text-align:center; white-space:nowrap; }
.shp-date { text-align:center; white-space:nowrap; }
.shp-dim { color:#c2c7d4; }
.shp-moved { background:#fff3bf; border-radius:4px; }
.shp-fact-ok { color:#2f9e44; font-weight:700; }
.shp-late td { background:#fff5f5; }
.shp-done td { background:#f6fbf4; color:#5c6b62; }
.shp-note-cell { min-width:150px; max-width:210px; }
.shp-note { width:100%; box-sizing:border-box; border:1px solid transparent; border-radius:6px; padding:4px 6px; font-size: 11px; background:transparent; }
.shp-note:hover { border-color:#e0e4ea; }
.shp-note:focus { border-color:#4c6ef5; background:#fff; outline:none; }

/* План 2027 (декомпозиция) в разделе «План новинок» */
.pn27-head { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:10px 0 12px; }
.pn27-total { font-size:14px; color:#1f2330; }
.pn27-chip { background:#eef1f8; border-radius:14px; padding:3px 10px; font-size:12px; color:#3a3f58; }
.pn27-table th, .pn27-table td { padding:7px 8px; }
.pn27-mth { text-align:center; font-size:11px; white-space:nowrap; }
.pn27-cell { text-align:center; color:#c2c7d4; }
.pn27-cell-on { background:#e7f0ff; color:#1c4587; font-weight:700; cursor:help; }
.pn27-brand { font-weight:600; white-space:nowrap; }
.pn27-type { max-width:220px; }
.pn27-cnt { text-align:center; }
.pn27-target { white-space:nowrap; font-size:12px; color:#3a3f58; }

/* Мультивыбор фабрик в «Артикулах» */
.multi-filter { position:relative; display:inline-block; }
.multi-filter-btn { cursor:pointer; white-space:nowrap; }
.multi-filter-list {
  position:absolute; z-index:40; top:calc(100% + 4px); left:0; min-width:320px; max-height:320px; overflow-y:auto;
  background:#fff; border:1px solid #dee2e6; border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.12); padding:6px;
}
.mf-item { display:block; padding:5px 8px; font-size: 12px; border-radius:6px; cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mf-item:hover { background:#f1f3f9; }
.mf-item input { margin-right:7px; vertical-align:-2px; }
.mf-item-all { border-bottom:1px solid #eef0f2; margin-bottom:4px; font-weight:600; }

/* Тултип со списком просроченных заказов при наведении */
.ord-stat-hastip { position:relative; cursor:help; }
.ord-stat-tip {
  display:none; position:absolute; z-index:50; top:calc(100% + 8px); right:0;
  width:340px; max-width:90vw; max-height:340px; overflow-y:auto; text-align:left;
  background:#1f2937; color:#f3f4f6; border-radius:10px; padding:10px 12px;
  box-shadow:0 8px 24px rgba(0,0,0,.28); font-size:12px; line-height:1.4;
}
.ord-stat-hastip:hover .ord-stat-tip { display:block; }
.ord-stat-tip::before {
  content:''; position:absolute; bottom:100%; right:24px;
  border:6px solid transparent; border-bottom-color:#1f2937;
}
.ord-stat-tip-hd { font-weight:700; color:#fca5a5; margin-bottom:6px; padding-bottom:5px; border-bottom:1px solid #374151; }
.ord-stat-tip-row { padding:4px 0; border-bottom:1px solid #2b3543; white-space:normal; word-break:break-word; }
.ord-stat-tip-row:last-child { border-bottom:none; }
.ord-stat-tip-row b { color:#fff; }
.ord-stat-tip-meta { display:block; color:#6b7280; margin-top:1px; }
.ord-stat-tip-late { color:#fca5a5; font-weight:700; }
.ord-stat-tip-more { padding-top:6px; color:#6b7280; font-style:italic; }
.ord-note { font-size:12px; color:#6b7280; background:#f8f9fa; border:1px solid #eef0f2; border-radius:8px; padding:9px 12px; line-height:1.45; margin-bottom:12px; }

/* охват раздела: новинки отдела ↔ весь портфель 1С */
.ord-scope { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:12px; padding:8px 12px; background:#f8f9fa; border:1px solid #eef0f2; border-radius:8px; }
.ord-scope-note { font-size:12px; color:#6b7280; margin-left:4px; }

.ord-toolbar { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:12px; }
.ord-search { display:flex; align-items:center; gap:6px; background:#fff; border:1px solid #dee2e6; border-radius:8px; padding:6px 10px; flex:1; min-width:240px; }
.ord-search input { border:none; outline:none; font-size:13px; width:100%; background:transparent; }
.ord-chips { display:flex; gap:6px; flex-wrap:wrap; }
.ord-chip { border:1px solid #dee2e6; background:#fff; color:#495057; border-radius:16px; padding:5px 12px; font-size: 12px; cursor:pointer; }
.ord-chip-on { background:#4c6ef5; color:#fff; border-color:#4c6ef5; }
.ord-chip-alert { background:#e03131; color:#fff; border-color:#e03131; }
.ord-sort { border:1px solid #dee2e6; border-radius:8px; padding:6px 10px; font-size: 12px; background:#fff; }

.ord-card { border:1px solid #e9ecef; border-radius:10px; margin-bottom:8px; background:#fff; overflow:hidden; }
.ord-card-late { border-color:#ffc9c9; }
.ord-card-focus { border-color:#4c6ef5; box-shadow:0 0 0 3px #dbe4ff; animation:ordFocusPulse 1.6s ease-out 1; }
@keyframes ordFocusPulse { 0% { box-shadow:0 0 0 6px #a5c8ff; } 100% { box-shadow:0 0 0 3px #dbe4ff; } }
.ord-row { display:grid; grid-template-columns:18px 80px 124px 148px 232px 104px 1fr; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; }
.ord-row:hover { background:#fafbff; }
.ord-toggle { color:#868e96; font-size:12px; }
.ord-fac-code { font-weight:800; color:#1c4587; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ord-num { font-size: 12px; color:#495057; font-weight:600; }
.ord-stage { font-size: 11px; font-weight:700; padding:3px 9px; border-radius:12px; text-align:center; white-space:nowrap; }
.ord-prog { display:flex; align-items:center; gap:7px; }
.ord-prog-bar { flex:1; height:9px; background:#eef0f2; border-radius:5px; overflow:hidden; }
.ord-prog-bar i { display:block; height:100%; border-radius:5px; }
.ord-prog b { font-size: 12px; white-space:nowrap; }
.ord-qty { font-size: 12px; color:#343a40; font-weight:600; text-align:right; }
.ord-due { font-size: 11px; color:#868e96; }
.ord-due-late { color:#e03131; font-weight:700; }
.ord-next { color:#495057; }

/* ── вехи 1С вместо расчётного процента (Паша 29.07) ── */
.ord-prog { flex-direction:column; align-items:flex-start; gap:3px; overflow:hidden; }
.ord-chain { display:flex; gap:3px; align-items:center; flex-wrap:nowrap; }
.ord-ms { display:flex; align-items:center; gap:2px; font-size:10px; font-weight:700; line-height:1;
  padding:3px 5px; border-radius:10px; border:1px solid transparent; white-space:nowrap; cursor:help; }
.ord-ms i { font-style:normal; font-weight:600; font-size:9px; opacity:.85; }
.ord-ms-done { background:#e6fcf5; color:#0b7285; border-color:#c3fae8; }
.ord-ms-miss { background:#fff5f5; color:#e03131; border-color:#ffc9c9; }
.ord-ms-wait { background:#f8f9fa; color:#868e96; border-color:#eef0f2; }
.ord-ms-none { background:transparent; color:#ced4da; }
.ord-factline { display:flex; align-items:baseline; max-width:100%; overflow:hidden; }
.ord-fact { font-size:10.5px; color:#495057; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; }
.ord-fact-none { color:#e03131; font-weight:700; }
.ord-silent { font-size:10.5px; color:#868e96; margin-left:5px; white-space:nowrap; }
.ord-silent-bad { color:#e8590c; font-weight:700; }

/* таблица ключевых дат внутри развёрнутого заказа */
.ord-events { border:1px solid #eef0f2; border-radius:8px; background:#fff; padding:9px 11px; margin:6px 0 10px; }
.oev-h { font-size:12px; font-weight:700; color:#1f2937; margin-bottom:6px; }
.oev-h-note { font-weight:500; color:#868e96; font-size:11px; margin-left:6px; }
.oev-sum { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:7px; }
.oev-sum-item { font-size:11px; color:#495057; background:#f8f9fa; border-radius:11px; padding:3px 9px; }
.oev-sum-bad { background:#fff5f5; color:#e03131; font-weight:700; }
.oev-sum-shift { background:#fff4e6; color:#e8590c; font-weight:700; cursor:help; }

/* курс ЦБ рядом с полем «Курс ¥→₽» (план по деньгам) */
.pm-fx { display:inline-flex; align-items:center; gap:7px; font-size:11.5px; color:#0b7285;
  background:#e6fcf5; border:1px solid #c3fae8; border-radius:14px; padding:3px 9px; }
.pm-fx-manual { color:#e8590c; background:#fff4e6; border-color:#ffe8cc; }
.pm-fx-stale { color:#e03131; background:#fff5f5; border-color:#ffc9c9; }
.pm-fx-upd { color:#868e96; }
.pm-fx .ord-chip { padding:2px 8px; font-size:11px; }

/* на узких экранах строка заказа складывается в два ряда — иначе колонки обрезались */
@media (max-width: 900px) {
  .ord-row { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; }
  .ord-fac-code, .ord-num, .ord-qty { width:auto; }
  .ord-stage { flex:0 0 auto; }
  .ord-prog { flex:1 1 100%; order:5; }
  .ord-due { flex:1 1 100%; order:6; }
  .oev-tbl { font-size:11px; }
  .ord-events { overflow-x:auto; }
}
.oev-tbl { width:100%; border-collapse:collapse; font-size:11.5px; }
.oev-tbl th { text-align:left; color:#868e96; font-weight:600; border-bottom:1px solid #eef0f2; padding:4px 6px; white-space:nowrap; }
.oev-tbl td { padding:4px 6px; border-bottom:1px solid #f4f6f8; }
.oev-tbl tr:last-child td { border-bottom:none; }
.oev-name { color:#1f2937; font-weight:600; }
.oev-d { white-space:nowrap; color:#495057; }
.oev-moved { color:#e8590c; cursor:help; }
.oev-st { color:#868e96; }
.oev-done .oev-st { color:#0b7285; }
.oev-miss { background:#fff8f8; }
.oev-miss .oev-st { color:#e03131; font-weight:600; }

.ord-detail { border-top:1px solid #eef0f2; background:#fbfcfe; padding:6px 12px 10px 40px; }
.ord-art { padding:8px 0; border-bottom:1px dashed #e9ecef; }
.ord-art:last-child { border-bottom:none; }
.ord-art-head { display:flex; align-items:center; gap:12px; margin-bottom:6px; flex-wrap:wrap; }
.ord-art-code { font-weight:700; color:#1f2937; font-size:13px; }
.ord-art-q { font-size:12px; color:#6b7280; }
.ord-art-pct { font-size:12px; font-weight:700; margin-left:auto; }
.ord-colors { display:flex; flex-direction:column; gap:4px; }
.ord-color { display:grid; grid-template-columns:34px 130px 1fr 120px; align-items:center; gap:10px; font-size:12px; }
.ord-color-chip { background:#4c6ef5; color:#fff; border-radius:5px; padding:2px 0; text-align:center; font-weight:700; font-size:11px; }
.ord-color-name { color:#495057; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ord-color-bar { height:7px; background:#eef0f2; border-radius:4px; overflow:hidden; }
.ord-color-bar i { display:block; height:100%; border-radius:4px; }
.ord-color-q { text-align:right; color:#343a40; font-weight:600; }
.ord-color-sh { color:#adb5bd; font-weight:600; margin-left:6px; }

.ord-pager { display:flex; align-items:center; justify-content:center; gap:14px; margin-top:12px; font-size:13px; color:#495057; }
.ord-pager button { border:1px solid #dee2e6; background:#fff; border-radius:7px; padding:5px 14px; cursor:pointer; font-size:14px; }
.ord-pager button:disabled { opacity:.4; cursor:default; }
.emp-name { font-weight:700; color:#1f2937; white-space:nowrap; }

/* ==== План новинки — клик по неделе → попап ==== */
.np-clk { cursor:pointer; }
.np-clk:hover { outline:2px solid #4c6ef5; outline-offset:-2px; }
.np-popup { position:fixed; z-index:1000; width:300px; background:#fff; border:1px solid #d0d7e2; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.18); padding:14px 16px; font-size:13px; }
.npp-close { position:absolute; top:8px; right:10px; border:none; background:transparent; font-size:20px; line-height:1; color:#adb5bd; cursor:pointer; }
.npp-close:hover { color:#495057; }
.npp-head { font-weight:700; color:#1c4587; font-size: 13px; margin-bottom:10px; padding-right:18px; }
.npp-badge { display:inline-block; font-size:11px; font-weight:700; padding:2px 9px; border-radius:8px; margin-bottom:7px; }
.npp-stage { font-weight:700; color:#1f2937; font-size:14px; margin-bottom:9px; line-height:1.3; }
.npp-empty { color:#868e96; font-weight:600; font-size:13px; }
.npp-row { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:4px 0; border-top:1px solid #f1f3f5; }
.npp-row span { color:#6b7280; font-size:12px; white-space:nowrap; }
.npp-row b { color:#343a40; text-align:right; }
.npp-late { color:#e8590c; }
.npp-note { margin-top:8px; font-size: 11px; color:#b06d0a; background:#fff8e1; border-radius:6px; padding:5px 8px; }
.npp-holi { margin-top:8px; font-size:12px; font-weight:700; color:#7a4d00; background:#ffe9cc; border-radius:6px; padding:6px 9px; }

/* ==== Образцы ==== */
.smp-note { font-size: 12px; color:#6b7280; background:#f8f9fa; border:1px solid #eef0f2; border-radius:8px; padding:9px 12px; margin:6px 0 12px; line-height:1.45; }

.smp-table-wrap { overflow-x:auto; border:1px solid #e9ecef; border-radius:10px; background:#fff; }
.smp-table { width:100%; border-collapse:separate; border-spacing:0; font-size: 12px; }
.smp-table thead th { background:#1c4587; color:#fff; font-weight:700; text-align:left; padding:9px 10px; white-space:nowrap; }
.smp-table tbody td { padding:8px 10px; border-top:1px solid #eef0f2; vertical-align:middle; }
.smp-table tbody tr:hover { background:#fafbff; }
.smp-late { color:#e03131; font-weight:700; }
.smp-note-sm { font-size: 11px; color:#868e96; margin:2px 0 8px; }
.smp-table td { padding:4px 6px; }
/* Многострочные ячейки с переносом — «Нехватка»{ min-width:150px; max-width:220px; vertical-align:top; }

/* ==== Образцы — детализация (раунды, статус разработки{ display:flex; align-items:center; gap:4px; flex-wrap:wrap; }

/* ==== Образцы — вкладки ==== */
.smp-tabs { display:flex; gap:8px; margin:10px 0 12px; border-bottom:2px solid #e9ecef; }
.smp-tab { background:transparent; border:none; border-bottom:2px solid transparent; margin-bottom:-2px; padding:9px 16px; font-size: 13px; font-weight:600; color:#868e96; cursor:pointer; display:flex; align-items:center; gap:7px; }
.smp-tab:hover { color:#495057; }
.smp-tab-on { color:#4c6ef5; border-bottom-color:#4c6ef5; }
.smp-tab-on .smp-tab-cnt { background:#edf2ff; color:#4c6ef5; }
.smp-table th:first-child, .smp-table .smp-photo-cell { width:78px; }

/* ==== Производственный календарь — Дропы по месяцам ==== */
.drp-toolbar { display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; margin:6px 0 10px; }
.drp-by { font-size: 12px; color:#6b7280; display:flex; align-items:center; gap:6px; }
.drp-tgl { border:1px solid #dee2e6; background:#fff; color:#495057; border-radius:7px; padding:5px 11px; font-size: 12px; cursor:pointer; }
.drp-tgl-on { background:#1c4587; color:#fff; border-color:#1c4587; }
.drp-months { display:flex; gap:5px; flex-wrap:wrap; }
.drp-chip { border:1px solid #dee2e6; background:#fff; color:#495057; border-radius:14px; padding:4px 12px; font-size: 12px; cursor:pointer; }
.drp-chip-on { background:#4c6ef5; color:#fff; border-color:#4c6ef5; }
.drp-legend { font-size: 11px; color:#868e96; margin-bottom:12px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }

.drp-group { margin-bottom:10px; border:1px solid #e9ecef; border-radius:10px; overflow:hidden; }
.drp-group-head { display:flex; align-items:center; gap:10px; padding:11px 14px; background:#f4f7fb; cursor:pointer; }
.drp-group-head:hover { background:#eef3fa; }
.drp-head-late { background:#fff5f5; }
.drp-chev { color:#868e96; font-size:12px; }
.drp-month { font-weight:700; color:#1c4587; font-size:15px; }
.drp-gsum { font-size: 12px; color:#6b7280; }
.drp-late { color:#e03131; }

.drp-table { width:100%; border-collapse:separate; border-spacing:0; font-size: 12px; background:#fff; }
.drp-table thead th { background:#fff; color:#6b7280; font-weight:700; text-align:left; padding:8px 12px; border-bottom:2px solid #eef0f2; white-space:nowrap; font-size: 11px; }
.drp-table tbody td { padding:8px 12px; border-bottom:1px solid #f1f3f5; vertical-align:middle; }
.drp-table tbody tr:hover { background:#fafbff; }
.drp-art { font-weight:700; color:#1c4587; white-space:nowrap; }
.drp-num { text-align:right; color:#343a40; font-weight:600; white-space:nowrap; }
.drp-order { color:#adb5bd; font-size: 11px; white-space:nowrap; }

.drp-sum { font-size: 11px; font-weight:700; padding:2px 9px; border-radius:10px; white-space:nowrap; }
.sum-red { background:#fff5f5; color:#e03131; }
.sum-green { background:#ebfbee; color:#2f9e44; }
.sum-blue { background:#e7f5ff; color:#1971c2; }
.sum-grey { background:#f1f3f5; color:#868e96; }

.drp-ev { font-size:12px; font-weight:600; padding:2px 8px; border-radius:7px; white-space:nowrap; display:inline-block; }
.ev-grey { background:#f1f3f5; color:#868e96; }
.ev-blue { background:#e7f5ff; color:#1971c2; }
.ev-green { background:#ebfbee; color:#2f9e44; }
.ev-red { background:#fff5f5; color:#e03131; }

/* Дропы — пагинация */
.drp-pager { display:flex; align-items:center; justify-content:center; gap:14px; padding:10px; font-size: 12px; color:#495057; background:#fff; }
.drp-pager button { border:1px solid #dee2e6; background:#fff; border-radius:7px; padding:4px 14px; cursor:pointer; font-size:14px; }
.drp-pager button:disabled { opacity:.4; cursor:default; }

/* Дропы — фильтры статус/фабрика */
.drp-filters { display:flex; gap:20px; flex-wrap:wrap; align-items:center; margin:0 0 10px; padding:8px 0; border-top:1px solid #f1f3f5; }
.drp-fgroup { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.drp-flabel { font-size: 12px; color:#6b7280; font-weight:600; }
.drp-select { border:1px solid #dee2e6; border-radius:7px; padding:5px 10px; font-size: 12px; background:#fff; cursor:pointer; }

/* Заказы — действия фабрик с портала */
.ord-facact { font-size:11px; font-weight:700; color:#1971c2; background:#e7f5ff; border-radius:8px; padding:1px 7px; margin-left:4px; }
.ord-fa { background:#f3f0ff; border:1px solid #e0d7fb; border-radius:8px; padding:8px 10px; margin-bottom:10px; }
.ord-fa-title { font-size: 11px; font-weight:700; color:#6741d9; margin-bottom:4px; }
.ord-fa-row { font-size:12px; color:#343a40; padding:2px 0; }
.ord-fa-st { font-size: 10px; font-weight:700; padding:1px 7px; border-radius:8px; margin-left:4px; }
.ord-fa-pending { background:#fff3bf; color:#b06d0a; }
.ord-fa-accepted { background:#e7f5ff; color:#1971c2; }
.ord-fa-applied { background:#ebfbee; color:#2f9e44; }
.ord-fa-rejected { background:#fff5f5; color:#e03131; }

/* === Корзина удаления карточки (админ, drag-drop) === */
.card-trash {
  position: fixed;
  left: 50%;
  bottom: -180px;
  transform: translateX(-50%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  pointer-events: none;
  opacity: 0;
  transition: bottom .28s cubic-bezier(.22,1,.36,1), opacity .2s ease;
}
.card-trash.show {
  bottom: 28px;
  opacity: 1;
  pointer-events: auto;
}
.card-trash .ct-bin {
  position: relative;
  width: 92px;
  height: 96px;
  transition: transform .18s ease;
}
.card-trash.over .ct-bin { transform: scale(1.12); }
/* корпус (ведро) */
.card-trash .ct-can {
  position: absolute;
  left: 8px;
  bottom: 0;
  width: 76px;
  height: 74px;
  background: linear-gradient(180deg, #f03e3e 0%, #c92a2a 100%);
  border-radius: 6px 6px 12px 12px;
  box-shadow: 0 12px 30px rgba(224,49,49,.4), inset 0 0 0 2px rgba(255,255,255,.15);
}
/* вертикальные рёбра ведра */
.card-trash .ct-can::before {
  content: "";
  position: absolute;
  inset: 8px 14px 8px 14px;
  background:
    repeating-linear-gradient(90deg, transparent 0 14px, rgba(255,255,255,.22) 14px 16px);
  border-radius: 4px;
}
/* крышка */
.card-trash .ct-lid {
  position: absolute;
  left: 4px;
  top: 6px;
  width: 84px;
  height: 16px;
  background: linear-gradient(180deg, #ff5c5c 0%, #e03131 100%);
  border-radius: 6px;
  transform-origin: right center;
  transform: rotate(0deg);
  transition: transform .22s cubic-bezier(.34,1.56,.64,1);
  box-shadow: 0 3px 8px rgba(0,0,0,.18);
  z-index: 2;
}
/* ручка на крышке */
.card-trash .ct-lid .ct-handle {
  position: absolute;
  left: 50%;
  top: -7px;
  transform: translateX(-50%);
  width: 26px;
  height: 8px;
  background: #e03131;
  border-radius: 6px 6px 0 0;
}
/* крышка открывается, когда карточка над корзиной */
.card-trash.over .ct-lid { transform: rotate(-42deg) translateY(-3px); }
/* крышка закрывается при сбросе карточки */
.card-trash.closing .ct-lid {
  transform: rotate(0deg);
  transition: transform .18s cubic-bezier(.5,0,.75,0);
}
.card-trash .ct-label {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #e03131;
  padding: 5px 14px;
  border-radius: 20px;
  box-shadow: 0 6px 18px rgba(224,49,49,.35);
  white-space: nowrap;
}
.card-trash.over .ct-label { background: #c92a2a; }

/* === Дашборд: кто просрачивает / фабрики === */
.hd-grid-2 { margin-top: 16px; }
.hd-panel-sub { font-size: 11px; font-weight: 500; color: #787e93; margin-left: 6px; }
.hd-persons, .hd-facs { display: flex; flex-direction: column; gap: 7px; }
.hd-per-row, .hd-fac-row {
  display: grid; grid-template-columns: minmax(110px, 1.3fr) 2fr auto;
  align-items: center; gap: 10px; padding: 4px 6px; border-radius: 8px;
}
.hd-per-row:hover, .hd-fac-row:hover { background: #f5f7fc; }
.hd-per-name { font-size: 13px; font-weight: 600; color: #3a4266; }
.hd-fac-code { font-size: 13px; font-weight: 700; color: #2b3a67; font-family: monospace; }
.hd-per-bar-wrap, .hd-fac-bar-wrap { height: 10px; background: #eef1f8; border-radius: 6px; overflow: hidden; }
.hd-per-bar { height: 100%; background: #e8590c; border-radius: 6px; }
.hd-fac-bar { height: 100%; background: #4c6ef5; border-radius: 6px; }
.hd-fac-bar.hd-fac-hot { background: #e03131; }
.hd-per-num, .hd-fac-num { font-size: 13px; font-weight: 700; color: #2b3a67; white-space: nowrap; text-align: right; }
.hd-per-days, .hd-fac-sub { font-size: 11px; font-weight: 500; color: #6b7280; }
.hd-shift-sum { font-size: 12px; color: #444; background: #fff8f1; border: 1px solid #ffe3c7; border-radius: 8px; padding: 8px 11px; margin-bottom: 8px; }
.hd-fac-rowx { grid-template-columns: 16px minmax(70px, 1fr) 2fr auto; cursor: pointer; }
.hd-fac-tgl { color: #6b7280; font-size: 12px; }  /* было #adb5bd — 2,07:1, а это стрелка «раскрыть» */
.hd-shift-list { margin: 2px 0 8px 22px; border-left: 2px solid #ffd8a8; padding-left: 8px; display: flex; flex-direction: column; gap: 3px; }
.hd-shift-item { display: grid; grid-template-columns: 1.4fr 1.2fr auto; align-items: center; gap: 10px; font-size: 12px; padding: 2px 4px; }
.hd-shift-art { color: #2b3240; font-weight: 600; }
.hd-shift-brand { color: #868e96; font-weight: 500; font-size: 11px; }
.hd-shift-dates { color: #6c757d; font-variant-numeric: tabular-nums; }
.hd-shift-days { color: #e03131; font-weight: 700; text-align: right; white-space: nowrap; }

/* Просрочка срока: компактная плашка .ts-badge (cardTimeStatus) + красный контур
   карточки .card-late-outline. Без заливки, свечения и мигания — решение Паши 2026-07-20. */
.card.card-late-outline { border: 2px solid #e03131 !important; }
.ts-badge { font-size: 12px !important; font-weight: 700 !important; padding: 3px 10px !important; }
/* счётчик до дедлайна («До … · осталось N дн») — ЖЁЛТЫЙ (Паша 28.07) */
.ts-badge.ts-countdown { background: #fffbe6 !important; color: #d4a017 !important; }

/* === Сотрудники: одна RACI-таблица зон ответственности === */
.raci-wrap { overflow-x: auto; border: 1px solid #e6e8f0; border-radius: 12px; background: #fff; }
.raci-table { border-collapse: collapse; width: 100%; font-size: 13px; }
.raci-table thead th {
  position: sticky; top: 0; z-index: 2; background: #f6f7fb; text-align: left;
  font-size: 11px; letter-spacing: .05em; text-transform: uppercase; color: #6b7290;
  font-weight: 700; padding: 11px 14px; border-bottom: 1px solid #e6e8f0;
}
.raci-table td { padding: 9px 14px; border-top: 1px solid #eef0f5; vertical-align: middle; }
.raci-row:hover td { background: #fafbff; }
.raci-stage {
  font-weight: 700; color: #2b3a67; background: #fbfcfe; min-width: 180px; max-width: 240px;
  border-right: 1px solid #eef0f5; vertical-align: top !important; padding-top: 12px !important;
}
.raci-stage-num {
  display: inline-block; width: 22px; height: 22px; line-height: 22px; text-align: center;
  background: #edf2ff; color: #4c6ef5; border-radius: 50%; font-size: 11px; font-weight: 800; margin-right: 6px;
}
.raci-task { color: #333a4d; min-width: 260px; }
.raci-srok { color: #6b7290; white-space: nowrap; font-size: 12px; }
.raci-resp { min-width: 220px; }
.raci-emp { display: inline-flex; align-items: center; gap: 7px; margin: 2px 10px 2px 0; }
.raci-emp-name { font-weight: 600; color: #2b3a67; font-size: 13px; }
.raci-note { font-size: 11px; color: #6b7280; font-weight: 500; }
.raci-none { color: #c2c7d6; }

/* УТП внутри карточки артикула */
.modal-utp { background: #f8f9ff; border: 1px solid #e3e8ff; border-radius: 10px; padding: 12px 14px; margin: 10px 0; }
.modal-utp-title { font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #4c6ef5; margin-bottom: 7px; }

/* удаление уведомлений и задач профиля */
.notif-del-btn { background: none; border: none; cursor: pointer; font-size: 15px; opacity: .55; padding: 2px 6px; }
.notif-del-btn:hover { opacity: 1; }
.task-item { position: relative; }
.task-del-btn {
  position: absolute; top: 8px; right: 10px; background: none; border: none; cursor: pointer;
  font-size: 15px; color: #9aa1b5; padding: 2px 6px; border-radius: 6px;
}
.task-del-btn:hover { color: #e03131; background: #fff0f0; }
.tasks-restore-row { font-size: 12px; color: #6b7280; margin: 0 0 10px; }
.tasks-restore-btn { background: none; border: none; color: #4c6ef5; cursor: pointer; font-size: 12px; text-decoration: underline; padding: 0 2px; }

.stage-sla-banner { border-radius: 12px; padding: 12px 14px; margin: 0 0 12px; }
.stage-sla-banner.ssb-late { background: #fff5f5; border: 1px solid #ffc9c9; }
.stage-sla-banner.ssb-today { background: #fffbea; border: 1px solid #ffe8a3; }
.ssb-main { font-size: 15px; font-weight: 800; color: #e03131; }
.ssb-today .ssb-main { color: #b06d0a; }
.ssb-sub { font-size: 12px; color: #6b7290; margin-top: 3px; }
.ssb-src { font-size: 11px; color: #6b7280; margin-top: 5px; font-style: italic; }

/* === Образцы как сущность (внутри карточки) === */
/* режим образцов: прячем прочие угловые кнопки, оставляем только «Образцы» */
.modal-corner-btns.samples-mode .modal-files-corner-btn { display: none; }
.modal-corner-btns.samples-mode .modal-samples-corner-btn { display: inline-flex; }

.smp2-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.smp2-head h2 { margin: 0; font-size: 18px; }
.smp2-add-btn { background: #4c6ef5; color: #fff; border: none; border-radius: 9px; padding: 9px 16px; font-weight: 700; font-size: 13px; cursor: pointer; white-space: nowrap; }
.smp2-add-btn:hover { background: #3b5bdb; }
.smp2-empty { padding: 26px; text-align: center; color: #6b7280; background: #f6f7fb; border-radius: 12px; }
/* Пояснение в панели образцов, когда карточка ещё не дошла до «Получения образцов» */
.smp2-early { margin-bottom: 10px; padding: 10px 14px; background: #fff8e6; border: 1px solid #f2e0b0; border-radius: 10px; font-size: 12.5px; line-height: 1.5; color: #7a5c14; }
.smp2-list { display: flex; flex-direction: column; }

.smp2-divider { display: flex; align-items: center; gap: 10px; margin: 8px 0; color: #6b7280; font-size: 12px; font-weight: 700; }
.smp2-divider::before, .smp2-divider::after { content: ''; flex: 1; height: 2px; background: repeating-linear-gradient(90deg, #d5dae6 0 8px, transparent 8px 14px); }

.smp2-card { border: 1px solid #e6e9f2; border-radius: 14px; padding: 16px; background: #fff; margin-bottom: 4px; }

.smp2-code-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.smp2-code { font-family: monospace; font-weight: 700; font-size: 15px; border: 1px solid #e6e9f2; border-radius: 8px; padding: 8px 12px; flex: 1; min-width: 0; }
.smp2-code:focus { outline: none; border-color: #4c6ef5; }
.smp2-status { font-size: 11px; font-weight: 800; color: #fff; border-radius: 8px; padding: 5px 11px; white-space: nowrap; }
.smp2-del { background: #fff5f5; color: #e03131; border: 1px solid #ffc9c9; border-radius: 8px; padding: 6px 12px; cursor: pointer; font-size: 12px; font-weight: 700; white-space: nowrap; }
.smp2-del:hover { background: #e03131; color: #fff; border-color: #e03131; }

/* фото — множественная галерея без подписей */
.smp2-photos { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.smp2-photo { position: relative; width: 84px; height: 100px; }
.smp2-photo img { width: 84px; height: 100px; object-fit: cover; border-radius: 8px; background: #f6f7fb; cursor: zoom-in; display: block; }
.smp2-photo-del { position: absolute; top: 3px; right: 3px; width: 18px; height: 18px; border-radius: 50%; border: none; background: rgba(224,49,49,.9); color: #fff; font-size: 11px; line-height: 1; cursor: pointer; }
.smp2-photo-add { width: 84px; height: 100px; border: 2px dashed #c9d2ea; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; cursor: pointer; color: #6b7290; background: #fafbff; }
.smp2-photo-add:hover { border-color: #4c6ef5; color: #4c6ef5; }
.smp2-photo-add-ico { font-size: 22px; line-height: 1; }
.smp2-photo-add-txt { font-size: 11px; }
.smp2-photo-add input { display: none; }

.smp2-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 12px; }
.smp2-grid label { display: flex; flex-direction: column; font-size: 11px; color: #6b7290; gap: 3px; }
.smp2-in { border: 1px solid #e6e9f2; border-radius: 7px; padding: 5px 8px; font-size: 12px; width: 100%; background: #fff; }
.smp2-in:focus { outline: none; border-color: #4c6ef5; }
/* Поле «выбор или ввод» (input+datalist): по высоте и отступам как соседние select'ы,
   плейсхолдер приглушён, чтобы не спорить с реальным значением */
.smp2-combo { font-family: inherit; }
.smp2-combo::placeholder { color: #aab0c0; }
/* Цена образца: вводится в юанях, рубли подписью под полем (считаются по курсу ЦБ) */
.smp2-rub { display: block; margin-top: 3px; font-size: 11px; line-height: 1.3; color: #2f9e44; font-weight: 600; }
.smp2-rub-dim { color: #aab0c0; font-weight: 400; }

.smp2-resp { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px dashed #eef0f7; }
.smp2-resp-t { font-size: 11px; font-weight: 700; color: #3a4266; align-self: center; }
.smp2-resp label { display: flex; flex-direction: column; font-size: 10px; color: #6b7280; gap: 2px; flex: 1; min-width: 150px; }

.smp2-fit { margin-top: 10px; }
.smp2-fit-head { font-size: 12px; font-weight: 700; color: #3a4266; margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.smp2-fit-add { background: #ebfbee; color: #2f9e44; border: 1px solid #b2f2bb; border-radius: 7px; width: 22px; height: 22px; cursor: pointer; font-weight: 800; }
.smp2-fit-empty { font-size: 12px; color: #787e93; font-style: italic; }
.smp2-fit-row { border: 1px solid #eef0f7; border-radius: 9px; padding: 8px; margin-bottom: 7px; background: #fafbfd; }
.smp2-fit-head2 { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.smp2-fit-label { font-size: 12px; font-weight: 700; color: #6741d9; white-space: nowrap; }
.smp2-fit-authbtn { flex: 1; min-width: 150px; max-width: 260px; }
.smp2-fit-head2 .smp2-fit-date { width: 130px; flex-shrink: 0; }
.smp2-fit-head2 .smp2-fit-verdict { width: 140px; flex-shrink: 0; }
.smp2-fit-comment { width: 100%; resize: vertical; min-height: 46px; line-height: 1.4; font-family: inherit; }
@media (max-width: 720px) { .smp2-fit-meta { grid-template-columns: 1fr 1fr; } .smp2-grid { grid-template-columns: repeat(2, 1fr); } }
.smp2-fit-del { background: none; border: none; color: #e03131; cursor: pointer; font-size: 14px; font-weight: 700; }
.smp2-fit-del:hover { color: #c92a2a; }

.modal-samples-corner-btn { background: #f3f0ff !important; color: #6741d9 !important; }
/* Кнопка «Образцы» до стадии «Получение образцов»: видна всегда (Катарина 30.07, п.9),
   но приглушена — образцы по процессу ещё не пришли, заносить их рано. */
.modal-samples-corner-btn.modal-samples-early { background: #f6f7fb !important; color: #8a90a6 !important; }

/* 1С — краткая сводка дат */
.c1c-wrap { display: flex; flex-direction: column; gap: 12px; }
.c1c-batch { border: 1px solid #e6e9f2; border-radius: 12px; padding: 12px 14px; background: #fbfcfe; }
.c1c-batch-h { font-weight: 700; font-size: 13px; color: #2b3a67; margin-bottom: 8px; }
.c1c-line { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; padding: 3px 0; flex-wrap: wrap; }
.c1c-lbl { color: #6b7290; }
.c1c-val { color: #2b3a67; font-weight: 600; text-align: right; }
.c1c-dim { color: #787e93; }
.c1c-moved { font-size: 12px; color: #e8590c; background: #fff4e6; border-radius: 7px; padding: 4px 9px; margin: 3px 0; font-weight: 600; }
.c1c-note { font-size: 12px; color: #6b7290; margin-top: 6px; padding-top: 6px; border-top: 1px dashed #eef0f7; }

/* история — свёрнутый журнал */
.mh-audit-details { margin-top: 14px; border-top: 1px solid #eef0f7; padding-top: 10px; }
.mh-audit-summary { cursor: pointer; font-weight: 700; font-size: 13px; color: #3a4266; list-style: none; display: flex; align-items: center; gap: 8px; }
.mh-audit-summary::-webkit-details-marker { display: none; }
.mh-audit-summary::before { content: '▸'; color: #6b7280; transition: transform .15s; }
.mh-audit-details[open] .mh-audit-summary::before { transform: rotate(90deg); }
.mh-audit-hint { font-size: 11px; font-weight: 500; color: #787e93; }
.mh-audit-details[open] .mh-audit-hint { display: none; }
.mh-audit-body { margin-top: 8px; }

/* поле ответственного (кликабельное) */
.respf { display: flex; align-items: center; gap: 7px; width: 100%; border: 1px solid #e6e9f2; border-radius: 7px; padding: 4px 8px; background: #fff; cursor: pointer; font-size: 12px; text-align: left; }
.respf:hover { border-color: #4c6ef5; }
.respf-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #2b3a67; font-weight: 600; }
.respf-placeholder { color: #787e93; font-weight: 400; }
.respf-none { width: 22px; height: 22px; border-radius: 50%; background: #f0f2f8; color: #787e93; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; }
.respf-caret { color: #787e93; font-size: 10px; }
/* «Заказ образца» — выпадающий список переводчиков (Паша 30.07): аватар + select в рамке .respf */
.respf-sel { cursor: default; padding: 3px 4px 3px 8px; }
.respf-sel select { flex: 1; min-width: 0; border: 0; background: none; font-size: 12px; font-weight: 600; color: #2b3a67; cursor: pointer; padding: 2px 0; }
.respf-sel select:focus { outline: none; }

.emp-av { border-radius: 50%; object-fit: cover; background: #eef1f8; flex-shrink: 0; }
.emp-av-ini { display: inline-flex; align-items: center; justify-content: center; text-align: center; background: #dbe4ff; color: #3b5bdb; font-weight: 800; font-size: 12px; }

/* пикер сотрудников */
.resp-picker { position: fixed; inset: 0; z-index: 10002; display: none; align-items: center; justify-content: center; background: rgba(16,20,38,.55); padding: 24px; }
.resp-picker.show { display: flex; }
.rp-panel { background: #fff; border-radius: 16px; width: 420px; max-width: 94vw; max-height: 82vh; display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 70px rgba(0,0,0,.3); }
.rp-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 18px; font-weight: 800; font-size: 15px; color: #2b3a67; border-bottom: 1px solid #eef0f7; }
.rp-x { background: none; border: none; font-size: 18px; cursor: pointer; color: #6b7280; }
.rp-search { margin: 12px 16px 6px; padding: 9px 12px; border: 1px solid #e6e9f2; border-radius: 9px; font-size: 13px; }
.rp-search:focus { outline: none; border-color: #4c6ef5; }
.rp-list { overflow-y: auto; padding: 4px 8px 10px; }
.rp-dept { font-size: 11px; font-weight: 800; color: #6b7280; text-transform: uppercase; margin: 10px 10px 4px; letter-spacing: .3px; }
.rp-item { display: flex; align-items: center; gap: 11px; width: 100%; border: none; background: none; padding: 8px 10px; border-radius: 10px; cursor: pointer; text-align: left; }
.rp-item:hover { background: #f5f7fc; }
.rp-none { margin: 4px 8px 0; color: #6b7290; font-weight: 600; font-size: 13px; }
.rp-info { display: flex; flex-direction: column; min-width: 0; }
.rp-name { font-weight: 700; color: #2b3a67; font-size: 13px; }
.rp-pos { font-size: 11px; color: #6b7280; }
.rp-empty { padding: 20px; text-align: center; color: #787e93; }

/* галерея фото образца */
.sample-gallery {
  position: fixed; inset: 0; z-index: 10001; display: none;
  align-items: center; justify-content: center;
  background: rgba(12,16,32,.9); padding: 40px;
}
.sample-gallery.show { display: flex; }
.sg-stage { display: flex; flex-direction: column; align-items: center; gap: 12px; max-width: 88vw; max-height: 88vh; }
.sg-stage img { max-width: 88vw; max-height: 78vh; object-fit: contain; border-radius: 12px; background: #fff; box-shadow: 0 20px 60px rgba(0,0,0,.5); }
.sg-bar { display: flex; align-items: center; gap: 18px; }
.sg-cap { color: #fff; font-weight: 700; font-size: 14px; }
.sg-dl { color: #fff; background: #4c6ef5; text-decoration: none; padding: 7px 16px; border-radius: 9px; font-size: 13px; font-weight: 700; }
.sg-dl:hover { background: #3b5bdb; }
.sg-close { position: absolute; top: 20px; right: 26px; background: rgba(255,255,255,.15); color: #fff; border: none; width: 40px; height: 40px; border-radius: 50%; font-size: 20px; cursor: pointer; }
.sg-close:hover { background: rgba(255,255,255,.28); }
.sg-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.14); color: #fff; border: none; width: 54px; height: 54px; border-radius: 50%; font-size: 34px; line-height: 1; cursor: pointer; }
.sg-nav:hover { background: rgba(255,255,255,.3); }
.sg-prev { left: 24px; }
.sg-next { right: 24px; }

/* === Чек-лист цветов фотообразцов === */
.pc-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.pc-item {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 10px 5px 7px;
  border: 1px solid #e6e9f2; border-radius: 20px;
  background: #fafbff; cursor: pointer; font-size: 12px;
  transition: background .12s ease, border-color .12s ease;
}
.pc-item:hover { border-color: #c9d2ea; }
.pc-item.pc-on { background: #ebfbee; border-color: #b2f2bb; }
.pc-item input { margin: 0; cursor: pointer; }
.pc-code { font-family: monospace; color: #6b7280; font-size: 11px; }
.pc-name { color: #3a4266; font-weight: 600; }
.pc-badge { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 10px; margin-left: 6px; white-space: nowrap; }
.pc-ok { background: #ebfbee; color: #2f9e44; }
.pc-miss { background: #fff5f5; color: #e03131; }
.pc-empty { margin-top: 6px; font-size: 12px; color: #b06d0a; background: #fff9e6; border: 1px solid #ffe8a3; border-radius: 8px; padding: 7px 10px; }

/* срок, привязанный к вехе 1С */
.cond-srok-late { color: #e03131 !important; font-weight: 800; }
.cond-task-alarm { border-color: #ffc9c9; background: #fff5f5; }
.cond-task-note { font-size: 12px; margin-top: 6px; border-radius: 7px; padding: 5px 9px; font-weight: 600; }
.cond-note-alarm { color: #c92a2a; background: #ffe3e3; }
/* Присвоение артикула (Лариса) */
.aa-done { color: #2b8a3e; font-weight: 600; font-size: 12px; }
.aa-wait { color: #e8590c; font-weight: 700; font-size: 12px; }
.aa-row { display: flex; gap: 8px; margin-top: 6px; }
.aa-input { flex: 1; padding: 6px 10px; border: 1px solid #d1d5db; border-radius: 7px; font-size: 13px; }
.aa-save { background: #4c6ef5; color: #fff; border: none; border-radius: 7px; padding: 6px 14px; font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.aa-save:hover { background: #3b5bdb; }
.chip-article-none { background: #fff0e6 !important; color: #d9480f !important; font-weight: 700; }
/* ── OTIF-трекер (по образцу Катарины) ── */
.otrk-note { font-size: 12px; color:#555; background:#f8f9fb; border-radius:8px; padding:8px 12px; margin:6px 0 12px; }
.otrk-real { display:flex; align-items:center; gap:16px; flex-wrap:wrap; background:#fff4e6; border:1px solid #ffd8a8; border-radius:10px; padding:10px 14px; margin:4px 0 6px; }
.otrk-real-bad { background:#fff5f5; border-color:#ffc9c9; }
.otrk-real-big { font-size:15px; color:#e8590c; } .otrk-real-bad .otrk-real-big { color:#e03131; }
.otrk-real-big b { font-size:19px; font-weight:800; }
.otrk-real-vs { font-size:13px; color:#495057; } .otrk-real-vs b { color:#2b8a3e; }
.otrk-real-note { flex:1 1 100%; font-size: 11px; color:#7a6a55; }
.otrk-wrap { overflow-x:auto; }
.otrk-table { width:100%; border-collapse:collapse; font-size: 12px; }
.otrk-table th { background:#f1f3f7; color:#495057; font-weight:700; padding:7px 8px; text-align:center; border-bottom:2px solid #e3e6ec; white-space:nowrap; }
.otrk-table th.otrk-name { text-align:left; }
.otrk-table td { padding:5px 8px; border-bottom:1px solid #eef0f4; text-align:center; vertical-align:middle; }
.otrk-name { text-align:left !important; white-space:nowrap; }
.otrk-tgl { display:inline-block; width:16px; color:#868e96; }
.otrk-total { background:#eef4ff; font-weight:800; }
.otrk-total .otrk-name { font-weight:800; }
.otrk-typerow:hover { background:#f6f8ff; }
.otrk-typerow .otrk-name { font-weight:700; color:#2b3240; }
.otrk-monrow { color:#6c757d; background:#fcfcfd; }
.otrk-monrow .otrk-name { font-weight:500; }
.otrk-m { min-width:96px; }
.otrk-pct { font-size:14px; font-weight:800; line-height:1.1; }
.otrk-pct.otrk-good { color:#2b8a3e; } .otrk-pct.otrk-warn { color:#e8590c; } .otrk-pct.otrk-bad { color:#e03131; } .otrk-pct.otrk-na { color:#adb5bd; }
.otrk-bar { height:5px; background:#edf0f4; border-radius:3px; overflow:hidden; margin:2px auto; max-width:80px; }
.otrk-bar i { display:block; height:100%; background:#40c057; }
.otrk-cnt { font-size:11px; }
.otrk-ok { color:#2b8a3e; font-weight:700; } .otrk-late { color:#e03131; font-weight:700; }
.otrk-num { font-variant-numeric:tabular-nums; }
.otrk-placed { color:#2b8a3e; font-weight:700; } .otrk-notplaced { color:#e8590c; font-weight:700; } .otrk-cancel { color:#adb5bd; }
.otrk-share { color:#868e96; }
.otrk-pg { margin-top:22px; }
.otrk-pg-head { font-size:13px; font-weight:700; color:#343a40; margin-bottom:10px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.otrk-lg { font-size: 11px; color:#666; font-weight:500; display:inline-flex; align-items:center; gap:4px; }
.otrk-lg i { width:11px; height:11px; border-radius:3px; display:inline-block; }
.otrk-pg-chart { display:flex; align-items:flex-end; gap:14px; padding:10px 4px 0; overflow-x:auto; min-height:210px; }
.otrk-pg-col { display:flex; flex-direction:column; align-items:center; gap:4px; min-width:52px; }
.otrk-pg-tot { font-size:12px; font-weight:700; color:#495057; }
.otrk-pg-stack { display:flex; flex-direction:column-reverse; width:34px; border-radius:4px 4px 0 0; overflow:hidden; }
.otrk-pg-seg { width:100%; }
.otrk-pg-x { font-size:11px; color:#868e96; white-space:nowrap; }
.cond-auto1c { font-size: 12px; margin-top: 6px; border-radius: 7px; padding: 5px 9px; font-weight: 600; }
.cond-auto1c-ok { color: #2b8a3e; background: #ebfbee; }
.cond-auto1c-wait { color: #868e96; background: #f1f3f5; }
.notif-row-alarm td { color: #c92a2a; background: #fff5f5; font-weight: 600; }
.cond-srok-today { color: #e8a90a !important; font-weight: 800; }

/* === Фото артикула (единый вид во всех разделах) === */
.art-photo {
  width: 44px; height: 44px;
  object-fit: contain;
  border-radius: 6px;
  background: #f6f7fb;
  border: 1px solid #eef0f7;
  cursor: zoom-in;
  transition: transform .12s ease;
  vertical-align: middle;
}
.art-photo:hover { transform: scale(1.08); }
.art-photo-lg { width: 64px; height: 64px; }
.art-photo-card { width: 100%; height: 120px; object-fit: contain; border-radius: 8px; }

.photo-lightbox {
  position: fixed; inset: 0;
  background: rgba(16,20,38,.82);
  z-index: 10000;
  display: none;
  align-items: center; justify-content: center;
  cursor: zoom-out;
  padding: 32px;
}
.photo-lightbox.show { display: flex; }
.photo-lightbox .pl-inner { max-width: 92vw; max-height: 92vh; text-align: center; }
.photo-lightbox img {
  max-width: 92vw; max-height: 84vh;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(0,0,0,.45);
}
.photo-lightbox .pl-cap { margin-top: 12px; color: #fff; font-weight: 700; font-size: 14px; }
.photo-lightbox .pl-inner { position: relative; }
.photo-lightbox .pl-close {
  position: absolute; top: -14px; right: -14px;
  width: 36px; height: 36px;
  border: none; border-radius: 50%;
  background: #fff; color: #1a2340;
  font-size: 22px; line-height: 1; font-weight: 700;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0,0,0,.35);
  z-index: 1;
}
.photo-lightbox .pl-close:hover { background: #ffe3e3; color: #c22; }

/* === Главная: поиск вверху + дашборд === */
.home-search-top { margin: 0 0 22px; }

.home-dashboard { margin: 0 0 8px; }
.hd-head { margin-bottom: 14px; }
.hd-head .home-title { margin: 0; }
.hd-sub { font-size: 13px; color: #6b7280; }

.hd-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}
.hd-kpi {
  background: #fff;
  border-radius: 18px;
  padding: 18px 20px;
  box-shadow: 0 6px 20px rgba(30,40,90,.06);
  border: 1px solid #eef0f7;
}
.hd-kpi-num { font-size: 34px; font-weight: 800; line-height: 1; }
.hd-kpi-lbl { margin-top: 8px; font-size: 13px; color: #6b7290; font-weight: 600; }
.hd-kpi-total .hd-kpi-num { color: #2b3a67; }
.hd-kpi-bad .hd-kpi-num { color: #e03131; }
/* Было #e8a90a — 2,08:1 на белом (аудит 30.07): «дедлайн сегодня», самое срочное
   на экране, читалось хуже всего. #b45309 = 5,0:1, тот же «жёлтый по смыслу». */
.hd-kpi-warn .hd-kpi-num { color: #b45309; }
.hd-kpi-ok .hd-kpi-num { color: #2f9e44; }
.hd-kpi-bad.is-alert {
  background: linear-gradient(180deg, #fff5f5 0%, #fff 70%);
  border-color: #ffc9c9;
}

.hd-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 16px;
}
@media (max-width: 900px) { .hd-grid { grid-template-columns: 1fr; } .hd-kpis { grid-template-columns: repeat(2, 1fr); } }

/* Главная на телефоне (аудит 30.07). Строки людей/фабрик/стадий задавали жёсткий
   минимум первой колонки (minmax(110px|120px, …)) плюс колонку `auto` с nowrap-числом
   и gap 10px — такая сетка физически шире 375px и не сжимается. Медиазапрос выше
   разворачивал в одну колонку только внешний .hd-grid, внутренние строки не трогал,
   поэтому вся страница уезжала вбок на 231px (замерено: скрытие .hd-panel возвращало
   scrollWidth 606→375; главный виновник — панель «Сдвиги сроков отгрузки»). Снимаем
   жёсткие минимумы: minmax(0, …) даёт трекам право сжиматься, длинные подписи режем
   эллипсисом вместо распирания сетки. Остальные экраны при 375px overflow не имели. */
@media (max-width: 900px) {
  /* Корень проблемы (замерено): у .hd-grid трек `1fr` разворачивался в 523px внутри
     контейнера 311px. У `1fr` минимум по умолчанию = auto = min-content содержимого,
     поэтому трек не сжимается, а тянет за собой панель и все строки внутри — правки
     самих строк ниже без этого не срабатывали. minmax(0, 1fr) снимает этот минимум,
     min-width:0 позволяет панели сжаться вслед за треком. */
  .hd-grid, .hd-grid-2 { grid-template-columns: minmax(0, 1fr); }
  .hd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hd-panel { min-width: 0; }
  /* Третья колонка была `auto`: её минимум = max-content, а внутри лежат числа с
     white-space:nowrap («−14 дн», «3 партии»), поэтому трек распирал строку даже при
     minmax(0,…) в первых двух. minmax(0, auto) + разрешение переноса в самих числах. */
  .hd-per-row, .hd-fac-row { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, auto); gap: 8px; }
  .hd-fac-rowx { grid-template-columns: 14px minmax(0, 1fr) minmax(0, 1fr) minmax(0, auto); }
  .hd-stage-row { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, auto); gap: 8px; }
  .hd-shift-item { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.2fr) minmax(0, auto); }
  .hd-per-num, .hd-fac-num, .hd-fac-sub, .hd-per-days, .hd-stage-count {
    white-space: normal; overflow-wrap: anywhere;
  }
  /* «Требуют внимания»: 4 колонки (1.3fr 1fr 1fr auto) не влезают в 375px — бейдж
     «−14 дн» обрезался краем прокручиваемой панели. Сворачиваем в 2×2. */
  .hd-attn-row { grid-template-columns: minmax(0, 1fr) minmax(0, auto); gap: 4px 8px; }
  .hd-attn-late { white-space: normal; text-align: left; }
  .hd-attn-name, .hd-attn-stage, .hd-attn-resp {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
  }
  .hd-shift-list { margin-left: 10px; }
  .hd-per-name, .hd-fac-code, .hd-shift-art, .hd-stage-name {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
  }
}
.hd-panel {
  background: #fff;
  border-radius: 18px;
  padding: 16px 18px;
  box-shadow: 0 6px 20px rgba(30,40,90,.06);
  border: 1px solid #eef0f7;
}
.hd-panel-title { font-size: 14px; font-weight: 700; color: #3a4266; margin-bottom: 12px; }

.hd-stages { display: flex; flex-direction: column; gap: 6px; }
.hd-stage-row {
  display: grid;
  grid-template-columns: minmax(120px, 1.4fr) 2fr auto;
  align-items: center;
  gap: 10px;
  background: transparent;
  border: none;
  padding: 6px 8px;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  transition: background .12s ease;
}
.hd-stage-row:hover { background: #f5f7fc; }
.hd-stage-name { font-size: 13px; color: #3a4266; font-weight: 600; }
.hd-stage-bar-wrap { height: 10px; background: #eef1f8; border-radius: 6px; overflow: hidden; }
.hd-stage-bar { height: 100%; background: #4c6ef5; border-radius: 6px; transition: width .3s ease; }
.hd-stage-bar.has-over { background: #e03131; }
.hd-stage-count { font-size: 13px; font-weight: 700; color: #2b3a67; white-space: nowrap; text-align: right; }
.hd-stage-over { color: #e03131; margin-left: 6px; font-weight: 700; }
.hd-stage-today { color: #b45309; margin-left: 6px; font-weight: 700; }  /* было #e8a90a — 2,08:1 */

.hd-attn { display: flex; flex-direction: column; gap: 6px; max-height: 340px; overflow-y: auto; }
.hd-attn-row {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr auto;
  align-items: center;
  gap: 10px;
  background: #fff8f8;
  border: 1px solid #ffe0e0;
  padding: 8px 10px;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  transition: background .12s ease;
}
.hd-attn-row:hover { background: #fff0f0; }
.hd-attn-name { font-size: 13px; font-weight: 700; color: #2b3a67; }
.hd-attn-stage { font-size: 12px; color: #6b7290; }
.hd-attn-resp { font-size: 12px; color: #6b7290; }
.hd-attn-late { font-size: 12px; font-weight: 800; color: #e03131; white-space: nowrap; text-align: right; }
.hd-empty { padding: 20px; text-align: center; color: #2f9e44; font-weight: 600; }
.hd-kpi-sub { display: block; font-size: 11px; font-weight: 600; color: #b06d6d; margin-top: 2px; }
.hd-src { font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: 7px; vertical-align: middle; }
.hd-src-db { background: #e7f5ff; color: #1971c2; }
.hd-src-sla { background: #fff3bf; color: #b06d0a; }
.hd-attn-fac { font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: 7px; vertical-align: middle; background: #f1f3f5; color: #495057; }

/* ═══ Реестр образцов: жизненный цикл (задача Катарины) ═══ */
.smp-pipe { display: flex; align-items: stretch; gap: 0; flex-wrap: wrap; padding: 6px 2px 2px; }
.smp-pipe-step { flex: 1 1 0; min-width: 92px; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; background: #f8f9ff; border: 2px solid transparent; border-bottom: 3px solid var(--pc, #4c6ef5); border-radius: 12px; cursor: pointer; transition: .15s; }
.smp-pipe-step:hover { background: #eef1ff; }
.smp-pipe-step.active { background: #fff; border-color: var(--pc, #4c6ef5); box-shadow: 0 2px 10px rgba(76,110,245,.18); }
.smp-pipe-ico { font-size: 18px; }
.smp-pipe-n { font-size: 22px; font-weight: 800; color: #2b2f42; line-height: 1; }
.smp-pipe-lbl { font-size: 11px; color: #6b7089; text-align: center; font-weight: 600; }
.smp-pipe-arrow { align-self: center; color: #c3c8de; font-size: 18px; padding: 0 2px; }
.smp-pipe-branches { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 10px; padding-left: 2px; }
.smp-pipe-branches-t { font-size: 12px; color: #6b7280; font-weight: 600; }
.smp-pipe-branch { display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px; background: #fff; border: 1.5px solid #e6e8f2; border-left: 4px solid var(--pc, #e8a90a); border-radius: 9px; font-size: 12px; font-weight: 600; color: #454a63; cursor: pointer; }
.smp-pipe-branch:hover { background: #f8f9ff; }
.smp-pipe-branch.active { border-color: var(--pc); box-shadow: 0 1px 6px rgba(0,0,0,.08); }
.smp-pipe-branch-n { font-weight: 800; color: #2b2f42; }
.smp-reg-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.smp-reg-search { flex: 1 1 220px; min-width: 180px; padding: 8px 12px; border: 1.5px solid #e6e8f2; border-radius: 9px; font-size: 13px; }
.smp-reg-filter { padding: 8px 10px; border: 1.5px solid #e6e8f2; border-radius: 9px; font-size: 13px; background: #fff; }
.smp-reg-reset { padding: 8px 12px; border: 1.5px solid #ffd0d0; background: #fff5f5; color: #d6336c; border-radius: 9px; font-size: 12px; font-weight: 600; cursor: pointer; }
.smp-reg-count { margin-left: auto; font-size: 12px; color: #6b7280; font-weight: 600; }
.smp-reg-table td { vertical-align: middle; }
.smp-reg-dim { color: #787e93; }
.smp-reg-num { text-align: center; font-weight: 700; color: #454a63; }
.smp-reg-days { font-size: 12px; font-weight: 700; color: #6b7089; }
.smp-reg-days.stuck { color: #e03131; }
.smp-reg-verdict { font-size: 12px; font-weight: 700; }
.smp-reg-stuck td { background: #fff5f5 !important; }
.smp-reg-stuck:hover td { background: #ffecec !important; }
.smp-kpi-on { outline: 2px solid #e03131; outline-offset: -1px; }

/* ═══ Проверка фабрики (задача 4) ═══ */
.fchk-card { background: #fff; border: 1.5px solid #eceef6; border-radius: 14px; padding: 16px 18px; }
.fchk-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.fchk-event { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; background: #f0f3ff; border-radius: 10px; border-left: 4px solid #4c6ef5; }
.fchk-event.fchk-over { background: #fff0f0; border-left-color: #e03131; }
.fchk-event.fchk-soon { background: #fff9e6; border-left-color: #e8a90a; }
.fchk-event-date { font-size: 16px; font-weight: 800; color: #2b2f42; }
.fchk-event-lbl { font-size: 12px; color: #6b7089; }
.fchk-flag { font-size: 11px; font-weight: 800; padding: 2px 8px; border-radius: 8px; }
.fchk-flag-over { background: #e03131; color: #fff; }
.fchk-flag-soon { background: #e8a90a; color: #fff; }
.fchk-note { display: block; font-size: 12px; color: #6b7280; margin-bottom: 12px; }
.fchk-note-warn { color: #d6336c; }
.fchk-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 14px; }
.fchk-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: #6b7089; font-weight: 600; }
.fchk-photos-head, .fchk-result-lbl { font-size: 13px; font-weight: 700; color: #454a63; margin: 6px 0 8px; }
.fchk-result { margin-top: 14px; }
.fchk-result-ta { width: 100%; resize: vertical; }
.fchk-flow { margin-top: 14px; font-size: 11px; color: #6b7280; background: #f8f9fb; border-radius: 8px; padding: 8px 10px; }
.fchk-td-date { font-weight: 700; color: #2b2f42; white-space: nowrap; }
.fchk-auto { font-size: 10px; font-weight: 700; color: #1971c2; background: #e7f5ff; padding: 1px 5px; border-radius: 6px; }

/* ═══ План/факт + причины опозданий (задачи 3, 6) ═══ */
.pf-row-late td { background: #fff8f8; }
.pf-row-late:hover td { background: #fff0f0; }
.pf-late { font-size: 12px; font-weight: 800; color: #e03131; white-space: nowrap; }
.pf-ok { font-size: 12px; font-weight: 700; color: #2f9e44; }
.pf-today { font-size: 12px; font-weight: 700; color: #b06d0a; }
.pf-src { font-size: 10px; font-weight: 800; padding: 1px 6px; border-radius: 7px; background: #eef1ff; color: #4c6ef5; vertical-align: middle; }

/* ═══ Главная: ключевые цифры + затык (задачи 1, 2) ═══ */
.hd-bottleneck { font-size: 13px; font-weight: 600; color: #b0403a; background: #fff2f0; border: 1px solid #ffdad4; border-radius: 9px; padding: 7px 11px; margin-bottom: 10px; }
.hd-bottleneck-ok { color: #2b8a3e; background: #ebfbee; border-color: #c3ebca; }
.hd-figures { margin-bottom: 14px; }
.hd-fig-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; margin-bottom: 14px; }
.hd-fig { background: #f8f9ff; border-radius: 11px; padding: 12px 10px; text-align: center; }
.hd-fig-num { font-size: 24px; font-weight: 800; color: #2b2f42; line-height: 1.1; }
.hd-fig-good { color: #2f9e44; }
.hd-fig-warn { color: #b06d0a; }
.hd-fig-bad { color: #e03131; }
.hd-fig-lbl { font-size: 11px; color: #6b7089; margin-top: 3px; }
.hd-fig-split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.hd-fig-col-t { font-size: 12px; font-weight: 700; color: #6b7280; margin-bottom: 8px; text-transform: uppercase; letter-spacing: .3px; }
.hd-fig-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.hd-fig-bar-lbl { flex: 0 0 42%; font-size: 12px; color: #454a63; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hd-fig-bar-track { flex: 1; height: 8px; background: #eceef6; border-radius: 5px; overflow: hidden; }
.hd-fig-bar-fill { display: block; height: 100%; background: #37b24d; border-radius: 5px; }
.hd-fig-fill-blue { background: #4c6ef5; }
.hd-fig-bar-n { flex: 0 0 auto; font-size: 12px; font-weight: 700; color: #2b2f42; min-width: 18px; text-align: right; }
.hd-fig-empty { font-size: 12px; color: #787e93; }
@media (max-width: 640px) { .hd-fig-split { grid-template-columns: 1fr; gap: 12px; } }

/* ═══ Профиль Битрикса вместо голого ФИО (правило 22.07) ═══ */
.empchip { display: inline-flex; align-items: center; gap: 6px; padding: 2px 8px 2px 3px; background: #f4f6fd; border-radius: 999px; text-decoration: none; color: #2b2f42; font-weight: 600; font-size: 12px; line-height: 1.2; vertical-align: middle; border: 1px solid #e6e9f5; max-width: 100%; }
a.empchip:hover { background: #e8edfd; border-color: #c9d4f7; color: #1b4fd8; }
.empchip .emp-av { flex: 0 0 auto; border-radius: 50%; object-fit: cover; }
.empchip-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.empchip-extra { font-size: 11px; color: #6b7280; vertical-align: middle; }
.empchip-sep { color: #9aa3b2; margin: 0 2px; vertical-align: middle; }
.pn0-extra { font-size: 11px; font-weight: 800; color: #1971c2; background: #e7f5ff; border-radius: 8px; padding: 3px 9px; white-space: nowrap; }

/* ═══ Ключевые цифры: drill-down (клик по цифре → список) ═══ */
button.hd-fig, button.hd-fig-bar { font: inherit; border: none; width: 100%; }
.hd-fig-click { cursor: pointer; transition: .13s; border: 2px solid transparent !important; }
button.hd-fig-click:hover { background: #eef1ff; }
.hd-fig.active { border-color: #4c6ef5 !important; background: #fff; box-shadow: 0 2px 10px rgba(76,110,245,.16); }
button.hd-fig-bar { background: none; padding: 3px 4px; border-radius: 8px; }
button.hd-fig-bar:hover { background: #f2f4fc; }
.hd-fig-bar.active { background: #eef1ff; outline: 1.5px solid #4c6ef5; }
.hd-fig-panel { margin-top: 14px; border-top: 2px solid #eef0f8; padding-top: 12px; }
.hd-fig-panel-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.hd-fig-panel-title { font-size: 14px; font-weight: 800; color: #2b2f42; }
.hd-fig-panel-hint { font-size: 11px; color: #6b7280; }
.hd-fig-panel-x { margin-left: auto; padding: 5px 11px; border: 1.5px solid #e6e8f2; background: #fff; border-radius: 8px; font-size: 12px; font-weight: 600; color: #6b7089; cursor: pointer; }
.hd-fig-panel-x:hover { background: #f6f7fb; }
.hd-fig-panel-scroll { max-height: 420px; overflow-y: auto; border: 1px solid #f0f2f8; border-radius: 10px; }
.hd-fig-panel-scroll thead th { position: sticky; top: 0; background: #fff; z-index: 1; }

/* ═══ Фабрики → Производственный план (планы фабрик, ручной ввод) ═══ */
.fp-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; background: #fff; border: 1px solid #eef0f8; border-radius: 14px; padding: 14px; }
.fp-form label { display: flex; flex-direction: column; gap: 4px; font-size: 11px; font-weight: 700; color: #6b7089; }
.fp-day { background: #fff; border: 1px solid #eef0f8; border-radius: 14px; padding: 12px 14px; margin-top: 12px; }
.fp-day.fp-past { opacity: .62; }
.fp-day.fp-today { border-color: #4c6ef5; box-shadow: 0 2px 12px rgba(76,110,245,.12); }
.fp-day-head { font-weight: 800; font-size: 13px; color: #2b2f42; margin-bottom: 8px; text-transform: capitalize; }
.fp-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 7px 4px; border-top: 1px solid #f3f4fa; }
.fp-fac { font-weight: 800; color: #1971c2; white-space: nowrap; }
.fp-art { font-weight: 700; }
.fp-event { background: #eef1ff; color: #3b5bdb; font-weight: 700; font-size: 12px; border-radius: 8px; padding: 3px 10px; }
.fp-note { color: #6b7089; font-size: 12px; }
.fp-by { margin-left: auto; }
.fp-del { border: none; background: none; color: #787e93; cursor: pointer; font-size: 14px; }
.fp-del:hover { color: #e03131; }
/* Замечания при вердикте «Не прошёл» (примерка) */
.smp2-fail-notes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.smp2-fail-note { display: flex; flex-direction: column; gap: 4px; }
.smp2-fail-note-t { font-size: 11px; font-weight: 800; color: #c92a2a; display: inline-flex; align-items: center; gap: 6px; }
/* Баннер инструментов стадии (напр. назначение фабрики на распределении) */
.stage-tools-banner { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; background: #e7f5ff; border: 1px solid #a5d8ff; border-radius: 12px; padding: 10px 14px; margin-bottom: 12px; }
.stage-tools-txt { font-weight: 700; color: #1864ab; font-size: 13px; }
/* Артикулы: план по деньгам */
.art-margin-ok { color: #2f9e44; font-weight: 800; }
.art-margin-bad { color: #e03131; font-weight: 800; }
.art-margin-na { color: #6b7280; }
.aa-suggest { background: #eef1ff !important; color: #3b5bdb !important; }
.aa-sug-note { font-size: 11px; color: #3b5bdb; font-weight: 700; align-self: center; }

/* ═══ Матрица цвет×размер (заказы + карточка 1С) — П.15 ═══ */
.ord-sz-det { margin-top: 8px; }
.ord-sz-det > summary { cursor: pointer; font-size: 12px; font-weight: 700; color: #4c6ef5; padding: 4px 0; }
.ord-sz-table th { white-space: nowrap; }
.ord-sz-table td { text-align: center; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ord-sz-table tbody th { text-align: left; font-weight: 700; font-size: 12px; }
.ord-sz-table .osz-empty { color: #787e93; }
.ord-sz-table .osz-tot { font-weight: 800; background: #f8f9ff; }
.ord-sz-table .osz-footrow td, .ord-sz-table .osz-footrow th { font-weight: 800; background: #f8f9ff; border-top: 2px solid #e6e9f5; }
.osz-pct { display: block; font-size: 10px; font-weight: 800; color: #6b7280; }
.osz-part { background: #fff9db; } .osz-part .osz-pct { color: #e8a90a; }
.osz-full { background: #ebfbee; } .osz-full .osz-pct { color: #2f9e44; }

/* Себестоимость в разделе Цены (П.4) */
.fp-cost-cell { white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; font-weight: 600; }
.fp-cost-cell.fp-cost-high { background: #fff9db; color: #e8590c; }
.fp-cost-cell.fp-cost-ok { color: #2f9e44; }

/* ═══ Новая артикуляция: разбор формулы + правка бренда / фабрика на распределении ═══ */
.aa-formula { margin: 6px 0; padding: 8px 10px; background: #eef4ff; border: 1px solid #d0dcff; border-radius: 10px; font-size: 12px; color: #2b3a63; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.aa-brand { padding: 3px 6px; border: 1px solid #b9c6ee; border-radius: 7px; font-size: 12px; font-weight: 700; }
.aa-formula-parts { color: #6b7089; font-size: 11px; }
.stage-facassign { background: #f3f0ff; border-color: #d0c7f5; }
.stage-fac-sel { padding: 5px 8px; border-radius: 8px; border: 1px solid #c9d4f7; font-weight: 700; }
.stage-fac-note { font-size: 11px; color: #6b7089; }

/* ═══ Таблица «Образцы в китайском офисе» (Google Sheets) ═══ */
.kos-wrap { max-height: 520px; overflow-y: auto; }
.kos-table th { position: sticky; top: 0; background: #fff; z-index: 1; white-space: nowrap; }
.kos-table td { font-size: 12px; vertical-align: top; }
.kos-table .kos-fac { font-weight: 800; color: #1971c2; white-space: nowrap; }
.kos-table .kos-art { font-weight: 700; white-space: nowrap; }
.kos-badge { display: inline-block; background: #e7f5ff; color: #1971c2; font-size: 11px; font-weight: 700; border-radius: 7px; padding: 2px 8px; }

/* ═══ Множественный выбор и удаление карточек ═══ */
.board-select-btn { margin-left: auto; padding: 7px 14px; border: 1.5px solid #c9d4f7; background: #fff; border-radius: 9px; font-weight: 700; font-size: 13px; color: #3a54cc; cursor: pointer; white-space: nowrap; }
.board-select-btn:hover { background: #eef1ff; }
.card.card-selectable { cursor: pointer; }
.card.card-selectable:hover { outline: 2px solid #c9d4f7; }
.card.card-selected { outline: 2.5px solid #4c6ef5 !important; background: #eef4ff; }
.card-select-cb { position: absolute; top: 8px; left: 8px; z-index: 3; background: #fff; border-radius: 6px; padding: 2px; box-shadow: 0 1px 4px rgba(0,0,0,.15); display: flex; }
.card-select-cb input { width: 18px; height: 18px; cursor: pointer; margin: 0; accent-color: #4c6ef5; }
.card { position: relative; }
.board-select-bar { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; align-items: center; gap: 12px; background: #1f2438; color: #fff; padding: 12px 18px; border-radius: 14px; box-shadow: 0 8px 30px rgba(0,0,0,.35); }
.board-select-bar #board-select-count { font-weight: 800; font-size: 14px; }
.board-select-bar button { padding: 8px 14px; border: none; border-radius: 9px; font-weight: 700; font-size: 13px; cursor: pointer; background: #3a4160; color: #fff; }
.board-select-bar button:hover { background: #4a5178; }
.board-select-bar .board-select-delete { background: #e03131; }
.board-select-bar .board-select-delete:hover { background: #c92a2a; }
.board-select-bar .board-select-delete:disabled { background: #6b3a3a; opacity: .5; cursor: default; }

/* Флеш обновления таблицы артикулов + подтверждение сохранения плана по деньгам */
@keyframes tableFlash { 0% { background: #fff9db; } 100% { background: transparent; } }
.table-flash { animation: tableFlash 0.7s ease-out; }
.pm-saved-note { background: #ebfbee; color: #2f9e44; font-weight: 700; font-size: 12px; border-radius: 8px; padding: 7px 12px; margin: 6px 0 4px; display: inline-block; }

/* ═══════════════════════════════════════════════════════════════════════
   UI-АУДИТ 23.07 (по принципам разработки интерфейса, surf.ru):
   дизайн-токены + системная доступность / консистентность / обратная связь.
   Аддитивный слой поверх текущих стилей — ничего не ломает.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  /* Синие — осмысленная система (не схлопывать!): заливка / hover / текст-на-светлом / инфо / инфо-hover */
  --accent: #4c6ef5; --accent-hover: #3b5bdb; --accent-ink: #3a54cc; --accent-soft: #eef1ff;
  --info: #1971c2; --info-hover: #1864ab; --info-soft: #e7f5ff;
  --ok: #2f9e44; --warn: #e8a90a; --danger: #e03131;
  --brand-wb: #4263eb;  /* фирменный цвет Wildberries — семантика, не менять */
  --ink: #1f2330; --ink-2: #4a4f66; --ink-3: #6b7280;   /* все ≥4.5:1 на белом */
  --line: #e6e9f2; --surface: #fff; --bg: #eef0f5;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --t-fast: .12s ease; --t: .18s ease;
  /* ТИПО-ШКАЛА (единые ступени размера шрифта; под-пиксельные дубли сведены 23.07).
     Используем только эти значения, чтобы иерархия читалась и не было «зоопарка». */
  --fz-caption: 11px;  /* подписи, хинты, мелкие бейджи */
  --fz-small: 12px;    /* вторичный текст, чипы (самый частый) */
  --fz-body: 13px;     /* текст таблиц и списков */
  --fz-ui: 14px;       /* элементы управления */
  --fz-base: 15px;     /* базовый текст */
  --fz-lg: 16px;       /* акцентный текст */
  --fz-h3: 18px;       /* заголовок блока */
  --fz-h2: 20px;       /* заголовок экрана */
  --fz-h1: 24px;       /* крупные заголовки/числа */
}

/* Чёткий текст (сглаживание) + плавный скролл */
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
html { scroll-behavior: smooth; }

/* Выделение текста — в бренд-цвет */
::selection { background: rgba(76, 110, 245, .22); }

/* ДОСТУПНОСТЬ: видимый фокус С КЛАВИАТУРЫ на всех интерактивных элементах */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible, [role="button"]:focus-visible,
.respf:focus-visible, .card-select-cb:focus-within {
  outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px;
}
:focus:not(:focus-visible) { outline: none; }  /* мышиный клик не рисует рамку */

/* ОБРАТНАЯ СВЯЗЬ: единые состояния кнопок (нажатие / отключено) */
button { transition: background var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast), opacity var(--t-fast), border-color var(--t-fast); }
button:not(:disabled):active { transform: translateY(1px); }
button:disabled, button[disabled] { opacity: .55; cursor: not-allowed; }

/* КОНСИСТЕНТНОСТЬ: тонкие единые скроллбары по всему приложению (fallback,
   именные .x::-webkit-scrollbar остаются в силе — они специфичнее) */
* { scrollbar-width: thin; scrollbar-color: #c4cad8 transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #c4cad8; border-radius: 8px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: #aab2c5; }
::-webkit-scrollbar-track { background: transparent; }

/* Широкие таблицы скроллят ВНУТРИ себя, а не толкают страницу вбок (принцип: body не едет горизонтально) */
.table-scroll { overflow-x: auto; max-width: 100%; }

/* ═══ Реестр сотрудников (раздел «Сотрудники») ═══ */
.emp-roster-wrap { background: var(--surface); border-radius: var(--bento-radius-sm); box-shadow: var(--bento-shadow); padding: 18px 20px 8px; }
.emp-roster-head { margin-bottom: 12px; }
.emp-roster-title { margin: 0; font-size: var(--fz-h3); font-weight: 800; color: var(--ink); }
.emp-roster-sub { font-size: var(--fz-small); color: var(--ink-3); }
.emp-roster-table { width: 100%; border-collapse: collapse; }
.emp-roster-table thead th { text-align: left; font-size: var(--fz-caption); font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--ink-3); padding: 6px 14px; border-bottom: 2px solid var(--line); position: sticky; top: 0; background: var(--surface); z-index: 1; }
.emp-roster-table td { padding: 11px 14px; border-bottom: 1px solid #f0f2f8; vertical-align: top; }
.emp-ros-row:hover td { background: #f8f9ff; }
/* заголовок подразделения */
.emp-grp-row td { padding: 12px 14px 8px; font-size: var(--fz-body); font-weight: 800; letter-spacing: .01em; }
.emp-grp-msk td { background: linear-gradient(90deg,#eef4ff,#f7faff); color: #2b3a63; border-bottom: 2px solid #d0dcff; }
.emp-grp-ko  td { background: linear-gradient(90deg,#fff3ec,#fffaf6); color: #a24a1e; border-bottom: 2px solid #ffd8c2; }
.emp-grp-adj td { background: linear-gradient(90deg,#f3f0ff,#faf8ff); color: #5a3ea8; border-bottom: 2px solid #ddd3f7; }
.emp-grp-count { display: inline-block; margin-left: 6px; font-size: var(--fz-caption); font-weight: 800; background: rgba(0,0,0,.06); border-radius: 20px; padding: 1px 9px; vertical-align: middle; }
/* ячейка сотрудника */
.emp-ros-person { white-space: nowrap; }
.emp-ros-av { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; vertical-align: middle; margin-right: 11px; border: 2px solid #eef1f8; }
.emp-ros-av-ini { display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg,#4c6ef5,#7f77dd); color: #fff; font-weight: 800; font-size: var(--fz-body); }
.emp-ros-info { display: inline-flex; flex-direction: column; gap: 2px; vertical-align: middle; }
.emp-ros-name { font-weight: 700; color: var(--accent-ink); text-decoration: none; font-size: var(--fz-ui); }
.emp-ros-name:hover { text-decoration: underline; }
.emp-ros-contact { font-size: var(--fz-caption); color: var(--ink-3); }

/* Код входа сотрудника под почтой — видит только админ (Паша 31.07) */
.emp-ros-pin { display: inline-flex; align-items: center; gap: 6px; margin-top: 2px; font-size: var(--fz-caption); }
.emp-ros-pin-lbl { color: #6b7280; }
.emp-ros-pin-val {
  font-family: ui-monospace, Consolas, monospace; font-weight: 700; color: #2b3a67;
  background: #f4f6fd; border: 1px solid #e6e9f5; border-radius: 6px; padding: 1px 7px;
  letter-spacing: .08em; user-select: all;
}
.emp-ros-pin-val.is-shown { background: #fff8e6; border-color: #ffe3a3; letter-spacing: normal; }
.emp-ros-pin-na { color: #787e93; font-style: italic; }
.emp-ros-pin-eye {
  border: none; background: none; cursor: pointer; font-size: 13px;
  padding: 2px 4px; line-height: 1; opacity: .55; position: static; transform: none;
}
.emp-ros-pin-eye:hover { opacity: 1; }
.emp-ros-pos { font-weight: 600; color: var(--ink-2); font-size: var(--fz-body); white-space: nowrap; }
.emp-ros-zone { color: var(--ink-2); font-size: var(--fz-body); line-height: 1.5; max-width: 460px; }
/* «Войти как сотрудник» — точка входа в режим имитации (только админ, см. impersonateEmployee) */
.emp-ros-login {
  display: inline-block; margin-top: 7px; padding: 4px 10px;
  background: #eef4ff; color: #1c4587; border: 1px solid #cfe0ff; border-radius: 14px;
  font-size: 11px; font-weight: 600; cursor: pointer; white-space: nowrap;
}
.emp-ros-login:hover { background: #dbe8ff; }
.emp-facs { margin-top: 5px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; font-size: var(--fz-caption); color: var(--info); }
.emp-fac { background: var(--info-soft); color: var(--info); font-weight: 700; border-radius: 6px; padding: 1px 7px; }

/* Раздел «Сотрудники» — во всю ширину (класс .employees-list общий, переопределяем по id) */
#employees-list { max-width: none; }

/* ═══ Перетаскивание разделов левого меню (админ) ═══ */
.top-nav .nav-draggable { cursor: grab; position: relative; }
.top-nav .nav-draggable:active { cursor: grabbing; }
/* грип-иконка при наведении — подсказка, что раздел можно тянуть */
.top-nav .nav-draggable:hover::after {
  content: "⠿"; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  color: rgba(255,255,255,.45); font-size: 14px; letter-spacing: -1px; pointer-events: none;
}
.top-nav .nav-dragging { opacity: .45; }
.top-nav .nav-draggable.nav-dragging::after { content: none; }

/* ═══ Универсальный фильтр таблиц (строка под шапкой) ═══ */
.tf-row .tf-th { padding: 4px 8px; background: #f8f9ff; border-bottom: 2px solid var(--line); position: sticky; top: 0; }
.tf-row .tf-sel, .tf-row .tf-inp {
  width: 100%; min-width: 60px; max-width: 160px; box-sizing: border-box;
  padding: 4px 7px; font-size: var(--fz-caption); border: 1px solid #d7dcea; border-radius: 7px;
  background: #fff; color: var(--ink-2); font-family: inherit;
}
.tf-row .tf-sel:focus, .tf-row .tf-inp:focus { border-color: var(--accent); outline: none; }
.tf-row .tf-inp::-webkit-search-cancel-button { cursor: pointer; }

/* УТП — отдельный подраздел карточки: поле ввода во всю ширину модалки */
.modal-utp-textarea { width: 100%; min-height: 340px; box-sizing: border-box; padding: 14px 16px; border: 1px solid var(--line, #e6e9f2); border-radius: 12px; font: inherit; font-size: 14px; line-height: 1.5; resize: vertical; background: #fff; color: var(--ink, #1f2330); }
.modal-utp-textarea:focus { outline: 2px solid var(--accent, #4c6ef5); outline-offset: 1px; border-color: transparent; }
.modal-utp-saved { color: var(--ok, #2f9e44); font-weight: 700; font-size: 13px; align-self: center; }

/* Срок стадии (SLA) — плашка сверху колонки канбана */
.stage-sla { display: inline-block; background: var(--accent-soft, #eef1ff); color: var(--accent, #4c6ef5); font-size: 11px; font-weight: 800; border-radius: 8px; padding: 3px 9px; margin-bottom: 6px; letter-spacing: .2px; }

/* Анимация переезда карточки на новую стадию (после авто-перехода / кнопки «Перейти») */
@keyframes cardJustMoved {
  0%   { transform: translateX(-16px) scale(1.035); box-shadow: 0 0 0 3px rgba(34,197,94,.55), 0 14px 34px rgba(34,197,94,.28); }
  55%  { transform: translateX(0) scale(1.012);     box-shadow: 0 0 0 3px rgba(34,197,94,.42), 0 8px 22px rgba(34,197,94,.18); }
  100% { transform: none;                            box-shadow: none; }
}
.card.card-just-moved { animation: cardJustMoved 1.6s cubic-bezier(.22,.9,.28,1); position: relative; z-index: 3; }

/* Всплывающая плашка перехода стадии */
#move-toast {
  position: fixed; left: 50%; bottom: 34px; transform: translate(-50%, 22px);
  background: linear-gradient(135deg, #16a34a, #22c55e); color: #fff;
  font-weight: 700; font-size: 14px; padding: 12px 22px; border-radius: 12px;
  box-shadow: 0 12px 32px rgba(22,163,74,.38); opacity: 0; pointer-events: none;
  z-index: 9999; transition: opacity .3s ease, transform .35s cubic-bezier(.22,.9,.28,1);
}
#move-toast.move-toast-show { opacity: 1; transform: translate(-50%, 0); }

@media (prefers-reduced-motion: reduce) {
  .card.card-just-moved { animation: none; box-shadow: 0 0 0 3px rgba(34,197,94,.5); }
  #move-toast { transition: opacity .2s ease; }
}
.plm-num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.plm-good { color: var(--ok, #2f9e44); font-weight: 700; }
.plm-bad { color: var(--bad, #e03131); font-weight: 700; }
.plm-warn { color: var(--warn, #e8a13a); font-weight: 700; }
.plm-per-row.plm-row-active { background: var(--accent-soft, #eef1ff); }
.plm-per-row:hover { background: var(--hover, rgba(76,110,245,.06)); }
.plm-bar-wrap { display: inline-block; width: 46px; height: 6px; border-radius: 4px; background: var(--track, #e9ecef); vertical-align: middle; margin-right: 6px; overflow: hidden; }
.plm-bar { height: 100%; background: var(--accent, #4c6ef5); border-radius: 4px; }
.plm-stage-chip { display: inline-block; background: var(--chip-bg, #f1f3f5); color: var(--chip-fg, #495057); font-size: 11px; border-radius: 7px; padding: 2px 7px; margin: 1px 2px; white-space: nowrap; }
.plm-auto { display: inline-block; background: rgba(29,158,117,.14); color: #1d9e75; font-size: 10px; font-weight: 800; border-radius: 6px; padding: 1px 5px; margin-left: 4px; vertical-align: middle; }

/* Кнопка «Режим администратора» */
.admin-mode-btn {
  border: none; cursor: pointer; border-radius: 10px; padding: 9px 15px; margin: 0 8px;
  font-weight: 800; font-size: 12.5px; letter-spacing: .2px; white-space: nowrap; color: #eef4ff;
  width: auto; min-width: max-content; max-width: none; flex: 0 0 auto; overflow: visible; line-height: 1.1;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1746e0, #2f6dff);
  box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 4px 14px rgba(30,80,255,.42);
  transition: transform .15s ease, box-shadow .3s ease, filter .2s ease;
}
.admin-mode-btn:hover { transform: translateY(-1px); filter: brightness(1.08); }
.admin-mode-btn.on { color: #f2fff5; animation: adminGlow 1.6s ease-in-out infinite; }
@keyframes adminGlow {
  0%, 100% { box-shadow: 0 0 0 1px rgba(178,255,89,.55), 0 0 10px rgba(163,255,20,.55), 0 0 22px rgba(163,255,20,.32); }
  50%      { box-shadow: 0 0 0 2px rgba(178,255,89,.95), 0 0 22px rgba(163,255,20,.95), 0 0 42px rgba(163,255,20,.6); }
}
@media (prefers-reduced-motion: reduce) { .admin-mode-btn.on { animation: none; box-shadow: 0 0 0 2px rgba(178,255,89,.85), 0 0 18px rgba(163,255,20,.7); } }

/* Перетаскивание под-вкладок в режиме администратора */
body.admin-mode #board-tabs button.nav-draggable { cursor: grab; position: relative; }
body.admin-mode #board-tabs button.nav-draggable:active { cursor: grabbing; }
body.admin-mode #board-tabs button.nav-draggable::before { content: "⠿"; opacity: .5; margin-right: 5px; font-size: 11px; }
#board-tabs button.nav-dragging { opacity: .5; outline: 2px dashed var(--accent, #4c6ef5); outline-offset: 1px; }
body.admin-mode #board-tabs { outline: 1px dashed rgba(163,255,20,.5); outline-offset: 3px; border-radius: 8px; }

/* Скрытые пункты меню (убраны в корзину) + панель возврата */
.tasks-btn.menu-removed { display: none !important; }
/* видны только админу в админ-режиме — приглушённо, с кнопкой возврата ↩ (в потоке меню) */
.tasks-btn.menu-hidden-dim { opacity: .55; filter: grayscale(.35); display: flex; align-items: center; }
.tasks-btn.menu-hidden-dim:hover { opacity: .9; }

/* Контекстное меню админа (правый клик по пункту) — Паша 31.07 */
.admin-ctx {
  position: fixed; z-index: 3000; min-width: 232px; max-width: 300px;
  background: #fff; border: 1px solid #e3e7f2; border-radius: 12px;
  box-shadow: 0 12px 34px rgba(20,28,60,.20); padding: 6px; overflow: hidden;
}
.admin-ctx-head {
  font-size: 11px; font-weight: 700; color: #6b7280; text-transform: uppercase;
  letter-spacing: .04em; padding: 6px 10px 8px; border-bottom: 1px solid #f0f2f8; margin-bottom: 4px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.admin-ctx-item {
  display: flex; align-items: flex-start; gap: 9px; width: 100%; text-align: left;
  background: none; border: none; cursor: pointer; padding: 8px 10px; border-radius: 8px;
  font: inherit; color: #1f2330; min-height: 36px;
}
.admin-ctx-item:hover { background: #eef1ff; }
.admin-ctx-ico { flex: 0 0 auto; font-size: 14px; line-height: 1.35; }
.admin-ctx-text { display: block; font-size: 13px; font-weight: 600; }
.admin-ctx-hint { display: block; font-size: 11px; color: #6b7280; margin-top: 2px; line-height: 1.35; }
.admin-ctx-sep { height: 1px; background: #f0f2f8; margin: 4px 2px; }
.menu-restore {
  margin-left: auto; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 7px; font-size: 14px; font-weight: 800; cursor: pointer;
  color: #2f9e44; background: rgba(47,158,68,.16); border: 1px solid rgba(47,158,68,.35);
}
.menu-restore:hover { background: #2f9e44; color: #fff; }
body.admin-mode .top-nav .tasks-btn.nav-draggable { cursor: grab; }

/* ═══ Стиль Битрикса: Задачи и Уведомления ═══ */
.bx-head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.bx-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.bx-fchip { border: 1px solid var(--border, #dee2e6); background: var(--card, #fff); color: var(--fg, #212529); border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 600; cursor: pointer; }
.bx-fchip:hover { border-color: var(--accent, #4c6ef5); }
.bx-fchip.active { background: var(--accent, #4c6ef5); color: #fff; border-color: var(--accent, #4c6ef5); }
.bx-fchip.f-late.active { background: #e03131; border-color: #e03131; }
.bx-fchip.f-today.active { background: #e8a13a; border-color: #e8a13a; }
.bx-fchip b { font-weight: 800; }
/* Онбординг первого входа */
#onboard-overlay { position: fixed; inset: 0; background: rgba(16,20,38,.55); z-index: 11000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.onb-card { background: #fff; border-radius: 16px; max-width: 440px; width: 100%; padding: 26px 26px 20px; text-align: center; box-shadow: 0 24px 70px rgba(0,0,0,.35); }
.onb-icon { font-size: 42px; margin-bottom: 8px; }
.onb-title { font-size: 18px; font-weight: 800; color: #1f2540; margin-bottom: 8px; }
.onb-text { font-size: 13.5px; line-height: 1.55; color: #4a5065; }
.onb-dots { margin: 16px 0 12px; }
.onb-dots i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #d9dcea; margin: 0 3px; }
.onb-dots i.on { background: #4c6ef5; }
.onb-actions { display: flex; justify-content: space-between; gap: 10px; }
.onb-skip { border: none; background: none; color: #8a90a6; font-size: 13px; cursor: pointer; }
.onb-next { border: none; background: #4c6ef5; color: #fff; border-radius: 10px; padding: 10px 18px; font-weight: 700; cursor: pointer; }
.onb-next:hover { background: #3a55c9; }
/* Светофор надёжности фабрики + сводка фабрики */
.frel { display: inline-block; border-radius: 999px; padding: 2px 10px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.frel-ok { background: #e6f7eb; color: #2f7a2f; }
.frel-warn { background: #fff8e1; color: #b8860b; }
.frel-bad { background: #ffe9e9; color: #c92a2a; }
.frel-none { background: #f1f3f9; color: #8a90a6; }
.fac-sum-modal { max-width: 720px; }
.fac-sum-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 14px 0; }
.fac-sum-tile { background: #f6f7fb; border-radius: 12px; padding: 12px; text-align: center; }
.fac-sum-tile b { display: block; font-size: 22px; }
.fac-sum-tile span { font-size: 11px; color: #6b7280; }
.fac-sum-tile.fac-sum-bad { background: #ffe9e9; } .fac-sum-tile.fac-sum-bad b { color: #c92a2a; }
.fac-sum-tile.fac-sum-warn { background: #fff8e1; } .fac-sum-tile.fac-sum-warn b { color: #b8860b; }
.fac-sum-row { margin: 6px 0; font-size: 13px; color: #2a2f45; }
.fac-sum-h { margin: 14px 0 6px; font-size: 14px; }
.fac-sum-stage { margin: 4px 0; font-size: 12px; }
.fac-sum-stname { font-weight: 700; color: #5e6275; margin-right: 6px; }
.fac-sum-art { border: 1px solid #dbe0ef; background: #fff; border-radius: 999px; padding: 2px 9px; margin: 2px 2px; font-size: 12px; cursor: pointer; }
.fac-sum-art:hover { border-color: #4c6ef5; color: #3a55c9; }
.fac-sum-resch { font-size: 12px; color: #5e6275; margin: 3px 0; }
/* Вид «Список» на доске (как в Битриксе) */
.board-layout-btn { border: 1px solid #dee2e6; background: #fff; color: #212529; border-radius: 999px; padding: 6px 14px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.board-layout-btn:hover { border-color: #4c6ef5; color: #3a55c9; }
.blist-wrap { overflow-x: auto; padding: 4px 2px 24px; }
.blist { width: 100%; border-collapse: collapse; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.05); font-size: 13px; }
.blist th { text-align: left; padding: 10px 12px; background: #f6f7fb; color: #5e6275; font-size: 12px; position: sticky; top: 0; }
.blist td { padding: 8px 12px; border-top: 1px solid #f0f1f6; vertical-align: middle; }
.blist-stage-row td { background: #eef1fb; font-weight: 700; color: #2a2f45; font-size: 13px; }
.blist-stage-n { display: inline-block; background: #4c6ef5; color: #fff; border-radius: 999px; padding: 1px 8px; font-size: 11px; margin-left: 6px; }
.blist-row { cursor: pointer; }
.blist-row:hover td { background: #f6f8ff; }
.blist-row.blist-new td { background: #f2fbf4; }
.blist-row.kanban-hidden { display: none; }
.blist-td-photo img { width: 42px; height: 42px; object-fit: cover; border-radius: 8px; display: block; cursor: zoom-in; }
.blist-td-name { font-weight: 700; white-space: nowrap; }
.blist-late { color: #c92a2a; font-weight: 700; }
.blist-today { color: #b8860b; font-weight: 700; }
.blist-pct { background: #f1f3f9; border-radius: 999px; padding: 2px 9px; font-weight: 700; font-size: 12px; }
.blist-pct.ok { background: #e6f7eb; color: #2f7a2f; }
/* «Взять в работу» */
.wip-btn { border: 1px solid #b9c6f5; background: #f3f6ff; color: #3a55c9; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.wip-btn:hover { background: #e7edff; }
.wip-btn.wip-off { border-color: #e3c1c1; background: #fff5f5; color: #b04444; }
.wip-chip { display: inline-block; background: #fff4e6; color: #d9480f; border: 1px solid #ffd8a8; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.wip-chip.wip-mine { background: #eefaf0; color: #2f7a2f; border-color: #b2dfb2; }
.cond-wip-row { margin: 4px 0 0 26px; }
.bx-task-wip { margin-top: 4px; }
/* Комментарии карточки */
.cmt-input-row { display: flex; gap: 10px; align-items: flex-start; margin: 8px 0 16px; }
.cmt-textarea { flex: 1; min-height: 64px; padding: 10px 12px; border: 1px solid #dee2e6; border-radius: 10px; font: inherit; font-size: 13px; resize: vertical; }
.cmt-textarea:focus { outline: none; border-color: #4c6ef5; }
.cmt-send-btn { padding: 10px 18px; border: none; border-radius: 10px; background: #4c6ef5; color: #fff; font-weight: 600; cursor: pointer; }
.cmt-send-btn:hover { background: #3a55c9; }
.cmt-list { display: flex; flex-direction: column; gap: 10px; }
.cmt-item { border: 1px solid #e9ecef; border-radius: 10px; padding: 10px 14px; background: #fff; }
.cmt-head { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.cmt-ts { font-size: 11px; color: #8a90a6; margin-left: auto; }
.cmt-body { font-size: 13px; line-height: 1.5; color: #2a2f45; white-space: normal; }
/* Таймлайн «время на стадиях» */
.stl-title { font-weight: 700; font-size: 13px; margin: 10px 0 6px; }
.stl-rows { display: flex; flex-direction: column; gap: 3px; margin-bottom: 14px; }
.stl-row { display: grid; grid-template-columns: minmax(160px, 240px) 1fr 52px; gap: 8px; align-items: center; font-size: 12px; }
.stl-name { color: #5e6275; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stl-current .stl-name { color: #1f2540; font-weight: 700; }
.stl-bar-wrap { background: #f1f3f9; border-radius: 6px; height: 10px; overflow: hidden; }
.stl-bar { height: 100%; background: #4c6ef5; border-radius: 6px; }
.stl-current .stl-bar { background: #2f9e44; }
.stl-days { text-align: right; font-weight: 700; color: #2a2f45; }
/* Панель поиска и срочности в «Мои задачи» (Паша 28.07) */
.bx-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 8px 0; }
.bx-search {
  min-width: 260px; flex: 1 1 260px; padding: 7px 12px; font-size: 13px;
  border: 1px solid var(--border, #dee2e6); border-radius: 999px; background: var(--card, #fff); color: var(--fg, #212529);
}
.bx-search:focus { outline: none; border-color: var(--accent, #4c6ef5); }
.bx-found { font-size: 12px; color: #8a90a6; white-space: nowrap; }
/* Новые (поступившие) задачи — заметная подсветка, чтобы сразу видеть, что пришло */
.bx-fchip.f-new { border-color: #2f9e44; color: #2f9e44; }
.bx-fchip.f-new.active { background: #2f9e44; border-color: #2f9e44; color: #fff; }
.bx-seen-btn { margin-left: auto; color: #6b7280; }
.bx-task.bx-task-new { background: #f2fbf4; border-color: #a9dfb8; }
.bx-new-badge {
  display: inline-block; background: #2f9e44; color: #fff; border-radius: 20px;
  padding: 1px 8px; font-size: 11px; font-weight: 700; margin-right: 4px; vertical-align: middle;
}
/* Сотрудник без своих стадий на доске */
.board-no-stages { margin: 24px auto; max-width: 520px; text-align: center; padding: 28px 24px; border: 1px dashed #c7c9d6; border-radius: 12px; background: #fafbff; }
.board-no-stages .bns-title { font-weight: 700; font-size: 16px; color: #2a2f45; margin-bottom: 6px; }
.board-no-stages .bns-sub { font-size: 13px; color: #6b7280; line-height: 1.5; }
/* Очередь по норме выработки: индикатор перегруза стадии и «+N дн ожидания» на карточке */
.stage-overload { background: #fff4e6; color: #d9480f; border: 1px solid #ffd8a8; border-radius: 20px; padding: 1px 7px; font-size: 11px; font-weight: 700; margin-left: 4px; white-space: nowrap; }
.ts-queue { opacity: .75; font-weight: 700; margin-left: 2px; }
/* Карточка на КАНБАНЕ, по которой сотруднику поступила новая задача */
.card.card-has-new { background: #f2fbf4; border-color: #74c98b !important; box-shadow: 0 0 0 2px rgba(47,158,68,.18); }
.card-new-task-badge { background: #2f9e44 !important; color: #fff !important; font-weight: 700 !important; }
/* Красная точка на счётчике «Задачи», если есть поступившие */
.tasks-count.has-new { position: relative; }
.tasks-count.has-new::after {
  content: ''; position: absolute; top: -3px; right: -3px; width: 8px; height: 8px;
  background: #e03131; border-radius: 50%; border: 1.5px solid #fff;
}

.bx-list { display: flex; flex-direction: column; gap: 10px; }
.bx-task { display: flex; align-items: stretch; background: var(--card, #fff); border: 1px solid var(--border, #e9ecef); border-radius: 10px; overflow: hidden; cursor: pointer; transition: box-shadow .15s ease, transform .1s ease; }
.bx-task:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); transform: translateY(-1px); }
.bx-task-pri { width: 4px; flex: 0 0 4px; background: #adb5bd; }
.bx-task.pri-hi .bx-task-pri { background: #e03131; }
.bx-task.pri-mid .bx-task-pri { background: #e8a13a; }
.bx-task.pri-lo .bx-task-pri { background: #4c6ef5; }
.bx-task-body { flex: 1 1 auto; padding: 12px 14px; min-width: 0; }
.bx-task-title { font-weight: 700; font-size: 14.5px; color: var(--fg, #212529); margin-bottom: 6px; line-height: 1.35; }
.bx-task-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bx-chip.stage { background: var(--chip-bg, #f1f3f5); color: var(--chip-fg, #495057); font-size: 11.5px; font-weight: 600; border-radius: 6px; padding: 2px 9px; }
.bx-task-art { font-size: 12.5px; color: var(--muted, #868e96); font-weight: 600; }
/* Схлопывание задач по карточке (30.07): когда на карточке несколько пунктов стадии —
   строка одна, пункты списком внутри неё. Раньше каждый пункт был отдельной строкой
   (у переводчика это давало 100 строк на 25 карточек). */
.bx-task-cnt { font-size: 12px; color: #5f3dc4; background: #f3f0ff; border-radius: 8px; padding: 1px 7px; font-weight: 600; }
.bx-task-items { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.bx-task-item { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: #1f2330; }
.bx-task-item::before { content: '•'; color: #adb5bd; }
.bx-item-label { flex: 1 1 auto; min-width: 0; }
.bx-item-new { color: #e8590c; font-size: 11px; }
.bx-task-aside { display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 7px; padding: 12px 14px; flex: 0 0 auto; }
.bx-due { font-size: 12px; font-weight: 700; color: var(--muted, #868e96); white-space: nowrap; }
.bx-due-late { color: #e03131; }
.bx-due-today { color: #d9860a; }
.bx-due-none { color: #adb5bd; font-weight: 600; }
.bx-task-resp .empchip { font-size: 12px; }
.bx-empty { text-align: center; color: var(--muted, #868e96); padding: 44px 20px; font-size: 15px; }

.bx-clear-btn { border: 1px solid var(--border, #dee2e6); background: var(--card, #fff); color: var(--muted, #868e96); border-radius: 8px; padding: 6px 12px; font-size: 12.5px; font-weight: 600; cursor: pointer; margin-left: auto; }
.bx-clear-btn:hover { color: #e03131; border-color: #e03131; }
.bx-feed { display: flex; flex-direction: column; gap: 18px; }
.bx-feed-date { font-size: 12px; font-weight: 800; color: var(--muted, #868e96); text-transform: uppercase; letter-spacing: .4px; margin-bottom: 8px; }
.bx-notif { display: flex; align-items: flex-start; gap: 12px; background: var(--card, #fff); border: 1px solid var(--border, #e9ecef); border-radius: 10px; padding: 12px 14px; margin-bottom: 8px; cursor: pointer; transition: box-shadow .15s ease; }
.bx-notif:hover { box-shadow: 0 3px 12px rgba(0,0,0,.07); }
.bx-notif:hover .bx-notif-del { opacity: 1; }
.bx-notif.alarm { border-color: rgba(224,49,49,.4); background: rgba(224,49,49,.04); }
.bx-notif-ico { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 16px; background: var(--accent-soft, #eef1ff); }
.bx-notif-ico.alarm { background: rgba(224,49,49,.14); }
.bx-notif-body { flex: 1 1 auto; min-width: 0; }
.bx-notif-msg { font-size: 14px; color: var(--fg, #212529); line-height: 1.4; }
.bx-notif-meta { margin-top: 4px; font-size: 12px; color: var(--muted, #868e96); }
.bx-notif-art { font-weight: 700; color: var(--accent, #4c6ef5); }
.bx-notif-del { flex: 0 0 auto; opacity: 0; border: none; background: transparent; color: var(--muted, #adb5bd); cursor: pointer; font-size: 15px; padding: 2px 6px; border-radius: 6px; transition: opacity .15s ease; }
.bx-notif-del:hover { color: #e03131; background: rgba(224,49,49,.1); }

/* Присутствие сотрудников (онлайн/офлайн) — только у админа */
.emp-ros-nameline { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.emp-status { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.emp-status.online { color: #2f9e44; }
.emp-status.offline { color: #adb5bd; }
.emp-dot { width: 9px; height: 9px; border-radius: 50%; flex: 0 0 auto; background: #e03131; }
.emp-status.online .emp-dot, .emp-dot.online { background: #37b24d; box-shadow: 0 0 0 3px rgba(55,178,77,.2); animation: empPulse 2s ease-in-out infinite; }
.emp-status.offline .emp-dot { background: #e03131; }
@keyframes empPulse { 0%,100% { box-shadow: 0 0 0 2px rgba(55,178,77,.25); } 50% { box-shadow: 0 0 0 5px rgba(55,178,77,.08); } }
@media (prefers-reduced-motion: reduce) { .emp-status.online .emp-dot, .emp-dot.online { animation: none; } }
.emp-activity { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; background: rgba(55,178,77,.1); color: #2b8a3e; font-weight: 800; font-size: 13px; border-radius: 999px; padding: 6px 14px; }
.emp-activity b { font-size: 15px; }
.emp-activity-sub { font-weight: 600; font-size: 11.5px; color: #51915f; }

/* Карточка со всеми выполненными пунктами стадии — зелёный контур + бейдж (на всех стадиях) */
.card.card-done { outline: 2px solid #2f9e44; outline-offset: -1px; box-shadow: 0 0 0 3px rgba(47,158,68,.18), 0 5px 16px rgba(47,158,68,.14); }
.card-done-badge { background: rgba(47,158,68,.14) !important; color: #2b8a3e !important; border: 1px solid rgba(47,158,68,.4) !important; font-weight: 700; }

/* Режим администратора — яркий переливающийся контур, бегущий по периметру (как Claude-in-Chrome) */
@property --admin-angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
body.admin-mode::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9998; border-radius: 5px;
  padding: 4px;                                   /* толщина «кольца» */
  background: conic-gradient(from var(--admin-angle),
    #2f6dff, #22d3ee, #38bdf8, #60a5fa, #a855f7, #6366f1, #2f6dff);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;   /* показываем только рамку-кольцо */
  filter: drop-shadow(0 0 7px rgba(47,109,255,.55)) drop-shadow(0 0 3px rgba(56,189,248,.5));
  animation: adminRingSpin 4s linear infinite, adminRingPulse 2.4s ease-in-out infinite;
}
@keyframes adminRingSpin { to { --admin-angle: 360deg; } }
@keyframes adminRingPulse { 0%,100% { opacity: .85; } 50% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { body.admin-mode::after { animation: none; opacity: .95; } }

/* Полноэкранный лоадер загрузки данных */
#app-loader { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center;
  background: rgba(15,20,35,.72); backdrop-filter: blur(3px); transition: opacity .3s ease; }
#app-loader.hide { opacity: 0; }
.app-loader-box { display: flex; flex-direction: column; align-items: center; gap: 14px; color: #eef4ff; font-weight: 600; font-size: 14px; }
.app-loader-spin { width: 42px; height: 42px; border-radius: 50%; border: 4px solid rgba(120,160,255,.25); border-top-color: #4c6ef5; animation: appSpin .8s linear infinite; }
@keyframes appSpin { to { transform: rotate(360deg); } }

/* ═══ Адаптив: на узких экранах сайдбар — off-canvas, контент на всю ширину ═══ */
.mobile-nav-toggle, .mobile-nav-backdrop { display: none; }
@media (max-width: 820px) {
  .topbar { width: min(284px, 86vw); transform: translateX(-100%); transition: transform .25s ease; box-shadow: 5px 0 28px rgba(0,0,0,.32); }
  body.nav-open .topbar { transform: translateX(0); }
  .page-section { margin-left: 0 !important; }
  .mobile-nav-toggle {
    display: flex; position: fixed; top: 10px; left: 10px; z-index: 80; width: 44px; height: 44px;
    align-items: center; justify-content: center; font-size: 21px; border: none; border-radius: 11px;
    background: linear-gradient(135deg, #1746e0, #2f6dff); color: #fff; box-shadow: 0 3px 12px rgba(0,0,0,.28); cursor: pointer;
  }
  body.nav-open .mobile-nav-backdrop { display: block; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 59; }
  .home-content { padding-top: 62px; }
  /* таблицы и доска — горизонтальный скролл, не ломают ширину */
  .od-table-wrap, .table-scroll, #board-container { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .od-kpi-row { gap: 8px; }
  .od-kpi-card { min-width: 140px; }
}
@media (max-width: 520px) {
  .od-kpi-row { flex-wrap: wrap; }
  .bx-task { flex-direction: column; }
  .bx-task-aside { align-items: flex-start; border-top: 1px solid var(--border, #eee); }
}
/* ═══════════════════════════════════════════════════════════════════════════
   ДОРАБОТКИ P1 (Паша, 30.07): «Что делать сейчас», затор, свежесть данных,
   группы меню, липкий футер модалки, мобильные тап-таргеты.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── п.6: свежесть данных 1С в шапке — постоянно, а не только при аварии ── */
.data-fresh {
  display: flex; align-items: center; gap: 7px; width: 100%;
  background: rgba(255,255,255,.05); border: 1px solid #262b45; border-radius: 9px;
  padding: 7px 10px; margin-bottom: 4px; cursor: pointer; text-align: left;
  color: #aab0c6; font-size: 12px; font-weight: 600; line-height: 1.2;
  transition: background .15s ease, border-color .15s ease;
}
.data-fresh:hover { background: rgba(255,255,255,.1); border-color: #37406b; color: #dfe3f2; }
.data-fresh .df-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; background: #37b24d; box-shadow: 0 0 0 3px rgba(55,178,77,.18); }
.data-fresh.is-stale { color: #ffc9c9; border-color: #7b2d2d; background: rgba(224,49,49,.14); }
.data-fresh.is-stale .df-dot { background: #ff6b6b; box-shadow: 0 0 0 3px rgba(255,107,107,.2); }
.data-fresh .df-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ── п.9: группы разделов в левом меню ── */
.nav-group-t {
  font-size: 10.5px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase;
  color: #6a7193; padding: 12px 8px 3px; user-select: none;
}
.nav-group-t.hidden { display: none; }
.top-nav .nav-group-t:first-child { padding-top: 2px; }

/* ── п.5: блок «Что делать сейчас» — первый на главной ── */
.hd-now { margin-bottom: 16px; }
.hd-now-head { font-size: 15px; font-weight: 800; color: #2b2f42; margin-bottom: 10px; }
.hd-now-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.hd-now-card {
  display: flex; flex-direction: column; gap: 6px;
  background: #fff; border: 1px solid #e6e9f4; border-left: 4px solid #adb5bd;
  border-radius: 12px; padding: 14px 15px; box-shadow: 0 2px 10px rgba(20,30,60,.05);
}
.hd-now-bad  { border-left-color: #e03131; background: #fff8f8; }
.hd-now-warn { border-left-color: #e8a90a; background: #fffdf5; }
.hd-now-info { border-left-color: #4c6ef5; background: #f8faff; }
.hd-now-title { font-size: 14px; font-weight: 800; color: #2b3240; line-height: 1.3; }
.hd-now-sub { font-size: 12px; color: #6b7089; line-height: 1.45; flex: 1; }
.hd-now-btn {
  align-self: flex-start; margin-top: 4px; min-height: 38px;
  background: #4c6ef5; color: #fff; border: none; border-radius: 9px;
  padding: 9px 16px; font-size: 13px; font-weight: 700; cursor: pointer;
  box-shadow: 0 3px 9px rgba(76,110,245,.28); transition: background .15s ease;
}
.hd-now-btn:hover { background: #3b5fe0; }
.hd-now-bad .hd-now-btn { background: #e03131; box-shadow: 0 3px 9px rgba(224,49,49,.28); }
.hd-now-bad .hd-now-btn:hover { background: #c92a2a; }
.hd-now-ok {
  background: #ebfbee; border: 1px solid #c3ebca; border-radius: 12px;
  padding: 16px; font-size: 14px; font-weight: 700; color: #2b8a3e;
}

/* ── п.7: затор — красный блок с кнопкой «Разобрать», а не строка 27 px ── */
.hd-jam {
  display: flex; align-items: center; gap: 14px; margin-bottom: 16px;
  background: linear-gradient(135deg, #fff1f0, #ffe3e0);
  border: 1.5px solid #ffb3ad; border-left: 6px solid #e03131;
  border-radius: 12px; padding: 15px 18px; box-shadow: 0 3px 14px rgba(224,49,49,.13);
}
.hd-jam-ico { font-size: 26px; line-height: 1; flex: 0 0 auto; }
.hd-jam-body { flex: 1; min-width: 0; }
.hd-jam-title { font-size: 16px; font-weight: 800; color: #b02020; line-height: 1.3; }
.hd-jam-sub { font-size: 12.5px; color: #8a4a45; margin-top: 4px; line-height: 1.45; }
.hd-jam-btn {
  flex: 0 0 auto; min-height: 44px; background: #e03131; color: #fff; border: none;
  border-radius: 10px; padding: 12px 20px; font-size: 14px; font-weight: 800; cursor: pointer;
  box-shadow: 0 3px 10px rgba(224,49,49,.32); transition: background .15s ease;
}
.hd-jam-btn:hover { background: #c92a2a; }

/* Подсветка колонки, на которую увела кнопка «Разобрать» / клик по стадии */
.stage-column-focus { outline: 3px solid #4c6ef5; outline-offset: 2px; border-radius: 12px; animation: stageFocusPulse 1.2s ease-in-out 2; }
@keyframes stageFocusPulse { 0%,100% { outline-color: rgba(76,110,245,.9); } 50% { outline-color: rgba(76,110,245,.25); } }
@media (prefers-reduced-motion: reduce) { .stage-column-focus { animation: none; } }

/* ── п.8: липкий футер модалки карточки ── */
#card-modal #modal-main-view .modal-actions,
#card-modal #modal-dates-view .modal-actions,
#card-modal #modal-utp-view .modal-actions {
  position: sticky; bottom: 0; z-index: 6;
  background: #fff; border-top: 1px solid #e9ecef;
  margin-left: -28px; margin-right: -28px; margin-bottom: -28px;
  padding: 14px 28px; box-shadow: 0 -8px 18px rgba(15,23,42,.07);
}
#card-modal #modal-main-view .modal-actions button { min-height: 44px; }

/* ── п.10: мобильные тап-таргеты 44 px и минимальный кегль 12 px ── */
@media (max-width: 820px) {
  .hd-stage-row, .hd-attn-row, .hd-per-row, .hd-fac-row, .hd-shift-item,
  button.hd-fig-bar, .hd-fig, .hd-now-btn, .modal-actions button, .pc-vtab, .smp-tab {
    min-height: 44px;
  }
  .hd-stage-row { padding: 9px 10px; }
  .hd-per-row, .hd-fac-row { padding: 8px 8px; }
  button.hd-fig-bar { padding: 8px 6px; }
  .hd-shift-item { padding: 8px 4px; }
  .hd-now-btn { padding: 12px 18px; }
  /* минимальный читаемый кегль на телефоне */
  .hd-stage-name, .hd-stage-count, .hd-attn-stage, .hd-attn-resp, .hd-attn-late,
  .hd-per-name, .hd-per-days, .hd-fac-code, .hd-fac-num, .hd-fac-sub,
  .hd-shift-art, .hd-shift-brand, .hd-shift-dates, .hd-shift-days,
  .hd-fig-lbl, .hd-fig-bar-lbl, .hd-fig-bar-n, .hd-fig-panel-hint,
  .hd-kpi-lbl, .hd-kpi-sub, .hd-sub, .hd-panel-sub, .hd-now-sub, .hd-jam-sub,
  .hd-src, .emp-activity-sub, .bx-notif-time, .articles-source-note {
    font-size: 12px !important;
  }
  .hd-fig-bar-lbl { flex-basis: 46%; }
}
