/* Reset дефолтных браузерных обводок у форм-контролов. Без этого
   <button>/<input> рисуются с outset border (Chrome) или 1px серой рамкой,
   что после удаления кастомных border: правил проступает как «белая обводка». */
button, input, select, textarea {
  border: none;
  outline: none;
}
button:focus, input:focus, select:focus, textarea:focus,
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none;
}

:root {
  /* Более тёмная нейтрально-серая палитра. */
  --bg: #161616;
  --bg-elevated: #1c1c1c;
  --bg-canvas: #121212;
  --bg-panel: rgba(34, 34, 34, 0.96);
  --bg-panel-strong: rgba(40, 40, 40, 0.98);
  --bg-panel-soft: rgba(28, 28, 28, 0.92);
  --bg-field: rgba(16, 16, 16, 0.96);

  /* Иерархия слоёв — нейтрально-серые, R=G=B, без тёплого оттенка. */
  --layer-0: #161616;   /* фон страницы */
  --layer-1: #1e1e1e;   /* главные плашки (.surface) — поверх layer-0 */
  --layer-2: #262626;   /* вложенные карточки — поверх layer-1 */
  --layer-3: #0f0f0f;   /* поля ввода input/select — темнее фона (вдавленные) */
  --layer-frame: #1a1a1a;
  --text: #f8f8f8;
  --text-soft: #d6d6d6;
  --text-faint: #a6a6a6;
  --text-mute: #8a8a8a;
  --line: rgba(249, 249, 247, 0.14);
  --line-soft: rgba(249, 249, 247, 0.08);
  --line-strong: rgba(249, 249, 247, 0.28);
  --primary: #cc7d5e;
  --primary-strong: #df9577;
  --primary-soft: rgba(204, 125, 94, 0.18);
  --primary-bg: rgba(204, 125, 94, 0.12);
  --success: #00c853;
  --success-soft: rgba(0, 200, 83, 0.18);
  --warn: #e0a45f;
  --warn-soft: rgba(224, 164, 95, 0.18);
  --danger: #ff5f38;
  --danger-soft: rgba(255, 95, 56, 0.18);
  --radius-2xl: 28px;
  --radius-xl: 22px;
  --radius-lg: 18px;
  --radius-md: 14px;
  --radius-sm: 12px;
  --shadow-app: none;
  --shadow-panel: none;
  --shadow-soft: none;
  --font:
    ui-monospace,
    "SFMono-Regular",
    "SF Mono",
    Menlo,
    Consolas,
    "Liberation Mono",
    monospace;
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
}

html {
  color-scheme: dark;
}

body {
  margin: 0;
  font-family: var(--font);
  color: var(--text);
  background: var(--layer-0);
  line-height: 1.55;
  letter-spacing: 0;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: rgba(249, 249, 247, 0.018);
  opacity: 1;
}

button,
input,
select {
  font: inherit;
}

b,
strong {
  font-weight: 600;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
}

button {
  cursor: pointer;
}

button,
input,
select,
table {
  color: inherit;
}

::selection {
  background: rgba(204, 125, 94, 0.32);
  color: #f8f8f8;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: rgba(249, 249, 247, 0.06);
}

::-webkit-scrollbar-thumb {
border-radius: 999px;
  background: rgba(204, 125, 94, 0.44);
  background-clip: padding-box;
}

.app-shell {
  min-height: 100vh;
  padding: 22px;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: 298px minmax(0, 1fr);
  gap: 20px;
  min-height: calc(100vh - 44px);
}

.app-render-slot {
  display: contents;
}

.sidebar {
  position: sticky;
  top: 22px;
  align-self: start;
  height: calc(100vh - 44px);
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px 18px;
border-radius: var(--radius-2xl);
  background: var(--layer-1);
  box-shadow: var(--shadow-app);
}

.sidebar-footer {
  margin-top: auto;
  padding-top: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sidebar-logout {
  flex: 1;
  padding: 12px 14px;
  border-radius: 12px;
  background: transparent;
  color: var(--text-soft);
  font-size: 13px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease;
}

.sidebar-logout:hover {
  background: rgba(255, 95, 56, 0.12);
  color: var(--danger);
}

.sidebar-settings {
  padding: 12px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.07);
  color: var(--text-soft);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  white-space: nowrap;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
}
.sidebar-settings:hover { background: rgba(255, 255, 255, 0.10); color: var(--text); }
.sidebar-settings.active { background: rgba(255, 255, 255, 0.10); border-color: rgba(255, 255, 255, 0.12); color: var(--text); }

/* Верхний тумблер режимов навигации (AI / CRM / Продажи) — приглушённый */
.nav-modes {
  display: flex;
  gap: 4px;
  background: rgba(255, 255, 255, 0.04);
  padding: 5px;
  border-radius: 12px;
}
.nav-mode {
  flex: 1;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text-mute);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 150ms ease, color 150ms ease;
}
.nav-mode:hover { color: var(--text-soft); }
.nav-mode.active { background: rgba(255, 255, 255, 0.08); color: var(--text-soft); }

/* === AI-агенты === */
.ai-agents-layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 16px;
  min-height: calc(100vh - 44px);
  align-items: stretch;
}

.ai-agents-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.ai-agents-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ai-agent-card {
  background: var(--layer-2);
  color: var(--text);
  padding: 10px 14px;
  border-radius: 10px;
  text-align: left;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 3px;
  transition: background 160ms ease;
  border: 0;
  font-family: inherit;
}

.ai-agent-card:hover {
  background: rgba(204, 125, 94, 0.12);
}

.ai-agent-card.active {
  background: rgba(204, 125, 94, 0.22);
}

.ai-agent-card strong {
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.2;
}

.ai-agent-title {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-faint);
  line-height: 1.3;
}

.ai-agent-desc {
  font-size: 11.5px;
  color: var(--text-soft);
  line-height: 1.4;
  margin-top: 2px;
  /* Ограничиваем 2 строками — карточки не расползаются вниз. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ai-agent-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 4px;
}

.ai-tool-pill {
  background: rgba(255, 255, 255, 0.05);
  color: var(--text-faint);
  padding: 2px 7px;
  border-radius: 99px;
  font-size: 10px;
}

.ai-chat-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-height: calc(100vh - 44px);
}

.ai-chat-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ai-chat-messages {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px 4px;
  min-height: 200px;
}

.ai-chat-empty {
  padding: 32px;
  text-align: center;
  color: var(--text-faint);
}

.ai-chat-msg {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 78%;
}

.ai-msg-user {
  align-self: flex-end;
  align-items: flex-end;
}

.ai-msg-assistant {
  align-self: flex-start;
  align-items: flex-start;
}

.ai-msg-bubble {
  padding: 10px 14px;
  border-radius: 14px;
  font-size: 13.5px;
  line-height: 1.5;
  white-space: pre-wrap;
  word-wrap: break-word;
}

.ai-msg-user .ai-msg-bubble {
  background: rgba(204, 125, 94, 0.2);
  color: var(--text);
}

.ai-msg-assistant .ai-msg-bubble {
  background: var(--layer-2);
  color: var(--text-soft);
}

.ai-msg-loading {
  font-style: italic;
  opacity: 0.7;
}

.ai-msg-ts {
  font-size: 10px;
  color: var(--text-faint);
  padding: 0 4px;
}

.ai-msg-tool-trigger {
  align-self: flex-start;
  max-width: 88%;
  background: rgba(204, 125, 94, 0.08);
  border: 1px dashed rgba(204, 125, 94, 0.35);
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 12px;
  color: var(--text-soft);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.ai-tool-trigger-label {
  font-size: 11px;
  color: var(--text-faint);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.ai-tool-pill-call {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.ai-tool-pill-call code {
  background: rgba(204, 125, 94, 0.18);
  color: var(--text);
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
}

.ai-tool-args {
  color: var(--text-faint);
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 11px;
}

.ai-tool-result {
  align-self: flex-start;
  max-width: 88%;
  background: var(--layer-2);
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
  color: var(--text-faint);
}

.ai-tool-result summary {
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.ai-tool-result summary::-webkit-details-marker {
  display: none;
}

.ai-tool-result summary::before {
  content: "▸ ";
  color: var(--text-faint);
}

.ai-tool-result[open] summary::before {
  content: "▾ ";
}

.ai-tool-result code {
  color: var(--text);
  font-size: 12px;
}

.ai-tool-pre {
  margin: 6px 0 0;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 11.5px;
  color: var(--text-soft);
  white-space: pre-wrap;
  word-wrap: break-word;
  max-height: 240px;
  overflow: auto;
}

.ai-chat-input-row {
  display: flex;
  gap: 10px;
  align-items: flex-end;
}

.ai-chat-input {
  flex: 1;
  background: var(--layer-3);
  color: var(--text);
  padding: 10px 12px;
  border-radius: 12px;
  font: inherit;
  font-size: 13.5px;
  resize: none;
  min-height: 56px;
  max-height: 240px;
  overflow-y: auto;
  line-height: 1.4;
}

/* === Flow Up (Цепочка писем) === */
.flowup-section {
  display: grid;
  gap: 18px;
}

.flowup-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.flowup-channel-switch {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border-radius: 11px;
  background: var(--layer-3);
}

.flowup-channel-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-radius: 8px;
  background: transparent;
  color: var(--text-faint);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.flowup-channel-tab:hover {
  color: var(--text);
}

.flowup-channel-tab.active {
  background: var(--primary);
  color: #fff;
}

.flowup-channel-tab span {
  min-width: 20px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  font-size: 11px;
  line-height: 1.45;
  text-align: center;
}

.flowup-segment-filter {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--text-faint);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.flowup-segment-filter select {
  min-width: 190px;
  background: var(--layer-2);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
  font-size: 12px;
  letter-spacing: 0;
  text-transform: none;
}

.flowup-channel {
  display: grid;
  gap: 10px;
}

.flowup-channel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 6px;
}

.flowup-channel-head h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}

.flowup-empty {
  padding: 18px;
  background: var(--layer-2);
  border-radius: 12px;
  color: var(--text-faint);
  font-size: 13px;
  text-align: center;
}

.flowup-steps {
  display: grid;
  gap: 10px;
}

.flowup-step {
  background: var(--layer-2);
  border-radius: 14px;
  padding: 14px 16px;
  display: grid;
  gap: 8px;
  transition: background 160ms ease;
}

.flowup-step.is-inactive {
  opacity: 0.55;
}

.flowup-step-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.flowup-step-no {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--text-faint);
}

.flowup-step-actions {
  display: flex;
  gap: 6px;
  align-items: center;
}

.flowup-delete-btn {
  width: 30px;
  padding: 0;
  font-size: 18px;
  line-height: 1;
}

.flowup-step-subject {
  font-size: 14px;
  color: var(--text);
}

.flowup-step-body {
  font-size: 12.5px;
  color: var(--text-soft);
  line-height: 1.5;
  white-space: pre-wrap;
}

.flowup-step-edit {
  background: var(--layer-2);
  display: grid;
  gap: 10px;
}

.flowup-step-edit label {
  display: grid;
  gap: 5px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-faint);
}

.flowup-step-edit input[type="text"],
.flowup-step-edit input[type="number"],
.flowup-step-edit select,
.flowup-step-edit textarea {
  background: var(--layer-3);
  color: var(--text);
  padding: 10px 12px;
  border-radius: 10px;
  font: inherit;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
}

.flowup-step-edit textarea {
  resize: vertical;
  min-height: 120px;
  line-height: 1.55;
}

.flowup-checkbox {
  display: flex !important;
  align-items: center;
  gap: 8px;
  flex-direction: row !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 13px !important;
  color: var(--text-soft) !important;
}

.flowup-checkbox input {
  width: 16px;
  height: 16px;
}

.brand-lockup {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 16px;
}

.brand-mark {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #df9577, #cc7d5e);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  box-shadow: none;
}

.brand-copy strong,
.brand-copy span {
  display: block;
}

.brand-copy strong {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
}

.brand-copy span {
  margin-top: 3px;
  color: var(--text-faint);
  font-size: 11px;
}

.sidebar-section {
  display: grid;
  gap: 10px;
}

.section-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: #a6a6a6;
  font-weight: 600;
}

.role-switch,
.sidebar-nav {
  display: grid;
  gap: 9px;
}

.role-button,
.nav-button {
  position: relative;
border-radius: 16px;
  color: var(--text-soft);
  background: transparent;
  transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}

.role-button::before,
.nav-button::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 999px;
  background: transparent;
  transition: background 180ms ease, box-shadow 180ms ease;
}

.role-button {
  padding: 12px 14px 12px 16px;
  text-align: left;
}

.role-button strong,
.role-button span {
  display: block;
}

.role-button strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}

.role-button span {
  margin-top: 5px;
  font-size: 11px;
  line-height: 1.4;
  color: var(--text-faint);
}

.role-button:hover,
.nav-button:hover {
  transform: translateY(-1px);
  background: rgba(204, 125, 94, 0.12);
  color: var(--text);
}

.role-button.active,
.nav-button.active {
  background: rgba(204, 125, 94, 0.22);
  color: var(--text);
}

.role-button:hover::before,
.nav-button:hover::before,
.role-button.active::before,
.nav-button.active::before {
  background: transparent;
  box-shadow: none;
}

.nav-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px 12px 16px;
}

.nav-copy {
  display: grid;
  gap: 3px;
  text-align: left;
}

.nav-copy strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
}

.nav-copy span {
  font-size: 11px;
  color: var(--text-faint);
}

.nav-count {
  min-width: 28px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(204, 125, 94, 0.16);
  color: #f1d4c7;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
}

.fact-strip {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
background: rgba(255, 255, 255, 0.025);
}

.fact-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding-bottom: 10px;
}

.fact-item:last-child {
  padding-bottom: 0;
}

.fact-item span {
  color: var(--text-faint);
  font-size: 10px;
}

.fact-item strong {
  color: var(--text);
  font-size: 11px;
  font-weight: 400;
}

.table-subcopy {
  margin-top: 8px;
  color: var(--text-faint);
  font-size: 11px;
  line-height: 1.5;
}

.empty-state {
  display: grid;
  gap: 8px;
  padding: 48px 24px;
  text-align: center;
}

.empty-state h2 {
  margin: 0;
  font-size: 28px;
}

.empty-state p {
  margin: 0;
  color: var(--text-faint);
}

.guided-empty-state {
  justify-items: center;
}

.empty-state-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 8px;
}

.workspace {
  display: grid;
  gap: 18px;
  align-content: start;
}

.topbar,
.surface,
.story-block,
.mini-panel,
.stat-band,
.call-player,
.script-version-box,
.allocation-summary,
.report-hero,
.quote-panel,
.spotlight {
  position: relative;
  overflow: hidden;
border-radius: var(--radius-xl);
  background: var(--layer-1);
  box-shadow: var(--shadow-panel);
  transition: box-shadow 220ms ease;
}

/* (overlay убран — фон карточек теперь чистый layer-1) */

.surface,
.story-block,
.mini-panel,
.stat-band,
.topbar,
.spotlight {
}

.surface,
.story-block,
.topbar,
.spotlight {
  padding: 24px;
}

.mini-panel,
.call-player,
.script-version-box,
.allocation-summary,
.report-hero,
.quote-panel {
  padding: 16px;
}

.surface:hover,
.story-block:hover,
.mini-panel:hover,
.spotlight:hover {
  box-shadow: none;
}

.topbar {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 20px;
}

.headline p,
.headline h1,
.headline .subline {
  margin: 0;
}

.eyebrow {
  margin-bottom: 10px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--primary);
}

.headline h1 {
  max-width: 14ch;
  font-size: clamp(1.55rem, 2.3vw, 2.3rem);
  line-height: 1.02;
  letter-spacing: 0;
  text-wrap: balance;
}

.subline {
  margin-top: 14px;
  max-width: 64ch;
  color: var(--text-soft);
  font-size: 14px;
}

.topbar-side {
  min-width: 0;
  display: grid;
  gap: 12px;
  align-content: start;
}

.status-chip,
.pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  min-height: 30px;
  padding: 7px 13px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.status-chip {
background: rgba(204, 125, 94, 0.14);
  color: #f1d4c7;
}

.pill {
background: rgba(255, 255, 255, 0.035);
  color: var(--text-soft);
}

.pill.accent {
background: rgba(204, 125, 94, 0.15);
  color: #f1d4c7;
}

.pill.warn {
background: var(--warn-soft);
  color: #ffd18f;
}

.pill.danger {
background: var(--danger-soft);
  color: #ffb0b7;
}

.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.filter {
  display: grid;
  gap: 6px;
  flex: 1 1 140px;
}

.filter label {
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #a6a6a6;
}

.filter select,
.filter input {
  min-width: 0;
  min-height: 42px;
  padding: 0 14px;
border-radius: 14px;
  background: var(--bg-field);
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.filter select:focus-visible,
.filter input:focus-visible {
  outline: 0;
box-shadow:
    0 0 0 4px rgba(204, 125, 94, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.topbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.ghost-button,
.primary-button {
  /* Единое центрирование для button/a/label-вариантов: текст по центру и по
     вертикали, иконки/чипсы — в один ряд с зазором. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  box-sizing: border-box;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  white-space: nowrap;
  transition:
    transform 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease,
    background 180ms ease;
}

.ghost-button {
background: rgba(255, 255, 255, 0.03);
  color: var(--text);
}

.primary-button {
  background: rgba(204, 125, 94, 0.12);
  color: var(--text);
  box-shadow: none;
}

.ghost-button:hover {
  background: rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

.primary-button:hover {
  background: rgba(204, 125, 94, 0.2);
  box-shadow: none;
}

.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.8fr);
  gap: 18px;
}

.two-panel,
.script-layout,
.allocation-layout,
.report-layout,
.admin-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.panel-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.proposal-layout {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.4fr);
  grid-template-areas:
    "pending pending"
    "list details";
  gap: 18px;
  align-items: start;
}

.empty-state-actions .primary-button,
.empty-state-actions .ghost-button {
  min-height: 36px;
  white-space: nowrap;
}

/* Правая колонка с PDF — закреплена при прокрутке. Высота — почти на весь
   viewport за вычетом верхнего паддинга app-shell, чтобы PDF был виден
   целиком без необходимости скроллить страницу. */
.proposal-doc-card {
  grid-area: details;
  position: sticky;
  top: 22px;
  max-height: calc(100vh - 44px);
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 14px;
}

.proposal-list-card,
.proposal-doc-card {
  display: grid;
  gap: 14px;
}

.proposal-list-card {
  grid-area: list;
}

.proposal-filters {
  display: flex;
  align-items: center;
  gap: 8px;
}
.proposal-list-count {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-faint);
  margin: -4px 2px 0;
}

.proposal-list {
  display: grid;
  gap: 10px;
  max-height: calc(100vh - 230px);
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-width: thin;
}
.proposal-list::-webkit-scrollbar { width: 7px; }
.proposal-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 4px; }

.proposal-status-line {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-wrap: wrap;
  margin-top: 6px;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--text-muted);
}
.proposal-status-line.compact {
  margin-top: 0;
  font-size: 11.5px;
}
.proposal-status-line span {
  font-weight: 650;
}
.proposal-status-line.ok span { color: #7fc8a0; }
.proposal-status-line.warn span { color: #f1d4c7; }
.proposal-status-line.danger span { color: #d96a6a; }
.proposal-status-line code {
  font-size: 11px;
  padding: 1px 5px;
  border-radius: 5px;
  background: rgba(255,255,255,0.06);
  color: var(--text-muted);
}
.proposal-status-line small {
  flex-basis: 100%;
  color: var(--text-muted);
}

.proposal-item {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
border-radius: 14px;
  background: var(--layer-2);
  text-align: left;
  color: var(--text);
  cursor: pointer;
  transition: transform 0.16s ease, background 0.16s ease;
}

.proposal-item:hover,
.proposal-item.active {
background: rgba(204, 125, 94, 0.16);
  transform: translateY(-1px);
}

.proposal-item-head {
  display: grid;
  gap: 4px;
}

.proposal-item-head strong {
  font-size: 14px;
  font-weight: 600;
}

.proposal-item-head span,
.proposal-item-copy {
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.55;
}

.proposal-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.proposal-doc {
  display: grid;
  gap: 20px;
  padding: 24px;
border-radius: 18px;
  background: linear-gradient(175deg, rgba(36, 36, 34, 0.95), rgba(28, 28, 26, 0.98));
  box-shadow: inset 0 1px 0 rgba(204, 125, 94, 0.06);
}

.proposal-doc-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.proposal-doc-meta div,
.proposal-doc-section {
  display: grid;
  gap: 6px;
}

.proposal-doc-meta span,
.proposal-doc-section span {
  color: var(--primary);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.proposal-doc-meta strong,
.proposal-doc-section p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.75;
}

.proposal-doc-meta a {
  color: var(--text);
  text-decoration: none;
}

.proposal-doc-meta a:hover {
  color: var(--accent);
}

.proposal-doc-points {
  display: grid;
  gap: 10px;
}

.proposal-doc-points p {
  padding: 10px 14px;
background: rgba(204, 125, 94, 0.04);
  border-radius: 0 8px 8px 0;
  transition: background 0.15s;
}

.proposal-doc-points p:hover {
  background: rgba(204, 125, 94, 0.08);
}

.proposal-doc-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.proposal-link-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.section-stack {
  display: grid;
  gap: 18px;
  align-content: start;
}

.surface-card {
  display: grid;
  gap: 14px;
}

.summary-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cron-page-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 4px 4px 12px;
}

.cron-page-header h1 {
  margin: 6px 0 0;
  font-size: 28px;
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: 0;
}

.cron-page-header .eyebrow {
  margin: 0;
  color: var(--text-faint);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.16em;
}

.cron-schedule-editor {
  display: grid;
  gap: 18px;
}

.cron-schedule-head,
.cron-schedule-row,
.cron-schedule-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.cron-schedule-head h2 {
  margin: 4px 0 6px;
}

.cron-schedule-head p {
  margin: 0;
  color: var(--text-muted);
}

.cron-timezone-field,
.cron-schedule-time {
  display: grid;
  gap: 6px;
  min-width: 180px;
  color: var(--text-muted);
  font-size: 12px;
}

.cron-timezone-field select,
.cron-schedule-time input {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  outline: none;
  background: var(--layer-3);
  color: var(--text);
  color-scheme: dark;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.cron-timezone-field select:focus,
.cron-schedule-time input:focus {
  border-color: rgba(204, 125, 94, 0.7);
  background: rgba(204, 125, 94, 0.06);
  box-shadow: 0 0 0 3px rgba(204, 125, 94, 0.12);
}

.cron-schedule-rows {
  display: grid;
  gap: 10px;
}

.cron-schedule-row {
  padding: 12px 0;
  border-top: 1px solid var(--line-soft);
}

.cron-schedule-row > strong {
  width: 180px;
}

.cron-weekdays {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1;
}

.cron-weekday input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.cron-weekday span {
  display: grid;
  place-items: center;
  width: 36px;
  height: 32px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  color: var(--text-muted);
  cursor: pointer;
}

.cron-weekday.is-active span,
.cron-weekday:has(input:checked) span {
  border-color: rgba(204, 125, 94, 0.55);
  background: rgba(204, 125, 94, 0.12);
  color: var(--text);
}

.cron-schedule-time {
  min-width: 120px;
}

.cron-schedule-actions {
  justify-content: flex-end;
}

.integration-field-note {
  margin: 12px 0 0;
  color: var(--text-muted);
  font-size: 13px;
  line-height: 1.5;
}

@media (max-width: 760px) {
  .cron-schedule-head,
  .cron-schedule-row {
    align-items: stretch;
    flex-direction: column;
  }

  .cron-timezone-field,
  .cron-schedule-time,
  .cron-schedule-row > strong {
    width: 100%;
    min-width: 0;
  }
}

.cron-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}

.cron-card {
  display: grid;
  gap: 18px;
  grid-template-rows: auto auto auto;
  position: relative;
  overflow: hidden;
  background: var(--layer-2);
}

.cron-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: transparent;
  transition: background 200ms ease;
}

.cron-card.cron-running::before {
  background: linear-gradient(180deg, rgba(204, 125, 94, 0.9), rgba(204, 125, 94, 0.4));
  animation: cronRunningPulse 1.6s ease-in-out infinite;
}

.cron-card.cron-running {
}

.cron-card.cron-has-error::before {
  background: linear-gradient(180deg, rgba(220, 80, 60, 0.85), rgba(220, 80, 60, 0.35));
}

.cron-card.cron-has-error {
}

.cron-card-placeholder {
opacity: 0.62;
}

@keyframes cronRunningPulse {
  0%, 100% { opacity: 0.55; }
  50% { opacity: 1; }
}

.cron-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.cron-card-head > .pill {
  justify-self: end;
  max-width: 100%;
}

.cron-card-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  max-width: 100%;
  min-width: 0;
}

.cron-card-title > div {
  min-width: 0;
}

.cron-dot {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  margin-top: 8px;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.03);
}

.cron-dot.dot-active {
  background: #6ec07a;
  box-shadow: 0 0 0 3px rgba(110, 192, 122, 0.18), 0 0 12px rgba(110, 192, 122, 0.5);
}

.cron-dot.dot-running {
  background: #cc7d5e;
  box-shadow: 0 0 0 3px rgba(204, 125, 94, 0.18), 0 0 14px rgba(204, 125, 94, 0.7);
  animation: cronDotPulse 1.4s ease-in-out infinite;
}

.cron-dot.dot-error {
  background: #dc503c;
  box-shadow: 0 0 0 3px rgba(220, 80, 60, 0.2), 0 0 12px rgba(220, 80, 60, 0.55);
}

.cron-dot.dot-warning {
  background: #dba74d;
  box-shadow: 0 0 0 3px rgba(219, 167, 77, 0.18), 0 0 12px rgba(219, 167, 77, 0.45);
}

.cron-dot.dot-idle {
  background: rgba(249, 249, 247, 0.22);
}

.cron-dot.dot-soon {
  background: rgba(204, 125, 94, 0.5);
  box-shadow: 0 0 0 3px rgba(204, 125, 94, 0.08);
}

@keyframes cronDotPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.35); }
}

.cron-card-head h2,
.cron-card-head p {
  margin: 0;
}

.cron-card-head h2 {
  font-size: 18px;
  line-height: 1.2;
  font-weight: 700;
}

.cron-card-title p {
  margin-top: 6px;
  color: var(--text-soft);
  font-size: 12.5px;
  line-height: 1.55;
}

/* Кнопка "Запустить" в карточках автоматизаций — оформлена так же,
   как активная плашка в левом меню: приглушённый фон, тонкий border,
   без glow / box-shadow вокруг. */
.cron-actions-row .primary-button {
  background: rgba(204, 125, 94, 0.1);
  color: var(--text);
  box-shadow: none;
}

.cron-actions-row .primary-button:hover:not(:disabled) {
  background: rgba(204, 125, 94, 0.16);
  box-shadow: none;
  transform: none;
}

.cron-actions-row .primary-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.cron-run-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.cron-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.cron-meta-grid div,
.cron-footnote {
  display: grid;
  gap: 5px;
}

.cron-meta-grid span,
.cron-footnote span {
  color: #a6a6a6;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.cron-meta-grid strong,
.cron-footnote strong {
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.5;
  font-weight: 500;
}

.cron-actions-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

/* Блок настройки KPI (целевое число компаний) в карточке abm-reserve */
.cron-kpi-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin: 14px 0;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px dashed var(--border, rgba(255,255,255,0.14));
  background: var(--surface-2, rgba(255,255,255,0.03));
}
.cron-kpi-label { display: flex; flex-direction: column; gap: 2px; }
.cron-kpi-label span { font-size: 13px; font-weight: 600; color: var(--text); }
.cron-kpi-label small { font-size: 11px; color: var(--text-muted, #9aa4b2); max-width: 320px; }
.cron-kpi-control { display: inline-flex; align-items: center; gap: 8px; }
.cron-kpi-input {
  width: 72px;
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid var(--border, rgba(255,255,255,0.14));
  background: var(--layer-3);
  color: var(--text);
  font-size: 14px;
  text-align: center;
}
.cron-kpi-input:disabled { opacity: 0.5; }

.cron-toggle {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  user-select: none;
}

.cron-toggle input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.cron-toggle-track {
  position: relative;
  width: 54px;
  height: 30px;
  border-radius: 999px;
background: rgba(255, 255, 255, 0.05);
  transition: background 180ms ease, border-color 180ms ease;
}

.cron-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  box-shadow: none;
  transition: transform 180ms ease;
}

.cron-toggle.is-enabled .cron-toggle-track {
  background: rgba(204, 125, 94, 0.2);
}

.cron-toggle.is-enabled .cron-toggle-thumb {
  transform: translateX(24px);
  background: #f1d4c7;
}

.cron-toggle.is-busy {
  opacity: 0.7;
}

.cron-toggle-copy {
  color: var(--text-soft);
  font-size: 13px;
}

.cron-error {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(217, 121, 104, 0.1);
  color: #ffc3c9;
  font-size: 12px;
  line-height: 1.6;
}

.cron-state-detail {
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.5;
}

.cron-state-detail.is-blocking {
  background: rgba(204,125,94,0.08);
  border-color: rgba(204,125,94,0.22);
  color: #f1d4c7;
}

.cron-flow-detail {
  padding: 9px 12px;
  border-radius: 10px;
  background: rgba(255,255,255,0.035);
  border: 1px solid rgba(255,255,255,0.08);
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.5;
}

.cron-flow-detail.warn {
  background: rgba(234,179,8,0.1);
  border-color: rgba(234,179,8,0.24);
  color: #f8df9d;
}

.cron-run-snapshot {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.035);
}

.cron-run-snapshot-head,
.cron-run-snapshot-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.cron-run-snapshot-head div {
  display: grid;
  gap: 4px;
}

.cron-run-snapshot-head span,
.cron-run-snapshot-meta span,
.cron-run-stage > span {
  color: var(--text-faint);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.cron-run-snapshot-head strong {
  color: var(--text);
  font-size: 15px;
}

.cron-run-snapshot-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cron-run-snapshot-meta div {
  display: grid;
  gap: 4px;
}

.cron-run-snapshot-meta strong,
.cron-run-stage strong {
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.45;
}

.cron-run-snapshot-summary {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.5;
}

.cron-run-stage-list {
  display: grid;
  gap: 8px;
}

.cron-run-stage {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.035);
}

.cron-run-stage > span:first-child {
  grid-column: 1;
  grid-row: 1;
}

.cron-run-stage > .pill {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
}

.cron-run-stage > strong,
.cron-run-stage small,
.cron-run-stage > .cron-run-snapshot-meta {
  grid-column: 1 / -1;
}

.cron-run-stage.is-running {
  background: rgba(204, 125, 94, 0.09);
}

.cron-run-stage.is-warning {
  background: rgba(219, 167, 77, 0.08);
}

.cron-run-stage.is-failed {
  background: rgba(217, 121, 104, 0.1);
}

.cron-run-stage small {
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.45;
}

.cron-run-status {
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(118, 173, 162, 0.1);
  color: #cce7df;
  font-size: 12px;
  line-height: 1.6;
}

.cron-run-status.is-warning {
  background: rgba(204, 125, 94, 0.12);
  color: #ffd7c9;
}

.cron-run-status.is-success {
  background: rgba(97, 161, 122, 0.12);
  color: #c9e8d2;
}

.integration-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.integration-stack,
.icp-card {
  display: grid;
  gap: 14px;
}

.integration-stack-wide {
  grid-column: 1 / -1;
}

.integration-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 12px;
}

.integration-token-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.integration-token-head h3,
.integration-token-head p {
  margin: 0;
}

.integration-token-head h3 {
  margin-top: 4px;
  color: var(--text);
  font-size: 18px;
  font-weight: 700;
}

.integration-token-head p {
  margin-top: 8px;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.55;
}

.integration-token-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.integration-token-grid.single {
  grid-template-columns: 1fr;
}

.integration-token-field {
  display: grid;
  gap: 8px;
}

.integration-token-field span {
  color: #a6a6a6;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.integration-token-field .integration-secret-status {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  margin-left: 8px;
  padding: 3px 7px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.06);
  color: var(--text-muted);
  font-size: 10px;
  line-height: 1;
  text-transform: none;
  letter-spacing: 0;
  vertical-align: middle;
}

.integration-token-field .integration-secret-status.configured {
  border-color: rgba(94, 204, 151, 0.28);
  background: rgba(94, 204, 151, 0.1);
  color: #a9e8c8;
}

.integration-token-field input {
  width: 100%;
border-radius: 12px;
  background: rgba(36, 36, 34, 0.92);
  color: var(--text);
  padding: 11px 12px;
  font: inherit;
  outline: none;
}

.integration-token-field input:focus {
box-shadow: 0 0 0 3px rgba(204, 125, 94, 0.12);
}

.integration-token-field .integration-select-field {
  width: 100%;
  display: flex;
}

.integration-token-field .integration-select-field select {
  width: 100%;
  min-height: 42px;
}

.integration-token-field small {
  color: var(--text-faint);
  font-size: 11px;
}

.integration-help {
  display: grid;
  gap: 10px;
  padding: 12px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.integration-help p {
  margin: 4px 0 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.55;
}

.integration-help-steps {
  margin: 0;
  padding-left: 18px;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.5;
}

.integration-help-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.integration-help-links a {
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}

.integration-help-links a:hover {
  text-decoration: underline;
}

.email-settings-groups {
  display: grid;
  gap: 14px;
}

.email-settings-section {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.025);
}

.email-settings-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.email-settings-head h4 {
  margin: 0;
  color: var(--text);
  font-size: 15px;
  font-weight: 800;
}

.email-settings-head p {
  margin: 5px 0 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.45;
}

.email-replan-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.email-replan-panel p {
  margin: 4px 0 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.4;
}

.email-replan-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.email-replan-actions button {
  min-width: 112px;
}

.integration-card {
  display: grid;
  gap: 12px;
  padding: 16px;
border-radius: 18px;
  background: var(--layer-2);
}

.integration-card.clickable {
  width: 100%;
  color: inherit;
  text-align: left;
  cursor: pointer;
  appearance: none;
  transition: background 160ms ease, transform 160ms ease;
}

.integration-card.clickable:hover {
background: rgba(204, 125, 94, 0.16);
  transform: translateY(-1px);
}

.integration-card.compact {
  gap: 10px;
}

.integration-card-action {
  color: var(--accent);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.integration-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 30;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(36, 36, 34, 0.72);
  backdrop-filter: blur(12px);
}

.integration-modal {
  width: min(560px, 100%);
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  overflow-x: hidden;
  display: grid;
  gap: 18px;
  padding: 20px;
  border-radius: 24px;
  background: var(--layer-3);
  box-shadow: none;
}

.integration-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.integration-modal-wide {
  width: min(640px, 100%);
}

.integration-modal-email {
  width: min(920px, 100%);
}

