/* ═══════════════════════════════════════════════════════════════
   ФИРМЕННАЯ ТЕМА DIWAN — одна на весь портал.  v4
   Кладётся ПОВЕРХ board.css и Tailwind. Разметка не тронута.
   Снять целиком = убрать <link> из шаблонов.
   ═══════════════════════════════════════════════════════════════ */
:root{
  --d-bg:#0f172a; --d-bg-dno:#0a0f1c; --d-bg-verh:#1e293b;
  --d-panel:rgba(15,23,42,.72); --d-panel2:rgba(2,6,23,.5); --d-karta:rgba(30,41,59,.62);
  --d-line:rgba(148,163,184,.16);
  --d-txt:#e2e8f0; --d-dim:#94a3b8;
  --d-akcent:#dc2626;
}

/* ─── ФОН ─── */
html, body{
  background: radial-gradient(1200px 700px at 20% 15%, var(--d-bg-verh) 0%, var(--d-bg) 45%, var(--d-bg-dno) 100%) no-repeat fixed !important;
  background-color: var(--d-bg) !important; color: var(--d-txt) !important;
}

/* ─── КАРКАС ДОСКИ (их классы) ─── */
.main-container, .mode-switcher, .nav-layers, .gantt-wrapper{
  background: transparent !important; color: var(--d-txt) !important;
}
.mode-switcher, .nav-layers{ border-bottom: 1px solid var(--d-line) !important; }
.header-logo h1{ color: #fff !important; }
.settings-trigger, .logout-trigger{ color: var(--d-dim) !important; }
.settings-trigger:hover, .logout-trigger:hover{ color: #fff !important; background: rgba(148,163,184,.12) !important; }
.search-input{
  background: rgba(2,6,23,.6) !important; border-color: var(--d-line) !important; color: #f1f5f9 !important;
}
.search-input::placeholder{ color:#64748b !important; }
.search-wrapper i{ color: var(--d-dim) !important; }
.user-badge{ border-color: var(--d-line) !important; }

/* ─── ВКЛАДКИ И РЕЖИМЫ ─── */
.mode-btn, .scope-btn, .type-btn, .view-tab{ color: var(--d-dim) !important; }
.mode-btn:hover, .scope-btn:hover, .type-btn:hover, .view-tab:hover{ color:#fff !important; background: rgba(148,163,184,.10) !important; }
.scope-btn.active{ background: rgba(220,38,38,.85) !important; color:#fff !important; }
.type-btn.active{ background: rgba(51,65,85,.8) !important; color:#fff !important; }
.view-tab.active{ background: rgba(37,99,235,.22) !important; color:#93c5fd !important; }

/* ─── КАНБАН ─── */
.kanban-col{
  background-color: var(--d-panel) !important; border-color: var(--d-line) !important;
  backdrop-filter: blur(8px);
}
.col-header{ border-bottom-color: var(--d-line) !important; color: var(--d-txt) !important; }
.col-count{ color: #fff !important; }
.kanban-card{
  background: var(--d-karta) !important; border: 1px solid var(--d-line) !important;
  color: var(--d-txt) !important; box-shadow: 0 8px 24px rgba(0,0,0,.35) !important;
}
.kanban-card:hover{ border-color: rgba(220,38,38,.45) !important; background: rgba(30,41,59,.85) !important; }
.task-title{ color: var(--d-txt) !important; }
.task-code{ color: var(--d-dim) !important; }

/* ─── ЧАТ ─── */
.chat-container{ background: var(--d-panel2) !important; border-color: var(--d-line) !important; }
.chat-input-area{ background: rgba(2,6,23,.55) !important; border-top-color: var(--d-line) !important; }
.chat-input{ background: rgba(2,6,23,.6) !important; border-color: var(--d-line) !important; color:#f1f5f9 !important; }
.chat-input:focus{ border-color: var(--d-akcent) !important; }
.msg-bubble.theirs, .wolf-msg.theirs{
  background: var(--d-karta) !important; color: var(--d-txt) !important; border-color: var(--d-line) !important;
}
.msg-bubble.theirs .msg-header, .wolf-msg.theirs .wolf-head{
  color: var(--d-dim) !important; border-bottom-color: var(--d-line) !important;
}
/* «моё» сообщение — синее, как было: это язык переписки, не трогаем */

/* ─── НАСТРОЙКИ ─── */
.settings-card, .settings-item{
  background: var(--d-panel) !important; border-color: var(--d-line) !important; color: var(--d-txt) !important;
}
.settings-card:hover, .settings-item:hover{ background: rgba(30,41,59,.8) !important; border-color: rgba(220,38,38,.45) !important; }
.settings-card .desc{ color: var(--d-dim) !important; }
.settings-input-inline{ color: var(--d-txt) !important; }
.settings-input-inline:focus{ background: rgba(2,6,23,.6) !important; }
.color-picker-trigger{ border-color: var(--d-line) !important; }

/* ─── ГАНТ ─── */
.gantt_container{ background: transparent !important; border-color: var(--d-line) !important; }
.gantt_grid_head_cell{ background: rgba(2,6,23,.5) !important; color: var(--d-dim) !important; border-color: var(--d-line) !important; }
.gantt_grid_data .gantt_cell{ color: var(--d-txt) !important; border-color: var(--d-line) !important; }
.gantt_grid_data .gantt_row, .gantt_task .gantt_task_row{ background: transparent !important; border-color: var(--d-line) !important; }
.gantt_grid_data .gantt_row.odd, .gantt_task .gantt_task_row.odd{ background: rgba(255,255,255,.03) !important; }
.gantt_grid_data .gantt_row:hover, .gantt_task .gantt_task_row:hover{ background: rgba(220,38,38,.10) !important; }
.gantt_scale_line{ background: rgba(2,6,23,.5) !important; border-color: var(--d-line) !important; }
.gantt_scale_cell{ color: var(--d-dim) !important; border-color: var(--d-line) !important; }
.gantt-toggle-grid{ background: rgba(2,6,23,.6) !important; border-color: var(--d-line) !important; color: var(--d-dim) !important; }
.gantt-toggle-grid:hover{ background: rgba(51,65,85,.8) !important; color:#fff !important; }
.gantt_task_line .gantt_task_progress{ background: rgba(0,0,0,.28) !important; }

/* ─── TAILWIND-УТИЛИТЫ ─── */
.bg-white{ background-color: var(--d-panel) !important; backdrop-filter: blur(10px); }
.bg-slate-50{ background-color: var(--d-panel2) !important; }
.bg-slate-100{ background-color: rgba(30,41,59,.6) !important; }
.bg-slate-200{ background-color: rgba(51,65,85,.7) !important; }
.hover\:bg-slate-50:hover{ background-color: rgba(51,65,85,.55) !important; }
.hover\:bg-slate-100:hover{ background-color: rgba(51,65,85,.7) !important; }
.hover\:bg-white:hover{ background-color: rgba(30,41,59,.8) !important; }
.border-slate-100,.border-slate-200,.border-slate-300{ border-color: var(--d-line) !important; }
.divide-slate-100>*+*,.divide-slate-200>*+*{ border-color: var(--d-line) !important; }
.text-slate-900,.text-slate-800,.text-slate-700{ color: var(--d-txt) !important; }
.text-slate-600,.text-slate-500{ color: var(--d-dim) !important; }
.text-slate-400,.text-slate-300{ color:#8896aa !important; }

/* ─── ПОЛЯ ВВОДА ─── */
input:not([type=checkbox]):not([type=radio]):not([type=color]):not(.settings-input-inline), textarea, select{
  background: rgba(2,6,23,.6) !important; border-color: var(--d-line) !important; color:#f1f5f9 !important;
}
input::placeholder, textarea::placeholder{ color:#64748b !important; }
input:focus, textarea:focus, select:focus{
  border-color: var(--d-akcent) !important; box-shadow: 0 0 0 1px rgba(220,38,38,.4) !important;
}

/* ─── ТЕНИ И ПРОКРУТКА ─── */
.shadow,.shadow-sm,.shadow-md,.shadow-lg,.shadow-xl{ box-shadow: 0 12px 34px rgba(0,0,0,.45) !important; }
*::-webkit-scrollbar{ width:10px; height:10px; }
*::-webkit-scrollbar-track{ background: rgba(2,6,23,.4); }
*::-webkit-scrollbar-thumb{ background: rgba(148,163,184,.28); border-radius:6px; }
*::-webkit-scrollbar-thumb:hover{ background: rgba(220,38,38,.5); }
table th{ color: var(--d-dim) !important; }
table td, table th{ border-color: var(--d-line) !important; }

/* ═══ СТРАНИЦА ВХОДА ═══ */
.glass-panel{
  position:relative; background: var(--d-panel) !important; backdrop-filter: blur(14px) !important;
  border:1px solid var(--d-line) !important; box-shadow: 0 24px 60px rgba(0,0,0,.55) !important;
}
.glass-panel h1{ background:none !important; -webkit-text-fill-color:#fff !important; color:#fff !important; letter-spacing:-.02em; }
.glass-panel h1::after{ content:"."; color: var(--d-akcent); -webkit-text-fill-color: var(--d-akcent); }
.glass-panel label{ color: var(--d-dim) !important; }
.glass-panel button[type=submit]{
  background: linear-gradient(180deg,#1e293b,#0f172a) !important;
  border:1px solid rgba(220,38,38,.55) !important; color:#fff !important;
  box-shadow: 0 10px 30px rgba(220,38,38,.18) !important;
}
.glass-panel button[type=submit]:hover{ border-color: var(--d-akcent) !important; box-shadow: 0 12px 34px rgba(220,38,38,.32) !important; }

/* ─── ЦВЕТНЫЕ ПЛАШКИ: приглушены под тёмное, смысл цвета сохранён ─── */
.bg-blue-50,.bg-blue-100{ background-color: rgba(59,130,246,.14) !important; }
.bg-emerald-50,.bg-emerald-100,.bg-green-50,.bg-green-100{ background-color: rgba(16,185,129,.14) !important; }
.bg-amber-50,.bg-amber-100,.bg-yellow-50{ background-color: rgba(245,158,11,.14) !important; }
.bg-violet-50,.bg-violet-100,.bg-purple-50{ background-color: rgba(139,92,246,.14) !important; }
.bg-indigo-50,.bg-indigo-100{ background-color: rgba(99,102,241,.14) !important; }
.bg-sky-50,.bg-sky-100{ background-color: rgba(14,165,233,.14) !important; }
.bg-rose-50,.bg-rose-100,.bg-red-50{ background-color: rgba(220,38,38,.14) !important; }

.border-blue-200,.border-blue-100{ border-color: rgba(59,130,246,.32) !important; }
.border-emerald-200,.border-emerald-100,.border-green-200{ border-color: rgba(16,185,129,.32) !important; }
.border-amber-200,.border-amber-100{ border-color: rgba(245,158,11,.32) !important; }
.border-violet-200,.border-purple-200{ border-color: rgba(139,92,246,.32) !important; }
.border-indigo-200{ border-color: rgba(99,102,241,.32) !important; }
.border-rose-200,.border-red-200{ border-color: rgba(220,38,38,.32) !important; }
.border-white,.border-slate-50{ border-color: rgba(148,163,184,.16) !important; }

/* цветной текст — светлее, чтобы читался на тёмном */
.text-blue-600,.text-blue-700,.text-blue-800{ color:#93c5fd !important; }
.text-emerald-600,.text-emerald-700,.text-emerald-800,.text-green-600,.text-green-700{ color:#6ee7b7 !important; }
.text-amber-600,.text-amber-700,.text-amber-800,.text-yellow-600{ color:#fcd34d !important; }
.text-violet-600,.text-violet-700,.text-purple-600{ color:#c4b5fd !important; }
.text-indigo-600,.text-indigo-700{ color:#a5b4fc !important; }
.text-rose-600,.text-rose-700,.text-red-600,.text-red-700{ color:#fca5a5 !important; }

/* ─── ШАПКИ КОЛОНОК И ПРОЧИЕ БЕЛЫЕ ОСТРОВКИ ─── */
.col-header{ background: transparent !important; border-bottom: 1px solid var(--d-line) !important; color: var(--d-txt) !important; }
.col-header b{ color: var(--d-txt) !important; }
.kanban-container{ background: transparent !important; }
.kanban-list{ background: transparent !important; }
[class*="bg-white"], [style*="background:#fff"], [style*="background: #fff"],
[style*="background-color:#fff"], [style*="background-color: #fff"]{
  background-color: var(--d-panel) !important;
}

/* ═══════════════════════════════════════════════════════════════
   ОТДЕЛКА — то, что делает Diwan современным, а не просто тёмным.
   Раскладка НЕ трогается: только глубина, движение и фокус.
   ═══════════════════════════════════════════════════════════════ */

/* ─── всё движется плавно, но не мешает работе ─── */
.kanban-card, .mode-btn, .scope-btn, .type-btn, .view-tab, .action-btn,
.settings-card, .settings-item, .sidebar-btn, .user-badge, .chat-send-btn,
.msg-bubble, .wolf-msg, button, a{
  transition: background-color .18s ease, border-color .18s ease, color .18s ease,
              transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s ease !important;
}
@media (prefers-reduced-motion: reduce){ *{ transition: none !important; animation: none !important; } }

/* ─── ШАПКА: стекло, липнет сверху ─── */
.mode-switcher{
  position: sticky; top: 0; z-index: 40;
  background: rgba(10,15,28,.62) !important;
  backdrop-filter: saturate(140%) blur(14px); -webkit-backdrop-filter: saturate(140%) blur(14px);
  border-bottom: 1px solid var(--d-line) !important;
}
.nav-layers{
  background: rgba(10,15,28,.35) !important;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
/* тонкая фирменная нить под шапкой */
.mode-switcher::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background: linear-gradient(90deg, transparent, rgba(220,38,38,.55) 20%, rgba(59,130,246,.45) 60%, transparent);
}

/* ─── КАРТОЧКИ: живые, с акцентом при наведении ─── */
.kanban-card{ position: relative; overflow: hidden; }
.kanban-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background: linear-gradient(180deg, var(--d-akcent), rgba(220,38,38,0));
  opacity:0; transition: opacity .18s ease;
}
.kanban-card:hover::before{ opacity:1; }
/* прыжка при наведении нет: он уводил значок из-под мыши и гасил подсказку */
.kanban-card:hover{
  box-shadow: 0 16px 40px rgba(0,0,0,.5), 0 0 0 1px rgba(220,38,38,.25) !important;
}
.kanban-card:active{ transform: translateY(0) scale(.995); }


/* ─── КОЛОНКИ: стекло и мягкий край ─── */
.kanban-col{
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.28) !important;
}

/* ─── ВКЛАДКИ: подчёркивание вместо заливки ─── */
.mode-btn, .view-tab, .type-btn{ position: relative; }
.mode-btn::after, .view-tab::after{
  content:""; position:absolute; left:22%; right:22%; bottom:2px; height:2px; border-radius:2px;
  background: var(--d-akcent); transform: scaleX(0); transform-origin:center; transition: transform .2s ease;
}
.mode-btn:hover::after, .view-tab:hover::after{ transform: scaleX(1); }
.mode-btn.active{ box-shadow: 0 6px 18px rgba(0,0,0,.35) !important; }

/* ─── КНОПКИ: мягкое свечение вместо плоской заливки ─── */
.action-btn{ box-shadow: 0 6px 18px rgba(59,130,246,.25) !important; }
.action-btn:hover{ transform: translateY(-1px); box-shadow: 0 10px 26px rgba(59,130,246,.35) !important; }
.action-btn.green:hover{ box-shadow: 0 10px 26px rgba(16,185,129,.35) !important; }
.action-btn.purple:hover{ box-shadow: 0 10px 26px rgba(139,92,246,.35) !important; }
.chat-send-btn:hover{ box-shadow: 0 8px 22px rgba(59,130,246,.4) !important; }

/* ─── БОКОВАЯ ПОЛОСА ─── */
.sidebar-narrow{
  background: linear-gradient(180deg, rgba(2,6,23,.9), rgba(2,6,23,.65)) !important;
  border-right: 1px solid var(--d-line);
}
.sidebar-btn{ position: relative; }
.sidebar-btn.active::before{
  content:""; position:absolute; left:-8px; top:20%; bottom:20%; width:3px; border-radius:3px;
  background: var(--d-akcent);
}

/* ─── ФОКУС С КЛАВИАТУРЫ: видно, но не кричит ─── */
:focus-visible{ outline: 2px solid rgba(220,38,38,.65) !important; outline-offset: 2px !important; }

/* ─── ЧАТ: пузыри с глубиной ─── */
.msg-bubble, .wolf-msg{ box-shadow: 0 6px 18px rgba(0,0,0,.35) !important; }
.msg-bubble.mine, .wolf-msg.mine{ box-shadow: 0 8px 22px rgba(37,99,235,.28) !important; }

/* ─── НАСТРОЙКИ: карточки приподнимаются ─── */
.settings-card:hover, .settings-item:hover{ transform: translateY(-2px); }

/* ─── ВЫДЕЛЕНИЕ ТЕКСТА — фирменное ─── */
::selection{ background: rgba(220,38,38,.35); color:#fff; }

/* ─── ЛОГОТИП: «Diwan.» — как на корневом сайте и на meet ─── */
.header-logo h1.d-logo{
  color:#fff !important; font-weight:900 !important; font-size:22px !important;
  letter-spacing:-.03em !important; line-height:1; display:flex; align-items:baseline; gap:1px;
}
.header-logo h1.d-logo .d-tochka{ color: var(--d-akcent) !important; font-size:1.1em; line-height:0; }
.header-logo{ cursor:pointer; transition: opacity .18s ease; }
.header-logo:hover{ opacity:.85; }
.brand-icon{ display:none !important; }

/* ═══ ТИПОГРАФИКА И ВОЗДУХ — чтобы читалось без напряжения ═══
   База была 11px, метки 8-9px — чужое наследие, где плотность
   важнее человека. Поднимаем бережно, раскладку не ломаем. */
body{
  font-size: 12.5px !important;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv02","cv03","cv04","tnum";
}
/* заголовки задач — главное, что читают */
.task-title{ font-size: 14px !important; line-height: 1.4 !important; letter-spacing: -.005em !important; }
.task-code{ font-size: 10.5px !important; letter-spacing: .01em !important; }
.kanban-badges span{ font-size: 10.5px !important; }
.kanban-badges b{ font-size: 9.5px !important; }

/* навигация — крупнее и с воздухом между буквами */
.mode-btn{ font-size: 10.5px !important; padding: 9px 13px !important; }
.scope-btn, .type-btn, .view-tab{ font-size: 10px !important; }
.col-header b{ font-size: 10px !important; letter-spacing: .12em !important; }
.action-btn{ font-size: 9.5px !important; padding: 7px 14px !important; }

/* карточки: воздух внутри */
.kanban-card{ padding: 12px 13px !important; border-radius: 14px !important; }
.kanban-list{ padding: 10px !important; }
.kanban-container{ gap: 10px !important; padding: 14px !important; }
.col-header{ padding: 12px 10px !important; }

/* чат: сообщения читаемее */
.msg-bubble, .wolf-msg{ font-size: 13px !important; line-height: 1.45 !important; }
.chat-input{ font-size: 13px !important; }

/* цифры в счётчиках выравниваются в столбик */
.col-count, .kanban-badges b, .msg-date{ font-variant-numeric: tabular-nums; }

/* поиск и поля — не мельче 12px, иначе телефон зумит при вводе */
.search-input, input, textarea, select{ font-size: 12.5px !important; }
@media (max-width: 640px){
  .search-input, input, textarea, select{ font-size: 16px !important; }
  .kanban-container{ padding: 10px !important; }
}

/* ─── ПРОЕКТ НА КАРТОЧКЕ: отдельной строкой над темой задачи ───
   Было: проект и тема делили строку пополам, тема обрезалась.
   Стало: проект — крошка сверху, тема получает всю ширину. */
.kanban-card .d-proekt{
  display:flex; margin-bottom:6px; max-width:100%; overflow:hidden;
}
.kanban-card .d-proekt > *{
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  opacity:.92; font-size:9.5px !important; letter-spacing:.04em;
}
.kanban-card .task-title{
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;
  overflow:hidden; width:100%;
}

/* ─── ПРИОРИТЕТ: залитый значок, читается с одного взгляда ───
   Было: бледный текст на бледной подложке — на тёмном сливалось. */
.d-prio{
  display:inline-flex; align-items:center; gap:4px;
  font-size:9px !important; font-weight:900; letter-spacing:.06em;
  padding:3px 8px; border-radius:999px; color:#fff !important;
  line-height:1; white-space:nowrap; border:0 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}
.d-prio i{ font-size:9px; }
.d-prio-vys{
  background: linear-gradient(180deg,#ef4444,#b91c1c) !important;
  box-shadow: 0 2px 10px rgba(220,38,38,.45), inset 0 1px 0 rgba(255,255,255,.25);
}
/* высокий — тихо пульсирует, чтобы цеплял глаз */
@keyframes d-puls{ 0%,100%{ box-shadow:0 2px 10px rgba(220,38,38,.45), inset 0 1px 0 rgba(255,255,255,.25) }
                   50%{ box-shadow:0 2px 16px rgba(220,38,38,.75), inset 0 1px 0 rgba(255,255,255,.25) } }
.d-prio-vys{ animation: d-puls 2.4s ease-in-out infinite; }
.d-prio-sred{
  background: linear-gradient(180deg,#f59e0b,#b45309) !important;
  box-shadow: 0 2px 8px rgba(245,158,11,.35), inset 0 1px 0 rgba(255,255,255,.25);
}
.d-prio-obych{
  background: rgba(148,163,184,.22) !important; color:#cbd5e1 !important;
  padding:3px 7px; text-shadow:none;
}
@media (prefers-reduced-motion: reduce){ .d-prio-vys{ animation:none !important; } }

/* ─── ТЕГИ: залиты своим цветом, текст контрастный ─── */
.d-teg{
  display:inline-flex; align-items:center;
  font-size:9.5px !important; font-weight:900; letter-spacing:.03em;
  padding:3px 9px; border-radius:999px; line-height:1;
  border:0 !important; white-space:nowrap;
  max-width:160px; overflow:hidden; text-overflow:ellipsis;
}
/* ─── СТАТУСЫ И СЧЁТЧИКИ НА КАРТОЧКЕ: крупнее и ярче ─── */
.kanban-badges span{ font-size:11px !important; opacity:1 !important; }
.kanban-badges b{ font-size:10.5px !important; margin-left:2px !important; }
.kanban-badges .text-indigo-400,.kanban-badges .text-indigo-500{ color:#a5b4fc !important; }
.kanban-badges .text-blue-400{ color:#93c5fd !important; }
.kanban-badges .text-emerald-400{ color:#6ee7b7 !important; }
.kanban-badges .text-amber-400{ color:#fcd34d !important; }
.kanban-badges .text-red-500{ color:#fca5a5 !important; }
/* заголовки колонок = названия статусов */
.col-header b{ color:#fff !important; font-size:10.5px !important; opacity:.95; }
.col-count{ background: rgba(148,163,184,.2) !important; padding:2px 8px; border-radius:999px; }

/* ─── ДАТА НА КАРТОЧКЕ: чип, состояние видно заливкой ───
   Было: цвет «-500» текстом — на тёмном тускнел и терялся. */
.d-data{
  display:inline-flex; align-items:center; gap:5px;
  font-size:11px !important; font-weight:800; line-height:1;
  padding:4px 9px; border-radius:999px; white-space:nowrap;
  font-variant-numeric: tabular-nums;
}
.d-data i{ font-size:10px; opacity:.95; }
.d-data-ok{        background: rgba(16,185,129,.16) !important; color:#6ee7b7 !important; }
.d-data-nedelya{   background: rgba(59,130,246,.18) !important; color:#93c5fd !important; }
.d-data-skoro{     background: rgba(245,158,11,.20) !important; color:#fcd34d !important; }
.d-data-prosr{
  background: linear-gradient(180deg,#ef4444,#b91c1c) !important; color:#fff !important;
  box-shadow: 0 2px 10px rgba(220,38,38,.4); text-shadow: 0 1px 2px rgba(0,0,0,.35);
}
/* средние оттенки «-500» вообще: подтягиваем, где ещё встретятся */
.text-emerald-500{ color:#6ee7b7 !important; } .text-blue-500{ color:#93c5fd !important; }
.text-amber-500{ color:#fcd34d !important; }   .text-red-500{ color:#fca5a5 !important; }
.text-indigo-500{ color:#a5b4fc !important; }  .text-violet-500{ color:#c4b5fd !important; }
.text-slate-500{ color:#94a3b8 !important; }

/* светлый тег: не заливаем — чёрное по жёлтому мелко не читается */
.d-teg-svet{
  font-weight:900 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.5);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}

/* ─── СРОК: компактно, без рамок-пилюль там, где спокойно ─── */
.d-data{
  padding:3px 8px !important; gap:4px !important;
  font-size:10.5px !important; font-weight:800 !important;
  border-radius:8px !important; letter-spacing:.01em;
}
/* спокойные состояния — без заливки, только цвет: карточка не рябит */
.d-data-ok{ background: transparent !important; color:#94a3b8 !important; padding:3px 2px !important; }
.d-data-nedelya{ background: rgba(59,130,246,.16) !important; color:#93c5fd !important; }
/* срочное — заметно */
.d-data-skoro{ background: rgba(245,158,11,.22) !important; color:#fcd34d !important; }
.d-data-prosr{
  background: linear-gradient(180deg,#ef4444,#b91c1c) !important; color:#fff !important;
  padding:3px 9px !important; box-shadow: 0 2px 10px rgba(220,38,38,.45);
}
.d-data i{ font-size:9.5px !important; opacity:.9; }
.d-data-ok i{ opacity:.55; }

/* ─── ВЕРХНЯЯ СТРОКА КАРТОЧКИ: ничего не вылезает за край ─── */
.kanban-card > div:first-of-type,
.kanban-card > div[style*="grid-template-columns:1fr auto 1fr"]{
  min-width:0 !important; overflow:hidden;
}
.kanban-card > div[style*="grid-template-columns:1fr auto 1fr"] > div{ min-width:0; overflow:hidden; }
.d-data{
  max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  padding:3px 8px !important; gap:0 !important;
  font-size:10.5px !important; font-weight:800 !important; border-radius:8px !important;
}
.d-data i{ display:none !important; }   /* значок перед сроком убран — Батя: «не красиво» */
.d-prio i{ font-size:8.5px !important; }

/* ─── СРОК КВАДРАТИКАМИ: день · месяц · год ───
   Цифры моноширинные, чтобы не плясали. Цвет = состояние срока. */
.d-data{
  display:inline-flex !important; align-items:center; gap:2px !important;
  background: transparent !important; padding:0 !important; border-radius:0 !important;
  font-variant-numeric: tabular-nums; white-space:nowrap;
}
.d-data b{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:19px; height:18px; padding:0 3px;
  font-family:'JetBrains Mono', ui-monospace, monospace;
  font-size:10.5px; font-weight:800; line-height:1;
  border-radius:5px; letter-spacing:-.02em;
  background: rgba(148,163,184,.16); color:#cbd5e1;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.05);
}
/* год — тише остальных: он редко важен */
.d-data b:last-child{ opacity:.62; font-size:9.5px; min-width:17px; }

.d-data-ok b{ background: rgba(148,163,184,.14); color:#94a3b8; }
.d-data-nedelya b{ background: rgba(59,130,246,.20); color:#bfdbfe; }
.d-data-skoro b{ background: rgba(245,158,11,.24); color:#fde68a; }
.d-data-prosr b{
  background: linear-gradient(180deg,#ef4444,#b91c1c); color:#fff;
  box-shadow: 0 2px 8px rgba(220,38,38,.4), inset 0 1px 0 rgba(255,255,255,.2);
}

/* клетки срока — шире и посадистее (просьба Бати) */
.d-data{ gap:3px !important; }
.d-data b{
  min-width:25px !important; height:20px !important; padding:0 6px !important;
  font-size:11px !important; border-radius:6px !important;
}
.d-data b:last-child{ min-width:23px !important; font-size:10px !important; opacity:.66; }

/* ═══ КРУПНЕЕ: текст был мелкий (просьба Бати) ═══ */
body{ font-size: 13.5px !important; }

/* срок — цифры заметно крупнее */
.d-data b{
  min-width:28px !important; height:23px !important; padding:0 7px !important;
  font-size:12.5px !important; border-radius:7px !important;
}
.d-data b:last-child{ min-width:26px !important; font-size:11.5px !important; }

/* тема задачи — главное на карточке */
.task-title{ font-size:15px !important; line-height:1.42 !important; font-weight:800 !important; }
.task-code{ font-size:11.5px !important; }

/* метки и значки */
.d-prio{ font-size:10px !important; padding:4px 9px !important; }
.d-prio i{ font-size:9.5px !important; }
.d-teg{ font-size:10.5px !important; padding:3px 10px !important; }
.kanban-badges span{ font-size:12px !important; }
.kanban-badges b{ font-size:11.5px !important; }
.kanban-card .d-proekt > *{ font-size:10.5px !important; }

/* навигация и колонки */
.mode-btn{ font-size:11.5px !important; padding:10px 14px !important; }
.scope-btn,.type-btn,.view-tab{ font-size:11px !important; }
.col-header b{ font-size:11.5px !important; }
.col-count{ font-size:11.5px !important; }
.action-btn{ font-size:10.5px !important; padding:8px 15px !important; }
.header-logo h1.d-logo{ font-size:24px !important; }

/* чат и поля */
.msg-bubble,.wolf-msg{ font-size:13.5px !important; }
.chat-input,.search-input,input,textarea,select{ font-size:13.5px !important; }
@media (max-width:640px){ .chat-input,.search-input,input,textarea,select{ font-size:16px !important; } }

/* плитки срока — ещё шире (просьба Бати) */
.d-data{ gap:4px !important; }
.d-data b{
  min-width:34px !important; height:26px !important; padding:0 9px !important;
  font-size:13.5px !important; border-radius:8px !important;
}
.d-data b:last-child{ min-width:31px !important; font-size:12.5px !important; opacity:.7; }

/* ═══ ПЕРЕМЕЩЕНИЕ КАРТОЧКИ МЕЖДУ КОЛОНКАМИ ═══ */
/* пока тащим */
.kanban-card.sortable-drag, .kanban-card[draggable="true"]:active{ cursor: grabbing; }
.kanban-card{ cursor: grab; }
/* колонка, над которой держим карточку */
.kanban-list.d-nad{ background: rgba(220,38,38,.06) !important; box-shadow: inset 0 0 0 2px rgba(220,38,38,.35); border-radius:12px; }

/* приземление: вперёд по маршруту — зелёная волна */
@keyframes d-prizem-v{
  0%{ transform: scale(.94) translateY(-6px); box-shadow:0 0 0 0 rgba(16,185,129,.55); }
  40%{ transform: scale(1.03) translateY(0);  box-shadow:0 0 0 8px rgba(16,185,129,.18); }
  100%{ transform:none; box-shadow:0 0 0 0 rgba(16,185,129,0); }
}
/* откат назад — янтарная */
@keyframes d-prizem-n{
  0%{ transform: scale(.94) translateY(-6px); box-shadow:0 0 0 0 rgba(245,158,11,.55); }
  40%{ transform: scale(1.03) translateY(0);  box-shadow:0 0 0 8px rgba(245,158,11,.18); }
  100%{ transform:none; box-shadow:0 0 0 0 rgba(245,158,11,0); }
}
.kanban-card.d-prizem-vpered{ animation: d-prizem-v .85s cubic-bezier(.2,.9,.2,1) both; }
.kanban-card.d-prizem-nazad{  animation: d-prizem-n .85s cubic-bezier(.2,.9,.2,1) both; }
@media (prefers-reduced-motion: reduce){
  .kanban-card.d-prizem-vpered,.kanban-card.d-prizem-nazad{ animation:none !important; }
}
/* колонка согласования — свой оттенок */
.kanban-col[data-slug="approval"]{ box-shadow: inset 0 1px 0 rgba(99,102,241,.18), 0 10px 30px rgba(0,0,0,.28) !important; }

/* ═══ КАЧЕСТВО ТЕКСТА: плотный, хорошо прорисованный ═══ */
html, body, button, input, textarea, select{
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-optical-sizing: auto;
}
/* плотность: слегка сжатый трекинг на крупном, свободный на мелком */
.task-title{ font-weight:700 !important; letter-spacing:-.012em !important; }
.header-logo h1.d-logo{ font-weight:900 !important; letter-spacing:-.035em !important; }
.col-header b, .mode-btn, .scope-btn, .type-btn, .view-tab, .action-btn{
  font-weight:800 !important; letter-spacing:.045em !important;
}
.d-prio, .d-teg{ font-weight:800 !important; letter-spacing:.03em !important; }
/* моноширинный — только там, где цифры и коды */
.task-code, .d-data b{
  font-family:'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace !important;
  font-weight:700 !important;
}
/* тонкие тексты не делаем светлее нужного — на тёмном они «выцветают» */
.text-slate-400, .text-slate-300{ font-weight:600 !important; }

/* ═══════════ МАРШРУТ ЗАДАЧИ В КАРТОЧКЕ ═══════════ */
.d-marshrut-obertka{
  padding:16px 28px 14px; border-bottom:1px solid var(--d-line);
  background: linear-gradient(180deg, rgba(2,6,23,.35), transparent);
}
.d-marshrut{ display:flex; align-items:flex-start; gap:0; overflow-x:auto; padding-bottom:2px; }
.d-marshrut::-webkit-scrollbar{ height:6px; }

.d-shag{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  min-width:76px; flex-shrink:0; text-align:center;
  animation: d-shag-poyav .45s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes d-shag-poyav{ from{ opacity:0; transform:translateY(8px) scale(.9); } to{ opacity:1; transform:none; } }

.d-shag-krug{
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:14px;
  border:2px solid var(--d-line); background: rgba(2,6,23,.5); color:#64748b;
  transition: all .25s ease;
}
.d-shag-imya{ font-size:10px; font-weight:800; letter-spacing:.03em; color:#64748b; white-space:nowrap; }
.d-shag-vremya{
  font-size:9.5px; font-weight:700; color:#475569; white-space:nowrap;
  font-family:'JetBrains Mono', monospace;
}

/* пройденный шаг */
.d-shag-proiden .d-shag-krug{
  border-color: rgba(16,185,129,.6); background: rgba(16,185,129,.16); color:#6ee7b7;
}
.d-shag-proiden .d-shag-imya{ color:#94a3b8; }
.d-shag-proiden .d-shag-vremya{ color:#6ee7b7; }

/* текущий шаг — светится и дышит */
.d-shag-tekushii .d-shag-krug{
  border-color: var(--d-akcent); background: linear-gradient(180deg,#ef4444,#b91c1c); color:#fff;
  box-shadow: 0 0 0 4px rgba(220,38,38,.16), 0 6px 18px rgba(220,38,38,.4);
  animation: d-shag-puls 2.2s ease-in-out infinite;
}
@keyframes d-shag-puls{
  0%,100%{ box-shadow: 0 0 0 4px rgba(220,38,38,.14), 0 6px 18px rgba(220,38,38,.35); }
  50%    { box-shadow: 0 0 0 9px rgba(220,38,38,.05), 0 8px 24px rgba(220,38,38,.55); }
}
.d-shag-tekushii .d-shag-imya{ color:#fff; }
.d-shag-tekushii .d-shag-vremya{ color:#fca5a5; }

/* впереди — приглушённый */
.d-shag-vperedi{ opacity:.42; }

/* связь между шагами */
.d-svyaz{
  flex:1 1 auto; min-width:18px; height:2px; margin-top:18px; border-radius:2px;
  background: var(--d-line); position:relative; overflow:hidden;
}
.d-svyaz span{
  position:absolute; inset:0; width:0; border-radius:2px;
  background: linear-gradient(90deg, rgba(16,185,129,.5), rgba(16,185,129,.9));
  animation: d-svyaz-rost .6s .2s cubic-bezier(.2,.8,.2,1) both;
}
.d-svyaz:not(.d-svyaz-proidena) span{ animation:none; width:0; }
@keyframes d-svyaz-rost{ from{ width:0 } to{ width:100% } }

.d-marshrut-itog{
  margin-top:10px; font-size:10.5px; color:#94a3b8; letter-spacing:.03em;
}
.d-marshrut-itog b{ color:#e2e8f0; font-family:'JetBrains Mono', monospace; }

@media (prefers-reduced-motion: reduce){
  .d-shag{ animation-duration:.3s !important; }
  .d-svyaz-proidena span{ width:100% !important; }
}

/* ═══ ВСПЛЕСК В ТОЧКЕ ПРИЗЕМЛЕНИЯ ═══ */
.d-vsplesk{
  position:fixed; z-index:9998; pointer-events:none;
  width:14px; height:14px; margin:-7px 0 0 -7px; border-radius:50%;
  background: radial-gradient(circle, rgba(16,185,129,.9), rgba(16,185,129,0) 70%);
  animation: d-vsplesk-rost .62s cubic-bezier(.2,.8,.2,1) both;
}
.d-vsplesk.d-vsplesk-nazad{
  background: radial-gradient(circle, rgba(245,158,11,.9), rgba(245,158,11,0) 70%);
}
@keyframes d-vsplesk-rost{
  0%  { transform: scale(.4); opacity:.95; }
  60% { transform: scale(6);  opacity:.35; }
  100%{ transform: scale(9);  opacity:0; }
}
/* ─── перетаскивание пальцем: карточка-призрак под пальцем ─── */
.d-prizrak{
  position:fixed !important; z-index:10000; pointer-events:none;
  opacity:.92; transform: rotate(-1.5deg) scale(1.03);
  box-shadow: 0 24px 60px rgba(0,0,0,.6), 0 0 0 1px rgba(220,38,38,.35) !important;
  transition:none !important; animation:none !important;
}
.kanban-card.d-vzyato{ opacity:.35; filter: grayscale(.4); }
/* на касании не даём браузеру перехватывать жест на карточках */
@media (pointer: coarse){
  .kanban-card{ touch-action: pan-y; -webkit-user-select:none; user-select:none; }
}

/* ─── ВСПЛЕСК КРУПНЕЕ ─── */
.d-vsplesk{ width:22px !important; height:22px !important; margin:-11px 0 0 -11px !important; }

/* ─── КОЛОНКА ПРИНЯЛА ЗАДАЧУ ─── */
.kanban-col.d-prinyala{
  animation: d-prinyala .8s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes d-prinyala{
  0%  { box-shadow: inset 0 0 0 2px rgba(16,185,129,.85), 0 0 34px rgba(16,185,129,.35); transform: scale(1.012); }
  100%{ box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.28); transform: none; }
}

/* страница не должна ездить вбок ни при каких эффектах */
html, body{ overflow-x: hidden; }

/* контейнер колонок не должен прыгать по ширине при перерисовке */
.kanban-container{ align-items: stretch !important; }
/* ШИРИНУ КОЛОНОК ДЕРЖИТ diwan-kanban.css (flex:0 0 344px, доска едет вбок).
   Тут стояло flex:1 1 0 — оно и мяло «Уточнение». Убрано 22.08. Не возвращать. */

/* Карточки не «выпархивают» при перерисовке доски: анимация появления
   запускалась заново на всех сразу и давала скачки. И сама анимация,
   и её отмена вычищены 22.08. */
.d-shag{ animation-duration: .45s; }          /* в маршруте задачи — оставляем, там открывается один раз */


/* Пробовали contain на колонках и карточках и липкие шапки — от них доска
   дрожала при перерисовке. Правила ставились и тут же отменялись следом;
   обе половины вычищены 22.08. Высоту списка задаёт правило ниже. */
/* шапка страницы остаётся липкой, но без пересчёта размытия на каждый кадр */
.mode-switcher{ will-change: auto !important; }
/* переходы только на том, что действительно меняется от наведения */
.kanban-card{ transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease !important; }
/* прыжок убран 22.08 — только свечение */

/* Эффекты рисуем прямо в страницу. Пробовали отдельный слой #d-sloy —
   он обрезал стрелу, отменён и вычищен 22.08. От боковой прокрутки
   защищает overflow-x:hidden на html/body (стоит выше). */
.d-vsplesk, .d-skazat{ position: fixed !important; }
.d-vsplesk{ z-index: 99999 !important; }
.d-skazat{
  z-index: 100001 !important; left: 50%; bottom: 74px; transform: translateX(-50%);
  padding: 10px 18px; border-radius: 12px; pointer-events: none;
  background: rgba(185,28,28,.95); color: #fff; font-weight: 800; font-size: 12.5px;
  box-shadow: 0 16px 40px rgba(0,0,0,.55); transition: opacity .5s ease;
}
.d-skazat.d-uhodit{ opacity: 0; }

/* колонка-получатель: без изменения размера — от него доска и «сжималась» */
@keyframes d-prinyala{
  0%  { box-shadow: inset 0 0 0 2px rgba(16,185,129,.9), 0 0 34px rgba(16,185,129,.35); }
  100%{ box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 30px rgba(0,0,0,.28); }
}
.kanban-col.d-prinyala{ transform: none !important; }

/* ═══ КОЛОНКИ ДЕРЖАТ ФОРМУ ═══
   Я убрал минимальную высоту списка — и пустая колонка схлопывалась в ноль:
   на доске становилось 4 колонки вместо 5, потом снова 5. Возвращаем опору. */
.kanban-list{ min-height: 140px !important; flex: 1 1 auto !important; }
.kanban-col{
  min-height: 200px !important;
  align-self: stretch !important;
  /* flex и min-width убраны 22.08 — ширину задаёт diwan-kanban.css */
}
.kanban-container{ align-items: stretch !important; }
/* пустая колонка не выглядит поломкой — показываем спокойный след */
.kanban-list:empty::after{
  content: "";
  display: block; height: 100%; min-height: 120px; border-radius: 12px;
  border: 1px dashed rgba(148,163,184,.16);
  margin: 4px;
}

/* ═══════════════════════════════════════════════════════════════
   ГЛАВНАЯ ПРИЧИНА (2026-08-14): на станции включена системная
   настройка «меньше движения» (prefers-reduced-motion: reduce),
   и мои же правила гасили стрелку через display:none.
   Настройку уважаем, но не отменяем движение целиком:
   делаем его коротким и без резких скачков. Батя просил — движение будет.
   ═══════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce){
  .d-vsplesk{
    display: block !important;
    visibility: visible !important;
  }
  .d-vsplesk{ animation-duration: .45s !important; }
  .kanban-col.d-prinyala{ animation: d-prinyala .5s ease-out both !important; }
  .d-prio-vys{ animation: none !important; }          /* пульсацию приоритета — не навязываем */
  .d-shag-tekushii .d-shag-krug{ animation: none !important; }
}
/* и на всякий случай: ничто не должно скрывать всплеск */
.d-vsplesk{ display: block !important; }

/* ═══ КРАСИВЫЙ ПОЛЁТ: дуга, разворот по ходу, светящийся след ═══ */
.d-sled{
  position:fixed !important; left:0; top:0; z-index:99998;
  pointer-events:none; overflow:visible;
}
/* Значок-стрелка и прямая трасса (.d-strela / .d-trassa) больше не рисуются:
   полёт — это дуга .d-sled с наконечником, её строит diwan-dvizhenie.js.
   Правила вычищены 22.08 вместе с мёртвой функцией d_strela(). */

/* ═══ ЗАХВАТ КАРТОЧКИ ИЗ СЕРЕДИНЫ СПИСКА ═══
   Причина срывов: на наведении карточка приподнимается (transform).
   В момент захвата браузер снимает с неё «портрет» — и сдвинутый элемент
   ломает перетаскивание: берётся, но не переносится. Во время захвата — не двигаем. */
.kanban-card:active{ transform: none !important; transition: none !important; }
.kanban-card[draggable="true"]:active{ opacity: .9; }
/* поднятия нет вовсе: от него значки уезжали из-под мыши (убрано 22.08) */
/* ЗДЕСЬ БЫЛО pointer-events:none на i/b/span внутри карточки.
   Оно и глушило подсказки: мышь проваливалась мимо значка, и всплывала
   подсказка только у батарейки и аватарки. Для захвата карточки это
   правило не нужно — тянется она и за начинку. Убрано 22.08. */
.kanban-card [onclick]{ pointer-events: auto; }

/* у обычного приоритета значка нет — только слово (просьба Бати) */
.d-prio-obych i{ display:none !important; }
.d-prio-obych{ gap:0 !important; }

/* ═══ ПРИОРИТЕТ ЗНАЧКОМ: читается быстрее слова ═══
   высокий — восклицательный знак, средний — стрелка вверх, обычный — часы. */
.d-prio{
  width:24px !important; height:24px !important; padding:0 !important;
  border-radius:50% !important; justify-content:center;
  font-size:0 !important;               /* текста больше нет — только знак */
}
.d-prio i{ display:block !important; font-size:12px !important; line-height:1; }
.d-prio-obych i{ display:block !important; }
.d-prio-vys i{ font-size:14px !important; font-weight:900; }
.d-prio-obych{
  background: rgba(148,163,184,.18) !important; color:#94a3b8 !important;
  box-shadow:none !important; text-shadow:none !important;
}
.d-prio-sred i{ font-size:13px !important; }

/* ═══ ЧАСЫ ТОРОПЯТ: срок близко — значок мерцает красным ═══ */
@keyframes d-gorit{
  0%,100%{ background: rgba(220,38,38,.85); box-shadow: 0 0 0 0 rgba(220,38,38,.55); color:#fff; }
  50%    { background: rgba(220,38,38,.35); box-shadow: 0 0 0 7px rgba(220,38,38,0);  color:#fecaca; }
}
.d-prio-gorit{
  animation: d-gorit 1.5s ease-in-out infinite !important;
  color:#fff !important; text-shadow: 0 1px 2px rgba(0,0,0,.4);
}
.d-prio-gorit i{ color:#fff !important; }
/* просрочено — мерцает чаще и злее */
.d-prio-prosr{ animation-duration: .9s !important; }
/* при системной настройке «меньше движения» — не мигаем, но остаёмся красными */
@media (prefers-reduced-motion: reduce){
  .d-prio-gorit{ animation: none !important; background: rgba(220,38,38,.9) !important; }
}

/* ═══ ФОН ДАТЫ — ЭТО СВЕТОФОР СРОКА (шкала Бати) ═══
   далеко — зелёный · на днях — жёлтый · остался день — мерцает красным · просрочено — красный */
.d-data-daleko b{
  background: rgba(16,185,129,.22) !important; color:#6ee7b7 !important;
  box-shadow: inset 0 0 0 1px rgba(16,185,129,.25);
}
.d-data-dni b{
  background: rgba(245,158,11,.26) !important; color:#fde68a !important;
  box-shadow: inset 0 0 0 1px rgba(245,158,11,.3);
}
@keyframes d-data-mig{
  0%,100%{ background: rgba(220,38,38,.95); color:#fff;    box-shadow: 0 0 0 0 rgba(220,38,38,.5); }
  50%    { background: rgba(220,38,38,.35); color:#fecaca; box-shadow: 0 0 0 6px rgba(220,38,38,0); }
}
.d-data-gorit b{
  animation: d-data-mig 1.4s ease-in-out infinite;
  color:#fff !important; font-weight:800 !important;
}
.d-data-prosr b{
  animation: d-data-mig .85s ease-in-out infinite;
  background: linear-gradient(180deg,#ef4444,#b91c1c) !important; color:#fff !important;
}
/* год всегда тише — он редко важен */
.d-data b:last-child{ opacity:.72; }
/* при системной настройке «меньше движения» — не мигаем, но цвет остаётся */
@media (prefers-reduced-motion: reduce){
  .d-data-gorit b, .d-data-prosr b{
    animation: none !important; background: rgba(220,38,38,.9) !important; color:#fff !important;
  }
}

/* год появляется редко — только когда срок уходит за текущий год; и выглядит тише */
.d-data b.d-god{
  opacity:.6 !important; font-size:10.5px !important; min-width:24px !important;
  background: rgba(148,163,184,.14) !important; color:#94a3b8 !important;
  animation: none !important;
}

/* ═══════════ СРОК — ОДНОЙ ПИЛЮЛЕЙ ═══════════
   Кубики рябили. Теперь: точка-огонёк + «14 авг» в одной плашке. */
.d-data{
  display:inline-flex !important; align-items:center; gap:6px !important;
  padding:4px 10px !important; border-radius:999px !important;
  font-size:11.5px !important; font-weight:800 !important; white-space:nowrap;
  font-variant-numeric: tabular-nums; letter-spacing:.01em;
  background: rgba(148,163,184,.14) !important; color:#cbd5e1 !important;
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.14);
}
.d-data b{ all: unset; }                       /* старые кубики отменены */
.d-data em{ font-style:normal; opacity:.6; font-size:10.5px; }
.d-tochka{
  width:7px; height:7px; border-radius:50%; flex-shrink:0;
  background: currentColor; box-shadow: 0 0 8px currentColor;
}

/* светофор срока */
.d-data-daleko{ background: rgba(16,185,129,.16) !important; color:#6ee7b7 !important;
                box-shadow: inset 0 0 0 1px rgba(16,185,129,.22); }
.d-data-dni{    background: rgba(245,158,11,.20) !important; color:#fcd34d !important;
                box-shadow: inset 0 0 0 1px rgba(245,158,11,.28); }
@keyframes d-pilyulya-mig{
  0%,100%{ background: rgba(220,38,38,.92); color:#fff; box-shadow: 0 0 0 0 rgba(220,38,38,.5); }
  50%    { background: rgba(220,38,38,.38); color:#fecaca; box-shadow: 0 0 0 7px rgba(220,38,38,0); }
}
.d-data-gorit{ animation: d-pilyulya-mig 1.4s ease-in-out infinite; color:#fff !important; }
.d-data-prosr{ animation: d-pilyulya-mig .85s ease-in-out infinite; color:#fff !important; }
@media (prefers-reduced-motion: reduce){
  .d-data-gorit, .d-data-prosr{ animation:none !important; background: rgba(220,38,38,.9) !important; color:#fff !important; }
}

/* ═══════════ ТЁМНЫЕ ТЕГИ НЕ СЛИВАЮТСЯ ═══════════ */
.d-teg{
  display:inline-flex; align-items:center;
  font-size:10.5px !important; font-weight:900; letter-spacing:.03em;
  padding:3px 10px; border-radius:999px; line-height:1;
  border:1px solid transparent; white-space:nowrap;
  max-width:170px; overflow:hidden; text-overflow:ellipsis;
}
/* тёмный цвет: осветлённый текст, видимая рамка, полупрозрачная заливка */
.d-teg-temn{
  border-width:1px !important; border-style:solid !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.6);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06), 0 2px 10px rgba(0,0,0,.35);
}
/* светлый цвет: не заливаем — иначе чёрным по жёлтому мелко не прочесть */
.d-teg-svet{ border-width:1px !important; font-weight:900 !important; text-shadow: 0 1px 3px rgba(0,0,0,.5); }

/* ═══════════ КАЛЕНДАРЬ ═══════════ */
#mode-calendar{ padding:16px 24px; gap:18px; }
#mode-calendar.mode-content.active{ display:flex !important; align-items:flex-start; }
.d-kalendar{ flex:1 1 auto; min-width:0; }
.d-kal-shapka{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.d-kal-shapka b{ font-size:16px; font-weight:900; letter-spacing:-.02em; min-width:190px; }
.d-kal-shapka button{
  width:32px; height:32px; border-radius:10px; cursor:pointer;
  background: rgba(30,41,59,.62); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-kal-shapka button:hover{ border-color:#dc2626; color:#fff; }
.d-segodnya-knopka{ width:auto !important; padding:0 14px; font-weight:800; font-size:11px; }
.d-nedelya{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; margin-bottom:6px; }
.d-nedelya span{ font-size:10px; font-weight:800; color:#64748b; text-transform:uppercase; letter-spacing:.08em; text-align:center; }
.d-setka{ display:grid; grid-template-columns:repeat(7,1fr); gap:6px; }
.d-kletka{
  min-height:74px; border-radius:12px; padding:7px 8px; cursor:pointer;
  background: rgba(15,23,42,.6); border:1px solid var(--d-line);
  display:flex; flex-direction:column; justify-content:space-between;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.d-kletka:hover{ border-color: rgba(220,38,38,.45); transform: translateY(-1px); }
.d-kletka b{ font-size:13px; font-weight:800; color:#cbd5e1; }
.d-kletka.d-pusto{ background:transparent; border-color:transparent; cursor:default; }
.d-kletka.d-segodnya{ border-color: rgba(220,38,38,.75); box-shadow: inset 0 0 0 1px rgba(220,38,38,.35); }
.d-kletka.d-segodnya b{ color:#fff; }
.d-kletka.d-vybran{ background: rgba(30,41,59,.9); border-color:#dc2626; }
.d-metki{ display:flex; gap:4px; flex-wrap:wrap; }
.d-metochka{
  display:inline-flex; align-items:center; gap:3px;
  font-size:9.5px; font-weight:900; padding:2px 6px; border-radius:999px; line-height:1;
}
.d-den-daleko{ background: rgba(16,185,129,.2); color:#6ee7b7; }
.d-den-dni{    background: rgba(245,158,11,.24); color:#fde68a; }
.d-den-gorit{  background: rgba(220,38,38,.85); color:#fff; }
.d-den-prosr{  background: linear-gradient(180deg,#ef4444,#b91c1c); color:#fff; }
.d-den-vstrecha{ background: rgba(59,130,246,.28); color:#bfdbfe; }

.d-den-panel{
  width:340px; flex-shrink:0; border-radius:16px; padding:14px;
  background: rgba(15,23,42,.72); border:1px solid var(--d-line);
}
.d-den-shapka{ display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.d-den-shapka b{ font-size:14px; font-weight:900; }
.d-knopka-vstrecha{
  padding:7px 12px; border-radius:10px; cursor:pointer; font-size:10.5px; font-weight:800;
  background: linear-gradient(180deg,#1e293b,#0f172a); border:1px solid rgba(220,38,38,.55); color:#fff;
}
.d-knopka-vstrecha:hover{ border-color:#dc2626; box-shadow:0 8px 22px rgba(220,38,38,.28); }
.d-stroka{
  display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:10px; margin-bottom:6px;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line); cursor:pointer;
}
.d-stroka:hover{ border-color: rgba(220,38,38,.4); }
.d-vremya{ font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; color:#94a3b8; flex-shrink:0; }
.d-nazv{ font-size:12.5px; font-weight:700; color:#e2e8f0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d-stroka-vstrecha{ border-left:3px solid #3b82f6; }
.d-stroka-zadacha{ border-left:3px solid rgba(148,163,184,.5); }
.d-voiti{
  margin-left:auto; padding:5px 11px; border-radius:8px; font-size:10px; font-weight:800; cursor:pointer;
  background: rgba(59,130,246,.25); border:1px solid rgba(59,130,246,.5); color:#bfdbfe;
}
.d-voiti:hover{ background: rgba(59,130,246,.4); color:#fff; }
.d-pusto-den{ color:#64748b; font-size:12px; padding:10px 4px; }
@media (max-width: 900px){
  #mode-calendar.mode-content.active{ flex-direction:column; }
  .d-den-panel{ width:100%; }
}

/* ═══════════ ОКНО ВСТРЕЧИ ═══════════ */
#vstrechaModal{ display:none; }
#vstrechaModal:not(.hidden){ display:flex !important; }
.d-vstrecha-okno{
  width:100%; max-width:620px; max-height:92vh; display:flex; flex-direction:column;
  border-radius:22px; overflow:hidden;
  background: linear-gradient(180deg, rgba(30,41,59,.96), rgba(15,23,42,.98));
  border:1px solid rgba(148,163,184,.18); box-shadow: 0 34px 90px rgba(0,0,0,.7);
}
.d-vo-shapka{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 20px; border-bottom:1px solid var(--d-line);
  background: rgba(2,6,23,.4);
}
.d-vo-shapka b{ font-size:15px; font-weight:900; letter-spacing:-.01em; }
.d-vo-krest{
  width:32px; height:32px; border-radius:10px; cursor:pointer;
  background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-vo-krest:hover{ border-color:#dc2626; color:#fff; }
.d-vo-telo{ padding:18px 20px; overflow-y:auto; display:flex; flex-direction:column; gap:13px; }
.d-vo-ryad{ display:flex; gap:12px; }
.d-vo-ryad > *{ flex:1 1 0; min-width:0; }
.d-vo-pole{ display:flex; flex-direction:column; gap:5px; }
.d-vo-pole > span{
  font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.07em; color:#94a3b8;
}
.d-vo-pole input[type=text], .d-vo-pole input[type=date], .d-vo-pole input[type=time],
.d-vo-pole select, .d-vo-pole textarea{
  width:100%; padding:10px 12px; border-radius:11px; font-size:13px; font-weight:600;
  background: rgba(2,6,23,.6) !important; border:1px solid var(--d-line) !important; color:#f1f5f9 !important;
  outline:none;
}
.d-vo-pole input:focus, .d-vo-pole select:focus, .d-vo-pole textarea:focus{
  border-color:#dc2626 !important; box-shadow: 0 0 0 1px rgba(220,38,38,.4);
}
.d-vo-ves-den{ flex:0 0 130px; }
.d-vo-galka{
  display:flex; align-items:center; gap:7px; padding:10px 0; font-size:12px; font-weight:700; color:#cbd5e1;
}
.d-vo-galka input{ width:16px; height:16px; accent-color:#dc2626; }
.d-vo-lyudi{
  display:flex; flex-wrap:wrap; gap:6px; max-height:130px; overflow-y:auto;
  padding:9px; border-radius:11px; background: rgba(2,6,23,.45); border:1px solid var(--d-line);
}
.d-chelovek{
  display:inline-flex; align-items:center; gap:6px; cursor:pointer;
  padding:5px 11px; border-radius:999px; font-size:11.5px; font-weight:700;
  background: rgba(148,163,184,.12); border:1px solid transparent; color:#cbd5e1;
  transition: all .16s ease;
}
.d-chelovek input{ display:none; }
.d-chelovek:hover{ border-color: rgba(148,163,184,.35); }
.d-chelovek.d-vzyat{
  background: rgba(59,130,246,.28); border-color: rgba(59,130,246,.6); color:#fff;
}
.d-vo-podskazka{ font-size:11.5px; color:#94a3b8; line-height:1.5; }
.d-vo-podskazka b{ color:#e2e8f0; }
.d-vo-niz{
  display:flex; align-items:center; gap:10px; padding:14px 20px;
  border-top:1px solid var(--d-line); background: rgba(2,6,23,.4);
}
.d-vo-spravа{ flex:1 1 auto; }
.d-vo-niz button{ padding:10px 16px; border-radius:11px; font-size:12px; font-weight:800; cursor:pointer; }
.d-vo-udalit{ background: rgba(220,38,38,.16); border:1px solid rgba(220,38,38,.45); color:#fca5a5; }
.d-vo-udalit:hover{ background: rgba(220,38,38,.3); color:#fff; }
.d-vo-otmena{ background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#cbd5e1; }
.d-vo-sohranit{
  background: linear-gradient(180deg,#1e293b,#0f172a); border:1px solid rgba(220,38,38,.6); color:#fff;
  box-shadow: 0 10px 26px rgba(220,38,38,.2);
}
.d-vo-sohranit:hover{ border-color:#dc2626; box-shadow: 0 12px 30px rgba(220,38,38,.35); }
@media (max-width:600px){ .d-vo-ryad{ flex-direction:column; } .d-vo-ves-den{ flex:1 1 auto; } }

/* ═══ КАЛЕНДАРЬ ПО СЕРЕДИНЕ, ЛЕНТА ИЗ 12 МЕСЯЦЕВ ═══ */
#mode-calendar.mode-content.active{
  display:flex !important; justify-content:center; align-items:flex-start; gap:20px;
  max-width:1280px; margin:0 auto; width:100%;
}
.d-kalendar{ flex:1 1 auto; max-width:760px; }
.d-god-shapka{ display:flex; align-items:center; justify-content:center; gap:12px; margin-bottom:12px; }
.d-god-shapka b{ font-size:20px; font-weight:900; letter-spacing:-.03em; min-width:78px; text-align:center; }
.d-god-shapka button{
  width:32px; height:32px; border-radius:10px; cursor:pointer;
  background: rgba(30,41,59,.62); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-god-shapka button:hover{ border-color:#dc2626; color:#fff; }

.d-lenta{
  display:flex; gap:6px; overflow-x:auto; padding:4px 2px 10px;
  scroll-behavior:smooth; scrollbar-width:none;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.d-lenta::-webkit-scrollbar{ display:none; }
.d-mes{
  flex:0 0 auto; min-width:76px; padding:9px 12px; border-radius:12px; cursor:pointer;
  background: rgba(15,23,42,.6); border:1px solid var(--d-line); color:#94a3b8;
  font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase;
  transition: all .18s cubic-bezier(.2,.8,.2,1);
}
.d-mes em{ display:none; }
.d-mes:hover{ color:#fff; border-color: rgba(220,38,38,.45); transform: translateY(-1px); }
.d-mes-nyne{ color:#fca5a5; border-color: rgba(220,38,38,.35); }
.d-mes-vybran{
  min-width:118px; color:#fff; font-size:13px;
  background: linear-gradient(180deg, rgba(30,41,59,.95), rgba(15,23,42,.95));
  border-color:#dc2626; box-shadow: 0 10px 26px rgba(220,38,38,.22);
  transform: translateY(-2px);
}
.d-mes-vybran span{ display:none; }
.d-mes-vybran em{ display:inline; font-style:normal; }

/* ═══ КАРУСЕЛЬ ИЗ ТРЁХ МЕСЯЦЕВ ═══ */
.d-karusel{
  display:grid; grid-template-columns: 1fr 1.5fr 1fr; gap:14px; align-items:start;
  overscroll-behavior: contain;
}
.d-mesyac-blok{
  border-radius:16px; padding:12px; cursor:pointer;
  background: rgba(15,23,42,.4); border:1px solid transparent;
  opacity:.55; transform: scale(.97);
  transition: opacity .22s ease, transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s ease;
}
.d-mesyac-blok:hover{ opacity:.85; border-color: rgba(148,163,184,.2); }
.d-mesyac-blok.d-glavnyi{
  opacity:1; transform:none; cursor:default;
  background: rgba(15,23,42,.72); border-color: var(--d-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 14px 36px rgba(0,0,0,.35);
}
.d-mes-nazv{
  font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.08em;
  color:#94a3b8; text-align:center; margin-bottom:9px;
}
.d-glavnyi .d-mes-nazv{ color:#fff; font-size:14px; }
.d-mesyac-blok:not(.d-glavnyi) .d-kletka{ min-height:38px; padding:4px 5px; }
.d-mesyac-blok:not(.d-glavnyi) .d-kletka b{ font-size:11px; }
.d-mesyac-blok:not(.d-glavnyi) .d-metochka{ font-size:8px; padding:1px 4px; }
.d-mesyac-blok:not(.d-glavnyi) .d-nedelya span{ font-size:8.5px; }
.d-kalendar{ max-width:1080px; }
@media (max-width:1100px){
  .d-karusel{ grid-template-columns:1fr; }
  .d-mesyac-blok:not(.d-glavnyi){ display:none; }
}

/* ═══ КАЛЕНДАРЬ ОТ КРАЯ ДО КРАЯ, ПАНЕЛЬ ДНЯ — СВЕРХУ ═══ */
#mode-calendar.mode-content.active{
  display:flex !important; flex-direction:column; align-items:stretch;
  max-width:none; width:100%; padding:14px 22px 26px; gap:14px;
}
.d-kalendar{ max-width:none !important; width:100%; }
.d-karusel{ grid-template-columns: 1fr 1.35fr 1fr; gap:18px; }

/* панель дня наверху — широкой полосой, а не колонкой сбоку */
.d-den-panel{
  width:100% !important; display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  padding:12px 16px; border-radius:14px;
}
.d-den-shapka{ margin-bottom:0; gap:14px; flex:0 0 auto; }
.d-den-panel .d-stroka{ margin-bottom:0; flex:1 1 260px; min-width:240px; max-width:420px; }
.d-pusto-den{ padding:4px 2px; }

/* дни крупнее — места теперь много */
.d-glavnyi .d-kletka{ min-height:92px; }
.d-glavnyi .d-kletka b{ font-size:15px; }

@media (max-width:1100px){
  .d-karusel{ grid-template-columns:1fr; }
  .d-mesyac-blok:not(.d-glavnyi){ display:none; }
}

/* ═══ ДЕРЕВО ОТДЕЛОВ В АДМИНКЕ ═══ */
#otdely-derevo{ padding:18px 20px; }
.d-str-shapka{ display:flex; align-items:center; gap:14px; margin-bottom:14px; flex-wrap:wrap; }
.d-str-shapka b{ font-size:14px; font-weight:900; }
.d-str-pravilo{ font-size:11px; color:#94a3b8; font-weight:700; }
.d-str-dobavit{
  margin-left:auto; padding:8px 14px; border-radius:10px; cursor:pointer; font-size:11px; font-weight:800;
  background: linear-gradient(180deg,#1e293b,#0f172a); border:1px solid rgba(220,38,38,.55); color:#fff;
}
.d-str-dobavit:hover{ border-color:#dc2626; }
.d-otdel-strochka{
  display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:11px; margin-bottom:6px;
  background: rgba(2,6,23,.45); border:1px solid var(--d-line);
}
.d-otdel-strochka:hover{ border-color: rgba(220,38,38,.35); }
.d-otdel-strochka b{ font-size:13px; font-weight:800; }
.d-otdel-znak{ color:#94a3b8; }
.d-ruk{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700; color:#93c5fd; }
.d-ruk.d-net{ color:#64748b; font-style:italic; }
.d-lyudei{
  font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:999px;
  background: rgba(148,163,184,.18); color:#cbd5e1;
}
.d-firma{ font-size:10.5px; color:#94a3b8; }
.d-otdel-knopki{ margin-left:auto; display:flex; gap:5px; }
.d-otdel-knopki button{
  width:28px; height:28px; border-radius:8px; cursor:pointer; font-size:11px;
  background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-otdel-knopki button:hover{ border-color:#dc2626; color:#fff; }
.d-otdel-knopki .d-krasnaya:hover{ background: rgba(220,38,38,.3); }
.d-str-pusto{ color:#64748b; font-size:12.5px; padding:12px 4px; }

/* ═══ ОБЛАСТЬ «СОЗДАТЬ» ═══ */
.d-sozdat{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.d-sozdat-podpis{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.1em; color:#64748b;
  margin-right:2px;
}
.d-sozdat-knopka{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:9px 14px; border-radius:12px; font-size:11.5px; font-weight:800;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line); color:#cbd5e1;
  transition: all .18s cubic-bezier(.2,.8,.2,1);
}
.d-sozdat-knopka i{ font-size:13px; }
.d-sozdat-knopka:hover{ transform: translateY(-2px); color:#fff; }
.d-sk-vks i{ color:#60a5fa; }
.d-sk-vks:hover{ border-color: rgba(59,130,246,.7); box-shadow: 0 10px 26px rgba(59,130,246,.28); }
.d-sk-vstrecha i{ color:#34d399; }
.d-sk-vstrecha:hover{ border-color: rgba(16,185,129,.7); box-shadow: 0 10px 26px rgba(16,185,129,.26); }
.d-sk-sobytie i{ color:#fbbf24; }
.d-sk-sobytie:hover{ border-color: rgba(245,158,11,.7); box-shadow: 0 10px 26px rgba(245,158,11,.26); }
.d-sk-zvonok i{ color:#f87171; }
.d-sk-zvonok:hover{ border-color: rgba(220,38,38,.7); box-shadow: 0 10px 26px rgba(220,38,38,.26); }
@media (max-width:760px){
  .d-sozdat-knopka span{ display:none; }
  .d-sozdat-knopka{ padding:10px 12px; }
}

/* ═══ ЧИПЫ «СОЗДАТЬ» — как теги: тихо в покое, наливаются при наведении ═══ */
.d-sozdat-knopka{
  padding:6px 12px !important; border-radius:999px !important;
  font-size:11px !important; font-weight:800 !important; letter-spacing:.02em;
  background: rgba(148,163,184,.10) !important; border:1px solid rgba(148,163,184,.16) !important;
  color:#94a3b8 !important; gap:7px !important;
}
.d-sozdat-knopka .fa-solid{ display:none; font-size:12px; }
.d-chip-tochka{
  width:7px; height:7px; border-radius:50%; flex-shrink:0; display:block;
  background: currentColor; box-shadow: 0 0 7px currentColor;
  transition: all .18s ease;
}
.d-sozdat-knopka:hover{ transform: translateY(-1px) !important; }
.d-sozdat-knopka:hover .d-chip-tochka{ display:none; }
.d-sozdat-knopka:hover .fa-solid{ display:block; }

.d-sk-vks{ color:#93c5fd !important; }
.d-sk-vks:hover{ background: rgba(59,130,246,.22) !important; border-color: rgba(59,130,246,.55) !important; color:#fff !important; box-shadow:0 8px 20px rgba(59,130,246,.25) !important; }
.d-sk-vstrecha{ color:#6ee7b7 !important; }
.d-sk-vstrecha:hover{ background: rgba(16,185,129,.22) !important; border-color: rgba(16,185,129,.55) !important; color:#fff !important; box-shadow:0 8px 20px rgba(16,185,129,.25) !important; }
.d-sk-sobytie{ color:#fcd34d !important; }
.d-sk-sobytie:hover{ background: rgba(245,158,11,.22) !important; border-color: rgba(245,158,11,.55) !important; color:#fff !important; box-shadow:0 8px 20px rgba(245,158,11,.25) !important; }
.d-sk-zvonok{ color:#fca5a5 !important; }
.d-sk-zvonok:hover{ background: rgba(220,38,38,.22) !important; border-color: rgba(220,38,38,.55) !important; color:#fff !important; box-shadow:0 8px 20px rgba(220,38,38,.25) !important; }

/* ═══ «ПЛЮС» НА ДНЕ — появляется при наведении ═══ */
.d-kletka{ position:relative; }
.d-plus{
  position:absolute; top:5px; right:5px; width:19px; height:19px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  opacity:0; transform: scale(.7);
  background: rgba(220,38,38,.9); color:#fff;
  transition: opacity .16s ease, transform .16s cubic-bezier(.2,.8,.2,1);
}
.d-plus::before{ content:"+"; font-size:14px; font-weight:900; line-height:1; font-style:normal; }
.d-kletka:hover .d-plus{ opacity:1; transform: scale(1); }
.d-plus:hover{ box-shadow: 0 0 0 4px rgba(220,38,38,.22); }
.d-mesyac-blok:not(.d-glavnyi) .d-plus{ display:none; }

/* день рождения в календаре */
.d-den-rozhdeniya{
  background: linear-gradient(180deg, rgba(236,72,153,.35), rgba(219,39,119,.35)) !important;
  color:#fbcfe8 !important; font-size:10px !important;
}
.d-stroka-dr{ border-left:3px solid #ec4899 !important; }

/* ═══ РАЗДЕЛ «РАЗРАБОТКА»: клетки были белыми ═══ */
#mode-dev [style*="background:#fff"], #mode-dev [style*="background: #fff"],
#mode-dev [style*="background:#eef1f5"], #mode-dev [style*="background:#f8fafc"]{
  background: rgba(15,23,42,.6) !important;
}
#mode-dev [ondrop], #mode-dev [ondragover]{
  background: rgba(15,23,42,.55) !important;
  border:1px solid var(--d-line) !important; border-radius:12px;
  color: var(--d-txt) !important;
}
#mode-dev [draggable="true"]{
  background: rgba(30,41,59,.62) !important; border:1px solid var(--d-line) !important;
  color: var(--d-txt) !important;
}
#mode-dev [draggable="true"]:hover{ border-color: rgba(220,38,38,.45) !important; }
#mode-dev, #mode-dev * { color: var(--d-txt); }
#mode-dev input, #mode-dev select, #mode-dev textarea{
  background: rgba(2,6,23,.6) !important; border-color: var(--d-line) !important; color:#f1f5f9 !important;
}

/* ═══════════ ДОРОЖКА ВЫПУСКОВ ═══════════ */
#mode-produkty.mode-content.active{ display:block !important; padding:16px 22px 26px; }
.d-prod-shapka{ display:flex; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.d-prod-vybor{ display:flex; gap:6px; flex-wrap:wrap; }
.d-prod-chip{
  padding:8px 15px; border-radius:999px; cursor:pointer; font-size:12px; font-weight:800;
  background: rgba(148,163,184,.10); border:1px solid rgba(148,163,184,.16); color:#94a3b8;
  transition: all .18s ease;
}
.d-prod-chip:hover{ color:#fff; border-color: rgba(220,38,38,.4); }
.d-prod-chip.d-vybran{
  background: linear-gradient(180deg,#1e293b,#0f172a); border-color:#dc2626; color:#fff;
  box-shadow: 0 8px 22px rgba(220,38,38,.2);
}
.d-prod-plus{ font-size:15px; padding:8px 14px; }
.d-soglas{ font-size:11.5px; font-weight:800; color:#fcd34d; }
.d-soglas b{ color:#fff; }

.d-dorozhka{ display:flex; gap:16px; overflow-x:auto; padding-bottom:12px; align-items:flex-start; }
.d-vypusk{
  flex:0 0 300px; min-width:300px; border-radius:16px; padding:14px;
  background: rgba(15,23,42,.66); border:1px solid var(--d-line);
  position:relative;
}
.d-vypusk::after{                       /* нить дорожки между выпусками */
  content:""; position:absolute; top:26px; right:-16px; width:16px; height:2px;
  background: linear-gradient(90deg, rgba(148,163,184,.35), rgba(148,163,184,.1));
}
.d-vypusk:last-child::after{ display:none; }
.d-v-shapka{ display:flex; align-items:center; gap:9px; margin-bottom:5px; }
.d-v-shapka b{ font-size:17px; font-weight:900; letter-spacing:-.03em; }
.d-v-tochka{
  width:11px; height:11px; border-radius:50%; flex-shrink:0;
  background: rgba(148,163,184,.5); box-shadow: 0 0 0 3px rgba(148,163,184,.12);
}
.d-v-uroven{
  font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.09em;
  padding:2px 8px; border-radius:999px; background: rgba(148,163,184,.16); color:#94a3b8;
}
.d-v-data{ font-size:11.5px; font-weight:700; color:#94a3b8; margin-bottom:10px; }

.d-u-bolshoe .d-v-tochka{ background:#a78bfa; box-shadow:0 0 0 4px rgba(167,139,250,.18); }
.d-u-bolshoe .d-v-uroven{ background: rgba(167,139,250,.2); color:#ddd6fe; }
.d-u-zaplatka{ flex:0 0 232px; min-width:232px; }
.d-u-zaplatka .d-v-tochka{ background:#f59e0b; box-shadow:0 0 0 3px rgba(245,158,11,.18); }
.d-u-zaplatka .d-v-uroven{ background: rgba(245,158,11,.2); color:#fde68a; }
.d-vyshel{ opacity:.86; }
.d-vyshel .d-v-tochka{ background:#10b981; box-shadow:0 0 0 4px rgba(16,185,129,.2); }
.d-vyshel .d-v-data{ color:#6ee7b7; }

.d-kachestvo{ display:flex; gap:8px; margin-bottom:9px; }
.d-k-nashli, .d-k-zakryli{
  font-size:10px; font-weight:800; padding:2px 8px; border-radius:999px;
}
.d-k-nashli{ background: rgba(220,38,38,.18); color:#fca5a5; }
.d-k-zakryli{ background: rgba(16,185,129,.18); color:#6ee7b7; }

.d-v-sostav{ display:flex; flex-direction:column; gap:5px; }
.d-punkt{
  display:flex; align-items:center; gap:7px; cursor:pointer;
  padding:8px 10px; border-radius:10px; font-size:12px; font-weight:700;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line); color:#e2e8f0;
  border-left-width:3px;
}
.d-punkt:hover{ border-color: rgba(220,38,38,.4); }
.d-p-bag{ border-left-color:#ef4444; }
.d-p-dor{ border-left-color:#64748b; }
.d-p-fun{ border-left-color:#3b82f6; }
.d-p-zap{ border-left-color:#f59e0b; }
.d-punkt.d-gotov{ opacity:.6; }
.d-punkt.d-gotov .d-p-imya{ text-decoration: line-through; }
.d-p-znak{ flex-shrink:0; font-size:12px; }
.d-p-imya{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d-p-kto{ margin-left:auto; font-size:10px; color:#94a3b8; flex-shrink:0; }
.d-pereezd{
  font-size:9.5px; font-weight:900; padding:1px 6px; border-radius:999px; flex-shrink:0;
  background: rgba(245,158,11,.22); color:#fcd34d;
}
.d-v-dobavit{
  margin-top:4px; padding:7px; border-radius:9px; cursor:pointer; font-size:11px; font-weight:800;
  background: transparent; border:1px dashed rgba(148,163,184,.3); color:#64748b;
}
.d-v-dobavit:hover{ border-color:#dc2626; color:#fff; }
.d-kopilka{ margin-top:18px; padding:14px; border-radius:14px; background: rgba(2,6,23,.4); border:1px dashed var(--d-line); }
.d-kop-shapka{ font-size:11.5px; font-weight:800; color:#94a3b8; margin-bottom:9px; text-transform:uppercase; letter-spacing:.06em; }
.d-prod-pusto{ color:#64748b; font-size:13px; padding:16px 4px; display:flex; align-items:center; gap:14px; }

/* ═══════════ ЛИНИЯ ЖИЗНИ ПРОДУКТА ═══════════ */
.d-liniya{
  display:flex; flex-direction:column; gap:4px; margin-bottom:22px;
  padding:14px; border-radius:16px;
  background: rgba(15,23,42,.5); border:1px solid var(--d-line);
  overflow-x:auto;
}
.d-l-stroka{ display:grid; grid-template-columns: 190px repeat(var(--stolbcov), minmax(96px, 1fr)); gap:4px; align-items:stretch; }
.d-l-imya{
  display:flex; align-items:center; gap:7px; padding:8px 10px; border-radius:9px;
  font-size:12px; font-weight:800; color:#cbd5e1; background: rgba(2,6,23,.4);
}
.d-l-shapka .d-l-imya{ background:transparent; }
.d-l-shapka .d-l-kletka{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
  background:transparent; border:0;
}
.d-l-shapka b{ font-size:13px; font-weight:900; color:#fff; }
.d-l-shapka span{ font-size:9.5px; color:#64748b; font-weight:700; }
.d-l-kletka{
  min-height:34px; border-radius:9px; padding:4px;
  background: rgba(2,6,23,.3); border:1px solid rgba(148,163,184,.08);
  display:flex; align-items:center;
}
.d-l-polosa{
  position:relative; width:100%; height:22px; border-radius:6px; overflow:hidden;
  background: rgba(59,130,246,.22); display:flex; align-items:center; justify-content:center;
}
.d-l-polosa span{
  position:absolute; left:0; top:0; bottom:0; border-radius:6px;
  background: linear-gradient(90deg, rgba(59,130,246,.55), rgba(59,130,246,.75));
}
.d-l-polosa b{ position:relative; font-size:10.5px; font-weight:900; color:#fff; }
.d-l-vyshla{ background: rgba(16,185,129,.22); }
.d-l-vyshla span{ background: linear-gradient(90deg, rgba(16,185,129,.55), rgba(16,185,129,.8)); }
.d-l-zamerla .d-l-imya{ color:#64748b; }
.d-l-tiho{
  margin-left:auto; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.08em;
  padding:2px 7px; border-radius:999px; background: rgba(245,158,11,.18); color:#fcd34d;
}
.d-liniya-pusto{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:14px; border-radius:14px; margin-bottom:20px;
  background: rgba(2,6,23,.35); border:1px dashed var(--d-line);
  color:#64748b; font-size:12.5px;
}
.d-l-plus{ margin-bottom:18px; }

/* ═══════════ КРУГ СОГЛАСОВАНИЯ В КАРТОЧКЕ ПУНКТА ═══════════ */
.d-pu-kod{ font-family:'JetBrains Mono',monospace; font-size:11px; color:#64748b; margin-left:auto; margin-right:10px; }
.d-krug{ margin-top:6px; }
.d-krug:empty{ display:none; }
.d-krug-shapka{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.09em;
  color:#94a3b8; margin-bottom:10px;
}
.d-krug-lenta{ display:flex; align-items:flex-start; gap:0; }
.d-k-shag{ display:flex; flex-direction:column; align-items:center; gap:3px; min-width:104px; text-align:center; }
.d-k-krug{
  width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:900;
  background: rgba(2,6,23,.5); border:2px solid var(--d-line); color:#64748b;
}
.d-k-imya{ font-size:10px; font-weight:800; color:#94a3b8; text-transform:uppercase; letter-spacing:.05em; }
.d-k-kto{ font-size:11.5px; font-weight:700; color:#e2e8f0; }
.d-k-kogda{ font-size:9.5px; color:#64748b; font-family:'JetBrains Mono',monospace; }
.d-k-proiden .d-k-krug{ border-color: rgba(16,185,129,.6); background: rgba(16,185,129,.18); color:#6ee7b7; }
.d-k-zhdyot .d-k-krug{
  border-color:#dc2626; background: linear-gradient(180deg,#ef4444,#b91c1c); color:#fff;
  box-shadow: 0 0 0 4px rgba(220,38,38,.16);
  animation: d-shag-puls 2.2s ease-in-out infinite;
}
.d-k-zhdyot .d-k-kto{ color:#fff; }
.d-k-otkaz .d-k-krug{ border-color: rgba(148,163,184,.4); background: rgba(148,163,184,.15); color:#94a3b8; }
.d-k-tiho{ opacity:.45; }
.d-k-nit{ flex:1 1 auto; height:2px; margin-top:17px; min-width:14px; background: var(--d-line); border-radius:2px; }
.d-krug-knopki{ display:flex; gap:8px; margin-top:14px; }
.d-krug-knopki button{ padding:8px 14px; border-radius:10px; cursor:pointer; font-size:11.5px; font-weight:800; }
.d-kn-soglas{ background: rgba(16,185,129,.2); border:1px solid rgba(16,185,129,.5); color:#6ee7b7; }
.d-kn-soglas:hover{ background: rgba(16,185,129,.35); color:#fff; }
.d-kn-vernut{ background: rgba(245,158,11,.18); border:1px solid rgba(245,158,11,.45); color:#fcd34d; }
.d-kn-otkaz{ background: rgba(220,38,38,.16); border:1px solid rgba(220,38,38,.45); color:#fca5a5; }
.d-kn-otkaz:hover{ background: rgba(220,38,38,.32); color:#fff; }
#punktModal{ display:none; }
#punktModal:not(.hidden){ display:flex !important; }

/* ═══ ВОПРОСЫ ПО ВИДУ ПУНКТА (шаблон полей) ═══ */
.d-dop{ display:flex; flex-direction:column; gap:11px; }
.d-dop:empty{ display:none; }
.d-dop-shapka{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.09em;
  color:#fcd34d; padding-top:4px; border-top:1px dashed var(--d-line); padding-bottom:2px;
}
.d-dop textarea, .d-dop input[type=text]{
  width:100%; padding:10px 12px; border-radius:11px; font-size:13px; font-weight:600;
  background: rgba(2,6,23,.6) !important; border:1px solid var(--d-line) !important; color:#f1f5f9 !important;
  outline:none;
}
.d-dop textarea:focus, .d-dop input:focus{ border-color:#dc2626 !important; box-shadow:0 0 0 1px rgba(220,38,38,.4); }
.d-nuzhno{ color:#dc2626; }

/* ═══ ФАЙЛЫ ВЫПУСКА ═══ */
#vypuskModal{ display:none; } #vypuskModal:not(.hidden){ display:flex !important; }
.d-fajly{ border-top:1px dashed var(--d-line); padding-top:12px; }
.d-fajly-shapka{ display:flex; align-items:center; justify-content:space-between; margin-bottom:9px; }
.d-fajly-shapka span{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.09em; color:#94a3b8;
}
.d-fajl-knopka{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:7px 13px; border-radius:10px; font-size:11px; font-weight:800;
  background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-fajl-knopka:hover{ border-color:#dc2626; color:#fff; }
.d-fajly-spisok{ display:flex; flex-direction:column; gap:6px; }
.d-fajl{
  display:flex; align-items:center; gap:9px; padding:8px 11px; border-radius:10px;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line);
}
.d-fajl i{ color:#94a3b8; font-size:12px; }
.d-fajl a{ color:#93c5fd; font-size:12.5px; font-weight:700; text-decoration:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.d-fajl a:hover{ color:#fff; text-decoration:underline; }
.d-fajl-ves{ margin-left:auto; font-size:10.5px; color:#64748b; font-family:'JetBrains Mono',monospace; flex-shrink:0; }
.d-fajl-ubrat{
  width:24px; height:24px; border-radius:7px; cursor:pointer; flex-shrink:0;
  background: rgba(220,38,38,.14); border:1px solid rgba(220,38,38,.35); color:#fca5a5; font-size:11px;
}
.d-fajl-ubrat:hover{ background: rgba(220,38,38,.32); color:#fff; }
/* у выпуска с файлами — скрепка на дорожке */
.d-vypusk .d-v-shapka:hover b{ color:#fff; text-decoration:underline; }

/* ═══════════ ЛИНИЯ ВРЕМЕНИ ПРОДУКТА ═══════════ */
.d-lv{
  display:flex; flex-direction:column; gap:5px; margin-bottom:22px;
  padding:16px 14px 14px; border-radius:16px;
  background: rgba(15,23,42,.5); border:1px solid var(--d-line);
}
.d-lv-stroka{ display:grid; grid-template-columns: 190px 1fr; gap:10px; align-items:center; }
.d-lv-imya{
  display:flex; align-items:center; gap:7px; padding:7px 10px; border-radius:9px;
  font-size:12px; font-weight:800; color:#cbd5e1; background: rgba(2,6,23,.4);
}
.d-lv-pole{ position:relative; min-height:30px; }
.d-lv-shkala{ margin-bottom:26px; }
.d-lv-shkala .d-lv-pole{ display:flex; border-bottom:2px solid var(--d-line); padding-bottom:4px; }
.d-lv-mesyac{
  font-size:9.5px; font-weight:800; text-transform:uppercase; letter-spacing:.06em;
  color:#64748b; text-align:center; border-left:1px solid rgba(148,163,184,.14); flex-shrink:0;
  white-space:nowrap; overflow:hidden;
}
.d-lv-segodnya{
  position:absolute; top:-4px; bottom:-8px; width:2px; border-radius:2px;
  background: linear-gradient(180deg, rgba(220,38,38,.9), rgba(220,38,38,.2));
  box-shadow: 0 0 10px rgba(220,38,38,.6);
}
.d-lv-vypuski{ position:absolute; left:0; right:0; top:22px; height:0; }
.d-lv-vypusk{
  position:absolute; transform: translateX(-50%); cursor:pointer; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:3px;
}
.d-lv-tochka{
  width:13px; height:13px; border-radius:50%;
  background: rgba(148,163,184,.6); box-shadow: 0 0 0 3px rgba(148,163,184,.14);
}
.d-lv-vypusk b{ font-size:11px; font-weight:900; color:#cbd5e1; white-space:nowrap; }
.d-lv-vypusk:hover b{ color:#fff; }
.d-lv-vypusk.d-u-bolshoe .d-lv-tochka{ background:#a78bfa; box-shadow:0 0 0 4px rgba(167,139,250,.2); }
.d-lv-vypusk.d-u-zaplatka .d-lv-tochka{ width:9px; height:9px; background:#f59e0b; }
.d-lv-vypusk.d-vyshel .d-lv-tochka{ background:#10b981; box-shadow:0 0 0 4px rgba(16,185,129,.22); }
.d-lv-vypusk.d-vyshel b{ color:#6ee7b7; }
.d-lv-polosa{
  position:absolute; transform: translateX(-50%); top:3px;
  min-width:44px; height:22px; border-radius:7px; overflow:hidden;
  background: rgba(59,130,246,.24);
  display:flex; align-items:center; justify-content:center;
}
.d-lv-polosa span{
  position:absolute; left:0; top:0; bottom:0; border-radius:7px;
  background: linear-gradient(90deg, rgba(59,130,246,.5), rgba(59,130,246,.8));
}
.d-lv-polosa b{ position:relative; font-size:10.5px; font-weight:900; color:#fff; }
.d-lv-polosa.d-l-vyshla{ background: rgba(16,185,129,.24); }
.d-lv-polosa.d-l-vyshla span{ background: linear-gradient(90deg, rgba(16,185,129,.5), rgba(16,185,129,.85)); }
.d-lv-tiho .d-lv-imya{ color:#64748b; }

/* ═══ ПЕРЕКЛЮЧАТЕЛЬ ВИДОВ И ПОТОК ═══ */
.d-vidy{ display:flex; gap:4px; padding:3px; border-radius:999px; background: rgba(2,6,23,.45); }
.d-vid{
  padding:6px 15px; border-radius:999px; cursor:pointer; font-size:11.5px; font-weight:800;
  background:transparent; border:0; color:#94a3b8;
}
.d-vid.d-vybran{ background: rgba(220,38,38,.85); color:#fff; }
.d-potok{ display:flex; gap:12px; overflow-x:auto; padding-bottom:10px; align-items:flex-start; }
.d-potok-kolonka{
  flex:1 1 0; min-width:220px; border-radius:14px; padding:12px;
  background: rgba(15,23,42,.6); border:1px solid var(--d-line);
}
.d-potok-shapka{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.d-potok-shapka b{ font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:.07em; color:#cbd5e1; }
.d-potok-shapka span{
  font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:999px;
  background: rgba(148,163,184,.18); color:#94a3b8;
}
.d-potok-spisok{ display:flex; flex-direction:column; gap:5px; min-height:60px; }
.d-potok-pusto{ color:#475569; font-size:12px; text-align:center; padding:12px 0; }

/* даты на карточке пункта */
.d-p-daty{
  margin-left:auto; flex-shrink:0; font-size:10px; font-weight:700; color:#94a3b8;
  font-family:'JetBrains Mono', monospace; white-space:nowrap;
  padding:2px 7px; border-radius:999px; background: rgba(148,163,184,.12);
}
.d-punkt .d-p-kto{ margin-left:8px; }

/* ═══ КАРТОЧКА ПУНКТА: две строки, всё видно ═══ */
.d-punkt{
  display:flex !important; flex-direction:column; gap:6px; align-items:stretch !important;
  padding:9px 11px !important;
}
.d-p-verh{ display:flex; align-items:center; gap:7px; min-width:0; }
.d-p-niz{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.d-p-imya{ flex:1 1 auto; min-width:0; font-size:12.5px; font-weight:700; }
.d-p-vazhno{
  flex-shrink:0; width:16px; height:16px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:#dc2626; color:#fff; font-size:10px; font-weight:900;
}
.d-p-sost{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.06em;
  padding:2px 8px; border-radius:999px; flex-shrink:0;
}
.d-s-pred{ background: rgba(148,163,184,.18); color:#cbd5e1; }
.d-s-sogl{ background: rgba(245,158,11,.22); color:#fcd34d; }
.d-s-plan{ background: rgba(59,130,246,.22); color:#93c5fd; }
.d-s-rab{  background: rgba(6,182,212,.22); color:#67e8f9; }
.d-s-vyp{  background: rgba(16,185,129,.22); color:#6ee7b7; }
.d-s-otk{  background: rgba(148,163,184,.14); color:#94a3b8; }
.d-p-ocenka{
  font-size:10px; font-weight:800; color:#94a3b8; flex-shrink:0;
  font-family:'JetBrains Mono',monospace;
  padding:2px 7px; border-radius:999px; background: rgba(148,163,184,.1);
}
.d-p-daty{
  margin-left:0 !important; font-size:10px; font-weight:700; color:#cbd5e1;
  font-family:'JetBrains Mono',monospace; white-space:nowrap;
  padding:2px 8px; border-radius:999px; background: rgba(148,163,184,.12);
}
.d-p-daty em{ font-style:normal; color:#94a3b8; }
.d-net-srokov{ color:#64748b !important; background: transparent !important; border:1px dashed rgba(148,163,184,.22); }
.d-punkt .d-p-kto{ margin-left:auto; font-size:10px; color:#94a3b8; }

/* «без сроков» — это не мелочь, а недоделка: должно быть видно */
.d-net-srokov{
  color:#fcd34d !important;
  background: rgba(245,158,11,.16) !important;
  border:1px solid rgba(245,158,11,.4) !important;
  font-weight:800 !important;
  text-transform:uppercase; letter-spacing:.05em; font-size:9.5px !important;
}
.d-p-daty{ color:#e2e8f0 !important; }
.d-p-daty em{ color:#94a3b8 !important; }

/* ═══ ПУНКТЫ ПОД ЧАСТЯМИ ПРОДУКТА ═══ */
.d-chast-gruppa{ margin-bottom:10px; }
.d-chast-gruppa:last-of-type{ margin-bottom:4px; }
.d-chast-zagolovok{
  display:flex; align-items:center; gap:8px; margin-bottom:5px; padding:0 2px;
}
.d-chast-imya{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; color:#93c5fd;
}
.d-chast-schet{
  margin-left:auto; font-size:9.5px; font-weight:800; color:#64748b;
  font-family:'JetBrains Mono',monospace;
  padding:1px 7px; border-radius:999px; background: rgba(148,163,184,.1);
}
.d-chast-zagolovok::after{
  content:""; position:absolute;
}
.d-chast-punkty{
  display:flex; flex-direction:column; gap:5px;
  padding-left:9px; border-left:2px solid rgba(59,130,246,.28); border-radius:2px;
}
.d-siroty .d-chast-imya{ color:#64748b; }
.d-siroty .d-chast-punkty{ border-left-color: rgba(148,163,184,.2); }

/* ═══ ЛИНИЯ ВРЕМЕНИ ОТ КРАЯ ДО КРАЯ ═══ */
.d-lv{ padding:16px 10px 14px !important; }
.d-lv-stroka{ grid-template-columns: 132px 1fr !important; gap:8px !important; }
.d-lv-imya{ padding:6px 8px !important; font-size:11px !important; }
.d-lv-imya .d-l-tiho{ font-size:8px; padding:1px 5px; }
#mode-produkty.mode-content.active{ padding:14px 14px 26px !important; }

/* ═══ ВЫПУСК ТЯНЕТСЯ ПО ЛИНИИ ═══ */
.d-lv-vypusk{ cursor: grab; user-select:none; }
.d-lv-vypusk:active, .d-lv-vypusk.d-tyanem{ cursor: grabbing; }
.d-lv-vypusk.d-tyanem .d-lv-tochka{
  transform: scale(1.35); box-shadow: 0 0 0 6px rgba(220,38,38,.2) !important;
}
.d-lv-vypusk.d-tyanem b{ color:#fff; }
.d-lv-podskazka{
  position:absolute; top:-34px; transform:translateX(-50%);
  padding:4px 10px; border-radius:8px; white-space:nowrap; pointer-events:none;
  background:#dc2626; color:#fff; font-size:11px; font-weight:800;
  box-shadow:0 8px 20px rgba(220,38,38,.35);
}

/* ═══ ЛИНИЯ ВРЕМЕНИ: ЧАСТИ ЧИПАМИ СВЕРХУ, ШКАЛА ВО ВСЮ ШИРИНУ ═══ */
.d-lv{ display:block !important; padding:14px 14px 18px !important; }
.d-lv-chipy{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px; }
.d-lv-chip{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:6px 12px; border-radius:999px; font-size:11px; font-weight:800;
  background: rgba(148,163,184,.10); border:1px solid rgba(148,163,184,.16); color:#cbd5e1;
  transition: all .18s ease;
}
.d-lv-tochka-cveta{
  width:8px; height:8px; border-radius:50%; background: var(--cvet); box-shadow:0 0 7px var(--cvet);
}
.d-lv-chip b{
  font-size:10px; padding:1px 6px; border-radius:999px;
  background: rgba(255,255,255,.1); color:#fff;
}
.d-lv-chip em{
  font-style:normal; font-size:8.5px; font-weight:900; text-transform:uppercase; letter-spacing:.06em;
  color:#fcd34d; padding:1px 6px; border-radius:999px; background: rgba(245,158,11,.16);
}
.d-lv-chip:hover{ border-color: var(--cvet); color:#fff; }
.d-lv-chip.d-vybran{ background: color-mix(in srgb, var(--cvet) 22%, transparent); border-color: var(--cvet); color:#fff; }
.d-lv-chip.d-tiho{ opacity:.65; }

.d-lv-shirokoe{ position:relative; width:100%; }
.d-lv-shkala-ryad{ display:flex; border-bottom:2px solid var(--d-line); padding-bottom:4px; margin-bottom:30px; }
.d-lv-polosy{ position:relative; width:100%; }
.d-lv-kusok{
  position:absolute; transform:translateX(-50%);
  min-width:46px; height:21px; border-radius:7px; overflow:hidden;
  background: color-mix(in srgb, var(--cvet) 26%, transparent);
  display:flex; align-items:center; justify-content:center;
}
.d-lv-kusok span{
  position:absolute; left:0; top:0; bottom:0; border-radius:7px;
  background: color-mix(in srgb, var(--cvet) 75%, transparent);
}
.d-lv-kusok b{ position:relative; font-size:10.5px; font-weight:900; color:#fff; }

/* перенос пунктов в потоке */
.d-potok-kolonka.d-nad{
  background: rgba(220,38,38,.08) !important;
  box-shadow: inset 0 0 0 2px rgba(220,38,38,.4);
}
.d-potok .d-punkt{ cursor: grab; }
.d-potok .d-punkt:active{ cursor: grabbing; transform:none !important; }

/* карточка не теряет вид при переносе */
.d-punkt.d-tashim{
  box-sizing:border-box !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.6), 0 0 0 1px rgba(220,38,38,.4) !important;
  background: rgba(30,41,59,.95) !important;
  transform:none !important; transition:none !important;
}
.d-punkt.d-vzyato-mesto{ opacity:.4; }
/* колонки потока держат ширину, пока таскаем */
.d-potok-kolonka{ box-sizing:border-box; }
.d-potok-spisok{ min-height:80px; }

/* «На доработку» — отдельное состояние, видно что вернули */
.d-s-dor{ background: rgba(249,115,22,.24) !important; color:#fdba74 !important; }
.d-potok-kolonka[data-etap="na_dorabotku"] .d-potok-shapka b{ color:#fdba74; }
.d-potok-kolonka[data-etap="na_dorabotku"]{ border-color: rgba(249,115,22,.35); }

/* переключатель видов над потоком */
.d-potok-vidy{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; }
.d-potok-vid{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:7px 14px; border-radius:999px; font-size:11.5px; font-weight:800;
  background: rgba(148,163,184,.10); border:1px solid rgba(148,163,184,.16); color:#cbd5e1;
}
.d-potok-vid b{ font-size:10px; padding:1px 6px; border-radius:999px; background: rgba(255,255,255,.12); }
.d-potok-vid:hover{ color:#fff; border-color: rgba(220,38,38,.4); }
.d-potok-vid.d-vybran{
  background: linear-gradient(180deg,#1e293b,#0f172a); border-color:#dc2626; color:#fff;
  box-shadow: 0 8px 20px rgba(220,38,38,.2);
}
.d-potok-kolonka[data-etap="naiden"]{ border-color: rgba(239,68,68,.35); }
.d-potok-kolonka[data-etap="naiden"] .d-potok-shapka b{ color:#fca5a5; }
.d-potok-kolonka[data-etap="na_proverke"] .d-potok-shapka b{ color:#67e8f9; }
.d-potok-kolonka[data-etap="zakryt"] .d-potok-shapka b{ color:#6ee7b7; }

/* итоговые колонки потока — тише рабочих: путь там кончается */
.d-potok-kolonka.d-tupik{ background: rgba(2,6,23,.35); border-style:dashed; }
.d-potok-kolonka[data-etap="otkloneno"] .d-potok-shapka b{ color:#94a3b8; }
.d-potok-kolonka[data-etap="vypuscheno"] .d-potok-shapka b{ color:#6ee7b7; }
.d-potok-kolonka.d-tupik .d-potok-spisok{ opacity:.85; }

/* ═══════════ ПРЕДЛОЖКА: ВХОДЯЩИЕ ПОЖЕЛАНИЯ ═══════════ */
.d-vid-schet{
  margin-left:6px; font-size:10px; padding:1px 6px; border-radius:999px;
  background:#dc2626; color:#fff;
}
.d-predlozhka-shapka{ display:flex; align-items:center; gap:14px; margin-bottom:16px; flex-wrap:wrap; }
.d-predlozhka-shapka b{ font-size:14px; font-weight:900; }
.d-predlozhka-shapka span{ font-size:11.5px; color:#94a3b8; font-weight:700; }
.d-vhod{
  padding:14px 16px; border-radius:14px; margin-bottom:10px;
  background: rgba(15,23,42,.66); border:1px solid var(--d-line);
  border-left:3px solid #f59e0b;
}
.d-vhod:hover{ border-color: rgba(245,158,11,.5); }
.d-vhod-verh{ display:flex; align-items:center; gap:9px; margin-bottom:6px; }
.d-vhod-znak{ font-size:14px; }
.d-vhod-verh b{ font-size:13.5px; font-weight:800; cursor:pointer; }
.d-vhod-verh b:hover{ color:#fff; text-decoration:underline; }
.d-vhod-kogda{
  margin-left:auto; font-size:10px; color:#64748b; font-family:'JetBrains Mono',monospace;
}
.d-vhod-text{ font-size:12.5px; color:#94a3b8; line-height:1.5; margin-bottom:10px; }
.d-vhod-knopki{ display:flex; gap:7px; flex-wrap:wrap; }
.d-vhod-knopki button{ padding:7px 14px; border-radius:10px; cursor:pointer; font-size:11.5px; font-weight:800; }
.d-vh-dor{ background: rgba(59,130,246,.2); border:1px solid rgba(59,130,246,.5); color:#93c5fd; }
.d-vh-dor:hover{ background: rgba(59,130,246,.35); color:#fff; }
.d-vh-fun{ background: rgba(16,185,129,.18); border:1px solid rgba(16,185,129,.45); color:#6ee7b7; }
.d-vh-fun:hover{ background: rgba(16,185,129,.32); color:#fff; }
.d-vh-otk{ background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#94a3b8; }
.d-vh-otk:hover{ background: rgba(220,38,38,.25); color:#fff; border-color: rgba(220,38,38,.5); }

.d-s-naid{ background: rgba(239,68,68,.22) !important; color:#fca5a5 !important; }
.d-s-prov{ background: rgba(6,182,212,.22) !important; color:#67e8f9 !important; }

/* ═══════════ ЗАКЛАДКИ ПРОДУКТА ═══════════ */
.d-zakladki{ display:flex; gap:5px; flex-wrap:wrap; }
.d-zakladka{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:9px 16px; border-radius:12px 12px 0 0; font-size:12px; font-weight:800;
  background: rgba(15,23,42,.5); border:1px solid var(--d-line); border-bottom:0; color:#94a3b8;
  transition: all .16s ease;
}
.d-zakladka:hover{ color:#fff; background: rgba(30,41,59,.7); }
.d-zakladka.d-vybran{
  background: rgba(15,23,42,.9); color:#fff;
  border-color: rgba(220,38,38,.55);
  box-shadow: inset 0 2px 0 #dc2626;
}
.d-z-znak{ font-size:13px; }
.d-z-schet{
  font-size:10px; padding:1px 7px; border-radius:999px;
  background: rgba(148,163,184,.2); color:#cbd5e1;
}
.d-z-srochno{
  font-size:10px; padding:1px 7px; border-radius:999px;
  background:#dc2626; color:#fff;
  animation: d-gorit 1.8s ease-in-out infinite;
}
.d-vidy{ display:none; }
.d-potok-vidy{ display:none; }

/* ═══════════ СВОДКА ПРОДУКТА ═══════════ */
.d-svodka{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
  gap:10px; margin-bottom:18px;
}
.d-sv-plitka{
  padding:14px 15px; border-radius:15px;
  background: rgba(15,23,42,.66); border:1px solid var(--d-line);
  transition: transform .18s ease, border-color .18s ease;
}
.d-sv-plitka:hover{ transform: translateY(-2px); border-color: rgba(148,163,184,.3); }
.d-sv-verh{ display:flex; align-items:baseline; gap:9px; }
.d-sv-znak{ font-size:15px; }
.d-sv-verh b{ font-size:26px; font-weight:900; letter-spacing:-.04em; color:#fff; line-height:1; }
.d-sv-imya{
  margin-top:6px; font-size:10px; font-weight:800; text-transform:uppercase;
  letter-spacing:.07em; color:#94a3b8;
}
.d-sv-podpis{ margin-top:3px; font-size:10.5px; color:#64748b; font-weight:600; }
.d-sv-polosa{
  margin-top:8px; height:6px; border-radius:6px; overflow:hidden;
  background: rgba(148,163,184,.16);
}
.d-sv-polosa span{
  display:block; height:100%; border-radius:6px;
  background: linear-gradient(90deg, rgba(16,185,129,.6), rgba(16,185,129,.95));
}
.d-sv-vypusk{ border-color: rgba(167,139,250,.35); }
.d-sv-vypusk .d-sv-verh b{ font-size:22px; color:#ddd6fe; }
.d-sv-srochno{ border-color: rgba(220,38,38,.5); background: rgba(220,38,38,.08); }
.d-sv-srochno .d-sv-verh b{ color:#fca5a5; }
.d-sv-bag .d-sv-verh b{ color:#fca5a5; }
.d-sv-fun .d-sv-verh b{ color:#93c5fd; }
.d-sv-dor .d-sv-verh b{ color:#cbd5e1; }
.d-sv-gorit{ border-color: rgba(220,38,38,.55); background: rgba(220,38,38,.1); }
.d-sv-gorit .d-sv-verh b{ color:#fff; }
.d-sv-gorit .d-sv-znak{ animation: d-gorit 1.6s ease-in-out infinite; border-radius:50%; }
.d-sv-net-srokov{ border-color: rgba(245,158,11,.4); }
.d-sv-net-srokov .d-sv-verh b{ color:#fcd34d; }
.d-sv-tiho{ opacity:.62; }
.d-sv-tiho .d-sv-verh b{ color:#94a3b8; }

/* итоги по продукту — строкой под плитками */
.d-sv-itogi{
  display:flex; flex-wrap:wrap; align-items:center; gap:18px;
  padding:11px 15px; border-radius:13px; margin-bottom:18px;
  background: rgba(2,6,23,.4); border:1px dashed var(--d-line);
}
.d-sv-itog-imya{
  font-size:9.5px; font-weight:900; text-transform:uppercase; letter-spacing:.09em; color:#64748b;
}
.d-sv-itog{ font-size:11.5px; color:#94a3b8; font-weight:700; }
.d-sv-itog b{ color:#e2e8f0; font-size:14px; font-weight:900; margin-right:3px; }
.d-sv-itog em{ font-style:normal; color:#6ee7b7; font-weight:800; }

.d-vh-sogl{ background: rgba(245,158,11,.2); border:1px solid rgba(245,158,11,.5); color:#fcd34d; }
.d-vh-sogl:hover{ background: rgba(245,158,11,.35); color:#fff; }
.d-vhod-soglasovano{
  font-size:11px; font-weight:800; color:#6ee7b7; margin-right:6px;
  display:inline-flex; align-items:center;
}

.d-vh-prod{
  background: rgba(167,139,250,.18); border:1px solid rgba(167,139,250,.5); color:#ddd6fe;
}
.d-vh-prod:hover{ background: rgba(167,139,250,.35); color:#fff; }

/* линия времени — общая шапка продукта */
.d-lv{ margin-bottom:14px !important; }
.d-zakladki{ margin-top:4px; }
.d-lv-sostavy{ position:relative; width:100%; height:26px; margin-top:4px; }
.d-lv-sostav{
  position:absolute; transform:translateX(-50%); display:flex; gap:4px; white-space:nowrap;
}
.d-lv-vid{
  font-size:10px; font-weight:800; padding:2px 7px; border-radius:999px;
  background: rgba(148,163,184,.14); color:#cbd5e1;
}
.d-lv-v-bag{ background: rgba(239,68,68,.2); color:#fca5a5; }
.d-lv-v-dorabotka{ background: rgba(148,163,184,.18); color:#cbd5e1; }
.d-lv-v-funkciya{ background: rgba(59,130,246,.2); color:#93c5fd; }
.d-lv-v-zapros{ background: rgba(245,158,11,.2); color:#fcd34d; }

/* ═══ ШИЛЬДИКИ: ЧЕМ СМОТРЕТЬ ПРОДУКТ ═══ */
.d-shildiki{ display:flex; gap:5px; margin-bottom:12px; }
.d-shild{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  padding:8px 16px; border-radius:999px; font-size:12px; font-weight:800;
  background: rgba(2,6,23,.45); border:1px solid var(--d-line); color:#94a3b8;
  transition: all .16s ease;
}
.d-shild:hover{ color:#fff; border-color: rgba(148,163,184,.35); }
.d-shild.d-vybran{
  background: linear-gradient(180deg,#1e293b,#0f172a); color:#fff;
  border-color: rgba(220,38,38,.6); box-shadow: 0 8px 20px rgba(220,38,38,.18);
}
.d-dorozhka-verh{ margin-bottom:14px; }

/* ═══ ЭКРАН «ВРЕМЯ» — во всю область ═══ */
.d-vremya-ekran{ display:block; }
.d-vremya-ekran .d-lv{
  margin-bottom:0 !important; padding:18px 16px 22px !important;
  min-height: 46vh;
}
.d-vremya-ekran .d-lv-shkala-ryad{ margin-bottom:40px; }
.d-vremya-ekran .d-lv-vypusk b{ font-size:12.5px; }
.d-vremya-ekran .d-lv-tochka{ width:15px; height:15px; }
.d-zakladka-telo{ padding-top:2px; }
/* шапка продукта: чипы слева, шильдики по центру, кнопка справа */
.d-prod-shapka{ align-items:center; }
.d-prod-shapka .d-shildiki{ margin-bottom:0; margin-left:auto; }
.d-prod-shapka .d-str-dobavit{ margin-left:0; }
.d-vidy, .d-potok-vidy{ display:none !important; }

/* кто нашёл баг */
.d-p-nashel{
  font-size:10px; font-weight:700; color:#fca5a5; flex-shrink:0;
  padding:2px 7px; border-radius:999px; background: rgba(239,68,68,.12);
}
/* плитки статистики кликабельны */
.d-sv-klik{ cursor:pointer; }
.d-sv-klik:hover{ border-color: rgba(220,38,38,.5) !important; }
.d-shildiki{ display:none; }

/* ═══════════ ПОСТОЯННАЯ ОБЛАСТЬ ПРОДУКТА ═══════════
   Продукт и его временная шкала не уезжают: закладки и списки
   прокручиваются под ними, а шапка остаётся на месте. */
.d-prod-oblast{
  position: sticky; top: 0; z-index: 30;
  margin: -14px -14px 12px;
  padding: 14px 16px 12px;
  border-radius: 0 0 20px 20px;
  background: linear-gradient(180deg, rgba(15,23,42,.97), rgba(15,23,42,.93));
  backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid var(--d-line);
  box-shadow: 0 14px 34px rgba(0,0,0,.4);
}
.d-prod-oblast::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background: linear-gradient(90deg, transparent, rgba(220,38,38,.5) 25%, rgba(59,130,246,.4) 70%, transparent);
}
.d-prod-oblast .d-prod-shapka{ margin-bottom:10px; }
.d-prod-oblast .d-lv{
  margin-bottom:0 !important; padding:12px 12px 10px !important;
  background: rgba(2,6,23,.35); border-color: rgba(148,163,184,.12);
}
/* шкала компактнее в шапке, но читаемая */
.d-prod-oblast .d-lv-chipy{ margin-bottom:10px; }
.d-prod-oblast .d-lv-sostavy{ height:22px; }
.d-zakladki{ position: sticky; top: 0; z-index: 25; }
#mode-produkty.mode-content.active{ padding-top:14px !important; }

/* ═══ ШКАЛА ОТ КРАЯ ДО КРАЯ ═══ */
.d-prod-oblast{ padding-left:0 !important; padding-right:0 !important; }
.d-prod-oblast .d-prod-shapka{ padding:0 16px; }
.d-prod-oblast .d-lv{
  border-radius:0 !important; border-left:0 !important; border-right:0 !important;
  padding-left:0 !important; padding-right:0 !important;
  background: transparent !important;
}
.d-prod-oblast .d-lv-chipy{ padding:0 16px; }
.d-prod-oblast .d-lv-shirokoe{ padding:0 6px; }
/* края шкалы дышат, но полосы идут до самого края */
.d-lv-shkala-ryad{ margin-bottom:34px !important; }
.d-lv-mesyac:first-child{ border-left:0; }

/* ═══ ТОЧКИ ВЫПУСКОВ КРУПНЕЕ ═══ */
.d-lv-tochka{
  width:18px !important; height:18px !important;
  box-shadow: 0 0 0 5px rgba(148,163,184,.12), 0 4px 12px rgba(0,0,0,.4) !important;
}
.d-lv-vypusk b{ font-size:14px !important; font-weight:900 !important; letter-spacing:-.02em; }
.d-lv-vypusk.d-u-bolshoe .d-lv-tochka{
  width:22px !important; height:22px !important;
  box-shadow: 0 0 0 6px rgba(167,139,250,.18), 0 4px 14px rgba(0,0,0,.45) !important;
}
.d-lv-vypusk.d-u-zaplatka .d-lv-tochka{ width:13px !important; height:13px !important; }
.d-lv-vypusk.d-vyshel .d-lv-tochka{ box-shadow: 0 0 0 5px rgba(16,185,129,.22), 0 4px 12px rgba(0,0,0,.4) !important; }
.d-lv-vypuski{ top:26px !important; }

/* ═══ ТАБЛИЧКА СОСТАВА ПОД ВЫПУСКОМ — читаемая карточка ═══ */
.d-lv-sostavy{ height:42px !important; margin-top:16px !important; }
.d-lv-sostav{
  display:flex !important; gap:5px !important; align-items:center;
  padding:6px 9px; border-radius:11px;
  background: rgba(2,6,23,.72); border:1px solid rgba(148,163,184,.18);
  box-shadow: 0 6px 18px rgba(0,0,0,.4);
}
.d-lv-vid{
  font-size:12px !important; font-weight:900 !important;
  padding:3px 9px !important; border-radius:8px !important;
  display:inline-flex; align-items:center; gap:3px;
}
.d-lv-v-bag{ background: rgba(239,68,68,.28) !important; color:#fecaca !important; }
.d-lv-v-dorabotka{ background: rgba(148,163,184,.24) !important; color:#e2e8f0 !important; }
.d-lv-v-funkciya{ background: rgba(59,130,246,.28) !important; color:#bfdbfe !important; }
.d-lv-v-zapros{ background: rgba(245,158,11,.28) !important; color:#fde68a !important; }
/* полосы частей — ниже табличек, чтобы не наезжали */
.d-lv-polosy{ margin-top:6px; }
.d-prod-oblast .d-lv-shirokoe{ padding-bottom:6px; }

/* чип «Все продукты» — общая картина по умолчанию */
.d-prod-vse{ border-color: rgba(167,139,250,.4) !important; color:#ddd6fe !important; }
.d-prod-vse.d-vybran{
  background: linear-gradient(180deg, rgba(167,139,250,.3), rgba(109,40,217,.25)) !important;
  border-color:#a78bfa !important; color:#fff !important;
  box-shadow: 0 8px 22px rgba(167,139,250,.25) !important;
}

/* продукт на карточке пункта — в общем виде */
.d-p-produkt{
  font-size:9.5px; font-weight:800; padding:2px 8px; border-radius:999px;
  background: rgba(167,139,250,.2); color:#ddd6fe; flex-shrink:0;
}

/* ═══ ОБЛАСТЬ ПРОДУКТОВ — своя панель над временем ═══ */
.d-prod-oblast .d-prod-shapka{
  margin: 0 12px 12px !important;
  padding: 11px 14px !important;
  border-radius: 14px;
  background: rgba(2,6,23,.55);
  border: 1px solid var(--d-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
  position: relative;
}
.d-prod-oblast .d-prod-shapka::before{
  content: "Продукты";
  position: absolute; top: -8px; left: 14px;
  padding: 1px 8px; border-radius: 999px;
  background: #0f172a; border: 1px solid var(--d-line);
  font-size: 8.5px; font-weight: 900; letter-spacing: .1em;
  text-transform: uppercase; color: #64748b;
}
.d-prod-oblast .d-prod-vybor{ gap:7px; }
.d-prod-chip{ padding:7px 14px; }
/* шкала под панелью — с воздухом */
.d-prod-oblast .d-lv{ padding-top:6px !important; }
.d-prod-oblast .d-lv-chipy{ padding:0 14px; margin-bottom:12px; }

/* ═══ ПРОДУКТЫ — СВОЕЙ СТРОКОЙ, КНОПКА ОТДЕЛЬНО ═══ */
.d-prod-oblast .d-prod-shapka{
  display: flex !important; flex-direction: column; align-items: stretch; gap: 10px;
}
.d-prod-oblast .d-prod-vybor{
  display: flex; flex-wrap: wrap; gap: 7px; width: 100%;
}
.d-prod-oblast .d-prod-shapka .d-str-dobavit{
  align-self: flex-start; margin-left: 0 !important;
}
.d-prod-oblast .d-soglas{ align-self: flex-start; }
/* если продуктов много — строка переносится, а не жмётся */
.d-prod-chip{ flex: 0 0 auto; white-space: nowrap; }

/* ═══════════ ТАБЛИЧКА СО СТАТИСТИКОЙ ═══════════ */
.d-tabl{
  display:flex; flex-direction:column; gap:4px;
  padding:10px 12px; margin:0 12px 12px;
  border-radius:14px;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line);
}
.d-tabl-stroka{
  display:flex; align-items:center; gap:10px; cursor:pointer; width:100%;
  padding:8px 11px; border-radius:10px; text-align:left;
  background: transparent; border:1px solid transparent; color:#cbd5e1;
  transition: all .16s ease;
}
.d-tabl-stroka:hover{ background: rgba(148,163,184,.08); border-color: rgba(148,163,184,.18); }
.d-tabl-stroka.d-vybran{
  background: color-mix(in srgb, var(--cvet) 16%, transparent);
  border-color: var(--cvet);
}
.d-tabl-cvet{
  width:10px; height:10px; border-radius:50%; flex-shrink:0;
  background: var(--cvet); box-shadow: 0 0 8px var(--cvet);
}
.d-tabl-imya{
  flex:1 1 auto; min-width:0; font-size:12.5px; font-weight:800;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.d-tabl-cifry{ display:flex; gap:5px; flex-shrink:0; }
.d-tc{
  font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:999px;
  white-space:nowrap;
}
.d-tc-bag{ background: rgba(239,68,68,.22); color:#fca5a5; }
.d-tc-raz{ background: rgba(59,130,246,.22); color:#93c5fd; }
.d-tc-dor{ background: rgba(148,163,184,.2); color:#cbd5e1; }
.d-tc-zap{ background: rgba(245,158,11,.22); color:#fcd34d; }
.d-tc-tiho{
  background: rgba(245,158,11,.14); color:#fcd34d;
  text-transform:uppercase; font-size:8.5px; letter-spacing:.08em;
}
.d-tabl-gotovo{
  flex-shrink:0; font-size:11px; font-weight:900; color:#6ee7b7;
  font-family:'JetBrains Mono',monospace;
  padding:2px 9px; border-radius:999px; background: rgba(16,185,129,.16);
}
.d-tabl-stroka.d-tiho{ opacity:.6; }
/* старые чипы убраны — их заменила табличка */
.d-lv-chip{ display:none !important; }

/* ═══ ТАБЛИЧКА — СВОЯ ОБЛАСТЬ, ОТДЕЛЬНО ОТ ШКАЛЫ ═══ */
.d-tabl-oblast{
  margin: 0 12px 12px;
  padding: 12px 14px 12px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(30,41,59,.6), rgba(15,23,42,.55));
  border: 1px solid var(--d-line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 8px 22px rgba(0,0,0,.28);
  position: relative;
}
.d-tabl-oblast::before{
  content: "Состав";
  position: absolute; top: -8px; left: 14px;
  padding: 1px 8px; border-radius: 999px;
  background: #0f172a; border: 1px solid var(--d-line);
  font-size: 8.5px; font-weight: 900; letter-spacing: .1em;
  text-transform: uppercase; color: #64748b;
}
.d-tabl{
  margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: 0 !important;
  gap: 5px !important;
}
.d-tabl-stroka{
  background: rgba(2,6,23,.45) !important;
  border: 1px solid rgba(148,163,184,.12) !important;
  padding: 9px 12px !important;
}
.d-tabl-stroka:hover{ border-color: rgba(148,163,184,.3) !important; }
.d-tabl-cifry{ gap: 6px !important; margin-left: auto; }
.d-tabl-imya{ margin-right: 10px; }

/* ═══ ТАБЛИЧКА СЕТКОЙ: ПО ЧЕТЫРЕ В СТРОКУ, КОМПАКТНО ═══ */
.d-tabl{
  display:grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap:6px !important;
}
.d-tabl-stroka{
  flex-direction:column; align-items:flex-start !important; gap:6px !important;
  padding:9px 11px !important;
}
.d-tabl-verh{ display:flex; align-items:center; gap:8px; width:100%; }
.d-tabl-imya{
  font-size:12px !important; margin-right:0 !important;
  flex:1 1 auto; min-width:0;
}
.d-tabl-cifry{
  margin-left:0 !important; width:100%; flex-wrap:wrap; gap:4px !important;
}
.d-tc{ font-size:10px !important; padding:2px 7px !important; }
.d-tabl-gotovo{
  position:absolute; top:9px; right:11px;
  font-size:10px !important; padding:1px 7px !important;
}
.d-tabl-stroka{ position:relative; }
.d-tabl-cvet{ width:9px !important; height:9px !important; }
@media (max-width: 900px){
  .d-tabl{ grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
}

/* ═══ КАРТОЧКИ СОСТАВА — ПО СОДЕРЖИМОМУ, А НЕ ВО ВСЮ СТРОКУ ═══ */
.d-tabl{
  display:flex !important; flex-wrap:wrap; gap:7px !important;
  grid-template-columns: none !important;
}
.d-tabl-stroka{
  width:auto !important; flex:0 0 auto;
  flex-direction:row !important; align-items:center !important; gap:9px !important;
  padding:8px 12px !important; border-radius:11px !important;
}
.d-tabl-imya{
  flex:0 0 auto !important; max-width:200px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.d-tabl-cifry{ width:auto !important; flex-wrap:nowrap !important; }
.d-tabl-gotovo{
  position:static !important; margin-left:2px;
}
.d-tabl-stroka.d-vybran{
  box-shadow: 0 6px 18px color-mix(in srgb, var(--cvet) 30%, transparent);
}

/* ═══ ЧЕТЫРЕ В СТРОКУ — как договорились ═══ */
.d-tabl{
  display:grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap:8px !important;
}
.d-tabl-stroka{
  width:auto !important; min-width:0;
  flex-direction:row !important; align-items:center !important; gap:8px !important;
  padding:9px 12px !important;
}
.d-tabl-imya{
  flex:1 1 auto !important; max-width:none !important; min-width:0;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.d-tabl-cifry{ flex:0 0 auto; flex-wrap:nowrap !important; }
@media (max-width: 1200px){ .d-tabl{ grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 900px){  .d-tabl{ grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 600px){  .d-tabl{ grid-template-columns: 1fr !important; } }

/* ═══ ПРОДУКТЫ — ПО ЧЕТЫРЕ В СТРОКУ ═══ */
.d-prod-oblast .d-prod-vybor{
  display:grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap:8px !important;
}
.d-prod-oblast .d-prod-chip{
  width:100%; min-width:0; justify-content:center;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  padding:9px 12px !important;
}
.d-prod-oblast .d-prod-plus{ font-size:16px; }
@media (max-width: 1200px){ .d-prod-oblast .d-prod-vybor{ grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 900px){  .d-prod-oblast .d-prod-vybor{ grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 600px){  .d-prod-oblast .d-prod-vybor{ grid-template-columns: 1fr !important; } }

/* ═══ РАСКРЫТАЯ ЧАСТЬ: САМИ РАБОТЫ ═══ */
.d-raskryto{
  margin-top:10px; padding:12px 14px; border-radius:13px;
  background: rgba(2,6,23,.55); border:1px solid rgba(220,38,38,.3);
}
.d-raskryto-shapka{ display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.d-raskryto-shapka b{ font-size:13px; font-weight:900; }
.d-raskryto-shapka span{ font-size:11px; color:#94a3b8; font-weight:700; }
.d-raskryto-plus{
  margin-left:auto; padding:6px 12px; border-radius:9px; cursor:pointer;
  font-size:10.5px; font-weight:800;
  background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-raskryto-plus:hover{ border-color:#dc2626; color:#fff; }
.d-raskryto-zakryt{
  width:26px; height:26px; border-radius:8px; cursor:pointer; font-size:12px;
  background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#94a3b8;
}
.d-raskryto-zakryt:hover{ background: rgba(220,38,38,.25); color:#fff; }
.d-raskryto-pusto{ font-size:12.5px; color:#64748b; padding:8px 2px; }

/* ═══════════ КАРТОЧКИ ПРОДУКТОВ ═══════════ */
.d-prod-oblast .d-prod-vybor{
  display:grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap:9px !important;
  align-items:stretch;
}
.d-prod-kartochka{
  display:flex; flex-direction:column; gap:7px; cursor:pointer; text-align:left;
  padding:12px 14px; border-radius:14px; min-width:0;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line); color:#cbd5e1;
  transition: all .18s cubic-bezier(.2,.8,.2,1);
}
.d-prod-kartochka:hover{
  transform: translateY(-2px);
  border-color: rgba(148,163,184,.35); background: rgba(15,23,42,.75);
}
.d-prod-kartochka.d-vybran{
  background: linear-gradient(180deg, rgba(30,41,59,.95), rgba(15,23,42,.95));
  border-color:#dc2626; color:#fff;
  box-shadow: 0 12px 30px rgba(220,38,38,.22), inset 0 1px 0 rgba(255,255,255,.05);
}
.d-pk-imya{
  font-size:13.5px; font-weight:900; letter-spacing:-.01em; color:#fff;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.d-pk-cifry{ display:flex; flex-wrap:wrap; gap:4px; }
.d-pk{
  font-size:10px; font-weight:800; padding:2px 8px; border-radius:999px; white-space:nowrap;
}
.d-pk-bag{ background: rgba(239,68,68,.24); color:#fca5a5; }
.d-pk-raz{ background: rgba(59,130,246,.24); color:#93c5fd; }
.d-pk-dor{ background: rgba(148,163,184,.2); color:#cbd5e1; }
.d-pk-zap{ background: rgba(245,158,11,.24); color:#fcd34d; }
.d-pk-gotovo{
  background: rgba(16,185,129,.2); color:#6ee7b7;
  font-family:'JetBrains Mono',monospace;
}
.d-pk-tiho{
  background: rgba(245,158,11,.14); color:#fcd34d;
  text-transform:uppercase; font-size:8.5px; letter-spacing:.09em;
}
.d-pk-vypusk{
  font-size:10px; font-weight:700; color:#a5b4fc;
  padding-top:5px; border-top:1px solid rgba(148,163,184,.12);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
/* «Все продукты» — той же высоты, чтобы сетка не рвалась */
.d-prod-vse{
  display:flex !important; align-items:center; justify-content:center;
  border-radius:14px !important; font-size:12.5px !important; font-weight:900 !important;
}
.d-prod-plus{
  display:flex !important; align-items:center; justify-content:center;
  border-radius:14px !important; font-size:20px !important; min-height:64px;
}
/* область «Состав» — это уже детализация выбранного продукта */
.d-tabl-oblast::before{ content:"Части продукта"; }
@media (max-width:1200px){ .d-prod-oblast .d-prod-vybor{ grid-template-columns: repeat(3,1fr) !important; } }
@media (max-width:900px){  .d-prod-oblast .d-prod-vybor{ grid-template-columns: repeat(2,1fr) !important; } }
@media (max-width:600px){  .d-prod-oblast .d-prod-vybor{ grid-template-columns: 1fr !important; } }

/* кнопка шкалы времени */
.d-shkala-knopka-ryad{ padding:0 12px; margin-bottom:8px; }
.d-shkala-knopka{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:6px 14px; border-radius:999px; font-size:11px; font-weight:800;
  background: rgba(2,6,23,.45); border:1px solid var(--d-line); color:#94a3b8;
}
.d-shkala-knopka:hover{ color:#fff; border-color: rgba(148,163,184,.35); }
.d-shkala-knopka.d-vybran{ color:#fff; border-color: rgba(220,38,38,.5); }
.d-shkala-knopka span{ font-size:9px; opacity:.7; }

/* ═══ ПОДПИСЬ СДАЧИ/РЕЛИЗА НА КАРТОЧКЕ ПРОДУКТА ═══ */
.d-pk-vypusk{
  display:flex !important; align-items:center; gap:7px;
  padding-top:7px !important; border-top:1px solid rgba(148,163,184,.14) !important;
  font-size:10.5px !important; color:#cbd5e1 !important;
}
.d-pk-vypusk b{
  font-size:8.5px; font-weight:900; text-transform:uppercase; letter-spacing:.09em;
  padding:2px 7px; border-radius:999px;
  background: rgba(167,139,250,.22); color:#ddd6fe;
}
.d-pk-reliz b{ background: rgba(16,185,129,.22); color:#6ee7b7; }
.d-pk-net b{ background: rgba(245,158,11,.18); color:#fcd34d; }
.d-pk-ver{ font-size:12px; font-weight:900; color:#fff; }
.d-pk-data{
  margin-left:auto; font-size:10px; font-weight:700; color:#94a3b8;
  font-family:'JetBrains Mono',monospace; white-space:nowrap;
}
.d-pk-net .d-pk-data{ color:#64748b; font-style:italic; }

/* ═══════════ ГРАФИКА НА КАРТОЧКЕ ПРОДУКТА ═══════════ */
.d-prod-kartochka{ padding:14px 15px !important; gap:10px !important; }
.d-pk-imya{ font-size:15px !important; letter-spacing:-.02em !important; }
.d-pk-cifry{ display:block !important; }
.d-pg{ display:flex; flex-direction:column; gap:6px; }
.d-pg-ryad{ display:flex; align-items:center; gap:8px; }
.d-pg-imya{
  flex:0 0 74px; font-size:9.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.06em; color:#94a3b8; white-space:nowrap;
}
.d-pg-polosa{
  flex:1 1 auto; height:7px; border-radius:99px; overflow:hidden;
  background: rgba(148,163,184,.12);
}
.d-pg-polosa i{ display:block; height:100%; border-radius:99px; }
.d-pg-bag i{ background: linear-gradient(90deg,#ef4444,#dc2626); box-shadow:0 0 10px rgba(239,68,68,.5); }
.d-pg-raz i{ background: linear-gradient(90deg,#3b82f6,#2563eb); box-shadow:0 0 10px rgba(59,130,246,.45); }
.d-pg-dor i{ background: linear-gradient(90deg,#94a3b8,#64748b); }
.d-pg-zap i{ background: linear-gradient(90deg,#f59e0b,#d97706); box-shadow:0 0 10px rgba(245,158,11,.45); }
.d-pg-got i{ background: linear-gradient(90deg,#10b981,#059669); box-shadow:0 0 10px rgba(16,185,129,.4); }
.d-pg-chislo{
  flex:0 0 auto; min-width:26px; text-align:right;
  font-size:12px; font-weight:900; color:#e2e8f0;
  font-family:'JetBrains Mono',monospace;
}
.d-pg-itog{
  display:flex; align-items:center; gap:8px; margin-top:2px;
  padding-top:8px; border-top:1px solid rgba(148,163,184,.12);
}
.d-pg-itog .d-pg-polosa{ height:8px; }
.d-pg-itog .d-pg-chislo{ color:#6ee7b7; min-width:40px; }
.d-pg-tiho{
  font-size:11px; font-weight:700; color:#64748b; font-style:italic; padding:4px 0;
}
/* старые пилюли больше не нужны */
.d-pk-bag, .d-pk-raz, .d-pk-dor, .d-pk-zap, .d-pk-gotovo, .d-pk-tiho{ display:none; }

/* ═══ ПАЛИТРА БАТИ: баг красный · доработка жёлтая · разработка голубая · релиз зелёный ═══ */
.d-pg-bag i{ background: linear-gradient(90deg,#ef4444,#dc2626) !important; box-shadow:0 0 10px rgba(239,68,68,.55) !important; }
.d-pg-dor i{ background: linear-gradient(90deg,#fbbf24,#f59e0b) !important; box-shadow:0 0 10px rgba(245,158,11,.5) !important; }
.d-pg-raz i{ background: linear-gradient(90deg,#38bdf8,#0ea5e9) !important; box-shadow:0 0 10px rgba(56,189,248,.5) !important; }
.d-pg-zap i{ background: linear-gradient(90deg,#c4b5fd,#a78bfa) !important; box-shadow:0 0 10px rgba(167,139,250,.45) !important; }
.d-pg-got i{ background: linear-gradient(90deg,#34d399,#10b981) !important; box-shadow:0 0 12px rgba(16,185,129,.5) !important; }

/* тот же язык цвета — везде, чтобы не переучиваться */
.d-p-bag{ border-left-color:#ef4444 !important; }
.d-p-dor{ border-left-color:#f59e0b !important; }
.d-p-fun{ border-left-color:#0ea5e9 !important; }
.d-p-zap{ border-left-color:#a78bfa !important; }
.d-lv-v-bag{ background: rgba(239,68,68,.26) !important; color:#fecaca !important; }
.d-lv-v-dorabotka{ background: rgba(245,158,11,.26) !important; color:#fde68a !important; }
.d-lv-v-funkciya{ background: rgba(56,189,248,.26) !important; color:#bae6fd !important; }
.d-lv-v-zapros{ background: rgba(167,139,250,.26) !important; color:#ddd6fe !important; }
.d-sv-bag .d-sv-verh b{ color:#fca5a5 !important; }
.d-sv-dor .d-sv-verh b{ color:#fcd34d !important; }
.d-sv-fun .d-sv-verh b{ color:#7dd3fc !important; }
.d-pk-reliz b{ background: rgba(16,185,129,.24) !important; color:#6ee7b7 !important; }

/* шкала убрана — область продуктов дышит */
.d-shkala-knopka-ryad, .d-lv{ display:none !important; }
.d-prod-oblast{ padding-bottom:14px !important; }
.d-prod-oblast .d-prod-shapka{ margin-bottom:0 !important; }

/* ═══ «ВСЕ ПРОДУКТЫ» — ОТДЕЛЬНОЙ СТРОКОЙ НАД КАРТОЧКАМИ ═══ */
.d-vse-ryad{
  display:flex; align-items:center; gap:12px; margin-bottom:11px;
  padding-bottom:11px; border-bottom:1px dashed rgba(148,163,184,.16);
}
.d-vse-knopka{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  padding:8px 18px; border-radius:999px; font-size:12px; font-weight:900;
  background: rgba(167,139,250,.12); border:1px solid rgba(167,139,250,.35); color:#ddd6fe;
  transition: all .18s ease;
}
.d-vse-knopka:hover{ border-color:#a78bfa; color:#fff; }
.d-vse-knopka.d-vybran{
  background: linear-gradient(180deg, rgba(167,139,250,.32), rgba(109,40,217,.26));
  border-color:#a78bfa; color:#fff;
  box-shadow: 0 8px 22px rgba(167,139,250,.28);
}
.d-vse-podskazka{ font-size:10.5px; color:#64748b; font-weight:600; }
/* старый чип «Все» больше не нужен */
.d-prod-vse{ display:none !important; }

/* ═══ КЛЕТКА «ВСЕ ПРОДУКТЫ» — ИТОГИ ПО ВСЕМУ ХОЗЯЙСТВУ ═══ */
.d-vse-kletka{
  display:flex; flex-direction:column; gap:10px; width:100%; cursor:pointer; text-align:left;
  padding:14px 16px; margin-bottom:12px; border-radius:16px;
  background: linear-gradient(180deg, rgba(76,29,149,.22), rgba(2,6,23,.5));
  border:1px solid rgba(167,139,250,.3); color:#e2e8f0;
  transition: all .18s cubic-bezier(.2,.8,.2,1);
}
.d-vse-kletka:hover{ border-color: rgba(167,139,250,.6); transform: translateY(-2px); }
.d-vse-kletka.d-vybran{
  border-color:#a78bfa;
  box-shadow: 0 14px 34px rgba(167,139,250,.28), inset 0 1px 0 rgba(255,255,255,.06);
}
.d-vse-verh{ display:flex; align-items:center; gap:10px; }
.d-vse-imya{
  font-size:15px; font-weight:900; letter-spacing:-.01em; color:#ddd6fe;
}
.d-vse-skolko{
  margin-left:auto; font-size:10.5px; font-weight:800;
  padding:2px 10px; border-radius:999px;
  background: rgba(167,139,250,.24); color:#ddd6fe;
}
.d-vse-kletka .d-pg-polosa{ height:9px; }
.d-vse-kletka .d-pg-imya{ flex-basis:82px; }
.d-vse-ryad, .d-vse-knopka{ display:none !important; }

/* ═══ КАРТОЧКИ ПО ЦЕНТРУ ═══
   Продуктов может быть два, а сетка на четыре — тогда они жмутся влево
   и справа зияет пустота. Центрируем, а ширину карточки держим. */
.d-prod-oblast .d-prod-vybor{
  display:flex !important;
  flex-wrap:wrap; justify-content:center; align-items:stretch;
  gap:10px !important;
  grid-template-columns: none !important;
}
.d-prod-kartochka{
  flex: 0 1 clamp(230px, 23%, 300px);
  min-width:230px;
}
.d-prod-plus{
  flex: 0 0 64px; min-height:auto !important;
  display:flex !important; align-items:center; justify-content:center;
}
/* клетка «Все продукты» — по центру, не во всю ширину */
.d-vse-kletka{
  width:100%; max-width:640px; margin-left:auto; margin-right:auto;
  align-items:stretch;
}
.d-vse-verh{ justify-content:center; position:relative; }
.d-vse-skolko{ position:absolute; right:0; margin-left:0 !important; }
@media (max-width:700px){
  .d-prod-kartochka{ flex: 1 1 100%; }
  .d-vse-kletka{ max-width:none; }
}

/* названия продуктов — по центру клетки */
.d-pk-imya{ text-align:center; width:100%; }
.d-vse-imya{ text-align:center; }
.d-pk-vypusk{ justify-content:center; }

/* клетка «Все продукты» — компактнее и уже */
.d-vse-kletka{
  max-width:440px !important;
  padding:11px 14px !important; gap:7px !important;
  margin-bottom:14px !important;
}
.d-vse-imya{ font-size:13px !important; }
.d-vse-skolko{ font-size:9.5px !important; padding:1px 8px !important; }
.d-vse-kletka .d-pg{ gap:4px !important; }
.d-vse-kletka .d-pg-polosa{ height:6px !important; }
.d-vse-kletka .d-pg-imya{ flex-basis:72px !important; font-size:8.5px !important; }
.d-vse-kletka .d-pg-chislo{ font-size:11px !important; min-width:22px; }
.d-vse-kletka .d-pg-itog{ padding-top:6px !important; margin-top:0 !important; }

/* ═══ КЛЕТКА «ВСЕ ПРОДУКТЫ» — НИЗКАЯ: показатели в одну строку ═══ */
.d-vse-kletka{
  max-width:none !important; width:100% !important;
  flex-direction:row !important; align-items:center !important;
  gap:16px !important; padding:10px 16px !important; margin-bottom:12px !important;
}
.d-vse-verh{ flex:0 0 auto !important; justify-content:flex-start !important; }
.d-vse-imya{ white-space:nowrap; }
.d-vse-skolko{ position:static !important; margin-left:8px !important; }
.d-vse-kletka .d-pg{
  flex:1 1 auto; flex-direction:row !important; flex-wrap:wrap;
  gap:14px !important; align-items:center;
}
.d-vse-kletka .d-pg-ryad{ flex:1 1 130px; min-width:120px; gap:6px !important; }
.d-vse-kletka .d-pg-imya{ flex:0 0 auto !important; font-size:8.5px !important; }
.d-vse-kletka .d-pg-polosa{ height:5px !important; }
.d-vse-kletka .d-pg-itog{
  flex:0 0 150px; margin-top:0 !important; padding-top:0 !important;
  border-top:0 !important; border-left:1px solid rgba(148,163,184,.14);
  padding-left:14px !important;
}

/* наше лого перед «Все продукты» — видно, что продукты наши */
.d-vse-logo{
  flex-shrink:0; width:26px; height:26px; border-radius:8px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 0 0 1px rgba(167,139,250,.3), 0 4px 12px rgba(0,0,0,.35);
}
.d-vse-logo img{ width:100%; height:100%; display:block; }
.d-vse-verh{ gap:10px !important; }

/* ═══ ВЫБОР ВИДА КРУПНЫМИ КНОПКАМИ — форма меняется сразу ═══ */
.d-vo-vid{ grid-column: 1 / -1; }
.d-vk-ryad{ display:flex; gap:7px; flex-wrap:wrap; }
.d-vk{
  display:flex; align-items:center; gap:8px; cursor:pointer; flex:1 1 130px;
  padding:11px 14px; border-radius:12px; font-size:12px; font-weight:800;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line); color:#94a3b8;
  transition: all .16s ease;
}
.d-vk:hover{ color:#fff; transform: translateY(-1px); }
.d-vk-znak{ font-size:15px; }
.d-vk-imya{ white-space:nowrap; }
.d-vk-bag.d-vybran{       background: rgba(239,68,68,.22); border-color:#ef4444; color:#fff; }
.d-vk-dorabotka.d-vybran{ background: rgba(245,158,11,.22); border-color:#f59e0b; color:#fff; }
.d-vk-funkciya.d-vybran{  background: rgba(56,189,248,.22); border-color:#38bdf8; color:#fff; }
.d-vk-zapros.d-vybran{    background: rgba(167,139,250,.22); border-color:#a78bfa; color:#fff; }
.d-vk.d-vybran{ box-shadow: 0 8px 20px rgba(0,0,0,.35); }
/* поля вида появляются мягко */
.d-dop{ animation: d-polya-poyav .22s ease-out; }
@keyframes d-polya-poyav{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }

/* ═══════════ АДМИНКА: БАЗЫ · УСЛУГИ · ОРГАНИЗАЦИИ ═══════════ */
#admin-bazy{ display:flex; flex-direction:column; gap:16px; margin-top:18px; }
.d-adm-blok{
  padding:16px 18px; border-radius:16px;
  background: rgba(15,23,42,.66); border:1px solid var(--d-line);
}
.d-adm-shapka{ display:flex; align-items:center; gap:14px; margin-bottom:13px; flex-wrap:wrap; }
.d-adm-shapka b{ font-size:14px; font-weight:900; }
.d-adm-shapka span{ font-size:11px; color:#94a3b8; font-weight:600; }
.d-adm-shapka .d-str-dobavit{ margin-left:auto; }

.d-adm-setka{ display:grid; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); gap:9px; }
.d-adm-kartochka{
  padding:12px 14px; border-radius:13px; cursor:pointer;
  background: rgba(2,6,23,.5); border:1px solid var(--d-line);
  transition: all .16s ease;
}
.d-adm-kartochka:hover{ border-color:#f59e0b; transform: translateY(-2px); }
.d-adm-imya{ font-size:13px; font-weight:900; color:#fff; margin-bottom:7px; }
.d-adm-stroki{ display:flex; flex-direction:column; gap:3px; }
.d-adm-stroki span{ font-size:11px; color:#94a3b8; font-weight:600; }
.d-adm-net{ color:#fcd34d !important; font-style:italic; }
.d-adm-niz{
  margin-top:9px; padding-top:8px; border-top:1px solid rgba(148,163,184,.12);
  font-size:11px; color:#64748b;
}
.d-adm-niz b{ color:#6ee7b7; font-size:13px; }

.d-adm-spisok{ display:flex; flex-direction:column; gap:10px; }
.d-adm-firma{
  padding:12px 14px; border-radius:13px;
  background: rgba(2,6,23,.45); border:1px solid var(--d-line);
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
}
.d-adm-firma-imya{ font-size:12.5px; font-weight:800; flex:0 0 190px; }
.d-adm-servisy{ display:flex; gap:6px; flex-wrap:wrap; flex:1 1 auto; }
.d-adm-sohr{
  padding:7px 14px; border-radius:10px; cursor:pointer; font-size:11px; font-weight:800;
  background: rgba(148,163,184,.12); border:1px solid var(--d-line); color:#cbd5e1;
}
.d-adm-sohr:hover{ border-color:#dc2626; color:#fff; }
.d-adm-pusto{ font-size:12.5px; color:#64748b; padding:10px 2px; }
.d-adm-skazal{
  position:fixed; left:50%; bottom:70px; transform:translateX(-50%); z-index:100002;
  padding:10px 18px; border-radius:12px; pointer-events:none;
  background: rgba(16,185,129,.92); color:#fff; font-size:12.5px; font-weight:800;
  box-shadow: 0 16px 40px rgba(0,0,0,.5);
}
@media (max-width:800px){ .d-adm-firma-imya{ flex:1 1 100%; } }

/* ═══ ТЕЛЕФОН И ПЛАНШЕТ ═══════════════════════════════════════════════
   Беда была одна: .kanban-col стоит flex:1 1 0 — колонки ДЕЛЯТ ширину.
   На большом экране это правильно, на 390px шесть колонок дают по 60px:
   «всё съехало, колонки узкие». Лечение — не делить, а ЛИСТАТЬ:
   колонка занимает почти весь экран, палец водит вбок, прилипая к краю. */

@media (max-width: 820px){

  /* ── доска: лента колонок с прилипанием ── */
  .kanban-container{
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    gap: 12px !important;
    padding: 12px 14px 22px !important;
    scroll-padding-left: 14px;
  }
  .kanban-container::-webkit-scrollbar{ height: 4px; }
  .kanban-container::-webkit-scrollbar-thumb{ background: rgba(148,163,184,.35); border-radius: 4px; }

  .kanban-col{
    flex: 0 0 86vw !important;
    width: 86vw !important;
    max-width: 420px !important;
    min-width: 0 !important;
    scroll-snap-align: center;
    scroll-snap-stop: always;
  }

  /* шапка колонки на телефоне читаема: 9px были нечитаемы */
  .col-header{ padding: 12px 10px !important; }
  .col-header b{ font-size: 12px !important; letter-spacing: .06em !important; }
  .col-count{ font-size: 16px !important; margin-left: 10px !important; }

  /* карточка: крупнее текст, палец попадает */
  .kanban-card{ padding: 12px !important; margin-bottom: 10px !important; }
  .kanban-card .task-title{ font-size: 14px !important; line-height: 1.35 !important; -webkit-line-clamp: 4; }
  .kanban-card .d-proekt > *{ font-size: 11px !important; }
  .kanban-card .task-meta, .kanban-card .task-footer{ font-size: 11px !important; }

  /* ── шапка портала: в столбик, ничего не срезано ── */
  .main-container{ padding-left: 0 !important; padding-right: 0 !important; }
  header, .header{
    flex-wrap: wrap !important;
    gap: 10px !important;
    padding: 10px 12px !important;
    padding-top: calc(10px + env(safe-area-inset-top)) !important;
    height: auto !important;
  }
  .header-left{ flex: 1 1 auto !important; min-width: 0 !important; }
  .header-right{ flex: 0 0 auto !important; gap: 10px !important; }
  .header-center{ order: 3; flex: 1 1 100% !important; min-width: 100% !important; }
  .header-search, .search-wrapper{ width: 100% !important; max-width: none !important; }
  .search-input{ width: 100% !important; }
  .user-badge{ max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* разделы (Задачи/Проекты/Календарь…) — листаются, а не рвутся */
  .mode-switcher, .scope-bar, .type-bar, .view-nav{
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .mode-switcher::-webkit-scrollbar, .scope-bar::-webkit-scrollbar,
  .type-bar::-webkit-scrollbar, .view-nav::-webkit-scrollbar{ display: none; }
  .mode-btn, .scope-btn, .type-btn, .view-tab{
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    font-size: 11px !important;
    padding: 7px 12px !important;
  }
  .nav-layers{ gap: 8px !important; padding: 8px 12px !important; }

  /* ── окна: во весь экран, кнопки достаются большим пальцем ── */
  .modal-content, .modal-box, .d-okno, .d-modal{
    width: 96vw !important;
    max-width: 96vw !important;
    max-height: 92vh !important;
    margin: 4vh 2vw !important;
    padding: 16px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .modal-content input, .modal-content select, .modal-content textarea,
  .d-okno input, .d-okno select, .d-okno textarea{ font-size: 16px !important; }

  /* сетки — в одну колонку */
  .d-tabl, .d-prod-oblast .d-prod-vybor{ grid-template-columns: 1fr !important; }

  /* календарь: три месяца рядом на телефон не влезают — по одному, листая */
  .d-kal-karusel, .d-kal-mesyacy{
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .d-kal-mesyac{ flex: 0 0 88vw !important; scroll-snap-align: center; }

  /* низ экрана у iPhone — под «домашней» полоской ничего не прячем */
  body{ padding-bottom: env(safe-area-inset-bottom) !important; }

  /* на пальце нет наведения — эффекты наведения только мешали */
  .kanban-card:hover{ transform: none !important; }
}

/* совсем узкие (iPhone mini/SE) */
@media (max-width: 400px){
  .kanban-col{ flex: 0 0 90vw !important; width: 90vw !important; }
  .header-logo, .d-logo{ font-size: 18px !important; }
}

/* ═══ «Я ЭТО ТОЛЬКО ОТПРАВИЛ» ══════════════════════════════════════════
   Карточка заказчика/инициатора: он её не делает, он ждёт. Приглушена,
   чтобы не спорила за внимание с собственной работой, но состояние на ней
   написано словом — «В работе», а не догадкой по колонке. */
.kanban-card.d-nablyudayu{
  opacity: .72;
  filter: saturate(.45);
  border-left-color: #64748b !important;
  background: rgba(30,41,59,.42) !important;
}
.kanban-card.d-nablyudayu:hover{ opacity: 1; filter: saturate(.8); }
.d-nabl-status{
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 9px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  color: #cbd5e1; background: rgba(100,116,139,.28);
  border: 1px solid rgba(148,163,184,.3); border-radius: 999px;
  padding: 2px 9px; margin-bottom: 7px;
}
.d-nabl-status i{ font-size: 9px; opacity: .8; }

/* ═══ МОИ ЗАЯВКИ ══════════════════════════════════════════════════════ */
.d-schet{
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; padding: 0 5px; margin-left: 6px;
  font-size: 9px; font-weight: 900; line-height: 1;
  color: #fff; background: #6366f1; border-radius: 999px;
}
.scope-btn.d-spit{ opacity: .55; }
.scope-btn.d-spit .d-schet{ display: none; }
@keyframes d-migni{
  0%,100%{ box-shadow: none; }
  50%{ box-shadow: 0 0 0 3px rgba(99,102,241,.45); }
}

/* Мяч на твоей стороне: задачу вернули тебе на уточнение.
   Это НЕ приглушённая карточка — тут ждут действия, а не наблюдения. */
.d-myach-u-menya{
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 9px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  color: #fbbf24; background: rgba(245,158,11,.16);
  border: 1px solid rgba(245,158,11,.45); border-radius: 999px;
  padding: 2px 9px; margin-bottom: 7px;
  animation: d-myach-dyshit 2.4s ease-in-out infinite;
}
@keyframes d-myach-dyshit{
  0%,100%{ border-color: rgba(245,158,11,.45); }
  50%{ border-color: rgba(245,158,11,.9); }
}

/* ═══ СТОРОЖ ОТВЕТОВ ══════════════════════════════════════════════════
   Плашка вместо окна-перебивки: заметна, но не рвёт работу и не требует
   нажать «ОК» посреди дела. Копится столбиком снизу справа. */
.d-storozh-box{
  position: fixed; right: 16px; bottom: 16px; z-index: 99999;
  display: flex; flex-direction: column; gap: 8px;
  max-width: min(400px, calc(100vw - 32px));
  pointer-events: none;
}
.d-storozh-vest{
  pointer-events: auto;
  display: flex; align-items: flex-start; gap: 9px;
  background: rgba(15,23,42,.97);
  border: 1px solid rgba(148,163,184,.35);
  border-left: 4px solid #f59e0b;
  border-radius: 12px; padding: 11px 13px;
  font: 600 12px/1.45 -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #e2e8f0;
  box-shadow: 0 8px 28px rgba(0,0,0,.45);
  transition: opacity .4s;
  animation: d-storozh-vyekhal .28s ease-out;
}
.d-storozh-vest.d-tyazhelo{ border-left-color: #ef4444; }
.d-storozh-vest i{ color: #f59e0b; margin-top: 1px; flex: 0 0 auto; }
.d-storozh-vest.d-tyazhelo i{ color: #ef4444; }
.d-storozh-vest span{ flex: 1 1 auto; }
.d-storozh-vest b.d-storozh-zakryt{
  flex: 0 0 auto; cursor: pointer; color: #94a3b8;
  font-size: 15px; line-height: 1; padding: 0 2px;
}
.d-storozh-vest b.d-storozh-zakryt:hover{ color: #e2e8f0; }
@keyframes d-storozh-vyekhal{
  from{ transform: translateX(24px); opacity: 0; }
  to{ transform: none; opacity: 1; }
}
@media (max-width: 820px){
  .d-storozh-box{ right: 10px; left: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); max-width: none; }
}

/* ═══ ГЛАВНЫЙ МЕСЯЦ ВЛЕЗАЕТ ЦЕЛИКОМ ══════════════════════════
   Беда 22.08: нижняя строка текущего месяца уходила под край страницы,
   и «лечилось» только щелчком по другому месяцу. Дело было не в отрисовке:
   у месяца бывает ПЯТЬ недельных строк, а бывает ШЕСТЬ (август 2026 —
   шесть). Пять влезали, шесть — нет. Высота клетки была намертво 74px.
   Теперь клетка ужимается под окно, но не мельче 36px. */
.d-mesyac-blok.d-glavnyi .d-kletka{
  min-height: clamp(36px, calc((100vh - 412px) / 6), 74px) !important;
}
@supports (height: 100dvh){
  .d-mesyac-blok.d-glavnyi .d-kletka{
    min-height: clamp(36px, calc((100dvh - 412px) / 6), 74px) !important;
  }
}
/* на низких окнах поджимаем и промежутки, и отступ снизу */
@media (max-height: 900px){
  .d-mesyac-blok.d-glavnyi .d-setka{ gap:5px; }
  .d-mesyac-blok.d-glavnyi{ padding:10px; }
  #mode-calendar.mode-content.active{ padding-bottom:16px; }
}