.email-mailbox-layout {
  display: grid;
  grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.email-mailbox-sidebar,
.email-mailbox-content,
.email-mailbox-editor {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.email-mailbox-sidebar {
  position: sticky;
  top: 0;
}

.email-mailbox-sidebar-head {
  display: grid;
  gap: 8px;
}

.email-mailbox-sidebar-head strong {
  color: var(--text);
  font-size: 13px;
}

.email-mailbox-list {
  display: grid;
  gap: 7px;
  max-height: 420px;
  overflow-y: auto;
}

.email-mailbox-list [role="listitem"] {
  min-width: 0;
}

.email-mailbox-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 32px;
  gap: 6px;
  align-items: stretch;
}

.email-mailbox-item {
  width: 100%;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.025);
  color: var(--text-soft);
  text-align: left;
  cursor: pointer;
}

.email-mailbox-remove {
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.025);
  color: var(--text-faint);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}

.email-mailbox-remove:hover {
  border-color: rgba(217, 91, 91, 0.7);
  color: #f08c8c;
  background: rgba(217, 91, 91, 0.1);
}

.email-mailbox-remove:disabled {
  cursor: default;
  opacity: 0.5;
}

.email-field-source,
.email-secret-staged,
.email-provider-hint,
.email-unsaved-note {
  margin: 0;
  color: var(--text-faint);
  font-size: 11px;
  line-height: 1.45;
}

.email-field-source.is-manual,
.email-secret-staged,
.email-unsaved-note {
  color: var(--accent);
}

.email-secret-staged button,
.email-unsaved-note button {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
}

.email-provider-hint a {
  color: var(--accent);
}

.email-mailbox-item:hover,
.email-mailbox-item.is-active {
  border-color: rgba(204, 125, 94, 0.58);
  background: rgba(204, 125, 94, 0.11);
}

.email-mailbox-item strong,
.email-mailbox-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.email-mailbox-item strong {
  color: var(--text);
  font-size: 13px;
}

.email-mailbox-item span {
  color: var(--text-faint);
  font-size: 11px;
}

.email-mailbox-enabled {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--text-soft);
  font-size: 13px;
}

.email-advanced-settings,
.email-shared-settings,
.email-mailbox-tests {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.025);
}

.email-advanced-settings > summary,
.email-shared-settings > summary {
  color: var(--text);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.email-mailbox-tests > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.email-mailbox-tests strong {
  color: var(--text-soft);
  font-size: 12px;
  font-weight: 600;
}

.email-mailbox-empty {
  display: grid;
  place-items: center;
  gap: 12px;
  min-height: 180px;
  color: var(--text-soft);
  text-align: center;
}

@media (max-width: 760px) {
  .email-mailbox-layout {
    grid-template-columns: 1fr;
  }

  .email-mailbox-sidebar {
    position: static;
  }

  .email-mailbox-list {
    max-height: 180px;
  }
}

.tg-auth-section,
.email-test-section {
  padding: 16px 0 0;
  display: grid;
  gap: 12px;
}

.email-test-section p {
  margin: 4px 0 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.45;
}

.tg-auth-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.tg-auth-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.tg-auth-hint {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.45;
}

.tg-step {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(255, 255, 255, 0.3);
  transition: all 0.2s;
}

.tg-step.active {
  background: rgba(255, 200, 60, 0.15);
  color: rgba(255, 200, 60, 0.9);
}

.tg-step.done {
  background: rgba(0, 200, 83, 0.15);
  color: #00c853;
}

.tg-auth-success {
  padding: 16px;
  background: rgba(0, 200, 83, 0.08);
border-radius: 12px;
  display: grid;
  gap: 8px;
}

.tg-auth-success strong {
  color: #4caf50;
}

.tg-auth-success p {
  margin: 0;
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.6);
}

.email-test-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.email-test-row input {
  flex: 1 1 220px;
  min-width: 0;
  padding: 8px 12px;
  font-size: 0.88rem;
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
border-radius: 10px;
  font-family: inherit;
}

.email-test-row button {
  flex: 0 1 auto;
  white-space: normal;
}

.email-test-row input:focus {
  outline: none;
}

.email-test-result {
  display: block;
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.5);
}

.pill.success {
  background: rgba(0, 200, 83, 0.18);
  color: #00c853;
}

.pill.danger {
  background: rgba(255, 95, 56, 0.18);
  color: #ff5f38;
}

.integration-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.integration-card-head strong,
.integration-card-head p {
  display: block;
  margin: 0;
}

.integration-card-head strong {
  font-size: 15px;
  font-weight: 600;
}

.integration-card-head p {
  margin-top: 6px;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.6;
}

.integration-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.integration-meta-grid div,
.icp-block {
  display: grid;
  gap: 5px;
}

.integration-meta-grid span,
.icp-block span {
  color: #a6a6a6;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.integration-meta-grid strong {
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.5;
  font-weight: 500;
}

.icp-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.icp-block {
  padding: 16px;
border-radius: 18px;
  background: rgba(255, 255, 255, 0.025);
}

.icp-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0;
}

.icp-segment-list {
  display: grid;
  gap: 16px;
}

.icp-segment-card {
border-radius: 18px;
  background: rgba(45, 45, 43, 0.55);
  padding: 16px;
}

.icp-segment-head {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(160px, 0.8fr) auto;
  gap: 12px;
  align-items: end;
}

.icp-segment-head label,
.icp-markdown-editor {
  display: grid;
  gap: 8px;
}

.icp-segment-head span,
.icp-markdown-editor span {
  color: #a6a6a6;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.icp-segment-head input,
.icp-segment-head select,
.icp-markdown-editor textarea {
  width: 100%;
border-radius: 12px;
  background: rgba(36, 36, 34, 0.92);
  color: var(--text);
  padding: 11px 12px;
  font: inherit;
  outline: none;
}

.icp-segment-head input:focus,
.icp-segment-head select:focus,
.icp-markdown-editor textarea:focus {
box-shadow: 0 0 0 3px rgba(204, 125, 94, 0.12);
}

.icp-enable-toggle {
  display: inline-flex !important;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 8px;
  min-height: 42px;
}

/* ───── Settings: вкладочный tab-bar ───── */
.settings-page {
  gap: 20px;
}

.settings-tabs-wrap {
  background: transparent;
}

.settings-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 6px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.settings-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--text-soft);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background 150ms ease, border-color 150ms ease, color 150ms ease;
  white-space: nowrap;
}

.settings-tab:hover:not(.active) {
  background: rgba(255, 255, 255, 0.04);
  color: var(--text);
}

.settings-tab.active {
  background: rgba(204, 125, 94, 0.16);
  border-color: rgba(204, 125, 94, 0.35);
  color: #f1d4c7;
}

.settings-tab-label {
  font-size: 14px;
}

.settings-tab-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.1);
  color: var(--text-soft);
  font-size: 11px;
  font-weight: 600;
}

.settings-tab.active .settings-tab-badge {
  background: rgba(204, 125, 94, 0.35);
  color: #f1d4c7;
}

.settings-tab-badge.is-warn {
  background: rgba(220, 80, 80, 0.85);
  color: #fff;
}

@media (max-width: 760px) {
  .settings-tab {
    padding: 8px 12px;
  }
  .settings-tab-label {
    font-size: 13px;
  }
}

/* ICP-сегмент: тумблер «Активен» — повторяет UX cron-toggle. */
.icp-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  cursor: pointer;
  user-select: none;
}

.icp-toggle input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.icp-toggle-track {
  position: relative;
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: background 180ms ease, border-color 180ms ease;
  flex-shrink: 0;
}

.icp-toggle-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  transition: transform 180ms ease, background 180ms ease;
}

.icp-toggle.is-enabled .icp-toggle-track {
  background: rgba(204, 125, 94, 0.25);
  border-color: rgba(204, 125, 94, 0.45);
}

.icp-toggle.is-enabled .icp-toggle-thumb {
  transform: translateX(20px);
  background: #f1d4c7;
}

.icp-toggle-copy {
  color: var(--text-soft);
  font-size: 13px;
  min-width: 80px;
}

.icp-toggle.is-enabled .icp-toggle-copy {
  color: var(--text);
}

.icp-markdown-editor {
  margin-top: 14px;
}

.icp-markdown-editor textarea {
  min-height: 230px;
  resize: vertical;
  line-height: 1.55;
}

.icp-preview {
  margin-top: 18px;
padding-top: 16px;
}

.icp-preview summary {
  cursor: pointer;
  color: var(--text);
  font-weight: 600;
  font-size: 14px;
}

.icp-markdown {
  display: grid;
  gap: 12px;
  padding: 20px;
border-radius: 20px;
  background: var(--layer-3);
}

.icp-markdown h1,
.icp-markdown h2,
.icp-markdown h3,
.icp-markdown h4 {
  margin: 0;
  line-height: 1.2;
}

.icp-markdown h1 {
  font-size: 28px;
}

.icp-markdown h2 {
  margin-top: 8px;
  font-size: 22px;
}

.icp-markdown h3 {
  margin-top: 4px;
  font-size: 17px;
  color: var(--text);
}

.icp-markdown p,
.icp-markdown li {
  margin: 0;
  color: var(--text-soft);
  font-size: 14px;
  line-height: 1.8;
}

.icp-markdown ul,
.icp-markdown ol {
  margin: 0;
  padding-left: 22px;
  display: grid;
  gap: 8px;
}

.icp-markdown hr {
  width: 100%;
  height: 1px;
background: rgba(249, 249, 247, 0.14);
}

.icp-markdown strong {
  color: var(--text);
  font-weight: 600;
}

.icp-markdown code {
  padding: 2px 6px;
  border-radius: 8px;
  background: rgba(204, 125, 94, 0.12);
  color: #f1d4c7;
  font-size: 12px;
}

.proposal-doc-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}

.proposal-doc-head h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
}

.proposal-doc-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

.proposal-no-pdf {
  padding: 32px;
  background: var(--layer-3);
  border-radius: 18px;
  color: var(--text-faint);
  text-align: center;
}

.kp-templates-section {
  display: grid;
  gap: 20px;
}

.kp-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.kp-templates-list {
  display: grid;
  gap: 16px;
}

.kp-template-card {
  display: grid;
  gap: 18px;
  padding: 22px 26px;
border-radius: 18px;
  background: linear-gradient(168deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
  transition: border-color 0.2s, box-shadow 0.2s;
}

.kp-template-card:hover {
box-shadow: none;
}

.kp-template-card.kp-template-editing {
background: rgba(255, 200, 60, 0.03);
}

.kp-template-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.kp-template-head-left {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}

.kp-template-badge {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.kp-badge-system {
  background: linear-gradient(135deg, rgba(204, 125, 94, 0.22), rgba(204, 125, 94, 0.08));
  color: var(--primary);
}

.kp-badge-custom {
  background: linear-gradient(135deg, rgba(208, 178, 121, 0.18), rgba(208, 178, 121, 0.06));
  color: var(--success);
}

.kp-template-head .eyebrow {
  margin-bottom: 4px;
}

.kp-template-head h3 {
  font-size: 1.05rem;
  font-weight: 600;
  color: #fff;
  margin: 0;
}

.kp-template-desc {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 4px;
}

.kp-template-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

.kp-delete-btn {
  color: #ff6b6b !important;
}

.kp-delete-btn:hover {
  background: rgba(255, 107, 107, 0.1) !important;
}

.kp-template-rules {
  padding: 14px 18px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 12px;
}

.kp-rules-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 6px;
}

.kp-template-rules p {
  font-size: 0.88rem;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.5;
  margin: 0;
}

.kp-template-preview {
  overflow: hidden;
  border-radius: 14px;
}

.kp-template-preview iframe {
  width: 100%;
  height: 500px;
display: block;
}

.kp-template-form {
  display: grid;
  gap: 10px;
}

.kp-form-label {
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: rgba(255, 255, 255, 0.5);
}

.kp-form-input,
.kp-form-textarea {
  width: 100%;
  padding: 10px 14px;
  font-size: 0.92rem;
  color: #fff;
  background: rgba(255, 255, 255, 0.05);
border-radius: 10px;
  font-family: inherit;
  resize: vertical;
  transition: border-color 0.2s;
}

.kp-form-input:focus,
.kp-form-textarea:focus {
  outline: none;
}

.kp-form-actions {
  display: flex;
  gap: 10px;
  margin-top: 6px;
}

.kp-preview-doc {
  display: grid;
  gap: 0;
border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(175deg, rgba(36, 36, 34, 0.95), rgba(30, 30, 28, 0.98));
}

.kp-preview-header {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  background: linear-gradient(135deg, rgba(204, 125, 94, 0.12), rgba(204, 125, 94, 0.04));
}

.kp-preview-logo {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--primary), #a85f40);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9rem;
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.06em;
}

.kp-preview-title-block h4 {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
  line-height: 1.3;
}

.kp-preview-title-block p {
  margin: 3px 0 0;
  font-size: 0.8rem;
  color: var(--text-faint);
}

.kp-preview-intro {
  padding: 16px 24px;
}

.kp-preview-intro p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--text-soft);
  line-height: 1.65;
  font-style: italic;
}

.kp-preview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.kp-preview-block {
  padding: 16px 24px;
}

.kp-preview-block:first-child {
}

.kp-preview-block-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.kp-preview-block-head span:last-child {
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-faint);
}

.kp-preview-icon {
  font-size: 0.6rem;
  line-height: 1;
}

.kp-preview-value .kp-preview-icon { color: var(--primary); }
.kp-preview-services .kp-preview-icon { color: var(--success); }
.kp-preview-regional .kp-preview-icon { color: #7eb8d0; }
.kp-preview-clients .kp-preview-icon { color: var(--warn); }

.kp-preview-block ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}

.kp-preview-block li {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.55;
  padding-left: 14px;
  position: relative;
}

.kp-preview-block li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(204, 125, 94, 0.45);
}

.kp-preview-value li::before { background: rgba(204, 125, 94, 0.5); }
.kp-preview-services li::before { background: rgba(208, 178, 121, 0.5); }
.kp-preview-regional li::before { background: rgba(126, 184, 208, 0.5); }
.kp-preview-clients li::before { background: rgba(224, 164, 95, 0.5); }

.kp-preview-timeline {
  padding: 16px 24px;
}

.kp-preview-timeline .kp-preview-icon { color: #7eb8d0; }

.kp-preview-timeline p {
  margin: 0;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.6;
}

.kp-preview-cta {
  padding: 18px 24px;
  background: linear-gradient(135deg, rgba(204, 125, 94, 0.08), rgba(204, 125, 94, 0.02));
}

.kp-preview-cta p {
  margin: 0;
  font-size: 0.88rem;
  color: var(--primary-strong);
  font-weight: 500;
  line-height: 1.5;
}

.kp-preview-footer {
  padding: 12px 24px;
  background: rgba(0, 0, 0, 0.15);
}

.kp-preview-footer p {
  margin: 0;
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.3);
  font-style: italic;
}

.employee-ranking-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.manager-profile-stack {
  display: grid;
  gap: 16px;
}

.manager-profile-card,
.manager-summary-card,
.manager-leads-card {
  display: grid;
  gap: 14px;
}

.manager-summary-copy {
  display: grid;
  gap: 12px;
}

.manager-summary-copy p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.72;
}

.manager-insight-copy {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.72;
}

.manager-key-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.manager-leads-list {
  display: grid;
  gap: 12px;
}

.manager-lead-empty {
  padding: 12px 0;
  color: var(--text-faint);
  font-size: 12px;
}

.manager-lead-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  padding: 14px 0;
}

.manager-lead-row:first-child {
padding-top: 0;
}

.manager-lead-main {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.manager-lead-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.manager-lead-ident {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.manager-lead-main strong {
  font-size: 14px;
  font-weight: 400;
}

.manager-lead-main span {
  color: var(--text-faint);
  font-size: 11px;
}

.lead-stage {
  display: grid;
  gap: 8px;
}

.lead-stage-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--text-faint);
}

.lead-stage-meta span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.lead-stage-meta span:last-child {
  text-align: right;
  color: var(--text-soft);
  text-transform: none;
  letter-spacing: 0;
  font-size: 11px;
  line-height: 1.45;
}

.lead-stage-bar {
  overflow: hidden;
  height: 6px;
border-radius: 999px;
  background: var(--layer-3);
}

.lead-stage-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #cc7d5e;
  box-shadow: 0 0 0 1px rgba(204, 125, 94, 0.12);
}

.lead-stage-flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}

.lead-stage-chip {
  padding: 6px 6px 5px;
  border-radius: 999px;
background: var(--layer-3);
  color: var(--text-faint);
  font-size: 9px;
  line-height: 1.1;
  text-align: center;
  white-space: nowrap;
}

.lead-stage-chip.done {
  color: #d0b279;
background: rgba(208, 178, 121, 0.08);
}

.lead-stage-chip.active {
  color: #f1d4c7;
background: rgba(204, 125, 94, 0.12);
}

.manager-lead-side {
  display: grid;
  justify-items: end;
  align-content: start;
  gap: 6px;
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.manager-lead-side .pill {
  min-width: 58px;
  justify-content: center;
}

.employee-rank-card {
  display: grid;
  gap: 12px;
  padding: 16px;
border-radius: 18px;
  background: rgba(255, 255, 255, 0.025);
  color: var(--text);
  text-align: left;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.employee-rank-card:hover {
  transform: translateY(-2px);
box-shadow: var(--shadow-soft);
  background: rgba(204, 125, 94, 0.05);
}

.employee-rank-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.employee-rank-title {
  display: grid;
  gap: 6px;
}

.employee-rank-place {
  color: var(--text-faint);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.employee-rank-title strong {
  color: var(--text);
  font-size: 15px;
}

.employee-rank-meta {
  display: grid;
  gap: 4px;
  color: var(--text-faint);
  font-size: 11px;
}

.employee-rank-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.employee-rank-stats div {
  padding: 10px;
  border-radius: 14px;
  background: var(--layer-3);
}

.employee-rank-stats span,
.employee-rank-stats strong {
  display: block;
}

.employee-rank-stats span {
  color: var(--text-faint);
  font-size: 10px;
}

.employee-rank-stats strong {
  margin-top: 6px;
  color: var(--text);
  font-size: 14px;
}

.employee-rank-card p {
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.55;
}

.mini-stack {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.spotlight {
  grid-column: 1 / -1;
  padding: 22px;
  background: var(--layer-2);
}

.spotlight-header {
  position: relative;
  display: block;
  margin-bottom: 20px;
}

.management-summary {
  display: grid;
  gap: 12px;
  width: 100%;
}

.management-summary h2 {
  margin: 0;
  max-width: none;
  font-size: 1.35rem;
  line-height: 1.08;
  letter-spacing: 0;
}

.management-summary p {
  margin: 0;
  max-width: none;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.62;
}

.spotlight-header .management-summary p {
  max-width: none;
}

.spotlight-header h2 {
  margin: 0;
  max-width: 18ch;
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.06;
  letter-spacing: 0;
}

.spotlight-header p {
  margin: 12px 0 0;
  max-width: 62ch;
  color: var(--text-soft);
  font-size: 14px;
}

.spotlight-header > .pill {
  position: absolute;
  top: 0;
  right: 0;
}

.stat-band {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 0;
box-shadow: none;
  background: transparent;
}

.stat {
  position: relative;
  overflow: hidden;
  padding: 16px;
border-radius: 18px;
  background: var(--layer-2);
  box-shadow: none;
}

.stat::before {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  top: 0;
  height: 3px;
  border-radius: 999px;
  background: #cc7d5e;
}

.stat strong,
.stat span,
.stat small {
  display: block;
}

.stat strong {
  font-size: clamp(1.25rem, 1.4vw, 1.55rem);
  font-weight: 700;
  letter-spacing: 0;
}

.stat span {
  margin-top: 8px;
  color: var(--text-soft);
  font-size: 13px;
}

.stat small {
  margin-top: 14px;
  font-size: 11px;
  font-weight: 500;
}

.metric-up {
  color: #d0b279;
}

.metric-warn {
  color: #ffd493;
}

.metric-down {
  color: #ffb1bd;
}

.block-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.block-header h2 {
  margin: 0;
  max-width: 28ch;
  font-size: 1.2rem;
  line-height: 1.15;
  letter-spacing: 0;
  font-weight: 700;
}

.block-header p {
  margin: 8px 0 0;
  color: var(--text-faint);
  font-size: 13px;
  line-height: 1.5;
}

.funnel-rows,
.loss-accordion-list,
.timeline-list,
.transcript-list,
.report-list,
.recommendation-list,
.allocation-list,
.integration-list,
.action-list,
.bullet-list {
  display: grid;
  gap: 10px;
}

.loss-accordion-list {
  display: grid;
  gap: 12px;
}

.loss-accordion {
border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
  overflow: hidden;
}

.loss-toggle {
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
background: transparent;
  color: var(--text);
  text-align: left;
}

.loss-toggle-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.loss-toggle-copy strong {
  font-size: 14px;
  font-weight: 400;
}

.loss-toggle-copy span {
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.55;
}

.loss-toggle-side {
  display: grid;
  justify-items: end;
  gap: 4px;
  flex: 0 0 auto;
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.loss-toggle-side strong {
  font-size: 13px;
  color: var(--text);
}

.loss-body {
  display: none;
  gap: 12px;
  padding: 0 14px 14px;
}

.loss-accordion.open .loss-body {
  display: grid;
}

.loss-body-copy {
  display: grid;
  gap: 10px;
}

.loss-body-copy p {
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.6;
}

.recommendation-copy {
  display: grid;
  gap: 12px;
}

.recommendation-copy p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.72;
}

.row-item,
.allocation-row,
.integration-row,
.timeline-item,
.transcript-item,
.report-item,
.recommendation-row,
.action-item {
  position: relative;
  overflow: hidden;
  display: grid;
  gap: 9px;
  padding: 14px;
border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
}

.row-item::after,
.allocation-row::after,
.integration-row::after,
.timeline-item::after,
.transcript-item::after,
.report-item::after,
.recommendation-row::after,
.action-item::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: rgba(255, 255, 255, 0.02);
}

.row-head,
.allocation-head,
.integration-head,
.report-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.label-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.bar-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.07);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.35);
}

.bar-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #cc7d5e;
  box-shadow: 0 0 24px rgba(204, 125, 94, 0.4);
}

.bar-track.warn span {
  background: #e0a45f;
  box-shadow: 0 0 20px rgba(224, 164, 95, 0.28);
}

.bar-track.danger span {
  background: #d97968;
  box-shadow: 0 0 20px rgba(217, 121, 104, 0.28);
}

.action-item {
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.action-item:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-soft);
}

.action-item strong,
.action-item span {
  display: block;
}

.action-item strong {
  font-size: 14px;
}

.action-item span {
  color: var(--text-soft);
  font-size: 12px;
}

.action-item.accent {
background: rgba(204, 125, 94, 0.08);
}

.action-item.warn {
background: rgba(224, 164, 95, 0.08);
}

.action-item.danger {
background: rgba(217, 121, 104, 0.08);
}

.script-stack {
  display: grid;
  gap: 18px;
}

/* ── Task Tracker ─────────────────────────────────────── */

.task-tracker-page {
  display: grid;
  gap: 16px;
}

.task-tracker-header {
  display: grid;
  gap: 18px;
}

.task-header-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}

.task-header-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}

.task-add-toggle {
  white-space: nowrap;
}

.task-add-toggle.active {
  background: rgba(204, 125, 94, 0.12);
  color: var(--primary);
}

/* Stats row */
.task-stats-row {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}

.task-stat-card {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(249, 249, 247, 0.04);
}

.task-stat-card.stat-overdue {
  background: rgba(220, 80, 60, 0.1);
}

.task-stat-card.stat-high {
  background: rgba(204, 125, 94, 0.08);
}

.task-stat-value {
  font-size: 1.4rem;
  font-weight: 700;
  letter-spacing: 0;
  color: var(--text);
}

.stat-overdue .task-stat-value { color: #dc503c; }

.task-stat-label {
  font-size: 11px;
  color: var(--text-soft);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.task-stat-progress {
  justify-content: center;
}

.task-progress-bar {
  height: 6px;
  border-radius: 3px;
  background: rgba(249, 249, 247, 0.08);
  overflow: hidden;
}

.task-progress-fill {
  height: 100%;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--primary), #df9577);
  transition: width 400ms ease;
}

/* Toolbar */
.task-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 20px !important;
}

.task-toolbar-left {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.task-toolbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

.task-search-wrap {
  position: relative;
}

.task-search-input {
  width: 200px;
border-radius: 10px;
  background: var(--layer-3);
  color: var(--text);
  padding: 7px 12px;
  font: inherit;
  font-size: 13px;
}

.task-search-input:focus {
  outline: none;
}

.task-filter-group {
  display: flex;
  gap: 2px;
  background: rgba(249, 249, 247, 0.04);
  border-radius: 10px;
  padding: 2px;
}

.task-filter-btn {
  padding: 5px 12px;
border-radius: 8px;
  background: transparent;
  color: var(--text-soft);
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition: all 150ms ease;
  white-space: nowrap;
}

.task-filter-btn:hover {
  color: var(--text);
  background: rgba(249, 249, 247, 0.06);
}

.task-filter-btn.active {
  background: rgba(204, 125, 94, 0.15);
  color: var(--primary);
  font-weight: 600;
}

.task-filter-reset {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.task-sort-select {
border-radius: 10px;
  background: var(--layer-3);
  color: var(--text);
  padding: 6px 10px;
  font: inherit;
  font-size: 12px;
}

.task-view-toggle {
  display: flex;
  gap: 2px;
  background: rgba(249, 249, 247, 0.04);
  border-radius: 10px;
  padding: 2px;
}

.task-view-btn {
  width: 32px;
  height: 28px;
border-radius: 8px;
  background: transparent;
  color: var(--text-soft);
  font-size: 14px;
  cursor: pointer;
  transition: all 150ms ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.task-view-btn:hover { color: var(--text); }
.task-view-btn.active { background: rgba(204, 125, 94, 0.15); color: var(--primary); }

.task-filter-notice {
  text-align: right;
  padding: 0 4px;
}

/* Create form */
.task-create-card,
.task-column {
  display: grid;
  gap: 14px;
}

.task-create-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.task-create-grid label {
  display: grid;
  gap: 7px;
  color: var(--text-soft);
  font-size: 12px;
}

.task-create-grid input,
.task-create-grid select,
.task-create-grid textarea {
  width: 100%;
border-radius: 14px;
  background: var(--layer-3);
  color: var(--text);
  padding: 12px 13px;
  font: inherit;
}

.task-create-description {
  grid-column: span 2;
}

/* Board */
.task-board {
  display: grid;
  grid-template-columns: repeat(5, minmax(300px, 1fr));
  gap: 14px;
  align-items: start;
  overflow-x: auto;
  overflow-y: clip;
  padding-bottom: 12px;
  -webkit-overflow-scrolling: touch;
}

.task-column {
  min-width: 300px;
  overflow: visible;
}

.task-column-head {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.task-column-head-right {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.task-column-add {
  width: 28px;
  height: 28px;
border-radius: 8px;
  background: transparent;
  color: var(--text-soft);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 150ms ease;
  line-height: 1;
}

.task-column-add:hover {
color: var(--primary);
  background: rgba(204, 125, 94, 0.08);
}

.task-column-head h3,
.task-column-head p,
.task-card h3,
.task-card p {
  margin: 0;
}

.task-column-head h3 {
  font-size: 16px;
  font-weight: 700;
}

.task-column-head p {
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.5;
}

.task-card-list {
  display: grid;
  gap: 12px;
}

.task-card,
.task-empty {
border-radius: 18px;
  background: var(--layer-3);
}

.task-card {
  display: grid;
  gap: 12px;
  padding: 18px;
  cursor: pointer;
  transition: border-color 200ms ease, box-shadow 200ms ease, background 150ms ease;
}

.task-card:hover {
  background: #2a2a28;
}

.task-card.card-overdue {
  background: rgba(220, 80, 60, 0.05);
}

.task-card.card-expanded {
box-shadow: 0 0 0 1px rgba(204, 125, 94, 0.1);
}

.task-empty {
  padding: 18px;
  color: var(--text-soft);
  text-align: center;
}

.task-card-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}

.task-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.task-card-menu {
  flex-shrink: 0;
}

.task-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 8px;
}

.task-actions .ghost-button {
  font-size: 11px;
  padding: 0 10px;
  height: 28px;
}

.task-done-btn {
  font-size: 11px !important;
  padding: 0 12px !important;
  height: 28px !important;
}

.task-delete-trigger {
  margin-left: auto;
  color: var(--text-faint) !important;
  opacity: 0.6;
}
.task-delete-trigger:hover {
  color: #dc503c !important;
  opacity: 1;
}

.task-card h3 {
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
}

.task-card p {
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.55;
}

.task-card-info {
  display: flex;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  font-size: 12px;
  color: var(--text-soft);
}

.task-card-info-item {
  display: flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.task-card-info-item strong {
  font-weight: 500;
  color: var(--text);
}

/* Due date badges */
.task-due-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.task-due-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 500;
  padding: 3px 8px;
  border-radius: 6px;
  white-space: nowrap;
}

.task-due-badge.muted { color: var(--text-faint); background: rgba(249, 249, 247, 0.04); }
.task-due-badge.overdue { color: #dc503c; background: rgba(220, 80, 60, 0.12); }
.task-due-badge.due-today { color: #e8a840; background: rgba(232, 168, 64, 0.12); }
.task-due-badge.due-soon { color: #e8a840; background: rgba(232, 168, 64, 0.08); }
.task-due-badge.due-week { color: var(--primary); background: rgba(204, 125, 94, 0.1); }

.task-company-badge {
  font-size: 11px;
  color: var(--text-soft);
  padding: 2px 8px;
  border-radius: 6px;
  background: rgba(249, 249, 247, 0.04);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 160px;
}

/* Expanded card details */
.task-expanded-detail {
  display: grid;
  gap: 12px;
  padding-top: 8px;
}

.task-expanded-desc {
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-wrap;
}

.task-meta-grid {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 7px 10px;
  padding-top: 10px;
font-size: 12px;
}

.task-meta-grid span {
  color: var(--text-faint);
}

.task-meta-grid strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Edit form */
.task-edit-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding-top: 10px;
}

.task-edit-form label {
  display: grid;
  gap: 5px;
  color: var(--text-soft);
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.task-edit-form label:first-child,
.task-edit-form label:nth-child(2) {
  grid-column: span 2;
}

.task-edit-form input,
.task-edit-form select,
.task-edit-form textarea {
  width: 100%;
border-radius: 10px;
  background: #1e1e1c;
  color: var(--text);
  padding: 9px 11px;
  font: inherit;
  font-size: 13px;
}

.task-edit-form input:focus,
.task-edit-form select:focus,
.task-edit-form textarea:focus {
  outline: none;
}

.task-edit-actions {
  grid-column: span 2;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding-top: 4px;
}

.task-edit-actions .primary-button,
.task-edit-actions .ghost-button {
  font-size: 12px;
  height: 32px;
  padding: 0 16px;
}

/* Icon buttons */
.task-icon-btn {
  width: 28px;
  height: 28px;
border-radius: 8px;
  background: transparent;
  color: var(--text-soft);
  font-size: 14px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 150ms ease;
}

.task-icon-btn:hover {
  background: rgba(249, 249, 247, 0.08);
  color: var(--text);
}

.task-icon-delete:hover {
  background: rgba(220, 80, 60, 0.12);
  color: #dc503c;
}

/* Delete modal */
.task-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn 150ms ease;
}

.task-modal {
  background: var(--layer-1);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 28px;
  max-width: 420px;
  width: 90%;
  display: grid;
  gap: 14px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
}

.task-modal h3 {
  font-size: 18px;
  font-weight: 700;
  margin: 0;
}

/* Подтверждение отправки не должно занимать весь экран. */
.outreach-manual-send-modal {
  max-width: 760px;
  max-height: 80vh;
  min-width: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.outreach-manual-send-modal > * {
  min-width: 0;
}

.outreach-manual-send-sequence {
  margin: 0;
  padding-left: 20px;
  overflow-wrap: anywhere;
  display: grid;
  gap: 10px;
}

.outreach-manual-send-recipient summary {
  cursor: pointer;
  overflow-wrap: anywhere;
}

.outreach-manual-send-recipient[open] summary {
  margin-bottom: 10px;
}

.outreach-manual-send-sequence li strong {
  display: block;
  font-size: 14px;
}

.outreach-manual-send-sequence li p {
  margin: 4px 0 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
}

.outreach-manual-send-modal .task-modal-actions {
  flex-wrap: wrap;
}

.task-modal p {
  color: var(--text-soft);
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

.task-modal-actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  padding-top: 4px;
}

.task-delete-btn {
  background: #dc503c !important;
}

.task-delete-btn:hover {
  background: #c44030 !important;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ── Task Detail Drawer ────────────────────────────── */

.task-detail-backdrop {
  position: fixed;
  inset: 0;
  z-index: 900;
  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  animation: fadeIn 150ms ease;
}

.task-detail-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 901;
  width: 560px;
  max-width: 92vw;
  background: #1c1c1a;
display: flex;
  flex-direction: column;
  animation: slideIn 200ms ease;
  overflow: hidden;
}

@keyframes slideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

.task-detail-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 24px 28px 0;
}

.task-detail-header-badges {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.task-detail-close {
  width: 36px;
  height: 36px;
border-radius: 10px;
  background: transparent;
  color: var(--text-soft);
  font-size: 18px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 150ms ease;
}

.task-detail-close:hover {
  background: rgba(249, 249, 247, 0.06);
  color: var(--text);
}

.task-detail-body {
  flex: 1;
  overflow-y: auto;
  padding: 20px 28px 28px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.task-detail-title {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
  letter-spacing: 0;
}

.task-detail-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.task-detail-section-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-faint);
}

.task-detail-description {
  font-size: 14px;
  line-height: 1.65;
  color: var(--text-soft);
  white-space: pre-wrap;
  margin: 0;
  padding: 14px 16px;
  background: rgba(249, 249, 247, 0.03);
  border-radius: 12px;
}

.task-detail-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.task-detail-meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  background: rgba(249, 249, 247, 0.03);
  border-radius: 12px;
}

.task-detail-meta-label {
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-faint);
}

.task-detail-meta-value {
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
}

.task-detail-status-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.task-detail-status-btn {
  padding: 8px 16px;
border-radius: 10px;
  background: transparent;
  color: var(--text-soft);
  font: inherit;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: all 150ms ease;
}

.task-detail-status-btn:hover {
  background: rgba(249, 249, 247, 0.06);
  color: var(--text);
}

.task-detail-status-btn.active {
  background: rgba(204, 125, 94, 0.15);
color: var(--primary);
  font-weight: 600;
}

.task-detail-footer {
  padding: 16px 28px;
display: flex;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
}

.task-detail-footer-left {
  display: flex;
  gap: 8px;
}

.task-detail-footer-right {
  display: flex;
  gap: 8px;
}

/* Detail edit mode */
.task-detail-edit-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.task-detail-edit-grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-faint);
}

.task-detail-edit-full {
  grid-column: span 2;
}

.task-detail-edit-grid input,
.task-detail-edit-grid select,
.task-detail-edit-grid textarea {
  width: 100%;
border-radius: 10px;
  background: #1e1e1c;
  color: var(--text);
  padding: 10px 13px;
  font: inherit;
  font-size: 14px;
}

.task-detail-edit-grid input:focus,
.task-detail-edit-grid select:focus,
.task-detail-edit-grid textarea:focus {
  outline: none;
}

/* ── List view ─────────────────────────────────────── */

.task-list-view {
  overflow-x: auto;
  padding: 0 !important;
}

.task-list-table {
  width: 100%;
  border-collapse: collapse;
}

.task-list-table thead th {
  padding: 12px 14px;
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-soft);
white-space: nowrap;
}

.task-list-table tbody td {
  padding: 12px 14px;
  font-size: 13px;
vertical-align: middle;
}

.task-list-row {
  transition: background 150ms ease;
  cursor: pointer;
}

.task-list-row:hover {
  background: rgba(249, 249, 247, 0.04);
}

.task-list-row.row-overdue {
  background: rgba(220, 80, 60, 0.04);
}

.task-list-row.row-overdue:hover {
  background: rgba(220, 80, 60, 0.07);
}

.task-priority-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.task-priority-dot.priority-high { background: #dc503c; }
.task-priority-dot.priority-medium { background: var(--primary); }
.task-priority-dot.priority-low { background: rgba(249, 249, 247, 0.2); }

.task-list-priority-cell {
  width: 24px;
  text-align: center;
}

.task-list-title {
  font-weight: 600;
  color: var(--text);
  margin-bottom: 2px;
}

.task-list-desc {
  font-size: 12px;
  color: var(--text-faint);
  line-height: 1.4;
}

.task-status-select {
border-radius: 8px;
  background: var(--layer-3);
  color: var(--text);
  padding: 5px 8px;
  font: inherit;
  font-size: 12px;
}

.task-list-actions-cell {
  white-space: nowrap;
}

.task-expanded-row td {
  padding: 0 14px 14px;
  background: rgba(249, 249, 247, 0.02);
}

.task-expanded-inline {
  padding: 14px 0;
}

.task-expanded-actions {
  display: flex;
  gap: 8px;
  padding-top: 8px;
}

.task-edit-inline {
  grid-template-columns: repeat(3, 1fr);
}

.task-edit-inline label:first-child {
  grid-column: span 3;
}

.task-edit-inline label:nth-child(2) {
  grid-column: span 3;
}

.task-edit-inline .task-edit-actions {
  grid-column: span 3;
}

/* ── ABM Company Drawer ───────────────────────────── */

.abm-row-clickable {
  cursor: pointer;
  transition: background 150ms ease;
}

.abm-row-clickable:hover {
  background: rgba(249, 249, 247, 0.03);
}

.abm-drawer-link {
  color: var(--primary);
  font-size: 13px;
  text-decoration: none;
  word-break: break-all;
}

.abm-drawer-link:hover {
  text-decoration: underline;
}

/* Карточка компании ABM — центральная модалка (а не выезжающая справа панель).
   Скоупим под .abm-drawer, чтобы карточка задач (.task-detail-drawer) осталась
   правым drawer'ом. */
.task-detail-drawer.abm-drawer {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translate(-50%, -50%);
  width: 820px;
  max-width: 94vw;
  height: auto;
  max-height: 90vh;
  border-radius: 16px;
  border: 1px solid rgba(249, 249, 247, 0.08);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55);
  animation: abmModalIn 200ms ease;
}

@keyframes abmModalIn {
  from { opacity: 0; transform: translate(-50%, -50%) scale(0.96); }
  to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

/* Никакой горизонтальной прокрутки: тело скроллится только вертикально. */
.abm-drawer .task-detail-body {
  overflow-x: hidden;
}

/* Длинные значения (URL, описания) переносятся, а не растягивают модалку. */
.abm-drawer .task-detail-description {
  overflow-wrap: anywhere;
}

.abm-fields-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* Внутри модалки колонки сами схлопываются в одну на узкой ширине —
   так длинные email/адреса не вызывают горизонтальный скролл. */
.abm-drawer .abm-fields-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.abm-field-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  background: rgba(249, 249, 247, 0.03);
  border-radius: 12px;
  min-width: 0;
}

.abm-field-label {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-faint);
}

.abm-field-value {
  font-size: 14px;
  font-weight: 500;
  color: var(--text);
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.abm-field-value.empty {
  color: var(--text-faint);
  font-style: italic;
}

.abm-contact-chips {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.abm-contact-chip {
  display: grid;
  gap: 1px;
  max-width: 100%;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--layer-2);
  font-size: 12px;
  line-height: 1.2;
  min-width: 0;
}

.abm-contact-chip strong {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-muted, var(--text-faint));
}

.abm-contact-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.abm-contact-more,
.contact-empty {
  color: var(--text-muted, var(--text-faint));
  font-size: 12px;
}

.abm-contacts-section {
  display: grid;
  gap: 14px;
}

.abm-contact-group {
  display: grid;
  gap: 8px;
}

.abm-contact-group h4 {
  margin: 0;
  font-size: 13px;
  line-height: 1.3;
}

.abm-contact-list {
  display: grid;
  gap: 8px;
}

.abm-contact-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--layer-2);
  min-width: 0;
}

.abm-contact-row div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.abm-contact-row span {
  overflow-wrap: anywhere;
}

.abm-contact-row small,
.abm-contact-row p {
  margin: 0;
  color: var(--text-muted, var(--text-faint));
  font-size: 12px;
}

.abm-contact-row a {
  white-space: nowrap;
  color: var(--primary);
  text-decoration: none;
  font-size: 13px;
}

.abm-contact-row a:hover {
  text-decoration: underline;
}

/* Бейдж «не проверено» на Dadata-показателях (size/revenue без данных в ЕГРЮЛ) */
.dadata-unverified-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  color: #b8862b;
  background: rgba(214, 158, 46, 0.16);
  border: 1px solid rgba(214, 158, 46, 0.35);
  vertical-align: middle;
}

.finance-negative {
  color: #d96a6a;
}

/* --- .docx-шаблоны под ICP --- */
.icp-tpl-list { display: flex; flex-direction: column; gap: 10px; }
.icp-tpl-row {
  padding: 12px 14px;
  border-radius: 12px;
  background: #1c1c1a;
  border: 1px solid rgba(255,255,255,0.06);
}
.icp-tpl-row.has-tpl { border-color: rgba(120,200,150,0.28); }
.icp-tpl-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.icp-tpl-title { font-weight: 600; }
.icp-tpl-id { font-size: 11px; opacity: 0.55; }
.icp-tpl-status { margin-top: 4px; font-size: 12.5px; }
.icp-tpl-ok { color: #7fc8a0; font-weight: 600; }
.icp-tpl-date { opacity: 0.6; }
.icp-tpl-none { opacity: 0.6; }
.icp-tpl-none strong { color: var(--text); font-weight: 650; }
.icp-tpl-chips { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 5px; }
.icp-tpl-chip {
  font-size: 11px; padding: 2px 7px; border-radius: 6px;
  background: rgba(120,160,220,0.10); border: 1px solid rgba(120,160,220,0.22);
  font-family: ui-monospace, monospace;
}
.icp-tpl-validation {
  width: fit-content;
  max-width: 100%;
  margin-top: 2px;
  padding: 6px 9px;
  border-radius: 6px;
  font-size: 12.5px;
  line-height: 1.45;
}
.icp-tpl-validation.ok {
  color: #7fc8a0;
  background: rgba(120,200,150,0.09);
  border: 1px solid rgba(120,200,150,0.2);
}
.icp-tpl-validation.warn {
  color: #f1d4c7;
  background: rgba(204,125,94,0.09);
  border: 1px solid rgba(204,125,94,0.24);
}
.icp-tpl-validation code {
  font-size: 12px;
  background: rgba(255,255,255,0.07);
  padding: 1px 5px;
  border-radius: 5px;
}
.icp-tpl-actions { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.icp-tpl-upload-btn { cursor: pointer; position: relative; }
.icp-tpl-err { color: #d96a6a; font-size: 12.5px; }
.icp-tpl-empty { opacity: 0.6; }
.icp-tpl-ref { margin-top: 14px; font-size: 13px; }
.icp-tpl-ref summary { cursor: pointer; opacity: 0.8; }
.icp-tpl-ref-list { margin: 8px 0 0; padding-left: 18px; line-height: 1.7; }
.icp-tpl-ref-list li { margin-bottom: 10px; }
.icp-tpl-ref-list p {
  margin: 3px 0 0;
  color: var(--text-muted);
  line-height: 1.45;
}
.icp-tpl-ref-list small {
  display: block;
  margin-top: 2px;
  color: var(--text-faint);
}
.icp-tpl-ref-list code { font-size: 12px; background: rgba(255,255,255,0.06); padding: 1px 5px; border-radius: 5px; }
.icp-tpl-kind {
  display: inline-flex;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,0.07);
  color: var(--text-muted);
  font-size: 11px;
  white-space: nowrap;
}
.icp-tpl-required {
  display: inline-flex;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(204, 125, 94, 0.12);
  color: var(--primary);
  font-size: 11px;
  white-space: nowrap;
}
.icp-tpl-ref-note { opacity: 0.6; font-size: 12px; margin-top: 8px; }
.icp-docx-section .block-header code {
  font-size: 12px; background: rgba(255,255,255,0.06); padding: 1px 5px; border-radius: 5px;
}

.icp-default-template {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 16px;
  background: rgba(204,125,94,0.08);
  border: 1px solid rgba(204,125,94,0.28);
}

.icp-default-template h3 {
  margin: 2px 0 6px;
  font-size: 17px;
  line-height: 1.25;
}

.icp-default-template p {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.5;
}

.icp-default-template-details {
  display: grid;
  gap: 12px;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.12);
}

.icp-default-template-details summary {
  cursor: pointer;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 650;
}

.icp-default-template-details[open] summary {
  margin-bottom: 12px;
}

.icp-default-template-body {
  display: grid;
  gap: 8px;
}

.icp-default-template-row {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(0,0,0,0.14);
  border: 1px solid rgba(255,255,255,0.06);
}

.icp-default-template-row span {
  color: var(--text-faint);
  font-size: 11px;
  text-transform: uppercase;
}

.icp-default-template-row p,
.icp-default-template-row ul {
  margin: 0;
  color: var(--text-muted);
  line-height: 1.45;
}

.icp-default-template-row ul {
  padding-left: 18px;
}

@media (max-width: 900px) {
  .icp-default-template-row {
    grid-template-columns: 1fr;
  }
}

/* --- список шаблонов по ICP: вертикальный, строки-аккордеоны --- */
/* Список крупных карточек по ICP — в стиле .cron-card (раздел «Автоматизации») */
.icp-tpl-list { display: flex; flex-direction: column; gap: 16px; }

.icp-tpl-card { transition: border-color 160ms ease; }
.icp-tpl-card.has-tpl { border-color: rgba(120,200,150,0.28); }

.icp-default-template-markdown {
  margin-top: 12px;
}

.icp-default-template-markdown summary {
  cursor: pointer;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 650;
}

.icp-default-template-markdown[open] summary {
  margin-bottom: 10px;
}

.icp-default-template-markdown pre {
  max-height: 420px;
  overflow: auto;
  margin: 0;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.22);
  color: var(--text);
  padding: 12px;
  white-space: pre-wrap;
  word-break: break-word;
}

.icp-default-template-markdown code {
  font: 12.5px/1.55 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

/* Кнопка «Открыть» / «Свернуть» — приглушённая, как «Запустить» в автоматизациях */
.icp-tpl-card .cron-actions-row .primary-button { background: rgba(204,125,94,0.1); box-shadow: none; }
.icp-tpl-card .cron-actions-row .primary-button:hover { background: rgba(204,125,94,0.16); transform: none; }

.icp-tpl-foot-note { font-size: 12px; color: var(--text-soft); line-height: 1.45; }

/* Тело карточки (раскрытое): блоки шаблона и персонализации */
.icp-tpl-rowbody {
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.08);
  display: flex; flex-direction: column; gap: 16px;
  animation: fadeIn 150ms ease;
}
.icp-tpl-rowbody .icp-card-block:first-child { border-top: none; padding-top: 0; }

/* --- (устар.) карточки-плитки по ICP — оставлены для обратной совместимости --- */
.icp-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; }
.icp-card {
  display: flex; flex-direction: column; gap: 12px;
  padding: 16px;
  border-radius: 14px;
  background: #1c1c1a;
  border: 1px solid rgba(255,255,255,0.07);
}
.icp-card.has-tpl { border-color: rgba(120,200,150,0.26); }
.icp-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.icp-card-title-wrap { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.icp-card-title { margin: 0; font-size: 15px; font-weight: 650; }
.icp-card-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.icp-card-desc { margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--text-muted, #9aa4b2); }
.icp-card-block {
  display: flex; flex-direction: column; gap: 8px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.icp-card-block-label { font-size: 12px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.icp-card-tpl-status { font-size: 12.5px; }
/* Статус слева + кнопки справа — вертикально по центру */
.icp-tpl-rowline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  flex-wrap: wrap;
}
.icp-tpl-rowline .icp-tpl-actions { margin: 0; }
.icp-tpl-rowline .icp-card-tpl-status { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; }
.icp-tpl-type-badge {
  font-size: 10.5px; font-weight: 700; padding: 1px 7px; border-radius: 6px;
  background: rgba(204,125,94,0.16); color: #f1d4c7; margin-left: 4px;
}
.icp-autotag-details {
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
  background: rgba(255,255,255,0.025);
  padding: 10px 12px;
}
.icp-autotag-details summary {
  cursor: pointer;
  color: var(--text-muted);
  font-size: 12.5px;
  font-weight: 650;
}
.icp-autotag-details[open] summary { margin-bottom: 8px; }
.icp-autotag-details p {
  margin: 0 0 10px;
  color: var(--text-muted);
  font-size: 12.5px;
  line-height: 1.45;
}
.icp-autotag-btn { border-color: rgba(204,125,94,0.45) !important; color: #f1d4c7 !important; }
.icp-autotag-panel {
  margin-top: 10px;
  padding: 12px;
  border-radius: 10px;
  border: 1px solid rgba(204,125,94,0.3);
  background: rgba(204,125,94,0.07);
  display: flex; flex-direction: column; gap: 8px;
}
.icp-autotag-panel.icp-autotag-fail { border-color: rgba(217,106,106,0.4); background: rgba(217,106,106,0.06); }
.icp-autotag-title { font-size: 12.5px; font-weight: 600; color: var(--text); }
.icp-autotag-spin { font-size: 13px; color: #f1d4c7; }
.icp-autotag-item { display: flex; align-items: center; gap: 8px; font-size: 12.5px; flex-wrap: wrap; cursor: pointer; }
.icp-autotag-ph { font-family: ui-monospace, monospace; font-size: 12px; color: #f1d4c7; }
.icp-autotag-find { color: var(--text-muted, #9aa4b2); font-size: 12px; }
.icp-autotag-err { font-size: 12px; color: #d96a6a; }
.icp-autotag-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
@media (max-width: 560px) { .icp-card-grid { grid-template-columns: 1fr; } }

/* --- селектор ICP в карточке компании --- */
.abm-seg-select {
  width: 100%; padding: 9px 11px; border-radius: 9px;
  background: #1e1e1c; color: var(--text);
  border: 1px solid rgba(255,255,255,0.10); font-size: 13.5px;
}
.abm-seg-hint { display: block; margin-top: 6px; font-size: 12px; opacity: 0.6; }
.abm-seg-hint.ok { color: #7fc8a0; opacity: 0.9; }
.proposal-docx-button { border-color: rgba(120,200,150,0.35); }
.proposal-template-button { text-decoration: none; }
.abm-proposal-card-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.abm-proposal-tpl { display: inline-block; margin-top: 3px; font-size: 11px; color: #7fc8a0; }
.proposal-template-banner {
  margin: 0 0 12px;
  padding: 9px 13px;
  border-radius: 9px;
  font-size: 12.5px;
  color: #7fc8a0;
  background: rgba(120,200,150,0.10);
  border: 1px solid rgba(120,200,150,0.28);
}

.finance-history {
  margin-top: 10px;
}

.finance-history-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted, #8a8a82);
  margin-bottom: 6px;
}

.finance-history-bars {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.finance-history-year {
  padding: 3px 8px;
  border-radius: 7px;
  font-size: 12px;
  background: rgba(120, 160, 220, 0.10);
  border: 1px solid rgba(120, 160, 220, 0.22);
  color: var(--text);
  white-space: nowrap;
}

.finance-history-year b {
  font-weight: 600;
  opacity: 0.7;
  margin-right: 3px;
}

.abm-field-input {
  width: 100%;
border-radius: 8px;
  background: #1e1e1c;
  color: var(--text);
  padding: 8px 10px;
  font: inherit;
  font-size: 14px;
}

.abm-field-input:focus {
  outline: none;
}

.abm-proposals-list {
  display: grid;
  gap: 10px;
}

.abm-proposal-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: rgba(249, 249, 247, 0.03);
  border-radius: 12px;
}

.abm-proposal-card div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.abm-proposal-card strong {
  font-size: 14px;
  font-weight: 600;
  color: var(--text);
}

.abm-proposal-card span {
  font-size: 12px;
  color: var(--text-soft);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── Outreach v2 ── */
.outreach-layout-v2 {
  display: grid;
  grid-template-columns: 340px 1fr;
  grid-template-rows: auto 1fr;
  gap: 16px;
  min-height: calc(100vh - 44px);
}
.outreach-layout-v2 > * { min-width: 0; }
.outreach-summary-bar {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 14px 18px;
  border-radius: 16px;
  background: var(--layer-1);
}
.outreach-summary-item {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.outreach-summary-num {
  font-size: 22px;
  font-weight: 700;
  color: var(--text);
}
.outreach-summary-label {
  font-size: 12px;
  color: var(--text-faint);
}
.outreach-sum-sent .outreach-summary-num { color: var(--success); }
.outreach-sum-review .outreach-summary-num { color: var(--warn); }

.outreach-recipient-auth-modal {
  max-width: 520px;
}
.outreach-recipient-auth-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 14px 0 18px;
}
.outreach-recipient-auth-option {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  background: var(--layer-2);
}
.outreach-recipient-auth-option.is-selected {
  border-color: var(--primary);
  background: rgba(204, 125, 94, 0.12);
}
.outreach-recipient-auth-option span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}
.outreach-recipient-auth-option strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.outreach-recipient-auth-option small {
  color: var(--text-faint);
}

.outreach-panel-left {
  background: var(--layer-1);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 140px);
  overflow-y: auto;
}
.outreach-panel-left, .outreach-panel-right { overflow-x: hidden; }
.outreach-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 18px 12px;
}
.outreach-panel-head h3 {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}
.outreach-panel-count {
  font-size: 11px;
  color: var(--text-faint);
  background: rgba(255,255,255,0.06);
  padding: 3px 9px;
  border-radius: 99px;
}
.outreach-assignment-issues { display: block; padding: 10px 14px 12px; border-top: 1px solid var(--line-soft); }
.outreach-assignment-issues summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer; font-size: 12px; color: var(--warn); list-style: none; }
.outreach-assignment-issues summary::-webkit-details-marker { display: none; }
.outreach-assignment-issues summary::after { content: "▾"; color: var(--text-faint); transition: transform 150ms; }
.outreach-assignment-issues[open] summary::after { transform: rotate(180deg); }
.outreach-assignment-issues summary strong { color: var(--text); background: rgba(255,255,255,0.06); border-radius: 99px; padding: 2px 8px; margin-left: auto; }
.outreach-assignment-list { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; }
.outreach-assignment-group { padding: 10px; border-radius: 10px; background: var(--layer-3); }
.outreach-assignment-group-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; color: var(--text); }
.outreach-assignment-group-head > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.outreach-assignment-group-head > strong:last-child { flex: 0 0 auto; margin-left: 0; }
.outreach-assignment-group > select { min-width: 0; width: 100%; margin-top: 8px; }
.outreach-assignment-group > .outreach-assignment-actions { margin-top: 8px; }
.outreach-assignment-group strong, .outreach-assignment-group span, .outreach-assignment-group small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.outreach-assignment-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.email-assignment-details-modal { max-width: 720px; max-height: 80vh; overflow: hidden; }
.email-assignment-details-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.email-assignment-details-head p { margin-top: 4px; }
.email-assignment-details-list { display: grid; gap: 10px; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.email-assignment-details-message { display: grid; gap: 6px; padding: 12px; border-radius: 10px; background: var(--layer-2); }
.email-assignment-details-message h4 { margin: 0; overflow-wrap: anywhere; }
.email-assignment-details-message p { white-space: pre-wrap; overflow-wrap: anywhere; }
.email-assignment-details-message small, .email-assignment-details-message span { color: var(--text-faint); }
.outreach-lead-list {
  padding: 8px 8px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.outreach-lead-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 11px 14px;
border-radius: 12px;
  background: var(--layer-2);
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: background 150ms;
}
.outreach-lead-row:hover {
  background: rgba(204, 125, 94, 0.12);
}
.outreach-lead-row.active {
  background: rgba(204, 125, 94, 0.2);
}
.outreach-lead-row-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.outreach-lead-row-main strong {
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.outreach-lead-contact {
  font-size: 11px;
  color: var(--text-faint);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.outreach-lead-row-right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.outreach-touch-badge {
  font-size: 10px;
  color: var(--text-faint);
  background: rgba(255,255,255,0.06);
  padding: 2px 7px;
  border-radius: 99px;
  white-space: nowrap;
}

.outreach-panel-right {
  background: var(--layer-1);
  border-radius: 16px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-height: calc(100vh - 140px);
  overflow-y: auto;
}

.outreach-company-header {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.outreach-company-lifecycle-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

.outreach-proposal-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-bottom: 1px solid var(--border-color, rgba(255,255,255,.08));
  background: rgba(255,255,255,.025);
}
.outreach-proposal-card-main,
.outreach-proposal-card-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.outreach-proposal-card-main { min-width: 0; }
.outreach-proposal-card-main .cron-error { margin: 0; }
.outreach-company-title {
  display: flex;
  align-items: center;
  gap: 12px;
}
.outreach-company-title h2 {
  margin: 0;
  font-size: 18px;
}
.outreach-company-summary {
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.6;
  margin: 0;
}
.outreach-company-link {
  appearance: none;
  background: none;
  border: 0;
  padding: 0;
  font-size: 12px;
  color: var(--primary);
  cursor: pointer;
  font: inherit;
  text-decoration: none;
}
.outreach-company-link:hover { text-decoration: underline; }

/* Таб-бар карточки компании Outreach (как в карточке сделки CRM) */
.outreach-card-tab-bar {
  display: flex;
  gap: 4px;
  background: var(--layer-3);
  padding: 6px;
  border-radius: 12px;
}
.outreach-card-tab {
  flex: 1;
  background: transparent;
  border: 0;
  color: var(--text-faint);
  font-family: inherit;
  padding: 9px 14px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  transition: background 150ms, color 150ms;
}
.outreach-card-tab:hover { color: var(--text); }
.outreach-card-tab.active { background: var(--primary); color: #fff; }

.outreach-comm-tab {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.outreach-contact-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.outreach-contact-item {
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,0.025);
display: flex;
  flex-direction: column;
  gap: 5px;
}
.outreach-contact-label {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--text-faint);
}
.outreach-contact-value {
  font-size: 13px;
  color: var(--text);
  word-break: break-all;
}
.outreach-no-data {
  color: var(--text-faint) !important;
  font-style: italic;
}

.outreach-actions-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.outreach-actions-row button[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}
.outreach-attachment-format {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 3px 10px;
  border: 1px solid var(--border, rgba(255,255,255,0.14));
  border-radius: 8px;
  background: var(--surface-2, rgba(255,255,255,0.04));
  color: var(--text-muted, #9aa4b2);
  font-size: 13px;
  white-space: nowrap;
}
.outreach-attachment-format-label {
  color: var(--text, #e5e7eb);
  font-weight: 600;
}
.outreach-attachment-format label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
}
/* Сегмент-контрол выбора канала цепочки: ЛИБО Email, ЛИБО Telegram */
.outreach-chain-switch {
  display: inline-flex;
  padding: 3px;
  gap: 3px;
  border-radius: 10px;
  border: 1px solid var(--border, rgba(255,255,255,0.14));
  background: var(--surface-2, rgba(255,255,255,0.04));
}
.outreach-chain-chip {
  padding: 7px 16px;
  border-radius: 7px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--text-muted, #9aa4b2);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
.outreach-chain-chip:hover { color: var(--text); }
.outreach-chain-chip.active {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,0.18);
}

/* Редактор контактов + подтверждение каналов рассылки (вкладка «Контакты») */
.outreach-contacts-editor { display: flex; flex-direction: column; gap: 12px; }
.outreach-contact-edit-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  background: var(--surface-2, rgba(255,255,255,0.03));
}
.outreach-contact-edit-main { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.outreach-contact-edit-main .outreach-contact-label { font-size: 13px; font-weight: 600; color: var(--text-muted, #9aa4b2); }
.ocf-fields { display: flex; flex-direction: column; gap: 6px; }
.ocf-field { display: flex; align-items: center; gap: 6px; }
.ocf-field .outreach-contact-edit-input { min-width: 0; }
.ocf-btn {
  width: 34px; height: 34px; flex-shrink: 0;
  border-radius: 9px; border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04); color: var(--text-soft);
  font-size: 18px; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background 150ms ease, color 150ms ease, border-color 150ms ease;
}
.ocf-remove:hover { background: rgba(220,80,60,0.14); color: #ff9b85; border-color: rgba(220,80,60,0.3); }
.ocf-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.ocf-add { color: var(--primary-strong, #df9577); }
.outreach-contact-edit-input {
  flex: 1;
  min-width: 180px;
  padding: 8px 11px;
  border-radius: 8px;
  border: 1px solid var(--border, rgba(255,255,255,0.14));
  background: var(--layer-3);
  color: var(--text);
  font-size: 14px;
}
.outreach-contact-edit-input.is-empty { border-color: rgba(255,176,32,0.4); }
.outreach-approve-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}
.outreach-approve-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.outreach-approve-track {
  position: relative;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: rgba(255,255,255,0.16);
  transition: background 0.18s;
  flex: none;
}
.outreach-approve-thumb {
  position: absolute;
  top: 2px; left: 2px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.18s;
}
.outreach-approve-toggle.is-on .outreach-approve-track { background: var(--success, #2ec28b); }
.outreach-approve-toggle.is-on .outreach-approve-thumb { transform: translateX(16px); }
.outreach-approve-copy { font-size: 12px; color: var(--text-muted, #9aa4b2); }
.outreach-approve-toggle.is-on .outreach-approve-copy { color: var(--text); }
.outreach-approve-toggle input:disabled + .outreach-approve-track { opacity: 0.4; }
.outreach-contacts-hint { font-size: 12px; color: var(--text-muted, #9aa4b2); margin: 2px 0 0; }
.outreach-contact-kp { font-size: 13px; color: var(--text-muted, #9aa4b2); }

.outreach-recipient-manager {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  border-radius: 12px;
  background: var(--surface-2, rgba(255,255,255,0.03));
}
.outreach-recipient-manager-head,
.outreach-recipient-row-head,
.outreach-recipient-draft-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.outreach-recipient-manager-head h3 { margin: 0; font-size: 14px; }
.outreach-recipient-manager-head p { margin: 4px 0 0; color: var(--text-faint); font-size: 12px; }
.outreach-recipient-list {
  display: grid;
  gap: 10px;
  overflow-y: visible;
}
.outreach-recipient-row {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  border-radius: 10px;
  background: var(--layer-2);
}
.outreach-recipient-row.is-selected { border-color: rgba(223,149,119,0.35); }
.outreach-recipient-choice { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.outreach-recipient-choice > span { display: grid; gap: 2px; min-width: 0; }
.outreach-recipient-choice small { color: var(--text-faint); }
.outreach-recipient-choice code { color: var(--text-soft); overflow-wrap: anywhere; }
.outreach-recipient-meta { display: grid; justify-items: end; gap: 5px; color: var(--text-faint); font-size: 11px; text-align: right; }
.outreach-recipient-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.outreach-recipient-chain-toggle { margin-left: auto; }
.outreach-recipient-progress { color: var(--text-soft); font-size: 12px; }
.outreach-recipient-drafts {
  display: grid;
  gap: 8px;
  overflow-y: visible;
}
.outreach-recipient-draft {
  display: grid;
  gap: 6px;
  padding: 10px;
  border-radius: 9px;
  background: rgba(255,255,255,0.03);
}
.outreach-recipient-draft-head { color: var(--text-faint); font-size: 11px; }
.outreach-recipient-draft-head strong { color: var(--text-soft); }
.outreach-recipient-draft .outreach-touch-edit-btn { width: auto; height: 30px; padding: 0 9px; font-size: 11px; }
.outreach-recipient-draft .outreach-touch-edit-form input,
.outreach-recipient-draft .outreach-touch-edit-form textarea {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(255,255,255,0.05);
  color: var(--text);
  padding: 8px 10px;
  font: inherit;
  resize: vertical;
}
@media (max-width: 760px) {
  .outreach-recipient-manager-head,
  .outreach-recipient-row-head { align-items: stretch; flex-direction: column; }
  .outreach-recipient-meta { justify-items: start; text-align: left; }
}

.outreach-timeline-section {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-top: 14px;
}
.outreach-template-details {
  border-top: 1px solid var(--line-soft);
  padding-top: 14px;
}
.outreach-template-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text);
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  list-style: none;
}
.outreach-template-summary::-webkit-details-marker { display: none; }
.outreach-template-summary::after {
  content: "▾";
  color: var(--text-faint);
  transition: transform 150ms;
}
.outreach-template-details[open] > .outreach-template-summary::after { transform: rotate(180deg); }
.outreach-template-summary .outreach-panel-count { margin-left: auto; }
.outreach-template-summary:focus-visible {
  border-radius: 6px;
  outline: 2px solid var(--primary);
  outline-offset: 4px;
}
.outreach-timeline-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.outreach-timeline-head h3 {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}
.outreach-timeline-empty {
  color: var(--text-faint);
  font-size: 13px;
  padding: 18px;
  text-align: center;
border-radius: 12px;
}

.outreach-timeline {
  display: flex;
  flex-direction: column;
}
.outreach-touch {
  display: flex;
  gap: 14px;
}
.outreach-touch-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 20px;
  flex-shrink: 0;
  padding-top: 5px;
}
.outreach-touch-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.dot-sent { background: var(--success); }
.dot-error { background: var(--danger, #e74c3c); }
.dot-ready { background: var(--primary); }
.dot-draft { background: rgba(255,255,255,0.15); }
.outreach-touch-line {
  width: 2px;
  flex: 1;
  background: rgba(255,255,255,0.08);
  margin: 4px 0;
}

.outreach-touch-content {
  flex: 1;
  padding-bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.outreach-touch-top {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.outreach-touch-step {
  font-size: 11px;
  color: var(--text-faint);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.outreach-touch-subject {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
}
.outreach-touch-body {
  font-size: 12px;
  color: var(--text-soft);
  line-height: 1.65;
  margin: 0;
}
.outreach-touch-dates {
  display: flex;
  gap: 14px;
}
.outreach-touch-date {
  font-size: 11px;
  color: var(--text-faint);
}
.outreach-touch-attempts {
  display: grid;
  gap: 6px;
  margin-top: 2px;
}
.outreach-touch-attempt {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  font-size: 11px;
  color: var(--text-faint);
}
.outreach-touch-attempt-error {
  color: #f87171;
}
.attempt-sent {
  color: #4ade80;
}
.attempt-failed {
  color: #f87171;
}
.outreach-touch-sent .outreach-touch-content {
  opacity: 0.7;
}

/* Status pills */
.outreach-status-pill {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 10px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.status-pill-queued, .status-pill-draft { background: rgba(255,255,255,0.08); color: var(--text-faint); }
.status-pill-ready { background: rgba(59,130,246,0.15); color: #60a5fa; }
.status-pill-sent { background: rgba(34,197,94,0.15); color: #4ade80; }
.status-pill-error { background: rgba(239,68,68,0.15); color: #f87171; }
.status-pill-sending { background: rgba(14,165,233,0.15); color: #38bdf8; }
.status-pill-scheduled { background: rgba(234,179,8,0.15); color: #facc15; }

/* Touch edit button */
.outreach-touch-edit-btn {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--border);
  background: rgba(255,255,255,0.04);
  color: var(--text-soft);
  cursor: pointer;
  font-size: 17px;
  font-weight: 600;
  border-radius: 6px;
  margin-left: auto;
  line-height: 1;
  transition: color 150ms, border-color 150ms, background-color 150ms;
}
.outreach-touch-edit-btn:hover {
  color: var(--primary);
  border-color: var(--primary);
  background: rgba(66,153,225,0.12);
}

/* Touch edit form */
.outreach-touch-edit-form {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px;
  background: rgba(255,255,255,0.03);
  border-radius: 10px;
}
.outreach-touch-edit-form label { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.05em; }
.outreach-touch-edit-subject, .outreach-touch-edit-body {
  background: rgba(255,255,255,0.05);
border-radius: 8px;
  color: var(--text);
  padding: 8px 10px;
  font-size: 13px;
  font-family: inherit;
  resize: vertical;
}
.outreach-touch-edit-subject:focus, .outreach-touch-edit-body:focus { border-color: var(--primary); outline: none; }
.outreach-touch-edit-actions { display: flex; gap: 8px; margin-top: 4px; }
.outreach-email-editor {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.outreach-email-editor-toolbar {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--layer-2);
}
.outreach-email-editor-toolbar button,
.outreach-email-editor-file {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 4px 9px;
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--text-soft);
  background: var(--layer-1);
  font: inherit;
  font-size: 12px;
  cursor: pointer;
}
.outreach-email-editor-toolbar button:hover,
.outreach-email-editor-toolbar button.active,
.outreach-email-editor-file:hover { border-color: var(--primary); color: var(--text); }
.outreach-email-editor-file {
  text-transform: none !important;
  letter-spacing: normal !important;
}
.outreach-email-editor-file input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
}
.outreach-email-editor-width {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-left: auto;
  color: var(--text-faint);
  font-size: 11px;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.outreach-email-editor-width[hidden] { display: none; }
.outreach-email-editor-width input {
  width: 70px !important;
  min-width: 0 !important;
  min-height: 30px;
  padding: 4px 6px !important;
}
.outreach-email-editor-url-panel {
  display: flex;
  align-items: end;
  gap: 8px;
  flex-wrap: wrap;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--layer-2);
}
.outreach-email-editor-url-panel[hidden] { display: none; }
.outreach-email-editor-url-panel label {
  display: grid;
  gap: 4px;
  flex: 1 1 280px;
  color: var(--text-soft);
  font-size: 11px;
  text-transform: none;
  letter-spacing: normal;
}
.outreach-email-editor-url-panel input {
  width: 100%;
  min-height: 32px;
  padding: 5px 8px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--layer-1);
  color: var(--text);
  font: inherit;
}
.outreach-email-editor-url-panel small { flex-basis: 100%; color: var(--text-faint); }
.outreach-email-editor-url-panel button {
  min-height: 32px;
  padding: 5px 10px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--layer-1);
  color: var(--text-soft);
  cursor: pointer;
}
.outreach-email-editor-visual,
.outreach-email-editor-source {
  display: block;
  width: 100%;
  min-height: 176px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: #fff;
}
.outreach-email-editor-visual[hidden],
.outreach-email-editor-source[hidden] { display: none; }
.outreach-email-editor-source {
  padding: 10px;
  resize: vertical;
  color: #20252b;
  font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.outreach-email-editor-visual:focus,
.outreach-email-editor-source:focus { border-color: var(--primary); outline: none; }
.outreach-email-editor-hint { color: var(--text-faint); font-size: 11px; }
.outreach-email-preview {
  display: block;
  width: 100%;
  min-height: 120px;
  border: 0;
  border-radius: 8px;
  background: #fff;
}

/* Communication section */
.outreach-communication-section {
  padding: 16px 0;
}
.outreach-response-item {
  padding: 10px 12px;
  margin: 8px 0;
  background: rgba(34,197,94,0.06);
border-radius: 0 8px 8px 0;
}
.outreach-response-meta { font-size: 11px; color: var(--text-faint); margin-bottom: 4px; }
.outreach-response-text { font-size: 13px; line-height: 1.5; }
.outreach-no-response { font-size: 13px; color: var(--text-faint); padding: 8px 0; }
/* Telegram window */
.outreach-tg-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 200;
}
.outreach-tg-window {
  width: min(480px, 90vw);
  max-height: 80vh;
  background: var(--bg-card, #1c1c1c);
  border-radius: 16px;
display: flex;
  flex-direction: column;
  overflow: hidden;
}
.outreach-tg-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
}
.outreach-tg-header h3 { margin: 0; font-size: 15px; }
.outreach-tg-close-btn {
  background: none;
color: var(--text-faint);
  font-size: 22px;
  cursor: pointer;
  padding: 0 4px;
}
.outreach-tg-close-btn:hover { color: var(--text); }
.outreach-tg-body { padding: 16px 18px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
.outreach-tg-empty { font-size: 13px; color: var(--text-faint); text-align: center; padding: 30px 0; }
.outreach-tg-msg {
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,0.04);
}
.outreach-tg-sent { border-color: rgba(34,197,94,0.2); }
.outreach-tg-draft { opacity: 0.7; }
.outreach-tg-msg-top { font-size: 11px; color: var(--text-faint); margin-bottom: 6px; display: flex; align-items: center; gap: 8px; }
.outreach-tg-msg-text { font-size: 13px; line-height: 1.5; }
.outreach-tg-msg-date { font-size: 11px; color: var(--text-faint); margin-top: 6px; }
.outreach-tg-response {
  margin-top: 8px;
  padding: 8px 10px;
  background: rgba(34,197,94,0.06);
border-radius: 0 6px 6px 0;
  font-size: 12px;
}

.script-ranking-card,
.script-analytics-card,
.script-text-card {
  display: grid;
  gap: 14px;
}

.script-ranking-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.script-rank-card {
  display: grid;
  gap: 12px;
  padding: 16px;
border-radius: 18px;
  background: var(--layer-3);
  color: var(--text);
  text-align: left;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    background 180ms ease;
}

.script-rank-card:hover,
.script-rank-card.active {
  transform: translateY(-2px);
box-shadow: var(--shadow-soft);
  background: rgba(204, 125, 94, 0.06);
}

.script-rank-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.script-rank-meta {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.script-rank-place {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.script-rank-meta strong {
  font-size: 14px;
  font-weight: 400;
}

.script-rank-meta small {
  color: var(--text-faint);
  font-size: 11px;
}

.script-rank-stats,
.script-analysis-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.script-rank-stats div,
.script-analysis-box {
  padding: 12px;
  border-radius: 16px;
background: var(--layer-2);
}

.script-rank-stats span,
.script-analysis-box span,
.script-analysis-box small {
  display: block;
}

.script-rank-stats span,
.script-analysis-box span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.script-rank-stats strong,
.script-analysis-box strong {
  display: block;
  margin-top: 6px;
  color: var(--text);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
}

.script-rank-card p,
.script-summary-copy p {
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.7;
}

.script-summary-copy {
  display: grid;
  gap: 10px;
}

.script-analysis-box small {
  margin-top: 6px;
  color: var(--text-soft);
  font-size: 11px;
  line-height: 1.45;
}

.script-insight-grid {
  gap: 14px;
}

.script-insight-grid > .inner-surface {
  padding: 14px;
}

.script-layout {
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  align-items: start;
}

.script-text-card {
  display: grid;
  gap: 14px;
}

.script-text-copy {
  display: grid;
  gap: 14px;
}

.script-text-lead {
  padding: 14px;
border-radius: 16px;
  background: rgba(204, 125, 94, 0.06);
}

.script-text-lead p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.78;
}

.script-text-sections {
  display: grid;
  gap: 12px;
}

.script-text-part {
  padding: 14px;
border-radius: 16px;
  background: var(--layer-3);
  display: grid;
  gap: 8px;
}

.script-text-part-head span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.script-text-part p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.78;
}

.manager-tabs,
.script-tabs,
.report-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 14px;
}

.manager-tab,
.script-tab,
.report-tab {
border-radius: 999px;
  padding: 9px 14px;
  background: rgba(255, 255, 255, 0.025);
  color: var(--text-faint);
  font-size: 11px;
  font-weight: 400;
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.manager-tab:hover,
.script-tab:hover,
.report-tab:hover,
.manager-tab.active,
.script-tab.active,
.report-tab.active {
  color: var(--text);
background: rgba(204, 125, 94, 0.08);
  transform: translateY(-1px);
}

.script-tab {
  white-space: nowrap;
}

.profile-summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
}

.profile-main {
  display: grid;
  gap: 16px;
}

.profile-identity {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.avatar-block {
  display: flex;
  align-items: center;
  gap: 14px;
}

.avatar {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: rgba(204, 125, 94, 0.14);
  color: #f1d4c7;
  font-size: 20px;
  font-weight: 400;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.avatar-copy h3,
.avatar-copy p {
  margin: 0;
}

.avatar-copy h3 {
  font-size: 1.1rem;
  letter-spacing: 0;
}

.avatar-copy p {
  margin-top: 6px;
  color: var(--text-faint);
  font-size: 12px;
}

.score-ring {
  width: 120px;
  aspect-ratio: 1;
  position: relative;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--layer-3);
box-shadow: none;
}

.score-ring::after {
  content: "";
  position: absolute;
  inset: 10px;
  border-radius: 50%;
  background: var(--layer-3);
}

.score-ring strong,
.score-ring span {
  position: relative;
  z-index: 1;
}

.score-ring strong {
  font-size: 24px;
  font-weight: 400;
}

.score-ring span {
  max-width: 60px;
  text-align: center;
  color: var(--text-faint);
  font-size: 9px;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.key-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.key-box {
  padding: 14px;
border-radius: 18px;
  background: var(--layer-3);
}

.key-box span,
.key-box strong,
.key-box small {
  display: block;
}

.key-box span,
.key-box small {
  color: var(--text-faint);
  font-size: 11px;
}

.key-box strong {
  margin-top: 8px;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
}

.quote-panel {
  min-height: 100%;
  display: grid;
  align-content: start;
  gap: 10px;
  background: var(--layer-2);
}

.quote-panel p,
.quote-panel span {
  margin: 0;
}

.quote-panel p {
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
}

.quote-panel span {
  color: var(--text-faint);
  font-size: 11px;
}

.inner-surface {
  padding: 14px;
  background: var(--layer-2);
}

.calls-stack {
  display: grid;
  gap: 18px;
}

.call-overview-card,
.call-success-card,
.call-queue-card,
.call-quality-card {
  display: grid;
  gap: 14px;
}

.call-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) 280px;
  gap: 18px;
  align-items: start;
}

.call-overview-copy {
  display: grid;
  gap: 14px;
}

.call-overview-copy p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.78;
}

.call-insight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.call-insight-box {
  padding: 14px;
border-radius: 16px;
  background: var(--layer-3);
  display: grid;
  gap: 8px;
}

.call-insight-box span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.call-insight-box strong {
  color: var(--text);
  font-size: 13px;
  line-height: 1.58;
  font-weight: 400;
}

.call-overview-side {
  display: grid;
  gap: 12px;
}

.call-overview-stat {
  padding: 14px;
border-radius: 16px;
  background: var(--layer-3);
  display: grid;
  gap: 8px;
}

.call-overview-stat span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.call-overview-stat strong {
  font-size: 24px;
  font-weight: 400;
  letter-spacing: 0;
}

.call-overview-stat small {
  color: var(--text-soft);
  font-size: 11px;
  line-height: 1.45;
}

.successful-call-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.successful-call-card {
  display: grid;
  gap: 12px;
  padding: 16px;
border-radius: 18px;
  background: var(--layer-3);
}

.successful-call-card.featured {
box-shadow: none;
}

.successful-call-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.successful-call-head div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.successful-call-rank {
  color: var(--text-faint);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.successful-call-head strong {
  font-size: 14px;
  font-weight: 400;
}

.successful-call-head p {
  margin: 0;
  color: var(--text-faint);
  font-size: 11px;
}

.successful-call-copy,
.successful-call-scale p {
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.65;
}

.successful-call-meta {
  display: grid;
  gap: 8px;
}

.successful-call-method {
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(204, 125, 94, 0.06);
color: var(--text);
  font-size: 11px;
  line-height: 1.5;
}

.successful-call-scale {
  display: grid;
  gap: 6px;
  padding-top: 4px;
}

.successful-call-scale span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.call-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(0, 0.78fr);
  gap: 18px;
}

.call-queue-card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 100%;
}

.call-queue-card .block-header {
  margin-bottom: 10px;
}

.call-queue-card .table-shell {
  flex: 1;
  min-height: 0;
}

.call-queue-card table {
  min-height: 100%;
}

.call-queue-card thead th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.call-queue-card tbody tr:last-child td {
  padding-bottom: 16px;
}

.call-player {
  background: var(--layer-2);
}

.player-line {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}

.player-line button {
  width: 40px;
  height: 40px;
border-radius: 50%;
  background: #cc7d5e;
  color: #fff;
  font-size: 13px;
  box-shadow:
    0 14px 26px rgba(204, 125, 94, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.player-wave {
  flex: 1;
  height: 32px;
  border-radius: 999px;
  background: var(--layer-3);
}

.stage-map {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.stage-row {
  display: grid;
  grid-template-columns: 128px minmax(0, 1fr) 58px;
  gap: 10px;
  align-items: center;
}

.stage-row span {
  font-size: 11px;
  font-weight: 400;
}

.stage-row small {
  text-align: right;
  color: var(--text-faint);
  font-size: 10px;
}

.call-detail-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.call-detail-meta {
  padding: 12px 14px;
border-radius: 16px;
  background: var(--layer-3);
  display: grid;
  gap: 6px;
}

.call-detail-meta span {
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.call-detail-meta strong {
  font-size: 13px;
  font-weight: 400;
}

.call-detail-copy {
  display: grid;
  gap: 12px;
}

.call-detail-copy p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.72;
}

.call-fragments {
  display: grid;
  gap: 12px;
}

.call-fragments-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.call-fragments-head strong {
  font-size: 13px;
  font-weight: 400;
}

.call-fragments-head span {
  color: var(--text-faint);
  font-size: 11px;
}

.call-fragment {
  display: grid;
  gap: 8px;
  padding: 14px;
border-radius: 16px;
  background: var(--layer-3);
}

.call-fragment-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.call-fragment strong {
  font-size: 14px;
  font-weight: 400;
}

.call-fragment p {
  margin: 0;
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.7;
}

.version-meta,
.grid-metadata {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.diff-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.diff-item {
border-radius: 16px;
  background: var(--layer-3);
  padding: 14px;
}

.diff-item strong,
.diff-item span {
  display: block;
}

.diff-item strong {
  font-size: 11px;
  color: #d6d6d6;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.diff-item span {
  margin-top: 8px;
  color: var(--text-soft);
  font-size: 12px;
}

.table-shell {
  overflow: auto;
border-radius: 18px;
  background: var(--layer-3);
}

table {
  width: 100%;
  min-width: 650px;
  border-collapse: collapse;
}

.abm-table {
  min-width: 1860px;
}

.abm-table .col-company {
  min-width: 250px;
}

.abm-table .col-site {
  min-width: 140px;
  max-width: 180px;
  width: 160px;
  word-break: break-all;
  overflow-wrap: anywhere;
}

.abm-table .col-site a {
  display: inline-block;
  max-width: 100%;
  word-break: break-all;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.abm-table .col-offer {
  min-width: 280px;
}

.abm-table .col-profile {
  min-width: 320px;
}

.abm-table .col-director,
.abm-table .col-finance {
  min-width: 170px;
}

.abm-table .col-phone {
  min-width: 160px;
}

.abm-table .col-email {
  min-width: 210px;
}

.abm-table .col-telegram {
  min-width: 170px;
}

.abm-table .col-inn {
  min-width: 120px;
}

.abm-table .col-contacts {
  min-width: 280px;
}

.abm-table .col-proposal {
  min-width: 130px;
}

.abm-table a {
  color: var(--text);
  text-decoration: none;
}

.abm-table a:hover {
  color: var(--accent);
}

.abm-table td {
  vertical-align: top;
  padding: 14px 16px;
}

/* Однородный фон у всех строк, между ними — тонкая светлая линия. */
.abm-table tbody tr {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.abm-table tbody tr:last-child {
  border-bottom: none;
}

.abm-table tbody tr:hover {
  background: rgba(204, 125, 94, 0.06);
}

/* КП-статус в ABM-таблице: просто текст, без плашки/обводки. */
.proposal-status-text {
  font-size: 12px;
  letter-spacing: 0.02em;
}
.proposal-status-text.is-ready {
  color: var(--primary-strong);
}
.proposal-status-text.is-pending {
  color: var(--text-faint);
}

.abm-inline-input {
  width: 100%;
  min-width: 120px;
border-radius: 10px;
  background: rgba(45, 45, 43, 0.78);
  color: var(--text);
  padding: 9px 10px;
  font: inherit;
  outline: none;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.abm-inline-input::placeholder {
  color: rgba(216, 215, 209, 0.48);
}

.abm-inline-input:focus {
background: rgba(62, 62, 58, 0.95);
  box-shadow: 0 0 0 3px rgba(204, 125, 94, 0.12);
}

.abm-inline-input.is-saving {
  opacity: 0.64;
  cursor: wait;
}

th,
td {
  padding: 13px 14px;
  text-align: left;
}

th {
  color: #a6a6a6;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  background: rgba(255, 255, 255, 0.035);
}

td {
  font-size: 13px;
  color: var(--text-soft);
}

tbody tr:last-child td {
}

tbody tr:hover td {
  background: rgba(204, 125, 94, 0.08);
  color: var(--text);
}

tbody tr.call-row {
  cursor: pointer;
}

tbody tr.call-row.active td {
  background: rgba(204, 125, 94, 0.12);
  color: var(--text);
}

td strong {
  color: var(--text);
}

.timeline-list {
  position: relative;
  padding-left: 18px;
}

.timeline-list::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  border-radius: 999px;
  background: #cc7d5e;
}

.timeline-item {
  padding-left: 16px;
}

.timeline-item::before {
  content: "";
  position: absolute;
  left: -2px;
  top: 18px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #cc7d5e;
  box-shadow: 0 0 20px rgba(204, 125, 94, 0.45);
}

.timeline-item p,
.timeline-item span,
.timeline-item strong {
  margin: 0;
}

.timeline-item span {
  display: block;
  color: var(--text-faint);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.timeline-item strong {
  font-size: 14px;
}

.timeline-item p {
  color: var(--text-soft);
  font-size: 12px;
}

.bullet-list {
  margin: 0;
  padding-left: 18px;
}

.bullet-list li {
  color: var(--text-soft);
  font-size: 12px;
  line-height: 1.6;
}

.footer-note {
  text-align: center;
  color: var(--text-faint);
  font-size: 11px;
  padding-bottom: 8px;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1360px) {
  .dashboard-grid {
    grid-template-columns: 272px minmax(0, 1fr);
  }

  .employee-ranking-grid,
  .stat-band,
  .key-grid,
  .successful-call-grid,
  .call-insight-grid,
  .script-ranking-grid,
  .script-rank-stats,
  .script-analysis-grid,
  .outreach-detail-top,
  .call-detail-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .panel-grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1240px) {
  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    max-height: none;
  }

  .hero-grid,
  .two-panel,
  .call-overview-grid,
  .call-workspace,
  .script-stack,
  .cron-card-grid,
  .integration-layout,
  .proposal-layout,
  .outreach-layout-v2,
  .script-layout,
  .allocation-layout,
  .report-layout,
  .admin-layout,
  .story-block,
  .profile-summary,
  .employee-ranking-grid,
  .panel-grid-3 {
    grid-template-columns: 1fr;
  }

  .proposal-layout {
    grid-template-areas:
      "pending"
      "list"
      "details";
  }

  .proposal-doc-card {
    position: static;
    max-height: none;
  }

  .topbar,
  .spotlight-header {
    grid-template-columns: 1fr;
  }

  .successful-call-grid,
  .call-insight-grid,
  .script-ranking-grid,
  .script-rank-stats,
  .script-analysis-grid,
  .cron-meta-grid,
  .integration-meta-grid,
  .icp-grid,
  .proposal-doc-meta,
  .outreach-contact-grid,
  .call-detail-actions,
  .integration-card-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .app-shell {
    padding: 14px;
  }

  .ai-agents-layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .dashboard-grid {
    gap: 14px;
    min-height: calc(100vh - 28px);
  }

  .dashboard-grid,
  .sidebar,
  .workspace {
    min-width: 0;
    max-width: 100%;
  }

  .sidebar > *,
  .workspace > *,
  .nav-modes,
  .nav-mode,
  .sidebar-footer,
  .sidebar-logout,
  .sidebar-settings {
    min-width: 0;
  }

  .nav-mode {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .sidebar,
  .topbar,
  .surface,
  .story-block,
  .spotlight {
    padding: 16px;
  }

  .employee-rank-stats {
    grid-template-columns: 1fr;
  }

  .filters,
  .topbar-actions {
    flex-direction: column;
  }

  .cron-card-head,
  .cron-actions-row,
  .icp-segment-head,
  .integration-token-head,
  .integration-token-grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .kp-preview-grid {
    grid-template-columns: 1fr;
  }

  .kp-preview-block:first-child {
  }

  .topbar-actions > * {
    width: 100%;
  }

  .flowup-header-actions,
  .flowup-channel-switch,
  .flowup-segment-filter,
  .flowup-segment-filter select {
    width: 100%;
  }

  .flowup-channel-tab {
    flex: 1;
    justify-content: center;
  }

  .profile-identity {
    flex-direction: column;
    align-items: flex-start;
  }

  .story-block {
    gap: 14px;
  }

  .chart-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .app-shell {
    padding: 10px;
  }

  .dashboard-grid {
    min-height: calc(100vh - 20px);
  }

  .headline h1,
  .spotlight-header h2 {
    max-width: none;
  }

  .stat-band,
  .key-grid {
    grid-template-columns: 1fr;
  }

  .cron-toggle {
    align-items: flex-start;
  }

  .chart-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    min-height: 200px;
  }

  .stage-row {
    grid-template-columns: 1fr;
  }

  .stage-row small {
    text-align: left;
  }
}


.log-stage-block {
  margin-top: 18px;
  padding-top: 16px;
display: grid;
  gap: 14px;
}

.log-stage-block-head,
.log-stage-empty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.log-stage-block-head span,
.log-stage-empty span,
.log-stage-meta span,
.log-stage-index {
  color: var(--text-faint);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.log-stage-empty {
  padding: 14px 16px;
border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.02);
}

.log-stage-empty p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
}

.log-stage-list {
  display: grid;
  gap: 12px;
}

.log-stage-item {
  padding: 14px 16px;
border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.025);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.log-stage-item.is-running {
background: rgba(204, 125, 94, 0.08);
}

.log-stage-item.is-failed {
background: rgba(217, 121, 104, 0.08);
}

.log-stage-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  margin-bottom: 12px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}

.log-stage-item-head:disabled {
  cursor: default;
  opacity: 1;
}

.log-stage-item-head > div {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}

.log-stage-item-head strong {
  font-size: 15px;
  font-weight: 600;
}

.log-stage-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.log-stage-chevron {
  color: var(--text-faint);
  font-size: 12px;
}

.log-stage-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
}

.log-stage-meta div {
  display: grid;
  gap: 4px;
}

.log-stage-meta strong {
  font-size: 13px;
  color: var(--text-soft);
  word-break: break-word;
}

.log-stage-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 14px;
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.035);
}

.log-stage-details div {
  display: grid;
  gap: 3px;
}

.log-stage-details span,
.log-stage-details small {
  color: var(--text-faint);
  font-size: 12px;
}

.log-stage-details strong,
.log-stage-details p {
  color: var(--text-soft);
  font-size: 13px;
}

.log-stage-details p,
.log-stage-details small {
  grid-column: 1 / -1;
  margin: 0;
  line-height: 1.45;
}

.log-stage-detail-error {
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  color: var(--danger, #f08c7e);
  background: rgba(217, 121, 104, 0.1);
}

.log-downstream-block {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.log-downstream-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.log-downstream-head span {
  color: var(--text-faint);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.log-downstream-head strong {
  color: var(--text-soft);
  font-size: 13px;
  font-weight: 500;
}

.log-downstream-list {
  display: grid;
  gap: 10px;
}

.log-downstream-card {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.03);
}

.log-downstream-card.has-problem {
  border-color: rgba(219, 167, 77, 0.24);
  background: rgba(219, 167, 77, 0.08);
}

.log-downstream-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.log-downstream-card-head div {
  display: grid;
  gap: 3px;
}

.log-downstream-card-head strong {
  color: var(--text);
  font-size: 14px;
}

.log-downstream-card-head span,
.log-downstream-card small {
  color: var(--text-faint);
  font-size: 12px;
}

.log-downstream-card p {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.45;
}

.log-downstream-card p span {
  color: var(--text);
  font-weight: 600;
}

@media (max-width: 900px) {
  .log-stage-meta {
    grid-template-columns: 1fr;
  }

  .log-stage-details {
    grid-template-columns: 1fr;
  }

  .log-stage-block-head,
  .log-stage-empty,
  .log-stage-item-head,
  .log-downstream-card-head {
    align-items: flex-start;
    flex-direction: column;
  }
}


.log-summary-block {
  margin-top: 16px;
  padding: 16px;
border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.03);
  display: grid;
  gap: 12px;
}

.log-summary-head span {
  color: var(--text-faint);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.log-summary-list {
  display: grid;
  gap: 8px;
}

.log-summary-list p {
  margin: 0;
  color: var(--text-soft);
  font-size: 14px;
}

.ops-summary-card {
  display: grid;
  gap: 16px;
}

.ops-summary-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.ops-summary-head h2 {
  margin: 0 0 4px;
  font-size: 20px;
}

.ops-summary-head p,
.ops-muted {
  margin: 0;
  color: var(--text-faint);
  font-size: 14px;
  line-height: 1.45;
}

.ops-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ops-kpi-grid > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.03);
}

.ops-kpi-grid span,
.ops-provider-head {
  color: var(--text-faint);
  font-size: 12px;
}

.ops-kpi-grid strong {
  display: block;
  margin-top: 4px;
  color: var(--text);
  font-size: 22px;
}

.ops-attention-actions {
  display: grid;
  gap: 10px;
}

.ops-attention-card {
  padding: 12px 14px;
  border: 1px solid rgba(217, 121, 104, 0.32);
  border-radius: var(--radius-sm);
  background: rgba(217, 121, 104, 0.08);
}

.ops-attention-card strong {
  display: block;
  margin-bottom: 6px;
  color: var(--text);
}

.ops-attention-card p {
  margin: 4px 0 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.45;
}

.ops-attention-card p span,
.ops-provider-detail p span {
  color: var(--text);
  font-weight: 600;
}

.ops-recovery-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(230, 178, 94, 0.35);
  border-radius: var(--radius-sm);
  background: rgba(230, 178, 94, 0.08);
}

.ops-recovery-head,
.ops-recovery-item,
.ops-recovery-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.ops-recovery-head {
  justify-content: space-between;
  color: var(--text);
}

.ops-recovery-head span {
  color: var(--text-faint);
  font-size: 13px;
}

.ops-recovery-list {
  display: grid;
  gap: 8px;
}

.ops-recovery-item {
  justify-content: space-between;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.035);
}

.ops-recovery-item > div:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ops-recovery-item strong {
  color: var(--text);
}

.ops-recovery-item p,
.ops-recovery-item span {
  margin: 0;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.4;
}

.ops-recovery-item span {
  color: var(--text-faint);
}

.ops-recovery-actions {
  flex-shrink: 0;
  justify-content: flex-end;
}

.ops-provider-table {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
}

.ops-provider-row {
  display: grid;
  grid-template-columns: minmax(150px, 1.4fr) minmax(140px, 1fr) repeat(5, minmax(82px, 0.6fr));
  gap: 10px;
  align-items: center;
  min-width: 720px;
  padding: 10px 12px;
  border-top: 1px solid var(--line);
  color: var(--text-soft);
  font-size: 13px;
}

.ops-provider-row:first-child,
.ops-provider-detail:first-child {
  border-top: 0;
}

.ops-provider-head {
  font-weight: 600;
  text-transform: uppercase;
}

.ops-provider-head span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.ops-provider-toggle {
  width: 100%;
  border-right: 0;
  border-bottom: 0;
  border-left: 0;
  border-radius: 0;
  background: transparent;
  font-family: inherit;
  text-align: left;
}

.ops-provider-toggle:not(.has-errors) {
  color: var(--text-soft);
  cursor: default;
  opacity: 1;
}

.ops-provider-toggle.has-errors {
  cursor: pointer;
  background: rgba(217, 121, 104, 0.05);
}

.ops-provider-toggle.has-errors:hover {
  color: var(--text);
  background: rgba(217, 121, 104, 0.1);
}

.ops-provider-toggle.is-recovered {
  cursor: pointer;
  background: rgba(79, 157, 119, 0.07);
}

.ops-provider-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 10px;
  color: var(--text-faint);
  font-size: 13px;
}

.ops-provider-detail {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 14px;
  min-width: 720px;
  padding: 12px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.035);
}

.ops-provider-detail div {
  display: grid;
  gap: 3px;
}

.ops-provider-detail span {
  color: var(--text-faint);
  font-size: 12px;
}

.ops-provider-detail strong,
.ops-provider-detail p {
  color: var(--text-soft);
  font-size: 13px;
}

.ops-provider-detail p {
  grid-column: 1 / -1;
  margin: 0;
  line-height: 1.45;
}

.ops-empty-row {
  padding: 14px 12px;
  color: var(--text-faint);
  font-size: 14px;
}

.ops-history-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.ops-history-switch h2,
.ops-history-switch p {
  margin: 0;
}

.ops-history-switch p {
  margin-top: 6px;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.5;
}

.ops-history-tabs {
  flex-shrink: 0;
  margin: 0;
}

.ops-log-card .cron-card-head p {
  margin-top: 6px;
  color: var(--text-soft);
  font-size: 12.5px;
  line-height: 1.45;
}

@media (max-width: 720px) {
  .ops-summary-head {
    flex-direction: column;
  }

  .ops-history-switch {
    align-items: stretch;
    flex-direction: column;
  }

  .ops-history-tabs {
    width: 100%;
  }

  .ops-history-tabs .crm-funnel-btn {
    flex: 1 1 0;
    justify-content: center;
  }

  .ops-kpi-grid {
    grid-template-columns: 1fr;
  }
}

/* ========== AGENTS ========== */
.agents-layout { display: flex; flex-direction: column; gap: 20px; }

/* Summary bar */
.agents-summary-bar { display: flex; gap: 6px; flex-wrap: wrap; }
.agents-summary-item {
  flex: 1; min-width: 120px;
  background: var(--bg-card, #1c1c1c);
border-radius: 14px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 2px; align-items: center; text-align: center;
}
.agents-summary-num { font-size: 20px; font-weight: 700; }
.agents-summary-item span:last-child { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }

.agents-tabs { display: flex; gap: 8px; }

/* Card grid */
.agents-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; }
.agent-card {
  background: var(--bg-card, #1c1c1c);
border-radius: 18px;
  padding: 22px;
  cursor: pointer;
  transition: border-color 180ms, transform 180ms, box-shadow 180ms;
  display: flex; flex-direction: column; gap: 16px;
}
.agent-card:hover { border-color: rgba(204,125,94,0.35); transform: translateY(-3px); box-shadow: none; }
.agent-card-top { display: flex; align-items: center; gap: 14px; }
.agent-card-title { flex: 1; }
.agent-card-title h3 { margin: 0; font-size: 16px; line-height: 1.3; }
.agent-avatar {
  width: 46px; height: 46px; border-radius: 50%;
  background: linear-gradient(135deg, var(--primary), #e8a87c);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 15px; color: #1a1a18; flex-shrink: 0;
}
.agent-avatar-lg { width: 60px; height: 60px; font-size: 20px; }
.agent-role { font-size: 12px; color: var(--text-faint); display: block; }
.agent-region { font-size: 11px; color: var(--text-faint); display: block; margin-top: 2px; opacity: 0.7; }
.agent-rating { font-size: 14px; font-weight: 700; white-space: nowrap; }
.agent-rating-star { color: #f59e0b; }
.agent-card-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.agent-card-kpis > div { display: flex; flex-direction: column; gap: 2px; font-size: 10px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.03em; }
.agent-card-kpi-num { font-size: 16px; font-weight: 700; color: var(--text); text-transform: none; letter-spacing: 0; }
.agent-card-bar-row { display: flex; align-items: center; gap: 10px; }
.agent-card-bar-bg { flex: 1; height: 6px; border-radius: 3px; background: rgba(255,255,255,0.06); overflow: hidden; }
.agent-card-bar-fill { height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--primary), #e8a87c); transition: width 400ms; }
.agent-card-bar-label { font-size: 11px; color: var(--text-faint); white-space: nowrap; }
.agent-card-contacts { font-size: 12px; color: var(--text-faint); }

/* Agent detail profile */
.agents-back-row { margin-bottom: 4px; }
.agent-profile-card {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap;
  background: var(--bg-card, #1c1c1c);
border-radius: 18px;
  padding: 24px;
}
.agent-profile-left { display: flex; align-items: center; gap: 18px; }
.agent-profile-info h2 { margin: 0 0 2px; font-size: 22px; }
.agent-profile-meta { display: flex; gap: 16px; font-size: 12px; color: var(--text-faint); margin-top: 6px; }
.agent-profile-right { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.agent-profile-contacts { display: flex; gap: 6px; flex-wrap: wrap; }
.agent-contact-chip {
  font-size: 12px; padding: 4px 10px; border-radius: 8px;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08);
  color: var(--text-soft); text-decoration: none; transition: background 150ms;
}
.agent-contact-chip:hover { background: rgba(255,255,255,0.08); }

/* KPI grid */
.agent-kpi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.agent-kpi {
  background: var(--bg-card, #1c1c1c);
border-radius: 14px;
  padding: 14px;
  text-align: center;
}
.agent-kpi-num { font-size: 20px; font-weight: 700; }
.agent-kpi-label { font-size: 10px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; margin-top: 4px; }
.agent-kpi.kpi-accent { border-color: rgba(204,125,94,0.2); background: rgba(204,125,94,0.04); }
.agent-kpi.kpi-green { border-color: rgba(34,197,94,0.2); background: rgba(34,197,94,0.04); }
.agent-kpi.kpi-red { border-color: rgba(239,68,68,0.15); background: rgba(239,68,68,0.03); }
.agent-kpi.kpi-green .agent-kpi-num { color: #4ade80; }
.agent-kpi.kpi-red .agent-kpi-num { color: #f87171; }
.agent-kpi.kpi-accent .agent-kpi-num { color: var(--primary); }

/* Two column */
.agent-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 800px) { .agent-two-col { grid-template-columns: 1fr; } }

/* Section cards */
.agent-section-card {
  background: var(--bg-card, #1c1c1c);
border-radius: 16px;
  padding: 20px;
}
.agent-section-card h3 { margin: 0 0 14px; font-size: 15px; }
.agent-section-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.agent-section-head h3 { margin: 0; }
.agent-section-count { font-size: 12px; color: var(--text-faint); font-weight: 400; margin-left: 6px; }

/* Funnel */
.agent-funnel { display: flex; flex-direction: column; gap: 7px; }
.agent-funnel-row { display: flex; align-items: center; gap: 8px; }
.agent-funnel-label { width: 110px; font-size: 11px; color: var(--text-faint); text-align: right; flex-shrink: 0; }
.agent-funnel-bar-wrap { flex: 1; height: 8px; border-radius: 4px; background: rgba(255,255,255,0.04); overflow: hidden; }
.agent-funnel-bar { height: 100%; border-radius: 4px; transition: width 500ms; }
.agent-funnel-cnt { width: 20px; font-size: 13px; font-weight: 700; text-align: center; }

/* Activity feed */
.agent-activity-feed { display: flex; flex-direction: column; gap: 0; }
.agent-activity-item { display: flex; gap: 12px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.agent-activity-date { font-size: 11px; color: var(--text-faint); width: 50px; flex-shrink: 0; padding-top: 1px; }
.agent-activity-text { font-size: 13px; line-height: 1.45; }

/* Deal pipeline steps */
.deal-pipeline { display: flex; gap: 2px; align-items: center; margin: 6px 0; }
.deal-pip-step { display: flex; flex-direction: column; align-items: center; gap: 3px; flex: 1; opacity: 0.3; transition: opacity 200ms; }
.deal-pip-step.pip-done, .deal-pip-step.pip-active { opacity: 1; }
.pip-dot { width: 10px; height: 10px; border-radius: 50%; transition: background 200ms; }
.deal-pip-step.pip-active .pip-dot { box-shadow: 0 0 8px currentColor; transform: scale(1.25); }
.pip-label { font-size: 8px; color: var(--text-faint); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 64px; }
.deal-pip-step.pip-done .pip-label, .deal-pip-step.pip-active .pip-label { color: var(--text-soft); }

/* Projects list */
.agent-projects-list { display: flex; flex-direction: column; gap: 12px; }
.agent-project-card {
  background: rgba(255,255,255,0.02);
border-radius: 14px;
  padding: 18px;
  cursor: pointer;
  transition: border-color 200ms, background 200ms;
}
.agent-project-card:hover { border-color: rgba(204,125,94,0.25); background: rgba(204,125,94,0.03); }
.agent-project-card.active { border-color: var(--primary); background: rgba(204,125,94,0.05); }
.agent-project-main { display: flex; flex-direction: column; gap: 8px; }
.agent-project-top { display: flex; align-items: center; justify-content: space-between; }
.agent-project-top strong { font-size: 15px; }
.agent-project-addr { font-size: 12px; color: var(--text-faint); }
.agent-project-details-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px 16px; margin: 4px 0; }
.apd-label { font-size: 10px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; display: block; }
.apd-value { font-size: 13px; font-weight: 600; display: block; }
.apd-value.deadline-soon { color: #facc15; }
.apd-value.deadline-overdue { color: #f87171; }
.agent-project-notes { font-size: 12px; color: var(--text-faint); font-style: italic; padding: 6px 0; border-top: 1px solid rgba(255,255,255,0.04); }
.agent-bitrix-link { font-size: 12px; color: var(--primary); text-decoration: none; }
.agent-bitrix-link.disabled { opacity: 0.35; cursor: default; }

/* Client drawer overlay */
.agent-client-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.55); z-index: 200;
  display: flex; align-items: center; justify-content: center;
}
.agent-client-drawer {
  width: min(520px, 92vw); max-height: 85vh; overflow-y: auto;
  background: var(--bg-card, #1c1c1c);
border-radius: 18px;
  padding: 24px;
}
.agent-client-drawer-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.agent-client-drawer-head h3 { margin: 0; font-size: 17px; }
.agent-client-drawer-body { display: flex; flex-direction: column; gap: 10px; }
.agent-client-field { display: flex; justify-content: space-between; align-items: center; font-size: 13px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.agent-client-label { color: var(--text-faint); min-width: 130px; }
.agent-client-notes { font-size: 12px; color: var(--text-faint); font-style: italic; padding: 8px 0; border-top: 1px solid rgba(255,255,255,0.06); margin-top: 4px; }

/* Clients table */
.agents-clients-table { display: flex; flex-direction: column; }
.agents-clients-head {
  display: grid; grid-template-columns: 1.4fr 1fr 1.3fr 1fr 0.8fr 0.7fr; gap: 10px;
  padding: 10px 16px; font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.05em;
}
.agents-clients-row {
  display: grid; grid-template-columns: 1.4fr 1fr 1.3fr 1fr 0.8fr 0.7fr; gap: 10px;
  padding: 12px 16px; font-size: 13px; align-items: center;
cursor: pointer; transition: background 150ms;
}
.agents-clients-row:hover { background: rgba(255,255,255,0.03); }
.agents-clients-row small { color: var(--text-faint); font-size: 11px; }
.agents-client-source { font-size: 12px; color: var(--text-faint); }

/* ============================================================ */
/* DEMO: CRM section                                              */
/* ============================================================ */

.crm-section .block-header { align-items: flex-start; }

.crm-tabs { display: inline-flex; gap: 4px; background: var(--layer-2); border-radius: 10px; padding: 4px; }
.crm-tab {
  background: transparent; border: 0; color: var(--text-soft);
  padding: 8px 14px; border-radius: 8px; font-size: 12.5px; cursor: pointer;
  font-family: inherit;
}
.crm-tab.active { background: rgba(204,125,94,0.18); color: var(--text); }
.crm-tab:hover:not(.active) { background: rgba(255,255,255,0.04); }

.crm-counters { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 16px 0 8px; }

.kpi-card {
  background: var(--layer-2); border-radius: 12px; padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px;
  border: 1px solid rgba(255,255,255,0.04);
}
.kpi-label { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
.kpi-value { font-size: 22px; font-weight: 600; color: var(--text); }
.kpi-suffix { color: var(--text-faint); font-weight: 400; font-size: 14px; }
.kpi-sub { font-size: 11px; color: var(--text-faint); }
.kpi-up { color: #6fcf97; }
.kpi-card-cta { gap: 6px; }
.kpi-card-cta button { margin-top: 6px; width: fit-content; padding: 4px 10px; font-size: 11.5px; }

.crm-filters { display: flex; align-items: center; gap: 8px; margin: 12px 0 16px; flex-wrap: wrap; }
.crm-filter-search {
  flex: 1 1 240px; min-width: 180px;
  display: flex; align-items: center; gap: 8px;
  height: 38px; padding: 0 12px;
  background: var(--layer-3);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  color: var(--text-faint);
  transition: border-color 150ms, color 150ms;
}
.crm-filter-search:focus-within { border-color: var(--primary); color: var(--text-soft); }
.crm-filter-search svg { flex-shrink: 0; }
.crm-filter-search input {
  flex: 1; min-width: 0; background: transparent; border: 0; outline: none;
  color: var(--text); font: inherit; font-size: 13px; padding: 0;
}
.crm-filter-field { position: relative; display: inline-flex; }
.crm-filter-field select {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  height: 38px; padding: 0 32px 0 12px;
  background: var(--layer-3); color: var(--text);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  font: inherit; font-size: 13px; cursor: pointer;
  transition: border-color 150ms;
}
.crm-filter-field select:hover { border-color: rgba(255,255,255,0.14); }
.crm-filter-field select:focus { outline: none; border-color: var(--primary); }
.crm-filter-chevron {
  position: absolute; right: 11px; top: 50%; transform: translateY(-50%);
  pointer-events: none; color: var(--text-faint);
}
.crm-filter-toggle {
  height: 38px; padding: 0 14px;
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--layer-3); color: var(--text-soft);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  font: inherit; font-size: 13px; cursor: pointer; white-space: nowrap;
  transition: background 150ms, border-color 150ms, color 150ms;
}
.crm-filter-toggle::before {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--text-faint); transition: background 150ms;
}
.crm-filter-toggle:hover { border-color: rgba(255,255,255,0.14); color: var(--text); }
.crm-filter-toggle.active { background: rgba(204,125,94,0.14); border-color: var(--primary); color: var(--text); }
.crm-filter-toggle.active::before { background: var(--primary); }

/* Kanban */
.crm-kanban {
  display: grid; grid-template-columns: repeat(6, minmax(220px, 1fr));
  gap: 12px; overflow-x: auto; padding-bottom: 0;
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* IE/Edge */
}
.crm-kanban::-webkit-scrollbar { display: none; width: 0; height: 0; }

/* Скрываем скроллбары и у других CRM-контейнеров: список и колонки
   канбана могут показывать вертикальную полосу при переполнении. */
.crm-section .table-shell,
.crm-section .crm-column-list,
.crm-section .crm-activity {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.crm-section .table-shell::-webkit-scrollbar,
.crm-section .crm-column-list::-webkit-scrollbar,
.crm-section .crm-activity::-webkit-scrollbar { display: none; width: 0; height: 0; }
.crm-column {
  background: var(--layer-2); border-radius: 12px; padding: 12px;
  display: flex; flex-direction: column; gap: 10px; min-height: 360px;
  border: 1px solid rgba(255,255,255,0.04);
  transition: background 150ms, border-color 150ms;
}
.crm-column.drag-over { background: rgba(204,125,94,0.08); border-color: rgba(204,125,94,0.35); }
.crm-column-head { display: flex; justify-content: space-between; align-items: baseline; }
.crm-column-title { font-size: 12.5px; font-weight: 600; color: var(--text); }
.crm-column-meta { font-size: 11px; color: var(--text-faint); }
.crm-column-list { display: flex; flex-direction: column; gap: 8px; }
.crm-column-empty { font-size: 12px; color: var(--text-faint); padding: 20px 4px; text-align: center; opacity: 0.5; }

.crm-deal-card {
  background: #181818; border-radius: 10px; padding: 10px 12px;
  display: flex; flex-direction: column; gap: 6px;
  border: 1px solid rgba(255,255,255,0.04);
  cursor: grab; transition: transform 120ms, box-shadow 120ms, border-color 120ms;
}
.crm-deal-card:hover { border-color: rgba(204,125,94,0.3); }
.crm-deal-card:active { cursor: grabbing; }
.crm-deal-card.dragging { opacity: 0.55; transform: scale(0.98); }

/* ───── мини-карточка v2 (B2B-нейтральная, Bitrix/amo-стиль) ───── */
.crm-deal-card-v2 {
  position: relative;
  padding: 0;                /* отступы в .crm-deal-body, чтобы stripe был на всю высоту */
  overflow: hidden;
  gap: 0;
}

.crm-deal-stripe {
  position: absolute;
  top: 0; left: 0;
  width: 3px;
  height: 100%;
  background: transparent;
  transition: background 150ms ease;
}
.crm-deal-card-v2.prio-high .crm-deal-stripe { background: rgba(204, 125, 94, 0.85); }
.crm-deal-card-v2.prio-medium .crm-deal-stripe { background: rgba(180, 180, 180, 0.45); }
.crm-deal-card-v2.prio-low .crm-deal-stripe { background: rgba(180, 180, 180, 0.18); }

.crm-deal-card-v2 .crm-deal-body {
  display: flex; flex-direction: column; gap: 7px;
  padding: 11px 12px 10px 14px;     /* +2px слева под полоску */
}

.crm-deal-card-v2 .crm-deal-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 8px;
}
.crm-deal-card-v2 .crm-deal-title-v2 {
  font-size: 13px; font-weight: 600; line-height: 1.35; color: var(--text);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; text-overflow: ellipsis;
  flex: 1; min-width: 0;
}
.crm-deal-card-v2 .crm-deal-owner-mini {
  width: 22px; height: 22px; font-size: 10px;
  flex-shrink: 0;
}

.crm-deal-card-v2 .crm-deal-company {
  font-size: 11.5px; color: var(--text-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.crm-deal-card-v2 .crm-deal-amount-large {
  font-size: 15px; font-weight: 700; color: var(--text);
  font-family: ui-monospace, "SF Mono", monospace;
  letter-spacing: 0;
}

.crm-deal-card-v2 .crm-deal-tags {
  display: flex; flex-wrap: wrap; gap: 4px;
}

/* Нейтральный (серый) tag-pill — без vivid-цветов под отрасль. */
.crm-tag-pill-neutral {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--text-soft) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  font-size: 10.5px !important;
  padding: 2px 7px !important;
}

.crm-deal-card-v2 .crm-deal-next-mini {
  display: flex; align-items: center; gap: 6px;
  font-size: 11.5px; color: var(--text-soft);
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 6px;
  border-left: 2px solid rgba(180, 180, 180, 0.3);
}
.crm-deal-card-v2 .crm-deal-next-mini.is-overdue {
  border-left-color: rgba(220, 80, 80, 0.7);
  color: rgba(240, 130, 130, 0.95);
  background: rgba(220, 80, 80, 0.06);
}
.crm-deal-card-v2 .crm-deal-next-icon {
  flex-shrink: 0; font-size: 11px;
}
.crm-deal-card-v2 .crm-deal-next-text {
  flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* Ответственный — явной строкой «аватар + имя». */
.crm-deal-card-v2 .crm-deal-owner-row {
  display: flex; align-items: center; gap: 6px; min-width: 0;
}
.crm-deal-card-v2 .crm-deal-owner-name {
  font-size: 11.5px; color: var(--text-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.crm-deal-card-v2 .crm-deal-owner-name.is-unassigned {
  color: var(--text-faint); font-style: italic;
}

.crm-deal-card-v2 .crm-deal-foot-v2 {
  display: flex; gap: 10px; align-items: center;
  padding-top: 4px; margin-top: 2px;
  border-top: 1px solid rgba(255, 255, 255, 0.04);
  font-size: 10.5px; color: var(--text-faint);
}
.crm-deal-card-v2 .crm-deal-foot-item {
  display: inline-flex; align-items: center; gap: 3px;
}
.crm-deal-card-v2 .crm-deal-foot-item.is-overdue {
  color: rgba(240, 130, 130, 0.9);
  font-weight: 600;
}
.crm-deal-card-v2 .crm-deal-age {
  margin-left: auto;     /* возраст в этапе — в правый край foot-row */
  font-variant-numeric: tabular-nums;
}
.crm-deal-project { font-size: 12.5px; font-weight: 600; line-height: 1.35; color: var(--text); }
.crm-deal-row { display: flex; justify-content: space-between; align-items: center; }
.crm-deal-amount { font-size: 12.5px; font-weight: 600; color: var(--text); font-family: ui-monospace, monospace; }
.crm-deal-contact { font-size: 11.5px; color: var(--text-faint); }
.crm-deal-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 2px; }
.crm-deal-next { font-size: 11px; color: var(--text-faint); }
.crm-deal-owner {
  display: inline-flex; align-items: center; justify-content: center;
  width: 24px; height: 24px; border-radius: 50%; background: rgba(204,125,94,0.22);
  font-size: 10.5px; font-weight: 600; color: var(--text);
}

/* List */
.crm-list-table { width: 100%; min-width: 1000px; border-collapse: collapse; font-size: 13px; }
.crm-list-table th, .crm-list-table td { padding: 12px 14px; text-align: left; }
.crm-list-table thead th { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; cursor: pointer; user-select: none; }
.crm-list-table thead th:hover { color: var(--text); }
.crm-list-table th.num, .crm-list-table td.num { text-align: right; font-family: ui-monospace, monospace; }
.crm-list-row { cursor: pointer; transition: background 120ms; }
.crm-list-row:hover { background: rgba(204,125,94,0.06); }
.crm-list-table tbody tr:nth-child(odd) { background: rgba(255,255,255,0.018); }

/* Deal card */
.crm-card-layout { display: grid; grid-template-columns: minmax(320px, 1.1fr) 1.4fr; gap: 16px; margin-top: 16px; }
.crm-card-left, .crm-card-right { padding: 18px 20px; }
.crm-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }
.crm-stage-select {
  background: var(--layer-3); color: var(--text); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px; padding: 6px 10px; font-size: 12.5px; font-family: inherit;
}
.crm-card-title { font-size: 17px; margin: 0 0 8px; line-height: 1.3; }
.crm-card-amount { font-size: 24px; font-weight: 600; color: var(--text); margin-bottom: 8px; font-family: ui-monospace, monospace; }
.crm-card-meta { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 16px; }
.crm-card-section { margin-bottom: 16px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.05); }
.crm-card-section h4 { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); margin: 0 0 6px; }
.crm-card-section p { margin: 2px 0; font-size: 13px; color: var(--text-soft); }
.crm-card-sub { color: var(--text-faint); font-size: 11.5px; }
.crm-tech-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.crm-tech-grid > div { display: flex; flex-direction: column; gap: 2px; }
.crm-tech-grid span { font-size: 11px; color: var(--text-faint); }
.crm-tech-grid strong { font-size: 13px; color: var(--text); }
.crm-related { margin: 4px 0 0; padding-left: 18px; font-size: 12.5px; color: var(--text-soft); }

.crm-quick-actions {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 8px; margin-bottom: 12px;
}
.crm-quick-actions button { padding: 6px 12px; font-size: 12px; }
.crm-quick-actions-primary {
  display: flex; flex-wrap: wrap; gap: 8px;
  flex: 1 1 auto;
}
.crm-quick-actions-outcome {
  display: flex; gap: 8px;
  padding-left: 12px;
  border-left: 1px solid rgba(255, 255, 255, 0.08);
  margin-left: auto;
}
@media (max-width: 720px) {
  .crm-quick-actions-outcome {
    margin-left: 0; padding-left: 0; border-left: none;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding-top: 8px; width: 100%;
  }
}

/* «из шаблонов КП →» как inline-ссылка вместо второй кнопки. */
.crm-file-actions {
  display: flex; align-items: center; gap: 12px;
  margin-top: 8px;
}
.crm-file-actions-link {
  background: transparent; border: none;
  color: var(--text-faint); font-size: 11.5px;
  cursor: pointer; padding: 0;
  text-decoration: none;
  transition: color 150ms ease;
}
.crm-file-actions-link:hover { color: rgba(204, 125, 94, 0.95); }

/* Empty-mini для случая «поля клиента не настроены». */
.crm-empty-mini {
  font-size: 11.5px; color: var(--text-faint);
  padding: 8px 0;
}
.crm-note-row { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 16px; }
.crm-note-input {
  flex: 1; background: var(--layer-3); color: var(--text);
  border: 1px solid rgba(255,255,255,0.08); border-radius: 8px;
  padding: 8px 12px; font-size: 13px; font-family: inherit; resize: vertical;
}
.crm-note-row button { padding: 8px 14px; }
.crm-activity-header { font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); margin: 8px 0 12px; }
.crm-activity { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.crm-activity-item {
  background: var(--layer-3); border-radius: 8px; padding: 10px 12px;
  border-left: 3px solid rgba(204,125,94,0.4);
}
.crm-act-stage { border-left-color: #6fcf97; }
.crm-act-call { border-left-color: #5eacd6; }
.crm-act-meeting { border-left-color: #d6cf5e; }
.crm-act-note { border-left-color: rgba(255,255,255,0.3); }
.crm-act-kp { border-left-color: #cc7d5e; }
.crm-activity-meta { font-size: 11px; color: var(--text-faint); margin-bottom: 4px; }
.crm-activity-text { font-size: 13px; color: var(--text); line-height: 1.4; }

/* ============================================================ */
/* Sales Agents (кабинеты партнёров)                              */
/* ============================================================ */

.sa-mode-toggle {
  display: flex; gap: 8px; align-items: center;
  margin-bottom: 12px; position: sticky; top: 0; z-index: 10;
  background: transparent;
  padding: 8px 0;
}
.sa-mode-label {
  display: inline-flex; align-items: center; min-height: 32px;
  color: var(--text-soft); font-size: 13px; font-weight: 600;
}
.sa-toast {
  margin-left: auto; background: rgba(111,207,151,0.18); color: #cfe;
  padding: 8px 14px; border-radius: 8px; font-size: 12.5px;
  border: 1px solid rgba(111,207,151,0.3);
  animation: sa-toast-in 240ms ease-out;
}
.app-toast {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 260;
  max-width: min(420px, calc(100vw - 32px));
  margin: 0;
  box-shadow: 0 18px 44px rgba(0,0,0,0.34);
}
@keyframes sa-toast-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.sa-kpi-block, .sa-chart-block, .sa-top-block, .sa-payouts-block { padding: 18px 20px; }
.sa-kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }

.sa-chart-range { display: inline-flex; gap: 4px; background: var(--layer-2); border-radius: 8px; padding: 3px; }
.sa-range-btn {
  background: transparent; border: 0; color: var(--text-faint);
  padding: 5px 10px; border-radius: 6px; font-size: 11.5px; cursor: pointer; font-family: inherit;
}
.sa-range-btn.active { background: rgba(204,125,94,0.18); color: var(--text); }

.sa-chart-wrap { margin-top: 14px; }
.sa-chart-svg { width: 100%; height: auto; }
.sa-chart-legend { display: flex; gap: 18px; font-size: 11.5px; color: var(--text-faint); margin-top: 8px; padding-left: 56px; }
.sa-chart-legend .legend-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }

.sa-top-table { width: 100%; min-width: 900px; border-collapse: collapse; font-size: 13px; }
.sa-top-table th, .sa-top-table td { padding: 12px 14px; text-align: left; }
.sa-top-table thead th { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
.sa-top-table th.num, .sa-top-table td.num { text-align: right; font-family: ui-monospace, monospace; }
.sa-top-table tbody tr:nth-child(odd) { background: rgba(255,255,255,0.018); }
.sa-top-table tbody tr:hover { background: rgba(204,125,94,0.06); }
.sa-top-footer { margin-top: 12px; text-align: center; }

.sa-payouts-list { display: flex; flex-direction: column; gap: 8px; }
.sa-payout-row {
  display: grid; grid-template-columns: 1.6fr auto auto;
  gap: 16px; align-items: center;
  background: var(--layer-2); border-radius: 10px; padding: 12px 16px;
  border: 1px solid rgba(255,255,255,0.04);
}
.sa-payout-row.is-done { opacity: 0.6; }
.sa-payout-agent strong { font-size: 13.5px; color: var(--text); }
.sa-payout-reason { font-size: 12px; color: var(--text-soft); margin-top: 2px; }
.sa-payout-meta { font-size: 11px; color: var(--text-faint); margin-top: 2px; }
.sa-payout-amount { font-size: 16px; font-weight: 600; font-family: ui-monospace, monospace; color: var(--text); }
.sa-payout-actions { display: flex; gap: 8px; }
.sa-payout-actions button { padding: 6px 12px; font-size: 12px; }

/* Agent profile drawer */
.sa-drawer { width: min(1080px, 96vw); }
.sa-profile-layout { display: grid; grid-template-columns: minmax(280px, 0.9fr) 1.6fr; gap: 18px; padding: 0 22px 22px; }
.sa-profile-card {
  background: var(--layer-2); border-radius: 12px; padding: 18px 20px;
  display: flex; flex-direction: column; gap: 16px;
}
.sa-profile-card h2 { margin: 0; font-size: 18px; }
.sa-profile-sub { font-size: 11.5px; color: var(--text-faint); }
.sa-profile-section { padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.05); }
.sa-profile-section h4 { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); margin: 0 0 6px; }
.sa-profile-section p { margin: 3px 0; font-size: 13px; color: var(--text-soft); }
.sa-rate-row { display: flex; justify-content: space-between; align-items: center; }
.sa-rate-row strong { font-size: 18px; font-family: ui-monospace, monospace; }
.sa-rate-row button { padding: 5px 10px; font-size: 11.5px; }
.sa-rate-edit { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.sa-rate-edit input { background: var(--layer-3); color: var(--text); border: 1px solid rgba(255,255,255,0.1); border-radius: 6px; padding: 6px 10px; font-size: 14px; width: 70px; font-family: ui-monospace, monospace; }
.sa-rate-edit button { padding: 6px 10px; font-size: 11.5px; }

.sa-profile-tabs { display: flex; flex-direction: column; gap: 14px; }
.sa-tab-bar { display: flex; gap: 4px; background: var(--layer-2); border-radius: 8px; padding: 4px; width: fit-content; }
.sa-tab {
  background: transparent; border: 0; color: var(--text-faint);
  padding: 7px 14px; border-radius: 6px; font-size: 12.5px; cursor: pointer; font-family: inherit;
}
.sa-tab.active { background: rgba(204,125,94,0.18); color: var(--text); }
.sa-tab-body { background: var(--layer-2); border-radius: 12px; padding: 16px 18px; }

.sa-deals-table, .sa-payouts-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.sa-deals-table th, .sa-deals-table td, .sa-payouts-table th, .sa-payouts-table td { padding: 10px 12px; text-align: left; }
.sa-deals-table thead th, .sa-payouts-table thead th { font-size: 10.5px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
.sa-deals-table th.num, .sa-deals-table td.num, .sa-payouts-table th.num, .sa-payouts-table td.num { text-align: right; font-family: ui-monospace, monospace; }

.sa-kpi-tab { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }

.empty-state-mini {
  padding: 24px 8px; text-align: center; color: var(--text-faint); font-size: 12.5px; line-height: 1.5;
}

/* Agent personal view */
.sa-my-deals { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.sa-my-deal {
  background: var(--layer-2); border-radius: 10px; padding: 12px 14px;
  border: 1px solid rgba(255,255,255,0.04);
}
.sa-my-deal-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.sa-my-deal-head strong { font-size: 12.5px; line-height: 1.35; }
.sa-my-deal-meta { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--text-faint); }

.sa-lead-form { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.sa-lead-form label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--text-faint); }
.sa-lead-form label.full-row { grid-column: 1 / -1; }
.sa-lead-form input, .sa-lead-form textarea {
  background: var(--layer-3); color: var(--text); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px; padding: 9px 12px; font-size: 13px; font-family: inherit;
}
.sa-lead-form button { grid-column: 1 / -1; width: fit-content; }
.sa-lead-list { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; }
.sa-lead-row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 10px 12px; border-radius: 8px; background: var(--layer-2);
  border: 1px solid rgba(255,255,255,0.05);
}
.sa-lead-row div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sa-lead-row strong { font-size: 13px; color: var(--text); overflow-wrap: anywhere; }
.sa-lead-row span { font-size: 12px; color: var(--text-faint); overflow-wrap: anywhere; }

/* Адаптив: на узких экранах канбан превращается в горизонтальный скролл,
   профиль-drawer становится одноколоночным. */
@media (max-width: 1280px) {
  .crm-counters { grid-template-columns: repeat(2, 1fr); }
  .sa-kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .sa-profile-layout { grid-template-columns: 1fr; }
  .crm-card-layout { grid-template-columns: 1fr; }
}

/* ============================================================ */
/* Sales Agents — dashboard polish                                */
/* ============================================================ */

/* --- HERO --- */
.sa-hero {
  position: relative;
  overflow: hidden;
  padding: 32px 36px;
  margin-bottom: 4px;
  border-radius: 18px;
  background: var(--layer-2);
  border: 0;
}
.sa-hero-bg { display: none; }
.sa-hero-content {
  position: relative; z-index: 1;
  display: flex; justify-content: space-between; align-items: center; gap: 36px;
}
.sa-hero-left { flex: 1 1 auto; }
.sa-hero-eyebrow {
  font-size: 11px; color: var(--text-faint); text-transform: uppercase;
  letter-spacing: 0.12em; margin: 0 0 12px;
}
.sa-hero-title {
  font-size: 52px; font-weight: 600; margin: 0 0 8px;
  font-family: ui-monospace, "JetBrains Mono", monospace;
  letter-spacing: 0; line-height: 1;
  color: var(--text);
}
.sa-hero-trend {
  display: inline-block; font-size: 16px; font-weight: 500;
  vertical-align: middle; margin-left: 14px;
  background: rgba(111,207,151,0.15); color: #8ee0ad;
  padding: 4px 10px; border-radius: 8px;
  -webkit-text-fill-color: #8ee0ad;
}
.sa-hero-sub {
  font-size: 14px; color: var(--text-soft); margin: 0 0 20px;
}
.sa-hero-stats { display: flex; gap: 28px; }
.sa-hero-stats > div { display: flex; flex-direction: column; gap: 2px; }
.sa-hero-stats strong {
  font-size: 22px; color: var(--text);
  font-family: ui-monospace, "JetBrains Mono", monospace;
}
.sa-hero-stats span {
  font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.05em;
}

.sa-hero-right { flex: 0 0 auto; }
.sa-hero-leader-label {
  font-size: 10.5px; color: var(--text-faint); text-transform: uppercase;
  letter-spacing: 0.1em; margin-bottom: 8px; text-align: right;
}
.sa-hero-leader-card {
  display: flex; gap: 14px; align-items: center;
  background: rgba(255,255,255,0.04);
  border: 0;
  border-radius: 14px; padding: 14px 18px;
  cursor: pointer;
  transition: transform 200ms ease, background 200ms ease;
  min-width: 280px;
}
.sa-hero-leader-card:hover {
  transform: translateY(-2px);
  background: rgba(204,125,94,0.08);
}
.sa-hero-leader-info { display: flex; flex-direction: column; gap: 2px; }
.sa-hero-leader-name { font-size: 14px; font-weight: 600; color: var(--text); }
.sa-hero-leader-meta { font-size: 11px; color: var(--text-faint); }
.sa-hero-leader-rev {
  font-size: 18px; color: #e9a17e; font-weight: 600;
  font-family: ui-monospace, monospace; margin-top: 4px;
}

/* --- AVATAR --- */
.sa-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  width: var(--size, 36px); height: var(--size, 36px);
  border-radius: 50%; color: #fff;
  font-size: calc(var(--size, 36px) * 0.36);
  font-weight: 600; letter-spacing: 0.02em;
  font-family: ui-monospace, monospace;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.18);
  flex-shrink: 0;
}

/* --- KPI cards with sparklines --- */
.sa-kpi-grid { gap: 14px; }
.sa-kpi {
  position: relative;
  padding: 18px 18px 14px;
  background: var(--layer-2);
  border-radius: 14px;
  border: 0;
  transition: transform 200ms ease;
  overflow: hidden;
}
.sa-kpi::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: transparent;
  transition: background 200ms;
}
.sa-kpi:hover {
  transform: translateY(-2px);
}
.sa-kpi:hover::before {
  background: rgba(204,125,94,0.55);
}
.sa-kpi-accent {
  background: var(--layer-2);
}
.sa-kpi-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  margin-bottom: 8px;
}
.sa-kpi-icon { display: none; }
.sa-kpi .kpi-value { font-size: 28px; margin: 2px 0 10px; }
.sa-kpi-foot {
  display: flex; justify-content: space-between; align-items: center;
  gap: 8px;
}
.sa-kpi-delta {
  font-size: 11px; color: var(--text-faint);
  background: rgba(255,255,255,0.04); padding: 3px 8px; border-radius: 6px;
}
.sa-kpi-delta.kpi-up { color: #8ee0ad; background: rgba(111,207,151,0.12); }
.sa-spark { display: block; flex-shrink: 0; opacity: 0.85; }

/* --- Analytics row (line + donut) --- */
.sa-analytics-row {
  display: grid; grid-template-columns: 2.8fr 1fr; gap: 14px;
}
@media (max-width: 1280px) {
  .sa-analytics-row { grid-template-columns: 1fr; }
}
.sa-donut-block { padding: 22px 24px; }

/* --- Enhanced line chart --- */
.sa-chart-block { padding: 26px 28px; }
.sa-chart-svg { width: 100%; height: auto; max-height: 460px; min-height: 360px; }
.sa-chart-dot-group .sa-chart-dot-ring {
  opacity: 0; transition: opacity 200ms ease;
}
.sa-chart-dot-group:hover .sa-chart-dot-ring { opacity: 1; }
.sa-chart-dot { transition: r 150ms ease; }
.sa-chart-dot-group:hover .sa-chart-dot { r: 6; }
.sa-chart-value {
  font-family: ui-monospace, monospace;
  pointer-events: none;
  opacity: 0.7;
}
.sa-chart-dot-group:hover .sa-chart-value { opacity: 1; }
.sa-chart-legend { padding-left: 60px; }

/* --- Donut chart --- */
.sa-donut-wrap {
  display: flex; flex-direction: column; align-items: center; gap: 18px;
  padding: 8px 0;
}
.sa-donut-svg { display: block; }
.sa-donut-legend {
  width: 100%;
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.sa-donut-legend li {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 12px; border-radius: 10px;
  background: rgba(255,255,255,0.025);
  transition: background 150ms;
}
.sa-donut-legend li:hover { background: rgba(255,255,255,0.05); }
.legend-swatch {
  flex-shrink: 0; width: 12px; height: 12px; border-radius: 4px;
}
.sa-donut-legend-info { display: flex; flex-direction: column; gap: 1px; }
.sa-donut-legend-info strong { font-size: 13px; color: var(--text); }
.sa-donut-legend-info span { font-size: 11px; color: var(--text-faint); }

/* --- Top agents list (cards-as-rows) --- */
.sa-top-list { display: flex; flex-direction: column; gap: 8px; padding-top: 4px; }
.sa-top-row {
  display: grid;
  grid-template-columns: 44px minmax(220px, 1.6fr) minmax(140px, 1fr) minmax(120px, 0.9fr) 70px 130px 110px;
  gap: 14px; align-items: center;
  padding: 12px 16px;
  background: var(--layer-2);
  border-radius: 12px;
  border: 0;
  transition: background 160ms, transform 160ms;
  cursor: pointer;
}
.sa-top-row:hover {
  background: rgba(204,125,94,0.06);
  transform: translateX(2px);
}
.sa-top-rank { display: flex; align-items: center; justify-content: center; }
.sa-rank {
  font-size: 14px;
  font-family: ui-monospace, monospace;
  color: var(--text-faint);
  font-weight: 500;
}
.sa-rank-top {
  color: var(--primary);
  font-weight: 600;
  font-size: 15px;
}
.sa-top-agent { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sa-top-agent-name { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sa-top-agent-name strong { font-size: 13.5px; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sa-top-agent-type { font-size: 11px; color: var(--text-faint); }

.sa-top-revenue { display: flex; flex-direction: column; gap: 2px; }
.sa-top-revenue-num {
  font-size: 15px; font-weight: 600; color: var(--text);
  font-family: ui-monospace, monospace;
}
.sa-top-revenue-sub { font-size: 11px; color: var(--text-faint); }

/* Conversion bar */
.sa-conv-wrap {
  display: flex; align-items: center; gap: 10px;
}
.sa-conv-track {
  flex: 1; height: 6px; background: rgba(255,255,255,0.06);
  border-radius: 3px; overflow: hidden;
}
.sa-conv-fill {
  height: 100%; border-radius: 3px;
  background: #6fcf97;
  transition: width 400ms ease;
}
.sa-conv-wrap[data-tone="mid"] .sa-conv-fill { background: #d6b35e; }
.sa-conv-wrap[data-tone="low"] .sa-conv-fill { background: #cc7d5e; }
.sa-conv-num {
  font-size: 12px; font-weight: 600; color: var(--text);
  font-family: ui-monospace, monospace; min-width: 32px; text-align: right;
}

.sa-rate-pill {
  display: inline-block; padding: 4px 10px; border-radius: 8px;
  background: rgba(204,125,94,0.16); color: #e9a17e;
  font-size: 12px; font-weight: 600; font-family: ui-monospace, monospace;
}

.sa-status-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 6px; vertical-align: middle;
}
.sa-status-ok { background: #6fcf97; box-shadow: 0 0 8px rgba(111,207,151,0.5); }
.sa-status-new { background: #d6b35e; box-shadow: 0 0 6px rgba(214,179,94,0.4); }
.sa-status-off { background: rgba(255,255,255,0.25); }

.sa-top-status {
  font-size: 12px; color: var(--text-soft);
  display: inline-flex; align-items: center;
}
.sa-top-action button { padding: 6px 10px; font-size: 11.5px; }

.sa-top-legend {
  display: flex; gap: 14px; font-size: 11px; color: var(--text-faint);
}
.sa-top-legend .legend-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px;
}

/* --- Payouts grid (cards) --- */
.sa-payouts-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}
.sa-payout-card {
  position: relative;
  background: var(--layer-2);
  border-radius: 14px;
  padding: 16px 18px 14px 22px;
  border: 0;
  overflow: hidden;
  transition: transform 180ms ease;
}
.sa-payout-card:hover {
  transform: translateY(-2px);
}
.sa-payout-card.is-done { opacity: 0.55; }
.sa-payout-card-stripe {
  position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--type-from);
}
.sa-payout-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.sa-payout-card-agent { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sa-payout-card-agent strong { font-size: 13.5px; color: var(--text); }
.sa-payout-card-agent span { font-size: 11px; color: var(--text-faint); }
.sa-payout-card-amount {
  font-size: 26px; font-weight: 600; color: var(--text);
  font-family: ui-monospace, monospace; line-height: 1;
  margin-bottom: 6px;
}
.sa-payout-card-reason { font-size: 12px; color: var(--text-soft); margin-bottom: 4px; }
.sa-payout-card-meta { font-size: 11px; color: var(--text-faint); margin-bottom: 14px; }
.sa-payout-card-foot {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  flex-wrap: wrap;
}
.sa-payout-status {
  font-size: 11px; padding: 4px 10px; border-radius: 8px; font-weight: 500;
}
.sa-payout-status-pending {
  background: rgba(214,179,94,0.14); color: #e9c97e;
}
.sa-payout-status-done {
  background: rgba(111,207,151,0.16); color: #8ee0ad;
}
.sa-payout-card-actions { display: flex; gap: 6px; }
.sa-payout-card-actions button { padding: 5px 10px; font-size: 11.5px; }

/* --- Profile drawer (enhanced) --- */
.sa-drawer { width: min(1080px, 96vw); animation: sa-drawer-in 240ms ease-out; }
@keyframes sa-drawer-in {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}
.sa-drawer-hero {
  position: relative;
  padding: 24px 28px 26px;
  background: var(--layer-2);
  border-bottom: 1px solid var(--type-from);
  overflow: hidden;
}
.sa-drawer-hero::after { display: none; }
.sa-drawer-close {
  position: absolute; top: 16px; right: 18px;
  z-index: 2;
}
.sa-drawer-hero-content {
  position: relative; z-index: 1;
  display: flex; align-items: center; gap: 20px;
  flex-wrap: wrap;
}
.sa-drawer-hero-info { flex: 1 1 200px; }
.sa-drawer-hero-info h2 {
  margin: 0 0 6px; font-size: 24px; color: var(--text); font-weight: 600;
}
.sa-drawer-hero-meta {
  display: flex; gap: 12px; flex-wrap: wrap;
  font-size: 12px; color: var(--text-soft); align-items: center;
}
.sa-drawer-type-pill {
  background: rgba(255,255,255,0.08); padding: 3px 10px; border-radius: 8px;
  font-size: 11.5px;
}
.sa-drawer-hero-numbers {
  display: flex; gap: 22px;
  background: rgba(0,0,0,0.25);
  padding: 12px 18px; border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.06);
}
.sa-drawer-hero-numbers > div { display: flex; flex-direction: column; gap: 2px; }
.sa-drawer-hero-numbers strong {
  font-size: 17px; color: var(--text); font-family: ui-monospace, monospace;
}
.sa-drawer-hero-numbers span { font-size: 10.5px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }

.sa-icon { display: none; }
.sa-contact-label {
  display: inline-block;
  width: 78px;
  font-size: 11px;
  color: var(--text-faint);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sa-rate-big {
  font-size: 26px; font-family: ui-monospace, monospace;
  color: var(--primary);
}
.sa-cumulative { display: flex; flex-direction: column; gap: 8px; }
.sa-cum-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 12px; border-radius: 8px;
  background: rgba(255,255,255,0.03);
}
.sa-cum-item span { font-size: 12px; color: var(--text-faint); }
.sa-cum-item strong { font-size: 14px; color: var(--text); font-family: ui-monospace, monospace; }

/* --- Adaptive --- */
@media (max-width: 1100px) {
  .sa-hero-content { flex-direction: column; align-items: flex-start; }
  .sa-hero-right { width: 100%; }
  .sa-hero-leader-label { text-align: left; }
  .sa-hero-title { font-size: 38px; }
  .sa-top-row { grid-template-columns: 36px minmax(180px, 1.6fr) minmax(120px, 1fr) minmax(110px, 0.9fr) 60px 110px; }
  .sa-top-row .sa-top-action { display: none; }
  .sa-drawer-hero-numbers { gap: 14px; padding: 10px 14px; }
}

/* ============================================================ */
/* Sales Agents — личный кабинет партнёра                         */
/* ============================================================ */

.sa-hero-personal { padding: 28px 32px; }
.sa-hero-content-personal {
  display: flex; align-items: center; justify-content: space-between;
  gap: 28px; flex-wrap: wrap;
}
.sa-hero-personal-left {
  display: flex; align-items: center; gap: 24px; flex: 1 1 auto; min-width: 0;
}
.sa-hero-personal-id { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sa-hero-name {
  font-size: 32px; font-weight: 600; margin: 0 0 4px;
  color: var(--text); letter-spacing: 0;
  font-family: ui-monospace, "JetBrains Mono", monospace;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 480px;
}
.sa-hero-personal-meta {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--text-soft);
  flex-wrap: wrap;
}
.sa-hero-personal-meta .sa-rate-pill {
  margin-left: 4px;
}

.sa-hero-personal-right {
  display: flex; align-items: center; gap: 18px;
  flex: 0 0 auto;
}
.sa-hero-money {
  display: flex; flex-direction: column; align-items: flex-end; gap: 4px;
  padding: 14px 22px;
  background: rgba(255,255,255,0.04);
  border-radius: 14px;
}
.sa-hero-money span {
  font-size: 11px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.05em;
}
.sa-hero-money strong {
  font-size: 28px; font-weight: 600; color: var(--primary);
  font-family: ui-monospace, monospace; line-height: 1;
}
.sa-request-payout-btn { padding: 12px 22px; font-size: 13px; }

/* KPI foot: вариант с прогресс-баром (для конверсии). */
.sa-kpi-foot-bar { gap: 12px; }
.sa-kpi-foot-bar .sa-conv-wrap { flex: 1; }

/* Чарт + форма привода клиента — две колонки. */
.sa-analytics-personal { grid-template-columns: 2fr 1fr; }
@media (max-width: 1280px) {
  .sa-analytics-personal { grid-template-columns: 1fr; }
}

.sa-bring-lead { padding: 22px 24px; display: flex; flex-direction: column; }
.sa-bring-lead-desc {
  font-size: 12.5px; color: var(--text-soft); margin: 4px 0 14px;
  line-height: 1.5;
}

/* Мои сделки — карточки с прогресс-баром этапа. */
.sa-personal-deals { padding: 22px 24px; }
.sa-personal-deals-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px; margin-top: 6px;
}
.sa-personal-deal {
  background: var(--layer-2); border-radius: 14px;
  padding: 16px 18px;
  display: flex; flex-direction: column; gap: 10px;
  cursor: pointer;
  transition: transform 180ms ease, background 180ms ease;
}
.sa-personal-deal:hover {
  transform: translateY(-2px);
  background: rgba(204,125,94,0.06);
}
.sa-personal-deal-head strong {
  font-size: 13.5px; line-height: 1.4; color: var(--text);
  display: block;
}
.sa-personal-deal-amount {
  font-size: 22px; font-weight: 600; color: var(--text);
  font-family: ui-monospace, monospace; line-height: 1;
}
.sa-personal-deal-commission {
  font-size: 12px; color: var(--text-soft);
}
.sa-personal-deal-commission b {
  color: var(--primary);
  font-family: ui-monospace, monospace;
  font-weight: 600;
}
.sa-personal-deal-progress { display: flex; flex-direction: column; gap: 6px; margin-top: 2px; }
.sa-personal-deal-progress-info {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 11.5px; color: var(--text-faint);
}
.sa-personal-deal-progress-info span:last-child {
  color: var(--text); font-weight: 600;
  font-family: ui-monospace, monospace;
}
.sa-personal-deal-bar {
  height: 5px; background: rgba(255,255,255,0.06);
  border-radius: 3px; overflow: hidden;
}
.sa-personal-deal-bar-fill {
  height: 100%; background: var(--primary);
  border-radius: 3px;
  transition: width 400ms ease;
}
.sa-personal-deal-foot {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.05);
}
.sa-personal-deal-foot span {
  font-size: 11px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.04em;
}
.sa-personal-deal-foot strong {
  font-size: 13px; color: var(--text);
  font-family: ui-monospace, monospace;
}

/* Выплаты — timeline-вид. */
.sa-personal-payouts { padding: 22px 24px; }
.sa-payout-timeline {
  list-style: none; padding: 0; margin: 8px 0 0;
  display: flex; flex-direction: column; gap: 0;
}
.sa-payout-timeline-item {
  position: relative;
  padding: 14px 0 14px 28px;
  border-left: 2px solid rgba(255,255,255,0.06);
  margin-left: 10px;
}
.sa-payout-timeline-item:last-child {
  border-left-color: transparent;
}
.sa-payout-timeline-dot {
  position: absolute; left: -7px; top: 18px;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--primary);
  box-shadow: 0 0 0 4px rgba(204,125,94,0.18);
}
.sa-payout-timeline-content {
  background: var(--layer-2);
  border-radius: 12px;
  padding: 12px 16px;
  display: flex; flex-direction: column; gap: 6px;
}
.sa-payout-timeline-head {
  display: flex; justify-content: space-between; align-items: center;
}
.sa-payout-timeline-head strong {
  font-size: 18px; color: var(--text);
  font-family: ui-monospace, monospace;
}
.sa-payout-timeline-meta {
  font-size: 11.5px; color: var(--text-faint);
}
.sa-payout-timeline-deals {
  font-size: 12.5px; color: var(--text-soft);
}

.sa-activity-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sa-activity-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  background: rgba(255,255,255,0.03);
}
.sa-activity-row strong {
  display: block;
  color: var(--text);
  font-size: 13px;
  margin-bottom: 4px;
}
.sa-activity-row span {
  display: block;
  color: var(--text-soft);
  font-size: 12.5px;
}
.sa-activity-row time {
  color: var(--text-faint);
  font-size: 11.5px;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .sa-hero-content-personal { flex-direction: column; align-items: stretch; }
  .sa-hero-personal-right { justify-content: space-between; }
  .sa-hero-name { font-size: 24px; max-width: 100%; white-space: normal; }
}

/* ============================================================ */
/* CRM v2 — полноценный набор инструментов                       */
/* ============================================================ */

/* Тулбар + бэйдж задач */
.crm-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  gap: 16px; flex-wrap: wrap; margin-bottom: 16px;
}
.crm-toolbar-tabs {
  display: inline-flex; gap: 4px; background: var(--layer-2);
  border-radius: 10px; padding: 4px;
}
.crm-toolbar-actions { display: flex; gap: 8px; }
.crm-new-deal-btn { padding: 9px 18px; font-size: 13px; }
.crm-tab-badge {
  display: inline-block; margin-left: 8px;
  padding: 1px 7px; border-radius: 8px;
  background: rgba(255,255,255,0.1);
  font-size: 11px; font-weight: 600;
  color: var(--text);
}
.crm-tab-badge.is-overdue { background: rgba(220,80,60,0.32); color: #ffd2c4; }

.crm-toast { margin: 8px 0 16px; display: inline-block; }

/* Тэги на мини-карточках канбана */
.crm-deal-tags { display: flex; gap: 4px; flex-wrap: wrap; margin: -2px 0 2px; }
.crm-tag-pill {
  display: inline-flex; align-items: center; gap: 4px;
  background: rgba(204,125,94,0.18); color: #e9a17e;
  padding: 2px 8px; border-radius: 6px;
  font-size: 10.5px; font-weight: 500;
}
.crm-tag-x {
  background: transparent; border: 0; color: inherit; opacity: 0.6;
  font-size: 14px; line-height: 1; cursor: pointer; padding: 0; margin-left: 2px;
}
.crm-tag-x:hover { opacity: 1; }
.crm-tag-add {
  background: transparent; border: 1px dashed rgba(255,255,255,0.15);
  color: var(--text-faint); font-size: 11px; padding: 3px 10px;
  border-radius: 6px; cursor: pointer; font-family: inherit;
}
.crm-tag-add:hover { color: var(--text); border-color: rgba(204,125,94,0.5); }

.crm-deal-foot-left { display: inline-flex; gap: 8px; align-items: center; }
.crm-deal-tasks {
  font-size: 10.5px; color: var(--text-faint);
  background: rgba(255,255,255,0.05); padding: 1px 6px; border-radius: 4px;
}
.crm-deal-tasks.is-overdue { color: #ffb39e; background: rgba(220,80,60,0.18); }

/* Outcome strip — Выиграно/Проиграно под канбаном */
.crm-outcomes { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.crm-outcomes-strip {
  background: var(--layer-2); border-radius: 12px; padding: 12px 14px;
  min-height: 90px;
}
.crm-outcomes-strip.drag-over {
  background: rgba(204,125,94,0.08);
  outline: 2px dashed rgba(204,125,94,0.45);
}
.crm-outcomes-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 8px;
}
.crm-outcomes-label {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--text-faint); font-weight: 600;
}
.crm-outcomes-won .crm-outcomes-label { color: #8ee0ad; }
.crm-outcomes-lost .crm-outcomes-label { color: #ff9b85; }
.crm-outcomes-meta { font-size: 11px; color: var(--text-faint); font-family: ui-monospace, monospace; }
.crm-outcomes-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }

/* «Сегодня» */
.crm-today-head { display: flex; justify-content: space-between; align-items: center; margin: 6px 0 18px; }
.crm-today-head h2 { margin: 0; }
.crm-today-group { margin-bottom: 22px; }
.crm-today-group-title {
  margin: 0 0 10px;
  font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text-faint);
}
.crm-today-overdue .crm-today-group-title { color: #ff9b85; }
.crm-today-today   .crm-today-group-title { color: var(--primary); }
.crm-today-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.crm-today-item {
  display: grid; grid-template-columns: 24px 1fr 32px;
  gap: 12px; align-items: center;
  background: var(--layer-2); border-radius: 10px;
  padding: 10px 14px; cursor: pointer;
  transition: background 150ms, transform 150ms;
}
.crm-today-item:hover { background: rgba(204,125,94,0.06); transform: translateX(2px); }
.crm-today-item.is-done { opacity: 0.55; }
.crm-today-item.is-done .crm-today-title { text-decoration: line-through; }
.crm-today-body { min-width: 0; }
.crm-today-title { font-size: 13.5px; color: var(--text); margin-bottom: 3px; }
.crm-today-meta {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  font-size: 11.5px; color: var(--text-faint);
}
.crm-today-deal { color: var(--text-soft); }
.crm-today-overdue .crm-today-item .crm-today-due { color: #ff9b85; font-weight: 600; }
.crm-task-check input { width: 18px; height: 18px; cursor: pointer; accent-color: var(--primary); }
.crm-today-done-block { margin-top: 24px; }
.crm-today-done-block summary {
  cursor: pointer; padding: 8px 0;
  font-size: 12px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.05em;
}

/* Карточка сделки: правая колонка — задачи */
.crm-tasks-block { margin: 8px 0 16px; display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.crm-tasks-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.crm-task-item {
  display: grid; grid-template-columns: 24px 1fr 24px; gap: 10px; align-items: center;
  background: var(--layer-3); border-radius: 8px; padding: 8px 12px;
}
.crm-task-item.is-done { opacity: 0.55; }
.crm-task-item.is-done .crm-task-title { text-decoration: line-through; }
.crm-task-item.is-overdue { border-left: 3px solid #ff9b85; padding-left: 9px; }
.crm-task-body { min-width: 0; }
.crm-task-title { font-size: 13px; color: var(--text); }
.crm-task-meta { font-size: 11px; color: var(--text-faint); margin-top: 2px; display: flex; gap: 6px; }
.crm-task-x, .crm-file-x {
  background: transparent; border: 0; color: var(--text-faint);
  font-size: 16px; line-height: 1; cursor: pointer; padding: 0;
}
.crm-task-x:hover, .crm-file-x:hover { color: #ff9b85; }
.crm-tasks-divider { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.05em; padding: 8px 0 4px; }

/* Карточка сделки: head с действиями + edit-режим */
.crm-card-head-actions { display: flex; gap: 6px; }
.ghost-button.danger { color: #ff9b85; }
.ghost-button.danger:hover { background: rgba(220,80,60,0.12); }
.ghost-button.accent { color: var(--primary); }
.crm-edit-input {
  width: 100%;
  background: var(--layer-3); color: var(--text);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 8px;
  padding: 9px 12px; font-size: 13px; font-family: inherit;
  margin-bottom: 8px;
}
.crm-edit-title { font-size: 16px; font-weight: 600; }
.crm-edit-amount { font-family: ui-monospace, monospace; font-size: 18px; }

/* Tags row внутри карточки */
.crm-tags-row { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }

/* Файлы */
.crm-files-list { list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-direction: column; gap: 4px; }
.crm-file-item {
  display: grid; grid-template-columns: 44px 1fr auto 24px;
  gap: 10px; align-items: center;
  background: var(--layer-3); border-radius: 8px;
  padding: 6px 10px;
  font-size: 12px;
}
.crm-file-kind {
  font-size: 10px; font-weight: 600; text-align: center;
  padding: 3px 6px; border-radius: 5px;
  background: rgba(255,255,255,0.05); color: var(--text-soft);
  font-family: ui-monospace, monospace;
}
.crm-file-kind-pdf { background: rgba(204,125,94,0.18); color: #e9a17e; }
.crm-file-kind-img { background: rgba(94,172,214,0.18); color: #9cd0e8; }
.crm-file-name {
  appearance: none;
  background: none;
  border: 0;
  color: var(--text);
  cursor: pointer;
  font: inherit;
  padding: 0;
  text-align: left;
}
button.crm-file-name:hover { color: var(--primary); }
.crm-file-size { font-size: 11px; color: var(--text-faint); font-family: ui-monospace, monospace; }
.crm-add-file-btn { padding: 6px 12px; font-size: 11.5px; }

/* Модалки */
.crm-modal {
  position: fixed; z-index: 1200;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(620px, 92vw); max-height: 90vh; overflow-y: auto;
  background: var(--layer-1); border-radius: 16px;
  padding: 24px 28px;
  scrollbar-width: none;
  animation: crm-modal-in 200ms ease-out;
}
.crm-modal::-webkit-scrollbar { display: none; }
.crm-modal.crm-modal-narrow { width: min(460px, 92vw); }
@keyframes crm-modal-in {
  from { opacity: 0; transform: translate(-50%, -46%); }
  to { opacity: 1; transform: translate(-50%, -50%); }
}
.crm-modal-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 18px;
}
.crm-modal-head h3 { margin: 0; font-size: 17px; }
.crm-modal-form {
  display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
}
.crm-modal-form label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; color: var(--text-faint); min-width: 0; }
.crm-modal-form label.full-row { grid-column: 1 / -1; }
.crm-modal-form input, .crm-modal-form select, .crm-modal-form textarea {
  width: 100%; min-width: 0; box-sizing: border-box;
  background: var(--layer-3); color: var(--text);
  border: 1px solid rgba(255,255,255,0.08); border-radius: 8px;
  padding: 9px 12px; font-size: 13px; font-family: inherit;
}
.crm-modal-actions {
  grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px;
}
.crm-modal-hint { font-size: 11px; color: var(--text-faint); margin: 4px 0 0; }

.crm-tag-palette { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.crm-tag-option {
  background: rgba(255,255,255,0.04); color: var(--text-soft);
  border: 0; padding: 6px 12px; border-radius: 8px;
  font-size: 12px; cursor: pointer; font-family: inherit;
}
.crm-tag-option:hover { background: rgba(204,125,94,0.18); color: var(--text); }

/* Аналитика */
.crm-analytics-kpi { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 12px; }
@media (max-width: 1100px) { .crm-analytics-kpi { grid-template-columns: repeat(2, 1fr); } }
.crm-funnel-card { padding: 22px 24px; }
.crm-funnel-bars { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.crm-funnel-row {
  display: grid; grid-template-columns: 200px 1fr 160px;
  gap: 14px; align-items: center;
}
.crm-funnel-label { font-size: 12.5px; color: var(--text-soft); }
.crm-funnel-bar-track { height: 22px; background: rgba(255,255,255,0.04); border-radius: 6px; overflow: hidden; }
.crm-funnel-bar-fill {
  height: 100%; background: var(--primary);
  border-radius: 6px; transition: width 400ms ease;
}
.crm-funnel-bar-won { background: #6fcf97; }
.crm-funnel-bar-lost { background: #d6685a; }
.crm-funnel-num { font-size: 12px; color: var(--text-faint); font-family: ui-monospace, monospace; text-align: right; }
.crm-funnel-row-won { padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.06); margin-top: 4px; }
.crm-funnel-row-lost { opacity: 0.8; }
@media (max-width: 900px) {
  .crm-funnel-row { grid-template-columns: 120px 1fr 110px; }
}

.crm-leaderboard-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-top: 4px; }
.crm-leaderboard-table th, .crm-leaderboard-table td { padding: 12px 14px; text-align: left; }
.crm-leaderboard-table thead th { font-size: 11px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
.crm-leaderboard-table th.num, .crm-leaderboard-table td.num { text-align: right; font-family: ui-monospace, monospace; }
.crm-leaderboard-table tbody tr:nth-child(odd) { background: rgba(255,255,255,0.018); }
.crm-leader-cell { display: flex; align-items: center; gap: 10px; }

/* ============================================================ */
/* CRM v3 — Лиды / Сделки / Закрытые                              */
/* ============================================================ */

/* Переключатель Лиды ↔ Сделки */
.crm-funnel-switch {
  display: inline-flex; gap: 4px;
  background: var(--layer-2); border-radius: 10px; padding: 4px;
  margin: 4px 0 14px;
}
.crm-funnel-btn {
  background: transparent; border: 0; color: var(--text-soft);
  padding: 9px 18px; border-radius: 8px;
  font-size: 13px; cursor: pointer; font-family: inherit;
  display: inline-flex; align-items: center; gap: 8px;
}
.crm-funnel-btn:hover { color: var(--text); }
.crm-funnel-btn.active { background: rgba(204,125,94,0.22); color: var(--text); }
.crm-funnel-count {
  background: rgba(255,255,255,0.08); border-radius: 6px;
  padding: 1px 7px; font-size: 11px; font-weight: 600;
}
.crm-funnel-btn.active .crm-funnel-count { background: rgba(255,255,255,0.18); }

/* Большой канбан */
.crm-kanban-lg {
  grid-template-columns: repeat(var(--crm-cols, 4), minmax(380px, 1fr));
  gap: 16px;
}
/* В колонках лидов их 2 — пусть растягиваются шире */
.crm-funnel-switch + .crm-kanban-lg { /* fallback if css var not used */ }

.crm-kanban-lg .crm-column { min-height: 460px; padding: 14px; }
.crm-kanban-lg .crm-column-head {
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.crm-kanban-lg .crm-column-title { font-size: 14px; font-weight: 600; }
.crm-kanban-lg .crm-column-meta  { font-size: 12px; }
.crm-kanban-lg .crm-column-list  { gap: 10px; }

/* Большая карточка сделки */
.crm-deal-card-lg {
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 10px;
  border-radius: 12px;
}
.crm-deal-card-lg .crm-deal-project {
  font-size: 14px; line-height: 1.35; font-weight: 600;
}
.crm-deal-card-lg .crm-deal-tags {
  display: flex; gap: 5px; flex-wrap: wrap;
}
.crm-deal-card-lg .crm-deal-row {
  display: flex; justify-content: space-between; align-items: center;
}
.crm-deal-card-lg .crm-deal-amount {
  font-size: 16px; font-family: ui-monospace, monospace; font-weight: 600;
}

.crm-deal-contact-block, .crm-deal-address {
  display: flex; flex-direction: column; gap: 2px;
  padding: 6px 10px; background: rgba(255,255,255,0.025);
  border-radius: 8px;
}
.crm-deal-contact-label, .crm-deal-address-label {
  font-size: 10px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.05em;
}
.crm-deal-contact-val, .crm-deal-address-val {
  font-size: 12.5px; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.crm-deal-next-task {
  display: flex; align-items: center; gap: 8px;
  background: rgba(204,125,94,0.10);
  border-left: 3px solid var(--primary);
  padding: 7px 10px; border-radius: 6px;
  font-size: 11.5px;
}
.crm-deal-next-task.is-overdue {
  background: rgba(220,80,60,0.12);
  border-left-color: #ff9b85;
}
.crm-deal-next-task-kind {
  background: rgba(255,255,255,0.08); color: var(--text);
  padding: 2px 7px; border-radius: 5px;
  font-size: 10px; font-weight: 600; flex-shrink: 0;
}
.crm-deal-next-task-title {
  color: var(--text); flex: 1; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.crm-deal-next-task-due {
  color: var(--text-faint); font-family: ui-monospace, monospace;
  font-size: 11px; flex-shrink: 0;
}

.crm-deal-card-lg .crm-deal-foot {
  padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.05);
}
.crm-deal-card-lg .crm-deal-foot-left {
  font-size: 11px; color: var(--text-faint);
  display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.crm-deal-files {
  font-size: 10.5px; color: var(--text-faint);
  background: rgba(94,172,214,0.14); color: #9cd0e8;
  padding: 1px 6px; border-radius: 4px;
}

.crm-deal-last-activity {
  font-size: 10.5px; color: var(--text-faint);
  font-style: italic; line-height: 1.4;
  padding-top: 4px;
}

/* Когда лидов только 2 колонки — растяжка свободного места */
.crm-kanban-lg.crm-kanban-2cols {
  grid-template-columns: repeat(2, minmax(360px, 480px));
  justify-content: start;
}

/* ----- Вкладка «Закрытые» ----- */
.crm-closed-summary {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
  margin: 10px 0 18px;
}
.crm-closed-summary-card {
  background: var(--layer-2); border-radius: 14px;
  padding: 18px 22px;
  display: flex; flex-direction: column; gap: 6px;
  position: relative; overflow: hidden;
}
.crm-closed-summary-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
}
.crm-closed-summary-won::before { background: #6fcf97; }
.crm-closed-summary-lost::before { background: #d6685a; }
.crm-closed-summary-card .kpi-value { font-size: 26px; }

.crm-closed-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 1100px) {
  .crm-closed-cols { grid-template-columns: 1fr; }
  .crm-closed-summary { grid-template-columns: 1fr; }
}
.crm-closed-col { padding: 20px 22px; }
.crm-closed-list {
  display: flex; flex-direction: column; gap: 10px;
  margin-top: 4px;
}
.crm-closed-card {
  background: var(--layer-2); border-radius: 12px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 8px;
  cursor: pointer;
  transition: background 150ms, transform 150ms;
  border-left: 3px solid transparent;
}
.crm-closed-card.crm-closed-won { border-left-color: #6fcf97; }
.crm-closed-card.crm-closed-lost { border-left-color: #d6685a; }
.crm-closed-card:hover { background: rgba(204,125,94,0.06); transform: translateX(2px); }
.crm-closed-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.crm-closed-card-head strong { font-size: 13.5px; line-height: 1.4; }
.crm-closed-card-amount {
  font-size: 19px; font-weight: 600;
  font-family: ui-monospace, monospace;
}
.crm-closed-card-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12px; color: var(--text-soft);
}
.crm-closed-card-date { font-size: 11px; color: var(--text-faint); }
.crm-closed-card-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-top: 6px; border-top: 1px solid rgba(255,255,255,0.05); }
.crm-closed-card-tags { display: inline-flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }

/* На узком экране уменьшаем колонки */
@media (max-width: 1100px) {
  .crm-kanban-lg { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
}

/* ============================================================ */
/* Markdown в ответах AI-агентов                                  */
/* ============================================================ */

.ai-msg-md {
  white-space: normal; /* отключаем pre-wrap — у нас теперь HTML-структура */
  line-height: 1.55;
  font-size: 13.5px;
  color: var(--text-soft);
}

.ai-msg-md > *:first-child { margin-top: 0; }
.ai-msg-md > *:last-child  { margin-bottom: 0; }

.ai-msg-md p {
  margin: 0 0 10px;
}
.ai-msg-md p:last-child { margin-bottom: 0; }

.ai-msg-md h3 {
  font-size: 15px; font-weight: 600;
  margin: 14px 0 8px;
  color: var(--text);
}
.ai-msg-md h4 {
  font-size: 14px; font-weight: 600;
  margin: 12px 0 6px;
  color: var(--text);
}
.ai-msg-md h5 {
  font-size: 13px; font-weight: 600;
  margin: 10px 0 5px;
  color: var(--text);
  text-transform: none;
  letter-spacing: 0;
}

.ai-msg-md strong { color: var(--text); font-weight: 600; }
.ai-msg-md em     { font-style: italic; color: var(--text); }

.ai-msg-md a {
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ai-msg-md a:hover { color: var(--primary-strong); }

.ai-msg-md ul, .ai-msg-md ol {
  margin: 4px 0 10px;
  padding-left: 22px;
  display: flex; flex-direction: column; gap: 4px;
}
.ai-msg-md ul { list-style: disc; }
.ai-msg-md ol { list-style: decimal; }
.ai-msg-md li { line-height: 1.5; padding-left: 2px; }
.ai-msg-md li::marker { color: var(--text-faint); }

.ai-msg-md ul ul, .ai-msg-md ol ol, .ai-msg-md ul ol, .ai-msg-md ol ul {
  margin: 4px 0 4px;
}

.ai-msg-md code.ai-md-inline {
  background: rgba(255,255,255,0.06);
  padding: 1px 6px;
  border-radius: 4px;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 12px;
  color: var(--text);
}

.ai-msg-md pre.ai-md-code {
  margin: 8px 0;
  background: rgba(0,0,0,0.25);
  border-radius: 8px;
  padding: 12px 14px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.ai-msg-md pre.ai-md-code code {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 12px;
  color: var(--text);
  white-space: pre;
}

/* user-сообщения остаются с pre-wrap, так как набираются вручную и
   могут содержать переводы строк, которые мы хотим сохранить. */
.ai-msg-user .ai-msg-bubble { white-space: pre-wrap; }

/* ============================================================ */
/* CRM v4 — partner-блок, ABM-delete, agent profile deals       */
/* ============================================================ */

/* Partner-блок в карточке сделки */
.crm-card-partner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px; align-items: center;
  background: var(--layer-3);
  border: 0; padding: 12px 14px; border-radius: 12px;
  cursor: pointer; width: 100%; font-family: inherit; color: inherit;
  text-align: left;
  transition: background 160ms, transform 160ms;
}
.crm-card-partner:hover {
  background: rgba(204,125,94,0.10);
  transform: translateX(2px);
}
.crm-card-partner-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.crm-card-partner-info strong { color: var(--text); font-size: 13.5px; }
.crm-card-partner-info span { color: var(--text-faint); font-size: 11px; }
.crm-card-partner-rate { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.crm-card-partner-rate strong { color: var(--primary); font-size: 18px; font-family: ui-monospace, monospace; }
.crm-card-partner-rate span { color: var(--text-faint); font-size: 10.5px; }

/* ABM-drawer header actions */
.task-detail-header-actions {
  display: flex; gap: 6px; align-items: center;
}

/* Sales-agent profile — Deals grid */
.sa-deals-summary {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: 10px; margin-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.05);
  font-size: 12px; color: var(--text-faint);
}
.sa-deals-summary-sum strong {
  color: var(--primary); font-family: ui-monospace, monospace; font-size: 14px;
}
.sa-deals-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 10px;
}
.sa-deal-card {
  background: var(--layer-3); border-radius: 12px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 10px;
  cursor: pointer; transition: background 150ms, transform 150ms;
}
.sa-deal-card:hover { background: rgba(204,125,94,0.06); transform: translateY(-1px); }
.sa-deal-card.is-won  { border-left: 3px solid #6fcf97; padding-left: 13px; }
.sa-deal-card.is-lost { border-left: 3px solid #d6685a; padding-left: 13px; opacity: 0.75; }
.sa-deal-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.sa-deal-card-head strong { font-size: 13.5px; line-height: 1.4; color: var(--text); }
.sa-deal-stage-pill {
  background: rgba(204,125,94,0.18); color: #e9a17e;
  padding: 2px 8px; border-radius: 6px;
  font-size: 10.5px; font-weight: 500; flex-shrink: 0;
}
.sa-deal-stage-pill.is-won  { background: rgba(111,207,151,0.18); color: #8ee0ad; }
.sa-deal-stage-pill.is-lost { background: rgba(220,80,60,0.18); color: #ff9b85; }
.sa-deal-card-amounts {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}
.sa-deal-card-amounts > div { display: flex; flex-direction: column; gap: 2px; }
.sa-deal-card-amounts span { font-size: 10.5px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
.sa-deal-card-amounts strong { font-size: 14px; color: var(--text); font-family: ui-monospace, monospace; }
.sa-deal-progress { display: flex; gap: 10px; align-items: center; }
.sa-deal-progress-bar {
  flex: 1; height: 5px; background: rgba(255,255,255,0.06);
  border-radius: 3px; overflow: hidden;
}
.sa-deal-progress-fill { height: 100%; background: var(--primary); border-radius: 3px; transition: width 400ms ease; }
.sa-deal-progress span { font-size: 11px; color: var(--text-faint); font-family: ui-monospace, monospace; min-width: 32px; text-align: right; }

/* ============================================================ */
/* Outreach replies panel                                        */
/* ============================================================ */

.outreach-replies-panel {
  border-bottom: 1px solid var(--border);
  padding: 14px 14px 12px;
}
.outreach-replies-panel > .outreach-assignment-issues {
  margin: -14px -14px 12px;
  border-top: 0;
  border-bottom: 1px solid var(--line-soft);
}
.outreach-company-group-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  margin-bottom: 10px;
  padding: 4px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  background: var(--layer-2);
}
.outreach-company-group-tab {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 5px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-faint);
  cursor: pointer;
  font-size: 10px;
  white-space: nowrap;
}
.outreach-company-group-tab strong {
  min-width: 18px;
  padding: 1px 5px;
  border-radius: 99px;
  background: rgba(255,255,255,0.06);
  color: inherit;
  font-size: 10px;
}
.outreach-company-group-tab.active {
  background: rgba(204, 125, 94, 0.18);
  color: var(--text);
}
.outreach-company-group .outreach-lead-list {
  padding: 0;
  gap: 6px;
}
.outreach-company-unread {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 7px;
  border-radius: 99px;
  background: var(--primary);
  color: #fff;
  font-size: 11px;
}
.outreach-company-load-state {
  padding: 14px 0 2px;
  color: var(--text-faint);
  font-size: 11px;
  text-align: center;
}
.outreach-reply-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.outreach-reply-meta,
.outreach-reply-preview {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}
.outreach-reply-meta {
  color: var(--text-faint);
}
.outreach-reply-preview {
  color: var(--text-soft);
}

/* ============================================================ */
/* Approval marker в чате с КП-агентом                            */
/* ============================================================ */

.ai-md-approval {
  margin: 12px 0;
  background: rgba(204,125,94,0.10);
  border-left: 3px solid var(--primary);
  border-radius: 10px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 10px;
}
.ai-md-approval-head {
  display: flex; justify-content: space-between; align-items: baseline;
}
.ai-md-approval-label {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--primary); font-weight: 600;
}
.ai-md-approval-id {
  font-family: ui-monospace, monospace; font-size: 11px;
  background: rgba(255,255,255,0.06); padding: 2px 8px; border-radius: 5px;
  color: var(--text-soft);
}
.ai-md-approval-body { font-size: 13px; line-height: 1.5; color: var(--text); }
.ai-md-approval-actions { display: flex; gap: 8px; }
.ai-md-approval-actions button { padding: 8px 16px; font-size: 12.5px; }

.outreach-company-title { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* ============================================================ */
/* Agent profile drawer v2 — больше воздуха + sidebar-карточки    */
/* ============================================================ */

.sa-drawer { padding-bottom: 28px; }

/* Drawer-скролл: сам контент крутится внутри fixed-панели, фон стоит.
   Без этого body прокручивался под drawer'ом. */
.task-detail-drawer.sa-drawer {
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.18) transparent;
}
.task-detail-drawer.sa-drawer::-webkit-scrollbar { width: 6px; }
.task-detail-drawer.sa-drawer::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.18); border-radius: 3px;
}

/* Без подсветок/полосок — чистая плоская шапка, как просили. */
.sa-drawer-hero.sa-drawer-hero-v2 {
  position: relative;
  padding: 30px 72px 24px 36px; /* справа резерв под close-кнопку */
  background: var(--layer-2);
  border-bottom: 0;
  overflow: visible;
}
.sa-drawer-hero.sa-drawer-hero-v2::before,
.sa-drawer-hero.sa-drawer-hero-v2::after { display: none; content: none; }

.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-hero-identity {
  display: flex; align-items: center; gap: 22px;
}
/* Высокая специфичность чтобы перебить .sa-drawer-hero-info h2 (24px). */
.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-hero-info .sa-drawer-name {
  margin: 0 0 10px;
  font-size: 28px; font-weight: 600; color: var(--text);
  letter-spacing: 0; line-height: 1.15;
}
.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-hero-meta {
  display: flex; align-items: center; gap: 10px;
  flex-wrap: wrap;
  font-size: 12.5px; color: var(--text-faint);
}
.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-type-pill {
  background: rgba(255,255,255,0.06); padding: 5px 12px; border-radius: 8px;
  font-size: 12px; color: var(--text);
}
.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-status {
  display: inline-flex; align-items: center; gap: 4px;
  background: rgba(255,255,255,0.04); padding: 5px 10px; border-radius: 8px;
}
.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-joined { color: var(--text-faint); }
.sa-drawer-hero.sa-drawer-hero-v2 .sa-drawer-close {
  top: 18px; right: 22px;
}

/* Stats row — отдельная плашка под hero, с воздухом */
.sa-drawer-stats {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  padding: 24px 32px 4px;
}
.sa-drawer-stat {
  background: var(--layer-2);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.sa-drawer-stat-label {
  font-size: 10.5px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.05em;
}
.sa-drawer-stat-value {
  font-size: 22px; color: var(--text);
  font-family: ui-monospace, monospace; line-height: 1.1;
}
.sa-drawer-stat-rate .sa-drawer-stat-value { color: var(--primary); }

/* Основной layout */
.sa-profile-layout-v2 {
  display: grid;
  grid-template-columns: minmax(280px, 0.85fr) 1.65fr;
  gap: 20px;
  padding: 22px 32px 8px;
  align-items: start;
}
@media (max-width: 1100px) { .sa-profile-layout-v2 { grid-template-columns: 1fr; } }

.sa-profile-side { display: flex; flex-direction: column; gap: 12px; }

.sa-side-card {
  background: var(--layer-2);
  border-radius: 14px;
  padding: 16px 18px;
}
.sa-side-h {
  margin: 0 0 12px;
  font-size: 10.5px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.07em;
  font-weight: 600;
}
.sa-side-rows { display: flex; flex-direction: column; gap: 8px; }
.sa-side-row {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 12px; padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.sa-side-row:last-child { border-bottom: 0; }
.sa-side-row span { font-size: 12px; color: var(--text-faint); }
.sa-side-row strong { font-size: 13px; color: var(--text); text-align: right; max-width: 60%; word-break: break-word; }

.sa-rate-row-v2 {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
}
.sa-rate-row-v2 button { padding: 6px 12px; font-size: 11.5px; }

.sa-side-conv-meta {
  margin-top: 10px; font-size: 11px; color: var(--text-faint);
}

.sa-profile-tabs .sa-tab-bar { margin-bottom: 14px; }
.sa-profile-tabs .sa-tab-body { background: var(--layer-2); border-radius: 14px; padding: 18px 20px; }

/* Адаптив stats при узком экране */
@media (max-width: 1100px) {
  .sa-drawer-stats { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .sa-drawer-stats { grid-template-columns: repeat(2, 1fr); }
  .sa-drawer-hero-identity { flex-direction: column; align-items: flex-start; gap: 14px; }
  .sa-drawer-name { font-size: 22px; }
}

/* ============================================================ */
/* Agent profile v3 — вертикальная разводка, сделки внизу         */
/* ============================================================ */

/* 4 информационные карточки в одной строке. На узких экранах — 2 колонки. */
.sa-info-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding: 0 32px 8px;
  align-items: stretch;
}
.sa-info-row .sa-side-card { height: 100%; }

@media (max-width: 1100px) {
  .sa-info-row { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .sa-info-row { grid-template-columns: 1fr; }
}

/* Tab-секция занимает всю ширину, сделки/остальное под инфо-строкой. */
.sa-profile-tabs-full {
  display: flex; flex-direction: column; gap: 14px;
  padding: 16px 32px 4px;
}
.sa-profile-tabs-full .sa-tab-bar { margin-bottom: 0; }
.sa-profile-tabs-full .sa-tab-body {
  background: var(--layer-2);
  border-radius: 14px;
  padding: 20px 24px;
}

/* ============================================================ */
/* ABM bulk-select                                                */
/* ============================================================ */

.abm-toolbar { display: inline-flex; gap: 10px; align-items: center; }
.abm-toolbar .ghost-button.active {
  background: rgba(204,125,94,0.18);
  color: var(--text);
  border-color: rgba(204,125,94,0.4);
}

.abm-table.is-select-mode tbody tr { cursor: pointer; }
.abm-table.is-select-mode tbody tr:hover { background: rgba(204,125,94,0.06); }
.abm-table.is-select-mode tr.is-selected { background: rgba(204,125,94,0.12); }
.abm-table .col-check { width: 38px; padding-left: 16px; }
.abm-check {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 4px;
  border: 2px solid rgba(255,255,255,0.18);
  background: transparent; font-size: 12px;
  color: var(--text); line-height: 1;
}
.abm-check.is-on {
  background: var(--primary); border-color: var(--primary); color: #fff;
}

.abm-bulk-bar {
  position: sticky; bottom: 12px; z-index: 30;
  display: flex; justify-content: space-between; align-items: center;
  gap: 14px;
  background: var(--layer-2);
  border-radius: 14px;
  padding: 12px 18px;
  border: 1px solid rgba(204,125,94,0.3);
  box-shadow: 0 8px 32px rgba(0,0,0,0.3);
}
.abm-bulk-info strong { color: var(--primary); font-family: ui-monospace, monospace; }
.abm-bulk-actions { display: flex; gap: 8px; }
.abm-bulk-actions button { padding: 8px 16px; font-size: 13px; }

/* ============================================================ */
/* CRM Deal Card — Bitrix-style                                   */
/* ============================================================ */

.crm-bx-card {
  display: flex; flex-direction: column; gap: 16px;
  margin-top: 12px;
}

.crm-bx-topbar {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
.crm-bx-topbar-actions { display: flex; gap: 8px; }

/* Header: project + amount + owner */
.crm-bx-header {
  background: var(--layer-1);
  border-radius: 14px;
  padding: 20px 24px;
  display: flex; flex-direction: column; gap: 18px;
}
.crm-bx-title-row {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 24px;
  flex-wrap: wrap;
}
.crm-bx-title-block { flex: 1 1 320px; }
.crm-bx-title {
  font-size: 22px; font-weight: 600; margin: 0 0 8px;
  letter-spacing: 0; line-height: 1.3;
}
.crm-bx-subtitle {
  display: flex; align-items: center; gap: 10px;
  font-size: 11.5px; color: var(--text-faint);
}
.crm-bx-id {
  background: rgba(255,255,255,0.05); padding: 2px 8px; border-radius: 5px;
  font-family: ui-monospace, monospace; letter-spacing: 0.03em;
}
.crm-bx-subtitle-sep { color: var(--text-faint); opacity: 0.6; margin: 0 -2px; }
.crm-bx-counterparty { color: var(--text-soft); font-size: 12px; }

/* Заголовок-row с inline-ссылкой «настроить» в карточке блока. */
.crm-bx-block-h-row {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 8px; margin-bottom: 8px;
}
.crm-bx-block-h-row .crm-bx-block-h { margin: 0; }
.crm-bx-block-h-link {
  background: transparent; border: none;
  color: var(--text-faint); font-size: 10.5px;
  text-transform: lowercase; letter-spacing: 0.02em;
  cursor: pointer;
  padding: 0; transition: color 150ms ease;
}
.crm-bx-block-h-link:hover { color: rgba(204, 125, 94, 0.9); text-decoration: underline; }
.crm-bx-amount-block {
  display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
  flex-shrink: 0;
}
.crm-bx-amount {
  font-size: 30px; font-weight: 600; color: var(--text);
  font-family: ui-monospace, monospace; line-height: 1;
}
.crm-bx-owner {
  display: flex; align-items: center; gap: 10px;
}
.crm-bx-owner > div { display: flex; flex-direction: column; gap: 2px; }
.crm-bx-owner span { font-size: 10.5px; color: var(--text-faint); text-transform: uppercase; letter-spacing: 0.04em; }
.crm-bx-owner strong { font-size: 13px; color: var(--text); }
.crm-owner-select {
  width: 180px;
  min-width: 0;
}
.crm-owner-select select {
  width: 100%;
  min-height: 32px;
  height: 32px;
  padding: 6px 30px 6px 10px;
  border-radius: 8px;
  font-size: 13px;
}

/* Stage stepper */
.crm-bx-stepper {
  display: flex; align-items: stretch; gap: 0;
  padding-top: 4px;
  flex-wrap: wrap;
}
.crm-bx-step {
  flex: 1 1 0; min-width: 110px;
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
  background: var(--layer-3);
  border: 0; padding: 12px 14px;
  cursor: pointer;
  color: var(--text-faint);
  position: relative;
  transition: background 160ms, color 160ms;
  font-family: inherit;
}
.crm-bx-step:first-child { border-radius: 8px 0 0 8px; }
.crm-bx-step:last-child  { border-radius: 0 8px 8px 0; }
.crm-bx-step + .crm-bx-step { border-left: 1px solid rgba(0,0,0,0.18); }
.crm-bx-step:hover { background: rgba(204,125,94,0.06); color: var(--text); }
.crm-bx-step.is-past {
  background: rgba(204,125,94,0.16);
  color: var(--text);
}
.crm-bx-step.is-past .crm-bx-step-num,
.crm-bx-step.is-current .crm-bx-step-num {
  background: var(--primary); color: #fff;
}
.crm-bx-step.is-current {
  background: var(--primary);
  color: #fff;
}
.crm-bx-step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 50%;
  background: rgba(255,255,255,0.08);
  font-size: 11px; font-weight: 600;
}
.crm-bx-step-label {
  font-size: 12px; line-height: 1.3;
  text-align: left;
}
.crm-bx-outcome {
  flex: 0 0 auto; padding: 12px 18px;
  border-radius: 8px;
  font-size: 13px; font-weight: 600;
  align-self: stretch; display: flex; align-items: center;
  margin-left: 8px;
}
.crm-bx-outcome-won  { background: rgba(111,207,151,0.18); color: #8ee0ad; }
.crm-bx-outcome-lost { background: rgba(220,80,60,0.18);   color: #ff9b85; }

/* Body — две колонки */
.crm-bx-body {
  display: grid; grid-template-columns: minmax(280px, 0.85fr) 1.7fr;
  gap: 16px;
  align-items: start;
}
@media (max-width: 1100px) { .crm-bx-body { grid-template-columns: 1fr; } }

.crm-bx-side { display: flex; flex-direction: column; gap: 12px; }
.crm-bx-card-block {
  background: var(--layer-1);
  border-radius: 14px;
  padding: 16px 18px;
}
.crm-bx-block-h {
  margin: 0 0 12px;
  font-size: 10.5px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.07em;
  font-weight: 600;
}
.crm-bx-row {
  display: grid; grid-template-columns: 110px 1fr;
  gap: 10px; align-items: baseline;
  padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.crm-bx-row:last-child { border-bottom: 0; }
.crm-bx-row span { font-size: 11.5px; color: var(--text-faint); }
.crm-bx-row strong { font-size: 13px; color: var(--text); word-break: break-word; }

/* Tabs справа */
.crm-bx-tabs {
  display: flex; flex-direction: column;
  background: var(--layer-1);
  border-radius: 14px;
  overflow: hidden;
}
.crm-bx-tab-bar {
  display: flex; gap: 0;
  background: var(--layer-3);
  padding: 6px;
  gap: 4px;
}
.crm-bx-tab {
  flex: 1;
  background: transparent; border: 0;
  color: var(--text-faint); font-family: inherit;
  padding: 9px 14px; border-radius: 8px;
  font-size: 13px; cursor: pointer;
  transition: background 150ms, color 150ms;
}
.crm-bx-tab:hover { color: var(--text); }
.crm-bx-tab.active { background: var(--primary); color: #fff; }
.crm-bx-tab-body { padding: 18px 20px; display: flex; flex-direction: column; gap: 14px; }

@media (max-width: 760px) {
  .crm-bx-stepper { flex-wrap: wrap; }
  .crm-bx-step { min-width: 50%; }
  .crm-bx-amount { font-size: 22px; }
}

/* ============================================================ */
/* REPORTS                                                        */
/* ============================================================ */

.reports-layout {
  display: grid; grid-template-columns: 280px 1fr; gap: 16px;
  align-items: start;
}
.reports-side {
  padding: 18px 16px;
  position: sticky; top: 12px;
}
.reports-side-head h2 { margin: 0; font-size: 18px; }
.reports-list {
  list-style: none; padding: 0; margin: 14px 0 0;
  display: flex; flex-direction: column; gap: 4px;
}
.reports-list-item {
  display: flex; flex-direction: column; gap: 4px;
  width: 100%; text-align: left;
  background: transparent; border: 0;
  padding: 10px 12px; border-radius: 10px;
  cursor: pointer; font-family: inherit;
  transition: background 160ms;
}
.reports-list-item:hover { background: rgba(255,255,255,0.04); }
.reports-list-item.active { background: rgba(204,125,94,0.16); }
.reports-list-eyebrow {
  font-size: 10px; text-transform: uppercase; letter-spacing: 0.07em;
  color: var(--text-faint); font-weight: 600;
}
.reports-list-item.active .reports-list-eyebrow { color: var(--primary); }
.reports-list-label {
  font-size: 13px; font-weight: 600; color: var(--text); line-height: 1.3;
}
.reports-list-desc {
  font-size: 11.5px; color: var(--text-faint); line-height: 1.45;
}

.reports-body { padding: 24px 28px; display: flex; flex-direction: column; gap: 20px; }

.reports-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 24px; flex-wrap: wrap;
  padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,0.04);
}
.reports-header h2 { margin: 6px 0 4px; font-size: 22px; }
.reports-meta { font-size: 11.5px; color: var(--text-faint); margin: 0; }
.crm-error-text { color: var(--danger); }
.reports-header-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.reports-range {
  display: inline-flex; background: var(--layer-2);
  border-radius: 8px; padding: 3px;
}
.reports-range-btn {
  background: transparent; border: 0;
  color: var(--text-faint); font-family: inherit;
  padding: 6px 12px; border-radius: 6px;
  font-size: 12px; cursor: pointer;
}
.reports-range-btn:hover { color: var(--text); }
.reports-range-btn.active { background: rgba(204,125,94,0.22); color: var(--text); }

.reports-h3 {
  font-size: 13px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.06em;
  margin: 8px 0 0;
}

.reports-kpi-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
}
@media (max-width: 1100px) { .reports-kpi-grid { grid-template-columns: repeat(2, 1fr); } }

@media (max-width: 1100px) {
  .reports-layout { grid-template-columns: 1fr; }
  .reports-side {
    position: static;
    top: auto;
    z-index: auto;
  }
  .reports-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    overflow-x: auto;
    padding-bottom: 4px;
  }
  .reports-list-item {
    height: 100%;
  }
}

@media (max-width: 720px) {
  .reports-side {
    padding: 14px;
  }
  .reports-layout,
  .reports-side,
  .reports-body,
  .reports-header,
  .reports-kpi-grid,
  .reports-list,
  .table-shell {
    min-width: 0;
    max-width: 100%;
  }
  .reports-layout,
  .reports-side,
  .reports-body {
    width: 100%;
  }
  .reports-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 12px;
    overflow-x: visible;
  }
  .reports-list li {
    min-width: 0;
  }
  .reports-list-item {
    min-width: 0;
    height: auto;
    padding: 8px 6px;
    border-radius: 8px;
    align-items: center;
    gap: 0;
  }
  .reports-list-label {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .reports-list-eyebrow {
    display: none;
  }
  .reports-list-desc {
    display: none;
  }
  .reports-body {
    padding: 18px 16px;
  }
  .reports-kpi-grid {
    grid-template-columns: 1fr;
  }
}

.reports-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.reports-table th, .reports-table td { padding: 12px 14px; text-align: left; }
.reports-table thead th {
  font-size: 11px; color: var(--text-faint);
  text-transform: uppercase; letter-spacing: 0.04em;
}
.reports-table th.num, .reports-table td.num { text-align: right; font-family: ui-monospace, monospace; }
.reports-table tbody tr { border-top: 1px solid rgba(255,255,255,0.04); }
.reports-table tbody tr:hover { background: rgba(204,125,94,0.04); }

.reports-bar {
  height: 6px; background: rgba(255,255,255,0.06);
  border-radius: 3px; overflow: hidden;
  min-width: 100px;
}
.reports-bar-fill { height: 100%; background: var(--primary); border-radius: 3px; transition: width 400ms; }

.reports-agent-cell { display: flex; align-items: center; gap: 10px; }
.reports-agent-cell strong { font-size: 13px; }
.reports-agent-sub {
  display: block;
  font-size: 11px; color: var(--text-faint);
  margin-top: 2px;
}

/* Funnel diagram */
.reports-funnel { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.reports-funnel-row {
  display: grid; grid-template-columns: 180px 1fr 160px 110px;
  gap: 12px; align-items: center;
}
.reports-funnel-label { font-size: 12.5px; color: var(--text-soft); }
.reports-funnel-bar { height: 22px; background: rgba(255,255,255,0.04); border-radius: 6px; overflow: hidden; }
.reports-funnel-fill { height: 100%; background: var(--primary); border-radius: 6px; transition: width 400ms; }
.reports-funnel-num { font-size: 12px; color: var(--text-faint); font-family: ui-monospace, monospace; text-align: right; }
.reports-funnel-conv {
  font-size: 11.5px; color: var(--text-faint);
  text-align: right;
}

/* Cohorts */
.reports-cohorts { display: flex; flex-direction: column; gap: 8px; }
.reports-cohort-row {
  display: grid; grid-template-columns: 200px 1fr 120px;
  gap: 14px; align-items: center;
}
.reports-cohort-label { font-size: 13px; color: var(--text); }
.reports-cohort-bar {
  position: relative;
  height: 28px; background: rgba(255,255,255,0.04);
  border-radius: 6px; overflow: hidden;
  display: flex; align-items: center;
}
.reports-cohort-fill {
  height: 100%; background: var(--primary);
  border-radius: 6px; opacity: 0.6;
}
.reports-cohort-bar span {
  position: absolute; right: 10px; top: 50%;
  transform: translateY(-50%);
  font-size: 11px; color: var(--text); font-family: ui-monospace, monospace; font-weight: 600;
}
.reports-cohort-count { font-size: 12px; color: var(--text-faint); text-align: right; }

/* ============================================================ */
/* Flow-up step delay                                            */
/* ============================================================ */

.flowup-delay-row {
  display: grid;
  grid-template-columns: 100px 130px 1fr;
  gap: 10px;
  align-items: center;
}
.flowup-delay-row input,
.flowup-delay-row select {
  background: var(--layer-3);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 13px;
  font-family: inherit;
}
.flowup-delay-hint {
  font-size: 11px; color: var(--text-faint); line-height: 1.4;
}

.flowup-step-delay {
  font-size: 11.5px; color: var(--primary);
  background: rgba(204,125,94,0.14);
  padding: 3px 10px; border-radius: 6px;
  margin-left: 10px;
  font-family: ui-monospace, monospace;
}

@media (max-width: 720px) {
  .flowup-delay-row { grid-template-columns: 1fr 1fr; }
  .flowup-delay-hint { grid-column: 1 / -1; }
}

.flowup-time-row {
  grid-template-columns: 130px 1fr;
}
.flowup-time-row input[type="time"] {
  background: var(--layer-3);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 13px;
  font-family: inherit;
  color-scheme: dark;
}

/* ============================================================ */
/* KP pending approval banner в чате КП-агента                    */
/* ============================================================ */

.kp-pending-block {
  background: rgba(204,125,94,0.08);
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 14px;
  display: flex; flex-direction: column; gap: 10px;
}
.kp-pending-head {
  display: flex; justify-content: space-between; align-items: flex-start;
}
.kp-pending-eyebrow {
  font-size: 10.5px; color: var(--primary);
  text-transform: uppercase; letter-spacing: 0.06em;
  font-weight: 600;
}
.kp-pending-head h4 { margin: 4px 0 0; font-size: 14px; }

.kp-pending-list { display: flex; flex-direction: column; gap: 8px; }
.kp-pending-card {
  background: var(--layer-2);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex; flex-direction: column; gap: 8px;
}
.kp-pending-card-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.kp-pending-card-head strong { font-size: 13.5px; color: var(--text); }
.kp-pending-id {
  font-family: ui-monospace, monospace; font-size: 11px;
  background: rgba(255,255,255,0.06); padding: 2px 7px; border-radius: 5px;
  color: var(--text-faint);
}
.kp-pending-card-summary { font-size: 12.5px; color: var(--text-soft); line-height: 1.45; }
.kp-pending-card-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.kp-pending-card-actions a, .kp-pending-card-actions button { padding: 6px 12px; font-size: 12px; }
.kp-pending-card-actions .ghost-button.is-disabled { opacity: 0.5; cursor: not-allowed; }

/* ============================================================ */
/* KP approval — рендерится как чат-сообщение                     */
/* ============================================================ */

.ai-msg-kp { max-width: 92%; }
.ai-msg-kp-bubble {
  padding: 14px 16px;
  background: rgba(204,125,94,0.10);
  border-left: 3px solid var(--primary);
}
.ai-msg-kp-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.ai-msg-kp-eyebrow {
  font-size: 10.5px; color: var(--primary);
  text-transform: uppercase; letter-spacing: 0.06em;
  font-weight: 600;
}
.ai-msg-kp-id {
  font-family: ui-monospace, monospace; font-size: 10.5px;
  background: rgba(255,255,255,0.06); padding: 2px 8px; border-radius: 5px;
  color: var(--text-faint);
  max-width: 60%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ai-msg-kp-title { font-size: 14.5px; color: var(--text); display: block; }
.ai-msg-kp-sub { font-size: 12.5px; color: var(--text-soft); margin: 4px 0 10px; line-height: 1.45; }
.ai-msg-kp-revised {
  font-size: 12px; color: #e9c97e;
  background: rgba(214,179,94,0.12);
  padding: 6px 10px; border-radius: 6px;
  margin: 6px 0 10px;
}
.ai-msg-kp-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.ai-msg-kp-actions a, .ai-msg-kp-actions button { padding: 7px 14px; font-size: 12.5px; }
.ai-msg-kp-actions .ghost-button.is-disabled { opacity: 0.5; cursor: not-allowed; }

/* Hint на странице «КП» когда есть pending */
.proposal-pending-hint {
  margin-top: 14px; padding: 10px 14px;
  background: rgba(204,125,94,0.08);
  border-radius: 8px;
  font-size: 12.5px; color: var(--text-soft);
  line-height: 1.45;
}

/* ===== Multi-chat list (один Upsell-агент, много чатов) ===== */
.ai-chats-list {
  display: flex; flex-direction: column; gap: 8px;
  margin-top: 12px;
  max-height: calc(100vh - 220px); overflow-y: auto;
}
.ai-chat-list-item {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px;
  background: var(--layer-2); border: 1px solid transparent;
  border-radius: 8px;
  text-align: left; cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.ai-chat-list-item:hover { border-color: rgba(204,125,94,0.4); }
.ai-chat-list-item.active {
  border-color: var(--accent); background: rgba(204,125,94,0.08);
}
.ai-chat-list-title {
  font-size: 13.5px; font-weight: 600; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ai-chat-list-preview {
  font-size: 12px; color: var(--text-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  line-height: 1.3;
}
.ai-chat-list-meta {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 11.5px; color: var(--text-soft);
}
.ai-chat-list-delete {
  background: transparent; border: none; cursor: pointer;
  color: var(--text-soft); font-size: 18px; line-height: 1;
  width: 22px; height: 22px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 4px;
}
.ai-chat-list-delete:hover { background: rgba(255,80,80,0.15); color: #ff8080; }

/* pinned (system) chats и separator между ними и пользовательскими */
.ai-chat-list-item.pinned {
  border-color: rgba(204,125,94,0.35);
  background: linear-gradient(180deg, rgba(204,125,94,0.06), var(--layer-2));
}
.ai-chat-pin { font-size: 11px; opacity: 0.85; margin-right: 2px; }
.ai-chats-sep {
  margin: 14px 4px 6px;
  font-size: 11px; letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-soft);
}

/* ===== Floating Action Button — мини-чат с Upsell-агентом ===== */
.fab-agent {
  position: fixed;
  right: 24px; bottom: 24px;
  z-index: 9999;
  font-family: inherit;
}
.fab-agent.fab-collapsed {
  width: 56px; height: 56px;
  border-radius: 28px;
  border: 1px solid var(--accent);
  background: var(--layer-2);
  color: var(--accent);
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35);
  transition: transform 0.15s, background 0.15s, box-shadow 0.15s;
}
.fab-agent.fab-collapsed:hover {
  transform: translateY(-2px);
  background: var(--layer-1);
  box-shadow: 0 6px 18px rgba(0,0,0,0.45);
}
.fab-agent-icon { font-size: 22px; line-height: 1; }

.fab-agent.fab-expanded {
  width: 380px;
  height: 520px;
  max-height: calc(100vh - 48px);
  background: var(--layer-1);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.45);
  display: flex; flex-direction: column;
  overflow: hidden;
}
.fab-agent-head {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px;
  background: var(--layer-2);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.fab-agent-head-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fab-agent-head-text strong { font-size: 14px; color: var(--text); }
.fab-agent-subtitle {
  font-size: 11.5px; color: var(--text-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  max-width: 240px;
}
.fab-agent-head-actions { display: flex; gap: 4px; }
.fab-agent-newchat, .fab-agent-close {
  width: 28px; height: 28px;
  border: none; background: transparent;
  color: var(--text-soft);
  border-radius: 6px;
  cursor: pointer;
  font-size: 16px; line-height: 1;
}
.fab-agent-newchat:hover, .fab-agent-close:hover {
  background: rgba(255,255,255,0.06); color: var(--text);
}
.fab-agent-messages {
  flex: 1; overflow-y: auto;
  padding: 12px;
  display: flex; flex-direction: column; gap: 8px;
  background: var(--bg);
}
.fab-agent-input-row {
  display: flex; gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(255,255,255,0.06);
  background: var(--layer-2);
}
.fab-agent-input {
  flex: 1;
  background: var(--layer-3);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit; font-size: 13px;
  resize: none;
  min-height: 36px; max-height: 200px;
  overflow-y: auto;
  line-height: 1.4;
}
.fab-agent-input:focus { outline: none; border-color: var(--accent); }
.fab-agent-send {
  width: 36px; height: 36px;
  padding: 0;
  border-radius: 8px;
  font-size: 16px;
}

/* ===== Plan block (multi-step execution checklist) ===== */
.plan-block {
  margin-top: 10px;
  padding: 12px 14px;
  background: var(--layer-3);
  border: 1px solid rgba(255,255,255,0.08);
  border-left: 3px solid var(--accent);
  border-radius: 8px;
}
.plan-status-done   { border-left-color: #6ec27a; }
.plan-status-failed { border-left-color: #d36a6a; }

.plan-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px;
  font-size: 11.5px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--text-soft);
}
.plan-label { font-weight: 600; }
.plan-status-running .plan-status { color: var(--accent); }
.plan-status-done .plan-status   { color: #6ec27a; }
.plan-status-failed .plan-status { color: #d36a6a; }

.plan-steps {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.plan-step {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 13.5px;
}
.plan-step-icon {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; line-height: 1;
  border: 1px solid rgba(255,255,255,0.18);
  background: var(--layer-2);
  color: var(--text-soft);
}
.plan-icon-pending { color: var(--text-soft); }
.plan-icon-running {
  border-color: var(--accent); color: var(--accent);
  animation: plan-pulse 1.4s ease-in-out infinite;
}
.plan-icon-done {
  background: var(--accent); border-color: var(--accent); color: white;
  font-weight: 700;
}
.plan-icon-failed {
  background: #d36a6a; border-color: #d36a6a; color: white;
}
@keyframes plan-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(204,125,94,0.55); }
  50%      { box-shadow: 0 0 0 6px rgba(204,125,94,0); }
}

.plan-step-body { flex: 1; min-width: 0; }
.plan-step-title { color: var(--text); line-height: 1.35; }
.plan-step-title.plan-done {
  text-decoration: line-through;
  color: var(--text-soft);
}
.plan-step-result {
  margin-top: 4px;
  font-size: 12px; color: var(--text-soft);
  line-height: 1.4;
  padding-left: 0;
  border-left: 2px solid rgba(255,255,255,0.06);
  padding-left: 8px;
}

/* ===== Proposal edit chat (внутри карточки КП в разделе "Коммерческие предложения") ===== */
.proposal-edit-chat {
  margin-top: 14px;
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: 14px;
  display: flex; flex-direction: column;
  gap: 10px;
}
.proposal-edit-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 10px;
  flex-wrap: wrap;
}
.proposal-edit-head > div {
  display: grid;
  gap: 3px;
  min-width: 220px;
  flex: 1;
}
.proposal-edit-head .primary-button {
  min-height: 34px;
  white-space: nowrap;
}
.proposal-edit-head .eyebrow {
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--text-soft);
}
.proposal-edit-hint {
  font-size: 11.5px; color: var(--text-soft);
}
.proposal-edit-messages {
  display: flex; flex-direction: column; gap: 8px;
  background: var(--bg);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 8px;
  padding: 10px 12px;
  max-height: 280px;
  overflow-y: auto;
  font-size: 13px;
}
.proposal-edit-input-row {
  display: flex; gap: 8px; align-items: stretch;
}
.proposal-edit-input {
  flex: 1;
  background: var(--layer-3);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit; font-size: 13px;
  resize: none;
  min-height: 38px; max-height: 120px;
}
.proposal-edit-input:focus { outline: none; border-color: var(--accent); }
.proposal-edit-send {
  width: 38px; height: auto; min-height: 38px;
  padding: 0;
  border-radius: 8px;
  font-size: 16px;
}

/* ===== Pending KP block in Proposals section ===== */
.proposal-pending-card {
  grid-area: pending;
  border-left: 3px solid var(--accent);
}
.proposal-pending-list {
  display: flex; flex-direction: column; gap: 8px;
}
.proposal-pending-row {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--layer-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
}
.proposal-pending-meta {
  display: flex; flex-direction: column; gap: 2px;
  min-width: 0; flex: 1;
}
.proposal-pending-meta strong {
  font-size: 13.5px; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.proposal-pending-meta span {
  font-size: 12px; color: var(--text-soft);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.proposal-pending-revised {
  color: var(--accent) !important;
}
.proposal-pending-actions {
  display: flex; gap: 6px; flex-shrink: 0;
}

/* ===== CRM stages config (Настройки → Этапы воронки) ===== */
.crm-stages-section { display: flex; flex-direction: column; gap: 14px; }
.crm-stages-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 900px) {
  .crm-stages-grid { grid-template-columns: 1fr; }
}
.crm-stages-col {
  background: var(--layer-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 12px;
}
.crm-stages-col-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 10px;
}
.crm-stages-col-head strong { font-size: 13.5px; color: var(--text); }
.crm-stages-rows { display: flex; flex-direction: column; gap: 6px; }
.crm-stages-empty {
  color: var(--text-soft); font-size: 12.5px;
  padding: 10px; text-align: center;
}
.crm-stage-row {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  background: var(--layer-3);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 8px;
  padding: 6px 8px;
}
.crm-stage-cell { flex: 1; display: flex; gap: 8px; align-items: center; min-width: 0; }
.crm-stage-cell-wide { flex: 1 1 260px; }
.crm-stage-ai-instruction {
  flex: 1 1 100%;
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
}
.crm-stage-meta-label {
  color: var(--text-soft);
  font-size: 11px;
  white-space: nowrap;
}
.crm-stage-row .crm-filter-field {
  display: flex;
  min-width: 180px;
  width: 100%;
}
.crm-stage-row .crm-filter-field select {
  width: 100%;
  height: 34px;
}
.crm-stage-no {
  font-size: 11px; color: var(--text-soft);
  width: 20px; flex-shrink: 0; text-align: right;
}
.crm-stage-input {
  flex: 1;
  min-width: 0;
  background: transparent;
  border: none;
  color: var(--text);
  font: inherit; font-size: 13px;
  padding: 6px 4px;
  outline: none;
}
.crm-stage-input:focus { background: rgba(255,255,255,0.04); border-radius: 4px; }
.crm-stage-del {
  background: transparent; border: none;
  width: 24px; height: 24px; border-radius: 4px;
  color: var(--text-soft); font-size: 16px; line-height: 1;
  cursor: pointer;
}
.crm-stage-del:hover { background: rgba(255,80,80,0.18); color: #ff8080; }

.crm-stages-system {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  padding-top: 6px; border-top: 1px solid rgba(255,255,255,0.05);
}
.crm-stages-system .eyebrow {
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--text-soft);
}
.crm-stage-pill {
  background: var(--layer-3);
  padding: 4px 10px; border-radius: 12px;
  font-size: 12px; color: var(--text-soft);
}
.crm-stages-actions {
  display: flex; justify-content: flex-end;
}

/* Карточка сделки: Адрес растягивается на 2 колонки */
.crm-tech-grid-span2 { grid-column: 1 / -1; }

/* Ответственный менеджер — компактный pill с аватаром */
.crm-card-manager {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px;
  background: var(--layer-2);
  border-radius: 8px;
}
.crm-card-manager-ava {
  width: 40px; height: 40px; flex-shrink: 0;
  border-radius: 50%;
  background: var(--accent);
  color: white;
  display: flex; align-items: center; justify-content: center;
  font-weight: 600; font-size: 14px;
  letter-spacing: 0.04em;
}
.crm-card-manager-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.crm-card-manager-info strong { font-size: 13.5px; color: var(--text); }
.crm-card-manager-info span { font-size: 12px; color: var(--text-soft); }

/* Параметры карточки — друг под другом (а не 2 в ряд) */
.crm-params-list { display: flex; flex-direction: column; gap: 8px; }
.crm-params-row {
  display: grid;
  grid-template-columns: minmax(140px, 38%) 1fr;
  align-items: center;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
}
.crm-params-row:last-child { border-bottom: none; }
.crm-params-row span { font-size: 12px; color: var(--text-soft); }
.crm-params-row strong { font-size: 13px; color: var(--text); }
.crm-params-row .crm-edit-input { width: 100%; }

/* ===== Прикрепление файлов / КП в карточке сделки ===== */
.crm-file-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.crm-kp-picker {
  margin-top: 10px;
  padding: 10px;
  background: var(--layer-2);
  border: 1px solid rgba(204,125,94,0.3);
  border-radius: 8px;
  display: flex; flex-direction: column; gap: 6px;
}
.crm-kp-picker-head {
  font-size: 12px; color: var(--text-soft);
  text-transform: uppercase; letter-spacing: 0.05em;
  margin-bottom: 4px;
}
.crm-kp-picker-item {
  text-align: left;
  background: var(--layer-3);
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 8px 10px;
  cursor: pointer;
  display: flex; flex-direction: column; gap: 2px;
}
.crm-kp-picker-item:hover { border-color: var(--accent); }
.crm-kp-picker-item strong { font-size: 13px; color: var(--text); }
.crm-kp-picker-item span { font-size: 11.5px; color: var(--text-soft); }
.crm-kp-picker-cancel { align-self: flex-start; margin-top: 4px; }

/* ===== Outreach-вкладка в карточке сделки ===== */
.crm-outreach-tab { display: flex; flex-direction: column; gap: 10px; }
.crm-outreach-link-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  background: var(--layer-2);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 8px;
}
.crm-outreach-link-card h3 {
  margin: 0 0 6px;
  font-size: 15px;
  color: var(--text);
}
.crm-outreach-link-card p {
  margin: 0;
  max-width: 620px;
  color: var(--text-soft);
  font-size: 13px;
  line-height: 1.45;
}
.crm-outreach-link-card small {
  display: block;
  margin-top: 8px;
  color: var(--text-faint);
  font-size: 11.5px;
}
.crm-outreach-channels { display: flex; gap: 6px; flex-wrap: wrap; }
.crm-outreach-channel {
  padding: 6px 14px;
  background: var(--layer-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 999px;
  font-size: 12.5px;
  color: var(--text-soft);
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
}
.crm-outreach-channel:hover { border-color: rgba(204,125,94,0.45); }
.crm-outreach-channel.active {
  background: rgba(204,125,94,0.12);
  border-color: var(--accent);
  color: var(--text);
}
.crm-outreach-channel.is-unconfigured { opacity: 0.7; }
.crm-outreach-warn { color: #d36a6a; font-size: 14px; line-height: 0.8; }

.crm-outreach-history {
  background: var(--bg);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 8px;
  padding: 12px;
  max-height: 320px;
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 8px;
}
.crm-outreach-msg {
  display: flex; flex-direction: column;
  max-width: 80%;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.4;
}
.crm-outreach-msg-out {
  align-self: flex-end;
  background: rgba(204,125,94,0.18);
  border: 1px solid rgba(204,125,94,0.3);
}
.crm-outreach-msg-in {
  align-self: flex-start;
  background: var(--layer-2);
  border: 1px solid rgba(255,255,255,0.06);
}
.crm-outreach-msg-meta {
  font-size: 11px; color: var(--text-soft);
  margin-bottom: 2px;
}
.crm-outreach-msg-text { color: var(--text); white-space: pre-wrap; }
.crm-outreach-msg-html {
  width: 100%;
  min-width: min(480px, 70vw);
  height: 180px;
  margin-top: 4px;
  border: 0;
  border-radius: 6px;
  background: #fff;
}
.crm-outreach-msg-attach {
  margin-top: 6px;
  font-size: 12px;
  color: var(--text-soft);
  padding: 4px 8px;
  background: rgba(0,0,0,0.2);
  border-radius: 4px;
}

.crm-outreach-composer { display: flex; flex-direction: column; gap: 8px; }
.crm-outreach-attach-pill {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--layer-2);
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  color: var(--text-soft);
  align-self: flex-start;
}
.crm-outreach-attach-pill button {
  background: transparent; border: none; color: var(--text-soft); cursor: pointer;
  font-size: 14px; padding: 0 2px;
}
.crm-outreach-input {
  background: var(--layer-3);
  color: var(--text);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 10px 12px;
  font: inherit; font-size: 13px;
  resize: vertical;
  min-height: 48px;
}
.crm-outreach-input:focus { outline: none; border-color: var(--accent); }
.crm-outreach-composer-actions {
  display: flex; gap: 8px; justify-content: flex-end;
}

/* ======================= Таск-трекер + Календарь ======================= */
.tasks-head-actions { display: flex; align-items: center; gap: 12px; }
.tasks-view-bar { max-width: 440px; margin: 4px 0 14px; }
.crm-modal-spacer { flex: 1; }

/* Бейджи приоритета и статуса */
.task-prio, .task-status {
  display: inline-flex; align-items: center;
  padding: 2px 9px; border-radius: 999px;
  font-size: 11px; font-weight: 500; white-space: nowrap;
}
.task-status { background: rgba(255,255,255,0.06); color: var(--text-soft); }
.task-prio-high { background: var(--danger-soft); color: #ff9277; }
.task-prio-medium { background: var(--warn-soft); color: var(--warn); }
.task-prio-low { background: rgba(255,255,255,0.06); color: var(--text-faint); }
.task-status-today { background: var(--primary-soft); color: var(--primary-strong); }
.task-status-in_progress { background: rgba(106,155,211,0.16); color: #7fb0e0; }
.task-status-planned { background: rgba(255,255,255,0.06); color: var(--text-soft); }
.task-status-waiting { background: var(--warn-soft); color: var(--warn); }
.task-status-done { background: var(--success-soft); color: #4fd07f; }

/* Список «Сегодня» (переиспользует .crm-today-*) */
.task-list-ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.task-row {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 14px; border-radius: 12px;
  background: var(--layer-2); cursor: pointer;
  transition: background 0.16s ease;
}
.task-row:hover { background: rgba(204,125,94,0.10); }
.task-row.is-overdue { box-shadow: inset 3px 0 0 var(--danger); }
.task-row.is-done { opacity: 0.6; }
.task-row.is-done .task-row-title { text-decoration: line-through; color: var(--text-faint); }
.task-row-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.task-row-title { font-size: 13.5px; color: var(--text); }
.task-row-meta { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--text-faint); flex-wrap: wrap; }
.task-dot { color: var(--text-mute); }
.task-due.is-overdue { color: var(--danger); font-weight: 500; }

/* Таблица «Список» */
.tasks-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.tasks-table thead th {
  text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--text-faint); font-weight: 500; padding: 0 12px 10px;
}
.tasks-table tbody td { padding: 12px; border-top: 1px solid var(--line-soft); vertical-align: middle; }
.tasks-table .col-check { width: 36px; }
.tasks-table .task-trow { cursor: pointer; transition: background 0.14s ease; }
.tasks-table .task-trow:hover { background: rgba(204,125,94,0.08); }
.tasks-table .task-trow.is-done strong { text-decoration: line-through; color: var(--text-faint); }
.tasks-table .table-subcopy { color: var(--text-faint); font-size: 12px; margin-top: 3px; }

/* Доска (канбан по статусу) */
.tasks-board {
  display: grid; grid-template-columns: repeat(5, minmax(180px, 1fr));
  gap: 12px; overflow-x: auto; padding-bottom: 4px;
}
.tasks-col { display: flex; flex-direction: column; gap: 10px; background: var(--layer-3); border-radius: 12px; padding: 12px; }
.tasks-col-head { display: flex; align-items: center; justify-content: space-between; }
.tasks-col-count { font-size: 12px; color: var(--text-faint); }
.tasks-col-body { display: flex; flex-direction: column; gap: 8px; min-height: 24px; }
.tasks-col-empty { color: var(--text-mute); font-size: 12px; text-align: center; padding: 8px 0; }
.task-card {
  width: 100%; text-align: left; border: 1px solid var(--line-soft);
  background: var(--layer-2); border-radius: 10px; padding: 11px 12px;
  cursor: pointer; display: flex; flex-direction: column; gap: 8px;
  transition: border-color 0.14s ease, transform 0.14s ease; font-family: inherit;
}
.task-card { cursor: grab; }
.task-card:hover { border-color: var(--primary); transform: translateY(-1px); }
.task-card.is-done { opacity: 0.6; }
.task-card.is-done .task-card-title { text-decoration: line-through; }
.task-card.dragging { opacity: 0.4; cursor: grabbing; }
.tasks-col.drag-over { outline: 2px dashed var(--primary); outline-offset: -2px; background: var(--primary-bg); }
.tasks-col.drag-over .tasks-col-empty { color: var(--primary-strong); }
/* Кнопки этапов задач в настройках */
.task-stages-rows { max-width: 520px; }
.task-stage-actions { display: inline-flex; align-items: center; gap: 4px; }
.crm-stage-move { background: transparent; border: 1px solid var(--line-soft); color: var(--text-soft); width: 26px; height: 26px; border-radius: 7px; cursor: pointer; font-size: 12px; }
.crm-stage-move:hover:not(:disabled) { border-color: var(--primary); color: var(--text); }
.crm-stage-move:disabled { opacity: 0.35; cursor: not-allowed; }
.task-card-title { font-size: 13px; color: var(--text); line-height: 1.35; }
.task-card-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.task-card-company { font-size: 12px; color: var(--text-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 140px; }
.task-card-foot { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--text-faint); }

/* Календарь — месяц */
.cal-head-actions { display: flex; align-items: center; gap: 12px; }
.cal-nav { display: flex; gap: 6px; }
.cal-nav .ghost-button { padding: 7px 13px; }
.cal-month-title { text-transform: capitalize; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-top: 14px; }
.cal-weekday { font-size: 11px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-faint); text-align: center; padding-bottom: 2px; }
.cal-cell {
  min-height: 104px; background: var(--layer-2); border-radius: 10px;
  padding: 6px 6px 8px; display: flex; flex-direction: column; gap: 4px;
  cursor: pointer; border: 1px solid transparent; transition: border-color 0.14s ease;
}
.cal-cell:hover { border-color: var(--line); }
.cal-cell.is-out { opacity: 0.4; }
.cal-cell.is-today { border-color: var(--primary); }
.cal-cell.is-today .cal-cell-num { color: var(--primary-strong); font-weight: 600; }
.cal-cell-num { font-size: 12px; color: var(--text-soft); text-align: right; }
.cal-cell-events { display: flex; flex-direction: column; gap: 3px; overflow: hidden; flex: 1; }
.cal-event {
  display: flex; align-items: center; gap: 5px; width: 100%;
  text-align: left; border: 0; border-radius: 5px; padding: 2px 6px;
  font-size: 11px; cursor: pointer; font-family: inherit; color: var(--text);
  background: rgba(255,255,255,0.06);
}
.cal-event-today { background: var(--primary-soft); }
.cal-event-in_progress { background: rgba(106,155,211,0.16); }
.cal-event-waiting { background: var(--warn-soft); }
.cal-event-done { background: var(--success-soft); }
.cal-event.is-done { opacity: 0.55; }
.cal-event.is-done .cal-event-txt { text-decoration: line-through; }
.cal-event-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-event-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.task-prio-dot-high { background: var(--danger); }
.task-prio-dot-medium { background: var(--warn); }
.task-prio-dot-low { background: var(--text-mute); }
.cal-more { font-size: 11px; color: var(--text-faint); padding-left: 4px; }

@media (max-width: 1100px) {
  .cal-cell { min-height: 84px; }
  .cal-event-txt { display: none; }
}

/* ---- Календарь: переключатель видов + часовая сетка (неделя/день) ---- */
.cal-view-bar { max-width: 280px; }
.calg {
  display: grid; gap: 1px; margin-top: 14px;
  background: var(--line-soft);
  border: 1px solid var(--line-soft);
  border-radius: 12px; overflow: hidden;
}
.calg > div { background: var(--layer-1); }
.calg-dayhead { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 4px; }
.calg-dow { font-size: 11px; text-transform: uppercase; color: var(--text-faint); }
.calg-dayhead.is-today .calg-dow { color: var(--primary-strong); }
.calg-dnum { font-size: 15px; color: var(--text); width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.calg-dnum.is-today { background: var(--primary); color: #fff; font-weight: 600; }
.calg-allday-label, .calg-hourlabel { font-size: 11px; color: var(--text-faint); padding: 6px 8px; text-align: right; font-variant-numeric: tabular-nums; }
.calg-allday-cell { padding: 4px; display: flex; flex-direction: column; gap: 3px; min-height: 30px; }
.calg-cell { min-height: 42px; padding: 3px; display: flex; flex-direction: column; gap: 3px; cursor: pointer; transition: background 0.12s ease; }
.calg-cell:hover { background: rgba(204,125,94,0.07); }
.calg-cell.is-now { box-shadow: inset 0 2px 0 0 var(--danger); }
.calg-chip {
  display: flex; align-items: center; gap: 5px; width: 100%;
  text-align: left; border: 0; border-radius: 5px; padding: 3px 6px;
  font-size: 11px; cursor: pointer; font-family: inherit; color: var(--text);
  background: rgba(255,255,255,0.06);
}
.calg-chip.is-done { opacity: 0.55; }
.calg-chip.is-done .cal-event-txt { text-decoration: line-through; }
.calg-chip .cal-event-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calg-chip-time { color: var(--text-faint); font-variant-numeric: tabular-nums; flex-shrink: 0; }

/* ---- Детальная карточка задачи (стиль Jira) ---- */
.taskv {
  position: fixed; z-index: 1200; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: min(940px, 94vw); max-height: 90vh; overflow-y: auto;
  background: var(--layer-1); border-radius: 16px; padding: 18px 22px 24px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.5); animation: crm-modal-in 200ms ease-out;
}
.taskv-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.taskv-top-actions { display: flex; gap: 8px; }
/* Кнопка «Сохранить»: приглушена пока нет изменений, акцентная при наличии несохранённого. */
.taskv-save:disabled { opacity: 0.45; cursor: default; }
.taskv-save.is-dirty {
  background: rgba(204, 125, 94, 0.9);
  color: #fff;
  box-shadow: 0 4px 14px rgba(204, 125, 94, 0.35);
}
.taskv-save.is-dirty:hover { background: rgba(204, 125, 94, 1); }
.taskv-header { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.taskv-title {
  font-size: 22px; font-weight: 600; background: transparent; border: 0; color: var(--text);
  font-family: inherit; padding: 4px 2px; border-bottom: 1px solid transparent; width: 100%;
}
.taskv-title:hover { border-bottom-color: var(--line-soft); }
.taskv-title:focus { outline: none; border-bottom-color: var(--primary); }
.taskv-badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.taskv-overdue { font-size: 11px; color: var(--danger); background: var(--danger-soft); padding: 2px 9px; border-radius: 999px; }
.taskv-body { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }
.taskv-main { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.taskv-side { display: flex; flex-direction: column; gap: 14px; }
.taskv-block { display: flex; flex-direction: column; gap: 10px; }
.taskv-h { font-size: 13px; font-weight: 600; color: var(--text-soft); margin: 0; display: flex; align-items: center; gap: 8px; }
.taskv-h-count { font-size: 11px; color: var(--text-faint); font-weight: 400; }
.taskv-desc, .taskv-input, .taskv-check-add input, .taskv-comment-form textarea {
  background: var(--layer-3); color: var(--text); border: 1px solid var(--line-soft);
  border-radius: 8px; padding: 9px 12px; font: inherit; font-size: 13px;
  width: 100%; box-sizing: border-box;
}
.taskv-desc { resize: vertical; }
.taskv-desc:focus, .taskv-input:focus, .taskv-check-add input:focus, .taskv-comment-form textarea:focus { outline: none; border-color: var(--primary); }
.taskv-progress { height: 6px; background: var(--layer-3); border-radius: 999px; overflow: hidden; }
.taskv-progress-bar { height: 100%; background: var(--primary); border-radius: 999px; transition: width 0.2s ease; }
.taskv-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 3px; }
.taskv-check-item { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 8px; }
.taskv-check-item:hover { background: var(--layer-2); }
.taskv-check-item.is-done .taskv-check-text { text-decoration: line-through; color: var(--text-faint); }
.taskv-check-text { flex: 1; font-size: 13px; min-width: 0; }
.taskv-check-x { background: transparent; border: 0; color: var(--text-mute); font-size: 17px; line-height: 1; cursor: pointer; opacity: 0; padding: 0 4px; }
.taskv-check-item:hover .taskv-check-x { opacity: 1; }
.taskv-check-add { display: flex; gap: 8px; }
.taskv-comments { display: flex; flex-direction: column; gap: 12px; }
.taskv-comment { display: flex; flex-direction: column; gap: 4px; }
.taskv-comment-meta { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--text-faint); }
.taskv-comment-meta strong { color: var(--text-soft); font-weight: 500; }
.taskv-comment-ts { margin-left: auto; }
.taskv-comment-text { font-size: 13px; color: var(--text); white-space: pre-wrap; padding-left: 32px; }
.taskv-comment.is-system .taskv-comment-text { color: var(--text-faint); font-style: italic; }
.taskv-comment-form { display: flex; flex-direction: column; gap: 8px; }
.taskv-comment-form textarea { resize: vertical; }
.taskv-comment-form .primary-button { align-self: flex-end; }
.taskv-field { display: flex; flex-direction: column; gap: 5px; }
.taskv-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); }
.taskv-field .crm-filter-field { display: flex; width: 100%; }
.taskv-field .crm-filter-field select { width: 100%; height: 36px; }
.taskv-due-row { display: flex; gap: 8px; }
.taskv-due-row input { flex: 1; min-width: 0; background: var(--layer-3); color: var(--text); border: 1px solid var(--line-soft); border-radius: 8px; padding: 8px 10px; font: inherit; font-size: 13px; }
.taskv-due-row input:focus { outline: none; border-color: var(--primary); }
.taskv-meta-foot { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--line-soft); }
.taskv-meta-foot > div { display: flex; justify-content: space-between; gap: 10px; font-size: 12px; }
.taskv-meta-foot span { color: var(--text-faint); }
.taskv-meta-foot strong { color: var(--text-soft); font-weight: 500; text-align: right; }

/* Пикер ответственного в карточке задачи */
.taskv-assignee { position: relative; }
.taskv-assignee-btn {
  display: flex; align-items: center; gap: 9px; width: 100%;
  background: var(--layer-3); color: var(--text);
  border: 1px solid var(--line-soft); border-radius: 8px;
  padding: 7px 10px; font: inherit; font-size: 13px; cursor: pointer;
  transition: border-color 0.14s ease;
}
.taskv-assignee-btn:hover { border-color: var(--primary); }
.taskv-assignee.is-open .taskv-assignee-btn { border-color: var(--primary); }
.taskv-assignee-name { flex: 1; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.taskv-assignee-btn .crm-filter-chevron { position: static; transform: none; color: var(--text-faint); }
.taskv-assignee-menu {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 30;
  background: var(--layer-2); border: 1px solid var(--line); border-radius: 10px;
  padding: 5px; display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 12px 34px rgba(0,0,0,0.45);
}
.taskv-assignee-opt {
  display: flex; align-items: center; gap: 9px; width: 100%; text-align: left;
  background: transparent; border: 0; border-radius: 7px; padding: 7px 9px;
  font: inherit; font-size: 13px; color: var(--text); cursor: pointer;
}
.taskv-assignee-opt:hover { background: rgba(204,125,94,0.12); }
.taskv-assignee-opt.is-current { background: var(--primary-bg); }
.taskv-assignee-other { color: var(--text-soft); border-top: 1px solid var(--line-soft); border-radius: 0 0 7px 7px; margin-top: 2px; }

@media (max-width: 860px) {
  .taskv-body { grid-template-columns: 1fr; }
}

/* ---- Карточка создания задачи / события ---- */
.crm-modal.task-create { width: min(560px, 94vw); padding: 0; overflow: hidden; border: 1px solid var(--line-soft); box-shadow: 0 24px 80px rgba(0,0,0,0.55); }
.tc-head { display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; border-bottom: 1px solid var(--line-soft); }
.tc-head-title { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; color: var(--text); }
.tc-head-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 9px; background: var(--primary-soft); color: var(--primary-strong); }
.tc-form { display: flex; flex-direction: column; gap: 16px; padding: 18px 20px 20px; max-height: calc(90vh - 62px); overflow-y: auto; }
.tc-title { font-size: 18px; font-weight: 600; background: transparent; border: 0; border-bottom: 1px solid var(--line-soft); color: var(--text); font-family: inherit; padding: 6px 2px; }
.tc-title::placeholder { color: var(--text-mute); font-weight: 500; }
.tc-title:focus { outline: none; border-bottom-color: var(--primary); }
.tc-desc { background: var(--layer-3); border: 1px solid var(--line-soft); border-radius: 10px; color: var(--text); font: inherit; font-size: 13px; padding: 10px 12px; resize: vertical; }
.tc-desc::placeholder { color: var(--text-mute); }
.tc-desc:focus { outline: none; border-color: var(--primary); }
.tc-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.tc-label { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-faint); }
.tc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.tc-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.tc-chip { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line-soft); background: var(--layer-3); color: var(--text-soft); font: inherit; font-size: 12.5px; cursor: pointer; transition: background 0.14s ease, border-color 0.14s ease, color 0.14s ease; }
.tc-chip:hover { border-color: var(--line-strong); color: var(--text); }
.tc-chip.is-active { background: var(--primary-bg); border-color: var(--primary); color: var(--text); }
.tc-prio-high.is-active { background: var(--danger-soft); border-color: var(--danger); color: #ff9277; }
.tc-prio-medium.is-active { background: var(--warn-soft); border-color: var(--warn); color: var(--warn); }
.tc-prio-low.is-active { background: rgba(255,255,255,0.08); border-color: var(--line-strong); color: var(--text); }
.tc-input { width: 100%; box-sizing: border-box; background: var(--layer-3); border: 1px solid var(--line-soft); border-radius: 10px; color: var(--text); font: inherit; font-size: 13px; padding: 9px 12px; }
.tc-input::placeholder { color: var(--text-mute); }
.tc-input:focus { outline: none; border-color: var(--primary); }
.tc-owner { display: flex; align-items: center; gap: 9px; }
.tc-owner .crm-filter-field { flex: 1; display: flex; }
.tc-owner .crm-filter-field select { width: 100%; height: 38px; border-radius: 10px; }
.tc-foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 2px; padding-top: 16px; border-top: 1px solid var(--line-soft); }
.tc-label-deadline, .taskv-label-deadline { color: var(--warn); }

/* Бейдж дедлайна */
.task-deadline { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,0.06); color: var(--text-faint); white-space: nowrap; }
.task-deadline svg { flex-shrink: 0; }
.task-deadline.is-past { background: var(--danger-soft); color: #ff9277; }

/* Режим выбора задач + массовое удаление */
.tasks-head-actions .ghost-button.active { border-color: var(--primary); color: var(--text); background: var(--primary-bg); }
.tasks-bulk-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; margin: 4px 0 12px; background: var(--primary-bg); border: 1px solid var(--primary); border-radius: 10px; }
.tasks-bulk-count { font-size: 13px; color: var(--text); font-weight: 500; }
.tasks-bulk-actions { display: flex; gap: 8px; }
.tasks-table .task-trow.is-selected { background: var(--primary-bg); }
.tasks-table .task-trow[data-task-sel] { cursor: pointer; }

/* ============================================================ */
/* Настройки → Генерация КП (LLM-персонализация)                */
/* ============================================================ */
.kp-prompt-section { display: flex; flex-direction: column; gap: 16px; }
.company-profile-section { margin-bottom: 120px; }
.kp-prompt-toggle { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; font-size: 14px; color: var(--text); }
.kp-prompt-toggle input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; }
.kp-prompt-editor { display: flex; flex-direction: column; gap: 10px; }
.kp-prompt-editor label { font-size: 13px; color: var(--text-muted); }
.kp-prompt-editor textarea { width: 100%; min-height: 220px; padding: 12px 14px; font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 13px; line-height: 1.55; color: var(--text); background: var(--surface-inset, rgba(0,0,0,0.02)); border: 1px solid var(--line, #e3e0db); border-radius: 10px; resize: vertical; box-sizing: border-box; }
.kp-prompt-editor textarea:focus { outline: none; border-color: var(--primary); }
.kp-prompt-actions { display: flex; gap: 10px; justify-content: flex-end; }
.kp-prompt-saved { font-size: 12px; color: var(--text-muted); text-align: right; }

/* ===== Auth screen (вход/регистрация) ===== */
.auth-screen { min-height: 100vh; width: 100%; display: flex; align-items: center; justify-content: center; padding: 24px; box-sizing: border-box; background: var(--bg-canvas, #121212); }
.auth-card { width: 100%; max-width: 380px; background: var(--layer-1, #1e1e1e); border: 1px solid var(--line, rgba(249,249,247,0.14)); border-radius: var(--radius-xl, 22px); padding: 32px 28px; box-sizing: border-box; }
.auth-brand { font-size: 22px; font-weight: 700; color: var(--text, #f8f8f8); text-align: center; margin-bottom: 22px; letter-spacing: 0.2px; }
.auth-tabs { display: flex; gap: 6px; background: var(--layer-3, #0f0f0f); border-radius: var(--radius-sm, 12px); padding: 4px; margin-bottom: 22px; }
.auth-tab { flex: 1; padding: 9px 12px; border: none; border-radius: 9px; background: transparent; color: var(--text-faint, #a6a6a6); font-size: 14px; font-weight: 600; cursor: pointer; transition: background 140ms, color 140ms; }
.auth-tab.active { background: var(--primary-soft, rgba(204,125,94,0.18)); color: var(--primary-strong, #df9577); }
.auth-form { display: flex; flex-direction: column; gap: 14px; }
.auth-field { display: flex; flex-direction: column; gap: 6px; }
.auth-field span { font-size: 13px; color: var(--text-faint, #a6a6a6); }
.auth-field input { padding: 11px 13px; background: var(--layer-3, #0f0f0f); border: 1px solid var(--line, rgba(249,249,247,0.14)); border-radius: var(--radius-sm, 12px); color: var(--text, #f8f8f8); font-size: 14px; box-sizing: border-box; }
.auth-field input:focus { outline: none; border-color: var(--primary, #cc7d5e); }
.auth-error { font-size: 13px; color: var(--danger, #ff5f38); background: var(--danger-soft, rgba(255,95,56,0.18)); padding: 9px 12px; border-radius: var(--radius-sm, 12px); }
.auth-submit { margin-top: 6px; padding: 12px; border: none; border-radius: var(--radius-sm, 12px); background: var(--primary, #cc7d5e); color: #1a1a1a; font-size: 15px; font-weight: 700; cursor: pointer; transition: background 140ms; }
.auth-submit:hover { background: var(--primary-strong, #df9577); }
.auth-submit:disabled { opacity: 0.6; cursor: default; }
.auth-hint { margin-top: 18px; font-size: 12px; color: var(--text-mute, #8a8a8a); text-align: center; line-height: 1.5; }

/* ===== Команда (Настройки → Команда) ===== */
.team-table-wrap { margin-top: 8px; overflow-x: auto; }
.team-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.team-table th { text-align: left; padding: 10px 12px; color: var(--text-faint, #a6a6a6); font-weight: 600; font-size: 12px; border-bottom: 1px solid var(--line, rgba(249,249,247,0.14)); }
.team-table td { padding: 11px 12px; border-bottom: 1px solid var(--line-soft, rgba(249,249,247,0.08)); color: var(--text, #f8f8f8); }
.team-table tr:last-child td { border-bottom: none; }
.team-empty { color: var(--text-mute, #8a8a8a); text-align: center; padding: 18px 12px; }
.team-actions { text-align: right; }
.team-crm-owner { display: grid; grid-template-columns: minmax(82px, 0.8fr) minmax(140px, 1.2fr); gap: 8px; align-items: center; min-width: 260px; }
.team-crm-owner input { min-width: 0; padding: 8px 10px; background: var(--layer-3, #0f0f0f); border: 1px solid var(--line, rgba(249,249,247,0.14)); border-radius: var(--radius-sm, 12px); color: var(--text, #f8f8f8); font-size: 13px; box-sizing: border-box; }
.team-crm-owner input:focus { outline: none; border-color: var(--primary, #cc7d5e); }
.team-sales-agent-select { min-width: 220px; padding: 8px 10px; background: var(--layer-3, #0f0f0f); border: 1px solid var(--line, rgba(249,249,247,0.14)); border-radius: var(--radius-sm, 12px); color: var(--text, #f8f8f8); font-size: 13px; box-sizing: border-box; }
.team-sales-agent-select:focus { outline: none; border-color: var(--primary, #cc7d5e); }
.team-role-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: var(--layer-3, #0f0f0f); color: var(--text-soft, #d6d6d6); }
.team-role-pill.is-owner { background: var(--primary-soft, rgba(204,125,94,0.18)); color: var(--primary-strong, #df9577); }
.team-role-pill.is-admin { background: var(--warn-soft, rgba(224,164,95,0.18)); color: var(--warn, #e0a45f); }
.ghost-button.danger { color: var(--danger, #ff5f38); }
.ghost-button.danger:hover { background: var(--danger-soft, rgba(255,95,56,0.18)); }
.team-add-form { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line, rgba(249,249,247,0.14)); }
.team-add-form h3 { margin: 0 0 14px; font-size: 15px; color: var(--text, #f8f8f8); }
.team-add-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.team-add-form .auth-field input, .team-add-form .auth-field select { padding: 10px 12px; background: var(--layer-3, #0f0f0f); border: 1px solid var(--line, rgba(249,249,247,0.14)); border-radius: var(--radius-sm, 12px); color: var(--text, #f8f8f8); font-size: 14px; box-sizing: border-box; }
.team-add-form .auth-field input:focus, .team-add-form .auth-field select:focus { outline: none; border-color: var(--primary, #cc7d5e); }
.team-add-submit { width: auto; padding: 11px 22px; }
.team-hint { margin-top: 10px; font-size: 12px; color: var(--text-mute, #8a8a8a); }
@media (max-width: 640px) { .team-add-grid { grid-template-columns: 1fr; } .team-crm-owner { grid-template-columns: 1fr; min-width: 220px; } .team-sales-agent-select { min-width: 220px; } }

/* ============================================================
   ВОРОНКА — сквозной дашборд этапов (kanban-стиль)
   ============================================================ */
.funnel-section { display: flex; flex-direction: column; gap: 18px; }
.funnel-board {
  display: flex;
  align-items: stretch;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 10px;
}
.funnel-col {
  flex: 1 1 0;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  background: var(--surface-2, rgba(255,255,255,0.03));
  overflow: hidden;
}
.funnel-col-head {
  padding: 14px 14px 12px;
  border-bottom: 1px solid var(--border, rgba(255,255,255,0.08));
  position: relative;
}
.funnel-col-head::before {
  content: "";
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--stage-accent, var(--primary));
}
.funnel-col-title { font-size: 13px; font-weight: 600; color: var(--text); }
.funnel-col-count { font-size: 26px; font-weight: 700; line-height: 1.1; margin-top: 4px; color: var(--text); }
.funnel-col-desc { font-size: 11px; color: var(--text-muted, #9aa4b2); margin-top: 2px; }
.funnel-col-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px;
  overflow-y: auto;
  max-height: 62vh;
}
.funnel-col-empty { text-align: center; color: var(--text-muted, #9aa4b2); padding: 16px 0; font-size: 13px; }
.funnel-col-more { text-align: center; color: var(--text-muted, #9aa4b2); font-size: 12px; padding: 4px 0; }
.funnel-card {
  text-align: left;
  width: 100%;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid var(--border, rgba(255,255,255,0.10));
  background: var(--layer-2);
  color: var(--text);
  cursor: pointer;
  transition: border-color 0.15s, transform 0.1s;
}
.funnel-card:hover { border-color: var(--primary); transform: translateY(-1px); }
.funnel-card-name { font-size: 13px; font-weight: 500; line-height: 1.3; }
.funnel-card-meta { display: flex; align-items: center; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.funnel-card-seg {
  font-size: 10px; font-weight: 700; letter-spacing: 0.4px;
  padding: 2px 7px; border-radius: 6px;
  background: rgba(120,140,255,0.18); color: #aeb8ff;
}
.funnel-card-progress { font-size: 11px; color: var(--text-muted, #9aa4b2); }
.funnel-conv {
  flex: 0 0 auto;
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
  min-width: 52px;
}
.funnel-conv-pct { font-size: 15px; font-weight: 700; color: var(--text); }
.funnel-conv-label { font-size: 9px; color: var(--text-muted, #9aa4b2); text-transform: uppercase; letter-spacing: 0.3px; }

/* Цвета этапов (верхняя полоска колонки) */
.funnel-col.stage-research  { --stage-accent: #6b7280; }
.funnel-col.stage-proposal  { --stage-accent: #8b5cf6; }
.funnel-col.stage-prep      { --stage-accent: #0ea5e9; }
.funnel-col.stage-send      { --stage-accent: #f59e0b; }
.funnel-col.stage-response  { --stage-accent: #22c55e; }

/* Drawer: путь по воронке */
.funnel-journey { display: flex; flex-direction: column; gap: 0; margin-top: 6px; }
.funnel-journey-step { display: flex; align-items: center; gap: 10px; padding: 6px 0; position: relative; }
.funnel-journey-step .funnel-journey-dot {
  width: 12px; height: 12px; border-radius: 50%;
  border: 2px solid var(--border, rgba(255,255,255,0.25));
  background: transparent; flex: none;
}
.funnel-journey-step.done .funnel-journey-dot { background: var(--success, #22c55e); border-color: var(--success, #22c55e); }
.funnel-journey-step.current .funnel-journey-dot { background: var(--primary); border-color: var(--primary); box-shadow: 0 0 0 4px rgba(120,140,255,0.18); }
.funnel-journey-label { font-size: 13px; color: var(--text-muted, #9aa4b2); }
.funnel-journey-step.done .funnel-journey-label { color: var(--text); }
.funnel-journey-step:not(:last-child)::after {
  content: ""; position: absolute; left: 5px; top: 24px; bottom: -6px; width: 2px;
  background: var(--border, rgba(255,255,255,0.12));
}
.funnel-journey-step.done:not(:last-child)::after { background: var(--success, #22c55e); }

/* Drawer: цепочки касаний */
.funnel-chain { margin-top: 10px; }
.funnel-chain-head { font-size: 12px; font-weight: 600; color: var(--text-muted, #9aa4b2); margin-bottom: 6px; }
.funnel-chain-step { display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 13px; }
.funnel-chain-step .funnel-step-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--border, rgba(255,255,255,0.3)); flex: none; }
.funnel-chain-step.status-sent .funnel-step-dot { background: #22c55e; }
.funnel-chain-step.status-ready .funnel-step-dot { background: #0ea5e9; }
.funnel-chain-step.status-error .funnel-step-dot { background: #ef4444; }
.funnel-step-no { color: var(--text); min-width: 56px; }
.funnel-step-status { color: var(--text-muted, #9aa4b2); font-size: 12px; }
.funnel-step-response { font-size: 12px; color: #22c55e; padding: 2px 0 6px 16px; }
@media (max-width: 900px) { .funnel-board { flex-direction: column; } .funnel-conv { flex-direction: row; gap: 6px; } }

.collection-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 4px 0 20px;
  color: var(--text-muted, #9aa4b2);
  font-size: 13px;
}
