/* ============================================================
   Lumen CRM — светлая рабочая зона + тёмно-синие акцентные
   поверхности (сайдбар, hero, AI-панели). Стекло — дозированно.
   Палитра: navy #061126/#0A1833/#102B5C · blue var(--accent)/var(--accent-2)
   · light #F4F7FB/#EEF2F7 · text #111827/#667085 · border #DCE3ED
   ============================================================ */
:root {
  --navy-950: #061126;
  --navy-900: #0A1833;
  --navy-700: #102B5C;
  --accent: #2563EB;
  --accent-2: #2F6BFF;
  --blue-300: #86AFFF;
  --blue-100: #DCE8FF;
  --bg: #F4F7FB;
  --bg-2: #EEF2F7;
  --card: #FFFFFF;
  --ink: #111827;
  --ink-2: #3D4A63;
  --ink-3: #667085;
  --stroke: #DCE3ED;
  --stroke-soft: #E7ECF3;
  --glass: rgba(255, 255, 255, .65);
  /* границы accent-soft чипов и hover-рамок карточек — следуют за темой (по умолчанию = кобальт) */
  --accent-soft-bd: #C3D6FA;
  --hover-bd: #B9CBEE;
  --ok: #12855F;
  --ok-bg: #E4F5EE;
  --warn: #9A6700;
  --warn-bg: #FBF0DA;
  --bad: #C0392B;
  --bad-bg: #FBE9E7;
  --violet: #6D5BD0;
  --violet-bg: #EEEBFB;
  --r-lg: 16px;
  --r-md: 13px;
  --r-sm: 10px;
  /* ⭐ визуал v4: более глубокая, слоёная тень (мягкий контакт + средний + дальний ореол) — премиум-глубина */
  --shadow: 0 1px 2px rgba(16, 43, 92, .045), 0 3px 8px -3px rgba(16, 43, 92, .07), 0 14px 32px -16px rgba(16, 43, 92, .16);
  --shadow-lift: 0 2px 6px -2px rgba(16, 43, 92, .10), 0 20px 48px -18px rgba(16, 43, 92, .30);
  --font: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* ⚠ БЫЛО Fraunces (без кириллицы) → RU-заголовки рендерились уродливым миксом сериф+санс.
     Дисплей-шрифт = тот же Manrope (жирные веса + плотный трекинг дают «дисплейность»), единый чистый вид без серифа. */
  --font-display: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  /* motion: critically-damped spring, ноль отскока */
  --ease-spring: cubic-bezier(.16, 1, .3, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --dur-fast: .18s;
  --dur: .4s;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ---------- оркестрированный вход раздела (класс anim вешает go(), одна волна) ---------- */
@keyframes reveal { from { opacity: 0; } to { opacity: 1; } }
.content.anim > * { opacity: 0; animation: reveal .38s var(--ease-soft) forwards; }
.content.anim > *:nth-child(2) { animation-delay: .07s; }
.content.anim > *:nth-child(3) { animation-delay: .14s; }
.content.anim > *:nth-child(4) { animation-delay: .21s; }
.content.anim .kpis > .kpi { opacity: 0; animation: reveal .6s var(--ease-spring) forwards; }
.content.anim .kpis > .kpi:nth-child(2) { animation-delay: .06s; }
.content.anim .kpis > .kpi:nth-child(3) { animation-delay: .12s; }
.content.anim .kpis > .kpi:nth-child(4) { animation-delay: .18s; }
.content.anim .kb-col { opacity: 0; animation: reveal .55s var(--ease-spring) forwards; }
.content.anim .kb-col:nth-child(2) { animation-delay: .05s; }
.content.anim .kb-col:nth-child(3) { animation-delay: .1s; }
.content.anim .kb-col:nth-child(4) { animation-delay: .15s; }
.content.anim .kb-col:nth-child(5) { animation-delay: .2s; }
.content.anim .kb-col:nth-child(6) { animation-delay: .25s; }
.content.anim .kb-col:nth-child(7) { animation-delay: .3s; }
.content.anim .kb-col:nth-child(8) { animation-delay: .35s; }
.content.anim .kb-col:nth-child(9) { animation-delay: .4s; }
.content.anim .seq-step { opacity: 0; animation: reveal .5s var(--ease-spring) forwards; }
.content.anim .seq-step:nth-child(2) { animation-delay: .06s; }
.content.anim .seq-step:nth-child(3) { animation-delay: .12s; }
.content.anim .seq-step:nth-child(4) { animation-delay: .18s; }
.content.anim .seq-step:nth-child(5) { animation-delay: .24s; }
.content.anim .seq-step:nth-child(6) { animation-delay: .3s; }
.content.anim .seq-step:nth-child(7) { animation-delay: .36s; }
/* полосы растут из нуля только в волну входа */
@keyframes growX { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.content.anim .funnel-row .bar,
.content.anim .geo-bar .g-fill,
.content.anim .progress i,
.content.anim .wake-bar i,
.content.anim .load-track i {
  transform-origin: left center;
  animation: growX .9s var(--ease-spring) both;
  animation-delay: .25s;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  font-family: var(--font);
  font-size: 14px;
  color: var(--ink);
  background: linear-gradient(180deg, #F6F9FD, var(--bg) 40%);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  letter-spacing: -0.006em;
  overflow: hidden;
}
/* ---------- дисплейная типографика: единый Manrope, плотный трекинг = «дисплейность» без серифа ---------- */
.font-display, .page-title, .hero-nm, .modal-title, .hero-title { font-family: var(--font-display); letter-spacing: -0.022em; }
/* заголовки карточек/секций/героев — чуть жирнее и плотнее, чтобы читались как дисплей */
.ov2-card-hd, .ha-title, .hr-hero-t, .lrn-t, .card-title, .plo-h1, h1, h2, h3, .modal h3 { letter-spacing: -0.02em; }
.page-title { font-weight: 600; letter-spacing: -0.024em; }
/* цифры остаются на гротеске Manrope — чистые табличные, без серифа */
.kpi .val, .stat-big, .big-num { font-family: var(--font); font-variant-numeric: tabular-nums; }

/* ---------- сегментированная суб-навигация раздела ---------- */
.auto-seg { display: inline-flex; gap: 4px; flex-wrap: wrap; margin-bottom: 20px; background: var(--card); border: 1px solid var(--stroke); padding: 5px; border-radius: 13px; box-shadow: var(--shadow); }
.auto-seg .seg-b { display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border-radius: 9px; font-size: 13px; font-weight: 600; color: var(--ink-3); transition: color var(--dur-fast), background var(--dur-fast); white-space: nowrap; }
.auto-seg .seg-b svg { width: 15px; height: 15px; opacity: .8; }
.auto-seg .seg-b:hover { color: var(--ink); background: var(--bg-2); }
.auto-seg .seg-b.on { background: linear-gradient(180deg, var(--navy-700), var(--navy-900)); color: #fff; box-shadow: 0 6px 16px -6px rgba(16, 43, 92, .5); }
.auto-seg .seg-b.on svg { opacity: 1; color: var(--blue-300); }
.auto-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.auto-grid.solo { grid-template-columns: minmax(0, 760px); justify-content: start; }
@media (max-width: 1000px) { .auto-grid, .auto-grid.solo { grid-template-columns: 1fr; } }
html[data-night] .auto-seg { background: var(--card); border-color: var(--stroke); }
html[data-night] .auto-seg .seg-b { color: var(--ink-3); }
html[data-night] .auto-seg .seg-b:hover { color: var(--ink); background: rgba(140, 165, 230, .1); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #C5D0DF; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }
svg { display: block; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
input, select, textarea {
  font-family: inherit; font-size: 13.5px; color: var(--ink);
  background: var(--card); border: 1px solid var(--stroke);
  border-radius: var(--r-sm); padding: 9px 12px; outline: none;
  transition: border-color .15s, box-shadow .15s;
}
/* фокус-кольцо INSET (внутрь поля) — внешний box-shadow обрезался родителями с overflow:hidden
   (та самая «обрывистая синяя полоска» по всей CRM). Inset рисуется внутри бокса и не клипается нигде. */
input:focus, select:focus, textarea:focus { border-color: var(--accent-2); box-shadow: inset 0 0 0 1px var(--accent-2), inset 0 0 0 4px color-mix(in srgb, var(--accent) 10%, transparent); }
/* индикатор «ИИ ведёт диалог» — тонкая бегущая линия + подпись, БЕЗ белого блока (сидит на фоне чата) */
.chat-ai-line { flex: none; padding: 6px 0 7px; text-align: center; position: relative; }
.chat-ai-line::before { content: ''; position: absolute; top: 0; left: 14%; right: 14%; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--accent), var(--accent-2), transparent); background-size: 200% 100%; animation: aiFlow 2.4s linear infinite; }
.chat-ai-line b { font-size: 10.5px; font-weight: 700; letter-spacing: .04em; color: var(--accent); opacity: .8; display: inline-flex; align-items: center; gap: 5px; }
.chat-ai-line b svg { width: 12px; height: 12px; }
@keyframes aiFlow { to { background-position: -200% 0; } }
input::placeholder, textarea::placeholder { color: #9AA6B8; }
textarea { resize: vertical; min-height: 70px; }

/* ---------- каркас ---------- */
.app { display: flex; height: 100vh; }
.sidebar {
  width: 236px; flex: 0 0 236px; display: flex; flex-direction: column;
  padding: 20px 12px 14px;
  background: linear-gradient(178deg, var(--navy-900), var(--navy-950) 70%);
  color: #E7EDFB;
}
.brand { display: flex; align-items: center; gap: 11px; padding: 2px 10px 20px; }
.brand-mark { width: 30px; height: 36px; flex: 0 0 30px; filter: drop-shadow(0 2px 8px color-mix(in srgb, var(--accent) 45%, transparent)); }
.brand-mark img, .brand-mark svg { width: 100%; height: 100%; }
.brand-name { font-size: 16.5px; font-weight: 650; letter-spacing: .22em; color: #fff; }
.brand-name span { font-weight: 400; letter-spacing: .14em; color: var(--blue-300); font-size: 9.5px; display: block; margin-top: 2px; }
.nav-label { font-size: 10px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: #5E6E96; padding: 15px 12px 6px; }
.nav { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; flex: 1; }
.nav::-webkit-scrollbar-thumb { background: rgba(140, 165, 230, .25); }
.nav-item {
  display: flex; align-items: center; gap: 11px; padding: 8.5px 12px;
  border-radius: var(--r-sm); font-size: 13.3px; font-weight: 500; color: #A9B7D6;
  transition: background var(--dur-fast) var(--ease-soft), color var(--dur-fast); text-align: left;
}
.nav-item svg { width: 17px; height: 17px; stroke-width: 1.7; opacity: .85; transition: transform var(--dur) var(--ease-spring), opacity var(--dur-fast); }
.nav-item:hover svg { transform: translateX(2px); }
.nav-item:hover { background: color-mix(in srgb, var(--accent) 9%, transparent); color: #fff; }
.nav-item.active {
  background: linear-gradient(120deg, color-mix(in srgb, var(--accent) 28%, transparent), color-mix(in srgb, var(--accent) 12%, transparent));
  color: #fff; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent);
}
.nav-item.active svg { opacity: 1; color: var(--blue-300); }
.nav-item .cnt {
  margin-left: auto; font-size: 11px; font-weight: 600; color: var(--blue-300);
  background: color-mix(in srgb, var(--accent) 14%, transparent); padding: 1px 7px; border-radius: 20px;
}
/* каретка-индикатор раскрытия у кнопки-пространства */
.nav-caret { margin-left: auto; display: inline-flex; opacity: .5; transition: transform var(--dur) var(--ease-spring), opacity var(--dur-fast); }
.nav-caret svg { width: 14px !important; height: 14px !important; opacity: 1 !important; }
.nav-caret svg { transform: none !important; }
.nav-item.ws-open .nav-caret { opacity: .9; transform: rotate(-180deg); }
.nav-item[data-ws] .cnt { margin-left: 6px; }
/* раскрывающийся список подстраниц пространства */
.nav-sub { display: grid; grid-template-rows: 0fr; overflow: hidden; transition: grid-template-rows var(--dur) var(--ease-soft); margin: 0 0 0 6px; }
.nav-sub > * { min-height: 0; }
.nav-sub-inner { overflow: hidden; }
.nav-sub.open { grid-template-rows: 1fr; }
.nav-sub .nav-subitem {
  display: flex; align-items: center; gap: 9px; width: calc(100% - 4px); margin: 2px 0; padding: 7px 10px 7px 14px;
  border-radius: var(--r-sm); font-size: 12.5px; font-weight: 500; color: #8FA0C6; text-align: left;
  position: relative; transition: background var(--dur-fast), color var(--dur-fast);
}
.nav-sub .nav-subitem::before { content: ''; position: absolute; left: 5px; top: 0; bottom: 0; width: 1.5px; background: color-mix(in srgb, var(--accent) 16%, transparent); }
.nav-sub .nav-subitem svg { width: 15px; height: 15px; stroke-width: 1.7; opacity: .8; }
.nav-sub .nav-subitem:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); color: #fff; }
.nav-sub .nav-subitem.on { color: #fff; background: color-mix(in srgb, var(--accent) 16%, transparent); }
.nav-sub .nav-subitem.on::before { background: var(--blue-300); }
.side-foot { padding-top: 12px; border-top: 1px solid color-mix(in srgb, var(--accent) 14%, transparent); margin-top: 10px; }
.agency { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: var(--r-sm); }
.agency .ava {
  width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center;
  font-size: 12px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, var(--accent-2), var(--navy-700));
  border: none;
}
.agency .nm { font-size: 13px; font-weight: 600; color: #fff; }
.agency .rl { font-size: 11px; color: #7487AF; }

.main { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.topbar { display: flex; align-items: center; gap: 14px; padding: 18px 28px 14px; }
.page-title { font-size: 20px; font-weight: 700; letter-spacing: -.2px; color: var(--navy-900); }
.page-sub { font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.tb-spacer { flex: 1; }
.demo-chip {
  display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 550; color: var(--warn);
  background: var(--warn-bg); border: 1px solid #EBD9B0;
  padding: 6px 12px; border-radius: 20px;
}
.demo-chip i { width: 6px; height: 6px; border-radius: 50%; background: #D9A514; animation: pulse 1.6s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1 } 50% { opacity: .3 } }
.content { flex: 1; overflow-y: auto; padding: 6px 28px 30px; }

/* ---------- поверхности ---------- */
.glass {
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow);
}
.card { padding: 20px; }
.card-title { font-size: 14px; font-weight: 650; margin-bottom: 14px; display: flex; align-items: center; gap: 9px; color: var(--navy-900); }
.card-title svg { width: 16px; height: 16px; color: var(--accent); }
.card-title .sub { font-weight: 400; font-size: 12px; color: var(--ink-3); margin-left: auto; }
.btn {
  display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px;
  border-radius: var(--r-sm); font-size: 13px; font-weight: 550;
  background: var(--card); border: 1px solid var(--stroke); color: var(--ink-2);
  transition: background .15s, border-color .15s, transform .1s;
}
.btn { transition: background var(--dur-fast) var(--ease-soft), border-color var(--dur-fast), box-shadow var(--dur) var(--ease-soft); }
.btn:hover { background: var(--bg-2); border-color: #C9D4E3; }
.btn:active { background: var(--bg); }
.btn svg { width: 15px; height: 15px; }
.btn-accent {
  background: var(--accent); border-color: var(--accent); color: #fff;
  box-shadow: 0 6px 16px -6px color-mix(in srgb, var(--accent) 50%, transparent);
}
.btn-accent:hover { background: color-mix(in srgb, var(--accent) 86%, #000); border-color: color-mix(in srgb, var(--accent) 86%, #000); box-shadow: 0 10px 26px -8px color-mix(in srgb, var(--accent) 60%, transparent); }
/* заметная CTA-кнопка — не сливается ни со светлым, ни с кобальтовым фоном (градиент + чёткая тень + светлый кант сверху) */
/* тематизирован: был захардкожен сине-фиолетовым (#2E6BFF→#6A3CE0) — клеш в Бургунди.
   Теперь градиент акцента темы → его тёмный оттенок (бордо в warm, синий в Стекле). */
.btn-cta {
  background: linear-gradient(120deg, var(--accent) 0%, color-mix(in srgb, var(--accent) 66%, #000) 100%);
  border: 1px solid rgba(255, 255, 255, .18); color: #fff; font-weight: 700;
  box-shadow: 0 10px 26px -8px color-mix(in srgb, var(--accent) 55%, transparent), inset 0 1px 0 rgba(255, 255, 255, .28);
}
.btn-cta:hover { filter: brightness(1.07); transform: translateY(-1px); box-shadow: 0 14px 32px -8px color-mix(in srgb, var(--accent) 62%, transparent), inset 0 1px 0 rgba(255, 255, 255, .3); }
.btn-cta svg { color: #fff; }
.btn-ghost { background: transparent; border-color: transparent; color: var(--ink-3); display: inline-flex; align-items: center; gap: 5px; }
.btn-ghost:hover { background: var(--bg-2); color: var(--ink); }
/* страховка: у ic() нет атрибутов размера — любой svg в ghost-кнопке обязан иметь габарит из CSS */
.btn-ghost svg { width: 14px; height: 14px; flex: 0 0 auto; }
.btn-danger { color: var(--bad); border-color: #EDC5C0; background: var(--card); }
.btn-danger:hover { background: var(--bad-bg); }
.btn-sm { padding: 6px 11px; font-size: 12px; border-radius: 8px; }
.badge {
  display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600;
  padding: 3px 10px; border-radius: 20px; white-space: nowrap;
  background: var(--bg-2); border: 1px solid var(--stroke); color: var(--ink-2);
}
.badge i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.badge svg { width: 12px; height: 12px; }
/* текст бейджей — затемнённый оттенок семантики (не сам токен): контраст на светлой заливке был низкий (warn ~1.85), теперь читаемо; цвет-хью сохранён */
.badge.ok { color: color-mix(in srgb, var(--ok) 76%, #071a10); background: var(--ok-bg); border-color: #C4E6D6; }
.badge.warn { color: color-mix(in srgb, var(--warn) 58%, #3a2200); background: var(--warn-bg); border-color: #EBD9B0; }
.badge.bad { color: color-mix(in srgb, var(--bad) 78%, #2a0209); background: var(--bad-bg); border-color: #EDC5C0; }
.badge.acc { color: color-mix(in srgb, var(--accent) 80%, #05122e); background: var(--blue-100); border-color: var(--accent-soft-bd); }
.badge.violet { color: color-mix(in srgb, var(--violet) 78%, #14092e); background: var(--violet-bg); border-color: #D9D2F4; }
.badge.ok i, .badge.warn i, .badge.bad i, .badge.acc i, .badge.violet i { background: currentColor; }
.muted { color: var(--ink-3); }
.grid { display: grid; gap: 16px; }

/* ---------- stat-плитки ---------- */
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.kpi { padding: 18px 20px; }
.kpi .lbl { font-size: 12px; color: var(--ink-3); font-weight: 500; display: flex; gap: 8px; align-items: center; }
.kpi .lbl svg { width: 14px; height: 14px; color: var(--accent); }
.kpi .val { font-size: 28px; font-weight: 700; letter-spacing: -.6px; margin-top: 8px; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.kpi .delta { font-size: 11.5px; margin-top: 4px; color: var(--ok); font-weight: 550; }
.kpi .delta.neg { color: var(--bad); }

/* ---------- обзор ---------- */
.ov-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .ov-grid { grid-template-columns: 1fr; } }
/* Обзор: «Что требует внимания» */
.ov-attn .attn-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.attn-c { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px 14px; border-radius: 13px; border: 1px solid var(--stroke); background: var(--card, #fff); cursor: pointer; text-align: left; transition: transform .14s, box-shadow .14s; position: relative; }
.attn-c:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.attn-ic { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; background: var(--blue-100); }
.attn-ic svg { width: 15px; height: 15px; color: var(--accent); }
.attn-n { font-size: 24px; font-weight: 750; color: var(--navy-900); line-height: 1; }
.attn-k { font-size: 12px; color: var(--ink-2); line-height: 1.3; }
.attn-who { font-size: 11px; color: var(--ink-3); }
.attn-c.bad .attn-ic { background: var(--bad-bg); } .attn-c.bad .attn-ic svg { color: var(--bad); }
.attn-c.warn .attn-ic { background: var(--warn-bg); } .attn-c.warn .attn-ic svg { color: var(--warn); }
.attn-c.ok .attn-ic { background: var(--ok-bg); } .attn-c.ok .attn-ic svg { color: var(--ok); }
/* Обзор: мои задачи */
.ovtask { display: flex; align-items: center; gap: 11px; padding: 9px 2px; border-bottom: 1px solid var(--stroke-soft); }
.ovtask:last-child { border-bottom: none; }
.ovtask-ck { width: 24px; height: 24px; flex: 0 0 24px; border-radius: 7px; border: 1.6px solid var(--stroke); background: transparent; cursor: pointer; display: grid; place-items: center; color: transparent; transition: .12s; }
.ovtask-ck svg { width: 13px; height: 13px; }
.ovtask-ck:hover { border-color: var(--ok); color: var(--ok); background: var(--ok-bg); }
.ovtask-ck.add { border-style: dashed; }
.ovtask-ck.add:hover { border-color: var(--accent); color: var(--accent); background: var(--blue-100); }
.ovtask-t { font-size: 13px; color: var(--navy-900); line-height: 1.35; }
.ovtask-t i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); margin-top: 1px; }
.ovtask-t i.over { color: var(--bad); font-weight: 600; }
.ovtask.sug { opacity: .85; }
/* Обзор: ближайшие встречи */
.ovmeet { display: flex; align-items: center; gap: 12px; padding: 9px 2px; border-bottom: 1px solid var(--stroke-soft); cursor: pointer; }
.ovmeet:last-child { border-bottom: none; }
.ovmeet:hover { background: var(--blue-100); border-radius: 8px; }
.ovmeet-tm { text-align: center; flex: 0 0 52px; }
.ovmeet-tm b { display: block; font-size: 15px; font-weight: 750; color: var(--navy-900); }
.ovmeet-tm i { font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.ovmeet-b { flex: 1; min-width: 0; }
.ovmeet-n { font-size: 13px; font-weight: 600; color: var(--navy-900); }
.ovmeet-k { font-size: 11.5px; color: var(--ink-3); }
.funnel-row { display: flex; align-items: center; gap: 12px; padding: 7px 0; }
.funnel-row .fl { width: 130px; font-size: 12.5px; color: var(--ink-2); }
.funnel-row .bar-wrap { flex: 1; height: 22px; border-radius: 7px; background: var(--bg-2); overflow: hidden; }
.funnel-row .bar {
  height: 100%; border-radius: 7px; min-width: 3px;
  background: linear-gradient(90deg, var(--accent), var(--blue-300));
  transition: width .5s ease;
}
.funnel-row .fv { width: 30px; text-align: right; font-weight: 650; font-size: 13px; color: var(--navy-900); }
.feed { display: flex; flex-direction: column; }
.feed-item { display: flex; gap: 12px; padding: 10px 2px; border-bottom: 1px solid var(--stroke-soft); }
.feed-item:last-child { border-bottom: none; }
.feed-dot { width: 26px; height: 26px; flex: 0 0 26px; border-radius: 9px; display: grid; place-items: center; background: var(--blue-100); }
.feed-dot svg { width: 13px; height: 13px; color: var(--accent); }
.feed-dot.ok { background: var(--ok-bg); } .feed-dot.ok svg { color: var(--ok); }
.feed-dot.warn { background: var(--warn-bg); } .feed-dot.warn svg { color: var(--warn); }
.feed-text { font-size: 12.8px; color: var(--ink-2); line-height: 1.45; }
.feed-time { font-size: 11px; color: var(--ink-3); margin-top: 1px; }

/* ---------- сравнение человек/ИИ: тёмная hero-панель ---------- */
.vs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.vs-col { padding: 16px 18px; border-radius: var(--r-md); background: var(--bg); border: 1px solid var(--stroke); }
.vs-col.ai {
  background:
    radial-gradient(320px 190px at 90% -20%, color-mix(in srgb, var(--accent) 38%, transparent), transparent 65%),
    linear-gradient(155deg, var(--navy-700), var(--navy-950) 80%);
  border-color: var(--navy-700);
  box-shadow: var(--shadow-lift);
}
.vs-col .hd { font-size: 11.5px; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 12px; }
.vs-col.ai .hd { color: color-mix(in srgb, var(--accent) 35%, #fff); }
.vs-row { display: flex; justify-content: space-between; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--stroke-soft); }
.vs-row:last-child { border-bottom: none; }
.vs-row .k { font-size: 12px; color: var(--ink-3); }
.vs-row .v { font-size: 15px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.vs-col.ai .vs-row { border-bottom-color: color-mix(in srgb, var(--accent) 16%, transparent); }
.vs-col.ai .vs-row .k { color: rgba(255,255,255,.74); }   /* тёмная navy-колонка → СВЕТЛЫЙ текст (был сломан на var(--ink-3)) */
.vs-col.ai .vs-row .v { color: #fff; }

/* ---------- канбан ---------- */
.kanban { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 12px; align-items: flex-start; }
.kb-col { min-width: 250px; width: 250px; flex: 0 0 250px; }
.kb-col { --stg: #6B7A99; }
.kb-head { display: flex; align-items: center; gap: 8px; padding: 8px 8px 10px; border-top: 2px solid color-mix(in srgb, var(--stg) 65%, transparent); }
.kb-head .kb-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; background: var(--stg); box-shadow: 0 0 0 3px color-mix(in srgb, var(--stg) 16%, transparent); }
.kb-head .kb-ic { display: inline-flex; color: var(--stg); }
.kb-head .kb-ic svg { width: 15px; height: 15px; }
.kb-head .nm { font-size: 12.5px; font-weight: 650; color: var(--ink-2); }
.kb-head .ct { font-size: 11px; font-weight: 600; color: var(--stg); background: color-mix(in srgb, var(--stg) 12%, var(--card)); border: 1px solid color-mix(in srgb, var(--stg) 28%, transparent); padding: 1px 7px; border-radius: 10px; margin-left: auto; }
.kb-cards { display: flex; flex-direction: column; gap: 10px; min-height: 30px; }
.kb-col.drop .kb-cards { outline: 2px dashed var(--accent-2); outline-offset: 4px; border-radius: 12px; background: var(--blue-100); }
.lead-card { touch-action: none; user-select: none; -webkit-user-select: none; }
.lead-card { padding: 13px 14px; border-radius: var(--r-md); cursor: pointer; transition: transform .12s, box-shadow .15s, border-color .15s; }
.lead-card:hover { transform: translateY(-1px); border-color: var(--hover-bd); box-shadow: var(--shadow-lift); }
.lead-card .top { display: flex; align-items: center; gap: 8px; }
.lead-card .nm { font-size: 13px; font-weight: 650; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--navy-900); }
.lead-card .geo { font-size: 11px; color: var(--ink-3); margin-top: 3px; }
.score-ring { position: relative; width: 30px; height: 30px; flex: 0 0 30px; }
.score-ring svg { width: 30px; height: 30px; transform: rotate(-90deg); }
.score-ring .txt { position: absolute; inset: 0; display: grid; place-items: center; font-size: 8.5px; font-weight: 700; color: var(--ink-2); }
.axes { display: flex; gap: 4px; margin-top: 9px; }
.axes i { flex: 1; height: 4px; border-radius: 3px; background: var(--bg-2); }
.axes i.on { background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.lead-card .foot { display: flex; align-items: center; gap: 7px; margin-top: 9px; flex-wrap: wrap; }
.lead-card .foot .tm { font-size: 10.5px; color: var(--ink-3); margin-left: auto; }
.mini-badge { font-size: 10px; font-weight: 600; padding: 2px 7px; border-radius: 12px; background: var(--bg-2); color: var(--ink-2); }
.mini-badge.ai { color: var(--accent); background: var(--blue-100); }
.mini-badge.warn { color: var(--warn); background: var(--warn-bg); }
.mini-badge.ok { color: var(--ok); background: var(--ok-bg); }

/* ---------- инбокс ---------- */
.inbox { display: grid; grid-template-columns: 290px 1fr 310px; gap: 14px; height: calc(100vh - 128px); }
.conv-list { overflow: hidden; padding: 0; display: flex; flex-direction: column; }
.conv-head { padding: 10px; border-bottom: 1px solid var(--stroke-soft); display: flex; flex-direction: column; gap: 8px; flex: 0 0 auto; }
.conv-items { overflow-y: auto; padding: 8px; flex: 1; }
.conv-search-wrap { position: relative; display: flex; align-items: center; }
.conv-search-wrap svg { position: absolute; left: 10px; width: 14px; height: 14px; color: var(--ink-3); pointer-events: none; }
.conv-search { width: 100%; padding: 8px 10px 8px 31px; font-size: 13px; }
.conv-broker { width: 100%; font-size: 12.5px; padding: 8px 10px; }
.conv-segs { display: flex; flex-wrap: wrap; gap: 5px; }
.conv-seg { font-size: 11px; font-weight: 600; color: var(--ink-3); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 20px; padding: 4px 10px; cursor: pointer; transition: color .15s, background .15s; }
.conv-seg:hover { color: var(--ink); }
.conv-seg.on { background: var(--navy-900); color: #fff; border-color: var(--navy-900); }
.conv {
  display: flex; gap: 11px; padding: 11px 12px; border-radius: var(--r-md);
  cursor: pointer; transition: background .15s; align-items: center;
}
.conv:hover { background: var(--bg); }
.conv.active { background: var(--blue-100); box-shadow: inset 0 0 0 1px var(--accent-soft-bd); }
.ava {
  width: 36px; height: 36px; border-radius: 12px; flex: 0 0 36px;
  display: grid; place-items: center; font-size: 12px; font-weight: 650; color: var(--navy-700);
  background: linear-gradient(135deg, #E3ECFB, #CEDCF5); border: 1px solid #C8D6EC;
}
.conv .meta { flex: 1; min-width: 0; }
.conv .nm { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--navy-900); }
.conv .prev { font-size: 11.5px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 2px; }
.conv .tm { font-size: 10.5px; color: var(--ink-3); align-self: flex-start; padding-top: 2px; }
.conv .unread { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }

.chat { display: flex; flex-direction: column; overflow: hidden; position: relative; }
/* ⭐ ИИ на связи: живая полоса МЕЖДУ перепиской и полем ввода (в потоке, не поверх сообщений).
   Верх РАСТВОРЯЕТСЯ в переписку (маска + градиент, без жёсткой линии), низ упирается в композер.
   Насыщенная — аврора + акцентное свечение, не блёклая. */
.chat-ai-aura { position: relative; flex: none; max-height: 0; overflow: hidden; opacity: 0; transition: max-height .5s var(--ease-soft, ease), opacity .5s; background: #F6F9FD; }
/* фон полосы = базовый цвет ленты сообщений канала → полоса бесшовна с чатом, никакого «белого ящика» */
.chat--wa .chat-ai-aura { background: #EAE4DA; }
.chat--tg .chat-ai-aura { background: #DCE9F6; }
.chat--viber .chat-ai-aura { background: #EAE2F8; }
.chat--email .chat-ai-aura { background: #EEF1F5; }
.chat.ai-live .chat-ai-aura { max-height: 62px; opacity: 1; }
/* живое свечение БЕЗ фона: два дрейфующих световых пятна (accent + accent-2), тают кверху.
   Никакого видео/прямоугольника — чистый CSS, прозрачная база → бесшовно вписывается в чат. */
.chat-ai-aura::before { content: ''; position: absolute; inset: -30% -8% 0 -8%; z-index: 0; pointer-events: none;
  background:
    radial-gradient(42% 130% at 26% 100%, color-mix(in srgb, var(--accent) 42%, transparent), transparent 68%),
    radial-gradient(40% 130% at 74% 100%, color-mix(in srgb, var(--blue-300, var(--blue-300)) 40%, transparent), transparent 68%);
  -webkit-mask: linear-gradient(0deg, #000 16%, transparent 90%); mask: linear-gradient(0deg, #000 16%, transparent 90%);
  animation: aiAuraDrift 6.5s ease-in-out infinite; }
@keyframes aiAuraDrift { 0%, 100% { transform: translateX(-5%) scaleY(1); opacity: .9; } 50% { transform: translateX(5%) scaleY(1.12); opacity: 1; } }
.chat-ai-pill { position: relative; z-index: 1; height: 62px; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 9px; gap: 8px; white-space: nowrap; color: color-mix(in srgb, var(--accent) 90%, var(--navy-900)); font-size: 11.5px; font-weight: 700; letter-spacing: .01em; text-shadow: 0 1px 8px color-mix(in srgb, var(--paper, #fff) 85%, transparent); }
.chat-ai-pill svg { width: 14px; height: 14px; color: var(--accent); }
.chat-ai-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 70%, transparent); animation: aiBreath 1.9s ease-in-out infinite; }
@keyframes aiBreath { 0%, 100% { opacity: .4; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.3); } }
@media (prefers-reduced-motion: reduce) { .chat-ai-dot, .chat-ai-aura::before { animation: none; } }
.chat-head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--stroke-soft); }
.chat-head .nm { font-weight: 650; font-size: 14.5px; color: var(--navy-900); }
.chat-head .ph { font-size: 12px; color: var(--ink-3); }
.chat-body { flex: 1; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 10px; background: linear-gradient(180deg, #FBFCFE, #F6F9FD); }
.bubble {
  max-width: 72%; padding: 10px 14px; border-radius: 16px; font-size: 13.2px; line-height: 1.5;
  position: relative; word-wrap: break-word;
}
.bubble-media { display: block; width: 100%; max-width: 240px; border-radius: 10px; margin: -2px 0 6px; background: #0b1220; }
.bubble-media:last-child { margin-bottom: 0; }
/* дерево креативов */
.ct-wrap .ct-stat { margin-left: auto; font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ct-note { font-size: 11px; line-height: 1.45; margin-bottom: 10px; }
.ct-wrap { max-width: 820px; }   /* дерево не растягиваем на всю ширину — компактная колонка */
.ct-pl { flex: none; font-size: 9.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: #fff; background: var(--c, #888); padding: 3px 8px; border-radius: 20px; }
.ct-camp { border: 1px solid var(--stroke); border-radius: 9px; padding: 7px 9px; margin-bottom: 6px; background: var(--bg-2); }
.ct-camp-hd { display: flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 700; color: var(--navy-900); }
.ct-camp-n { margin-left: auto; font-size: 10px; font-weight: 500; color: var(--ink-3); }
.ct-adset { margin: 6px 0 0; padding-left: 9px; border-left: 2px solid var(--stroke); }
.ct-adset-hd { display: flex; align-items: center; gap: 7px; font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px; }
.ct-adset-hd span { margin-left: auto; font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--ink-3); font-size: 9.5px; }
.ct-ads { display: flex; flex-direction: column; gap: 3px; }
.ct-ad { background: var(--card); border: 1px solid var(--stroke); border-radius: 8px; overflow: hidden; }
.ct-ad-hd { display: flex; align-items: center; gap: 8px; padding: 4px 8px; cursor: pointer; transition: background .14s; }
.ct-ad-hd:hover { background: color-mix(in srgb, var(--accent) 4%, transparent); }
.ct-ad-hd .ct-th { flex: 0 0 26px !important; width: 26px !important; height: 26px !important; align-self: center !important; }
.ct-th { flex: none; width: 26px; height: 26px; border-radius: 6px; background: var(--bg-2) center/cover no-repeat; display: grid; place-items: center; color: var(--ink-3); overflow: hidden; }
.ct-th.vid { background: #0b1220 center/cover no-repeat; color: #fff; }
.ct-th.empty { opacity: .45; }
.ct-th svg { width: 12px; height: 12px; }
.ct-ad-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 0; }
.ct-ad-nm b { font-size: 11.5px; font-weight: 600; color: var(--navy-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct-ad-nm span { font-size: 9.5px; color: var(--ink-3); }
.ct-flags { display: flex; gap: 5px; flex: none; align-items: center; }
.ct-dot { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.ct-dot.ok { background: #2FA98C; } .ct-dot.ok2 { background: var(--accent); }
.ct-edit { flex: none; --btn-pad: 3px 9px; font-size: 11px; }
.ct-ed { padding: 0 8px 9px; border-top: 1px solid var(--stroke); }
.ct-ed-grid { display: grid; grid-template-columns: 170px 1fr; gap: 11px; margin-top: 8px; align-items: start; }
.ct-ed-lbl { font-size: 10.5px; font-weight: 600; color: var(--ink-3); margin-bottom: 5px; }
.ct-prev { display: none; }
.ct-prev.has { display: block; border-radius: 9px; overflow: hidden; background: var(--bg-2); margin-bottom: 7px; max-width: 220px; }
.ct-prev.has video, .ct-prev.has img { width: 100%; max-height: 150px; object-fit: cover; display: block; }
.ct-crea-acts { display: flex; gap: 7px; margin-bottom: 6px; }
.ct-ed .ct-media, .ct-ed .ct-points { width: 100%; border: 1px solid var(--stroke); border-radius: 9px; padding: 8px 10px; font: inherit; font-size: 12.5px; background: var(--card); color: var(--navy-900); }
.ct-ed .ct-points { resize: vertical; line-height: 1.5; }
.ct-ed-foot { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.ct-up-status { font-size: 11px; color: var(--ink-3); }
.adadd-row { display: grid; grid-template-columns: 1.2fr 1.4fr .8fr auto; gap: 7px; align-items: center; margin-bottom: 6px; }
.adadd-row .adadd { border: 1px solid var(--stroke); border-radius: 9px; padding: 8px 10px; font: inherit; font-size: 12.5px; background: var(--card); color: var(--navy-900); min-width: 0; }
@media (max-width: 560px) { .adadd-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 680px) { .ct-ed-grid { grid-template-columns: 1fr; } .ct-prev.has, .ct-prev.has video, .ct-prev.has img { max-width: 100%; } }
/* калькулятор расходников */
.bc-lines { display: flex; flex-direction: column; gap: 2px; }
.bc-line { display: flex; align-items: center; gap: 12px; padding: 9px 2px; border-bottom: 1px solid var(--stroke); }
.bc-line:last-child { border-bottom: 0; }
.bc-line-l { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.bc-line-l b { font-size: 13px; color: var(--navy-900); font-weight: 600; }
.bc-line-l span { font-size: 11.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.bc-line-c { font-size: 15px; font-weight: 650; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.bc-sum { margin-top: 12px; padding-top: 12px; border-top: 2px solid var(--stroke); display: flex; flex-direction: column; gap: 7px; }
.bc-sum-row { display: flex; justify-content: space-between; align-items: baseline; font-size: 13px; color: var(--ink-2); }
.bc-sum-row b { font-size: 16px; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.bc-forecast { padding: 9px 12px; margin: 2px -2px 0; background: color-mix(in srgb, var(--accent) 7%, transparent); border-radius: 10px; }
.bc-forecast b { color: var(--accent); font-size: 18px; }
.bc-rates { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--stroke); }
.bc-rates-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bc-rates-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; color: var(--ink-3); }
.bc-rates-grid input { padding: 7px 10px; border: 1px solid var(--stroke); border-radius: 9px; font-size: 13px; font-family: inherit; }
@media (max-width: 560px) { .bc-rates-grid { grid-template-columns: 1fr; } }
.bubble.in { align-self: flex-start; background: var(--card); border: 1px solid var(--stroke); border-bottom-left-radius: 6px; color: var(--ink); box-shadow: 0 1px 2px rgba(16, 43, 92, .04); }
.bubble.out {
  align-self: flex-end; border-bottom-right-radius: 6px; color: #fff;
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  border: none; box-shadow: 0 4px 14px -6px color-mix(in srgb, var(--accent) 45%, transparent);
}
.bubble .bmeta { display: flex; gap: 6px; align-items: center; font-size: 10px; margin-top: 5px; opacity: .7; justify-content: flex-end; }
.bubble.in .bmeta { justify-content: flex-start; color: var(--ink-3); opacity: 1; }
.via-tag { font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 1px 6px; border-radius: 8px; background: rgba(255, 255, 255, .22); }
.bubble.in .via-tag { background: var(--blue-100); color: var(--accent); }
.day-sep { align-self: center; font-size: 10.5px; color: var(--ink-3); background: var(--card); border: 1px solid var(--stroke-soft); padding: 3px 12px; border-radius: 12px; margin: 6px 0; }
.composer { display: flex; gap: 10px; padding: 14px 16px; border-top: 1px solid var(--stroke-soft); align-items: flex-end; background: var(--card); border-radius: 0 0 var(--r-lg) var(--r-lg); }
/* flex:1 1 0 (basis 0) — textarea растёт от нуля и заполняет остаток на КАЖДОМ рендере (было 1 1 auto+width:100% → intrinsic ~185px при первом открытии) */
.composer textarea { flex: 1 1 0; min-width: 0; width: auto; min-height: 42px; max-height: 120px; background: var(--bg); }
.composer .btn, .composer button { flex: 0 0 auto; }
.chat-empty { flex: 1; display: grid; place-items: center; color: var(--ink-3); font-size: 13px; }

.lead-panel { overflow-y: auto; padding: 18px; }
.lp-name { font-size: 16px; font-weight: 700; color: var(--navy-900); }
.lp-sub { font-size: 12px; color: var(--ink-3); margin: 3px 0 14px; }
.lp-sec { font-size: 10.5px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); margin: 18px 0 9px; }
.axis { padding: 9px 12px; border-radius: var(--r-sm); background: var(--bg); border: 1px solid var(--stroke-soft); margin-bottom: 7px; }
.axis .ax-top { display: flex; justify-content: space-between; align-items: center; }
.axis .ax-name { font-size: 11px; color: var(--ink-3); font-weight: 600; }
.axis .ax-val { font-size: 12.8px; font-weight: 650; margin-top: 3px; color: var(--navy-900); }
.axis .ax-quote { font-size: 11px; color: var(--ink-3); font-style: italic; margin-top: 4px; border-left: 2px solid var(--blue-300); padding-left: 8px; }
.axis.blank .ax-val { color: var(--ink-3); font-weight: 400; }
.axis.done { border-color: #C4E6D6; background: #F7FCFA; }
.summary-box {
  font-size: 12.5px; line-height: 1.55; color: #E3EAFB;
  background:
    radial-gradient(260px 150px at 100% -30%, color-mix(in srgb, var(--accent) 35%, transparent), transparent 65%),
    linear-gradient(155deg, var(--navy-700), var(--navy-950) 85%);
  border: none; border-radius: var(--r-md); padding: 13px 14px;
  box-shadow: var(--shadow-lift);
}
.lp-actions { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.lp-actions .btn { justify-content: center; }

/* ---------- переключатель ---------- */
.switch { position: relative; width: 38px; height: 22px; flex: 0 0 38px; cursor: pointer; }
.switch input { display: none; }
.switch .tr { position: absolute; inset: 0; border-radius: 20px; background: #D4DCE8; border: 1px solid #C6D0DF; transition: background .2s; }
.switch .th { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(16, 43, 92, .25); transition: transform .2s; }
.switch input:checked + .tr { background: var(--accent); border-color: var(--accent); }
.switch input:checked + .tr + .th { transform: translateX(16px); }
.set-row { display: flex; align-items: center; gap: 14px; padding: 13px 2px; border-bottom: 1px solid var(--stroke-soft); }
.set-row:last-child { border-bottom: none; }
.set-row .sl { font-size: 13.5px; font-weight: 600; color: var(--navy-900); display: flex; align-items: center; gap: 7px; }
.set-row .sl svg { width: 15px; height: 15px; flex: 0 0 15px; color: var(--accent); }
.set-row .sd { font-size: 11.8px; color: var(--ink-3); margin-top: 2px; line-height: 1.45; }
.set-row .sp { flex: 1; }

/* ---------- касания (таймлайн) ---------- */
.seq { position: relative; padding-left: 26px; }
.seq::before { content: ''; position: absolute; left: 8px; top: 12px; bottom: 12px; width: 2px; background: linear-gradient(180deg, var(--accent), var(--blue-100)); border-radius: 2px; }
.seq-step { position: relative; padding: 12px 14px; margin-bottom: 10px; border-radius: var(--r-md); background: var(--card); border: 1px solid var(--stroke); display: flex; gap: 13px; align-items: center; box-shadow: 0 1px 2px rgba(16, 43, 92, .04); }
.seq-step::before {
  content: ''; position: absolute; left: -23px; top: 50%; transform: translateY(-50%);
  width: 10px; height: 10px; border-radius: 50%; background: var(--accent);
  box-shadow: 0 0 0 4px var(--blue-100);
}
.seq-step.off { opacity: .5; }
.seq-step.off::before { background: #B7C2D4; box-shadow: none; }
.seq-day { font-size: 10.5px; font-weight: 700; color: var(--accent); background: var(--blue-100); padding: 3px 9px; border-radius: 10px; white-space: nowrap; }
.seq-step .st-name { font-size: 13px; font-weight: 650; color: var(--navy-900); }
.seq-step .st-desc { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }

/* ---------- реанимация ---------- */
.seg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 16px; }
.seg { padding: 14px 16px; border-radius: var(--r-md); border: 1px solid var(--stroke); background: var(--card); box-shadow: var(--shadow); }
.seg .sg-hd { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 650; }
.seg .sg-hd svg { width: 15px; height: 15px; }
.seg .sg-num { font-size: 24px; font-weight: 700; margin-top: 6px; color: var(--navy-900); }
.seg .sg-sub { font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.seg.a { border-top: 3px solid #23B383; } .seg.a .sg-hd { color: var(--ok); }
.seg.b { border-top: 3px solid #E4B33D; } .seg.b .sg-hd { color: var(--warn); }
.seg.c { border-top: 3px solid #B7C2D4; } .seg.c .sg-hd { color: var(--ink-3); }
table.tbl { width: 100%; border-collapse: collapse; font-size: 12.8px; }
.tbl th { text-align: left; font-size: 10.5px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--navy-700); padding: 8px 10px; border-bottom: 2px solid var(--stroke); }
.tbl td { padding: 10px; border-bottom: 1px solid var(--stroke-soft); vertical-align: middle; }
.tbl td b { color: var(--navy-900); }
.tbl tr:hover td { background: var(--bg); }
.wake-score { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; color: var(--navy-900); }
.wake-bar { width: 54px; height: 5px; border-radius: 4px; background: var(--bg-2); overflow: hidden; }
.wake-bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--accent), #23B383); }
.cmp-card { padding: 18px 20px; margin-bottom: 14px; }
.cmp-head { display: flex; align-items: center; gap: 12px; }
.cmp-head .nm { font-size: 14.5px; font-weight: 650; flex: 1; color: var(--navy-900); }
.cmp-stats { display: flex; gap: 22px; margin: 14px 0; flex-wrap: wrap; }
.cmp-stat .v { font-size: 20px; font-weight: 700; color: var(--navy-900); }
.cmp-stat .k { font-size: 11px; color: var(--ink-3); margin-top: 1px; }
.cmp-log { font-size: 11.5px; color: var(--ink-3); max-height: 90px; overflow-y: auto; border-top: 1px solid var(--stroke-soft); padding-top: 9px; line-height: 1.7; }
.progress { height: 6px; border-radius: 5px; background: var(--bg-2); overflow: hidden; margin-top: 10px; }
.progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent-2)); border-radius: 5px; transition: width .4s; }

/* ---------- номера ---------- */
.num-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)); gap: 14px; }
.num-card { padding: 18px; }
.num-head { display: flex; align-items: center; gap: 11px; }
.num-head .ph { font-size: 14.5px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--navy-900); }
.num-head .lb { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.num-head .lb b { color: var(--accent); font-weight: 650; }
.q-ring { margin-left: auto; position: relative; width: 46px; height: 46px; }
.q-ring svg { width: 46px; height: 46px; transform: rotate(-90deg); }
.q-ring .txt { position: absolute; inset: 0; display: grid; place-items: center; font-size: 11px; font-weight: 700; color: var(--navy-900); }
.num-meta { display: flex; gap: 16px; margin: 13px 0 4px; }
.num-meta .m .v { font-size: 14px; font-weight: 700; color: var(--navy-900); }
.num-meta .m .k { font-size: 10.5px; color: var(--ink-3); }
.num-actions { display: flex; gap: 8px; }

/* ---------- аналитика ---------- */
.geo-bars { display: flex; flex-direction: column; gap: 12px; }
.geo-bar .g-top { display: flex; justify-content: space-between; font-size: 12.5px; margin-bottom: 5px; color: var(--ink-2); }
.geo-bar .g-top b { font-size: 13px; color: var(--navy-900); }
.geo-bar .g-track { height: 8px; border-radius: 6px; background: var(--bg-2); overflow: hidden; }
.geo-bar .g-fill { height: 100%; border-radius: 6px; background: linear-gradient(90deg, var(--navy-700), var(--accent-2)); transition: width .5s; }

/* ---------- аналитика: тренд / брокеры / источники / цепочки ---------- */
.an-legend { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-3); }
.an-legend i { width: 9px; height: 9px; border-radius: 2px; display: inline-block; margin-left: 6px; }
.an-legend .l-tot { background: color-mix(in srgb, var(--accent) 32%, transparent); } .an-legend .l-qual { background: #2FA98C; }
.an-trend { display: flex; align-items: flex-end; gap: 6px; height: 118px; padding-top: 6px; }
.an-tbar { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px; height: 100%; justify-content: flex-end; }
.an-tstk { position: relative; width: 100%; max-width: 26px; flex: 1; display: flex; align-items: flex-end; }
.an-tstk i { position: absolute; bottom: 0; left: 0; right: 0; border-radius: 4px 4px 0 0; }
.an-tstk .tot { background: color-mix(in srgb, var(--accent) 24%, transparent); }
.an-tstk .qual { background: #2FA98C; }
.an-tbar span { font-size: 9.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.an-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.an-tbl th { text-align: left; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); padding: 4px 8px 8px; border-bottom: 1px solid var(--stroke); }
.an-tbl td { padding: 8px; border-bottom: 1px solid var(--stroke-soft); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.an-tbl td b { color: var(--navy-900); font-weight: 600; }
.an-tbl tr:last-child td { border-bottom: none; }
.an-tbl th:not(:first-child), .an-tbl td:not(:first-child) { text-align: center; width: 62px; }
.an-brokers td:last-child, .an-brokers th:last-child { width: 96px; }
.an-cvbar { height: 6px; border-radius: 4px; background: var(--bg-2); overflow: hidden; display: inline-block; width: 52px; vertical-align: middle; margin-right: 6px; }
.an-cvbar i { display: block; height: 100%; background: linear-gradient(90deg, var(--navy-700), var(--accent-2)); }
.an-deal { display: inline-block; min-width: 20px; padding: 2px 7px; border-radius: 20px; background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent); font-weight: 700; }
.an-chains { display: flex; flex-direction: column; gap: 11px; }
.an-chain { border: 1px solid var(--stroke); border-radius: 12px; padding: 12px 14px; background: var(--bg-2); }
.an-chain-hd { display: flex; align-items: baseline; gap: 9px; margin-bottom: 10px; }
.an-chain-hd b { font-size: 13.5px; color: var(--navy-900); } .an-chain-hd span { font-size: 11px; color: var(--ink-3); }
.an-chain-funnel { display: flex; align-items: center; gap: 4px; }
.acf-step { display: flex; flex-direction: column; align-items: center; min-width: 58px; padding: 6px 4px; border-radius: 9px; background: var(--card); border: 1px solid var(--stroke-soft); }
.acf-step b { font-size: 17px; font-weight: 700; color: var(--navy-900); } .acf-step span { font-size: 10px; color: var(--ink-3); }
.acf-step.acc { background: color-mix(in srgb, #2FA98C 12%, var(--card)); border-color: color-mix(in srgb, #2FA98C 30%, transparent); }
.acf-step.acc b { color: #1E7A64; }
.acf-arrow { display: flex; flex-direction: column; align-items: center; color: var(--ink-3); flex: 1; min-width: 24px; }
.acf-arrow svg { width: 15px; height: 15px; } .acf-arrow em { font-style: normal; font-size: 10px; font-weight: 700; color: var(--accent-2); }
.an-chain-track { position: relative; height: 7px; border-radius: 5px; background: var(--bg); overflow: hidden; margin-top: 11px; }
.an-chain-track i { position: absolute; top: 0; bottom: 0; left: 0; border-radius: 5px; }
.an-chain-track .a { background: color-mix(in srgb, var(--accent) 16%, transparent); } .an-chain-track .b { background: color-mix(in srgb, var(--accent-2) 45%, transparent); } .an-chain-track .c { background: #2FA98C; }
.an-funnel-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.afc { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-2); background: var(--bg-2); border: 1px solid var(--stroke-soft); border-radius: 20px; padding: 5px 11px; }
.afc b { color: var(--navy-900); font-weight: 700; font-variant-numeric: tabular-nums; }

/* ---------- воронка: контрол цепочек касаний — компактный чип + слим-панель ---------- */
.cc-chip { position: relative; }
.cc-chip.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--card)); }
.cc-chip .cc-chip-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--ink-3); display: inline-block; margin-left: 2px; }
.cc-chip .cc-chip-dot.on { background: #2FA98C; box-shadow: 0 0 0 3px color-mix(in srgb, #2FA98C 20%, transparent); }
.cc-panel { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 11px 15px; margin: -4px 0 14px; border-radius: 12px; }
.cc-panel[hidden] { display: none; }
.cc-panel .cc-sw { flex: none; }
.cc-panel .cc-txt { display: flex; flex-direction: column; gap: 1px; }
.cc-panel .cc-txt b { font-size: 12.5px; font-weight: 700; color: var(--navy-900); }
.cc-panel .cc-txt i { font-style: normal; font-size: 11px; color: var(--ink-3); }
.cc-panel .cc-seqpick { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--ink-3); transition: opacity .18s; }
.cc-panel .cc-seqpick.off { opacity: .4; pointer-events: none; }
.cc-panel .cc-seqpick select { border: 1px solid var(--stroke); border-radius: 9px; padding: 6px 10px; font: inherit; font-size: 12.5px; background: var(--card); color: var(--navy-900); }
.cc-panel .cc-hint { font-size: 11.5px; color: var(--ink-3); }

/* ---------- шаблоны ---------- */
.tpl-card { padding: 16px 18px; margin-bottom: 12px; }
.tpl-head { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.tpl-head .nm { font-weight: 650; font-size: 13.5px; flex: 1; color: var(--navy-900); }
.tpl-body { font-size: 12.8px; color: var(--ink-2); line-height: 1.55; background: var(--bg); border: 1px solid var(--stroke-soft); border-radius: var(--r-sm); padding: 11px 13px; }

/* ---------- брокеры ---------- */
.broker-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.broker-card { padding: 18px; display: flex; gap: 14px; }
.broker-card .bmeta { flex: 1; }
.broker-card .nm { font-size: 14px; font-weight: 650; color: var(--navy-900); }
.broker-card .gl { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.load-track { height: 6px; border-radius: 5px; background: var(--bg-2); overflow: hidden; margin-top: 10px; }
.load-track i { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, #23B383, #E4B33D); }

/* ---------- модалки/тосты: здесь стекло уместно ---------- */
.modal-bd {
  position: fixed; inset: 0; background: rgba(6, 17, 38, .45);
  backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px);
  display: grid; place-items: center; z-index: 100; opacity: 0; transition: opacity .22s var(--ease-soft);
}
.modal-bd.show { opacity: 1; }
.modal {
  width: 560px; max-width: calc(100vw - 40px); max-height: 88vh; overflow-y: auto;
  padding: 24px; transform: translateY(18px) scale(.97); transition: transform .38s var(--ease-spring);
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
  border: 1px solid rgba(255, 255, 255, .7);
  box-shadow: 0 24px 70px -20px rgba(6, 17, 38, .45);
  border-radius: var(--r-lg);
}
.modal-bd.show .modal { transform: none; }
.modal h3 { font-size: 16px; font-weight: 700; margin-bottom: 4px; color: var(--navy-900); }
.modal .m-sub { font-size: 12.5px; color: var(--ink-3); margin-bottom: 16px; line-height: 1.5; }
.form-row { margin-bottom: 13px; }
.form-row label { display: block; font-size: 11.5px; font-weight: 600; color: var(--ink-3); margin-bottom: 5px; }
.form-row input, .form-row select, .form-row textarea { width: 100%; }
.m-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 18px; }
.toasts { position: fixed; bottom: 24px; right: 24px; display: flex; flex-direction: column; gap: 10px; z-index: 200; }
.toast {
  min-width: 260px; max-width: 360px; padding: 13px 16px; border-radius: var(--r-md);
  font-size: 13px; transform: translateX(26px) scale(.97); opacity: 0; transition: all .38s var(--ease-spring);
  display: flex; gap: 10px; align-items: flex-start; color: var(--navy-900); font-weight: 550;
  background: rgba(255, 255, 255, .9);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255, 255, 255, .7);
  box-shadow: 0 16px 44px -14px rgba(6, 17, 38, .35);
}
.toast.show { transform: none; opacity: 1; }
.toast .t-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; font-weight: 400; }
.toast svg { width: 16px; height: 16px; flex: 0 0 16px; margin-top: 1px; color: var(--accent); }
.toast.ok svg { color: var(--ok); }

/* ---------- прелоадер: кобальтовый вихрь ---------- */
#preloader {
  position: fixed; inset: 0; z-index: 1000; background: var(--navy-950);
  display: grid; place-items: center; transition: opacity .6s var(--ease-soft), visibility .6s;
}
#preloader.hide { opacity: 0; visibility: hidden; pointer-events: none; }
#preloader video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; }
#preloader::after { content: ''; position: absolute; inset: 0; background: radial-gradient(closest-side, transparent 30%, rgba(6, 17, 38, .55)); }
.pl-center { position: relative; z-index: 2; text-align: center; }
.pl-logo { width: 52px; height: 62px; margin: 0 auto 16px; display: block; animation: logoBreath 2.4s var(--ease-soft) infinite; }
@keyframes logoBreath {
  0%, 100% { transform: scale(1); filter: drop-shadow(0 0 18px color-mix(in srgb, var(--accent) 45%, transparent)); }
  50% { transform: scale(1.07); filter: drop-shadow(0 0 34px rgba(122, 165, 255, .8)); }
}
.pl-word { font-size: 21px; font-weight: 650; letter-spacing: .3em; color: #fff; }
.pl-sub { font-size: 10px; letter-spacing: .2em; color: var(--blue-300); margin-top: 6px; }

/* ---------- сворачиваемые группы (spring-раскрытие) ---------- */
.coll { border: 1px solid var(--stroke-soft); border-radius: var(--r-md); margin: 10px 0; background: var(--card); overflow: hidden; }
.coll-head {
  display: flex; align-items: center; gap: 9px; width: 100%; padding: 11px 14px;
  font-size: 12.8px; font-weight: 650; color: var(--navy-900); text-align: left;
  transition: background var(--dur-fast) var(--ease-soft);
}
.coll-head:hover { background: var(--bg); }
.coll-head .ch-ic svg { width: 14px; height: 14px; color: var(--accent); }
.coll-head .ch-cnt { font-size: 10.5px; font-weight: 650; color: var(--ink-3); background: var(--bg-2); padding: 1px 8px; border-radius: 10px; }
.coll-head .chev { margin-left: auto; }
.coll-head .chev svg { width: 14px; height: 14px; color: var(--ink-3); transition: transform var(--dur) var(--ease-spring); }
.coll.open .chev svg { transform: rotate(90deg); }
.coll-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .5s var(--ease-spring); }
.coll.open .coll-body { grid-template-rows: 1fr; }
.coll-inner { overflow: hidden; padding: 0 14px; }
.coll.open .coll-inner { padding-bottom: 12px; }

/* ---------- канбан: иконки стадий ---------- */
.kb-head .kb-ic svg { width: 13px; height: 13px; color: var(--accent); opacity: .8; }

/* ---------- глобальный поиск ---------- */
.gsearch { position: relative; display: flex; align-items: center; gap: 8px; width: 300px; }
.gsearch > svg { position: absolute; left: 11px; width: 15px; height: 15px; color: var(--ink-3); pointer-events: none; }
.gsearch input { width: 100%; padding-left: 34px; background: var(--card); }
.gs-results {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 90;
  background: rgba(255, 255, 255, .95); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--stroke); border-radius: var(--r-md); box-shadow: var(--shadow-lift);
  max-height: 320px; overflow-y: auto; display: none;
  transform-origin: top center;
}
.gs-results.show { display: block; animation: gsIn .25s var(--ease-spring); }
@keyframes gsIn { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
.gs-item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; cursor: pointer; }
.gs-item:hover, .gs-item.sel { background: var(--blue-100); }
.gs-item .gn { font-size: 13px; font-weight: 600; color: var(--navy-900); }
.gs-item .gp { font-size: 11px; color: var(--ink-3); }
.gs-item .badge { margin-left: auto; }

/* ---------- чат: пузыри и «ИИ печатает» ---------- */
@keyframes bubbleIn { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
.bubble.new { animation: bubbleIn .4s var(--ease-spring); }
.bubble.typing { display: flex; gap: 5px; align-items: center; padding: 13px 16px; }
.tdot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent-2); opacity: .4; animation: tdot 1.2s infinite; }
.tdot:nth-child(2) { animation-delay: .18s; }
.tdot:nth-child(3) { animation-delay: .36s; }
@keyframes tdot { 0%, 100% { opacity: .35; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }

/* ---------- кастомные контролы: селект / календарь / время ---------- */
.cs, .dtp { position: relative; display: inline-block; min-width: 120px; }
.form-row .cs, .form-row .dtp { display: block; width: 100%; }
.filters .cs { display: inline-block; width: auto; min-width: 190px; }
.cs select, .dtp input { display: none !important; }
.cs-btn {
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
  font-size: 13.5px; color: var(--ink); background: var(--card); border: 1px solid var(--stroke);
  border-radius: var(--r-sm); padding: 9px 12px;
  transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
}
.cs-btn:hover { border-color: #C9D4E3; }
.cs.open .cs-btn, .dtp.open .cs-btn { border-color: var(--accent-2); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 13%, transparent); }
.cs-val { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-chev svg { width: 14px; height: 14px; color: var(--ink-3); transition: transform var(--dur) var(--ease-spring); }
.cs-chev svg { transform: rotate(90deg); }
.cs.open .cs-chev svg { transform: rotate(-90deg); }
.cs-list, .dtp-pop {
  position: absolute; top: calc(100% + 6px); left: 0; min-width: 100%; z-index: 120;
  background: rgba(255, 255, 255, .96); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border: 1px solid var(--stroke); border-radius: var(--r-md); box-shadow: var(--shadow-lift);
  display: none; overflow: hidden;
}
.cs.open .cs-list, .dtp.open .dtp-pop { display: block; animation: gsIn .22s var(--ease-spring); }
/* поповеры пикеров живут в body fixed-слоем (openPop) — правило показа для body-уровня ОБЯЗАТЕЛЬНО */
body > .cs-list.show, body > .dtp-pop.show { display: block; animation: gsIn .22s var(--ease-spring); }
.cs-list { max-height: 260px; overflow-y: auto; padding: 5px; }
.cs-opt {
  display: flex; align-items: center; gap: 8px; padding: 8px 11px; border-radius: 8px;
  font-size: 13px; cursor: pointer; color: var(--ink); white-space: nowrap;
}
.cs-opt:hover { background: var(--blue-100); }
.cs-opt.sel { font-weight: 650; color: var(--accent); }
.cs-opt.sel svg { width: 13px; height: 13px; margin-left: auto; color: var(--accent); }
.cs-opt.dis { opacity: .4; cursor: default; }
.cs-opt.dis:hover { background: none; }
.dtp-pop { padding: 12px; min-width: 248px; }
.dtp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 9px; }
.dtp-head b { font-size: 13px; color: var(--navy-900); }
.dtp-nav { padding: 5px; border-radius: 7px; }
.dtp-nav:hover { background: var(--bg-2); }
.dtp-nav svg { width: 13px; height: 13px; color: var(--ink-3); }
.dtp-nav[data-d="-1"] svg { transform: rotate(180deg); }
.dtp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.dtp-dow { font-size: 9.5px; font-weight: 650; text-transform: uppercase; color: var(--ink-3); text-align: center; padding: 4px 0; }
.dtp-day {
  aspect-ratio: 1; border-radius: 8px; font-size: 12px; font-weight: 500; color: var(--ink);
  display: grid; place-items: center; transition: background var(--dur-fast), transform var(--dur-fast) var(--ease-spring);
}
.dtp-day:hover { background: var(--blue-100); }
.dtp-day.today { box-shadow: inset 0 0 0 1.5px var(--blue-300); }
.dtp-day.sel { background: var(--accent); color: #fff; font-weight: 700; }
body > .dtp-pop.dtp-time, .dtp-pop.dtp-time.show { max-height: 250px; overflow-y: auto; padding: 6px; display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 4px; min-width: 210px; width: 210px; }
.dtp-slot { padding: 8px 0; border-radius: 8px; font-size: 12.5px; text-align: center; font-variant-numeric: tabular-nums; }
.dtp-slot:hover { background: var(--blue-100); }
.dtp-slot.sel { background: var(--accent); color: #fff; font-weight: 650; }

/* ---------- карточка лида «для ленивых» ---------- */
.lp-phone { cursor: pointer; border-bottom: 1px dashed #B7C6E0; }
.lp-phone:hover { color: var(--accent); }
.lp-ad { display: flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 600; color: var(--navy-700); margin-top: 10px; background: var(--blue-100); border-radius: 9px; padding: 7px 10px; }
.lp-ad svg { width: 13px; height: 13px; flex: 0 0 13px; color: var(--accent); }
.lp-ad span { color: var(--ink-3); font-weight: 400; }
.lp-primary { width: 100%; justify-content: center; height: 44px; font-size: 13.5px; }
.lp-ai-state { display: flex; gap: 11px; align-items: center; padding: 12px 14px; border-radius: var(--r-md); background: linear-gradient(150deg, var(--blue-100), #EDF3FE); border: 1px solid var(--accent-soft-bd); }
.lp-ai-state svg { width: 18px; height: 18px; color: var(--accent); }
.lp-ai-state b { display: block; font-size: 13px; color: var(--navy-900); }
.lp-ai-state span { font-size: 11.5px; color: var(--ink-3); }
.lp-quick { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.lp-quick .btn { text-decoration: none; }
.lp-airow { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 9px 11px; border-radius: var(--r-md); background: var(--surface-2, #F4F7FC); border: 1px solid var(--stroke-soft); }
.lp-ai-lbl { font-size: 12.5px; font-weight: 600; color: var(--navy-900); }
/* предпросмотр передачи брокеру */
.hp-note, .hp-extra { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: var(--r-md); margin-bottom: 10px; font-size: 12.5px; line-height: 1.5; }
.hp-note { background: rgba(37, 211, 102, .10); border: 1px solid rgba(37, 211, 102, .25); }
.hp-extra { background: var(--violet-bg); }
.hp-note svg, .hp-extra svg { width: 16px; height: 16px; flex: 0 0 16px; margin-top: 1px; }
.hp-note svg { color: #12925a; }
.hp-extra svg { color: var(--violet); }
.hp-note b, .hp-extra b { display: block; color: var(--navy-900); }
.hp-note span, .hp-extra span { color: var(--ink-2); }
.hp-sum { font-size: 12.8px; line-height: 1.55; color: var(--ink-2); background: var(--surface-2, #F4F7FC); border: 1px solid var(--stroke-soft); border-radius: var(--r-md); padding: 10px 12px; }
.axr-list { border: 1px solid var(--stroke-soft); border-radius: var(--r-md); overflow: hidden; }
.axr { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-bottom: 1px solid var(--stroke-soft); background: var(--card); }
.axr:last-child { border-bottom: none; }
.axr.done { background: #F8FCFA; }
.axr-k { font-size: 11px; font-weight: 650; color: var(--ink-3); width: 52px; flex: 0 0 52px; }
.axr-v { font-size: 12.6px; font-weight: 600; color: var(--navy-900); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.axr:not(.done) .axr-v { color: var(--ink-3); font-weight: 400; }
.axr-ok svg { width: 13px; height: 13px; color: var(--ok); }

/* компактная квалификация в карточке лида: 4 оси в сетке 2×2 */
.axg { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.axg-c { border: 1px solid var(--stroke-soft); border-radius: 10px; padding: 7px 10px; background: var(--card); min-width: 0; }
.axg-c.done { background: #F8FCFA; border-color: #DCEBE2; }
.axg-c i { display: flex; align-items: center; gap: 5px; font-style: normal; font-size: 9.5px; font-weight: 650; letter-spacing: .07em; text-transform: uppercase; color: var(--ink-3); }
.axg-ok svg { width: 11px; height: 11px; color: var(--ok); }
.axg-c b { display: block; font-size: 12.2px; font-weight: 600; color: var(--navy-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.axg-c:not(.done) b { color: var(--ink-3); font-weight: 400; }

/* ---------- полная карточка лида ---------- */
.lc-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 22px; }
.lc-left { min-width: 0; }
.lc-right { min-width: 0; }
.lc-note-row { display: flex; gap: 8px; align-items: center; }
.lc-note-row input { flex: 1; min-width: 0; }
.lc-filters { display: flex; gap: 6px; margin: 12px 0 10px; }
.lc-f.active { background: var(--navy-900); border-color: var(--navy-900); color: #fff; }
.lc-timeline { max-height: 52vh; overflow-y: auto; padding-right: 6px; }
.tl-item { display: flex; gap: 11px; padding: 8px 0; border-bottom: 1px solid var(--stroke-soft); }
.tl-item:last-child { border-bottom: none; }
.tl-dot { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 10px; display: grid; place-items: center; background: var(--bg-2); }
.tl-dot svg { width: 13px; height: 13px; color: var(--ink-3); }
.tl-dot.in { background: var(--blue-100); } .tl-dot.in svg { color: var(--accent); }
.tl-dot.out { background: var(--navy-900); } .tl-dot.out svg { color: #fff; }
.tl-dot.note { background: var(--warn-bg); } .tl-dot.note svg { color: var(--warn); }
.tl-dot.meet { background: var(--violet-bg); } .tl-dot.meet svg { color: var(--violet); }
.tl-body { flex: 1; min-width: 0; }
.tl-head { display: flex; gap: 8px; align-items: baseline; font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }
.tl-head b { font-size: 11.5px; color: var(--navy-700); }
.tl-text { font-size: 12.8px; line-height: 1.5; color: var(--ink); word-wrap: break-word; }
.tl-note { background: #FFFBF1; border: 1px solid #F0E3C4; border-radius: 10px; padding: 8px 11px; }

/* системные события — приглушённая строка, не спорят с перепиской */
.tl-item[data-f="ev"] { padding: 4px 0; align-items: baseline; }
.tl-item[data-f="ev"] .tl-dot { width: 20px; height: 20px; flex: 0 0 20px; border-radius: 7px; background: transparent; align-self: center; }
.tl-item[data-f="ev"] .tl-dot svg { width: 11px; height: 11px; opacity: .65; }
.tl-item[data-f="ev"] .tl-dot.meet { background: var(--violet-bg); }
.tl-item[data-f="ev"] .tl-body { display: flex; align-items: baseline; gap: 8px; min-width: 0; flex-wrap: wrap; }
.tl-item[data-f="ev"] .tl-text { font-size: 11.6px; color: var(--ink-3); }
.tl-item[data-f="ev"] .tl-head { margin-top: 0; flex: 0 0 auto; }

/* кнопка «показать ранние» */
.tl-old-btn { display: block; width: 100%; margin: 8px 0; padding: 7px; border: 1px dashed var(--stroke-soft); border-radius: 10px; background: none; cursor: pointer; font: 600 11px Inter, sans-serif; letter-spacing: .04em; color: var(--ink-3); transition: all var(--dur-fast) var(--ease-soft); }
.tl-old-btn:hover { color: var(--accent); border-color: var(--blue-300); background: var(--blue-50, #F4F8FF); }

/* аккордеоны правой колонки карточки — плотнее, чем общий .coll */
.lc-right .coll { margin: 8px 0; }
.lc-right .coll-head { padding: 9px 12px; }
.lc-contact { display: flex; gap: 8px; align-items: center; padding: 5px 0; }
.lc-cv { font-size: 12.5px; font-weight: 600; color: var(--navy-900); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.lc-cx svg, .lc-copy svg { width: 12px; height: 12px; color: var(--ink-3); }
.lc-cx:hover svg { color: var(--bad); }
.lc-meet { font-size: 12.5px; padding: 6px 0; border-bottom: 1px solid var(--stroke-soft); color: var(--ink-2); }
.lc-meet:last-child { border-bottom: none; }
.lc-meet b { color: var(--navy-900); }
@media (max-width: 1000px) { .lc-grid { grid-template-columns: 1fr; } }

/* ⭐ Усиление разделения блоков в карточке лида (фидбэк: всё сливалось в пастель, нет границ) */
.modal-card .lc-grid { gap: 26px; position: relative; }
.modal-card .lc-grid::before { content: ''; position: absolute; left: calc(1.25 / 2.25 * 100% - 1px); top: 0; bottom: 0; width: 1px; background: var(--stroke-soft); }
@media (max-width: 1000px) { .modal-card .lc-grid::before { display: none; } }
/* левая колонка: лента — в отдельную панель */
.modal-card .lc-timeline { border: 1px solid var(--stroke); border-radius: 14px; padding: 4px 13px; background: var(--card); box-shadow: 0 1px 4px rgba(16, 32, 70, .05); }
.modal-card .lc-filters { position: sticky; top: 0; z-index: 2; background: var(--paper, #fff); padding: 4px 0 10px; margin-top: 12px; }
.modal-card .lc-note-row { padding: 11px 13px; border: 1px solid var(--stroke); border-radius: 13px; background: var(--card); box-shadow: 0 1px 4px rgba(16, 32, 70, .05); }
/* правая колонка: каждая секция — чёткая карточка с акцентной полосой при раскрытии */
.modal-card .lc-right .coll { border: 1px solid var(--stroke); border-radius: 14px; margin: 12px 0; background: var(--card); box-shadow: 0 1px 4px rgba(16, 32, 70, .05); transition: box-shadow var(--dur, .25s) var(--ease-soft, ease), border-color var(--dur, .25s); }
.modal-card .lc-right .coll-head { padding: 12px 14px; font-weight: 700; color: var(--navy-900); border-left: 3px solid transparent; border-radius: 14px 14px 0 0; }
.modal-card .lc-right .coll:not(.open) .coll-head { border-radius: 14px; }
.modal-card .lc-right .coll.open { box-shadow: 0 6px 20px rgba(16, 32, 70, .09); border-color: var(--blue-300, var(--accent-soft-bd)); }
.modal-card .lc-right .coll.open .coll-head { border-left-color: var(--accent); background: var(--blue-50, #F4F8FF); }
.modal-card .lc-right .coll-head .ch-ic svg { width: 15px; height: 15px; }
/* ИИ-блок — самый заметный */
.modal-card .lc-ai { border-width: 1.5px; border-radius: 14px; box-shadow: 0 2px 12px rgba(16, 32, 70, .07); }
.modal-card .lc-ai-head b { font-weight: 800; font-size: 13.5px; }
/* теги лида — чуть контрастнее, разделены */
.modal-card .lc-hint { border-radius: 12px; }

/* ---------- карточка v2: мини-воронка, подсказка, ИИ-блок ---------- */
.lc-funnel { display: flex; gap: 4px; margin-bottom: 14px; }
.lcf-step { flex: 1; min-width: 0; text-align: center; }
.lcf-step i { display: block; height: 5px; border-radius: 4px; background: var(--bg-2); margin-bottom: 5px; }
.lcf-step.done i { background: var(--blue-300); }
.lcf-step.cur i { background: var(--accent); box-shadow: 0 0 0 2px var(--blue-100); }
.lcf-step.warn.cur i { background: #E4B33D; }
.lcf-step.bad.cur i { background: var(--bad); }
.lcf-step span { font-size: 9px; font-weight: 600; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.lcf-step.cur span { color: var(--navy-900); }
.lc-hint { display: flex; gap: 9px; align-items: center; font-size: 12.5px; font-weight: 550; border-radius: var(--r-md); padding: 10px 13px; margin-bottom: 12px; }
.lc-hint svg { width: 15px; height: 15px; flex: 0 0 15px; }
.lc-hint.act { background: var(--blue-100); color: var(--navy-700); border: 1px solid var(--accent-soft-bd); }
.lc-hint.act svg { color: var(--accent); }
.lc-hint.warn { background: var(--warn-bg); color: var(--warn); border: 1px solid #EBD9B0; }
.lc-hint.info { background: var(--bg); color: var(--ink-2); border: 1px solid var(--stroke-soft); }
.lc-hint.info svg { color: var(--accent-2); }
.lc-ai { border: 1px solid var(--stroke); border-radius: var(--r-md); padding: 12px 14px; background: var(--bg); }
.lc-ai.on { background: linear-gradient(150deg, var(--blue-100), #EDF3FE); border-color: var(--accent-soft-bd); }
.lc-ai-head { display: flex; gap: 8px; align-items: center; }
.lc-ai-head svg { width: 15px; height: 15px; color: var(--accent); }
.lc-ai-head b { font-size: 13px; color: var(--navy-900); flex: 1; }
.lc-ai-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; line-height: 1.45; }
.lc-3sel { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 9px; margin-top: 12px; }
.lc-3sel .cs { width: 100%; }
.lc-lbl { display: block; font-size: 10.5px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 4px; }
.lc-meet-acts { margin-left: 8px; display: inline-flex; gap: 5px; }
.lc-meet-acts .btn { padding: 3px 8px; font-size: 10.5px; }

/* ---------- мобильные фиксы (аудит 390px) ---------- */
@media (max-width: 860px) {
  .glass.card, .cmp-card { overflow-x: auto; }
  code.pill { white-space: normal; word-break: break-all; }
  .chat-head .badge { display: none; }
  .num-grid, .broker-grid { grid-template-columns: 1fr; }
  .gsearch { display: none; }
  table.tbl { min-width: 420px; }
  .coll-inner .glass { flex-wrap: wrap; }
  .cmp-stats { gap: 14px; }
  .lc-note-row { flex-wrap: wrap; }
  .vs { grid-template-columns: 1fr; }
  .modal { padding: 18px; }
  .set-row { flex-wrap: wrap; }
}

/* ---------- эмблема раздела ---------- */
.page-emblem {
  width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; flex: 0 0 40px;
  background: linear-gradient(135deg, var(--accent-2), var(--navy-700));
  box-shadow: 0 8px 18px -8px color-mix(in srgb, var(--accent) 55%, transparent), inset 0 1px 0 rgba(255, 255, 255, .3);
}
.page-emblem svg { width: 19px; height: 19px; color: #fff; }

/* ---------- прочее ---------- */
.filters { display: flex; gap: 10px; margin-bottom: 16px; align-items: center; flex-wrap: wrap; }
.empty { padding: 40px; text-align: center; color: var(--ink-3); font-size: 13px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mb { margin-bottom: 16px; }
.link { color: var(--accent); cursor: pointer; }
code.pill { font-family: 'SF Mono', Menlo, monospace; font-size: 11.5px; background: var(--navy-950); border: none; padding: 3px 9px; border-radius: 7px; color: var(--blue-300); }

@media (max-width: 1200px) {
  .kpis { grid-template-columns: repeat(2, 1fr); }
  .ov-grid, .two-col, .vs { grid-template-columns: 1fr; }
  .inbox { grid-template-columns: 240px 1fr; }
  .lead-panel { display: none; }
  .seg-grid { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .sidebar { width: 64px; flex: 0 0 64px; padding: 16px 8px; }
  .brand { padding: 2px 4px 14px; justify-content: center; }
  .brand-name, .nav-label, .nav-item .cnt, .agency div:last-child { display: none; }
  .demo-chip { display: none !important; } /* JS ставит inline display:flex */
  .nav-item { justify-content: center; padding: 10px; font-size: 0; gap: 0; }
  .nav-item svg { width: 19px; height: 19px; }
  .kpis { grid-template-columns: 1fr; }
  .kanban .kb-col { min-width: 210px; width: 210px; flex: 0 0 210px; }
  .content { padding: 6px 14px 20px; }
  .topbar { padding: 14px 14px 10px; flex-wrap: wrap; }
  .topbar .btn-accent { padding: 8px 13px; font-size: 12.5px; }
  .inbox { grid-template-columns: 1fr; }
  .conv-list { display: none; }
}

/* ---------- объекты ---------- */
.prop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(206px, 1fr)); gap: 12px; }
.prop-card { padding: 17px 18px; }
.prop-top { display: flex; gap: 10px; align-items: flex-start; }
.prop-top > div { flex: 1; min-width: 0; }
.prop-name { font-size: 14.5px; font-weight: 700; color: var(--navy-900); }
.prop-price { font-size: 19px; font-weight: 700; color: var(--accent); margin-top: 9px; font-variant-numeric: tabular-nums; }
.prop-meta { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink-3); margin-top: 5px; }
.prop-mats { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 9px; font-size: 12px; }
.prop-mats .btn-ghost svg { width: 13px; height: 13px; color: var(--ink-3); }

/* ---------- конструктор подборок ---------- */
.cl-props { max-height: 320px; overflow-y: auto; border: 1px solid var(--stroke-soft); border-radius: var(--r-md); }
.cl-prop { display: flex; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--stroke-soft); cursor: pointer; font-size: 12.8px; }
.cl-prop:last-child { border-bottom: none; }
.cl-prop:hover { background: var(--bg); }
.cl-prop input { display: none; }
.cl-chk { width: 17px; height: 17px; flex: 0 0 17px; border-radius: 5px; border: 1.5px solid #C6D0DF; background: var(--card); position: relative; transition: all var(--dur-fast); }
.cl-prop input:checked + .cl-chk { background: var(--accent); border-color: var(--accent); }
.cl-prop input:checked + .cl-chk::after { content: ''; position: absolute; inset: 3px 4px 5px; border: solid #fff; border-width: 0 0 2px 2px; transform: rotate(-45deg) translateY(-1px); }

/* ---------- календарь недели ---------- */
.cal-grid { display: grid; grid-template-columns: 44px repeat(7, 1fr); gap: 0; border: 1px solid var(--stroke); border-radius: var(--r-md); overflow: hidden; }
.cal-hours { padding-top: 34px; }
.cal-hours div { height: var(--hpx); font-size: 9.5px; color: var(--ink-3); text-align: right; padding-right: 6px; transform: translateY(-6px); }
.cal-day { border-left: 1px solid var(--stroke-soft); min-width: 0; }
.cal-day.today .cal-dhead { background: var(--blue-100); color: var(--accent); }
.cal-dhead { height: 34px; display: flex; align-items: center; justify-content: center; gap: 4px; font-size: 11px; color: var(--ink-3); border-bottom: 1px solid var(--stroke); background: var(--bg); }
.cal-dhead b { color: var(--navy-900); font-size: 12.5px; }
.cal-body { position: relative; }
.cal-slot { position: absolute; left: 0; right: 0; height: var(--hpx); border-bottom: 1px solid var(--stroke-soft); cursor: pointer; }
.cal-slot:hover { background: var(--blue-100); opacity: .55; }
.cal-ev {
  position: absolute; left: 3px; right: 3px; z-index: 2; height: 40px; overflow: hidden;
  background: linear-gradient(135deg, var(--accent-2), var(--accent)); color: #fff;
  border-radius: 8px; padding: 4px 7px; font-size: 10px; cursor: pointer; line-height: 1.3;
  box-shadow: 0 4px 10px -4px color-mix(in srgb, var(--accent) 50%, transparent);
}
.cal-ev b { font-size: 10px; }
.cal-ev span { display: block; opacity: .75; font-size: 9px; }
/* блок задачи в календаре — визуально отличается от встречи: светлый, с цветной кромкой по приоритету */
.cal-task { position: absolute; left: 3px; right: 3px; z-index: 3; height: 20px; overflow: hidden; display: flex; align-items: center; gap: 5px;
  background: var(--card); color: var(--navy-900); border: 1px solid var(--stroke); border-left: 3px solid var(--pc, var(--accent));
  border-radius: 7px; padding: 2px 7px; font-size: 10px; line-height: 1.2; cursor: pointer; box-shadow: 0 2px 6px -3px rgba(16,43,92,.25); white-space: nowrap; }
/* при наведении задача раскрывается ВНИЗ внутри своей колонки (не залезает на соседний день):
   высота auto, текст переносится, поверх остального — не обрезается и не бьёт в соседнюю клетку */
.cal-task:hover { z-index: 20; height: auto; min-height: 20px; overflow: visible; white-space: normal; flex-wrap: wrap; align-items: flex-start; background: var(--card); border-color: var(--pc, var(--accent)); box-shadow: var(--shadow-lift); }
.cal-task:hover b { align-self: center; }
.cal-task b { font-size: 10px; font-variant-numeric: tabular-nums; }
.cal-task-dot { width: 6px; height: 6px; border-radius: 2px; background: var(--pc, var(--accent)); flex: none; }
.cal-legend { display: flex; gap: 14px; align-items: center; margin: -2px 0 10px; font-size: 11.5px; color: var(--ink-3); }
.cal-lg-i { display: inline-flex; align-items: center; gap: 6px; }
.cal-lg-dot { width: 11px; height: 11px; border-radius: 3px; }
.cal-lg-dot.ev { background: linear-gradient(135deg, var(--accent-2), var(--accent)); }
.cal-lg-dot.tk { background: var(--card); border: 1px solid var(--stroke); border-left: 3px solid var(--accent); border-radius: 3px; }
.cal-ev.st-done { background: var(--ok-bg); color: var(--ok); box-shadow: none; border: 1px solid #C4E6D6; }
.cal-ev.st-no_show { background: var(--bad-bg); color: var(--bad); box-shadow: none; border: 1px solid #EDC5C0; }
.cal-ev.rsizing { box-shadow: 0 0 0 2px rgba(255, 255, 255, .7), 0 8px 18px -6px color-mix(in srgb, var(--accent) 60%, transparent); z-index: 5; }
/* кромка растягивания длительности */
.cal-ev-rs { position: absolute; left: 0; right: 0; bottom: 0; height: 8px; cursor: ns-resize; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 1px; }
.cal-ev-rs::after { content: ''; width: 20px; height: 2.5px; border-radius: 2px; background: currentColor; opacity: 0; transition: opacity var(--dur-fast); }
.cal-ev:hover .cal-ev-rs::after { opacity: .55; }
/* получасовая направляющая внутри часового слота */
.cal-slot::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px dashed var(--stroke-soft); opacity: .45; pointer-events: none; }
.cal-slot:hover { background: var(--blue-100); opacity: .32; }
.cal-day.cal-hot { background: var(--blue-100); opacity: 1 !important; box-shadow: inset 0 0 0 2px var(--accent); }

/* ---------- карточка лида: независимый скролл колонок (фикс обрезания) ---------- */
.modal-card { display: flex; flex-direction: column; height: 90vh; max-height: 90vh; overflow: hidden; }
.modal-card .m-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.modal-card .lc-grid { flex: 1; min-height: 0; }
.modal-card .lc-left { display: flex; flex-direction: column; min-height: 0; }
.modal-card .lc-timeline { flex: 1; max-height: none; }
.modal-card .lc-right { overflow-y: auto; padding-right: 4px; }
@media (max-width: 1000px) { .modal-card { height: auto; max-height: 92vh; overflow-y: auto; } .modal-card .lc-timeline { max-height: 40vh; } .modal-card .lc-right { overflow: visible; } }
.page-primary { display: none; }

/* ---------- объекты: обложки и деталка ---------- */
.prop-card.rich { padding: 0; overflow: hidden; cursor: pointer; }
.prop-card.rich .prop-body { padding: 14px 16px 15px; }
.prop-cover {
  height: 150px; background-size: cover; background-position: center; position: relative;
  display: grid; place-items: center;
}
.prop-cover.big { height: 240px; border-radius: var(--r-lg); margin-bottom: 16px; box-shadow: var(--shadow); }
.prop-cover .pc-star { width: 26px; height: 31px; opacity: .5; position: absolute; top: 14px; left: 16px; }
.prop-cover span { font-size: 20px; font-weight: 700; color: rgba(255, 255, 255, .85); letter-spacing: .04em; }
.prop-cover.big span { font-size: 30px; }
.prop-foot { display: flex; gap: 5px; align-items: center; margin-top: 10px; }
.pd-head { display: flex; gap: 20px; align-items: flex-start; margin-bottom: 14px; }
.pd-sub { display: flex; gap: 8px; margin-top: 6px; }
.pd-sub .gi { width: 180px; }
.pd-price { font-size: 22px; font-weight: 700; color: var(--accent); white-space: nowrap; }
.gi-price { width: 130px; font-size: 19px; font-weight: 700; color: var(--accent); }
.gi {
  background: transparent; border: 1px solid transparent; border-radius: 8px; padding: 5px 8px;
  transition: border-color var(--dur-fast), background var(--dur-fast);
}
.gi:hover { border-color: var(--stroke); background: var(--card); }
.gi:focus { border-color: var(--accent-2); background: var(--card); }
.gi-title { font-size: 22px; font-weight: 700; color: var(--navy-900); width: 100%; }
.pd-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.pd-facts .gi, .pd-facts textarea.gi { width: 100%; }
.pd-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 9px; }
.pd-img { aspect-ratio: 4/3; border-radius: 10px; background-size: cover; background-position: center; position: relative; border: 1px solid var(--stroke); }
.pd-x { position: absolute; top: 5px; right: 5px; width: 22px; height: 22px; border-radius: 7px; background: rgba(6, 17, 38, .55); display: grid; place-items: center; color: #fff; }
.pd-x svg { width: 11px; height: 11px; color: #fff; }
@media (max-width: 1000px) { .pd-facts { grid-template-columns: 1fr 1fr; } .pd-head { flex-direction: column; } }

/* ---------- плейбук ---------- */
.pb-item { padding: 13px 0; border-bottom: 1px solid var(--stroke-soft); }
.pb-item:last-child { border-bottom: none; }
.pb-t { font-size: 13.5px; font-weight: 700; color: var(--navy-900); }
.pb-b { font-size: 12.6px; line-height: 1.6; color: var(--ink-2); margin-top: 5px; }
.pb-tip { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; font-size: 12px; font-weight: 550; color: var(--navy-700); background: var(--blue-100); border-radius: 9px; padding: 8px 11px; }
.pb-tip svg { width: 13px; height: 13px; flex: 0 0 13px; color: var(--accent); margin-top: 1px; }

/* ---------- flow-конструктор цепочек ---------- */
.fl-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; align-items: center; }
.fl-tab {
  display: flex; gap: 8px; align-items: center; padding: 8px 13px; border-radius: var(--r-sm);
  background: var(--card); border: 1px solid var(--stroke); font-size: 12.5px; font-weight: 600; color: var(--ink-2);
}
.fl-tab i { width: 7px; height: 7px; border-radius: 50%; background: #C6D0DF; }
.fl-tab i.on { background: #23B383; }
.fl-tab span { font-size: 10.5px; color: var(--ink-3); font-weight: 500; }
.fl-tab.active { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); color: var(--navy-900); }
.flow { display: flex; flex-direction: column; align-items: stretch; max-width: 640px; }
.fl-node {
  display: flex; gap: 12px; align-items: flex-start; background: var(--card); border: 1px solid var(--stroke);
  border-radius: var(--r-md); padding: 13px 15px; box-shadow: var(--shadow); cursor: pointer;
  transition: border-color var(--dur-fast), transform var(--dur-fast) var(--ease-spring);
}
.fl-node:hover { border-color: var(--hover-bd); }
.fl-node.off { opacity: .55; }
.fl-node.fl-over { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); }
.fl-trigger, .fl-end { cursor: default; background: linear-gradient(155deg, var(--navy-700), var(--navy-950)); border: none; color: #E3EAFB; }
.fl-trigger .fl-title b, .fl-end .fl-title b { color: #fff; }
.fl-trigger .fl-prev, .fl-end .fl-prev { color: var(--ink-3); }
.fl-trigger .fl-title svg { color: var(--blue-300); }
.fl-end .fl-title svg { color: #E4B33D; }
.fl-day {
  flex: 0 0 auto; display: flex; gap: 5px; align-items: center; font-size: 10.5px; font-weight: 700;
  color: var(--accent); background: var(--blue-100); border-radius: 10px; padding: 4px 9px; white-space: nowrap;
}
.fl-day svg { width: 11px; height: 11px; }
.fl-body { flex: 1; min-width: 0; }
.fl-title { display: flex; gap: 8px; align-items: center; font-size: 13px; }
.fl-title svg { width: 15px; height: 15px; color: var(--accent); flex: 0 0 15px; }
.fl-title b { color: var(--navy-900); }
.fl-prev { font-size: 11.8px; color: var(--ink-3); margin-top: 4px; line-height: 1.45; white-space: pre-line; }
.fl-side { display: flex; flex-direction: column; gap: 8px; align-items: center; }
.fl-grip { cursor: grab; color: var(--ink-3); font-size: 13px; letter-spacing: -2px; user-select: none; padding: 2px 4px; }
.fl-grip:active { cursor: grabbing; }
.fl-conn { display: flex; flex-direction: column; align-items: center; height: 34px; position: relative; }
.fl-conn i { width: 2px; flex: 1; background: linear-gradient(180deg, var(--blue-300), var(--accent)); }
.fl-add {
  position: absolute; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; border-radius: 50%;
  background: var(--card); border: 1.5px solid var(--stroke); display: grid; place-items: center;
  opacity: 0; transition: opacity var(--dur-fast), border-color var(--dur-fast);
}
.fl-add svg { width: 11px; height: 11px; color: var(--accent); }
.fl-conn:hover .fl-add { opacity: 1; }
.fl-add:hover { border-color: var(--accent); }
.fl-edit { cursor: default; flex-direction: column; align-items: stretch; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.fl-vars { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 8px; }
.fl-var {
  font-family: 'SF Mono', Menlo, monospace; font-size: 11px; font-weight: 600; color: var(--accent);
  background: var(--blue-100); border: 1px solid var(--accent-soft-bd); border-radius: 7px; padding: 3px 8px;
}
.fl-var:hover { background: #CCE0FF; }
.fl-side .switch { flex: 0 0 auto; height: 22px; }

/* ---------- логотип агентства ---------- */
.ag-logo {
  width: 120px; height: 84px; flex: 0 0 120px; border-radius: var(--r-md);
  background: linear-gradient(155deg, var(--navy-700), var(--navy-950));
  display: grid; place-items: center; padding: 12px; overflow: hidden;
}
.ag-logo img { width: 100%; height: 100%; max-width: 96px; max-height: 60px; object-fit: contain; }

/* ---------- плейбук: две панели ---------- */
.pb-layout { display: grid; grid-template-columns: 290px 1fr; gap: 16px; align-items: start; }
.pb-nav { padding: 10px; position: sticky; top: 6px; }
.pb-nav-hd { font-size: 10.5px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); padding: 6px 10px 8px; }
.pb-cat { display: flex; gap: 11px; align-items: center; width: 100%; text-align: left; padding: 10px 11px; border-radius: var(--r-sm); transition: background var(--dur-fast); }
.pb-cat:hover { background: var(--bg); }
.pb-cat.active { background: var(--blue-100); }
.pb-cat-ic { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; display: grid; place-items: center; background: var(--card); border: 1px solid var(--stroke); }
.pb-cat.active .pb-cat-ic { background: var(--accent); border-color: var(--accent); }
.pb-cat-ic svg { width: 15px; height: 15px; color: var(--accent); }
.pb-cat.active .pb-cat-ic svg { color: #fff; }
.pb-cat-t { flex: 1; min-width: 0; }
.pb-cat-t b { display: block; font-size: 13px; color: var(--navy-900); }
.pb-cat-t i { display: block; font-size: 11px; color: var(--ink-3); font-style: normal; margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-cat-n { font-size: 11px; font-weight: 700; color: var(--ink-3); background: var(--bg-2); border-radius: 10px; padding: 1px 8px; }
.pb-cat.active .pb-cat-n { color: var(--accent); background: var(--card); }
.pb-tipbox { display: flex; gap: 8px; font-size: 11.5px; line-height: 1.5; color: var(--navy-700); background: var(--bg); border-radius: var(--r-sm); padding: 11px; margin: 8px 6px 4px; }
.pb-tipbox svg { width: 14px; height: 14px; flex: 0 0 14px; color: var(--accent); margin-top: 1px; }
.pb-main-hd { display: flex; align-items: center; gap: 10px; padding: 4px 4px 14px; }
.pb-main-hd svg { width: 18px; height: 18px; color: var(--accent); }
.pb-main-hd b { font-size: 17px; font-weight: 700; color: var(--navy-900); }
.pb-main-hd span { font-size: 12px; color: var(--ink-3); margin-left: auto; }
.pb-acc { background: var(--card); border: 1px solid var(--stroke); border-radius: var(--r-md); margin-bottom: 9px; box-shadow: var(--shadow); overflow: hidden; }
.pb-acc-hd { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; padding: 14px 16px; }
.pb-num { font-size: 11px; font-weight: 700; color: var(--accent); background: var(--blue-100); border-radius: 7px; padding: 3px 8px; flex: 0 0 auto; }
.pb-acc-t { flex: 1; font-size: 13.5px; font-weight: 650; color: var(--navy-900); }
.pb-acc .chev svg { width: 15px; height: 15px; color: var(--ink-3); transition: transform var(--dur) var(--ease-spring); }
.pb-acc.open .chev svg { transform: rotate(90deg); }
.pb-acc-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ease-spring); }
.pb-acc.open .pb-acc-body { grid-template-rows: 1fr; }
.pb-acc-inner { overflow: hidden; padding: 0 16px; }
.pb-acc.open .pb-acc-inner { padding-bottom: 15px; }
.pb-b { font-size: 12.8px; line-height: 1.6; color: var(--ink-2); }
.pb-acc .pb-tip { display: flex; gap: 8px; align-items: flex-start; margin-top: 11px; font-size: 12px; font-weight: 550; color: var(--navy-700); background: var(--blue-100); border-radius: 9px; padding: 9px 12px; }
.pb-acc .pb-tip svg { width: 13px; height: 13px; flex: 0 0 13px; color: var(--accent); margin-top: 1px; }
@media (max-width: 900px) { .pb-layout { grid-template-columns: 1fr; } .pb-nav { position: static; } .pb-cat-t i { display: none; } }

/* ---------- WhatsApp-эмулятор в конструкторе цепочек ---------- */
.wa-phone { position: sticky; top: 6px; background: var(--card); border: 1px solid var(--stroke); border-radius: var(--r-lg); padding: 16px 16px 20px; box-shadow: var(--shadow); display: flex; flex-direction: column; align-items: center; }
.wa-phone .wa-note { align-self: flex-start; }
.wa-note { font-size: 11.5px; color: var(--ink-3); margin-bottom: 10px; display: flex; gap: 6px; align-items: center; }
.wa-note svg { width: 13px; height: 13px; }
/* Реалистичный iPhone (Pro, титан): рамка, Dynamic Island, статус-бар, боковые кнопки, home-индикатор */
.iph {
  position: relative; width: 272px; max-width: 100%; margin: 0 auto; padding: 10px; border-radius: 50px;
  background: linear-gradient(150deg, #3a3d42, #17181c 32%, #202227 70%, #303338);
  box-shadow: 0 30px 70px -24px rgba(8, 10, 16, .62), inset 0 0 0 2px rgba(255, 255, 255, .06), inset 0 0 3px 3px rgba(0, 0, 0, .5);
}
.iph-screen {
  position: relative; border-radius: 44px; overflow: hidden; background: #E4DDD4;
  aspect-ratio: 9 / 19.3; display: flex; flex-direction: column;
  box-shadow: inset 0 0 0 2px #000;
}
.iph-island {
  position: absolute; top: 11px; left: 50%; transform: translateX(-50%); z-index: 20;
  width: 92px; height: 27px; background: #000; border-radius: 999px; display: flex; align-items: center; justify-content: flex-end; padding-right: 11px;
}
.iph-cam { width: 8px; height: 8px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #3a3a3e, #05060a 70%); box-shadow: inset 0 0 2px rgba(200, 200, 210, .4); }
.iph-status {
  display: flex; align-items: center; justify-content: space-between; padding: 12px 24px 6px; background: #075E54; color: #fff;
  font-variant-numeric: tabular-nums;
}
.iph-time { font-size: 14px; font-weight: 700; letter-spacing: .02em; }
.iph-sys { display: flex; align-items: center; gap: 6px; }
.iph-sys svg { fill: currentColor; color: #fff; display: block; }
.iph-home { position: absolute; bottom: 7px; left: 50%; transform: translateX(-50%); width: 116px; height: 5px; border-radius: 999px; background: rgba(0, 0, 0, .32); z-index: 20; }
.iph-side { position: absolute; background: linear-gradient(90deg, #17181c, #35383d); border-radius: 2px; }
.iph-silent { left: -2px; top: 118px; width: 3px; height: 26px; }
.iph-volup { left: -2px; top: 158px; width: 3px; height: 46px; }
.iph-voldn { left: -2px; top: 214px; width: 3px; height: 46px; }
.iph-power { right: -2px; top: 172px; width: 3px; height: 66px; background: linear-gradient(270deg, #17181c, #35383d); }
.wa-top { display: flex; align-items: center; gap: 9px; background: #075E54; color: #fff; padding: 6px 13px 11px; }
.wa-back { font-size: 22px; opacity: .9; margin-right: -2px; }
.wa-ava { width: 34px; height: 34px; border-radius: 50%; overflow: hidden; background: #cfd8d3; color: #075E54; display: grid; place-items: center; font-weight: 700; font-size: 14px; }
.wa-ava img { width: 100%; height: 100%; object-fit: cover; }
.wa-peer { flex: 1; line-height: 1.2; }
.wa-peer b { font-size: 14px; font-weight: 600; }
.wa-peer i { font-size: 11px; opacity: .8; font-style: normal; display: block; }
.wa-call { opacity: .9; display: flex; }
.wa-call svg { width: 17px; height: 17px; }
.wa-dots { opacity: .8; }
.wa-body {
  flex: 1; min-height: 420px; overflow-y: auto; padding: 14px 14px 18px; scrollbar-width: none;
  background-color: #E4DDD4;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cg fill='%23d9d0c5' fill-opacity='0.5'%3E%3Cpath d='M12 20l3 3-3 3-3-3zM40 8l2 2-2 2-2-2zM48 44l3 3-3 3-3-3zM20 48l2 2-2 2-2-2z'/%3E%3C/g%3E%3C/svg%3E");
  display: flex; flex-direction: column; gap: 3px;
}
.wa-day { align-self: center; font-size: 10.5px; color: #5b6b63; background: #d5e3da; border-radius: 8px; padding: 3px 12px; margin: 10px 0 6px; }
.wa-msg {
  max-width: 82%; padding: 7px 10px 5px; border-radius: 9px; font-size: 13px; line-height: 1.45; color: #0B141A;
  position: relative; animation: waIn .32s var(--ease-spring); word-wrap: break-word;
}
.wa-msg.out { align-self: flex-end; background: #DCF8C6; border-top-right-radius: 2px; }
@keyframes waIn { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
.wa-time { font-size: 9.5px; color: #667781; float: right; margin: 4px 0 -2px 10px; }
.wa-voice { display: inline-flex; align-items: center; gap: 7px; color: #075E54; font-weight: 600; }
.wa-msg.typing { background: #DCF8C6; align-self: flex-end; display: flex; gap: 4px; padding: 11px 13px; }
.wa-msg.typing span { width: 7px; height: 7px; border-radius: 50%; background: #8aa79a; animation: waT 1.1s infinite; }
.wa-msg.typing span:nth-child(2) { animation-delay: .18s; }
.wa-msg.typing span:nth-child(3) { animation-delay: .36s; }
@keyframes waT { 0%, 100% { opacity: .4; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }

/* ---------- папки-полка ---------- */
/* полка папок — минималистичная строка-чипы, отделена от карточек воздухом и тонкой линией */
.shelf { display: flex; gap: 8px; flex-wrap: wrap; align-items: stretch; margin: 6px 0 20px; padding-bottom: 20px; border-bottom: 1px solid var(--stroke); }
.shelf-sm { margin-bottom: 12px; }
.fold {
  position: relative; display: flex; align-items: center; gap: 9px; min-width: 132px; border-radius: var(--r-md);
  background: transparent; border: 1px solid transparent; padding: 8px 12px 8px 8px; cursor: pointer; text-align: left;
  transition: transform var(--dur-fast) var(--ease-spring), background var(--dur-fast), border-color var(--dur-fast);
}
.fold:hover { background: var(--card); border-color: var(--stroke); box-shadow: var(--shadow); }
.fold.active { background: var(--card); border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 10%, transparent); }
.fold.drop { background: var(--blue-100); border-color: var(--accent); transform: scale(1.04); }
.fold img {
  width: 40px; height: 40px; object-fit: contain; display: block; flex: 0 0 40px;
  filter: drop-shadow(0 6px 9px rgba(16, 43, 92, .22));
  transition: transform var(--dur) var(--ease-spring);
}
/* ИКОНКА ПАПКИ — инлайн-SVG в цвете темы (был статичный синий folder.png во всех стилях) */
.fold-ico { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; color: var(--accent);
  transition: transform var(--dur) var(--ease-spring); }
.fold-ico svg { width: 34px; height: 34px; }
.fold:hover img, .fold:hover .fold-ico { transform: scale(1.06); }
.fold.active .fold-ico, .lm-folder.on .fold-ico { color: var(--accent); }
.fold.drop img { transform: scale(1.1); }
.fold-meta { min-width: 0; padding-right: 4px; }
.fold-meta b { display: block; font-size: 12.5px; color: var(--navy-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fold-meta i { font-size: 10.5px; color: var(--ink-3); font-style: normal; }
.fold-acts { position: absolute; top: 5px; right: 5px; display: flex; gap: 2px; opacity: 0; transition: opacity var(--dur-fast); background: var(--card); border-radius: 7px; }
.fold:hover .fold-acts { opacity: 1; }
.fold-acts svg { width: 12px; height: 12px; color: var(--ink-3); }
.fold-acts button:hover svg { color: var(--accent); }
.fold-new { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 7px; min-width: 108px; color: var(--ink-3); border: 1.5px dashed var(--stroke); background: transparent; box-shadow: none; font-size: 12.5px; font-weight: 600; }
.fold-new svg { width: 16px; height: 16px; }
.fold-new:hover { color: var(--accent); border-color: var(--accent); }
.prop-card { touch-action: none; user-select: none; -webkit-user-select: none; }
.cmp-card { touch-action: pan-y; }

/* ---------- структурные контролы деталки ---------- */
.gi-sel { min-width: 150px; }
.pd-sub .cs { min-width: 170px; }
.payrow-mini { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 9px; }
.payrow-mini span { font-size: 11.5px; color: var(--ink-3); }
.payrow-mini b { font-size: 13px; color: var(--navy-900); margin-right: 4px; }
.chips-row { display: flex; gap: 6px; flex-wrap: wrap; }
.chip-t {
  font-size: 11.5px; font-weight: 550; color: var(--ink-2); background: var(--bg-2);
  border: 1px solid var(--stroke); border-radius: 16px; padding: 4px 11px;
  transition: all var(--dur-fast);
}
.chip-t:hover { border-color: var(--hover-bd); }
.chip-t.on { background: var(--accent); border-color: var(--accent); color: #fff; }

/* ---------- омниканал ---------- */
.ch-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.ch-pill { font-size: 10px; font-weight: 650; padding: 3px 9px; border-radius: 12px; border: 1px solid var(--stroke); color: var(--ink-3); background: var(--bg-2); }
.ch-pill.yes { color: var(--ok); background: var(--ok-bg); border-color: #C4E6D6; }
.ch-pill.no { color: var(--bad); background: var(--bad-bg); border-color: #EDC5C0; text-decoration: line-through; }
.ch-prio { display: flex; gap: 10px; align-items: center; padding: 9px 11px; border: 1px solid var(--stroke-soft); border-radius: var(--r-sm); margin-bottom: 6px; background: var(--card); }
.ch-prio b { width: 20px; height: 20px; border-radius: 6px; background: var(--blue-100); color: var(--accent); display: grid; place-items: center; font-size: 11px; }
.ch-prio span { font-size: 13px; font-weight: 550; color: var(--navy-900); }
.ch-prio .btn-ghost svg { width: 13px; height: 13px; color: var(--ink-3); }
.ch-prio .switch { flex: 0 0 auto; height: 22px; }
.side-foot .agency { cursor: pointer; transition: background var(--dur-fast); } .side-foot .agency:hover { background: color-mix(in srgb, var(--accent) 9%, transparent); }
.stack-target { outline: 2px dashed var(--accent-2); outline-offset: 3px; transform: scale(1.02); }
@keyframes stackPop { 0% { transform: scale(1); } 40% { transform: scale(1.06); } 100% { transform: scale(1); } }
.stack-pop { animation: stackPop .45s var(--ease-spring); }

/* ---------- брокер: инлайн-редактор не вылезает ---------- */
.broker-card[data-bredit] { grid-column: 1 / -1; max-width: 560px; }
.day-chip { padding: 4px 0; font-size: 10.5px; flex: 1; min-width: 0; border-radius: 7px; }
.broker-card [style*="display:flex"] .day-chip { }
.cal-now { position: absolute; left: 0; right: 0; height: 2px; background: var(--bad); z-index: 3; }
.cal-now::before { content: ''; position: absolute; left: -3px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: var(--bad); }
.cal-hot { background: var(--blue-100) !important; opacity: .7; }
.cal-ev { touch-action: none; user-select: none; }

/* ---------- воронка: сег-переключатели и таблица ---------- */
.seg-toggle { display: inline-flex; background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 10px; padding: 3px; gap: 2px; }
.seg-btn { padding: 5px 11px; border-radius: 7px; font-size: 11.5px; font-weight: 600; color: var(--ink-2); transition: all var(--dur-fast); display: flex; align-items: center; gap: 5px; }
.seg-btn svg { width: 14px; height: 14px; }
.seg-btn.on { background: var(--card); color: var(--navy-900); box-shadow: 0 1px 3px rgba(16, 43, 92, .12); }
.lead-tbl th { padding: 10px 14px; }
.lead-tbl td { padding: 9px 14px; }
.lead-tbl tr:hover td { background: var(--blue-100); }
@keyframes softIn { from { opacity: .55; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.content.soft > * { animation: softIn .24s var(--ease-soft); }

/* ---------- Обзор: живая 3D-воронка (Higgsfield-вырезка, парит в hero-панели) ---------- */
.f3card { background: linear-gradient(150deg, var(--ov-hero-a), var(--ov-hero-b) 55%, var(--ov-hero-c) 130%); border: 1px solid color-mix(in srgb, var(--accent) 14%, transparent); border-radius: 18px; padding: 18px 20px; color: #fff; overflow: hidden; position: relative; box-shadow: 0 18px 44px rgba(6, 17, 38, .35); }
.f3card .card-title { color: #fff; }
.f3card .card-title .sub { color: var(--ink-3); }
.f3card .card-title svg { color: var(--blue-300); }
.f3.v2 { display: grid; grid-template-columns: 1fr minmax(280px, 400px) 1fr; gap: 14px; align-items: center; }
.f3stage { position: relative; display: grid; place-items: center; min-height: 440px; }
.f3glow { position: absolute; width: 85%; height: 75%; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 50%, transparent), transparent 72%); filter: blur(30px); animation: f3pulse 5.5s ease-in-out infinite; }
.f3funwrap { position: relative; width: min(94%, 380px); z-index: 2; animation: f3float 7s ease-in-out infinite; }
.f3fun { width: 100%; display: block; filter: drop-shadow(0 30px 44px rgba(0, 0, 0, .55)); }
.f3side { display: flex; flex-direction: column; justify-content: space-evenly; align-self: stretch; min-height: 420px; padding: 14px 0; }
.f3t { position: absolute; left: 50%; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 65%, transparent), rgba(124, 58, 237, .3) 55%, transparent 78%); opacity: 0; transition: opacity .25s ease; filter: blur(7px); pointer-events: none; mix-blend-mode: screen; }
.f3t.on { opacity: 1; }
.f3p { position: absolute; top: 4%; left: calc(50% + var(--px, 0px)); width: 4px; height: 4px; border-radius: 50%; background: var(--blue-300); box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 90%, transparent); opacity: 0; animation: f3drop 3.4s linear infinite; animation-delay: var(--pd, 0s); z-index: 3; }
@keyframes f3drop { 0% { opacity: 0; transform: translate(0, -14px) } 12% { opacity: .95 } 55% { opacity: .75; transform: translate(calc(var(--px, 0px) * -0.5), 90px) } 78% { opacity: 0; transform: translate(calc(var(--px, 0px) * -0.9), 150px) } 100% { opacity: 0; transform: translate(calc(var(--px, 0px) * -0.9), 150px) } }
@keyframes f3float { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(-9px) } }
@keyframes f3pulse { 0%, 100% { opacity: .75; transform: scale(1) } 50% { opacity: 1; transform: scale(1.07) } }
.f3row { display: flex; align-items: center; gap: 14px; padding: 10px 14px; border-radius: 12px; cursor: pointer; position: relative; transition: background .18s var(--ease-spring, ease), transform .18s var(--ease-spring, ease); }
.f3row:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.f3txt { min-width: 0; }
.f3name { font-size: 13.5px; font-weight: 750; color: #fff; }
.f3conv { font-size: 11px; color: rgba(255,255,255,.66); margin-top: 3px; }   /* на тёмном f3card — светлый */
.f3num { font-weight: 800; font-size: 24px; color: #fff; letter-spacing: -.5px; flex: 0 0 auto; min-width: 34px; }
/* коннекторы к воронке: слева строки тянутся вправо, справа — влево */
.f3side.left .f3row { justify-content: flex-end; text-align: right; }
.f3side.left .f3txt { order: 1; }
.f3side.left .f3num { order: 2; text-align: left; }
.f3side.left .f3row:hover { transform: translateX(7px); }
.f3side.right .f3row:hover { transform: translateX(-7px); }
.f3row::after { content: ''; position: absolute; top: 50%; width: 30px; height: 1.5px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent) 55%, transparent)); opacity: .7; transition: opacity .18s; }
.f3side.left .f3row::after { right: -32px; }
.f3side.right .f3row::after { left: -32px; transform: scaleX(-1); }
.f3row:hover::after { opacity: 1; background: linear-gradient(90deg, transparent, var(--blue-300)); box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 50%, transparent); }
.content.anim .f3row { animation: f3in .45s var(--ease-spring, ease) both; animation-delay: var(--fd, 0ms); }
@keyframes f3in { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .f3funwrap, .f3glow, .f3p { animation: none; } .f3p { display: none; } }
@media (max-width: 900px) {
  .f3.v2 { grid-template-columns: 1fr; gap: 4px; }
  .f3stage { min-height: 260px; order: -1; }
  .f3funwrap { width: 210px; }
  .f3side { min-height: auto; padding: 0; }
  .f3side.left .f3row { justify-content: flex-start; text-align: left; }
  .f3side.left .f3txt { order: 2; }
  .f3side.left .f3num { order: 1; }
  .f3row::after { display: none; }
  .f3row:hover, .f3side.left .f3row:hover { transform: none; }
}

/* ---------- ✦ ИИ-ассистент полей ---------- */
.aiwrap { position: relative; }
.aiwrap textarea { width: 100%; }
.aiwand { position: absolute; top: 7px; right: 7px; z-index: 5; width: 26px; height: 26px; border: none; border-radius: 8px; background: linear-gradient(120deg, var(--accent), var(--accent-3)); color: #fff; font-size: 13px; cursor: pointer; opacity: .35; transition: opacity .15s, transform .15s; display: grid; place-items: center; }
.aiwrap:hover .aiwand, .aiwand.busy { opacity: 1; }
/* 🎙 диктовка */
.dic-btn { position: absolute; top: 7px; right: 7px; z-index: 5; width: 26px; height: 26px; border: none; border-radius: 8px; background: rgba(16, 43, 92, .72); color: #fff; cursor: pointer; opacity: .38; transition: opacity .15s, background .15s; display: grid; place-items: center; }
.dic-btn svg { width: 14px; height: 14px; }
.dic-btn.with-wand { right: 39px; }
.aiwrap:hover .dic-btn { opacity: .82; }
.dic-btn:hover { opacity: 1; }
.dic-btn.rec { opacity: 1; background: #C0392B; animation: dicPulse 1.1s infinite; }
.dic-btn.busy { opacity: 1; background: var(--accent); }
@keyframes dicPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(192, 57, 43, .5); } 50% { box-shadow: 0 0 0 6px rgba(192, 57, 43, 0); } }
.aiwand:hover { transform: scale(1.08); }
.ai-pop .pop-item { font-size: 12.5px; }

/* ---------- переименование подборки ---------- */
.cmp-head .nm { cursor: text; display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.nm-pen { opacity: 0; transition: opacity .15s; color: var(--ink-3, #8a90a0); display: inline-flex; }
.nm-pen svg { width: 12px; height: 12px; }
.cmp-head .nm:hover .nm-pen { opacity: 1; }
.nm-edit { font: inherit; font-weight: inherit; border: 1.5px solid var(--acc, var(--accent)); border-radius: 7px; padding: 2px 8px; outline: none; min-width: 200px; }

/* ---------- hero-панель раздела (.ha): Higgsfield-объект + данные ---------- */
.ha { background: linear-gradient(150deg, var(--ov-hero-a), var(--ov-hero-b) 55%, var(--ov-hero-c) 135%); border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent); border-radius: 18px; color: #fff; overflow: hidden; position: relative; display: grid; grid-template-columns: 175px 1fr; gap: 6px; align-items: center; box-shadow: 0 16px 40px rgba(6, 17, 38, .3); padding: 16px 20px 16px 10px; }
.ha-stage { position: relative; display: grid; place-items: center; min-height: 170px; }
.ha-glow { position: absolute; width: 88%; height: 78%; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 52%, transparent), transparent 72%); filter: blur(24px); animation: f3pulse 5.5s ease-in-out infinite; transition: opacity .25s; }
.ha-glow.lit { background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 75%, transparent), rgba(124, 58, 237, .3) 60%, transparent 75%); }
.ha-obj { position: relative; z-index: 2; width: min(82%, 150px); max-height: 165px; object-fit: contain; animation: f3float 7s ease-in-out infinite; filter: drop-shadow(0 20px 26px rgba(0, 0, 0, .5)); }
.ha-p { position: absolute; bottom: 12%; left: calc(50% + var(--px, 0px)); width: 3.5px; height: 3.5px; border-radius: 50%; background: var(--blue-300); box-shadow: 0 0 7px color-mix(in srgb, var(--accent) 90%, transparent); opacity: 0; animation: haup 3.8s linear infinite; animation-delay: var(--pd, 0s); z-index: 1; }
@keyframes haup { 0% { opacity: 0; transform: translateY(6px) } 15% { opacity: .9 } 60% { opacity: .5; transform: translateY(-90px) } 85% { opacity: 0; transform: translateY(-130px) } 100% { opacity: 0 } }
.ha-body { min-width: 0; position: relative; z-index: 2; padding: 4px 0; }
.ha-title { display: flex; align-items: center; gap: 9px; font-weight: 750; font-size: 14.5px; margin-bottom: 10px; }
.ha-title svg { width: 16px; height: 16px; color: var(--blue-300); }
.ha-title .sub { font-weight: 500; font-size: 11.5px; color: var(--ink-3); }
.ha-row { display: flex; align-items: center; gap: 12px; padding: 7px 12px; border-radius: 11px; cursor: default; transition: background .18s var(--ease-spring, ease), transform .18s var(--ease-spring, ease); }
.ha-row:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); transform: translateX(5px); }
.ha-row .dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; background: var(--accent); box-shadow: 0 0 7px color-mix(in srgb, var(--accent) 55%, transparent); }
.ha-row .nm2 { font-size: 12.5px; color: #B9C7E8; min-width: 0; }
.ha-row .nm2 b { color: #fff; font-weight: 750; }
.ha-row .sp2 { flex: 1; }
.ha-row .val2 { font-weight: 800; font-size: 16px; color: #fff; }
.ha-row .sub2 { font-size: 11px; color: rgba(255,255,255,.68); }   /* на тёмном hero — светлый нейтраль (был сломан на var(--ink-3)) */
/* видеофон data-hero: абстрактный луп поверх тёмного градиента, контент выше */
.ovx-hero, .f3card { position: relative; overflow: hidden; }
.hero-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; opacity: .5; pointer-events: none; mix-blend-mode: screen; }
.ha > *:not(.hero-vid), .ovx-hero > *:not(.hero-vid), .f3card > *:not(.hero-vid) { position: relative; z-index: 1; }
.ha .ha-obj { z-index: 2; }
@media (prefers-reduced-motion: reduce) { .hero-vid { display: none; } }
.ha-chips { display: flex; gap: 8px; flex-wrap: wrap; }
/* тёмная frosted-пилюля: читаема и на СВЕТЛОЙ, и на ТЁМНОЙ обложке (раньше был захардкоженный светлый #CBD8F5 — на светлой обложке пропадал) */
.ha-chip { border: 1px solid rgba(255,255,255,.24); border-radius: 999px; padding: 6px 13px; font-size: 12px; font-weight: 650; color: #fff; background: rgba(16,30,55,.52); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); transition: all .18s var(--ease-spring, ease); cursor: default; }
.ha-chip:hover { border-color: rgba(255,255,255,.42); background: rgba(16,30,55,.66); transform: translateY(-2px); color: #fff; }
.ha-chip b { color: #fff; }
.ha-steps { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.ha-step { border-radius: 9px; background: rgba(255, 255, 255, .07); border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent); padding: 5px 10px; font-size: 11px; font-weight: 650; color: rgba(255,255,255,.72); animation: hastep 3.6s ease-in-out infinite; animation-delay: calc(var(--i) * .45s); }
@keyframes hastep { 0%, 100% { background: rgba(255, 255, 255, .07); color: rgba(255,255,255,.72) } 8% { background: color-mix(in srgb, var(--accent) 42%, transparent); color: #fff; box-shadow: 0 0 14px color-mix(in srgb, var(--accent) 50%, transparent) } 20% { background: rgba(255, 255, 255, .07); color: rgba(255,255,255,.72) } }
@media (prefers-reduced-motion: reduce) { .ha-obj, .ha-glow, .ha-p, .ha-step { animation: none; } .ha-p { display: none; } }
@media (max-width: 760px) { .ha { grid-template-columns: 1fr; padding: 16px; } .ha-stage { min-height: 140px; } .ha-obj { width: 120px; } }

/* пустой чат: стеклянные пузыри вместо голого текста */
.chat-empty { display: grid; place-items: center; align-content: center; gap: 14px; height: 100%; color: var(--ink-3, #8a90a0); font-size: 13px; }
.ce-art { width: 150px; opacity: .9; animation: f3float 7s ease-in-out infinite; filter: drop-shadow(0 14px 22px rgba(16, 43, 92, .25)); }
/* плейбук: кликабельные чипы категорий в hero */
[data-pbgo] { user-select: none; }

/* ---------- сайдбар: тонкая Higgsfield-вуаль (8КБ) + деликатное дыхание ---------- */
.sidebar { position: relative; overflow: hidden; }
.sidebar::before { content: ''; position: absolute; left: 0; right: 0; top: -55%; height: 215%; background: url('assets/sidebar-veil.jpg') center / cover; opacity: .22; animation: veilDrift 70s ease-in-out infinite alternate; pointer-events: none; }
@keyframes veilDrift { from { transform: translateY(0) scale(1.06); } to { transform: translateY(5.5%) scale(1.14); } }
.sidebar > * { position: relative; z-index: 1; }
/* markBreath/navGlow УБРАНЫ: анимация drop-shadow интерполировалась через oklab и давала
   ядовито-ЗЕЛЁНУЮ подсветку за логотипом (out-of-gamut overshoot) + пульс раздражал.
   Статичное спокойное свечение — Apple-стиль. */
.brand-mark { filter: drop-shadow(0 2px 9px color-mix(in srgb, var(--accent) 36%, transparent)); }
@media (prefers-reduced-motion: reduce) { .sidebar::before, .brand-mark, .nav-item.active { animation: none; } }

/* ---------- деталка объекта v2: контрастные секции + премиум-поля ---------- */
.pd2 { display: flex; flex-direction: column; gap: 16px; }
.pd2-hero { position: relative; border-radius: 18px; overflow: hidden; background: linear-gradient(150deg, var(--ov-hero-a), var(--ov-hero-c)) center / cover; min-height: 250px; color: #fff; box-shadow: 0 18px 44px rgba(6, 17, 38, .3); }
.pd2-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6, 17, 38, .55), rgba(6, 17, 38, .82)); }
.pd2-in { position: relative; padding: 16px 20px 18px; display: flex; flex-direction: column; gap: 14px; min-height: inherit; }
.pd2-top { display: flex; gap: 9px; align-items: center; }
.pd2-ghost { background: rgba(6, 17, 38, .5); color: #fff; border: 1px solid rgba(255, 255, 255, .3); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-weight: 600; box-shadow: 0 4px 14px rgba(0, 0, 0, .3); }
.pd2-ghost:hover { background: rgba(6, 17, 38, .72); border-color: rgba(255, 255, 255, .5); }
.pd2-ghost.danger:hover { background: rgba(224, 82, 82, .55); border-color: rgba(224, 82, 82, .7); }
/* #prBack — «Все объекты»: чуть заметнее, стрелка ясная */
#prBack { padding-left: 12px; }
.pd2-save { display: inline-flex; gap: 5px; align-items: center; font-size: 11px; color: var(--blue-300); }
.pd2-save svg { width: 12px; height: 12px; }
.pd2-main { display: flex; gap: 20px; align-items: flex-end; margin-top: auto; flex-wrap: wrap; }
.pd2-namebox { flex: 1; min-width: 260px; }
.pd2-name { background: transparent !important; border: none !important; color: #fff !important; font-size: 27px !important; font-weight: 800 !important; letter-spacing: -.4px; padding: 4px 6px !important; border-radius: 8px; width: 100%; }
.pd2-name:hover, .pd2-name:focus { background: rgba(255, 255, 255, .08) !important; outline: 1px dashed color-mix(in srgb, var(--accent) 40%, transparent); }
.pd2-sub { display: flex; gap: 8px; margin-top: 6px; flex-wrap: wrap; }
.pd2-price { font-size: 21px; font-weight: 800; display: flex; align-items: baseline; gap: 6px; justify-content: flex-end; }
.pd2-priceinp { width: 130px; background: rgba(255, 255, 255, .1) !important; border: 1px solid rgba(255, 255, 255, .2) !important; color: #fff !important; font-size: 20px !important; font-weight: 800 !important; text-align: right; border-radius: 9px; }
.pd2-selects { display: flex; gap: 7px; margin-top: 8px; justify-content: flex-end; }
.pd2-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.pd2-bdg { display: inline-flex; gap: 6px; align-items: center; border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); background: rgba(10, 24, 51, .5); backdrop-filter: blur(6px); border-radius: 999px; padding: 6px 13px; font-size: 12px; font-weight: 650; color: #DCE6FF; }
.pd2-bdg svg { width: 12px; height: 12px; color: var(--blue-300); }
.pd2-bdg.hot { border-color: rgba(255, 184, 107, .55); color: #FFD9AC; }
.pd2-bdg.hot svg { color: #FFB86B; }
/* секции с сильными заголовками */
.pds { background: var(--card); border: 1px solid var(--line, #E5EAF3); border-radius: 16px; padding: 18px 20px 20px; box-shadow: 0 6px 22px rgba(16, 43, 92, .05); }
.pds-hd { display: flex; gap: 12px; align-items: center; margin-bottom: 16px; }
.pds-hd > div b { display: block; font-size: 15px; font-weight: 800; color: var(--navy-900, #0A1833); }
.pds-hd > div i { font-style: normal; font-size: 11.5px; color: var(--ink-3, #8a90a0); }
.pds-ic { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: 0 0 34px; background: linear-gradient(140deg, #EAF0FF, #DCE6FF); color: var(--accent); font-size: 15px; font-weight: 800; }
.pds-ic svg { width: 16px; height: 16px; }
.pds-ic.v { background: linear-gradient(140deg, var(--accent), var(--accent-3)); color: #fff; }
.pds-ic.p { background: linear-gradient(140deg, #0E3B2E, #23B383); color: #fff; }
.pds-ic.m { background: linear-gradient(140deg, #5C2B10, #E4813D); color: #fff; }
.pds.tint { background: linear-gradient(160deg, #F3F7FF, #EAF1FF); border-color: #D5E2FF; }
.pds.grey { background: #F7F9FC; }
.pds-grid { display: grid; gap: 12px; }
.pds-grid.c3 { grid-template-columns: repeat(3, 1fr); }
.pds-grid.c2 { grid-template-columns: 1fr 1fr; }
.pds-grid.hookrow { grid-template-columns: 2fr 1fr 1fr; }
.pds-grid.media { align-items: start; }
/* премиум-поля: мягкая заливка, кобальтовый фокус-ринг */
.pd2 .lc-lbl, .pds .lc-lbl { font-size: 10px; text-transform: uppercase; letter-spacing: .09em; font-weight: 750; color: #6E7FA6; margin-bottom: 6px; display: block; }
.pd2 .gi, .pd2 textarea.gi, .pds .gi { width: 100%; background: #F4F7FD; border: 1.5px solid transparent; border-radius: 11px; padding: 10px 13px; font-size: 13.5px; transition: border-color .15s, background .15s, box-shadow .15s; }
.pd2 .gi:hover, .pds .gi:hover { background: #EEF3FB; }
.pd2 .gi:focus, .pds .gi:focus { background: var(--card); border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent); outline: none; }
.pd2 .gi.big { font-size: 15px; font-weight: 650; padding: 12px 14px; }
.pds.tint .gi { background: var(--card); box-shadow: inset 0 1px 3px rgba(16, 43, 92, .05); }
/* чипы + «своё значение» */
.chip-add { display: inline-flex; align-items: center; gap: 4px; }
.chip-add input { width: 130px; background: transparent; border: 1.5px dashed #C4D2EC; border-radius: 999px; padding: 6px 12px; font-size: 12px; }
.chip-add input:focus { border-color: var(--accent); outline: none; }
.chip-plus { width: 26px; height: 26px; border-radius: 50%; border: none; background: #EAF0FF; color: var(--accent); cursor: pointer; display: grid; place-items: center; }
.chip-plus:hover { background: var(--accent); color: #fff; }
.chip-plus svg { width: 12px; height: 12px; }
/* план оплаты: калькулятор */
.pay-calc { display: flex; gap: 14px; align-items: center; margin-bottom: 12px; flex-wrap: wrap; }
.pay-calc .lc-lbl { margin: 0; }
.pay-calc-in { display: flex; align-items: center; gap: 6px; background: #F4F7FD; border-radius: 11px; padding: 6px 12px; font-weight: 800; color: var(--accent); }
.pay-calc-in input { width: 130px; background: transparent; border: none; outline: none; font-size: 15px; font-weight: 800; color: var(--navy-900, #0A1833); }
.pay-total { font-size: 11.5px; font-weight: 700; border-radius: 999px; padding: 5px 12px; background: #F1F3F8; color: #6E7FA6; }
.pay-total.ok { background: #E4F7EC; color: #148A4E; }
.pay-total.warn { background: #FFF3E0; color: #B26A00; }
.prow-list { display: flex; flex-direction: column; gap: 7px; }
.prow { display: flex; gap: 9px; align-items: center; background: #F7F9FC; border-radius: 11px; padding: 7px 9px; }
.prow-n { width: 22px; height: 22px; border-radius: 50%; background: linear-gradient(140deg, var(--accent), var(--accent-3)); color: #fff; font-size: 11px; font-weight: 800; display: grid; place-items: center; flex: 0 0 22px; }
.prow-pct { width: 74px; flex: 0 0 74px; text-align: center; font-weight: 800; color: var(--accent); background: var(--card); border: 1.5px solid #E1E8F4; border-radius: 9px; padding: 7px 6px; }
.prow-lbl { flex: 1; background: var(--card); border: 1.5px solid #E1E8F4; border-radius: 9px; padding: 7px 11px; font-size: 13px; }
.prow-pct:focus, .prow-lbl:focus { border-color: var(--accent); outline: none; }
.prow-amt { font-size: 12.5px; font-weight: 750; color: #148A4E; min-width: 86px; text-align: right; }
.prow-bar { height: 7px; border-radius: 999px; background: #EDF1F8; margin-top: 12px; overflow: hidden; }
.prow-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #23B383, var(--accent)); transition: width .4s var(--ease-spring, ease); }
.prow-bar i.warn { background: linear-gradient(90deg, #E4813D, #E0B252); }
@media (max-width: 1000px) { .pds-grid.c3, .pds-grid.hookrow { grid-template-columns: 1fr 1fr; } .pd2-main { align-items: flex-start; } }
@media (max-width: 640px) { .pds-grid.c3, .pds-grid.c2, .pds-grid.hookrow { grid-template-columns: 1fr; } .pd2-price { justify-content: flex-start; } .pd2-selects { justify-content: flex-start; } }

/* ---------- прелоадер: двойной брендинг агентство × Lumen ---------- */
.pl-center.duo .pl-sub { display: none; }
.pl-ag { display: grid; place-items: center; gap: 12px; margin-bottom: 26px; }
.pl-ag img { max-width: 200px; max-height: 96px; object-fit: contain; animation: logoBreath 2.6s var(--ease-soft) infinite; }
.pl-agname { font-size: 15px; font-weight: 650; letter-spacing: .14em; color: #fff; text-transform: uppercase; }
.pl-pow { font-size: 9.5px; letter-spacing: .22em; text-transform: uppercase; color: var(--blue-300); opacity: .75; margin-bottom: 8px; }
.pl-lrow { display: flex; gap: 8px; align-items: center; justify-content: center; opacity: .85; }
.pl-center.duo .pl-logo { width: 15px; height: 18px; margin: 0; animation: none; filter: drop-shadow(0 0 8px color-mix(in srgb, var(--accent) 50%, transparent)); }
.pl-center.duo .pl-word { font-size: 12.5px; letter-spacing: .28em; }

/* ---------- чат: оформление по каналу общения ---------- */
.chn-chip { display: inline-flex; gap: 7px; align-items: center; font-size: 11.5px; font-weight: 700; color: var(--chn); border: 1.5px solid color-mix(in srgb, var(--chn) 45%, transparent); border-radius: 999px; padding: 5px 12px; }
.chn-chip i { width: 7px; height: 7px; border-radius: 50%; background: var(--chn); box-shadow: 0 0 7px var(--chn); }
/* WhatsApp: тёплая бумага + фирменные зелёные исходящие */
.chat--wa .chat-body { background: #EAE4DA url("data:image/svg+xml,%3Csvg width='90' height='90' viewBox='0 0 90 90' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d8d0c2' fill-opacity='.45'%3E%3Ccircle cx='12' cy='14' r='2.2'/%3E%3Cpath d='M60 20c3-4 9-4 11 0M28 62c2-3 7-3 9 0' stroke='%23d8d0c2' stroke-width='1.4' fill='none'/%3E%3Ccircle cx='72' cy='74' r='1.8'/%3E%3Crect x='40' y='42' width='4' height='4' rx='1'/%3E%3C/g%3E%3C/svg%3E"); }
.chat--wa .bubble.out { background: #DCF8C6; color: #10261B; border: none; }
.chat--wa .bubble.out .bmeta { color: #4E7A5B; opacity: 1; }
.chat--wa .bubble.in { background: #fff; }
/* Telegram: холодный голубой + синие исходящие */
.chat--tg .chat-body { background: linear-gradient(180deg, #E8F0F9, #DCE9F6); }
.chat--tg .bubble.out { background: #D3E8FF; color: #0D2B4E; border: none; }
.chat--tg .bubble.out .bmeta { color: #4A79AC; opacity: 1; }
/* Viber: фиолетовая дымка */
.chat--viber .chat-body { background: linear-gradient(180deg, #F3EFFB, #EAE2F8); }
.chat--viber .bubble.out { background: #E2D6F8; color: #2A1B4E; border: none; }
.chat--viber .bubble.out .bmeta { color: #7B63B8; opacity: 1; }
/* E-mail: нейтральная канцелярия */
.chat--email .chat-body { background: linear-gradient(180deg, #F5F7F9, #EEF1F5); }
.chat--email .bubble.out { background: #E6EAF0; color: #22293A; border: none; }
.chat--email .bubble { border-radius: 10px; }
/* компакт-карточка в панели лида */
.lp-manage select { width: 100%; }

/* ---------- hero-панели: пер-страничные варианты и оттенки ---------- */
/* hero-градиент — ТЕМАТИЗИРОВАН через --ov-hero-* (раньше был захардкожен navy #061126/#0A1833
   и в Бургунди/Стекле давал чужой синий; теперь бордо в warm, графит в emerald и т.д.) */
.ha { --hue: var(--accent); background: linear-gradient(150deg, var(--ov-hero-a), var(--ov-hero-b) 52%, color-mix(in srgb, var(--hue) 28%, var(--ov-hero-c)) 135%); }
.ha .ha-glow { background: radial-gradient(closest-side, color-mix(in srgb, var(--hue) 55%, transparent), transparent 72%); }
.ha .ha-row .dot { background: var(--hue); box-shadow: 0 0 8px var(--hue); }
.ha .ha-chip:hover { border-color: color-mix(in srgb, var(--hue) 70%, #fff); }
.ha .f3bar i, .ha .ha-glow.lit { background: radial-gradient(closest-side, color-mix(in srgb, var(--hue) 80%, #fff), color-mix(in srgb, var(--hue) 35%, transparent) 60%, transparent 75%); }
.ha.v-right { grid-template-columns: 1fr 175px; }
.ha.v-right .ha-stage { order: 2; }
.ha.v-right .ha-body { order: 1; padding-left: 12px; }
.ha.v-mark { grid-template-columns: 1fr; position: relative; }
.ha.v-mark .ha-stage { position: absolute; right: -30px; top: 50%; transform: translateY(-50%); width: 300px; min-height: 0; opacity: .92; pointer-events: none; }
.ha.v-mark .ha-obj { width: 230px; max-height: 230px; }
.ha.v-mark .ha-body { padding: 6px 300px 6px 12px; }
@media (max-width: 900px) { .ha.v-mark .ha-stage { position: static; transform: none; width: auto; opacity: 1; } .ha.v-mark .ha-body { padding: 4px 0; } .ha.v-mark { grid-template-columns: 1fr; } .ha.v-right { grid-template-columns: 1fr; } .ha.v-right .ha-stage { order: -1; } }

/* эмулятор: спокойный статичный режим + шкала дней */
.wa-scrub { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; margin-bottom: 14px; }
.wa-sc { border: 1px solid var(--stroke, #E1E8F4); background: #fff; border-radius: 999px; padding: 5px 12px; font-size: 11px; font-weight: 700; color: var(--ink-2, #3A4256); cursor: pointer; font-family: inherit; transition: all .15s; }
.wa-sc:hover, .wa-sc.on { border-color: var(--accent); color: var(--accent); background: #EFF4FF; }
.wa-msg.calm { animation: waCalm .5s var(--ease-spring, ease) both; animation-delay: calc(var(--wi) * 90ms); }
.wa-day { animation: waCalm .5s var(--ease-spring, ease) both; animation-delay: calc(var(--wi, 0) * 90ms); }
@keyframes waCalm { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.wa-msg.lit { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 45%, transparent); transition: box-shadow .3s; }
@media (prefers-reduced-motion: reduce) { .wa-msg.calm, .wa-day { animation: none; } }

/* редактор брокера: полноширинная аккуратная панель */
.br-edit { grid-column: 1 / -1; }
.br-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; max-width: 860px; }
.br-edit .gi, .br-edit select { width: 100%; }
@media (max-width: 760px) { .br-edit-grid { grid-template-columns: 1fr; } }
#pageSub:empty { display: none; }

/* эмулятор: симметрия и чистый край */
.wa-body::-webkit-scrollbar { display: none; }
.wa-msg { max-width: 82%; }
.wa-msg.out { margin-left: auto; }

/* KPI: спарклайн + hover-лифт */
.kpi { position: relative; overflow: hidden; transition: transform .2s var(--ease-spring, ease), box-shadow .2s; }
.kpi:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(16, 43, 92, .12); }
.kpi-spark { position: absolute; right: 10px; bottom: 8px; width: 92px; height: 30px; opacity: .85; }

/* пер-дневные интервалы смен */
.dt-row { display: flex; gap: 9px; align-items: center; margin-bottom: 7px; }
.dt-d { width: 30px; flex: 0 0 30px; font-size: 12px; font-weight: 800; color: var(--acc, var(--accent)); text-transform: uppercase; }
.dt-sep { color: var(--ink-3, #8a90a0); }
.dt-row .cs, .dt-row .gi { flex: 1; }

/* ============================================================
   НОЧНОЙ РЕЖИМ (html[data-night]) — глубокий кобальт-люкс
   ============================================================ */
html[data-night] {
  --bg: #0A1120; --bg-2: #0C1424; --card: #101B31; --glass: rgba(16, 27, 49, .72);
  --ink: #E9EEF9; --ink-2: #BCC7DE; --ink-3: #8291AE;
  --stroke: #26355A; --stroke-soft: #1B2843;
  --blue-100: #1C2C50; --blue-300: #8FB4FF;
  --ok-bg: #0E2A21; --warn-bg: #2B2310; --bad-bg: #2B1613; --violet-bg: #201B3E;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 10px 28px -12px rgba(0, 0, 0, .5);
  --shadow-lift: 0 14px 36px -12px rgba(0, 0, 0, .6);
}
html[data-night] body { background: var(--bg); color: var(--ink); }
/* поверхности с жёсткими литералами */
html[data-night] .pds, html[data-night] .pds.grey { background: var(--card); border-color: var(--stroke-soft); }
html[data-night] .pds.tint { background: linear-gradient(160deg, #14203C, #101B31); border-color: #26355A; }
html[data-night] .pds-hd > div b { color: var(--ink); }
html[data-night] .pds-ic { background: #1C2C50; color: #8FB4FF; }
html[data-night] .pd2 .gi, html[data-night] .pd2 textarea.gi, html[data-night] .pds .gi { background: #0D1730; color: var(--ink); }
html[data-night] .pd2 .gi:hover, html[data-night] .pds .gi:hover { background: #122040; }
html[data-night] .pd2 .gi:focus, html[data-night] .pds .gi:focus { background: #0D1730; }
html[data-night] .prow { background: #0D1730; }
html[data-night] .prow-pct, html[data-night] .prow-lbl { background: #101B31; border-color: #26355A; color: var(--ink); }
html[data-night] .prow-bar { background: #16223C; }
html[data-night] .pay-calc-in { background: #0D1730; }
html[data-night] .pay-calc-in input { color: var(--ink); }
html[data-night] .pay-total { background: #16223C; color: var(--ink-3); }
html[data-night] .chip-add input { border-color: #2C3B60; color: var(--ink); }
html[data-night] .chip-plus { background: #1C2C50; color: #8FB4FF; }
html[data-night] .wa-sc { background: var(--card); border-color: var(--stroke); color: var(--ink-2); }
html[data-night] .nm-edit { background: var(--card); color: var(--ink); }
html[data-night] .f3card, html[data-night] .ha { box-shadow: 0 18px 44px rgba(0, 0, 0, .5); }
html[data-night] .kpi-spark { opacity: 1; }
html[data-night] .aiwrap textarea { background: #0D1730; color: var(--ink); }
/* переключатель */
#nightBtn { width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--stroke); background: var(--card); cursor: pointer; display: grid; place-items: center; font-size: 15px; transition: transform .2s var(--ease-spring); }
#nightBtn:hover { transform: scale(1.08); }

/* ночной режим: тексты на var(--navy-900) становятся светлыми */
html[data-night] .page-title,
html[data-night] .card-title,
html[data-night] .kpi .val,
html[data-night] .funnel-row .fv,
html[data-night] .vs-row .v,
html[data-night] .lead-card .nm,
html[data-night] .conv .nm,
html[data-night] .chat-head .nm,
html[data-night] .lp-name,
html[data-night] .axis .ax-val,
html[data-night] .set-row .sl,
html[data-night] .seq-step .st-name,
html[data-night] .seg .sg-num,
html[data-night] .tbl td b,
html[data-night] .wake-score,
html[data-night] .cmp-head .nm,
html[data-night] .cmp-stat .v,
html[data-night] .num-head .ph,
html[data-night] .q-ring .txt,
html[data-night] .num-meta .m .v,
html[data-night] .geo-bar .g-top b,
html[data-night] .tpl-head .nm,
html[data-night] .broker-card .nm,
html[data-night] .modal h3,
html[data-night] .toast,
html[data-night] .coll-head,
html[data-night] .gs-item .gn,
html[data-night] .dtp-head b,
html[data-night] .lp-ai-state b,
html[data-night] .axr-v,
html[data-night] .axg-c b,
html[data-night] .lc-f.active,
html[data-night] .lc-cv,
html[data-night] .lc-meet b,
html[data-night] .lcf-step.cur span,
html[data-night] .lc-ai-head b,
html[data-night] .prop-name,
html[data-night] .cal-dhead b,
html[data-night] .gi-title,
html[data-night] .pb-t,
html[data-night] .fl-tab.active,
html[data-night] .fl-title b,
html[data-night] .pb-cat-t b,
html[data-night] .pb-main-hd b,
html[data-night] .pb-acc-t,
html[data-night] .fold-meta b,
html[data-night] .payrow-mini b,
html[data-night] .ch-prio span,
html[data-night] .seg-btn.on { color: var(--ink); }

/* ночной режим: кастомные контролы и поповеры */
html[data-night] .cs-btn { background: #0D1730; border-color: #26355A; color: var(--ink); }
html[data-night] .cs-btn:hover { border-color: #3A4E7E; }
html[data-night] .cs-list, html[data-night] .dtp-pop, html[data-night] .pop { background: #101B31; border-color: #26355A; color: var(--ink); box-shadow: 0 18px 50px rgba(0, 0, 0, .6); }
html[data-night] .cs-opt:hover, html[data-night] .pop-item:hover { background: #1C2C50; }
html[data-night] input, html[data-night] textarea, html[data-night] select { background: #0D1730; border-color: #26355A; color: var(--ink); }
html[data-night] .search input { background: #0D1730; color: var(--ink); }
html[data-night] .modal { background: rgba(16, 27, 49, .96); }
html[data-night] .toast { background: rgba(16, 27, 49, .95); color: var(--ink); }
html[data-night] .fold-meta b { color: var(--ink); }
html[data-night] .fold-meta i { color: var(--ink-3); }

/* ---------- «?»-подсказки (минимализм: объяснялки в поповере, не на экране) ---------- */
.hint-q { width: 21px; height: 21px; border-radius: 50%; border: 1px solid var(--stroke); background: transparent; color: var(--ink-3); font-size: 11.5px; font-weight: 700; line-height: 1; cursor: pointer; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; vertical-align: middle; margin-left: 7px; transition: color .18s, border-color .18s, transform .18s var(--ease-spring); }
.hint-q:hover { color: var(--accent); border-color: var(--accent); transform: scale(1.08); }
.hint-pop { position: fixed; z-index: 460; padding: 14px 16px 10px; border-radius: 14px; background: #fff; border: 1px solid var(--stroke); box-shadow: 0 18px 50px rgba(6, 17, 38, .22); opacity: 0; transform: translateY(6px); transition: opacity .2s, transform .22s var(--ease-spring); }
.hint-pop.show { opacity: 1; transform: none; }
.hint-pop .hp-t { font-size: 13px; font-weight: 700; color: var(--navy-900); margin-bottom: 4px; }
.hint-pop .hp-row { padding: 8px 0; border-top: 1px solid var(--stroke-soft); }
.hint-pop .hp-row:first-of-type { border-top: none; }
.hint-pop .hp-row b { display: block; font-size: 12.2px; font-weight: 650; color: var(--navy-900); }
.hint-pop .hp-row span { display: block; font-size: 11.6px; line-height: 1.5; color: var(--ink-3); margin-top: 1px; }
html[data-night] .hint-pop { background: #101B31; border-color: #26355A; box-shadow: 0 18px 50px rgba(0, 0, 0, .6); }
html[data-night] .hint-pop .hp-t, html[data-night] .hint-pop .hp-row b { color: var(--ink); }
.mini-badge svg { width: 10px; height: 10px; display: block; }
.mini-badge { display: inline-flex; align-items: center; }

/* деталка: спокойная колонна вместо «хаоса» на всю ширину */
.pd2 { max-width: 1240px; margin: 0 auto; }
.pds-hd { padding-bottom: 12px; border-bottom: 1px solid var(--stroke-soft); }

/* ночной режим: добивка после аудита контраста (белые фоны кнопок/панелей ушли в var(--card)) */
html[data-night] .tbl th { color: var(--ink-3); }
html[data-night] .tl-note { background: #251F0E; border-color: #3D3418; }
html[data-night] .pay-total.warn { background: #2B2310; color: #E3B96A; }
html[data-night] .btn-danger { border-color: #4A2320; }
html[data-night] .seg-btn.on { box-shadow: 0 1px 3px rgba(0, 0, 0, .4); }
html[data-night] .bubble.in { box-shadow: none; }

/* деталка: двухколоночная композиция — рабочая зона + компактная боковина */
.pd2-cols { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.pd2-mcol, .pd2-scol { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.pd2-scol .pds { padding: 16px 18px 18px; }
.pd2-scol .pds-grid.c3 { grid-template-columns: 1fr; gap: 10px; }
.pd2-scol .pds-grid.c3 .pd-fact[style*="span 2"] { grid-column: auto; }
.pd2-scol .pds-grid.media { grid-template-columns: 1fr; }
.pd2-scol .chips-row { max-height: 132px; overflow-y: auto; scrollbar-width: thin; padding-right: 4px; }
.pd2-scol .pd-imgs { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
@media (max-width: 1100px) { .pd2-cols { grid-template-columns: 1fr; } }

/* ночной режим: панель лида и WhatsApp-чат (баги «светлым по светлому», найдены визуально) */
html[data-night] .chat--wa .bubble.in { color: #17202A; }
html[data-night] .chat--wa .bubble.in .bmeta { color: rgba(23, 32, 42, .5); }
html[data-night] .axis.done { background: #0E2A21; border-color: #1E4636; }
html[data-night] .lc-hint.act { color: #BFD3FF; border-color: #2A3C6B; }
html[data-night] .lc-hint.warn { border-color: #4A3E1C; }
html[data-night] .lp-ai-state { background: linear-gradient(150deg, #152647, #0E1A33); border-color: #2A3C6B; }
html[data-night] .axr.done { background: #0E2A21; }
html[data-night] .lp-ad { color: #BFD3FF; }

/* KPI-дельты неделя-к-неделе (Обзор) */
.kpi .kd { display: inline-block; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 9px; vertical-align: 6px; margin-left: 8px; letter-spacing: .02em; }
.kd.up { background: rgba(35, 179, 131, .14); color: #23B383; }
.kd.dn { background: rgba(229, 72, 77, .13); color: #E5484D; }
.kd.flat { background: var(--bg-2); color: var(--ink-3); }

/* фото брокера */
.br-photo { width: 52px; height: 52px; flex: 0 0 52px; border-radius: 50%; background: var(--blue-100); color: var(--accent); display: grid; place-items: center; font-weight: 700; font-size: 16px; overflow: hidden; border: 1px solid var(--stroke); }
.br-photo img { width: 100%; height: 100%; object-fit: cover; }

/* онбординг-чеклист агентства (Обзор) */
.ob-check .coll { margin: 0; border: none; background: transparent; }
.ob-row { display: flex; align-items: center; gap: 13px; width: 100%; text-align: left; padding: 10px 4px; border: none; background: transparent; cursor: pointer; border-bottom: 1px solid var(--stroke-soft); font-family: inherit; }
.ob-row:last-child { border-bottom: none; }
.ob-row .ob-dot { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%; border: 1.5px solid var(--stroke); display: grid; place-items: center; color: #23B383; }
.ob-row.ok .ob-dot { border-color: #23B383; background: rgba(35, 179, 131, .12); }
.ob-row .ob-dot svg { width: 12px; height: 12px; }
.ob-row .ob-t { flex: 1; font-size: 13.2px; font-weight: 600; color: var(--navy-900); }
.ob-row.ok .ob-t { color: var(--ink-3); text-decoration: line-through; text-decoration-color: rgba(102, 112, 133, .4); font-weight: 500; }
.ob-row .ob-t i { display: block; font-style: normal; font-size: 11.3px; color: var(--ink-3); font-weight: 400; margin-top: 1px; }
.ob-row .ob-go { color: var(--accent); }
.ob-row .ob-go svg { width: 14px; height: 14px; }
.ob-row:hover .ob-t { color: var(--accent); }
html[data-night] .ob-row .ob-t { color: var(--ink); }
html[data-night] .ob-row.ok .ob-t { color: var(--ink-3); }
.gs-m { background: color-mix(in srgb, var(--accent) 22%, transparent); color: inherit; border-radius: 3px; padding: 0 1px; }

/* ---------- Комментарии под рекламой (comment-to-lead) ---------- */
.cmt-list { display: flex; flex-direction: column; gap: 12px; }
.cmt-card { position: relative; display: flex; gap: 12px; background: var(--card); border: 1px solid var(--stroke-soft); border-radius: 14px; padding: 14px 16px; transition: box-shadow .18s; }
.cmt-card .lc-check { left: auto; right: 12px; top: 12px; }
.cmt-card:hover .lc-check, .cmt-card.sel .lc-check { opacity: 1; transform: scale(1); }
.cmt-card.sel .lc-check { background: var(--accent); border-color: var(--accent); }
.cmt-card.sel .lc-check svg { opacity: 1; }
.cmt-card.sel { box-shadow: inset 0 0 0 2px var(--accent); }
.cmt-card.new { border-left: 3px solid var(--accent); }
.cmt-card.hidden { opacity: .55; }
.cmt-card:hover { box-shadow: var(--shadow); }
.cmt-ava { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 50%; background: linear-gradient(140deg, #E4813D, #B85C1E); color: #fff; font-weight: 800; font-size: 13px; display: grid; place-items: center; }
.cmt-main { flex: 1; min-width: 0; }
.cmt-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cmt-head b { font-size: 13.5px; color: var(--navy-900); }
.cmt-head .muted { font-size: 12px; }
.cmt-plat { font-size: 9.5px; font-weight: 800; padding: 2px 6px; border-radius: 5px; letter-spacing: .04em; }
.cmt-plat.ig { background: linear-gradient(120deg, #F58529, #DD2A7B); color: #fff; }
.cmt-plat.fb { background: #1877F2; color: #fff; }
.cmt-intent { font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px; background: var(--bg-2); color: var(--ink-2); }
.cmt-intent.hot { background: #FFF0E4; color: #C05B18; }
.cmt-intent.neg { background: var(--bad-bg); color: var(--bad); }
.cmt-text { font-size: 14px; line-height: 1.5; margin: 7px 0; color: var(--ink); }
.cmt-ad { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-3); background: var(--bg-2); padding: 4px 10px; border-radius: 8px; }
.cmt-ad svg { width: 12px; height: 12px; }
.cmt-replies { margin: 9px 0; display: flex; flex-direction: column; gap: 5px; }
.cmt-reply { font-size: 12.5px; line-height: 1.45; padding: 8px 11px; border-radius: 9px; background: var(--bg-2); color: var(--ink-2); }
.cmt-reply.private { background: #EAF0FF; color: #2447A8; }
.cmt-acts { display: flex; gap: 7px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
.cmt-hidden-badge { font-size: 11px; color: var(--ink-3); margin-top: 8px; }
html[data-night] .cmt-intent.hot { background: #2B2310; color: #E4A968; }
html[data-night] .cmt-reply.private { background: #16223C; color: #8FB4FF; }

/* Комментарии: панель фильтров/сортировки, группы, «показать ещё» */
.cmt-controls { display: flex; gap: 10px; align-items: center; margin: 6px 0 14px; flex-wrap: wrap; }
.cmt-controls .cs { min-width: 170px; }
.cmt-group { margin-bottom: 20px; }
.cmt-group-hd { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--navy-900); padding: 6px 2px 10px; border-bottom: 1px solid var(--stroke-soft); margin-bottom: 12px; }
.cmt-group-hd svg { width: 14px; height: 14px; color: var(--accent); }
.cmt-group-n { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--ink-3); background: var(--bg-2); padding: 2px 9px; border-radius: 999px; }
.cmt-group .cmt-card { margin-bottom: 10px; }
.cmt-more { width: 100%; justify-content: center; margin-top: 6px; }
html[data-night] .cmt-group-hd { color: var(--ink); }
.cmt-mod { display: inline-block; margin-left: 8px; font-size: 10.5px; font-weight: 700; color: #C05B18; background: #FFF0E4; padding: 1px 8px; border-radius: 999px; vertical-align: middle; }
.cmt-acts button[disabled] { opacity: .5; cursor: not-allowed; }

/* ---------- Массовое управление лидами (Воронка) ---------- */
.lead-card { position: relative; }
/* по умолчанию имя у края; чекбокс проявляется на hover/выборе, имя мягко уезжает вправо */
.lead-card .top { transition: padding-left .22s var(--ease-spring, ease); }
.lead-card:hover .top, .lead-card.sel .top { padding-left: 24px; }
.lc-check { position: absolute; top: 12px; left: 10px; width: 19px; height: 19px; border-radius: 6px; border: 1.5px solid var(--stroke); background: var(--card); display: grid; place-items: center; cursor: pointer; opacity: 0; transform: scale(.6); transform-origin: 10px 10px; transition: opacity .18s var(--ease-spring, ease), transform .22s var(--ease-spring, ease), background .12s; z-index: 3; }
.lc-check svg { width: 12px; height: 12px; color: #fff; opacity: 0; transition: opacity .12s; }
.lead-card:hover .lc-check, .lead-card.sel .lc-check,
.prop-card:hover .lc-check, .prop-card.sel .lc-check,
.cl2-card:hover .lc-check, .cl2-card.sel .lc-check { opacity: 1; transform: scale(1); }
.lead-card.sel .lc-check, .prop-card.sel .lc-check, .cl2-card.sel .lc-check { background: var(--accent); border-color: var(--accent); }
.lead-card.sel .lc-check svg, .prop-card.sel .lc-check svg, .cl2-card.sel .lc-check svg { opacity: 1; }
/* выделение — рамкой ВНУТРЬ (inset box-shadow), чтобы не обрезалось краем колонки */
.lead-card.sel { box-shadow: inset 0 0 0 2px var(--accent); }
.prop-card.sel, .cl2-card.sel { box-shadow: inset 0 0 0 2px var(--accent), var(--shadow); }
.lc-check.tbl { position: static; opacity: .5; width: 18px; height: 18px; flex: 0 0 18px; }
tr.sel { background: color-mix(in srgb, var(--accent) 8%, transparent); }
tr.sel .lc-check.tbl { opacity: 1; background: var(--accent); border-color: var(--accent); }
tr.sel .lc-check.tbl svg { opacity: 1; }
tr:hover .lc-check.tbl { opacity: 1; }
/* панель массовых действий */
.bulk-bar { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 500; display: flex; align-items: center; gap: 7px; background: var(--navy-900); color: #fff; padding: 9px 10px 9px 16px; border-radius: 14px; box-shadow: 0 16px 44px rgba(6,17,38,.4); animation: bbIn .22s var(--ease-spring, ease); }
@keyframes bbIn { from { opacity: 0; transform: translate(-50%, 12px); } to { opacity: 1; transform: translate(-50%, 0); } }
.bb-count { background: var(--accent); color: #fff; font-weight: 800; font-size: 13px; min-width: 24px; height: 24px; border-radius: 999px; display: grid; place-items: center; padding: 0 7px; }
.bb-lbl { font-size: 12px; color: var(--blue-300); margin-right: 6px; }
.bulk-bar .btn { background: rgba(255,255,255,.1); color: #fff; border: none; }
.bulk-bar .btn:hover { background: rgba(255,255,255,.2); }
.bulk-bar .btn-danger { background: rgba(224,82,82,.25); }
.bulk-bar .btn-danger:hover { background: rgba(224,82,82,.45); }
.bb-sp { width: 4px; }
.bulk-bar .bb-clear { color: var(--blue-300); }
/* контекст-поповер */
.ctx-pop { position: fixed; z-index: 950; background: var(--card); border: 1px solid var(--stroke); border-radius: 12px; box-shadow: 0 18px 50px rgba(10,16,40,.28); padding: 6px; min-width: 210px; }
.ctx-item { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border-radius: 8px; cursor: pointer; font-size: 13.5px; color: var(--ink); }
.ctx-item:hover { background: var(--bg-2); }
.ctx-item svg { width: 15px; height: 15px; color: var(--ink-3); }
.ctx-item.danger { color: var(--bad); }
.ctx-item.danger svg { color: var(--bad); }
.ctx-arr { margin-left: auto; color: var(--ink-3); font-size: 11px; }
.ctx-sep { height: 1px; background: var(--stroke-soft); margin: 5px 8px; }
html[data-night] .bulk-bar { background: #0D1730; border: 1px solid var(--stroke); }
.kb-head .ct[data-selcol] { cursor: pointer; transition: background .12s, color .12s; }
.kb-head .ct[data-selcol]:hover { background: var(--accent); color: #fff; }
#tblSelAll { cursor: pointer; }
.lead-tbl thead th:first-child { text-align: center; }

/* Импорт объектов: вкладки источников */
.imp-tabs { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.imp-tab { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 10px; border: 1.5px solid var(--stroke); background: var(--card); font-size: 12.5px; font-weight: 650; color: var(--ink-2); cursor: pointer; }
.imp-tab svg { width: 14px; height: 14px; }
.imp-tab.on { border-color: var(--accent); background: var(--blue-100); color: var(--accent); }
[data-imppane] textarea { width: 100%; }

/* ---------- Карточка объекта v2 — лёгкая, воздушная ---------- */
.prop-card.v2 { padding: 0; overflow: hidden; cursor: pointer; position: relative; border-radius: 13px; transition: box-shadow .22s var(--ease-spring, ease), transform .22s var(--ease-spring, ease); }
.prop-card.v2:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
/* обложка унифицирована: единый ратио 4:3, cover-заполнение и общий скрим — разные фото читаются цельно */
.prop-card.v2 .prop-cover { height: auto; aspect-ratio: 4 / 3; background-size: cover; background-position: center; }
.prop-card.v2 .prop-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(158deg, rgba(16,43,92,.08) 0%, transparent 32%), linear-gradient(180deg, transparent 52%, rgba(6,17,38,.28)); }
.pc2-market { position: absolute; top: 9px; right: 9px; z-index: 2; font-size: 9.5px; font-weight: 700; letter-spacing: .03em; padding: 3px 9px; border-radius: 999px; color: #fff; backdrop-filter: blur(6px); }
.pc2-market.off { background: color-mix(in srgb, var(--accent) 82%, transparent); }
.pc2-market.sec { background: rgba(18, 133, 95, .82); }
.pc2-body { padding: 10px 12px 12px; }
.pc2-name { font-size: 13px; font-weight: 700; color: var(--navy-900); line-height: 1.28; letter-spacing: -.2px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.pc2-loc { font-size: 10.5px; color: var(--ink-3); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pc2-price-row { display: flex; align-items: baseline; gap: 7px; margin-top: 8px; }
.pc2-price { font-size: 15.5px; font-weight: 800; color: var(--navy-900); letter-spacing: -.4px; font-variant-numeric: tabular-nums; }
.pc2-roi { font-size: 10px; font-weight: 700; color: #148A4E; background: #E4F7EC; padding: 2px 7px; border-radius: 999px; }
.pc2-meta { font-size: 10.5px; color: var(--ink-3); margin-top: 7px; padding-top: 7px; border-top: 1px solid var(--stroke-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html[data-night] .pc2-name, html[data-night] .pc2-price { color: var(--ink); }
html[data-night] .pc2-roi { background: #0E2A21; color: #6FDDB0; }

/* ---------- ИИ-герои квалификатора (RPG-карточки) ---------- */
.hero-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 10px; }
@media (max-width: 1100px) { .hero-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .hero-grid { grid-template-columns: 1fr; } }
.hero-card { position: relative; border: 1px solid var(--stroke); border-radius: 16px; padding: 16px 14px 14px; background: linear-gradient(180deg, var(--card), var(--bg)); cursor: pointer; text-align: center; transition: transform .35s var(--ease-spring), border-color .25s, box-shadow .3s; overflow: hidden; }
.hero-card:hover { transform: translateY(-4px); border-color: var(--stroke2, var(--accent-soft-bd)); box-shadow: 0 16px 40px -18px rgba(16, 43, 92, .35); }
.hero-card.on { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), 0 18px 44px -18px color-mix(in srgb, var(--accent) 55%, transparent); }
.hero-card.picking { animation: heroPick .6s var(--ease-spring); }
@keyframes heroPick { 0% { transform: scale(1); } 40% { transform: scale(1.06); box-shadow: 0 0 0 6px color-mix(in srgb, var(--accent) 25%, transparent); } 100% { transform: scale(1); } }
.hero-lvl { position: absolute; top: 10px; right: 10px; font-size: 10px; font-weight: 800; letter-spacing: .04em; color: var(--accent); background: var(--blue-100); border: 1px solid var(--accent-soft-bd); border-radius: 8px; padding: 2px 7px; z-index: 2; }
html[data-night] .hero-lvl { border-color: #2A3C6B; }
.hero-ava { width: 72px; height: 72px; margin: 2px auto 10px; border-radius: 50%; position: relative; }
.hero-ava img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.hero-ring { position: absolute; inset: -4px; border-radius: 50%; border: 2px solid transparent; transition: border-color .3s; }
.hero-card.on .hero-ring { border-color: var(--accent); animation: heroRing 2.4s ease-in-out infinite; }
@keyframes heroRing { 50% { box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 12%, transparent); } }
.hero-nm { font-family: var(--font-display, inherit); font-size: 16px; font-weight: 800; color: var(--navy-900); }
.hero-role { font-size: 11.5px; color: var(--accent); font-weight: 650; margin-top: 1px; }
.hero-stats { margin: 12px 0 10px; display: flex; flex-direction: column; gap: 6px; }
.hstat { display: flex; align-items: center; gap: 8px; font-size: 10px; color: var(--ink-3); }
.hstat span { flex: 0 0 66px; text-align: left; }
.hstat i { flex: 1; height: 4px; border-radius: 2px; background: var(--bg-2); overflow: hidden; }
.hstat b { display: block; height: 100%; border-radius: 2px; background: linear-gradient(90deg, #93B4FF, var(--accent)); transform-origin: left; animation: statFill .8s var(--ease-spring); }
@keyframes statFill { from { transform: scaleX(0); } }
.hero-xpcap { font-size: 9.5px; font-weight: 650; color: var(--ink-3); letter-spacing: .02em; margin-bottom: 4px; text-align: left; }
.hero-xp { height: 5px; border-radius: 3px; background: var(--bg-2); overflow: hidden; margin-bottom: 8px; }
.hero-ab { display: flex; align-items: center; gap: 7px; font-size: 10.5px; color: var(--ink-3); margin-bottom: 10px; }
.hero-ab b { margin-left: auto; font-size: 12.5px; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.hero-ab b.hi { color: var(--ok); }
.pmx-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; }
.pmx-geo { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--navy-900); min-width: 130px; }
.pmx-geo svg { width: 14px; height: 14px; color: var(--accent); }
.pmx-row select { flex: 1; }
.pmx-arrow { color: var(--accent); font-weight: 700; opacity: .7; }
.capi-guide { display: flex; flex-direction: column; gap: 11px; padding: 4px 2px 6px; }
.cg-step { display: flex; gap: 11px; font-size: 12.5px; line-height: 1.55; color: var(--navy-900); }
.cg-step .cg-n { flex: 0 0 22px; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-2, #5B2BD8)); margin-top: 1px; }
.cg-step code.pill { font-size: 11px; }
.cg-loop { margin-top: 3px; padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--accent) 7%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 16%, transparent); font-size: 12.3px; line-height: 1.55; color: var(--navy-900); }
.hero-xp i { display: block; height: 100%; width: 0; border-radius: 3px; background: linear-gradient(90deg, var(--accent-2), #23B383); animation: statFill 1s var(--ease-spring); }
.hero-pick { font-size: 12px; font-weight: 700; color: var(--ink-2); border: 1px solid var(--stroke); border-radius: 9px; padding: 7px 0; transition: all .2s; display: flex; align-items: center; justify-content: center; gap: 5px; }
.hero-pick svg { width: 13px; height: 13px; }
.hero-card:hover .hero-pick { border-color: var(--accent); color: var(--accent); }
.hero-card.on .hero-pick { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ---------- Карточка подборки v2 — превью + воздух ---------- */
.cl2-card { padding: 0; overflow: hidden; border-radius: 15px; transition: box-shadow .22s var(--ease-spring, ease), transform .22s var(--ease-spring, ease); }
.cl2-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.cl2-preview { display: flex; gap: 2px; height: 108px; position: relative; background: var(--bg-2); }
.cl2-thumb { flex: 1; background-size: cover; background-position: center; min-width: 0; }
.cl2-thumb.grad { display: grid; place-items: center; }
.cl2-thumb.grad img { width: 26px; height: 31px; opacity: .55; }
.cl2-thumb.more { flex: 0 0 46px; display: grid; place-items: center; background: rgba(6,17,38,.72); color: #fff; font-weight: 800; font-size: 13px; }
.cl2-views { position: absolute; top: 10px; right: 10px; display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; color: #fff; background: rgba(6,17,38,.82); backdrop-filter: blur(6px); padding: 3px 9px; border-radius: 999px; }
.cl2-views svg { width: 12px; height: 12px; }
.cl2-body { padding: 14px 16px 15px; }
.cl2-name { font-size: 14.5px; font-weight: 750; color: var(--navy-900); display: inline-flex; align-items: center; gap: 6px; cursor: text; }
.cl2-meta { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }
.cl2-analytics { display: flex; align-items: center; gap: 9px; margin-top: 11px; font-size: 11px; color: var(--ink-3); }
.cl2-bar { flex: 0 0 70px; height: 5px; border-radius: 999px; background: var(--bg-2); overflow: hidden; }
.cl2-bar i { display: block; height: 100%; border-radius: 999px; background: var(--accent); }
.cl2-analytics.hot .cl2-bar i { background: #E4813D; }
.cl2-analytics.hot { color: #C05B18; font-weight: 600; }
.cl2-acts { display: flex; gap: 6px; align-items: center; margin-top: 13px; }
html[data-night] .cl2-name { color: var(--ink); }

/* ---------- Карточка брокера v2 ---------- */
.br2-card { padding: 16px 17px; cursor: pointer; border-radius: 15px; transition: box-shadow .22s var(--ease-spring, ease), transform .22s var(--ease-spring, ease); }
.br2-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.br2-card.off { opacity: .55; }
.br2-top { display: flex; align-items: center; gap: 12px; }
.br2-ava { width: 46px; height: 46px; flex: 0 0 46px; font-size: 15px; }
.br2-id { flex: 1; min-width: 0; }
.br2-name { font-size: 15px; font-weight: 750; color: var(--navy-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.br2-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.br2-shift { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--bg-2); color: var(--ink-3); white-space: nowrap; }
.br2-shift i { width: 6px; height: 6px; border-radius: 50%; background: var(--ink-3); }
.br2-shift.on { background: var(--ok-bg); color: var(--ok); }
.br2-shift.on i { background: var(--ok); box-shadow: 0 0 6px var(--ok); }
.br2-load { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.br2-load .br2-bar { flex: 1; height: 7px; border-radius: 999px; background: var(--bg-2); overflow: hidden; }
.br2-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--accent), var(--blue-300)); transition: width .4s var(--ease-spring, ease); }
.br2-bar.full i { background: linear-gradient(90deg, #E4813D, #E0B252); }
.br2-load b { font-size: 12.5px; font-weight: 800; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.br2-stats { display: flex; align-items: center; gap: 12px; margin-top: 11px; font-size: 11px; color: var(--ink-3); }
.br2-stats b { color: var(--navy-900); font-weight: 750; }
.br2-stats .hot b { color: #C05B18; }
.br2-sch { font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 160px; }
html[data-night] .br2-name, html[data-night] .br2-load b, html[data-night] .br2-stats b { color: var(--ink); }

/* ---------- Выделение объектов/подборок ---------- */
.lc-check.on-cover { top: 10px; left: 10px; background: rgba(255,255,255,.92); border-color: rgba(255,255,255,.6); box-shadow: 0 2px 10px rgba(0,0,0,.28); z-index: 4; }
.prop-card.v2.sel, .cl2-card.sel { box-shadow: inset 0 0 0 2px var(--accent), 0 0 0 3px color-mix(in srgb, var(--accent) 14%, transparent); }
.prop-card.v2.sel .lc-check.on-cover, .cl2-card.sel .lc-check.on-cover { background: var(--accent); border-color: var(--accent); }
.prop-card.v2.sel .lc-check svg, .cl2-card.sel .lc-check svg { opacity: 1; }

/* ---------- Анимированный поп-ап итога массового действия ---------- */
.celebrate { position: fixed; inset: 0; z-index: 1100; display: grid; place-items: center; pointer-events: none; opacity: 0; transition: opacity .3s ease; }
.celebrate.show { opacity: 1; }
.cel-card { position: relative; background: rgba(11,13,20,.9); backdrop-filter: blur(12px); border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent); border-radius: 20px; padding: 30px 42px 26px; display: grid; place-items: center; gap: 14px; transform: scale(.82) translateY(8px); transition: transform .38s var(--ease-spring, ease); box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.celebrate.show .cel-card { transform: scale(1) translateY(0); }
.cel-orb { width: 56px; height: 56px; border-radius: 50%; position: relative; background: radial-gradient(circle at 35% 30%, var(--blue-300), var(--accent) 70%); box-shadow: 0 0 30px color-mix(in srgb, var(--accent) 70%, transparent), inset 0 0 12px rgba(255,255,255,.4); animation: celOrb .8s var(--ease-spring, ease); }
.cel-orb::after { content: '✓'; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 27px; font-weight: 800; }
.celebrate.delete .cel-orb { background: radial-gradient(circle at 35% 30%, #FF8A8A, #E05252 70%); box-shadow: 0 0 30px rgba(224,82,82,.7), inset 0 0 12px rgba(255,255,255,.4); }
.celebrate.delete .cel-orb::after { content: '🗑'; font-size: 22px; }
.celebrate.archive .cel-orb { background: radial-gradient(circle at 35% 30%, #E4B36B, #C8912F 70%); box-shadow: 0 0 30px rgba(200,145,47,.6), inset 0 0 12px rgba(255,255,255,.4); }
.celebrate.archive .cel-orb::after { content: '📦'; font-size: 22px; }
@keyframes celOrb { 0% { transform: scale(0) rotate(-90deg); } 60% { transform: scale(1.18) rotate(8deg); } 100% { transform: scale(1) rotate(0); } }
.cel-p { position: absolute; top: 42px; left: 50%; width: 6px; height: 6px; border-radius: 50%; background: var(--blue-300); opacity: 0; animation: celBurst .7s ease-out forwards; animation-delay: var(--d); }
.celebrate.delete .cel-p { background: #FF9E9E; }
.celebrate.archive .cel-p { background: #EAC48A; }
@keyframes celBurst { 0% { opacity: 0; transform: rotate(var(--a)) translateY(0) scale(1); } 20% { opacity: 1; } 100% { opacity: 0; transform: rotate(var(--a)) translateY(-56px) scale(.3); } }
.cel-txt { color: #fff; font-weight: 800; font-size: 15px; letter-spacing: .01em; }
@media (prefers-reduced-motion: reduce) { .cel-orb, .cel-p, .cel-card { animation: none; transition: none; } }

/* ============================================================
   Микро-анимации интерфейса (спокойный люкс, без мельтешения)
   ============================================================ */
/* 1. Полоса загрузки при переходах между разделами */
#navprog { position: fixed; top: 0; left: 0; height: 2.5px; width: 0; z-index: 1200; background: linear-gradient(90deg, var(--accent), var(--blue-300)); box-shadow: 0 0 8px color-mix(in srgb, var(--accent) 50%, transparent); opacity: 0; pointer-events: none; }
#navprog.run { width: 82%; opacity: 1; transition: width 1.6s cubic-bezier(.1,.7,.3,1); }
#navprog.done { width: 100%; opacity: 0; transition: width .2s ease, opacity .35s ease .15s; }

/* 2. Ripple убран (Material-волна «раскрывала» кнопки при клике — не в стиле продукта) */
.btn > *, .nav-item > *, .seg-btn > * { position: relative; z-index: 1; }

/* панель «Поделиться» подборкой */
.share-wrap { display: grid; grid-template-columns: 240px 1fr; gap: 22px; align-items: start; }
@media (max-width: 620px) { .share-wrap { grid-template-columns: 1fr; } }
.share-qr { text-align: center; }
.share-qr img { width: 100%; max-width: 240px; border-radius: 14px; border: 1px solid var(--stroke); background: #fff; padding: 8px; box-shadow: var(--shadow); }
.share-qr span { display: block; font-size: 11.5px; color: var(--ink-3); margin-top: 10px; line-height: 1.4; }
.share-opts { display: flex; flex-direction: column; gap: 9px; }
.share-linkrow { display: flex; gap: 8px; margin-bottom: 6px; }
.share-linkrow input { flex: 1; font-size: 12.5px; color: var(--ink-2); background: var(--bg-2); }
.share-b { justify-content: flex-start; width: 100%; }

/* соц-помощник: карусели */
.car-filter { margin: 2px 0 14px; }
.car-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; align-items: start; }
.car-card { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.car-prev { aspect-ratio: 1/1; display: grid; place-items: center; padding: 22px; background: linear-gradient(160deg, var(--accent-2, var(--accent)), var(--ov-hero-b)); color: #fff; text-align: center; }
.car-prev.portrait { aspect-ratio: 4/5; }
.car-prev.story { aspect-ratio: 9/16; }
.car-h { font-family: var(--font-display); font-optical-sizing: auto; font-weight: 600; font-size: 19px; line-height: 1.15; letter-spacing: -.01em; }
.car-body { padding: 13px 15px; }
.car-body .nm { font-size: 14px; font-weight: 650; color: var(--navy-900); }
.car-acts { display: flex; gap: 6px; margin-top: 12px; align-items: center; }
.car-prev.th-royal { background: linear-gradient(160deg, var(--accent-3), var(--navy-950)); }
.car-prev.th-emerald { background: linear-gradient(160deg, #0E7A5F, #07211A); }
.car-prev.th-champagne { background: linear-gradient(160deg, #A8791F, #241F14); }
.car-prev.th-noir { background: linear-gradient(160deg, #2A2A38, #0B0B12); }
.car-prev.th-mocha { background: linear-gradient(160deg, #7A5C43, #2A2018); }
.car-prev.th-sage { background: linear-gradient(160deg, #5C6E5A, #1E2620); }
.car-prev.th-bordeaux { background: linear-gradient(160deg, #7C2D3A, #241318); }
.car-prev.th-slate { background: linear-gradient(160deg, #3E4A5B, #141922); }
.car-prev.th-terracotta { background: linear-gradient(160deg, #B0532E, #2A1810); }
.car-prev.th-midnight { background: linear-gradient(160deg, #C7B08A, #111524); color: #12121a; }

/* эмулятор прогрева номеров */
.warmup-warn { display: flex; gap: 10px; font-size: 12px; line-height: 1.55; color: var(--ink-2); background: var(--warn-bg); border: 1px solid #F0DCA8; border-radius: 12px; padding: 12px 14px; }
.warmup-warn svg { width: 18px; height: 18px; color: var(--warn); flex: 0 0 18px; margin-top: 1px; }
.wu-danger { display: flex; gap: 10px; font-size: 12.5px; line-height: 1.55; color: var(--navy-900); background: color-mix(in srgb, var(--bad) 8%, transparent); border: 1px solid color-mix(in srgb, var(--bad) 30%, transparent); border-radius: 12px; padding: 12px 14px; margin: 12px 0; }
.wu-danger svg { width: 18px; height: 18px; color: var(--bad); flex: 0 0 18px; margin-top: 1px; }
.warmup-live { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 600; color: var(--navy-900); background: var(--ok-bg); border: 1px solid #BDE7D4; border-radius: 11px; padding: 10px 14px; }
.warmup-live svg { width: 16px; height: 16px; color: var(--ok); }
.warmup-log { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; max-height: 230px; overflow-y: auto; }
.wu-msg { display: flex; align-items: center; gap: 8px; font-size: 12.5px; background: var(--bg-2); border: 1px solid var(--stroke-soft); border-radius: 9px; padding: 7px 11px; }
.wu-msg b { color: var(--navy-900); font-weight: 600; font-variant-numeric: tabular-nums; }
.wu-msg span { flex: 1; color: var(--ink-2); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wu-msg i { font-style: normal; font-size: 10.5px; color: var(--ink-3); }
.wu-consent { display: flex; gap: 11px; align-items: flex-start; margin-top: 16px; font-size: 12.5px; line-height: 1.55; color: var(--ink-2); cursor: pointer; background: var(--bad-bg); border: 1px solid #F1C9C4; border-radius: 12px; padding: 13px 15px; }
.wu-consent input { margin-top: 2px; flex: 0 0 auto; width: 18px; height: 18px; }

/* профиль агентства — соц-страница (organizer) */
.ag-profile { border-radius: 18px; overflow: hidden; margin-bottom: 18px; box-shadow: var(--shadow); background: var(--card); border: 1px solid var(--stroke); }
.ag-cover { position: relative; height: 156px; background: linear-gradient(120deg, var(--ov-hero-b), var(--ov-hero-c)); overflow: hidden; }
.ag-cover-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .6; }
.ag-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6, 17, 38, .1), rgba(6, 17, 38, .55)); }
.ag-ident { display: flex; align-items: flex-start; gap: 18px; padding: 0 24px 20px; position: relative; }
.ag-ava { width: 92px; height: 92px; border-radius: 22px; flex: 0 0 92px; margin-top: -50px; background: var(--card); border: 3px solid var(--card); box-shadow: 0 12px 30px -8px rgba(6, 17, 38, .45); display: grid; place-items: center; overflow: hidden; z-index: 1; }
.ag-ava img { width: 100%; height: 100%; object-fit: contain; padding: 12px; }
.ag-ava .lumen-mark { width: 100%; height: 100%; padding: 24px; opacity: .92; }
.cl2-thumb .lumen-mark { width: 44px; height: 44px; opacity: .72; }
.ag-id-main { flex: 1; min-width: 0; padding-top: 12px; }
.ag-stats { padding-top: 12px; }
.ag-name-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ag-h { font-family: var(--font-display); font-optical-sizing: auto; font-weight: 600; font-size: 26px; letter-spacing: -.02em; color: var(--navy-900); }
.ag-edition { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--accent); background: var(--blue-100); border: 1px solid var(--accent-soft-bd); border-radius: 20px; padding: 3px 11px; }
.ag-edition svg { width: 13px; height: 13px; }
.chip-t svg { width: 14px; height: 14px; vertical-align: -2px; margin-right: 5px; }
.ag-tag { font-size: 13.5px; color: var(--ink-3); margin-top: 4px; }
.ag-dirs { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 10px; }
.ag-dir { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 20px; padding: 4px 11px; }
.ag-dir svg { width: 13px; height: 13px; color: var(--accent); }
.ag-badges { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 9px; }
.ag-badge { display: inline-flex; align-items: center; font-size: 11.5px; font-weight: 700; letter-spacing: .01em; color: #fff; background: linear-gradient(120deg, var(--accent), var(--accent-2, #5B2BD8)); border-radius: 20px; padding: 4px 12px; box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--accent) 50%, transparent); }
.ag-badge-edit { display: flex; gap: 7px; flex-wrap: wrap; }
.ag-badge-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--navy-900); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 20px; padding: 4px 6px 4px 11px; }
.ag-badge-chip button { border: none; background: none; cursor: pointer; display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: var(--ink-3); }
.ag-badge-chip button:hover { background: var(--bad-bg); color: var(--bad); }
.ag-badge-chip button svg { width: 11px; height: 11px; }
.ag-geo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.ag-geo { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); background: var(--card, #fff); border: 1.5px solid var(--stroke); border-radius: 11px; padding: 9px 12px; cursor: pointer; transition: border-color .12s, background .12s, color .12s; text-align: left; }
.ag-geo svg { width: 14px; height: 14px; color: var(--ink-3); }
.ag-geo:hover { border-color: var(--accent); }
.ag-geo.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 9%, transparent); color: var(--navy-900); box-shadow: inset 0 0 0 1px var(--accent); }
.ag-geo.on svg { color: var(--accent); }
.ag-stats { display: flex; gap: 10px; padding-bottom: 4px; }
.ag-stat { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 80px; padding: 10px 12px; background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 14px; cursor: pointer; transition: border-color .15s, background .15s, box-shadow .2s; }
.ag-stat:hover { border-color: var(--hover-bd); background: var(--card); box-shadow: var(--shadow); }
.ag-stat b { font-size: 20px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; }
.ag-stat b svg { width: 18px; height: 18px; color: var(--accent); }
.ag-stat span { font-size: 11px; color: var(--ink-3); }
@media (max-width: 760px) { .ag-ident { flex-wrap: wrap; } .ag-stats { width: 100%; } .ag-ava { width: 78px; height: 78px; flex-basis: 78px; } }

/* обзор: кликабельные KPI + быстрые переходы */
.ov-click { cursor: pointer; transition: transform .15s var(--ease-spring), box-shadow .2s, border-color .15s; }
.ov-click:hover { border-color: var(--hover-bd); box-shadow: var(--shadow-lift); }
.ov-jump { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 16px; }
@media (max-width: 1100px) { .ov-jump { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 620px) { .ov-jump { grid-template-columns: repeat(2, 1fr); } }
.ov-jcard { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 13px 14px; background: var(--card); border: 1px solid var(--stroke); border-radius: var(--r-md); box-shadow: var(--shadow); cursor: pointer; text-align: left; transition: transform .15s var(--ease-spring), box-shadow .2s, border-color .15s; }
.ov-jcard:hover { border-color: var(--hover-bd); box-shadow: var(--shadow-lift); }
.ov-jic { display: inline-flex; color: var(--accent); }
.ov-jic svg { width: 17px; height: 17px; }
.ov-jv { font-family: var(--font); font-size: 22px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; letter-spacing: -.02em; margin-top: 4px; }
.ov-jk { font-size: 11.5px; color: var(--ink-3); }
.ov-jcard.hot .ov-jic { color: var(--bad); }
.ov-jcard.hot .ov-jv { color: var(--bad); }

/* реклама: KPI-плитки в стиле клиентского дашборда */
.ad-kpis { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; margin-bottom: 16px; }
@media (max-width: 1200px) { .ad-kpis { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 640px) { .ad-kpis { grid-template-columns: repeat(2, 1fr); } }
.ad-tile { background: var(--card); border: 1px solid var(--stroke); border-radius: var(--r-md); padding: 13px 15px; box-shadow: var(--shadow); }
.ad-tile.accent { background: linear-gradient(160deg, var(--navy-700), var(--navy-900)); border-color: var(--navy-700); }
.ad-tile.accent .at-lbl, .ad-tile.accent .at-sub { color: var(--blue-300); }
.ad-tile.accent .at-val { color: #fff; }
.at-lbl { font-size: 11px; font-weight: 600; color: var(--ink-3); text-transform: uppercase; letter-spacing: .04em; }
.at-val { font-size: 24px; font-weight: 700; color: var(--navy-900); margin-top: 6px; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.at-sub { font-size: 11px; color: var(--ink-3); margin-top: 3px; }
.ad-tbl td { vertical-align: top; }
.ad-tbl input.ad-spend { padding: 5px 7px; font-size: 12.5px; }
.ad-funnel { display: flex; gap: 2px; height: 5px; border-radius: 3px; overflow: hidden; margin-top: 6px; max-width: 220px; }
.ad-funnel span { display: block; min-width: 2px; }
.ad-geo { margin-top: 12px; border-top: 1px solid var(--stroke-soft); padding-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.ad-geo-row { display: flex; justify-content: space-between; font-size: 12.5px; }
.ad-geo-nm { font-weight: 600; color: var(--navy-900); }
html[data-night] .ad-tile { background: var(--card); border-color: var(--stroke); }

/* первое касание в карточке лида */
.lc-ft { display: flex; flex-direction: column; gap: 9px; }
.lc-ft > * { width: 100%; margin: 0; }
.lc-ft textarea { display: block; width: 100%; box-sizing: border-box; }
.lc-ft #lcCreoBtn { width: auto; align-self: flex-start; }
.lc-ft .lc-note-row { display: flex; gap: 8px; }
.lc-ft .lc-note-row .btn { flex: 1; justify-content: center; }
.lc-creo { border: 1px dashed var(--stroke); border-radius: 10px; min-height: 56px; display: flex; align-items: center; justify-content: center; color: var(--ink-3); font-size: 12px; background: var(--bg-2); overflow: hidden; text-align: center; padding: 8px; }
.lc-creo.has { border-style: solid; padding: 0; }
.lc-creo img { width: 100%; max-height: 180px; object-fit: cover; display: block; }
.lc-ft-an { margin-top: 8px; font-size: 12px; line-height: 1.5; color: var(--ink-2); background: var(--violet-bg); border-radius: 9px; padding: 8px 10px; display: flex; gap: 7px; align-items: flex-start; }
.lc-ft-an svg { width: 14px; height: 14px; color: var(--violet); flex: 0 0 14px; margin-top: 2px; }

/* Психо-профиль лида */
.lc-psy { display: flex; flex-direction: column; gap: 9px; padding-top: 4px; }
.psy-head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.psy-head b { font-size: 15px; font-weight: 700; color: var(--navy-900); }
.psy-conf { font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; letter-spacing: .02em; }
.psy-conf.hi { background: rgba(16, 158, 106, .13); color: #0E9E6A; }
.psy-conf.mid { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.psy-conf.lo { background: rgba(160, 120, 30, .14); color: #A8791F; }
.psy-sum { font-size: 12.5px; line-height: 1.55; color: var(--ink-2); background: var(--violet-bg); border-radius: 9px; padding: 9px 11px; }
.psy-axes { display: flex; flex-direction: column; gap: 6px; margin: 2px 0; }
.psy-ax { display: flex; align-items: center; gap: 9px; font-size: 11.5px; color: var(--ink-2); font-weight: 600; }
.psy-ax > span { flex: 0 0 118px; }
.psy-bar { flex: 1; height: 7px; border-radius: 999px; background: #E8EDF6; overflow: hidden; }
.psy-bar i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--accent), var(--accent-2, #5B2BD8)); }
.psy-sec { font-size: 10.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--ink-3); margin: 7px 0 1px; }
.psy-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.psy-list li { font-size: 12.5px; line-height: 1.5; color: var(--navy-900); padding-left: 20px; position: relative; }
.psy-list li.psy-good::before { content: '↗'; position: absolute; left: 2px; color: #0E9E6A; font-weight: 700; }
.psy-list li.psy-bad::before { content: '✕'; position: absolute; left: 3px; color: #E0483D; font-weight: 700; font-size: 11px; }
.psy-obj { font-size: 12.3px; line-height: 1.5; margin-bottom: 6px; }
.psy-obj b { display: block; color: var(--navy-900); }
.psy-obj span { color: var(--ink-2); }
.psy-rep { background: var(--surface-2, #F4F7FC); border: 1px solid var(--line, #E7ECF3); border-radius: 11px; padding: 10px 12px; margin-bottom: 7px; }
.psy-rep-t { font-size: 12.8px; line-height: 1.55; color: var(--navy-900); }
.psy-rep-a { display: flex; gap: 4px; margin-top: 7px; }
.psy-rep-a .btn-ghost { font-size: 11.5px; padding: 4px 8px; }
.psy-meta { font-size: 10.5px; color: var(--ink-3); }

/* 3. Мягкая пульсация горячих лидов — привлекает внимание к важному */
.lead-card.hot { position: relative; }
.lead-card.hot::before { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 0 rgba(224,129,61,.5); animation: hotPulse 2.6s ease-in-out infinite; pointer-events: none; }
@keyframes hotPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(224,129,61,.0); } 50% { box-shadow: 0 0 0 3px rgba(224,129,61,.28); } }

/* 4. Каскадное появление карточек/строк при входе в раздел */
.content.anim .kb-cards .lead-card, .content.anim .prop-card, .content.anim .cl2-card,
.content.anim .broker-grid > *, .content.anim .cmt-card { animation: cardIn .5s var(--ease-spring, ease) both; }
.content.anim .kb-cards .lead-card:nth-child(1) { animation-delay: .02s; }
.content.anim .kb-cards .lead-card:nth-child(2) { animation-delay: .06s; }
.content.anim .kb-cards .lead-card:nth-child(3) { animation-delay: .10s; }
.content.anim .kb-cards .lead-card:nth-child(4) { animation-delay: .14s; }
.content.anim .kb-cards .lead-card:nth-child(n+5) { animation-delay: .18s; }
.content.anim .prop-card:nth-child(3n+1) { animation-delay: .04s; }
.content.anim .prop-card:nth-child(3n+2) { animation-delay: .09s; }
.content.anim .prop-card:nth-child(3n) { animation-delay: .14s; }
@keyframes cardIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* 5. Живая лента: новые события въезжают каскадом */
.content.anim .feed-item { animation: feedIn .45s var(--ease-spring, ease) both; }
.content.anim .feed-item:nth-child(1) { animation-delay: .05s; }
.content.anim .feed-item:nth-child(2) { animation-delay: .1s; }
.content.anim .feed-item:nth-child(3) { animation-delay: .15s; }
.content.anim .feed-item:nth-child(n+4) { animation-delay: .2s; }
@keyframes feedIn { from { opacity: 0; transform: translateX(-8px); } to { opacity: 1; transform: none; } }

/* 6. Счётчики в меню — pop при изменении */
.nav-item [data-cnt].bump { animation: cntBump .4s var(--ease-spring, ease); }
@keyframes cntBump { 0% { transform: scale(1); } 40% { transform: scale(1.35); } 100% { transform: scale(1); } }

@media (prefers-reduced-motion: reduce) {
  #navprog, .ripple, .lead-card.hot::before,
  .content.anim .kb-cards .lead-card, .content.anim .prop-card, .content.anim .cl2-card,
  .content.anim .broker-grid > *, .content.anim .cmt-card, .content.anim .feed-item { animation: none !important; }
}

/* ---------------- Подписка и оплата ---------------- */
.bill-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 4px 0 10px; }
.bh-plan { font-size: 22px; font-weight: 700; color: var(--navy-900); letter-spacing: -.3px; }
.bh-status { font-size: 12.5px; font-weight: 600; margin-top: 4px; }
.bh-right { text-align: right; }
.bh-amt { font-size: 18px; font-weight: 700; color: var(--navy-900); }
.bill-method { margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--stroke-soft); font-size: 12.5px; color: var(--ink-2); display: flex; align-items: center; gap: 7px; }
.bill-method svg { width: 15px; height: 15px; opacity: .7; }

.bill-cycle { margin: 4px 0 14px; }
.seg-badge { font-size: 10px; font-weight: 700; color: var(--ok); }
.seg-btn.on .seg-badge { color: #1E9E6A; }

.bill-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.bill-plan { flex-direction: column; align-items: flex-start; text-align: left; padding: 13px 14px; border-radius: var(--r-md); gap: 3px; min-height: 92px; height: auto; white-space: normal; }
.bp-name { font-size: 13.5px; font-weight: 700; }
.bp-price { font-size: 15px; font-weight: 700; }
.bill-plan:not(.on) .bp-price { color: var(--navy-900); }
.bp-sub { font-size: 10.5px; line-height: 1.3; opacity: .8; }

.bill-seats { display: flex; align-items: center; gap: 12px; margin: 14px 0 4px; flex-wrap: wrap; }
.stepper { display: inline-flex; align-items: center; gap: 10px; background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 10px; padding: 3px 6px; }
.stepper span { min-width: 26px; text-align: center; font-weight: 700; font-size: 15px; color: var(--navy-900); }
.stepper .btn { min-width: 30px; height: 28px; justify-content: center; padding: 0; font-size: 17px; }

.bill-total { margin-top: 16px; padding: 14px 16px; border-radius: var(--r-md); background: var(--bg-2); border: 1px solid var(--stroke-soft); }
.bt-line { display: flex; justify-content: space-between; align-items: baseline; font-size: 13px; color: var(--ink-2); padding: 3px 0; }
.bt-line b { color: var(--navy-900); font-weight: 650; }
.bt-grand { border-top: 1px solid var(--stroke); margin-top: 6px; padding-top: 9px; font-size: 14px; }
.bt-grand b { font-size: 16px; }
.bt-year { color: var(--accent); font-weight: 600; }
.bt-year b { color: var(--accent); }
.bt-sum { font-size: 20px; font-weight: 700; color: var(--navy-900); }

.bill-actions { display: flex; align-items: center; gap: 12px; margin-top: 16px; flex-wrap: wrap; }

.bill-usage { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.bu-cell { padding: 13px; border-radius: var(--r-md); background: var(--bg-2); border: 1px solid var(--stroke-soft); text-align: center; }
.bu-total { background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 8%, transparent), color-mix(in srgb, var(--accent) 2%, transparent)); border-color: color-mix(in srgb, var(--accent) 25%, transparent); }
.bu-n { font-size: 20px; font-weight: 700; color: var(--navy-900); }
.bu-l { font-size: 10.5px; color: var(--ink-3); margin-top: 3px; }
.bu-c { font-size: 12px; font-weight: 650; color: var(--accent); margin-top: 5px; }

.bill-inv { display: flex; flex-direction: column; gap: 2px; }
.bi-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 14px; padding: 10px 2px; border-bottom: 1px solid var(--stroke-soft); }
.bi-row:last-child { border-bottom: 0; }
.bi-amt { font-weight: 700; color: var(--navy-900); font-size: 13.5px; }
.bi-st { font-size: 10.5px; font-weight: 650; padding: 3px 9px; border-radius: 999px; }
.bi-paid { background: rgba(18,133,95,.12); color: var(--ok); }
.bi-issued { background: rgba(154,103,0,.14); color: var(--warn); }
.bill-plan.on .bp-price, .bill-plan.on .bp-sub { color: #fff; }

/* биллинг — ночная тема: тёмный navy-текст → светлый ink */
html[data-night] .bh-plan,
html[data-night] .bh-amt,
html[data-night] .bp-name,
html[data-night] .bill-plan:not(.on) .bp-price,
html[data-night] .stepper span,
html[data-night] .bt-line b,
html[data-night] .bt-sum,
html[data-night] .bu-n,
html[data-night] .bi-amt { color: var(--ink); }
html[data-night] .bu-total { background: linear-gradient(180deg, rgba(143,180,255,.10), rgba(143,180,255,.02)); border-color: rgba(143,180,255,.28); }
html[data-night] .bill-plan.on .bp-price, html[data-night] .bill-plan.on .bp-sub, html[data-night] .bill-plan.on .bp-name { color: #fff; }

/* WhatsApp Cloud — панель статуса подключения */
.wa-st{display:flex;gap:8px;align-items:flex-start;padding:9px 12px;border-radius:12px;font-size:12.5px;line-height:1.45}
.wa-st svg{flex:0 0 15px;width:15px;height:15px;margin-top:1px;opacity:.9}
.wa-st b{color:inherit;font-weight:650}
.wa-st.ok{background:color-mix(in srgb,var(--ok) 13%,transparent);color:var(--ok);border:1px solid color-mix(in srgb,var(--ok) 32%,transparent)}
.wa-st.bad{background:color-mix(in srgb,var(--bad) 13%,transparent);color:var(--bad);border:1px solid color-mix(in srgb,var(--bad) 32%,transparent)}
.wa-st.neutral{background:rgba(148,163,184,.08);color:var(--ink-2);border:1px solid var(--line)}

/* Пункт «Настройки» прижат к низу бокового меню, отделён тонкой чертой */
.nav-config { margin-top: auto; }
.nav-config::before { content: ''; display: block; }
.nav .nav-config { position: relative; margin-top: auto; border-top: 1px solid var(--line); padding-top: 12px; margin-bottom: 2px; }

/* Сегментный переключатель под-разделов рабочего пространства (над страницей) */
.ws-tabs {
  display: flex; gap: 4px; padding: 5px; margin: 0 0 20px;
  background: var(--card); border: 1px solid var(--stroke);
  border-radius: 13px; width: max-content; max-width: 100%;
  overflow-x: auto; scrollbar-width: none; box-shadow: var(--shadow);
}
.ws-tabs::-webkit-scrollbar { display: none; }
.ws-tab {
  display: inline-flex; align-items: center; gap: 7px; white-space: nowrap;
  padding: 8px 16px; border-radius: 9px; font-size: 13px; font-weight: 600;
  color: var(--ink-3); background: transparent; border: 0; cursor: pointer;
  transition: color var(--dur-fast), background var(--dur-fast);
}
.ws-tab svg { width: 15px; height: 15px; stroke-width: 1.7; opacity: .8; }
.ws-tab:hover { color: var(--ink); background: var(--bg-2); }
.ws-tab.on { color: #fff; background: linear-gradient(180deg, var(--navy-700), var(--navy-900)); box-shadow: 0 6px 16px -6px rgba(16, 43, 92, .5); }
.ws-tab.on svg { opacity: 1; color: var(--blue-300); }
html[data-night] .ws-tabs { background: var(--card); border-color: var(--stroke); }
html[data-night] .ws-tab:hover { background: rgba(140, 165, 230, .1); }
@media (max-width: 760px) { .ws-tabs { width: 100%; } }

/* ═══════════════ СОЦСЕТИ: боковая панель инструментов + рабочая зона ═══════════════ */
.sh-head { margin-bottom: 14px; }
.sh-h-t { display: flex; align-items: baseline; gap: 10px; font-family: var(--font-display); font-size: 22px; font-weight: 600; color: var(--navy-900); }
.sh-h-t svg { width: 21px; height: 21px; color: var(--accent); align-self: center; }
.sh-h-t span { font-family: var(--font); font-size: 12px; font-weight: 400; color: var(--ink-3); }
.sh-wrap { display: grid; grid-template-columns: 216px 1fr; gap: 18px; align-items: start; }
.sh-rail { position: sticky; top: 14px; display: flex; flex-direction: column; gap: 4px; }
.sh-tab { position: relative; display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-radius: 11px; border: 1px solid transparent; text-align: left; color: var(--ink-2); background: transparent; width: 100%; transition: background var(--dur-fast) var(--ease-soft), border-color var(--dur-fast), transform var(--dur-fast); }
.sh-tab svg { width: 18px; height: 18px; flex: none; color: var(--ink-3); transition: color var(--dur-fast); }
.sh-tab-x { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.sh-tab-x b { font-size: 13px; font-weight: 600; }
.sh-tab-x i { font-size: 10.5px; font-style: normal; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-tab:hover { background: var(--bg-2); }
.sh-tab.on { background: var(--card); border-color: var(--stroke); box-shadow: var(--shadow); color: var(--navy-900); }
.sh-tab.on svg { color: var(--hue, var(--accent)); }
.sh-tab.on::before { content: ''; position: absolute; left: 0; top: 10px; bottom: 10px; width: 3px; border-radius: 3px; background: var(--hue, var(--accent)); }
.sh-main { min-width: 0; }

/* ── Схемы хантинга (плейбук лидогена) — графический, схематичный блок ── */
.hp-top { margin-bottom: 18px; }
.hp-top-k { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.hp-top-k svg { width: 14px; height: 14px; }
.hp-top-t { font-weight: 800; font-size: 25px; letter-spacing: -.02em; margin: 8px 0 6px; color: var(--navy-900); }
.hp-top-s { font-size: 13.5px; line-height: 1.55; color: var(--ink-2); max-width: 70ch; }

.hp-list { display: flex; flex-direction: column; gap: 14px; }
.hp-card { background: var(--card); border: 1px solid var(--stroke); border-radius: var(--r-lg, 18px); padding: 0; overflow: hidden; box-shadow: var(--shadow); transition: border-color .16s, box-shadow .16s; }
.hp-card:hover:not(.open) { border-color: color-mix(in srgb, var(--accent) 32%, var(--stroke)); box-shadow: var(--shadow-lift, var(--shadow)); }
.hp-card-hd { width: 100%; display: flex; align-items: center; gap: 16px; padding: 20px 24px; background: none; border: none; text-align: left; cursor: pointer; font-family: inherit; }
.hp-card-hd-l { flex: 1; min-width: 0; }
.hp-card-t { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.hp-card-t b { font-weight: 750; font-size: 18px; letter-spacing: -.015em; color: var(--navy-900); }
.hp-tag { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); padding: 3px 9px; border-radius: 99px; }
.hp-chan { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ink-3); flex: none; }
.hp-chan svg { width: 14px; height: 14px; }
.hp-chev { flex: none; color: var(--ink-3); display: grid; place-items: center; transition: transform .2s var(--ease-spring, ease); }
.hp-chev svg { width: 18px; height: 18px; transform: rotate(90deg); }
.hp-card.open .hp-chev svg { transform: rotate(-90deg); }
.hp-card-body { display: none; padding: 2px 24px 24px; }
.hp-card.open .hp-card-body { display: block; animation: gsIn .26s var(--ease-spring, ease); }
.hp-lead { font-size: 13.5px; line-height: 1.55; color: var(--ink-2); margin: 0; }
@media (max-width: 640px) { .hp-chan { display: none; } }
.hp-sec { margin-top: 22px; }
.hp-sec-h { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 12px; }
.hp-sec-h svg { width: 15px; height: 15px; color: var(--accent); }

/* Анатомия рилса: телефон-фрейм с хуком + разбор по секундам */
.hp-anat { display: grid; grid-template-columns: 190px 1fr; gap: 22px; align-items: center; margin-top: 20px; padding: 20px; border-radius: 16px; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 7%, var(--bg-2)), var(--bg-2)); border: 1px solid var(--stroke-soft); }
.hp-phone { position: relative; width: 190px; aspect-ratio: 9/17; border-radius: 26px; overflow: hidden; background: #0a0a12; box-shadow: 0 18px 40px -12px rgba(6,17,38,.5), inset 0 0 0 5px rgba(20,20,30,.9), inset 0 0 0 7px rgba(120,120,140,.3); flex: none; }
.hp-phone-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hp-phone-scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.32), transparent 30%, transparent 62%, rgba(0,0,0,.5)); }
.hp-phone-hook { position: absolute; left: 12px; right: 12px; top: 30px; text-align: center; }
.hp-phone-live { display: inline-block; font-size: 8.5px; font-weight: 800; letter-spacing: .08em; color: #fff; background: rgba(220,40,60,.9); padding: 2px 7px; border-radius: 99px; margin-bottom: 8px; }
.hp-phone-hook b { display: block; font-size: 16px; font-weight: 800; letter-spacing: .02em; color: #fff; text-shadow: 0 2px 10px rgba(0,0,0,.7); line-height: 1.1; text-transform: uppercase; }
.hp-phone-hook i { display: block; font-style: normal; font-size: 9.5px; color: rgba(255,255,255,.9); margin-top: 5px; text-shadow: 0 1px 6px rgba(0,0,0,.8); }
.hp-phone-ui { position: absolute; right: 10px; bottom: 44px; display: flex; flex-direction: column; gap: 12px; }
.hp-phone-ui span { width: 22px; height: 22px; border-radius: 50%; background: rgba(255,255,255,.22); backdrop-filter: blur(4px); }
.hp-anat-x { min-width: 0; }
.hp-anat-h { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 12px; }
.hp-anat-h svg { width: 15px; height: 15px; color: var(--accent); }
.hp-anat-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.hp-anat-steps li { display: grid; grid-template-columns: 82px 1fr; gap: 12px; align-items: baseline; }
.hp-anat-s { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: #fff; background: var(--accent); padding: 3px 8px; border-radius: 7px; text-align: center; }
.hp-anat-steps b { font-size: 13.5px; color: var(--navy-900); font-weight: 650; }
.hp-anat-steps i { display: block; font-style: normal; font-size: 12.5px; color: var(--ink-2); line-height: 1.45; margin-top: 1px; }

/* Почему работает: визуальное сравнение тёплые/холодные */
.hp-cmp { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: stretch; }
.hp-cmp-c { padding: 16px; border-radius: 14px; display: flex; flex-direction: column; gap: 6px; border: 1px solid var(--stroke-soft); }
.hp-cmp-c svg { width: 22px; height: 22px; }
.hp-cmp-c b { font-size: 13.5px; color: var(--navy-900); font-weight: 650; }
.hp-cmp-c span { font-size: 12.5px; color: var(--ink-2); line-height: 1.5; }
.hp-cmp-c em { font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; margin-top: auto; padding-top: 6px; }
.hp-cmp-c.warm { background: color-mix(in srgb, var(--ok) 9%, transparent); border-color: color-mix(in srgb, var(--ok) 24%, transparent); }
.hp-cmp-c.warm svg, .hp-cmp-c.warm em { color: var(--ok); }
.hp-cmp-c.cold { background: color-mix(in srgb, var(--ink-3) 8%, transparent); }
.hp-cmp-c.cold svg, .hp-cmp-c.cold em { color: var(--ink-3); }
.hp-cmp-vs { align-self: center; font-size: 12px; font-weight: 800; color: var(--ink-3); }
.hp-key { display: flex; gap: 9px; margin-top: 12px; padding: 12px 14px; background: color-mix(in srgb, var(--accent) 8%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent); border-radius: 12px; font-size: 13px; line-height: 1.5; color: var(--navy-900); font-weight: 500; }
.hp-key svg { width: 16px; height: 16px; color: var(--accent); flex: none; margin-top: 1px; }

/* Схема по шагам: горизонтальный флоу с иконками и стрелками */
.hp-flow { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; }
.hp-step { flex: 1 1 120px; min-width: 108px; padding: 13px 12px; border-radius: 12px; background: var(--bg-2); border: 1px solid var(--stroke-soft); text-align: center; }
.hp-step-ic { display: grid; place-items: center; width: 34px; height: 34px; margin: 0 auto 8px; border-radius: 10px; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.hp-step-ic svg { width: 17px; height: 17px; }
.hp-step b { display: block; font-size: 12.5px; color: var(--navy-900); font-weight: 650; }
.hp-step i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); margin-top: 2px; line-height: 1.35; }
.hp-arr { align-self: center; color: color-mix(in srgb, var(--accent) 60%, var(--ink-3)); font-weight: 700; }
@media (max-width: 720px) { .hp-arr { display: none; } .hp-step { flex-basis: calc(50% - 6px); } }

.hp-tip { display: flex; gap: 9px; margin-top: 16px; padding: 12px 14px; background: var(--bg-2); border: 1px solid var(--stroke-soft); border-radius: 12px; font-size: 13px; line-height: 1.5; color: var(--ink); }
.hp-tip svg { width: 16px; height: 16px; color: var(--accent); flex: none; margin-top: 1px; }

/* Хук-фразы с таймингом 0:00 */
.hp-hooks { display: flex; flex-direction: column; gap: 7px; }
.hp-hook { display: flex; align-items: center; gap: 11px; padding: 9px 11px 9px 11px; background: var(--bg-2); border: 1px solid var(--stroke-soft); border-radius: 10px; }
.hp-hook-t { font-size: 10.5px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); padding: 3px 8px; border-radius: 7px; flex: none; }
.hp-hook-x { flex: 1; font-size: 13px; color: var(--navy-900); font-weight: 500; }

/* Примеры-превью: телефон-фреймы с проигрыванием */
.hp-exs { display: flex; gap: 14px; flex-wrap: wrap; }
.hp-ex { width: 150px; margin: 0; text-decoration: none; }
.hp-ex-ph { position: relative; width: 150px; aspect-ratio: 9/16; border-radius: 16px; overflow: hidden; background: #0a0a12; box-shadow: 0 10px 26px -10px rgba(6,17,38,.4); display: grid; place-items: center; }
.hp-ex-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hp-ex-play { position: relative; z-index: 1; width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.9); display: grid; place-items: center; box-shadow: 0 6px 16px rgba(0,0,0,.35); }
.hp-ex-play svg { width: 18px; height: 18px; color: #111; margin-left: 2px; }
.hp-ex figcaption { margin-top: 9px; }
.hp-ex figcaption b { display: block; font-size: 12.5px; color: var(--navy-900); font-weight: 650; }
.hp-ex figcaption span { font-size: 11.5px; color: var(--ink-3); }
.hp-ex-ext { background: linear-gradient(150deg, var(--ov-hero-a), color-mix(in srgb, var(--accent) 30%, var(--ov-hero-b))); }
.hp-ex-ext svg { width: 30px; height: 30px; color: rgba(255,255,255,.92); }
.hp-ex-badge { position: absolute; top: 8px; right: 8px; font-size: 9px; font-weight: 800; letter-spacing: .05em; color: #fff; background: rgba(0,0,0,.4); backdrop-filter: blur(4px); padding: 2px 6px; border-radius: 6px; }
.hp-ex-link:hover .hp-ex-ph { outline: 2px solid var(--accent); outline-offset: 2px; }
.hp-ex-add { width: 150px; aspect-ratio: 9/16; border-radius: 16px; border: 1.5px dashed var(--stroke); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 14px; color: var(--ink-3); }
.hp-ex-add svg { width: 22px; height: 22px; }
.hp-ex-add span { font-size: 11.5px; line-height: 1.4; }
.sh-gen { margin-bottom: 16px; }
.sh-gen-hd { display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 650; color: var(--navy-900); margin-bottom: 14px; }
.sh-gen-hd > svg { width: 17px; height: 17px; color: var(--accent); flex: none; }   /* только иконка-заголовок; кнопки внутри (btn-cta) красились в акцент и сливались */
.sh-gen-hd .sub { font-weight: 400; font-size: 11.5px; color: var(--ink-3); margin-left: auto; text-align: right; max-width: 56%; }
.sh-hd-bar { margin-bottom: 14px; }
.sh-mode { margin-bottom: 12px; }
.sh-fmts { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 4px 0 12px; }
.sh-lbl { font-size: 11px; font-weight: 600; color: var(--ink-3); text-transform: uppercase; letter-spacing: .06em; }
.sh-fmts-note { font-size: 10.5px; }
.sh-gen-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sh-sel, .sh-launch-opts select { width: auto; min-width: 150px; }
/* хант-карточка: быстрый переход в сценарий (меньше «проваливаться внутрь») */
.sh-tmake { display: inline-flex; align-items: center; gap: 7px; margin-top: 14px; border: 1px solid var(--stroke); background: var(--bg-2); color: var(--navy-900); border-radius: 10px; padding: 9px 14px; font-size: 12.5px; font-weight: 650; font-family: inherit; cursor: pointer; transition: border-color .14s, background .14s, transform .14s; }
.sh-tmake svg { width: 15px; height: 15px; color: var(--accent); flex: none; }
.sh-tmake:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--bg-2)); transform: translateY(-1px); }
.sh-launch-opts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 4px 0 12px; }

/* аккордеон-набор сценариев */
.sh-set { padding: 0; margin-bottom: 12px; overflow: hidden; }
.sh-set-hd { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; cursor: pointer; transition: background var(--dur-fast); }
.sh-set-hd:hover { background: var(--bg-2); }
.sh-set-t { display: flex; align-items: center; gap: 9px; min-width: 0; font-size: 13.5px; font-weight: 600; color: var(--navy-900); }
.sh-set-t svg { width: 15px; height: 15px; color: var(--ink-3); transition: transform var(--dur-fast); flex: none; }
.sh-set.open .sh-set-t svg { transform: rotate(90deg); }
.sh-set-meta { display: flex; align-items: center; gap: 8px; flex: none; }
.sh-set-meta .muted { font-size: 11px; }
.sh-set-body { padding: 2px 16px 16px; display: flex; flex-direction: column; gap: 14px; }

/* карточка сценария */
.sh-card { border: 1px solid var(--stroke); border-radius: var(--r-md); padding: 15px; background: var(--bg-2); }
.sh-card-hd { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.sh-badge { display: inline-block; font-size: 11px; font-weight: 650; color: #fff; background: var(--navy-700); padding: 3px 9px; border-radius: 7px; }
.sh-dur { font-size: 11px; color: var(--ink-3); margin-left: 8px; }
.sh-goalfit { font-size: 12px; color: var(--ink-2); font-style: italic; margin-bottom: 4px; }
.sh-seclbl { font-size: 10.5px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin: 12px 0 7px; }
.sh-seclbl-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sh-hooks { display: flex; flex-direction: column; gap: 7px; }
.sh-hook { border: 1px solid var(--stroke); border-radius: 9px; padding: 9px 11px; background: var(--card); }
.sh-hook-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.sh-hook-tag { font-size: 10px; font-weight: 650; color: var(--accent); text-transform: uppercase; letter-spacing: .05em; }
.sh-hook-x { font-size: 13px; color: var(--ink); line-height: 1.4; }
.sh-note { font-size: 11.5px; color: var(--ink-3); margin-top: 7px; }
.sh-beats { display: flex; flex-direction: column; gap: 6px; }
.sh-beat { display: flex; gap: 10px; }
.sh-beat-t { font-size: 11px; font-weight: 600; color: var(--accent); flex: none; width: 54px; padding-top: 2px; font-variant-numeric: tabular-nums; }
.sh-beat-b { flex: 1; min-width: 0; border-left: 2px solid var(--stroke); padding-left: 10px; }
.sh-beat-role { font-size: 11px; font-weight: 600; color: var(--ink-3); }
.sh-beat-say { font-size: 13px; color: var(--ink); line-height: 1.4; }
.sh-beat-os { font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.sh-script { font-size: 13px; line-height: 1.6; color: var(--ink); white-space: pre-wrap; background: var(--card); border: 1px solid var(--stroke); border-radius: 9px; padding: 12px; }
.sh-cta-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.sh-code { font-size: 12px; color: var(--ink-2); }
.sh-code b { color: var(--accent); }
.sh-lm { font-size: 12px; color: var(--ink-3); }
.sh-cta { font-size: 13px; line-height: 1.45; color: var(--ink); background: color-mix(in srgb, var(--accent) 7%, transparent); border-left: 3px solid var(--accent); border-radius: 0 8px 8px 0; padding: 9px 12px; margin-top: 8px; }
.sh-caption { font-size: 12.5px; line-height: 1.5; color: var(--ink-2); white-space: pre-wrap; background: var(--card); border: 1px solid var(--stroke); border-radius: 9px; padding: 11px; }
.sh-broll { display: flex; flex-wrap: wrap; gap: 6px; }
.sh-broll-i { font-size: 11.5px; color: var(--ink-2); background: var(--card); border: 1px solid var(--stroke); border-radius: 20px; padding: 4px 10px; }
.sh-why { font-size: 12px; color: var(--ink-2); margin-top: 12px; }
.sh-why span { font-weight: 650; color: var(--ok); }
.sh-cp { color: var(--ink-3); }
.sh-cp svg { width: 13px; height: 13px; }
.sh-cp span { margin-left: 5px; }

/* Tinder-хантинг */
.sh-tinder { max-width: 460px; margin: 6px auto 0; }
.sh-tcard { position: relative; padding: 26px 24px 22px; border-radius: var(--r-lg); min-height: 226px; display: flex; flex-direction: column; gap: 12px; transition: transform .18s var(--ease-soft), opacity .18s; }
.sh-tcard.gone-l { transform: translateX(-120%) rotate(-8deg); opacity: 0; }
.sh-tcard.gone-r { transform: translateX(120%) rotate(8deg); opacity: 0; }
.sh-tcount { position: absolute; top: 14px; right: 16px; font-size: 11px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.sh-tangle { align-self: flex-start; font-size: 10.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .05em; color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); padding: 3px 9px; border-radius: 20px; }
.sh-ttitle { font-family: var(--font-display); font-size: 20px; font-weight: 600; line-height: 1.2; color: var(--navy-900); }
.sh-thook { font-size: 14px; font-style: italic; color: var(--ink-2); line-height: 1.45; }
.sh-twhy { font-size: 12.5px; color: var(--ink-3); line-height: 1.5; }
.sh-tmeta { display: flex; gap: 6px; flex-wrap: wrap; margin-top: auto; }
/* ── Хантинг: грид карточек с живым видео ── */
.sh-hgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; margin-top: 6px; }
.sh-hcard { display: flex; flex-direction: column; border-radius: var(--r-lg); overflow: hidden; padding: 0; }
.sh-hvid { position: relative; width: 100%; aspect-ratio: 9 / 12; background: #0b1220; display: grid; place-items: center; overflow: hidden; }
.sh-hvid-load, .sh-hvid-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 18px; color: rgba(255,255,255,.72); font-size: 12px; line-height: 1.4; }
.sh-hvid-load svg, .sh-hvid-empty svg { width: 26px; height: 26px; opacity: .8; }
.sh-hframe, .sh-hembed iframe, .sh-hembed video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sh-hembed { position: absolute; inset: 0; }
.sh-hthumbs { position: absolute; left: 0; right: 0; bottom: 0; display: flex; gap: 5px; padding: 7px; background: linear-gradient(180deg, transparent, rgba(6,12,24,.72)); overflow-x: auto; z-index: 2; }
.sh-hthumbs::-webkit-scrollbar { height: 0; }
.sh-hthumb { flex: 0 0 auto; width: 34px; height: 46px; border-radius: 6px; background-size: cover; background-position: center; border: 2px solid transparent; opacity: .6; transition: opacity var(--dur-fast), border-color var(--dur-fast); cursor: pointer; }
.sh-hthumb.on, .sh-hthumb:hover { opacity: 1; border-color: rgba(255,255,255,.9); }
.sh-embed-in.mini { display: flex; gap: 6px; margin-top: 8px; width: 100%; }
.sh-embed-in.mini input { flex: 1; min-width: 0; padding: 7px 10px; border-radius: 9px; border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.08); color: #fff; font-size: 12px; }
.sh-embed-in.mini input::placeholder { color: rgba(255,255,255,.5); }
.sh-hbody { display: flex; flex-direction: column; gap: 9px; padding: 16px 16px 15px; }
.sh-htitle { font-family: var(--font-display); font-size: 17px; font-weight: 600; line-height: 1.24; color: var(--navy-900); }
.sh-hlinks { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin-top: 2px; padding-top: 9px; border-top: 1px solid var(--stroke); }
.sh-hacts { display: flex; gap: 8px; margin-top: 4px; }
.sh-hacts .btn { flex: 1; justify-content: center; }
.sh-hlike.done { color: var(--accent); border-color: var(--accent); }
.sh-hmore { display: flex; justify-content: center; margin-top: 18px; }
@media (max-width: 560px) { .sh-hgrid { grid-template-columns: 1fr; } }
.sh-tbtns { display: flex; justify-content: center; gap: 26px; margin-top: 18px; }
.sh-tbtn { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--stroke); background: var(--card); box-shadow: var(--shadow); transition: transform var(--dur-fast) var(--ease-soft), box-shadow var(--dur-fast); }
.sh-tbtn:hover { transform: scale(1.09); box-shadow: 0 8px 22px -8px rgba(16, 43, 92, .3); }
.sh-tbtn:active { transform: scale(.96); }
.sh-tbtn svg { width: 24px; height: 24px; }
.sh-tbtn.skip { color: var(--bad); }
.sh-tbtn.like { color: #fff; background: linear-gradient(135deg, #F2637E, #E23E6B); border-color: transparent; font-size: 23px; }
.sh-deck-done { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.sh-deck-done svg { width: 26px; height: 26px; color: var(--ok); flex: none; }

/* копилка идей */
.sh-bank { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 12px; }
.sh-idea { padding: 14px; display: flex; flex-direction: column; gap: 10px; }
.sh-idea-x { font-size: 13px; line-height: 1.5; color: var(--ink); white-space: pre-wrap; }
.sh-idea-foot { display: flex; align-items: center; gap: 8px; }

/* посты / сторис / тред */
.sh-post { margin-bottom: 12px; }
.sh-post-body { font-size: 13.5px; line-height: 1.6; color: var(--ink); white-space: pre-wrap; }
.sh-frames { display: flex; flex-direction: column; gap: 8px; }
.sh-frame { display: flex; gap: 11px; align-items: flex-start; border: 1px solid var(--stroke); border-radius: 10px; padding: 11px 13px; background: var(--bg-2); }
.sh-frame-n { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 12px; font-weight: 650; display: grid; place-items: center; }
.sh-frame div { font-size: 13px; line-height: 1.5; color: var(--ink); white-space: pre-wrap; }
.sh-alt { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--ink-2); padding: 6px 0; border-bottom: 1px dashed var(--stroke); }
.sh-tags { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 12px; }
.sh-tag { font-size: 11.5px; color: var(--accent); }

@media (max-width: 900px) {
  .sh-wrap { grid-template-columns: 1fr; }
  .sh-rail { position: static; flex-direction: row; overflow-x: auto; gap: 6px; padding-bottom: 4px; }
  .sh-rail::-webkit-scrollbar { display: none; }
  .sh-tab { flex: none; }
  .sh-tab-x i { display: none; }
  .sh-launch-opts { grid-template-columns: 1fr 1fr; }
  .sh-gen-hd .sub { display: none; }
}

/* ═══ Подборки: конструктор как фиксированная боковая панель ═══ */
.cl-layout { display: grid; grid-template-columns: 340px 1fr; gap: 16px; align-items: start; }
.cl-layout > .cl-config { position: sticky; top: 14px; max-height: calc(100vh - 28px); overflow: auto; }
@media (max-width: 900px) { .cl-layout { grid-template-columns: 1fr; } .cl-layout > .cl-config { position: static; max-height: none; } }

/* ═══════════════ ТАСК-МЕНЕДЖЕР БРОКЕРА ═══════════════ */
.tk-top { display: grid; grid-template-columns: 1fr; gap: 12px; margin-bottom: 14px; }
.tk-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px; flex-wrap: wrap; }
.tk-hero-t { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 21px; font-weight: 600; color: var(--navy-900); }
.tk-hero-t svg { width: 20px; height: 20px; color: var(--accent); }
.tk-motive { font-size: 13px; color: var(--ink-2); margin-top: 5px; }
.tk-stats { display: flex; align-items: center; gap: 20px; }
.tk-stat { display: flex; align-items: center; gap: 9px; }
.tk-stat-ic svg { width: 22px; height: 22px; }
.tk-stat b { font-size: 20px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.tk-stat i { display: block; font-size: 10.5px; font-style: normal; color: var(--ink-3); }
.tk-ring { position: relative; display: flex; align-items: center; gap: 9px; }
.tk-ring-svg { width: 48px; height: 48px; }
.tk-ring-v { position: absolute; left: 0; width: 48px; text-align: center; font-size: 12px; font-weight: 700; color: var(--navy-900); }
.tk-ring i { font-size: 10.5px; font-style: normal; color: var(--ink-3); line-height: 1.3; }
.tk-cap { display: flex; flex-direction: column; align-items: stretch; gap: 9px; padding: 10px 12px; }
.tk-cap-row { display: flex; align-items: center; gap: 10px; }
.tk-cap-meta { flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--stroke); padding-top: 9px; }
.tk-cap-in { flex: 1; border: none; background: transparent; font-size: 14px; color: var(--ink); outline: none; padding: 4px 2px; }
.tk-cap-pri { display: flex; gap: 6px; }
/* ⭐ сферы жизни: чипы-теги (премиум-палитра 2026) */
.tk-sphere-pick { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; }
.tk-sphere-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px 5px 8px; border-radius: 999px; border: 1px solid var(--stroke); background: var(--card); font-size: 12px; font-weight: 600; color: var(--sub); cursor: pointer; transition: color .14s, background .14s, border-color .14s, box-shadow .14s; }
.tk-sphere-chip:hover { border-color: color-mix(in srgb, var(--sc) 50%, var(--stroke)); color: var(--ink); }
.tk-sphere-chip.on { color: #fff; background: var(--sc); border-color: var(--sc); box-shadow: 0 5px 16px -5px color-mix(in srgb, var(--sc) 65%, transparent); }
.tk-sphere-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--sc); flex: 0 0 auto; box-shadow: 0 0 0 3px color-mix(in srgb, var(--sc) 18%, transparent); }
.tk-sphere-chip.on .tk-sphere-dot { background: #fff; box-shadow: none; }
.tk-rep-btn, .tk-routine-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--stroke); background: var(--card); font-size: 12px; font-weight: 600; color: var(--sub); cursor: pointer; transition: color .14s, border-color .14s, background .14s; white-space: nowrap; }
.tk-rep-btn svg, .tk-routine-btn svg { width: 14px; height: 14px; }
.tk-rep-btn:hover, .tk-routine-btn:hover { border-color: var(--accent); color: var(--accent); }
.tk-rep-btn.on { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, var(--stroke)); background: color-mix(in srgb, var(--accent) 8%, var(--card)); }
.tk-routine-btn { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 32%, var(--stroke)); }
/* ⭐ колесо баланса недели */
/* ⭐ подложка колеса баланса: трендовый mesh-gradient aurora (чистый CSS, приглушённый кобальт/ink) */
.tk-balance { position: relative; padding: 17px 20px; margin-bottom: 14px; overflow: hidden; border: none; color: #fff; isolation: isolate; background: var(--ov-hero-a); }
.tk-balance::before { content: ''; position: absolute; inset: 0; z-index: -2;
  background:
    radial-gradient(68% 62% at 16% 10%, color-mix(in srgb, var(--accent) 40%, transparent), transparent 58%),
    radial-gradient(60% 58% at 90% 20%, color-mix(in srgb, var(--accent-3, var(--accent)) 28%, transparent), transparent 60%),
    radial-gradient(80% 74% at 74% 98%, color-mix(in srgb, var(--accent) 36%, transparent), transparent 60%),
    radial-gradient(46% 46% at 8% 92%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 62%),
    linear-gradient(158deg, var(--ov-hero-b), var(--ov-hero-a) 48%, var(--ov-hero-c));
  background-size: 210% 210%, 190% 190%, 230% 230%, 170% 170%, 100% 100%;
  animation: tkMesh 26s ease-in-out infinite; }
.tk-balance::after { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(130% 105% at 50% -8%, transparent 44%, rgba(5,8,16,.55)); }
@keyframes tkMesh {
  0%, 100% { background-position: 0% 0%, 100% 0%, 100% 100%, 0% 100%, 0 0; }
  50% { background-position: 36% 26%, 64% 38%, 52% 70%, 24% 66%, 0 0; }
}
@media (prefers-reduced-motion: reduce) { .tk-balance::before { animation: none; } }
.tk-bal-hd { display: flex; align-items: baseline; gap: 8px; font-weight: 600; color: #fff; font-size: 14px; margin-bottom: 13px; }
.tk-balance .tk-bal-hd svg { color: #fff; }
.tk-balance .tk-bal-hd .sub { color: rgba(255,255,255,.72); }
.tk-balance .tk-leg-n { color: rgba(255,255,255,.9); }
.tk-balance .tk-leg-v { color: #fff; }
.tk-balance .tk-leg-i.z { opacity: .55; }
.tk-bal-hd svg { width: 16px; height: 16px; color: var(--accent); align-self: center; }
.tk-bal-hd .sub { font-weight: 400; color: var(--sub); font-size: 12px; }
/* ⭐ колесо жизни + легенда */
.tk-bal-main { display: flex; align-items: center; gap: 22px; }
.tk-wheel { flex: 0 0 auto; width: 168px; }
.tk-wheel-svg { width: 168px; height: 168px; display: block; }
.tk-wheel-svg path { transition: fill-opacity .3s ease, transform .24s cubic-bezier(.2, .8, .25, 1); }
/* ⭐ интерактив: наведение на сферу подсвечивает и увеличивает лепесток (и наоборот из легенды) */
.tk-wheel-svg .tk-petal { transform-origin: 96px 96px; cursor: pointer; }
.tk-wheel-svg .tk-petal:hover, .tk-wheel-svg .tk-petal.hot { fill-opacity: .92; transform: scale(1.07); }
.tk-leg-i { cursor: pointer; border-radius: 8px; padding: 2px 5px; margin: -2px -5px; transition: background .15s; }
.tk-leg-i:hover, .tk-leg-i.hot { background: rgba(255, 255, 255, .12); }
.tk-leg-i.hot .tk-leg-dot { box-shadow: 0 0 0 3px color-mix(in srgb, var(--sc) 40%, transparent); }
.tk-leg { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; align-content: center; }
.tk-leg-i { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.tk-leg-i.z { opacity: .5; }
.tk-leg-dot { width: 9px; height: 9px; border-radius: 3px; background: var(--sc); flex: 0 0 auto; }
.tk-leg-n { color: var(--ink); flex: 1; min-width: 0; }
.tk-leg-v { font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
@media (max-width: 620px) { .tk-bal-main { flex-direction: column; } .tk-leg { width: 100%; } }
.tk-bal-nudge { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--sc) 8%, var(--card)); border: 1px solid color-mix(in srgb, var(--sc) 22%, transparent); font-size: 13px; line-height: 1.46; color: var(--ink); }
.tk-balance .tk-bal-nudge { background: rgba(255,255,255,.11); border-color: rgba(255,255,255,.2); color: rgba(255,255,255,.94); backdrop-filter: blur(6px); }
.tk-balance .tk-bal-nudge b { color: #fff; }
.tk-bal-ndot { width: 9px; height: 9px; border-radius: 50%; background: var(--sc); flex: 0 0 auto; margin-top: 5px; box-shadow: 0 0 0 4px color-mix(in srgb, var(--sc) 16%, transparent); }
/* ⭐ подсветка задачи по сфере + бейдж повтора */
.tk-row.has-sphere { border-left: 3px solid var(--sc); box-shadow: var(--shadow); }   /* цветной edge-glow убран (читался чужим синим); идентичность — в бордере */
.tk-title .tk-sphere-dot { display: inline-block; margin-right: 7px; vertical-align: middle; }
.tk-rep-badge { display: inline-flex; align-items: center; margin-left: 7px; color: var(--sub); opacity: .7; vertical-align: middle; }
.tk-rep-badge svg { width: 13px; height: 13px; }
/* ⭐ попап повтора */
.tk-rep-presets { display: flex; gap: 6px; margin-bottom: 10px; }
.tk-dow-row { display: flex; gap: 5px; margin-bottom: 10px; }
.tk-dow { flex: 0 0 auto; min-width: 32px; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--stroke); background: var(--card); font-size: 12px; font-weight: 600; color: var(--sub); cursor: pointer; transition: all .14s; }
.tk-dow:hover { border-color: var(--accent); }
.tk-dow.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.tk-rep-time { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--ink); }
.tk-rep-time input { padding: 8px 10px; border-radius: 10px; border: 1px solid var(--stroke); background: var(--card); color: var(--ink); font-size: 14px; }
/* ⭐ ИНЛАЙН-панель повтора: выезжает снизу капчи (без попапа) */
.tk-rep-panel { display: none; }
.tk-cap.rep-open .tk-rep-panel { display: block; margin-top: 8px; animation: tkRepSlide .3s cubic-bezier(.2, .8, .25, 1) both; }
@keyframes tkRepSlide { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.tk-rep-inner { border-top: 1px solid var(--stroke); padding-top: 11px; max-width: 430px; }
.tk-rep-lbl { font-size: 11px; }
.tk-rep-panel .tk-rep-presets button { padding: 5px 10px !important; font-size: 11.5px !important; }
.tk-rep-time { font-size: 12px; }
.tk-rep-time input { padding: 6px 9px; font-size: 13px; }
.tk-rep-clear { padding: 6px 11px; font-size: 11.5px; }
.tk-rep-lbl { font-size: 12px; font-weight: 600; color: var(--sub); margin-bottom: 9px; }
.tk-rep-panel .tk-rep-presets { display: flex; gap: 7px; margin-bottom: 11px; }
.tk-rep-panel .tk-rep-presets button { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--stroke); background: var(--card); font-size: 12px; font-weight: 600; color: var(--sub); cursor: pointer; transition: all .14s; }
.tk-rep-panel .tk-rep-presets button:hover { border-color: var(--accent); color: var(--accent); }
.tk-rep-panel .tk-dow-row { margin-bottom: 11px; }
.tk-rep-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tk-rep-clear { font-size: 12px; font-weight: 600; color: var(--ink-3); background: none; border: 1px solid var(--stroke); border-radius: 9px; padding: 7px 12px; cursor: pointer; transition: all .14s; }
.tk-rep-clear:hover { border-color: var(--bad); color: var(--bad); }
/* ⭐ палитра рутины брокера */
.tk-rt { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.tk-rt-hd { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 13px; color: var(--navy-900); margin-bottom: 8px; }
.tk-rt-items { display: flex; flex-direction: column; gap: 6px; }
.tk-rt-i { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; border-radius: 11px; border: 1px solid var(--stroke); border-left: 3px solid var(--sc); background: var(--card); cursor: pointer; text-align: left; transition: box-shadow .14s, transform .14s, opacity .14s; }
.tk-rt-i:hover { box-shadow: 0 6px 16px -8px color-mix(in srgb, var(--sc) 55%, transparent); transform: translateY(-1px); }
.tk-rt-i.added { opacity: .45; }
.tk-rt-x { font-size: 13px; color: var(--ink); font-weight: 500; }
.tk-rt-rep { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; color: var(--sub); white-space: nowrap; }
.tk-rt-rep svg { width: 11px; height: 11px; }
@media (max-width: 640px) { .tk-rt { grid-template-columns: 1fr; } }
.tk-pdot { width: 15px; height: 15px; border-radius: 50%; border: 2px solid transparent; background: var(--pc); opacity: .4; transition: opacity .14s, transform .14s, box-shadow .14s; }
.tk-pdot:hover { opacity: .8; transform: scale(1.12); }
.tk-pdot.on { opacity: 1; box-shadow: 0 0 0 2px var(--card), 0 0 0 4px var(--pc); }
.tk-seg { margin-bottom: 14px; }
.tk-suggest { margin-bottom: 14px; padding: 14px 16px; }
.tk-sug-hd { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; color: var(--navy-900); margin-bottom: 10px; }
.tk-sug-hd svg { width: 16px; height: 16px; color: var(--accent); }
.tk-sug-hd .sub { font-weight: 400; font-size: 11.5px; color: var(--ink-3); margin-left: auto; }
.tk-sug { display: flex; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px solid var(--stroke); }
.tk-sug:first-of-type { border-top: none; }
.tk-sug-t { flex: 1; font-size: 13px; color: var(--ink-2); }
.tk-list { display: flex; flex-direction: column; gap: 7px; }
.tk-sec-lbl { display: flex; align-items: center; gap: 7px; font-size: 10.5px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin: 16px 0 4px; }
.tk-sec-lbl svg { width: 13px; height: 13px; }
.tk-sec-lbl.od { color: var(--bad); }
.tk-sec-lbl.done { color: var(--ok); }
.tk-block { display: flex; align-items: center; gap: 13px; padding: 11px 15px; border-radius: var(--r-md); background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 7%, var(--card)), var(--card)); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--stroke)); box-shadow: var(--shadow); }
.tk-block-t { font-size: 14px; font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; flex: none; width: 48px; }
.tk-block-b { flex: 1; min-width: 0; font-size: 13px; color: var(--ink); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tk-block-link { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--accent); }
.tk-block-link svg { width: 13px; height: 13px; }
.tk-row { display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-radius: var(--r-md); background: var(--card); border: 1px solid var(--stroke); box-shadow: var(--shadow); transition: box-shadow var(--dur-fast), transform var(--dur-fast), opacity var(--dur-fast); }
.tk-row:hover { box-shadow: 0 8px 20px -10px rgba(16, 43, 92, .28); transform: translateY(-1px); }
/* инлайн-подзадачи в списке (разворот без попапа) */
.tk-rowwrap { display: flex; flex-direction: column; }
.tk-disc svg { transition: transform .18s var(--ease-soft); }
.tk-disc.open svg { transform: rotate(180deg); }
.tk-row.subs-open { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.tk-subs { display: flex; flex-direction: column; gap: 2px; margin: -1px 0 0; padding: 6px 14px 8px 46px; background: var(--bg-2); border: 1px solid var(--stroke); border-top: none; border-radius: 0 0 var(--r-md) var(--r-md); }
.tk-subs[hidden] { display: none; }
/* ⭐ инлайн-разворот задачи снизу (вместо попапа): весь функционал детали задачи */
.tk-detail { overflow: hidden; max-height: 0; transition: max-height .28s var(--ease-soft); }
.tk-detail > .td { margin: -1px 0 0; padding: 15px 16px 16px; background: var(--bg-2); border: 1px solid var(--stroke); border-top: none; border-radius: 0 0 var(--r-md) var(--r-md); animation: tkDetIn .3s var(--ease-soft); }
@keyframes tkDetIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.tk-row.tk-open { border-bottom-left-radius: 0; border-bottom-right-radius: 0; box-shadow: 0 -1px 0 var(--accent) inset, var(--shadow); }
.tk-row.tk-open .tk-mini[data-act="open"], .tk-main[data-act="open"] { cursor: pointer; }
.tk-sub { display: flex; align-items: center; gap: 9px; padding: 5px 8px; border-radius: 8px; text-align: left; color: var(--ink-2); font-size: 13px; transition: background .12s; }
.tk-sub:hover { background: color-mix(in srgb, var(--accent) 6%, transparent); }
.tk-sub.done .tk-sub-x { text-decoration: line-through; color: var(--ink-3); }
.tk-sub .tk-sub-x { flex: 1; }
.tk-row.done { opacity: .55; }
.tk-row.done .tk-title { text-decoration: line-through; color: var(--ink-3); }
.tk-check { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--stroke); background: var(--card); display: grid; place-items: center; color: transparent; transition: all .16s cubic-bezier(.4, 0, .2, 1); }
.tk-check svg { width: 13px; height: 13px; }
.tk-check:hover { border-color: var(--ok); }
.tk-check.on { background: var(--ok); border-color: var(--ok); color: #fff; }
.tk-flag { flex: none; width: 22px; height: 22px; display: grid; place-items: center; color: var(--pc, var(--ink-3)); border-radius: 6px; transition: background .14s, transform .14s; }
.tk-flag svg { width: 15px; height: 15px; fill: color-mix(in srgb, var(--pc) 18%, transparent); }
.tk-flag:hover { background: var(--bg-2); transform: scale(1.08); }
.tk-main { flex: 1; min-width: 0; }
.tk-title { font-size: 13.5px; color: var(--ink); line-height: 1.35; cursor: text; }
.tk-edit { width: 100%; border: 1.5px solid var(--accent); border-radius: 7px; padding: 5px 8px; font-size: 13.5px; font-family: inherit; outline: none; background: var(--card); color: var(--ink); }
.tk-meta { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 5px; }
.tk-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--ink-3); background: var(--bg-2); border-radius: 20px; padding: 2px 8px; }
.tk-chip svg { width: 11px; height: 11px; }
.tk-chip.od { color: var(--bad); background: color-mix(in srgb, var(--bad) 12%, transparent); }
.tk-acts { display: flex; gap: 3px; opacity: 0; transition: opacity var(--dur-fast); flex: none; }
.tk-row:hover .tk-acts { opacity: 1; }
.tk-mini { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; color: var(--ink-3); transition: background .14s, color .14s; }
.tk-mini svg { width: 15px; height: 15px; }
.tk-mini:hover { background: var(--bg-2); color: var(--accent); }
.tk-mini.del:hover { background: color-mix(in srgb, var(--bad) 12%, transparent); color: var(--bad); }
.tk-block .tk-mini { opacity: .6; }
/* инлайн-вложения на карточке: голос/файл без захода внутрь */
.tk-mini.tk-att { position: relative; color: var(--accent); background: color-mix(in srgb, var(--accent) 9%, transparent); }
.tk-mini.tk-att:hover { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.tk-mini.tk-att.playing { background: var(--accent); color: #fff; animation: tkAudPulse 1.1s ease-in-out infinite; }
@keyframes tkAudPulse { 0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 40%, transparent); } 50% { box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent) 0%, transparent); } }
.tk-att-n { position: absolute; top: -3px; right: -3px; min-width: 13px; height: 13px; padding: 0 3px; border-radius: 7px; background: var(--accent); color: #fff; font-size: 9px; font-weight: 700; display: grid; place-items: center; }
.tk-block .tk-mini:hover { opacity: 1; }
@media (max-width: 720px) {
  .tk-hero { flex-direction: column; align-items: flex-start; gap: 14px; }
  .tk-acts { opacity: 1; }
}

/* Карусель из лонча — умный поиск фактов */
.sh-lookup { display: flex; gap: 10px; margin-bottom: 10px; }
.sh-lookup-in { flex: 1; }
.sh-lc-conf:empty { display: none; }
.sh-conf { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: var(--r-md); margin-bottom: 12px; font-size: 12px; line-height: 1.45; }
.sh-conf svg { width: 16px; height: 16px; flex: none; margin-top: 1px; }
.sh-conf b { font-size: 12.5px; }
.sh-conf .muted { font-size: 11px; }
.sh-conf.ok { background: color-mix(in srgb, var(--ok) 10%, transparent); color: var(--ok); }
.sh-conf.warn { background: color-mix(in srgb, var(--warn) 12%, transparent); color: var(--warn); }
.sh-conf.bad { background: color-mix(in srgb, var(--bad) 10%, transparent); color: var(--bad); }
.sh-conf div div { color: var(--ink-2); }
@media (max-width: 640px) { .sh-lookup { flex-direction: column; } }

/* фото со страницы (скрейпинг) — выбор для вставки в карусель */
.sh-imgs:empty { display: none; }
.sh-imgs { margin-bottom: 12px; }
.sh-imgs-hd { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 600; color: var(--ink-2); margin-bottom: 8px; }
.sh-imgs-hd svg { width: 14px; height: 14px; }
.sh-imgs-n { margin-left: auto; background: var(--accent); color: #fff; border-radius: 20px; padding: 1px 8px; font-size: 11px; }
.sh-imgs-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.sh-img { position: relative; aspect-ratio: 4/3; border-radius: 10px; background: #DCE3ED center/cover no-repeat; border: none; cursor: pointer; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(6,17,38,.08); transition: transform .12s; }
.sh-img:hover { transform: translateY(-2px); }
.sh-img-ck { position: absolute; top: 5px; right: 5px; width: 22px; height: 22px; border-radius: 50%; background: rgba(6,17,38,.4); display: grid; place-items: center; opacity: 0; transition: opacity .12s; }
.sh-img-ck svg { width: 13px; height: 13px; color: #fff; }
.sh-img.on { box-shadow: inset 0 0 0 3px var(--accent); }
.sh-img.on .sh-img-ck { opacity: 1; background: var(--accent); }

/* понятные пресеты: тема-свотч и шрифт-превью с описанием */
.cpick-row { margin-bottom: 12px; }
.cpick-hd { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 7px; }
.cpick { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.cpick-it { flex: 0 0 auto; display: flex; align-items: center; gap: 9px; padding: 7px 12px 7px 8px; border: 1.5px solid var(--stroke); border-radius: 12px; background: var(--card, #fff); cursor: pointer; text-align: left; transition: border-color .12s, background .12s; }
.cpick-it:hover { border-color: var(--accent); }
.cpick-it.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); box-shadow: 0 0 0 1px var(--accent) inset; }
.cpick-sw { width: 30px; height: 30px; border-radius: 8px; flex: none; box-shadow: inset 0 0 0 1px rgba(6,17,38,.12); }
.cpick-aa { width: 30px; text-align: center; font-size: 21px; line-height: 1; flex: none; color: var(--navy-900); }
.cpick-l { display: flex; flex-direction: column; line-height: 1.2; }
.cpick-l b { font-size: 12.5px; font-weight: 700; color: var(--navy-900); }
.cpick-l i { font-size: 10.5px; font-style: normal; color: var(--ink-3); white-space: nowrap; }
.cpick-angi { width: 30px; height: 30px; border-radius: 8px; flex: none; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--accent) 10%, transparent); color: var(--accent); }
.cpick-angi svg { width: 17px; height: 17px; }
.cpick-it.on .cpick-angi { background: color-mix(in srgb, var(--accent) 18%, transparent); }

/* меню быстрой отправки контента */
.sh-shr { color: var(--ink-3); }
.sh-shr:hover { color: var(--accent); }
.sh-share-menu { display: flex; flex-direction: column; gap: 8px; }
.sh-share-opt { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--stroke); border-radius: var(--r-md); background: var(--card); text-align: left; transition: border-color .14s, background .14s, transform .14s, box-shadow .14s; }
.sh-share-opt:hover { border-color: var(--accent); background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 6%, var(--card)), var(--card)); transform: translateY(-1px); box-shadow: 0 8px 18px -10px color-mix(in srgb, var(--accent) 40%, transparent); }
.sh-share-opt svg { width: 20px; height: 20px; color: var(--accent); flex: none; }
.sh-share-opt span { display: flex; flex-direction: column; min-width: 0; }
.sh-share-opt b { font-size: 13.5px; color: var(--navy-900); }
.sh-share-opt i { font-size: 11.5px; font-style: normal; color: var(--ink-3); }

/* хантинг: референс-приём + ссылки на живые примеры */
.sh-tref { font-size: 12px; color: var(--ink-2); margin-top: 4px; line-height: 1.4; }
.sh-tref-lbl { display: inline-block; font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); margin-right: 6px; }
.sh-treflinks { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin-top: 12px; }
.sh-treflinks .sh-tref-lbl { display: inline-flex; align-items: center; gap: 4px; margin: 0; }
.sh-treflinks .sh-tref-lbl svg { width: 12px; height: 12px; }
/* главная кнопка «смотреть примеры» — залитая, читается как призыв посмотреть конкурентов */
.sh-refcta { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7C4DFF)); border-radius: 12px; padding: 10px 14px; box-shadow: 0 10px 22px -12px color-mix(in srgb, var(--accent) 70%, transparent); transition: transform .14s, box-shadow .14s; }
.sh-refcta:hover { transform: translateY(-1px); box-shadow: 0 16px 30px -14px color-mix(in srgb, var(--accent) 80%, transparent); }
.sh-refcta svg { width: 15px; height: 15px; }
.sh-refcta-p { font-size: 11px; font-weight: 600; opacity: .85; padding: 2px 8px; background: rgba(255,255,255,.18); border-radius: 20px; }
.sh-reflinks-alt { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.sh-reflink { font-size: 11.5px; font-weight: 600; color: var(--accent); border: 1px solid color-mix(in srgb, var(--accent) 28%, var(--stroke)); border-radius: 20px; padding: 3px 11px; transition: background .14s, transform .14s, box-shadow .14s; }
/* встроенный просмотр референс-видео прямо в дашборде */
.sh-refembed { margin-top: 4px; }
.sh-embed-toggle { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--stroke); background: var(--bg-2); color: var(--navy-900); border-radius: 10px; padding: 8px 13px; font-size: 12.5px; font-weight: 600; font-family: inherit; cursor: pointer; transition: border-color .14s, background .14s; }
.sh-embed-toggle b { font-weight: 700; color: var(--accent); }
.sh-embed-toggle svg { width: 15px; height: 15px; color: var(--accent); }
.sh-embed-toggle:hover, .sh-embed-toggle.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--bg-2)); }
.sh-embed-wrap { margin-top: 10px; }
.sh-embed-in { display: flex; gap: 7px; margin-bottom: 9px; }
.sh-embed-url { flex: 1; min-width: 0; border: 1px solid var(--stroke); border-radius: 9px; padding: 8px 11px; font-size: 13px; font-family: inherit; outline: none; }
.sh-embed-url:focus { border-color: var(--accent); }
.sh-embed-box:empty { display: none; }
.sh-embed-box { border-radius: 14px; overflow: hidden; margin-bottom: 7px; }
.sh-embed { width: 100%; border: none; display: block; border-radius: 14px; }
.sh-embed.ig { height: 660px; background: #fff; }
.sh-embed.tt { height: 760px; background: #000; }
.sh-embed.yt { aspect-ratio: 9 / 16; max-height: 660px; background: #000; }
.sh-embed.vid { max-height: 660px; background: #000; }
.sh-embed-hint { font-size: 11.5px; color: var(--ink-3); line-height: 1.45; }
.sh-embed-err { font-size: 12.5px; color: #C0392B; padding: 12px; text-align: center; background: color-mix(in srgb, #C0392B 7%, transparent); border-radius: 10px; }
.sh-reflink:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); transform: translateY(-1px); box-shadow: 0 6px 14px -8px color-mix(in srgb, var(--accent) 50%, transparent); }

/* просмотр кабинета брокера (view-as) + выдача доступа */
#previewBanner { position: fixed; top: 0; left: 0; right: 0; z-index: 400; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 8px 16px; background: linear-gradient(90deg, var(--accent-3), var(--accent-2)); color: #fff; font-size: 12.5px; font-weight: 600; box-shadow: 0 6px 20px -8px color-mix(in srgb, var(--accent) 60%, transparent); }
#previewBanner svg { width: 15px; height: 15px; }
#previewBanner b { font-weight: 700; }
#previewBanner button { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.35); color: #fff; border-radius: 8px; padding: 5px 12px; font-size: 12px; font-weight: 600; font-family: inherit; transition: background .14s; }
#previewBanner button:hover { background: rgba(255,255,255,.3); }
body.has-preview { padding-top: 38px; }
.pv-done { margin-top: 14px; }
.pv-done-hd { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; color: var(--ok); margin-bottom: 12px; }
.pv-done-hd svg { width: 16px; height: 16px; }
.pv-cred { display: grid; grid-template-columns: 1fr auto; gap: 8px 16px; background: var(--bg-2); border: 1px solid var(--stroke); border-radius: var(--r-md); padding: 12px 14px; margin-bottom: 12px; }
.pv-cred div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pv-cred span { font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); }
.pv-cred b { font-size: 13px; color: var(--navy-900); word-break: break-all; }
.pv-cred .pv-pin { font-size: 20px; font-variant-numeric: tabular-nums; letter-spacing: .12em; color: var(--accent); }
.pv-send { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }

/* сохранённый код доступа брокера (виден владельцу) */
.br-pin { display: flex; align-items: center; gap: 8px; padding: 7px 11px; background: color-mix(in srgb, var(--accent) 7%, var(--bg-2)); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--stroke)); border-radius: 10px; }
.br-pin b { font-size: 17px; font-variant-numeric: tabular-nums; letter-spacing: .14em; color: var(--accent); }
.br-pin .btn-ghost { width: 26px; height: 26px; display: grid; place-items: center; color: var(--ink-3); }
.br-pin .btn-ghost:hover { color: var(--accent); }
.br-pin .btn-ghost svg { width: 14px; height: 14px; }
.br-pin .muted { font-size: 10.5px; margin-left: auto; }

/* ═══════════════ ТАСК-МЕНЕДЖЕР v2 ═══════════════ */
.tk-cap-in { min-width: 0; }
.tk-mic { flex: none; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--card)); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--stroke)); transition: all .15s; }
.tk-mic svg { width: 18px; height: 18px; }
.tk-mic:hover { background: color-mix(in srgb, var(--accent) 14%, var(--card)); transform: translateY(-1px); }
.tk-mic.rec { background: var(--bad); color: #fff; border-color: var(--bad); animation: tkpulse 1.1s ease-in-out infinite; }
.tk-mic.busy { opacity: .6; pointer-events: none; }
@keyframes tkpulse { 0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--bad) 45%, transparent); } 50% { box-shadow: 0 0 0 7px transparent; } }
.tk-flag svg { fill: color-mix(in srgb, var(--pc) 22%, transparent); }

/* доски (календарь/канбан) — горизонтальный скролл */
.tk-list.board { overflow-x: auto; padding-bottom: 6px; }
.tk-cal-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.tk-cal-nav b { font-size: 13.5px; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.tk-cal { display: grid; grid-template-columns: repeat(7, minmax(150px, 1fr)); gap: 8px; min-width: 900px; }
.tk-cal-col { background: var(--bg-2); border: 1px solid var(--stroke); border-radius: var(--r-md); min-height: 320px; display: flex; flex-direction: column; transition: background .14s, box-shadow .14s; }
.tk-cal-col.today { border-color: color-mix(in srgb, var(--accent) 40%, var(--stroke)); }
.tk-cal-col.over { background: color-mix(in srgb, var(--accent) 10%, var(--card)); box-shadow: inset 0 0 0 2px var(--accent); }
.tk-cal-hd { display: flex; align-items: baseline; gap: 6px; padding: 9px 11px; border-bottom: 1px solid var(--stroke); }
.tk-cal-hd b { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); }
.tk-cal-col.today .tk-cal-hd b { color: var(--accent); }
.tk-cal-hd span { font-size: 15px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.tk-cal-body { flex: 1; padding: 8px; display: flex; flex-direction: column; gap: 6px; }

/* канбан */
.tk-kan { display: grid; grid-template-columns: repeat(5, minmax(200px, 1fr)); gap: 10px; min-width: 1040px; }
.tk-kan-col { background: var(--bg-2); border: 1px solid var(--stroke); border-radius: var(--r-md); display: flex; flex-direction: column; min-height: 340px; transition: background .14s, box-shadow .14s; }
.tk-kan-col.over { background: color-mix(in srgb, var(--accent) 10%, var(--card)); box-shadow: inset 0 0 0 2px var(--accent); }
.tk-kan-hd { display: flex; align-items: center; justify-content: space-between; padding: 11px 13px; font-size: 12.5px; font-weight: 650; color: var(--navy-900); border-bottom: 1px solid var(--stroke); }
.tk-kan-hd span { font-size: 11px; color: var(--ink-3); background: var(--card); border-radius: 20px; padding: 1px 8px; }
.tk-kan-body { flex: 1; padding: 9px; display: flex; flex-direction: column; gap: 7px; }
.tk-kan-empty { color: var(--ink-3); font-size: 12px; text-align: center; padding: 10px 0; opacity: .5; }

/* карточка-чип (в досках) */
.tk-chip-card { display: flex; align-items: center; gap: 8px; padding: 9px 11px; background: var(--card); border: 1px solid var(--stroke); border-left: 3px solid var(--pc, var(--accent)); border-radius: 9px; box-shadow: var(--shadow); cursor: grab; font-size: 12.5px; color: var(--ink); transition: box-shadow .14s, transform .1s; touch-action: none; }
.tk-chip-card:hover { box-shadow: 0 6px 16px -8px rgba(16,43,92,.3); }
.tk-chip-card.dragging { opacity: .4; }
.tk-chip-card.done { opacity: .5; }
.tk-chip-card.done .tk-chip-x { text-decoration: line-through; }
.tk-chip-card.mt { border-left-color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, var(--card)); cursor: default; }
.tk-chip-dot { display: none; }
.tk-chip-x { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-chip-t { font-size: 10.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; flex: none; }
.tk-chip-sub { font-size: 10px; color: var(--ink-3); background: var(--bg-2); border-radius: 10px; padding: 1px 6px; flex: none; }
.tk-ghost { position: fixed; z-index: 700; pointer-events: none; transform: translate(-50%, -50%) rotate(-2deg); box-shadow: 0 16px 40px -12px rgba(16,43,92,.5); opacity: .95; }

/* пикер срока: быстрые варианты */
.tk-dp { width: 284px; min-width: 0; max-width: calc(100vw - 24px); box-sizing: border-box; }
.tk-dp-quick { display: flex; flex-wrap: wrap; gap: 6px; padding-bottom: 10px; margin-bottom: 6px; border-bottom: 1px solid var(--stroke); }
.tk-dp-q { font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 20px; padding: 5px 11px; transition: all .14s; }
.tk-dp-q:hover { background: var(--accent); color: #fff; border-color: var(--accent); }
.tk-dp-clear { width: 100%; margin-top: 8px; font-size: 12px; font-weight: 600; color: var(--bad); background: none; border: 1px solid var(--stroke); border-radius: 8px; padding: 7px; }
.tk-dp-clear:hover { background: color-mix(in srgb, var(--bad) 8%, transparent); border-color: var(--bad); }

/* детальная карточка задачи */
.td { display: flex; flex-direction: column; gap: 16px; }
.td-title { width: 100%; border: none; border-bottom: 2px solid var(--stroke); background: none; font-family: var(--font); font-size: 19px; font-weight: 700; letter-spacing: -.01em; color: var(--navy-900); padding: 4px 2px 8px; outline: none; transition: border-color .14s; }
.td-title:focus { border-color: var(--accent); }
.td-row { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: start; }
.td-lbl { font-size: 11px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); padding-top: 8px; }
.td-pri { display: inline-flex; }
.td-pri .seg-btn { display: inline-flex; align-items: center; gap: 6px; }
.td-pdot { width: 9px; height: 9px; border-radius: 50%; }
.td-dl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.td-dl .dtp, .td-dl input[type=time] { max-width: 170px; }
.td-subs { display: flex; flex-direction: column; gap: 6px; }
.td-sub { display: flex; align-items: center; gap: 9px; }
.td-sub.done .td-sub-x { text-decoration: line-through; color: var(--ink-3); }
.tk-check.sm { width: 19px; height: 19px; }
.tk-check.sm svg { width: 11px; height: 11px; }
.td-sub-x { flex: 1; font-size: 13.5px; color: var(--ink); }
.td-sub-add input { width: 100%; border: 1px dashed var(--stroke); border-radius: 8px; padding: 7px 10px; font-size: 13px; background: none; outline: none; }
.td-sub-add input:focus { border-color: var(--accent); border-style: solid; }
.td-atts { display: flex; flex-direction: column; gap: 8px; }
.td-att { display: flex; align-items: center; gap: 8px; }
.td-att audio { height: 34px; flex: 1; }
.td-att img { max-height: 90px; border-radius: 8px; border: 1px solid var(--stroke); }
.td-att-file { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--accent); }
.td-att-file svg { width: 15px; height: 15px; }
.td-att-add { display: flex; gap: 7px; }
.td-att-add .tk-mic, .td-att-add #tdMic.rec { }
#tdMic.rec { background: var(--bad); color: #fff; border-color: var(--bad); animation: tkpulse 1.1s ease-in-out infinite; }
.td-notes { width: 100%; min-height: 70px; border: 1px solid var(--stroke); border-radius: 10px; padding: 9px 11px; font-family: inherit; font-size: 13px; color: var(--ink); background: var(--card); outline: none; resize: vertical; }
.td-notes:focus { border-color: var(--accent); }
/* заметки задачи: панелька инструментов + красивый рендер (стиль iPhone Notes) */
.td-notes-wrap { display: flex; flex-direction: column; gap: 8px; }
.td-notes-tools { display: flex; align-items: center; gap: 6px; }
.td-note-mic.dic-btn { position: static; width: 30px; height: 30px; flex: none; }
.td-note-tidy { gap: 5px; }
.td-note-edit { margin-left: auto; width: 30px; height: 30px; display: grid; place-items: center; color: var(--ink-3); }
.td-note-edit svg { width: 15px; height: 15px; }
.td-notes-wrap.editing .td-note-edit { color: var(--accent); }
.td-notes-view { border: 1px solid transparent; border-radius: 10px; padding: 4px 2px; cursor: text; min-height: 24px; }
.td-notes-view:hover { border-color: var(--stroke); background: var(--bg-2); }
/* markdown-заметка */
.md-note { font-size: 13.5px; line-height: 1.5; color: var(--navy-900); }
.md-note .mdn-h2 { font-family: var(--font-display); font-size: 15px; font-weight: 650; color: var(--navy-900); margin: 10px 0 5px; }
.md-note .mdn-h2:first-child { margin-top: 2px; }
.md-note .mdn-h3 { font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin: 10px 0 4px; }
.md-note .mdn-p { margin: 5px 0; }
.md-note .mdn-ul { list-style: none; margin: 5px 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.md-note .mdn-ul li { position: relative; padding-left: 17px; }
.md-note .mdn-ul li::before { content: ''; position: absolute; left: 3px; top: 8px; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); }
.md-note .mdn-chk { display: flex; align-items: flex-start; gap: 8px; margin: 4px 0; }
.md-note .mdn-box { flex: none; width: 16px; height: 16px; margin-top: 1px; border: 1.6px solid var(--stroke); border-radius: 5px; position: relative; }
.md-note .mdn-chk.done .mdn-box { background: var(--accent); border-color: var(--accent); }
.md-note .mdn-chk.done .mdn-box::after { content: ''; position: absolute; left: 4.5px; top: 1px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.md-note .mdn-chk.done span:last-child { color: var(--ink-3); text-decoration: line-through; }
.md-note b { font-weight: 680; color: var(--navy-900); }
@media (max-width: 640px) { .td-row { grid-template-columns: 1fr; } .td-lbl { padding-top: 0; } }

/* задача ↔ лид: панель сводки в деталях + чип */
.tk-chip.lead { cursor: pointer; }
.tk-chip.lead:hover { background: color-mix(in srgb, var(--accent) 12%, var(--bg-2)); color: var(--accent); }
.td-lead-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: var(--bg-2); border: 1px solid var(--stroke); border-radius: var(--r-md); padding: 11px 13px; }
.td-lead-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.td-lead-main b { font-size: 13.5px; color: var(--navy-900); }
.td-lead-main span { font-size: 11.5px; color: var(--ink-3); }
.td-lead-main i { font-size: 11.5px; font-style: normal; color: var(--ink-2); }
.td-lead-acts { display: flex; align-items: center; gap: 6px; flex: none; }
.td-lead-list { display: flex; flex-direction: column; gap: 4px; max-height: 320px; overflow: auto; }
.td-lead-opt { display: flex; align-items: baseline; gap: 8px; justify-content: space-between; padding: 9px 11px; border: 1px solid var(--stroke); border-radius: 9px; background: var(--card); font-size: 13px; color: var(--ink); text-align: left; transition: border-color .14s, background .14s; }
.td-lead-opt:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--card)); }
.td-lead-opt span { font-size: 11px; color: var(--ink-3); }

/* ═══════════════ ОБЗОР v2 — конструктор виджетов ═══════════════ */
.ov2-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ov2-h-t { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 22px; font-weight: 600; color: var(--navy-900); }
.ov2-h-t svg { width: 20px; height: 20px; color: var(--accent); }
.ov2-h-acts { display: flex; gap: 8px; }
/* органичная masonry-раскладка: виджеты плотно пакуются по высоте, без рваных дыр между рядами;
   full-виджеты (kpi/воронка/внимание) растягиваются на всю ширину и делят страницу на секции */
.ov2-grid { column-count: 2; column-gap: 14px; }
.ov-w { min-width: 0; break-inside: avoid; -webkit-column-break-inside: avoid; page-break-inside: avoid; margin: 0 0 14px; display: block; }
.ov-w.full { column-span: all; -webkit-column-span: all; }
.ov-w-body { height: 100%; }
@media (min-width: 1560px) { .ov2-grid { column-count: 3; } }
.ov-w-body { padding: 16px; }
/* виджеты обзора: отчёт клиенту / связки рекламы / источники / контент-launcher */
.ov-rep-sub { font-size: 12px; color: var(--ink-3); line-height: 1.45; margin: -2px 0 12px; }
.ov-rep-nums { display: flex; gap: 24px; margin: 4px 0 13px; flex-wrap: wrap; }
.ov-rep-n { display: flex; flex-direction: column; gap: 3px; }
.ov-rep-n b { font-size: 26px; font-weight: 700; color: var(--navy-900); line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.ov-rep-n span { font-size: 12px; color: var(--ink-3); }
.ov-rep-acts { display: flex; gap: 7px; flex-wrap: wrap; }
.ov-bnd { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.ov-bnd-t { font-size: 13px; font-weight: 600; color: var(--navy-900); display: flex; flex-direction: column; gap: 2px; margin-bottom: 5px; }
.ov-bnd-t i { font-style: normal; font-size: 11.5px; color: var(--ink-3); font-weight: 400; }
.ov-bnd-bar { height: 7px; border-radius: 5px; background: var(--bg-2); overflow: hidden; }
.ov-bnd-bar span { display: block; height: 100%; border-radius: 5px; background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #7C4DFF)); }
.ov-src-bar { display: flex; height: 12px; border-radius: 7px; overflow: hidden; margin: 4px 0 12px; gap: 2px; }
.ov-src-bar span { display: block; min-width: 3px; }
.ov-src-list { display: flex; flex-direction: column; gap: 8px; }
.ov-src-row { display: flex; align-items: center; gap: 9px; font-size: 13px; }
.ov-src-dot { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.ov-src-k { flex: 1; color: var(--navy-900); }
.ov-src-v { color: var(--ink-3); font-weight: 600; font-size: 12px; }
/* ═══ расширенная коллекция виджетов ═══ */
/* воронка конверсии — рельс со шагами и стрелками-% */
.ovx-rail { display: flex; align-items: stretch; gap: 4px; margin-top: 4px; }
.ovx-rail-step { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 13px 6px; border-radius: 13px; background: var(--bg-2); border: 1px solid var(--stroke-soft); }
.ovx-rail-step.acc { background: color-mix(in srgb, var(--accent) 10%, var(--bg-2)); border-color: color-mix(in srgb, var(--accent) 30%, transparent); }
.ovx-rail-ic { color: var(--accent); } .ovx-rail-ic svg { width: 17px; height: 17px; }
.ovx-rail-step b { font-size: 22px; font-weight: 800; color: var(--navy-900); line-height: 1; font-variant-numeric: tabular-nums; }
.ovx-rail-step span { font-size: 10.5px; color: var(--ink-3); text-align: center; }
.ovx-rail-arr { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--ink-3); gap: 2px; }
.ovx-rail-arr svg { width: 15px; height: 15px; } .ovx-rail-arr em { font-style: normal; font-size: 10.5px; font-weight: 800; color: var(--accent-2, var(--blue-300)); }
/* ИИ на линии */
.ovx-now { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--accent) 8%, var(--bg-2)); border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent); }
.ovx-now-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: #2FA98C; box-shadow: 0 0 0 0 color-mix(in srgb, #2FA98C 60%, transparent); animation: aiBreath 1.9s ease-in-out infinite; }
.ovx-now-b { font-size: 26px; font-weight: 800; color: var(--navy-900); line-height: 1; font-variant-numeric: tabular-nums; }
.ovx-now-k { font-size: 12px; color: var(--ink-2); }
/* кольцо винрейта */
.ovx-ring { position: relative; width: 86px; height: 86px; margin: 6px auto 0; }
.ovx-ring svg { transform: rotate(-90deg); }
.ovx-ring-bg { fill: none; stroke: var(--bg-2); stroke-width: 8; }
.ovx-ring-fg { fill: none; stroke: var(--accent); stroke-width: 8; stroke-linecap: round; transition: stroke-dashoffset .6s var(--ease-spring, ease); }
.ovx-ring-c { position: absolute; inset: 0; display: grid; place-items: center; } .ovx-ring-c b { font-size: 20px; font-weight: 800; color: var(--navy-900); }
.ovx-ring-sub { text-align: center; font-size: 11.5px; color: var(--ink-3); margin-top: 8px; }
/* компактный список (пора вернуться) */
.ovx-list { display: flex; flex-direction: column; gap: 2px; }
.ovx-li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 4px; border-bottom: 1px solid var(--stroke-soft); }
.ovx-li:last-child { border-bottom: none; }
.ovx-li-nm { font-size: 13px; font-weight: 600; color: var(--navy-900); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ovx-li-nm i { font-style: normal; font-weight: 400; font-size: 11px; color: var(--ink-3); margin-left: 6px; }
.ovx-li-t { flex: none; font-size: 11px; color: var(--accent-2, #E4813D); font-weight: 600; }
.ovx-li-more { font-size: 11.5px; color: var(--ink-3); padding: 8px 4px 2px; }
.ov-launch { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 4px; }
.ov-launch-i { display: flex; align-items: center; gap: 9px; border: 1px solid var(--stroke); border-radius: 12px; padding: 12px 13px; background: var(--card); font-size: 13px; font-weight: 600; color: var(--navy-900); cursor: pointer; font-family: inherit; transition: border-color .14s, transform .14s, box-shadow .14s; }
.ov-launch-i:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 10px 22px -12px color-mix(in srgb, var(--accent) 50%, transparent); }
.ov-launch-ic { width: 32px; height: 32px; flex: none; border-radius: 9px; display: grid; place-items: center; color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); }
.ov-launch-ic svg { width: 16px; height: 16px; }
.ov2-grid.editing .ov-w { border: 1px dashed var(--stroke); border-radius: calc(var(--r-md) + 4px); padding: 4px; background: var(--bg-2); }
.ov2-grid.editing .ov-w.drag { opacity: .45; }
.ov2-grid.editing .ov-w.ov-over { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.ov-w-bar { display: flex; align-items: center; gap: 8px; padding: 4px 8px 8px; font-size: 12px; font-weight: 650; color: var(--ink-3); }
.ov-w-grip { cursor: grab; display: grid; place-items: center; color: var(--ink-3); touch-action: none; }
.ov-w-grip svg { width: 16px; height: 16px; }
.ov-w-bar b { flex: 1; color: var(--navy-900); }
.ov-w-rm { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; color: var(--ink-3); }
.ov-w-rm:hover { background: color-mix(in srgb, var(--bad) 12%, transparent); color: var(--bad); }
.ov-w-rm svg { width: 14px; height: 14px; }
.ov2-lib { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ov2-lib-i { display: flex; align-items: center; gap: 9px; padding: 12px 13px; border: 1px solid var(--stroke); border-radius: var(--r-md); background: var(--card); font-size: 13px; font-weight: 600; color: var(--ink); transition: border-color .14s, background .14s, transform .12s; }
.ov2-lib-i:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--card)); transform: translateY(-1px); }
.ov2-lib-i svg { width: 17px; height: 17px; color: var(--accent); }

/* общий заголовок виджета */
.ov2-card-hd { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 650; color: var(--navy-900); margin-bottom: 12px; }
.ov2-card-hd svg { width: 16px; height: 16px; color: var(--accent); flex: none; }
.ov2-card-hd span { font-weight: 400; font-size: 11.5px; color: var(--ink-3); }
.ov2-card-hd .btn { margin-left: auto; }
.ov2-empty { padding: 18px 4px; text-align: center; color: var(--ink-3); font-size: 12.5px; }
.ov2-clean { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 14px; color: var(--ok); font-size: 13px; font-weight: 600; }
.ov2-clean svg { width: 16px; height: 16px; }

/* KPI — компактные тайлы, иконка и текст выровнены по центру */
.ov2-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.ov2-kpi { display: flex; align-items: center; gap: 12px; text-align: left; padding: 4px; }
.ov2-kpi-ic { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--accent) 10%, var(--card)); color: var(--accent); }
.ov2-kpi-ic svg { width: 20px; height: 20px; }
.ov2-kpi-b { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.ov2-kpi-v { font-size: 26px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.ov2-kpi-k { font-size: 12px; font-weight: 600; color: var(--ink-2); }
.ov2-kpi-s { font-size: 11px; color: var(--ink-3); }
@media (max-width: 900px) { .ov2-kpis { grid-template-columns: 1fr 1fr; } }

/* Требует внимания — icon/number/label в одну линию, идеально выровнены */
.ov2-attn { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.ov2-att { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--r-md); border: 1px solid var(--stroke); background: var(--bg-2); text-align: left; transition: transform .12s, box-shadow .14s; }
.ov2-att:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -10px rgba(16,43,92,.3); }
.ov2-att-ic { flex: none; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; }
.ov2-att-ic svg { width: 18px; height: 18px; }
.ov2-att.bad .ov2-att-ic { background: color-mix(in srgb, var(--bad) 14%, transparent); color: var(--bad); }
.ov2-att.warn .ov2-att-ic { background: color-mix(in srgb, var(--warn) 16%, transparent); color: var(--warn); }
.ov2-att.ok .ov2-att-ic { background: color-mix(in srgb, var(--ok) 14%, transparent); color: var(--ok); }
.ov2-att-b { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ov2-att-n { font-size: 20px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.ov2-att-k { font-size: 11.5px; color: var(--ink-3); }
.ov2-att-who { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--ink-2); background: var(--card); border: 1px solid var(--stroke); border-radius: 20px; padding: 3px 9px; flex: none; }

/* воронка — чистые горизонтальные бары */
.ov2-fun { display: flex; flex-direction: column; gap: 9px; }
.ov2-fun-row { display: flex; align-items: center; gap: 12px; text-align: left; }
.ov2-fun-nm { flex: none; width: 150px; font-size: 12.5px; color: var(--ink); display: flex; flex-direction: column; }
.ov2-fun-nm i { font-size: 10.5px; font-style: normal; color: var(--ink-3); }
.ov2-fun-bar { flex: 1; height: 12px; border-radius: 20px; background: var(--bg-2); overflow: hidden; }
.ov2-fun-bar i { display: block; height: 100%; border-radius: 20px; transition: width .5s var(--ease-soft); }
.ov2-fun-v { flex: none; width: 42px; text-align: right; font-size: 15px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }

/* задачи / встречи / активность в обзоре */
.ov2-task, .ov2-meet, .ov2-act { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--stroke); }
.ov2-task:first-of-type, .ov2-meet:first-of-type, .ov2-act:first-of-type { border-top: none; }
.ov2-task-ck { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--stroke); display: grid; place-items: center; color: transparent; transition: all .15s; }
.ov2-task-ck svg { width: 12px; height: 12px; }
.ov2-task-ck:hover { border-color: var(--ok); color: var(--ok); }
.ov2-task-ck.add { border-style: dashed; color: var(--ink-3); }
.ov2-task-ck.add:hover { border-color: var(--accent); color: var(--accent); }
.ov2-task-t { font-size: 13px; color: var(--ink); min-width: 0; }
.ov2-task-t i { display: block; font-size: 11px; font-style: normal; color: var(--ink-3); }
.ov2-task-t i.over { color: var(--bad); }
.ov2-task.sug .ov2-task-t { color: var(--ink-2); }
.ov2-meet-tm { flex: none; width: 58px; text-align: center; }
.ov2-meet-tm b { font-size: 14px; font-weight: 700; color: var(--navy-900); }
.ov2-meet-tm i { display: block; font-size: 10px; font-style: normal; color: var(--ink-3); }
.ov2-meet-b { flex: 1; min-width: 0; }
.ov2-meet-n { font-size: 13px; font-weight: 600; color: var(--navy-900); }
.ov2-meet-k { font-size: 11px; color: var(--ink-3); }
.ov2-act-ic { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--bg-2); color: var(--ink-3); }
.ov2-act-ic svg { width: 15px; height: 15px; }
.ov2-act.ok .ov2-act-ic { background: color-mix(in srgb, var(--ok) 12%, transparent); color: var(--ok); }
.ov2-act.warn .ov2-act-ic { background: color-mix(in srgb, var(--warn) 14%, transparent); color: var(--warn); }
.ov2-act-t { flex: 1; min-width: 0; font-size: 12.5px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov2-act-tm { flex: none; font-size: 10.5px; color: var(--ink-3); }
.ov2-spark { display: flex; align-items: flex-end; gap: 14px; padding-top: 4px; }
.ov2-spark-n { font-size: 30px; font-weight: 700; color: var(--navy-900); line-height: 1; }
.ov2-spark-n i { font-size: 11px; font-weight: 400; font-style: normal; color: var(--ink-3); display: block; margin-top: 3px; }
.ov2-spark-svg { flex: 1; height: 40px; }
.ov2-ob { display: flex; flex-direction: column; gap: 4px; }
.ov2-ob-row { display: flex; align-items: center; gap: 11px; padding: 9px 6px; border-radius: 10px; text-align: left; transition: background .14s; }
.ov2-ob-row:hover { background: var(--bg-2); }
.ov2-ob-row > svg { margin-left: auto; width: 15px; height: 15px; color: var(--ink-3); }
.ov2-ob-dot { flex: none; width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--stroke); display: grid; place-items: center; color: #fff; }
.ov2-ob-dot svg { width: 12px; height: 12px; }
.ov2-ob-row.ok .ov2-ob-dot { background: var(--ok); border-color: var(--ok); }
.ov2-ob-t { font-size: 13px; color: var(--ink); }
.ov2-ob-t i { display: block; font-size: 11px; font-style: normal; color: var(--ink-3); }
.ov2-ob-row.ok .ov2-ob-t { color: var(--ink-3); }
@media (max-width: 760px) { .ov2-grid { column-count: 1; } .ov-w.full { column-span: none; } }

/* Плавающая кнопка быстрых действий (правый нижний угол) */
/* pointer-events:none у контейнера — его «пустая» колонка над кнопкой раньше перехватывала клики
   по поповерам/элементам под ней («сейв-зона»). Кликабельны только сама кнопка и открытое меню. */
.qfab { position: fixed; right: 22px; bottom: 22px; z-index: 850; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; pointer-events: none; }
.qfab-main { pointer-events: auto; }
.qfab-main { position: relative; width: 58px; height: 58px; border: none; border-radius: 50%; cursor: pointer; background: none; padding: 0; display: grid; place-items: center; }
.qfab-orb { position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 32% 28%, color-mix(in srgb, var(--accent) 55%, #fff), var(--accent) 48%, color-mix(in srgb, var(--accent) 62%, #000) 100%); box-shadow: 0 10px 30px -6px color-mix(in srgb, var(--accent) 55%, transparent), inset 0 2px 6px rgba(255, 255, 255, .35), inset 0 -6px 12px rgba(6, 17, 38, .5); transition: transform .25s cubic-bezier(.2,1.4,.4,1); }
.qfab-orb::after { content: ''; position: absolute; inset: -6px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 45%, transparent), transparent 70%); filter: blur(6px); opacity: .7; animation: qfabPulse 2.8s ease-in-out infinite; z-index: -1; }
@keyframes qfabPulse { 0%,100% { transform: scale(1); opacity: .5; } 50% { transform: scale(1.18); opacity: .85; } }
.qfab-plus { position: relative; width: 24px; height: 24px; color: #fff; transition: transform .28s cubic-bezier(.2,1.4,.4,1); filter: drop-shadow(0 1px 2px rgba(6,17,38,.4)); }
.qfab-main:hover .qfab-orb { transform: scale(1.06); }
.qfab.open .qfab-plus { transform: rotate(135deg); }
.qfab-menu { display: flex; flex-direction: column; align-items: flex-end; gap: 9px; pointer-events: none; }
.qfab-act { display: flex; align-items: center; gap: 10px; border: none; background: none; cursor: pointer; opacity: 0; transform: translateY(14px) scale(.92); transition: opacity .2s, transform .2s; pointer-events: none; }
.qfab.open .qfab-menu { pointer-events: auto; }
.qfab.open .qfab-act { opacity: 1; transform: none; pointer-events: auto; }
.qfab.open .qfab-act:nth-child(1) { transition-delay: .02s; }
.qfab.open .qfab-act:nth-child(2) { transition-delay: .06s; }
.qfab.open .qfab-act:nth-child(3) { transition-delay: .10s; }
.qfab.open .qfab-act:nth-child(4) { transition-delay: .14s; }
.qfab.open .qfab-act:nth-child(5) { transition-delay: .18s; }
.qfab-lbl { background: #0A1833; color: #fff; font-size: 12.5px; font-weight: 600; padding: 8px 12px; border-radius: 10px; box-shadow: 0 8px 22px -8px rgba(6, 17, 38, .6); white-space: nowrap; line-height: 1.2; }
.qfab-lbl i { display: block; font-style: normal; font-size: 10.5px; color: var(--blue-300); font-weight: 500; }
.qfab-ai { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; background: #fff; display: grid; place-items: center; box-shadow: 0 8px 22px -8px rgba(6, 17, 38, .45); border: 1px solid var(--stroke, #E1E8F4); }
.qfab-ai svg { width: 19px; height: 19px; color: var(--accent, var(--accent)); }
.qfab-act:hover .qfab-ai { background: var(--accent, var(--accent)); }
.qfab-act:hover .qfab-ai svg { color: #fff; }
@media print { .qfab { display: none !important; } }
html[data-night] .qfab-ai { background: #14203A; border-color: #26355A; }

/* Обзор v2 — тонкие контролы конструктора + библиотека с превью */
.ov2-bar { display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-height: 30px; margin-bottom: 8px; }
.ov2-hint { margin-right: auto; font-size: 11.5px; color: var(--ink-3); }
.ov2-edit { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 8px; font-size: 12px; font-weight: 600; color: var(--ink-3); background: transparent; opacity: .6; transition: opacity .15s, background .15s, color .15s; }
.ov2-edit svg { width: 14px; height: 14px; }
.ov2-edit:hover { opacity: 1; background: var(--bg-2); color: var(--ink); }
.ov2-edit.on { opacity: 1; background: var(--accent); color: #fff; }
.ov2-add-tile { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 16px; border: 1.5px dashed var(--stroke); border-radius: var(--r-md); color: var(--ink-3); font-size: 13px; font-weight: 600; background: transparent; transition: border-color .15s, color .15s, background .15s; }
.ov2-add-tile:hover { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 5%, transparent); }
.ov2-add-tile svg { width: 16px; height: 16px; }

/* библиотека с живыми превью */
.ov2-lib { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ov2-lib-i { display: flex; flex-direction: column; border: 1px solid var(--stroke); border-radius: var(--r-md); overflow: hidden; cursor: pointer; background: var(--card); transition: border-color .14s, box-shadow .16s, transform .12s; }
.ov2-lib-i:hover { border-color: var(--accent); box-shadow: 0 10px 26px -14px color-mix(in srgb, var(--accent) 50%, transparent); transform: translateY(-2px); }
.ov2-lib-hd { display: flex; align-items: center; gap: 8px; padding: 10px 12px; font-size: 13px; font-weight: 650; color: var(--navy-900); border-bottom: 1px solid var(--stroke); }
.ov2-lib-hd svg { width: 16px; height: 16px; color: var(--accent); }
.ov2-lib-add { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600; color: var(--accent); opacity: 0; transition: opacity .14s; }
.ov2-lib-add svg { width: 13px; height: 13px; }
.ov2-lib-i:hover .ov2-lib-add { opacity: 1; }
.ov2-lib-prev { position: relative; height: 176px; overflow: hidden; background: var(--bg-2); pointer-events: none; padding: 12px; }
.ov2-lib-prev-in { zoom: .82; padding: 13px; box-shadow: none; -webkit-mask-image: linear-gradient(#000 78%, transparent); mask-image: linear-gradient(#000 78%, transparent); }
/* цепочка касаний в превью: перенос вместо обрезки по ширине (единственный не-переносящийся виджет) */
.ov2-lib-prev .ov-chain-seq { flex-wrap: wrap; row-gap: 5px; }
.ov2-lib-prev .ov-chain-nm { white-space: normal; }
.ov2-lib-reset { display: block; margin: 14px auto 0; font-size: 12px; font-weight: 600; color: var(--ink-3); background: none; padding: 8px 14px; border: 1px solid var(--stroke); border-radius: 8px; }
.ov2-lib-reset:hover { border-color: var(--bad); color: var(--bad); }
@media (max-width: 640px) { .ov2-lib { grid-template-columns: 1fr; } }

/* виджеты: свежие лиды / чипы / мини-статы / vs-таблица */
.ov2-lrow { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--stroke); }
.ov2-lrow:first-of-type { border-top: none; }
.ov2-lrow-b { flex: 1; min-width: 0; }
.ov2-lrow-n { font-size: 13px; font-weight: 600; color: var(--navy-900); }
.ov2-lrow-s { font-size: 11px; color: var(--ink-3); }
.ov2-lrow-t { font-size: 10.5px; color: var(--ink-3); flex: none; }
.ov2-chip { font-size: 10.5px; font-weight: 600; color: var(--ink-3); background: var(--bg-2); border-radius: 20px; padding: 2px 9px; }
.ov2-chip.on { color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.ov2-mini3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.ov2-mini { text-align: center; padding: 10px 4px; background: var(--bg-2); border-radius: var(--r-md); }
.ov2-mini b { display: block; font-size: 20px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.ov2-mini i { font-size: 10.5px; font-style: normal; color: var(--ink-3); }
.ov2-vs { font-size: 12.5px; }
.ov2-vs-h, .ov2-vs-r { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; padding: 6px 0; }
.ov2-vs-h { border-bottom: 1px solid var(--stroke); color: var(--ink-3); }
.ov2-vs-h b, .ov2-vs-r b { color: var(--accent); font-weight: 700; text-align: right; min-width: 56px; }
.ov2-vs-h i, .ov2-vs-r i { color: var(--ink-3); font-style: normal; text-align: right; min-width: 56px; }
.ov2-vs-r { border-top: 1px solid var(--stroke); }
.ov2-vs-r span { color: var(--ink); }

/* ── Лента агентства ── */
.fd-grid { display: grid; grid-template-columns: 1fr 300px; gap: 16px; align-items: start; }
@media (max-width: 900px) { .fd-grid { grid-template-columns: 1fr; } .fd-side { order: -1; } }
.fd-composer { margin-bottom: 16px; }
.fd-comp-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }
.fd-ct { border: 1.5px solid var(--stroke); background: var(--card, #fff); border-radius: 20px; padding: 5px 12px; font-size: 12px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.fd-ct.on { border-color: var(--tc); color: var(--tc); background: color-mix(in srgb, var(--tc) 9%, transparent); }
.fd-inp-title { width: 100%; border: none; border-bottom: 1.5px solid var(--stroke-soft); font-size: 15px; font-weight: 650; color: var(--navy-900); padding: 6px 2px; margin-bottom: 8px; outline: none; background: none; }
.fd-inp-title:focus { border-color: var(--accent); }
.fd-composer textarea { width: 100%; min-height: 70px; border: none; resize: vertical; font-size: 13.5px; line-height: 1.5; color: var(--navy-900); outline: none; background: none; font-family: inherit; }
.fd-attach { display: flex; gap: 8px; flex-wrap: wrap; }
.fd-attach:empty { display: none; }
.fd-att { position: relative; width: 60px; height: 60px; border-radius: 9px; overflow: hidden; background: var(--bg-2); display: grid; place-items: center; font-size: 22px; }
.fd-att img { width: 100%; height: 100%; object-fit: cover; }
.fd-att button, .fd-att-link button { position: absolute; top: 2px; right: 2px; width: 18px; height: 18px; border: none; border-radius: 50%; background: rgba(6,17,38,.7); color: #fff; cursor: pointer; display: grid; place-items: center; }
.fd-att button svg, .fd-att-link button svg { width: 10px; height: 10px; }
.fd-att-link { position: relative; display: inline-flex; align-items: center; gap: 6px; background: var(--violet-bg); color: var(--violet); border-radius: 9px; padding: 8px 26px 8px 10px; font-size: 12px; font-weight: 600; max-width: 260px; }
.fd-att-link svg { width: 13px; height: 13px; }
.fd-comp-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.fd-pinlbl { font-size: 12px; color: var(--ink-2); display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
/* пост */
.fd-post { background: var(--card, #fff); border: 1px solid var(--stroke, #E1E8F4); border-radius: 16px; padding: 16px 18px; margin-bottom: 14px; box-shadow: var(--shadow-sm, 0 1px 3px rgba(6,17,38,.05)); }
.fd-pin { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; color: var(--accent); margin-bottom: 8px; }
.fd-pin svg { width: 12px; height: 12px; }
.fd-head { display: flex; align-items: center; gap: 10px; }
.fd-ava { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 50%; overflow: hidden; background: linear-gradient(135deg, var(--accent), var(--accent-2, #5B2BD8)); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 13px; }
.fd-ava img { width: 100%; height: 100%; object-fit: cover; }
.fd-meta { flex: 1; min-width: 0; line-height: 1.25; }
.fd-meta b { font-size: 13.5px; color: var(--navy-900); }
.fd-meta span { display: block; font-size: 11px; color: var(--ink-3); }
.fd-type { font-size: 10.5px; font-weight: 700; color: var(--tc); background: color-mix(in srgb, var(--tc) 12%, transparent); border-radius: 20px; padding: 3px 10px; }
.fd-tools { display: flex; gap: 2px; opacity: 0; transition: opacity .12s; }
.fd-post:hover .fd-tools { opacity: 1; }
.fd-tools button { width: 26px; height: 26px; border: none; background: none; border-radius: 7px; color: var(--ink-3); cursor: pointer; display: grid; place-items: center; }
.fd-tools button:hover { background: var(--bg-2); color: var(--accent); }
.fd-tools button svg { width: 14px; height: 14px; }
.fd-title { font-size: 16px; font-weight: 700; color: var(--navy-900); margin: 12px 0 5px; }
.fd-text { font-size: 13.5px; line-height: 1.6; color: var(--ink-1, #2A3346); margin-top: 8px; white-space: pre-line; }
.fd-media { display: grid; gap: 5px; margin-top: 12px; border-radius: 12px; overflow: hidden; }
.fd-media.m1 { grid-template-columns: 1fr; }
.fd-media.m2 { grid-template-columns: 1fr 1fr; }
.fd-media.m3, .fd-media.m4 { grid-template-columns: 1fr 1fr; }
.fd-ph { aspect-ratio: 16/10; background: var(--bg-2) center/cover no-repeat; }
.fd-media.m1 .fd-ph { aspect-ratio: 16/9; }
.fd-media video { width: 100%; border-radius: 8px; background: #000; max-height: 380px; }
.fd-link { display: flex; gap: 0; margin-top: 12px; border: 1px solid var(--stroke); border-radius: 14px; overflow: hidden; text-decoration: none; transition: border-color .12s, box-shadow .12s, transform .12s; background: var(--card, #fff); }
.fd-link:hover { border-color: var(--accent); box-shadow: 0 8px 22px -10px color-mix(in srgb, var(--accent) 40%, transparent); transform: translateY(-1px); }
.fd-link-img { width: 150px; flex: 0 0 150px; background: var(--bg-2) center/cover no-repeat; }
.fd-link-img.noimg { display: grid; place-items: center; background: linear-gradient(140deg, var(--accent), var(--accent-2, #5B2BD8)); }
.fd-link-img.noimg span { font-size: 40px; font-weight: 800; color: rgba(255,255,255,.92); font-family: var(--font-display, 'Fraunces'), serif; }
.fd-link-b { padding: 13px 15px; min-width: 0; display: flex; flex-direction: column; gap: 4px; justify-content: center; }
.fd-link-dom { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); }
.fd-link-dom svg { width: 12px; height: 12px; }
.fd-link-b b { display: block; font-size: 14px; color: var(--navy-900); line-height: 1.35; }
.fd-link-go { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--ink-3); }
.fd-link-go svg { width: 12px; height: 12px; }
@media (max-width: 520px) { .fd-link-img { width: 96px; flex-basis: 96px; } }
/* акцент-полоса поста по типу */
.fd-post { position: relative; }
.fd-post::before { content: ''; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 3px; background: var(--tcol, var(--accent)); opacity: .55; }
.fd-reacts { display: flex; align-items: center; gap: 6px; margin-top: 14px; flex-wrap: wrap; }
.fd-react { border: 1px solid var(--stroke-soft); background: var(--bg-2); border-radius: 20px; padding: 4px 10px; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; transition: transform .1s, border-color .12s; }
.fd-react:hover { transform: scale(1.08); }
.fd-react b { font-size: 11px; font-weight: 700; color: var(--ink-2); }
.fd-react.on { border-color: var(--accent); background: var(--blue-100); }
.fd-rtotal { margin-left: auto; font-size: 11.5px; color: var(--ink-3); }
/* доска лидеров */
.fd-board { position: sticky; top: 6px; }
.fd-podium { display: flex; align-items: flex-end; justify-content: center; gap: 10px; margin: 6px 0 12px; }
.fd-pod { display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.fd-pod b { font-size: 12px; color: var(--navy-900); }
.fd-pod i { font-size: 10.5px; font-style: normal; color: var(--ink-3); }
.fd-pod-ava { position: relative; width: 52px; height: 52px; border-radius: 50%; overflow: visible; background: linear-gradient(135deg, var(--accent), var(--accent-2, #5B2BD8)); color: #fff; display: grid; place-items: center; font-weight: 700; }
.fd-pod-ava img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.fd-pod.p1 .fd-pod-ava { width: 66px; height: 66px; box-shadow: 0 0 0 3px #E8B84B, 0 8px 20px -6px rgba(232,184,75,.6); }
.fd-pod.p2 .fd-pod-ava { box-shadow: 0 0 0 3px #C0C6D0; }
.fd-pod.p3 .fd-pod-ava { box-shadow: 0 0 0 3px #C08457; }
.fd-pod-rank { position: absolute; bottom: -4px; right: -4px; width: 20px; height: 20px; border-radius: 50%; background: #fff; color: var(--navy-900); font-size: 11px; font-weight: 800; display: grid; place-items: center; box-shadow: 0 2px 6px rgba(6,17,38,.2); }
.fd-pod.p1 .fd-pod-rank { background: #E8B84B; color: #241F14; }
.fd-brow { display: flex; align-items: center; gap: 10px; padding: 7px 2px; border-top: 1px solid var(--stroke-soft); font-size: 12.5px; }
.fd-brank { width: 20px; color: var(--ink-3); font-weight: 700; }
.fd-bname { flex: 1; color: var(--navy-900); font-weight: 600; }
.fd-brow b { color: var(--accent); }

/* Виджет «Доска лидеров» — подложка Higgsfield + живой подиум поверх */
.ov2-lead-hero { position: relative; margin: 8px 0 2px; border-radius: 14px; overflow: hidden; background: linear-gradient(160deg, #12224E 0%, #0B1430 55%, #0A1226 100%); padding: 16px 12px 14px; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 12%, transparent); }
.ov2-lead-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(120% 80% at 50% -10%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 60%); }
.ov2-lead-podium { position: relative; display: flex; align-items: flex-end; justify-content: center; gap: 14px; }
.ov2-lp { display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.ov2-lp b { font-size: 12.5px; color: #fff; text-shadow: 0 1px 4px rgba(0,0,0,.5); }
.ov2-lp i { font-size: 10.5px; font-style: normal; color: #B9C7E8; }
.ov2-lp-ava { position: relative; width: 50px; height: 50px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent-3)); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: 15px; }
.ov2-lp-ava img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.ov2-lp.p1 { order: 2; } .ov2-lp.p2 { order: 1; } .ov2-lp.p3 { order: 3; }
.ov2-lp.p1 .ov2-lp-ava { width: 66px; height: 66px; box-shadow: 0 0 0 3px #E8B84B, 0 8px 22px -6px rgba(232,184,75,.7); }
.ov2-lp.p2 .ov2-lp-ava { box-shadow: 0 0 0 3px #C7CEDA; }
.ov2-lp.p3 .ov2-lp-ava { box-shadow: 0 0 0 3px #C08457; }
.ov2-lp-rank { position: absolute; bottom: -3px; right: -3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; color: #0A1833; font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.ov2-lp.p1 .ov2-lp-rank { background: #E8B84B; }
.ov2-lead-row { display: flex; align-items: center; gap: 10px; padding: 7px 4px; border-top: 1px solid var(--stroke-soft); font-size: 12.5px; }
.ov2-lr-rank { width: 20px; color: var(--ink-3); font-weight: 700; }
.ov2-lr-name { flex: 1; color: var(--navy-900); font-weight: 600; }
.ov2-lead-row b { color: var(--accent); }

/* Воронка как премиум-герой на Higgsfield-подложке */
.ov2-fun-hero { position: relative; margin: -2px; padding: 16px 16px; border-radius: 14px; overflow: hidden; background: linear-gradient(155deg, #10214A 0%, #0B1430 60%, #0A1226 100%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 10%, transparent); }
.ov2-fun-hero::before { content: ''; position: absolute; inset: 0; background: radial-gradient(100% 70% at 85% 0%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 55%); }
.ov2-fun-hero .ov2-fun-row { position: relative; z-index: 1; }
.ov2-fun-hero .ov2-fun-nm { color: #EAF0FF; }
.ov2-fun-hero .ov2-fun-nm i { color: var(--blue-300); }
.ov2-fun-hero .ov2-fun-bar { background: rgba(255,255,255,.14); }
.ov2-fun-hero .ov2-fun-v { color: #fff; }

/* Карточка лида — визуальная иерархия: ядро управления промінентно, инструменты-аккордеоны вторичны */
.lc-right .coll { margin: 7px 0; border: 1px solid var(--stroke-soft); border-radius: var(--r-md); overflow: hidden; background: var(--bg); }
.lc-right .coll-head { padding: 10px 12px; font-size: 12.5px; color: var(--ink-2); font-weight: 600; }
.lc-right .coll-head:hover { background: var(--bg-2); }
.lc-right .coll[open] .coll-head, .lc-right .coll.open .coll-head { color: var(--navy-900); }
/* ядро: стадия/брокер/след.шаг/квалификация — в единый выделенный блок */
.lc-3sel { padding: 12px; background: var(--card, #fff); border: 1px solid var(--stroke); border-radius: var(--r-md); box-shadow: var(--shadow-sm, 0 1px 3px rgba(6,17,38,.05)); }
.lc-right .lp-sec:first-of-type { margin-top: 14px; }
.lc-right .lp-sec { color: var(--navy-900); font-weight: 700; opacity: .78; }
/* ИИ-помощник — мягко выделенный, но не кричащий */
.lc-ai.on { border-color: color-mix(in srgb, var(--accent) 35%, var(--stroke)); background: color-mix(in srgb, var(--accent) 5%, var(--bg)); }
.lc-ai-head b { font-size: 13.5px; }

/* Диктовка в однострочных свободных полях — компактный микрофон-оверлей справа */
.dic-inp { position: relative; display: block; }
.dic-inp > input { width: 100%; padding-right: 34px !important; box-sizing: border-box; }
.dic-inp-btn { position: absolute; top: 50%; right: 6px; transform: translateY(-50%); width: 24px; height: 24px; border: none; border-radius: 7px; background: color-mix(in srgb, var(--ink) 52%, transparent); color: #fff; cursor: pointer; opacity: .34; transition: opacity .15s, background .15s; display: grid; place-items: center; z-index: 3; }
.dic-inp:hover .dic-inp-btn, .dic-inp > input:focus + .dic-inp-btn { opacity: .8; }
.dic-inp-btn:hover { opacity: 1; }
.dic-inp-btn svg { width: 13px; height: 13px; }
.dic-inp-btn.rec { opacity: 1; background: #C0392B; animation: dicPulse 1.1s infinite; }
.dic-inp-btn.busy { opacity: 1; background: var(--accent); }

/* ============ Тиндер идей (виджет обзора) ============ */
.idea-deck { display: flex; flex-direction: column; gap: 12px; }
.idea-count { font-size: 11px; color: var(--ink-3); text-transform: uppercase; letter-spacing: .05em; text-align: center; }
.idea-card { position: relative; border: 1px solid var(--stroke); border-radius: 16px; padding: 16px 16px 15px; background:
    linear-gradient(180deg, color-mix(in srgb, var(--acol, var(--accent)) 7%, var(--card)) 0%, var(--card) 60%);
  box-shadow: 0 8px 26px -14px color-mix(in srgb, var(--acol, var(--accent)) 60%, transparent); overflow: hidden; }
.idea-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--acol, var(--accent)); }
.idea-angle { display: inline-block; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  color: var(--acol, var(--accent)); background: color-mix(in srgb, var(--acol, var(--accent)) 14%, transparent); border-radius: 7px; padding: 3px 9px; margin-bottom: 9px; }
.idea-title { font-size: 15.5px; font-weight: 750; line-height: 1.3; color: var(--navy-900); }
.idea-hook { font-size: 13px; color: var(--ink-2); font-style: italic; margin-top: 7px; line-height: 1.45; }
.idea-why { display: flex; gap: 7px; align-items: flex-start; font-size: 12.5px; color: var(--ink-3); margin-top: 10px; line-height: 1.4; }
.idea-why svg { width: 14px; height: 14px; color: var(--acol, var(--accent)); flex: none; margin-top: 1px; }
.idea-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 11px; }
.idea-meta span { font-size: 11px; font-weight: 600; color: var(--ink-2); background: var(--bg-2); border-radius: 7px; padding: 3px 8px; display: inline-flex; align-items: center; gap: 4px; }
.idea-meta svg { width: 12px; height: 12px; }
.idea-eff.e-low { color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.idea-eff.e-mid { color: #B8860B; background: rgba(224, 168, 46, .13); }
.idea-eff.e-high { color: var(--bad); background: color-mix(in srgb, var(--bad) 12%, transparent); }
.idea-plat { text-transform: capitalize; }
.idea-ref { display: flex; gap: 7px; align-items: flex-start; font-size: 11.5px; color: var(--ink-3); margin-top: 11px; padding-top: 11px; border-top: 1px dashed var(--stroke); line-height: 1.4; }
.idea-ref svg { width: 13px; height: 13px; flex: none; margin-top: 1px; color: var(--ink-3); }
.idea-ref b { color: var(--ink-2); font-weight: 650; }
.idea-acts { display: grid; grid-template-columns: auto 1fr 1fr; gap: 8px; }
.idea-act { display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 1px solid var(--stroke);
  background: var(--card); border-radius: 12px; padding: 11px 10px; font-size: 12.5px; font-weight: 650; color: var(--ink-2);
  cursor: pointer; font-family: inherit; transition: transform .12s, background .12s, border-color .12s, color .12s; }
.idea-act svg { width: 16px; height: 16px; }
.idea-act:hover { transform: translateY(-1px); }
.idea-act.skip { color: var(--ink-3); width: 46px; padding: 11px; }
.idea-act.skip:hover { border-color: var(--bad); color: var(--bad); background: color-mix(in srgb, var(--bad) 7%, transparent); }
.idea-act.keep:hover { border-color: #8B7BD8; color: #6C5AC7; background: rgba(139, 123, 216, .09); }
.idea-act.take { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 6px 18px -8px var(--accent); }
.idea-act.take:hover { filter: brightness(1.06); }
/* пустое состояние / генерация */
.idea-empty { text-align: center; padding: 20px 12px 8px; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.idea-empty > svg { width: 30px; height: 30px; color: var(--accent); opacity: .8; margin-bottom: 4px; }
.idea-empty-t { font-size: 14px; font-weight: 700; color: var(--navy-900); }
.idea-empty-s { font-size: 12px; color: var(--ink-3); line-height: 1.45; max-width: 260px; }
.idea-genbtn { margin-top: 12px; }
.idea-spin { width: 34px; height: 34px; display: grid; place-items: center; margin-bottom: 6px; }
.idea-spin svg { width: 26px; height: 26px; color: var(--accent); animation: ideaSpin 1s linear infinite; }
@keyframes ideaSpin { to { transform: rotate(360deg); } }
/* вылет карточки при свайпе */
.idea-fly-skip { animation: ideaFlyL .18s ease-in forwards; }
.idea-fly-keep { animation: ideaFlyD .18s ease-in forwards; }
.idea-fly-take { animation: ideaFlyR .18s ease-in forwards; }
@keyframes ideaFlyL { to { transform: translateX(-40px) rotate(-6deg); opacity: 0; } }
@keyframes ideaFlyR { to { transform: translateX(40px) rotate(6deg); opacity: 0; } }
@keyframes ideaFlyD { to { transform: translateY(24px); opacity: 0; } }

/* ============ Аналитика: светлый hero «человек против ИИ» (замена тёмного графика) ============ */
.an-hero { padding: 20px 22px; }
.an-hero-hd { display: flex; align-items: center; gap: 11px; margin-bottom: 18px; }
.an-hero-hd > svg { width: 22px; height: 22px; color: var(--accent); flex: none; }
.an-hero-hd b { font-size: 16px; font-weight: 750; color: var(--navy-900); display: block; }
.an-hero-hd span { font-size: 12px; color: var(--ink-3); }
.an-hero-tag { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700;
  color: var(--ok); background: color-mix(in srgb, var(--ok) 11%, transparent); border-radius: 20px; padding: 5px 12px; }
.an-hero-tag svg { width: 13px; height: 13px; }
.an-hero-rows { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 26px; }
.anh-row { min-width: 0; }
.anh-k { font-size: 12px; font-weight: 600; color: var(--ink-2); margin-bottom: 8px; }
.anh-bars { display: flex; flex-direction: column; gap: 6px; }
.anh-bar { position: relative; display: flex; align-items: center; gap: 8px; }
.anh-bar i { display: block; height: 9px; border-radius: 6px; min-width: 4px; transition: width .5s cubic-bezier(.4,0,.2,1); }
.anh-bar.ai i { background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.anh-bar.hu i { background: var(--stroke); }
.anh-bar b { font-size: 12px; font-weight: 750; flex: none; }
.anh-bar.ai b { color: var(--accent); }
.anh-bar.hu b { color: var(--ink-3); }
.anh-vals { display: flex; gap: 10px; }
.anh-v { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 17px; font-weight: 800; padding: 8px 12px; border-radius: 10px; }
.anh-v i { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; opacity: .7; }
.anh-v.ai { color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.anh-v.hu { color: var(--ink-2); background: var(--bg-2); }
@media (max-width: 720px) { .an-hero-rows { grid-template-columns: 1fr; } }

/* ============ Лента: богатые карточки ссылок / опрос / диктовка / приватность / тумблеры ============ */
/* обложка ссылки: картинка поверх фирменного градиента-заглушки; play для видео */
.fd-link-cov { position: relative; width: 168px; flex: 0 0 168px; min-height: 108px; overflow: hidden;
  background: linear-gradient(140deg, var(--pc, var(--accent)), color-mix(in srgb, var(--pc, var(--accent)) 55%, #000)); display: grid; place-items: center; }
.fd-link-cov img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fd-link-glyph { font-size: 42px; font-weight: 800; color: rgba(255,255,255,.9); font-family: var(--font-display, 'Fraunces'), serif; }
.fd-link-play { position: absolute; z-index: 2; width: 46px; height: 46px; border-radius: 50%; background: rgba(0,0,0,.5); backdrop-filter: blur(2px); display: grid; place-items: center; border: 2px solid rgba(255,255,255,.85); }
.fd-link-play svg { width: 20px; height: 20px; color: #fff; fill: #fff; margin-left: 2px; }
.fd-link-t { display: block; font-size: 14px; color: var(--navy-900); line-height: 1.35; font-weight: 650; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.fd-link-dom b { text-transform: none; letter-spacing: 0; }
@media (max-width: 520px) { .fd-link-cov { width: 108px; flex-basis: 108px; min-height: 92px; } .fd-link-glyph { font-size: 30px; } }
/* заголовок с яйкой (микрофон) */
.fd-inp-wrap { position: relative; display: flex; align-items: center; }
.fd-inp-wrap .fd-inp-title { flex: 1; margin-bottom: 8px; padding-right: 34px; }
.fd-mic { position: absolute; right: 2px; top: 2px; width: 28px; height: 28px; border-radius: 8px; border: none; background: var(--bg-2); color: var(--ink-3); display: grid; place-items: center; cursor: pointer; }
.fd-mic svg { width: 15px; height: 15px; }
.fd-mic:hover { color: var(--accent); }
.fd-mic.rec { background: #C0392B; color: #fff; animation: dicPulse 1.1s infinite; }
.fd-mic.busy { background: var(--accent); color: #fff; }
/* заготовки постов */
.fd-tpls { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 2px; }
.fd-tpl { border: 1px dashed var(--stroke); background: var(--bg-2); border-radius: 20px; padding: 4px 11px; font-size: 11.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.fd-tpl:hover { border-style: solid; border-color: var(--accent); color: var(--accent); }
/* аккуратные тумблеры (Закрепить / Telegram) — заменяют кривые чекбоксы */
.fd-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ink-2); cursor: pointer; padding: 5px 10px 5px 6px; border-radius: 20px; border: 1px solid var(--stroke); user-select: none; line-height: 1; }
.fd-toggle svg { width: 14px; height: 14px; }
.fd-toggle input { display: none; }
.fd-toggle .fd-toggle-tr { width: 30px; height: 17px; border-radius: 10px; background: var(--stroke); position: relative; flex: none; transition: background .15s; }
.fd-toggle .fd-toggle-tr::after { content: ''; position: absolute; top: 2px; left: 2px; width: 13px; height: 13px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.fd-toggle input:checked + .fd-toggle-tr { background: var(--accent); }
.fd-toggle input:checked + .fd-toggle-tr::after { transform: translateX(13px); }
.fd-toggle:has(input:checked) { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, transparent); }
#fdPrivacy.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
#fdWand.busy { opacity: .6; pointer-events: none; }
/* опрос в композере */
.fd-pollbox { border: 1px solid var(--stroke); border-radius: 12px; padding: 12px; margin-top: 10px; background: var(--bg-2); }
.fd-poll-hd { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--navy-900); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 9px; }
.fd-poll-hd svg { width: 15px; height: 15px; color: var(--accent); }
.fd-poll-x { margin-left: auto; border: none; background: none; cursor: pointer; color: var(--ink-3); display: grid; place-items: center; }
.fd-poll-x svg { width: 15px; height: 15px; }
.fd-poll-qin { width: 100%; border: 1px solid var(--stroke); border-radius: 8px; padding: 8px 10px; font-size: 13.5px; font-weight: 650; margin-bottom: 8px; outline: none; background: var(--card, #fff); color: var(--navy-900); }
.fd-poll-qin:focus { border-color: var(--accent); }
.fd-poll-oi { display: flex; gap: 6px; align-items: center; margin-bottom: 6px; }
.fd-poll-oi input { flex: 1; border: 1px solid var(--stroke); border-radius: 8px; padding: 7px 10px; font-size: 13px; outline: none; background: var(--card, #fff); color: var(--navy-900); }
.fd-poll-oi input:focus { border-color: var(--accent); }
.fd-poll-orm { border: none; background: none; cursor: pointer; color: var(--ink-3); display: grid; place-items: center; padding: 4px; }
.fd-poll-orm svg { width: 14px; height: 14px; }
.fd-poll-add { border: 1px dashed var(--stroke); background: none; border-radius: 8px; padding: 6px 10px; font-size: 12px; font-weight: 600; color: var(--accent); cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.fd-poll-add svg { width: 13px; height: 13px; }
/* опрос в посте */
.fd-poll { margin-top: 12px; display: flex; flex-direction: column; gap: 7px; }
.fd-poll-q { display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 700; color: var(--navy-900); margin-bottom: 2px; }
.fd-poll-q svg { width: 16px; height: 16px; color: var(--accent); }
.fd-poll-opt { position: relative; display: flex; align-items: center; gap: 8px; border: 1.5px solid var(--stroke); border-radius: 10px; padding: 10px 13px; font-size: 13.5px; cursor: pointer; background: var(--card, #fff); overflow: hidden; text-align: left; font-family: inherit; }
.fd-poll-opt:hover { border-color: var(--accent); }
.fd-poll-opt.voted { cursor: pointer; }
.fd-poll-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: color-mix(in srgb, var(--accent) 13%, transparent); transition: width .5s cubic-bezier(.4,0,.2,1); z-index: 0; }
.fd-poll-opt.mine .fd-poll-fill { background: color-mix(in srgb, var(--accent) 22%, transparent); }
.fd-poll-opt.mine { border-color: var(--accent); }
.fd-poll-txt { position: relative; z-index: 1; flex: 1; color: var(--navy-900); font-weight: 600; }
.fd-poll-pct { position: relative; z-index: 1; font-weight: 800; color: var(--accent); font-size: 13px; }
.fd-poll-tot { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
/* бейдж ограниченного просмотра */
.fd-aud { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; font-weight: 600; color: var(--warn, #B8860B); margin-left: 8px; }
.fd-aud svg { width: 11px; height: 11px; }
/* окно приватности */
.fp-modes { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-bottom: 14px; }
.fp-mode { display: flex; flex-direction: column; align-items: center; gap: 6px; border: 1.5px solid var(--stroke); border-radius: 12px; padding: 12px 8px; font-size: 12px; font-weight: 600; color: var(--ink-2); cursor: pointer; background: var(--card, #fff); text-align: center; }
.fp-mode svg { width: 20px; height: 20px; }
.fp-mode.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.fp-list { max-height: 300px; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.fp-row { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 8px; cursor: pointer; font-size: 13px; }
.fp-row:hover { background: var(--bg-2); }
.fp-ava { width: 30px; height: 30px; border-radius: 50%; overflow: hidden; background: linear-gradient(150deg, var(--accent), var(--accent-2, #5B2BD8)); color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 700; flex: none; }
.fp-ava img { width: 100%; height: 100%; object-fit: cover; }

/* ============ Контроль посадочных мест (анти-фрод подписки) ============ */
.seat-sum { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.seat-kpi { background: var(--bg-2); border-radius: 10px; padding: 12px; text-align: center; }
.seat-kpi b { display: block; font-size: 22px; font-weight: 800; color: var(--navy-900); }
.seat-kpi i { font-size: 11px; color: var(--ink-3); font-style: normal; }
.seat-kpi.bad b { color: var(--bad); }
.seat-kpi.ok b { color: var(--ok); }
.seat-finds { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.seat-find { display: flex; gap: 10px; align-items: flex-start; border: 1px solid color-mix(in srgb, var(--sc) 40%, var(--stroke)); border-left: 3px solid var(--sc); border-radius: 10px; padding: 10px 12px; background: color-mix(in srgb, var(--sc) 5%, transparent); }
.seat-find-ic { color: var(--sc); flex: none; }
.seat-find-ic svg { width: 17px; height: 17px; }
.seat-find-b b { display: block; font-size: 13px; color: var(--navy-900); font-weight: 650; }
.seat-find-b span { font-size: 11.5px; color: var(--ink-3); }
.seat-clean { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ok); background: color-mix(in srgb, var(--ok) 8%, transparent); border-radius: 10px; padding: 12px 14px; margin-bottom: 14px; }
.seat-clean svg { width: 17px; height: 17px; flex: none; }
.seat-sub-t { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); font-weight: 700; margin-bottom: 8px; }
.seat-list { display: flex; flex-direction: column; gap: 2px; }
.seat-row { display: flex; align-items: center; gap: 9px; padding: 7px 4px; border-bottom: 1px solid var(--stroke-soft); font-size: 12.5px; }
.seat-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--stroke); flex: none; }
.seat-dot.on { background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 22%, transparent); }
.seat-who { font-weight: 650; color: var(--navy-900); }
.seat-meta { color: var(--ink-3); margin-left: 4px; }
.seat-ago { margin-left: auto; color: var(--ink-3); font-size: 11px; }
.seat-note { font-size: 11px; color: var(--ink-3); line-height: 1.5; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--stroke); }

/* ============ Калькулятор часовых поясов во встречах ============ */
.tz-hint { display: flex; align-items: center; gap: 10px; background: color-mix(in srgb, var(--accent) 6%, transparent); border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--stroke)); border-radius: 10px; padding: 9px 12px; margin: 2px 0 10px; }
.tz-hint > svg { width: 17px; height: 17px; color: var(--accent); flex: none; }
.tz-hint .tzh-b { display: flex; flex-direction: column; gap: 1px; font-size: 12.5px; color: var(--ink-2); }
.tz-hint .tzh-cl b { color: var(--navy-900); }
.tz-hint .tzh-cl i { font-style: normal; color: var(--accent); font-weight: 600; }
.tz-hint .tzh-you b { color: var(--navy-900); }
.tz-hint.warn { background: color-mix(in srgb, var(--bad) 7%, transparent); border-color: color-mix(in srgb, var(--bad) 30%, var(--stroke)); }
.tz-hint.warn > svg { color: var(--bad); }
.tz-hint .tzh-warn { margin-left: auto; font-size: 11px; font-weight: 700; color: var(--bad); text-align: right; }

/* ============ Новые виджеты обзора: часовые пояса / цель / горячие лиды ============ */
.ov2-wc-note { font-size: 11px; line-height: 1.5; color: var(--ink-3); margin: 2px 0 6px; }
.ov2-wc-row { display: flex; align-items: center; gap: 8px; padding: 8px 2px; border-bottom: 1px solid var(--stroke-soft); font-size: 13px; }
.ov2-wc-row:last-child { border-bottom: none; }
.ov2-wc-row.me { opacity: .72; }
.ov2-wc-row.me .ov2-wc-nm { font-weight: 700; }
.ov2-wc-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--ink-3); }
.ov2-wc-dot.good { background: #2FA98C; box-shadow: 0 0 0 3px color-mix(in srgb, #2FA98C 18%, transparent); }
.ov2-wc-dot.off { background: #B8860B; opacity: .55; }
.ov2-wc-nm { color: var(--navy-900); font-weight: 600; flex: 1; min-width: 0; }
.ov2-wc-row .ov2-wc-t { margin-left: auto; }
.ov2-wc-nm i { font-style: normal; color: var(--ink-3); font-size: 11px; font-weight: 500; margin-left: 4px; }
.ov2-wc-t { font-weight: 800; color: var(--navy-900); font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; gap: 4px; }
.ov2-wc-t.off { color: var(--ink-3); }
.ov2-wc-t svg { width: 13px; height: 13px; color: #B8860B; }
.ov2-goal { position: relative; width: 128px; height: 128px; margin: 6px auto 4px; }
.ov2-goal-ring { width: 100%; height: 100%; transform: rotate(-90deg); }
.ov2-goal-ring .gr-bg { fill: none; stroke: var(--stroke); stroke-width: 11; }
.ov2-goal-ring .gr-fg { fill: none; stroke: var(--accent); stroke-width: 11; stroke-linecap: round; transition: stroke-dashoffset .6s cubic-bezier(.4,0,.2,1); }
.ov2-goal-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.ov2-goal-c b { font-size: 32px; font-weight: 800; color: var(--navy-900); line-height: 1; }
.ov2-goal-c i { font-size: 12px; color: var(--ink-3); font-style: normal; margin-top: 2px; }
.ov2-goal-note { text-align: center; font-size: 12px; color: var(--ink-2); font-weight: 600; margin-top: 4px; }
.ov2-hot-score { font-size: 13px; font-weight: 800; color: var(--ink-3); background: var(--bg-2); border-radius: 8px; padding: 3px 9px; font-variant-numeric: tabular-nums; flex: none; }
.ov2-hot-score.mid { color: #B8860B; background: rgba(224,168,46,.13); }
.ov2-hot-score.hi { color: var(--bad); background: color-mix(in srgb, var(--bad) 12%, transparent); }


/* ============ База кейсов (академия) ============ */
.ov2-case { display: flex; align-items: center; gap: 10px; padding: 9px 4px; border-bottom: 1px solid var(--stroke-soft); cursor: pointer; border-radius: 8px; }
.ov2-case:hover { background: var(--bg-2); }
.ov2-case-b { min-width: 0; flex: 1; }
.ov2-case-n { font-size: 13px; font-weight: 650; color: var(--navy-900); display: flex; align-items: center; gap: 8px; }
.ov2-case-s { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ov2-oc { font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 20px; flex: none; text-transform: uppercase; letter-spacing: .03em; background: var(--bg-2); color: var(--ink-3); }
.ov2-oc.win { background: color-mix(in srgb, var(--ok) 14%, transparent); color: var(--ok); }
.ov2-oc.lose { background: color-mix(in srgb, var(--bad) 12%, transparent); color: var(--bad); }
.ov2-oc.wip { background: rgba(224,168,46,.16); color: #B8860B; }
.ov2-oc.lesson { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.case-verdict { font-size: 13.5px; line-height: 1.6; color: var(--ink); background: var(--bg-2); border-radius: 10px; padding: 13px 15px; }

/* ============ Видео разбора кейса ============ */
.case-vid { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--stroke); }
.case-vid-t, .case-tr-t { display: flex; align-items: center; gap: 7px; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); font-weight: 700; margin-bottom: 8px; }
.case-vid-t svg, .case-tr-t svg { width: 14px; height: 14px; color: var(--accent); }
.case-vplayer { width: 100%; border-radius: 10px; background: #000; max-height: 320px; margin-bottom: 8px; }
.case-vid-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.case-tr { margin-top: 12px; }
.case-tr-b { font-size: 12.5px; line-height: 1.6; color: var(--ink-2); background: var(--bg-2); border-radius: 10px; padding: 12px 14px; max-height: 200px; overflow-y: auto; }

/* ============ Форматы виджетов (реальные вариации вёрстки) ============ */
/* kpi: hero */
.ov2-kpi-hero { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; }
.ov2-kh-main { text-align: left; border: none; background: linear-gradient(155deg, color-mix(in srgb, var(--accent) 14%, var(--card)), var(--card)); border-radius: 14px; padding: 16px 18px; cursor: pointer; display: flex; flex-direction: column; gap: 2px; }
.ov2-kh-ic { width: 34px; height: 34px; border-radius: 10px; background: color-mix(in srgb, var(--accent) 16%, transparent); color: var(--accent); display: grid; place-items: center; margin-bottom: 6px; }
.ov2-kh-ic svg { width: 18px; height: 18px; }
.ov2-kh-v { font-size: 40px; font-weight: 800; color: var(--navy-900); line-height: 1; letter-spacing: -1px; }
.ov2-kh-k { font-size: 13px; font-weight: 650; color: var(--ink); margin-top: 4px; }
.ov2-kh-s { font-size: 11.5px; color: var(--ink-3); }
.ov2-kh-side { display: flex; flex-direction: column; gap: 8px; }
.ov2-kh-row { flex: 1; text-align: left; border: 1px solid var(--stroke); background: var(--card); border-radius: 12px; padding: 10px 12px; cursor: pointer; display: flex; flex-direction: column; justify-content: center; }
.ov2-kh-row:hover { border-color: var(--accent); }
.ov2-kh-rv { font-size: 21px; font-weight: 800; color: var(--navy-900); }
.ov2-kh-rk { font-size: 11px; color: var(--ink-3); }
/* kpi: list */
.ov2-kpi-list { display: flex; flex-direction: column; }
.ov2-kl-row { display: flex; align-items: center; gap: 11px; padding: 11px 6px; border-bottom: 1px solid var(--stroke-soft); background: none; border-left: none; border-right: none; border-top: none; cursor: pointer; text-align: left; width: 100%; }
.ov2-kl-row:hover { background: var(--bg-2); }
.ov2-kl-ic { width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); display: grid; place-items: center; flex: none; }
.ov2-kl-ic svg { width: 15px; height: 15px; }
.ov2-kl-k { flex: 1; font-size: 13px; font-weight: 650; color: var(--navy-900); }
.ov2-kl-k i { display: block; font-style: normal; font-size: 11px; color: var(--ink-3); font-weight: 400; }
.ov2-kl-v { font-size: 22px; font-weight: 800; color: var(--navy-900); font-variant-numeric: tabular-nums; }
/* funnel: steps */
.ov2-fsteps { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.ov2-fstep { position: relative; flex: 1; min-width: 76px; text-align: center; border: 1px solid var(--stroke); border-top: 3px solid var(--sc); border-radius: 12px; padding: 12px 6px 10px; background: var(--card); cursor: pointer; }
.ov2-fstep:hover { background: var(--bg-2); }
.ov2-fs-v { display: block; font-size: 24px; font-weight: 800; color: var(--navy-900); line-height: 1; }
.ov2-fs-n { display: block; font-size: 10.5px; color: var(--ink-3); margin-top: 4px; }
.ov2-fs-c { position: absolute; top: 6px; right: 7px; font-size: 9.5px; font-weight: 700; color: var(--ok); }
.ov2-fs-arr { color: var(--ink-3); font-size: 18px; flex: none; }
/* funnel: donut */
.ov2-donut { display: flex; align-items: center; gap: 18px; }
.ov2-donut-c { position: relative; width: 130px; height: 130px; flex: none; }
.ov2-donut-c svg { width: 100%; height: 100%; }
.ov2-donut-mid { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.ov2-donut-mid b { font-size: 28px; font-weight: 800; color: var(--navy-900); line-height: 1; }
.ov2-donut-mid i { font-size: 11px; color: var(--ink-3); font-style: normal; }
.ov2-donut-leg { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.ov2-dl-row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2); background: none; border: none; cursor: pointer; text-align: left; padding: 4px 2px; border-radius: 6px; }
.ov2-dl-row:hover { background: var(--bg-2); }
.ov2-dl-row i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.ov2-dl-row b { margin-left: auto; color: var(--navy-900); font-weight: 700; }
/* leaders: rank */
.ov2-lead-rank { display: flex; flex-direction: column; gap: 4px; }
.ov2-lrk-row { display: flex; align-items: center; gap: 10px; padding: 6px 4px; cursor: pointer; border-radius: 8px; }
.ov2-lrk-row:hover { background: var(--bg-2); }
.ov2-lrk-n { width: 22px; font-weight: 800; color: var(--ink-3); text-align: center; font-size: 13px; }
.ov2-lrk-n.top { color: var(--accent); }
.ov2-lrk-ava { width: 32px; height: 32px; border-radius: 50%; overflow: hidden; background: linear-gradient(150deg, var(--accent), var(--accent-2)); color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 700; flex: none; }
.ov2-lrk-ava img { width: 100%; height: 100%; object-fit: cover; }
.ov2-lrk-nm { flex: 1; font-size: 13px; font-weight: 600; color: var(--navy-900); position: relative; padding-bottom: 5px; }
.ov2-lrk-nm i { position: absolute; left: 0; bottom: 0; height: 3px; border-radius: 2px; background: var(--accent); opacity: .5; }
.ov2-lrk-row b { font-weight: 800; color: var(--navy-900); }
/* leaders: champion */
.ov2-champ { text-align: center; padding: 8px 0 4px; cursor: pointer; }
.ov2-champ-ava { position: relative; width: 92px; height: 92px; border-radius: 50%; margin: 0 auto 10px; overflow: hidden; background: linear-gradient(150deg, var(--accent), var(--accent-2)); color: #fff; display: grid; place-items: center; font-size: 30px; font-weight: 800; box-shadow: 0 12px 30px -10px color-mix(in srgb, var(--accent) 70%, transparent); }
.ov2-champ-ava img { width: 100%; height: 100%; object-fit: cover; }
.ov2-champ-crown { position: absolute; top: -2px; right: -2px; width: 30px; height: 30px; border-radius: 50%; background: #E0A82E; display: grid; place-items: center; border: 2px solid var(--card); }
.ov2-champ-crown svg { width: 15px; height: 15px; color: #fff; }
.ov2-champ-nm { font-size: 17px; font-weight: 750; color: var(--navy-900); }
.ov2-champ-v { font-size: 30px; font-weight: 800; color: var(--accent); margin-top: 4px; line-height: 1; }
.ov2-champ-v i { display: block; font-size: 11.5px; color: var(--ink-3); font-style: normal; font-weight: 500; margin-top: 3px; }
.ov2-champ-next { font-size: 11.5px; color: var(--ink-3); margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--stroke-soft); }
/* goal: bar / stat */
.ov2-goalbar { padding: 8px 0 2px; }
.ov2-gb-top { display: flex; align-items: baseline; gap: 8px; margin-bottom: 8px; }
.ov2-gb-top b { font-size: 30px; font-weight: 800; color: var(--navy-900); line-height: 1; }
.ov2-gb-top span { font-size: 12.5px; color: var(--ink-3); }
.ov2-gb-track { height: 12px; border-radius: 8px; background: var(--bg-2); overflow: hidden; }
.ov2-gb-track i { display: block; height: 100%; border-radius: 8px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
.ov2-goalstat { text-align: center; padding: 12px 0 6px; }
.ov2-gs-big { font-size: 46px; font-weight: 800; color: var(--navy-900); line-height: 1; }
.ov2-gs-big span { font-size: 22px; color: var(--ink-3); font-weight: 700; }
.ov2-gs-pct { font-size: 13px; font-weight: 700; color: var(--accent); margin-top: 6px; }
.ov2-gs-pct.done { color: var(--ok); }
/* hotleads: cards */
.ov2-hotcards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ov2-hc { border: 1px solid var(--stroke); border-radius: 12px; padding: 12px 8px; text-align: center; cursor: pointer; background: var(--card); }
.ov2-hc:hover { border-color: var(--accent); }
.ov2-hc-ring { position: relative; width: 48px; height: 48px; margin: 0 auto 6px; }
.ov2-hc-ring svg { width: 100%; height: 100%; }
.ov2-hc-ring .hc-bg { fill: none; stroke: var(--stroke); stroke-width: 4; }
.ov2-hc-ring .hc-fg { fill: none; stroke: var(--ink-3); stroke-width: 4; stroke-linecap: round; }
.ov2-hc-ring.mid .hc-fg { stroke: #D9982B; } .ov2-hc-ring.hi .hc-fg { stroke: var(--bad); }
.ov2-hc-ring b { position: absolute; inset: 0; display: grid; place-items: center; font-size: 14px; font-weight: 800; color: var(--navy-900); }
.ov2-hc-nm { font-size: 12.5px; font-weight: 650; color: var(--navy-900); }
.ov2-hc-s { font-size: 10.5px; color: var(--ink-3); }
/* окно «Оформление виджета» */
.ws-sec { margin-bottom: 16px; }
.ws-t { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); font-weight: 700; margin-bottom: 8px; }
.ws-vars { display: flex; flex-wrap: wrap; gap: 7px; }
.ws-var, .ws-skin { border: 1.5px solid var(--stroke); background: var(--card); border-radius: 20px; padding: 6px 14px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; font-family: inherit; }
.ws-var.on, .ws-skin.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.ws-pals { display: flex; gap: 10px; }
.ws-pal { width: 34px; height: 34px; border-radius: 50%; border: 2px solid transparent; background: none; cursor: pointer; padding: 3px; }
.ws-pal i { display: block; width: 100%; height: 100%; border-radius: 50%; background: linear-gradient(140deg, var(--p1), var(--p2)); }
.ws-pal.on { border-color: var(--p1); }
/* галерея паков */
.ov2-packs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ov2-pack { border: 1.5px solid var(--stroke); border-radius: 14px; padding: 12px; cursor: pointer; background: var(--card); text-align: left; font-family: inherit; }
.ov2-pack:hover { border-color: var(--accent); box-shadow: 0 10px 26px -14px color-mix(in srgb, var(--accent) 60%, transparent); transform: translateY(-2px); }
.ov2-pack-prev { border-radius: 10px; padding: 10px; margin-bottom: 11px; height: 96px; overflow: hidden; background: var(--bg-2); }
/* ── реалистичные мини-мокапы паков (по превью видно разницу) ── */
.opv { height: 100%; display: flex; gap: 6px; }
.opv .opv-col { display: flex; flex-direction: column; gap: 6px; flex: 1; }
.opv .opv-col2 { display: flex; flex-direction: column; gap: 6px; flex: 1.4; }
/* focus: одна крупная цифра + спарклайн, два тонких блока — воздушно */
.pk-focus .ov2-pack-prev { background: linear-gradient(160deg, #EEF3FF, #F7F9FE); }
.opv-focus .opv-big { flex: 1.6; background: #fff; border: 1px solid #DCE6FB; border-radius: 8px; padding: 9px 10px; display: flex; flex-direction: column; justify-content: center; color: var(--accent); box-shadow: 0 4px 12px -8px color-mix(in srgb, var(--accent) 50%, transparent); }
.opv-n { font-size: 26px; font-weight: 800; color: #16223B; letter-spacing: -1px; line-height: 1; font-variant-numeric: tabular-nums; }
.opv-n.light { color: #fff; }
.opv-spk { width: 100%; height: 16px; margin-top: 4px; color: var(--accent); }
.opv-focus .opv-s { flex: 1; background: #fff; border: 1px solid #DCE6FB; border-radius: 8px; }
/* command: чемпион + ступени + плотная сетка — насыщенно */
.pk-command .ov2-pack-prev { background: linear-gradient(160deg, #EAF1FF, #F4F1FF); }
.opv-champ { flex: .8; background: #fff; border: 1px solid #D9E2F7; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; }
.opv-av { width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(150deg, var(--accent), var(--accent-3)); }
.opv-avl { width: 60%; height: 5px; border-radius: 3px; background: #D9E2F7; }
.opv-steps { flex: 1.1; display: flex; align-items: flex-end; gap: 4px; background: #fff; border: 1px solid #D9E2F7; border-radius: 8px; padding: 8px; }
.opv-steps i { flex: 1; background: linear-gradient(180deg, var(--accent-2), var(--accent)); border-radius: 3px 3px 0 0; }
.opv-grid4 { flex: .9; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 4px; }
.opv-grid4 span { background: #fff; border: 1px solid #D9E2F7; border-radius: 6px; }
/* data: донат + спарклайн + бары — графики */
.pk-data .ov2-pack-prev { background: linear-gradient(160deg, #E9F7F1, #EAF2FF); }
.opv-dcell { background: #fff; border: 1px solid #CFE8DE; border-radius: 8px; display: grid; place-items: center; color: #0E9E6A; padding: 6px; }
.opv-data .opv-dcell:first-child { flex: 1; }
.opv-donut { width: 40px; height: 40px; }
.opv-dcell.tall { flex: 1; color: var(--accent); }
.opv-dcell.tall .opv-spk { height: 22px; }
.opv-bars { background: #fff; border: 1px solid #CFE8DE; border-radius: 8px; padding: 7px 8px; display: flex; flex-direction: column; gap: 4px; justify-content: center; }
.opv-bars i { height: 5px; border-radius: 3px; background: linear-gradient(90deg, #17A06B, #0E9E6A); }
/* premium: тёмные карточки со свечением */
.pk-premium .ov2-pack-prev { background: linear-gradient(160deg, #0A1730, #12132a); }
.opv-dark { position: relative; overflow: hidden; background: rgba(255,255,255,.05); border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent); border-radius: 8px; }
.opv-dark.big { flex: 1.5; display: flex; align-items: center; padding: 0 12px; }
.opv-dark.sm { flex: 1; }
.opv-glow { position: absolute; top: -20px; right: -10px; width: 60px; height: 60px; border-radius: 50%; background: radial-gradient(circle, rgba(79,125,255,.55), transparent 70%); filter: blur(6px); }
/* content: карточка идеи + список */
.pk-content .ov2-pack-prev { background: linear-gradient(160deg, #F3EEFF, #F7F5FE); }
.opv-idea { flex: 1.3; background: #fff; border: 1px solid #E2D9F7; border-left: 3px solid #7C3AED; border-radius: 8px; padding: 9px; display: flex; flex-direction: column; gap: 5px; }
.opv-tag { width: 34%; height: 9px; border-radius: 5px; background: #EDE4FC; }
.opv-line { height: 6px; border-radius: 4px; background: #E7ECF6; }
.opv-line.w2 { width: 80%; } .opv-line.w3 { width: 55%; }
.opv-row { flex: 1; background: #fff; border: 1px solid #E2D9F7; border-radius: 6px; }
.ov2-pack-b b { font-size: 14px; font-weight: 750; color: var(--navy-900); display: block; }
.ov2-pack-b span { font-size: 12px; color: var(--ink-3); }
.ov2-pack-b i { font-size: 11px; color: var(--accent); font-style: normal; font-weight: 600; display: block; margin-top: 4px; }
@media (max-width: 560px) { .ov2-packs, .ov2-hotcards { grid-template-columns: 1fr; } .ov2-kpi-hero { grid-template-columns: 1fr; } }

/* ============ ПРЕМИУМ-ФОРМАТЫ ВИДЖЕТОВ (тренды дашбордов) ============ */
.cup { font-variant-numeric: tabular-nums; }
.ov-spark { width: 100%; height: 100%; display: block; }
.ov-delta { display: inline-flex; align-items: center; gap: 2px; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 20px; }
.ov-delta.up { color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.ov-delta.down { color: var(--bad); background: color-mix(in srgb, var(--bad) 12%, transparent); }
.ov-delta.flat { color: var(--ink-3); background: var(--bg-2); }
/* KPI · Бенто */
.kpi-bento { display: grid; grid-template-columns: 1.5fr 1fr; gap: 12px; }
.kbn-hero { position: relative; overflow: hidden; text-align: left; border: 1px solid color-mix(in srgb, var(--accent) 22%, var(--stroke)); border-radius: 20px; padding: 18px 20px; cursor: pointer; display: flex; flex-direction: column; background:
  radial-gradient(120% 80% at 100% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 60%),
  linear-gradient(160deg, color-mix(in srgb, var(--accent) 8%, var(--card)), var(--card)); }
.kbn-hero-glow { position: absolute; top: -40%; right: -20%; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 30%, transparent), transparent 70%); filter: blur(20px); pointer-events: none; }
.kbn-ic { position: relative; width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(140deg, var(--accent), var(--accent-2)); color: #fff; display: grid; place-items: center; box-shadow: 0 8px 20px -8px var(--accent); }
.kbn-ic svg { width: 19px; height: 19px; }
.kbn-lbl { position: relative; font-size: 12.5px; font-weight: 600; color: var(--ink-2); margin-top: 12px; }
.kbn-num { position: relative; font-size: 44px; font-weight: 800; color: var(--navy-900); line-height: 1; letter-spacing: -2px; font-variant-numeric: tabular-nums; }
.kbn-sub { position: relative; font-size: 11.5px; color: var(--ink-3); margin-top: 6px; display: flex; align-items: center; gap: 6px; }
.kbn-spark { position: absolute; left: 0; right: 0; bottom: 0; height: 40px; opacity: .8; }
.kbn-side { display: grid; grid-template-rows: 1fr 1fr 1fr; gap: 10px; }
.kbn-cell { text-align: left; border: 1px solid var(--stroke); border-radius: 14px; padding: 10px 13px; cursor: pointer; background: var(--card); display: flex; flex-direction: column; justify-content: center; transition: border-color .15s, transform .15s; }
.kbn-cell:hover { border-color: var(--accent); transform: translateX(2px); }
.kbn-c-ic { color: var(--accent); } .kbn-c-ic svg { width: 15px; height: 15px; }
.kbn-c-num { font-size: 24px; font-weight: 800; color: var(--navy-900); line-height: 1.1; }
.kbn-c-lbl { font-size: 11px; color: var(--ink-3); }
/* KPI · Тренд */
.kpi-trend { display: grid; grid-template-columns: 1.6fr 1fr; gap: 12px; }
.kt-hero { text-align: left; border: 1px solid var(--stroke); border-radius: 18px; padding: 16px 18px 8px; cursor: pointer; background: linear-gradient(160deg, color-mix(in srgb, var(--accent) 6%, var(--card)), var(--card)); display: flex; flex-direction: column; }
.kt-hero-hd { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.kt-lbl { font-size: 12px; color: var(--ink-3); font-weight: 600; flex: 1 0 100%; }
.kt-big { font-size: 34px; font-weight: 800; color: var(--navy-900); letter-spacing: -1px; line-height: 1; }
.kt-big i { font-size: 12px; color: var(--ink-3); font-style: normal; font-weight: 500; margin-left: 6px; }
.kt-spark { height: 56px; margin-top: 8px; }
.kt-rows { display: grid; grid-template-rows: repeat(3, 1fr); gap: 8px; }
.kt-row { display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--stroke); border-radius: 12px; padding: 8px 13px; cursor: pointer; background: var(--card); }
.kt-row:hover { border-color: var(--accent); }
.kt-r-k { font-size: 12px; color: var(--ink-2); }
.kt-r-v { font-size: 21px; font-weight: 800; color: var(--navy-900); }
/* KPI · Крупно (editorial) */
.kpi-ed { display: grid; grid-template-columns: repeat(4, 1fr); }
.ked { text-align: left; background: none; border: none; border-right: 1px solid var(--stroke-soft); padding: 6px 18px 6px 0; cursor: pointer; }
.ked:last-child { border-right: none; }
.ked-num { display: block; font-size: 50px; font-weight: 800; color: var(--navy-900); line-height: .95; letter-spacing: -2.5px; font-variant-numeric: tabular-nums; }
.ked:hover .ked-num { color: var(--accent); }
.ked-k { display: block; font-size: 12px; color: var(--ink-3); margin-top: 8px; font-weight: 600; }
/* Воронка · Лента */
.ov2-ribbon { padding: 4px 0; }
.ov2-rib-bar { display: flex; height: 26px; border-radius: 8px; overflow: hidden; gap: 2px; }
.ov2-rib-seg { cursor: pointer; transition: opacity .15s; min-width: 3px; }
.ov2-rib-seg:hover { opacity: .82; }
.ov2-rib-leg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; margin-top: 14px; }
.ov2-rib-l { display: flex; align-items: center; gap: 8px; background: none; border: none; cursor: pointer; text-align: left; font-size: 12.5px; padding: 3px 2px; border-radius: 6px; }
.ov2-rib-l:hover { background: var(--bg-2); }
.ov2-rib-l i { width: 9px; height: 9px; border-radius: 3px; flex: none; }
.ov2-rib-l span { color: var(--ink-2); flex: 1; }
.ov2-rib-l b { color: var(--navy-900); font-weight: 700; }
.ov2-rib-l em { font-style: normal; color: var(--ok); font-size: 10.5px; font-weight: 700; }
/* Цель · Спидометр (gauge) */
.ov2-gauge-wrap { position: relative; text-align: center; padding: 6px 0 2px; }
.ov-gauge { width: 180px; max-width: 100%; height: auto; margin: 0 auto; display: block; }
.ov2-gauge-c { margin-top: -18px; }
.ov2-gauge-c b { font-size: 34px; font-weight: 800; color: var(--navy-900); line-height: 1; }
.ov2-gauge-c i { display: block; font-size: 11px; color: var(--ink-3); font-style: normal; }
.ov2-gauge-pct { font-size: 12px; font-weight: 700; color: var(--accent); margin-top: 4px; }
/* Лидеры · Чемпион (spotlight) */
.ov2-spot { position: relative; overflow: hidden; text-align: center; padding: 14px 8px 10px; cursor: pointer; border-radius: 14px; background: linear-gradient(165deg, color-mix(in srgb, var(--accent) 7%, var(--card)), var(--card)); }
.ov2-spot-glow { position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 220px; height: 160px; background: radial-gradient(circle, color-mix(in srgb, var(--accent) 26%, transparent), transparent 70%); filter: blur(24px); pointer-events: none; }
.ov2-spot-ava { position: relative; width: 84px; height: 84px; border-radius: 50%; margin: 0 auto 10px; overflow: hidden; background: linear-gradient(150deg, var(--accent), var(--accent-2)); color: #fff; display: grid; place-items: center; font-size: 28px; font-weight: 800; box-shadow: 0 14px 34px -10px color-mix(in srgb, var(--accent) 75%, transparent); border: 3px solid var(--card); }
.ov2-spot-ava img { width: 100%; height: 100%; object-fit: cover; }
.ov2-spot-crown { position: absolute; top: -3px; right: 50%; transform: translateX(42px); width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(140deg, #F5C451, #E0A82E); display: grid; place-items: center; border: 2px solid var(--card); }
.ov2-spot-crown svg { width: 15px; height: 15px; color: #fff; }
.ov2-spot-nm { position: relative; font-size: 17px; font-weight: 750; color: var(--navy-900); }
.ov2-spot-v { position: relative; font-size: 30px; font-weight: 800; color: var(--accent); margin-top: 2px; line-height: 1; }
.ov2-spot-v i { display: block; font-size: 11px; color: var(--ink-3); font-style: normal; font-weight: 500; margin-top: 4px; }
.ov2-spot-run { position: relative; display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 12px; }
.ov2-spot-chip { font-size: 11px; font-weight: 600; color: var(--ink-2); background: var(--bg-2); border-radius: 20px; padding: 4px 11px; }
@media (max-width: 620px) { .kpi-bento, .kpi-trend { grid-template-columns: 1fr; } .kpi-ed { grid-template-columns: 1fr 1fr; gap: 14px 0; } }

/* ============ Первое касание: компоновка + эмулятор телефона ============ */
/* первое касание — стек: чипы сверху, потом compose + компактный телефон (переносится вниз на узком) */
.lc-ft-grid { display: flex; flex-wrap: wrap; gap: 18px; align-items: flex-start; }
.lc-ft-compose { flex: 1 1 300px; min-width: 0; }
/* минимальное превью «как увидит клиент» — компактная карточка чата без громоздкого iPhone */
.lc-ft-preview { flex: 0 1 236px; min-width: 200px; align-self: flex-start; border: 1px solid var(--stroke); border-radius: 16px; overflow: hidden; background: var(--card); box-shadow: 0 6px 18px -10px rgba(16,43,92,.16); }
.lc-fp-head { display: flex; align-items: center; gap: 9px; padding: 9px 12px; background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 5%, var(--card)), var(--card)); border-bottom: 1px solid var(--stroke-soft); }
.lc-fp-ava { width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(150deg, var(--accent), var(--accent-2)); color: #fff; display: grid; place-items: center; font-size: 12px; font-weight: 700; overflow: hidden; flex: none; }
.lc-fp-ava img { width: 100%; height: 100%; object-fit: cover; }
.lc-fp-who b { font-size: 13px; color: var(--navy-900); display: block; line-height: 1.15; }
.lc-fp-who i { font-size: 10.5px; color: var(--ink-3); font-style: normal; display: inline-flex; align-items: center; gap: 4px; }
.lc-fp-who i svg { width: 11px; height: 11px; }
.lc-fp-body { padding: 12px 11px; min-height: 84px; max-height: 300px; overflow-y: auto; background:
    radial-gradient(circle at 12px 12px, rgba(0,0,0,.018) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(180deg, #EDE7DF, #E9E2D8); }
html[data-night] .lc-fp-body { background: #0e1626; }
/* креатив-дропзона (кликабельный label) */
.lc-creo2 { display: block; position: relative; border: 1.5px dashed var(--stroke); border-radius: 12px; min-height: 60px; cursor: pointer; overflow: hidden; margin-bottom: 10px; transition: border-color .15s, background .15s; }
.lc-creo2:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 5%, transparent); }
.lc-creo2.has { border-style: solid; border-color: var(--stroke); }
.lc-creo2 img { width: 100%; max-height: 150px; object-fit: cover; display: block; }
.lc-creo2-ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; padding: 15px; color: var(--ink-3); text-align: center; }
.lc-creo2-ph svg { width: 20px; height: 20px; margin-bottom: 3px; color: var(--accent); }
.lc-creo2-ph b { font-size: 12.5px; color: var(--ink-2); font-weight: 650; }
.lc-creo2-ph i { font-size: 11px; font-style: normal; }
.lc-creo2-badge { position: absolute; top: 8px; right: 8px; background: rgba(0,0,0,.58); color: #fff; border-radius: 8px; padding: 3px 9px; font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; backdrop-filter: blur(4px); }
.lc-creo2-badge svg { width: 12px; height: 12px; }
/* comfortable textarea + buttons */
.lc-ft-ta { width: 100%; min-height: 104px; border: 1px solid var(--stroke); border-radius: 12px; padding: 12px 14px; font-size: 14px; line-height: 1.55; font-family: inherit; color: var(--ink); resize: vertical; outline: none; background: var(--card, #fff); transition: border-color .15s; }
.lc-ft-ta:focus { border-color: var(--accent); }
.lc-ft-btns { display: flex; gap: 8px; margin-top: 10px; }
.lc-ft-btns .btn { flex: 1; justify-content: center; }
.wa-img { display: block; width: 100%; max-width: 150px; border-radius: 8px; margin-bottom: 4px; }
.wa-ph { font-size: 11.5px; color: #7a8aa0; text-align: center; padding: 22px 14px; line-height: 1.5; }
/* чипы персонализации */
.lc-ft-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 10px; }
.lc-ftc-t { font-size: 11px; font-weight: 700; color: var(--ink-3); text-transform: uppercase; letter-spacing: .05em; }
.lc-ftc { font-size: 11.5px; font-weight: 600; color: var(--navy-900); background: color-mix(in srgb, var(--accent) 8%, var(--bg-2)); border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--stroke)); border-radius: 20px; padding: 3px 10px; display: inline-flex; align-items: center; gap: 5px; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lc-ftc i { font-style: normal; color: var(--accent); font-size: 10px; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.lc-ftc.muted { color: var(--ink-3); background: var(--bg-2); border-style: dashed; }
.lc-ftc.muted svg { width: 13px; height: 13px; }
/* вариант B */
.lc-ft-varb { margin-top: 10px; border: 1px solid var(--stroke); border-radius: 12px; padding: 11px 13px; background: var(--bg-2); }
.lc-ftvb-t { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); margin-bottom: 6px; }
.lc-ftvb-t svg { width: 13px; height: 13px; color: var(--accent); }
.lc-ftvb-t i { font-style: normal; text-transform: none; letter-spacing: 0; color: var(--accent); }
.lc-ftvb-x { font-size: 13px; line-height: 1.5; color: var(--ink); margin-bottom: 9px; }
@media (max-width: 700px) { .lc-ft2 { grid-template-columns: 1fr; } .lc-ft-phone { order: -1; } .lc-ft-phone .iph-sm { width: 210px; } }

/* ============ Премиум-выполнение задачи (галочка + разлёт частиц) ============ */
.tk-check.on { background: linear-gradient(140deg, #17A06B, #0E7A52); border-color: #0E7A52; color: #fff; box-shadow: 0 4px 12px -3px rgba(14,122,82,.5); }
.tk-check.on svg { animation: tkDraw .34s cubic-bezier(.4,0,.2,1) .04s both; }
@keyframes tkDraw { from { opacity: .2; transform: scale(.4); } to { opacity: 1; transform: scale(1); } }
.tk-check.tk-pop { animation: tkPop .44s cubic-bezier(.34,1.56,.64,1); }
@keyframes tkPop { 0% { transform: scale(1); } 45% { transform: scale(1.28); } 100% { transform: scale(1); } }
/* строка «уезжает» после выполнения (обзор) */
.ov2-task.tk-cleared { animation: tkClear .5s cubic-bezier(.4,0,.2,1) forwards; }
@keyframes tkClear { to { opacity: 0; transform: translateX(14px); } }
/* разлёт частиц (в body, fixed — переживает перерисовку) */
.tk-burst { position: fixed; z-index: 9999; width: 0; height: 0; pointer-events: none; }
.tk-burst::before { content: ''; position: absolute; left: 0; top: 0; width: 22px; height: 22px; border-radius: 50%; border: 2px solid #17A06B; transform: translate(-50%, -50%); animation: tkRipple .5s ease-out forwards; }
@keyframes tkRipple { 0% { opacity: .75; transform: translate(-50%,-50%) scale(.5); } 100% { opacity: 0; transform: translate(-50%,-50%) scale(2.6); } }
.tk-burst i { position: absolute; left: 0; top: 0; width: 6px; height: 6px; border-radius: 50%; transform: translate(-50%,-50%); animation: tkFly .62s cubic-bezier(.2,.7,.3,1) forwards; }
@keyframes tkFly { 0% { opacity: 1; transform: translate(-50%,-50%) scale(1); } 100% { opacity: 0; transform: translate(calc(-50% + var(--tx)), calc(-50% + var(--ty))) scale(.2); } }
@media (prefers-reduced-motion: reduce) { .tk-burst, .tk-check.tk-pop, .ov2-task.tk-cleared { animation: none !important; } }

/* ============ Тёмные/градиентные скины виджетов (токен-оверрайды → текст сам светлеет) ============ */
.ov-w.ov-skin-dark .ov-w-body,
.ov-w.ov-skin-midnight .ov-w-body {
  --navy-900: #EAF1FF; --ink: #E2E9F8; --ink-2: #B6C5E8; --ink-3: #8698C0;
  --stroke: color-mix(in srgb, var(--accent) 20%, transparent); --stroke-soft: color-mix(in srgb, var(--accent) 11%, transparent);
  --bg-2: rgba(255,255,255,.06); --card: rgba(255,255,255,.05);
  color: #E2E9F8; border: 1px solid color-mix(in srgb, var(--accent) 16%, transparent);
}
.ov-w.ov-skin-dark .ov-w-body { background: linear-gradient(160deg, #12274F, #0B1730 62%, #0A1428); box-shadow: 0 16px 40px -20px rgba(6,17,38,.6); }
.ov-w.ov-skin-midnight .ov-w-body { background: radial-gradient(130% 90% at 100% 0%, color-mix(in srgb, var(--accent) 30%, transparent), transparent 55%), linear-gradient(160deg, #0B1224, #06080F); box-shadow: 0 16px 40px -20px rgba(0,0,0,.6); }
.ov-w.ov-skin-gradient .ov-w-body {
  --navy-900: #fff; --ink: rgba(255,255,255,.95); --ink-2: rgba(255,255,255,.84); --ink-3: rgba(255,255,255,.68);
  --stroke: rgba(255,255,255,.26); --stroke-soft: rgba(255,255,255,.16);
  --bg-2: rgba(255,255,255,.14); --card: rgba(255,255,255,.13);
  color: #fff; border: none;
  background: linear-gradient(145deg, var(--accent), var(--accent-2));
  box-shadow: 0 16px 40px -18px color-mix(in srgb, var(--accent) 70%, transparent);
}
/* на тёмном/градиентном фоне заголовок-иконка и акцентные детали остаются яркими */
.ov-w.ov-skin-gradient .ov2-card-hd svg { color: #fff; }
.ov-w.ov-skin-gradient .ov2-kpi-ic, .ov-w.ov-skin-gradient .kbn-ic { background: rgba(255,255,255,.18); color: #fff; box-shadow: none; }
.ov-w.ov-skin-dark .kbn-hero, .ov-w.ov-skin-midnight .kbn-hero { background: rgba(255,255,255,.04); border-color: color-mix(in srgb, var(--accent) 18%, transparent); }
/* видео-скин: тёмный вариант скрима, если поверх тёмной темы — оставляем как есть (белый скрим), текст тёмный */

/* превью пака «Студия»: светлый фон + градиентная плитка + тёмная акцент-плитка */
.pk-studio .ov2-pack-prev { background: linear-gradient(160deg, #EEF2FF, #F6F4FE); }
.opv-studio .opv-grad { flex: 1.5; border-radius: 8px; background: linear-gradient(140deg, var(--accent), var(--accent-3)); padding: 9px 11px; display: flex; flex-direction: column; justify-content: center; color: #fff; position: relative; overflow: hidden; box-shadow: 0 6px 16px -8px color-mix(in srgb, var(--accent) 60%, transparent); }
.opv-studio .opv-grad .opv-spk { color: rgba(255,255,255,.9); }
.opv-studio .opv-s { flex: 1; background: #fff; border: 1px solid #DCE6FB; border-radius: 8px; }
.opv-glow.light { background: radial-gradient(circle, rgba(255,255,255,.5), transparent 70%); }

/* ============ KPI «График» (графика вперёд, минимум цифр) ============ */
.ov-area { width: 100%; height: 100%; display: block; }
.kpi-chart { display: flex; flex-direction: column; gap: 13px; }
.kc-top { display: grid; grid-template-columns: minmax(120px, auto) 1fr; gap: 18px; align-items: center; }
.kc-lbl { font-size: 12px; color: var(--ink-3); font-weight: 600; }
.kc-num { display: block; font-size: 42px; font-weight: 800; color: var(--navy-900); line-height: 1; letter-spacing: -1.5px; margin: 5px 0 3px; font-variant-numeric: tabular-nums; display: flex; align-items: baseline; gap: 8px; }
.kc-num em { font-style: normal; }
.kc-sub { font-size: 11.5px; color: var(--ink-3); }
.kc-area { height: 96px; min-width: 0; cursor: pointer; }
.kc-chips { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.kc-chip { display: flex; align-items: center; gap: 9px; border: 1px solid var(--stroke); border-radius: 13px; padding: 9px 12px; background: var(--card); cursor: pointer; text-align: left; transition: border-color .15s, transform .15s; }
.kc-chip:hover { border-color: var(--accent); transform: translateY(-1px); }
.kc-chip-ic { width: 30px; height: 30px; border-radius: 9px; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); display: grid; place-items: center; flex: none; }
.kc-chip-ic svg { width: 15px; height: 15px; }
.kc-chip-b b { font-size: 19px; font-weight: 800; color: var(--navy-900); display: block; line-height: 1; font-variant-numeric: tabular-nums; }
.kc-chip-b i { font-size: 10.5px; color: var(--ink-3); font-style: normal; }
@media (max-width: 560px) { .kc-top { grid-template-columns: 1fr; } .kc-chips { grid-template-columns: 1fr; } }
/* глубокий, гармоничный градиент-скин (был неоново-синий, конфликтовал с тёмными) */
.ov-w.ov-skin-gradient .ov-w-body { background: linear-gradient(150deg, #1E3A8A 0%, #3B2E7E 55%, #4C2A6E 100%); box-shadow: 0 16px 40px -18px rgba(30,58,138,.55); }
/* ============ Обновлённые мини-мокапы паков (графика вперёд) ============ */
.pk-focus .ov2-pack-prev, .pk-command .ov2-pack-prev, .pk-content .ov2-pack-prev { background: linear-gradient(160deg, #EEF3FF, #F7F9FE); }
.pk-data .ov2-pack-prev { background: linear-gradient(160deg, #E9F7F1, #EAF2FF); }
.pk-studio .ov2-pack-prev { background: linear-gradient(160deg, #EEF2FF, #F6F4FE); }
.pk-mix .ov2-pack-prev { background: linear-gradient(160deg, #E7ECFB, #EEE9FA); }
.opv-chart { flex: 1.5; background: #fff; border: 1px solid #DCE6FB; border-radius: 8px; padding: 8px 10px; display: flex; flex-direction: column; justify-content: space-between; color: var(--accent); box-shadow: 0 4px 12px -8px color-mix(in srgb, var(--accent) 45%, transparent); overflow: hidden; }
.opv-chart.wide { flex: 1.9; }
.opv-chart.flat { flex: none; height: 42px; padding: 6px 9px; }
.opv-chart.dark { background: linear-gradient(155deg, #12274F, #0B1730); border-color: color-mix(in srgb, var(--accent) 20%, transparent); color: #6FA0FF; }
.opv-chart.grad { background: linear-gradient(150deg, #1E3A8A, #4C2A6E); border: none; color: rgba(255,255,255,.85); }
.opv-area { width: 100%; height: 26px; margin-top: 4px; }
.opv-chart .opv-n { color: #16223B; }
.opv-chart.dark .opv-n, .opv-chart.grad .opv-n { color: #fff; }
.opv-gaug { width: 40px; height: 24px; color: #7C3AED; }
.opv-gaug-w { color: var(--blue-300); display: block; }
.opv-dcell.mini { flex: none; height: 34px; }
.opv-command .opv-champ { flex: none; height: 46px; }

/* ============ Живые (CSS-анимация) и видео-фоны виджетов ============ */
/* общий скрим-элемент видео + все видео-скины (скайлайн/золото/сияние) */
.ov-w[class*="ov-skin-vid"] .ov-w-body { position: relative; overflow: hidden; }
.ov-w[class*="ov-skin-vid"] .ov-skin-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .22; z-index: 0; pointer-events: none; }
.ov-w[class*="ov-skin-vid"] .ov-w-body::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.ov-w[class*="ov-skin-vid"] .ov-w-body > *:not(.ov-skin-vid) { position: relative; z-index: 2; }
/* золото/сияние — тёмная база, светлый текст (токен-оверрайды), тёмный скрим */
.ov-w.ov-skin-vidgold .ov-w-body, .ov-w.ov-skin-vidaurora .ov-w-body, .ov-w.ov-skin-aurora .ov-w-body, .ov-w.ov-skin-silk .ov-w-body {
  --navy-900: #F1F4FF; --ink: #E6ECFA; --ink-2: #C2CFEC; --ink-3: #93A4CC;
  --stroke: rgba(255,255,255,.16); --stroke-soft: rgba(255,255,255,.09); --bg-2: rgba(255,255,255,.07); --card: rgba(255,255,255,.06);
  color: #E6ECFA; border: 1px solid rgba(255,255,255,.12);
}
.ov-w.ov-skin-vidgold .ov-w-body::after { background: linear-gradient(160deg, rgba(20,14,4,.62), rgba(10,8,4,.82)); }
.ov-w.ov-skin-vidaurora .ov-w-body::after { background: linear-gradient(160deg, rgba(8,14,34,.58), rgba(5,8,20,.82)); }
.ov-w.ov-skin-video .ov-w-body { --navy-900: #F1F4FF; --ink: #E6ECFA; --ink-2: #C2CFEC; --ink-3: #93A4CC; --stroke: rgba(255,255,255,.16); --stroke-soft: rgba(255,255,255,.09); --bg-2: rgba(255,255,255,.07); --card: rgba(255,255,255,.06); color: #E6ECFA; border: 1px solid rgba(255,255,255,.12); }
.ov-w.ov-skin-video .ov-w-body::after { background: linear-gradient(160deg, rgba(6,17,38,.55), rgba(4,8,20,.8)); }
/* АВРОРА — живой тёмный кобальт-градиент, плавно перетекает */
.ov-w.ov-skin-aurora .ov-w-body { background: linear-gradient(125deg, #08122A, #12274F 30%, #24306E 55%, #142a52 78%, #08122A); background-size: 320% 320%; animation: ovFlow 20s ease-in-out infinite; box-shadow: 0 16px 40px -20px rgba(6,17,38,.6); }
/* ШЁЛК — тёплый золото-угольный поток */
.ov-w.ov-skin-silk .ov-w-body { background: linear-gradient(125deg, #14100A, #33240D 30%, #5A3E12 52%, #2c1f0b 76%, #14100A); background-size: 320% 320%; animation: ovFlow 24s ease-in-out infinite; box-shadow: 0 16px 40px -20px rgba(0,0,0,.6); }
/* МЕШ — светлый мягкий мультиградиент, дышит (тёмный текст) */
.ov-w.ov-skin-mesh .ov-w-body { background:
    radial-gradient(60% 60% at 18% 22%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 60%),
    radial-gradient(55% 55% at 82% 26%, rgba(124,58,237,.14), transparent 60%),
    radial-gradient(60% 60% at 62% 92%, rgba(15,158,106,.12), transparent 60%),
    var(--card); background-size: 200% 200%; animation: ovMesh 26s ease-in-out infinite; }
@keyframes ovFlow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
@keyframes ovMesh { 0% { background-position: 0% 0%; } 50% { background-position: 100% 100%; } 100% { background-position: 0% 0%; } }
@media (prefers-reduced-motion: reduce) { .ov-w.ov-skin-aurora .ov-w-body, .ov-w.ov-skin-silk .ov-w-body, .ov-w.ov-skin-mesh .ov-w-body { animation: none; } }
/* группы в пикере фонов */
.ws-grp { margin-bottom: 9px; }
.ws-grp-t { font-size: 10px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); font-weight: 600; display: block; margin-bottom: 5px; opacity: .8; }
.ws-skin.sk-video, .ws-skin.sk-vidgold, .ws-skin.sk-vidaurora, .ws-skin.sk-aurora, .ws-skin.sk-silk, .ws-skin.sk-dark, .ws-skin.sk-midnight, .ws-skin.sk-gradient { color: #fff; border: none; }
.ws-skin.sk-dark, .ws-skin.sk-video, .ws-skin.sk-vidaurora, .ws-skin.sk-aurora { background: linear-gradient(140deg, #12274F, #0A1730); }
.ws-skin.sk-midnight { background: linear-gradient(140deg, #12132a, #06080F); }
.ws-skin.sk-gradient { background: linear-gradient(140deg, #1E3A8A, #4C2A6E); }
.ws-skin.sk-silk, .ws-skin.sk-vidgold { background: linear-gradient(140deg, #5A3E12, #241a08); }
.ws-skin.sk-mesh { background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 16%, #fff), #fff); }
.ws-skin.on { outline: 2px solid var(--accent); outline-offset: 1px; }

/* превью пака «Кинофон» — намёк на видео-фоны (анимированные градиенты в превью) */
.pk-cinema .ov2-pack-prev { background: linear-gradient(160deg, #0A1428, #12132a); }
.opv-chart.cine-a { position: relative; overflow: hidden; background: linear-gradient(125deg, #08122A, #24306E 55%, #08122A); background-size: 300% 300%; animation: ovFlow 8s ease-in-out infinite; border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent); color: var(--blue-300); }
.opv-chart.cine-a .opv-n { color: #fff; }
.opv-cine-g { flex: 1; border-radius: 8px; background: linear-gradient(125deg, #5A3E12, #241a08 60%, #5A3E12); background-size: 300% 300%; animation: ovFlow 9s ease-in-out infinite; border: 1px solid rgba(255,210,120,.2); }

/* компактный iPhone-мокап для превью первого касания */
.iph-xs { padding: 7px; border-radius: 34px; box-shadow: 0 18px 44px -20px rgba(8,10,16,.55), inset 0 0 0 2px rgba(255,255,255,.05); }
.iph-xs .iph-screen { border-radius: 28px; }
.iph-xs .iph-island { top: 8px; padding: 4px 12px; }
.iph-xs .iph-status { padding: 6px 14px 3px; }
.iph-xs .iph-time { font-size: 11px; }
.iph-xs .wa-top { padding: 5px 11px 8px; }
.iph-xs .wa-ava { width: 26px; height: 26px; font-size: 11px; }
.iph-xs .wa-peer b { font-size: 12px; }
.iph-xs .wa-body { padding: 10px 9px; }
.iph-xs .wa-msg { font-size: 12px; padding: 7px 9px; max-width: 88%; }
.iph-xs .iph-home { bottom: 5px; width: 92px; height: 4px; }

/* ============ Apple-style полировка виджетов обзора ============ */
/* базовая карточка виджета: мягкая многослойная тень, тонкая рамка, лёгкая глубина, плавный ховер */
.ov-w-body { border-radius: 20px; padding: 20px 22px; border: 1px solid color-mix(in srgb, var(--stroke) 65%, transparent);
  background: linear-gradient(180deg, color-mix(in srgb, #fff 55%, var(--card)) 0%, var(--card) 26%);
  box-shadow: 0 1px 2px rgba(16,43,92,.04), 0 12px 30px -18px rgba(16,43,92,.18);
  -webkit-backdrop-filter: none; transition: box-shadow .28s cubic-bezier(.4,0,.2,1), transform .28s cubic-bezier(.4,0,.2,1); }
.ov-w:not(.full):hover .ov-w-body { transform: translateY(-2px); box-shadow: 0 2px 6px rgba(16,43,92,.05), 0 22px 48px -20px rgba(16,43,92,.26); }
/* заголовок виджета — тоньше, воздушнее, аккуратный бейдж-счётчик */
.ov2-card-hd { font-size: 13.5px; font-weight: 650; letter-spacing: -.01em; margin-bottom: 15px; gap: 9px; }
.ov2-card-hd svg { width: 17px; height: 17px; }
.ov2-card-hd > span { font-weight: 500; color: var(--ink-3); font-size: 12px; letter-spacing: 0; }
.ov2-card-hd .btn-sm { border-radius: 9px; font-weight: 600; }
/* иконки-чипы — мягче, объёмнее */
.ov2-kpi-ic, .kc-chip-ic, .kbn-c-ic { border-radius: 12px; box-shadow: inset 0 1px 0 rgba(255,255,255,.4); }
.ov2-kpi { border-radius: 16px; transition: transform .2s, box-shadow .2s; }
.ov2-kpi:hover { transform: translateY(-1px); }
.ov2-kpi-v, .kc-num, .kc-chip-b b, .ov2-gs-big, .ov2-goal-c b, .ov2-gauge-c b, .anh-v, .ov2-champ-v, .ov2-spot-v, .kbn-num, .ked-num { letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
/* строки-элементы — крупнее клик-зона, мягкие разделители, деликатный ховер */
.ov2-lrow, .ov2-task, .ov2-meet, .ov2-case, .ov2-wc-row, .ov2-lrk-row { border-radius: 10px; transition: background .16s; }
.ov2-lrow { padding: 9px 8px; margin: 0 -8px; }
.ov2-lrow:hover, .ov2-meet:hover, .ov2-case:hover { background: color-mix(in srgb, var(--accent) 5%, transparent); }
.ov2-lrow + .ov2-lrow { border-top: 1px solid var(--stroke-soft); }
/* score-кольца горячих лидов — тоньше и чётче */
.ov2-hc { border-radius: 16px; transition: transform .2s, box-shadow .2s, border-color .2s; }
.ov2-hc:hover { transform: translateY(-2px); box-shadow: 0 12px 26px -16px rgba(16,43,92,.3); }
/* attention-карточки — премиальнее */
.ov2-att { border-radius: 16px; transition: transform .2s, box-shadow .2s; }
.ov2-att:hover { transform: translateY(-1px); box-shadow: 0 10px 24px -16px rgba(16,43,92,.28); }
/* тёмные скины: на глубоком фоне тень мягче и холоднее, ховер — свечение */
.ov-w[class*="ov-skin-"]:not(.ov-skin-clean):not(.ov-skin-mesh):not(.full):hover .ov-w-body { box-shadow: 0 22px 50px -20px rgba(6,17,38,.6), 0 0 0 1px color-mix(in srgb, var(--accent) 25%, transparent); }

/* ============ Обогащённые виджеты: Приток (area) + WhatsApp-здоровье (ring) ============ */
.ov2-spark2 { display: flex; flex-direction: column; gap: 8px; }
.ov2-spark2-hd { display: flex; align-items: baseline; gap: 10px; }
.ov2-spark2-hd b { font-size: 30px; font-weight: 800; color: var(--navy-900); letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1; }
.ov2-spark2-hd span { font-size: 12px; color: var(--ink-3); display: inline-flex; align-items: center; gap: 6px; }
.ov2-spark2-area { height: 74px; }
.ov2-wa { display: flex; align-items: center; gap: 16px; }
.ov2-wa-ring { position: relative; width: 84px; height: 84px; flex: none; }
.ov2-wa-ring svg { width: 100%; height: 100%; }
.ov2-wa-ring .war-bg { fill: none; stroke: var(--stroke); stroke-width: 7; }
.ov2-wa-ring .war-fg { fill: none; stroke-width: 7; stroke-linecap: round; transition: stroke-dashoffset .6s cubic-bezier(.4,0,.2,1); }
.ov2-wa-ring.bad .war-fg { stroke: var(--bad) !important; }
.ov2-wa-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.ov2-wa-c b { font-size: 22px; font-weight: 800; color: var(--navy-900); line-height: 1; font-variant-numeric: tabular-nums; }
.ov2-wa-c b span { font-size: 12px; font-weight: 700; }
.ov2-wa-c i { font-size: 9.5px; font-style: normal; color: var(--ink-3); text-transform: uppercase; letter-spacing: .05em; }
.ov2-wa-tiles { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.ov2-wa-t { text-align: left; border: 1px solid var(--stroke); border-radius: 12px; padding: 9px 13px; background: var(--card); cursor: pointer; transition: border-color .15s; }
.ov2-wa-t:hover { border-color: var(--accent); }
.ov2-wa-t b { font-size: 20px; font-weight: 800; color: var(--navy-900); display: block; line-height: 1; font-variant-numeric: tabular-nums; }
.ov2-wa-t i { font-size: 11px; color: var(--ink-3); font-style: normal; }

/* ============ Керамика-2026: тактильные матовые поверхности виджетов ============ */
/* светлая керамика: мягкий матовый градиент, многослойная амбиентная тень + верхний внутренний хайлайт */
.ov-w.ov-skin-clean .ov-w-body,
.ov-w:not([class*="ov-skin-"]) .ov-w-body {
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.55);
  background: linear-gradient(180deg, #FFFFFF 0%, color-mix(in srgb, var(--card) 90%, #EAF0F8) 100%);
  box-shadow:
    0 1px 1px rgba(16,43,92,.03),
    0 10px 22px -14px rgba(16,43,92,.13),
    0 28px 54px -30px rgba(16,43,92,.16),
    inset 0 1px 0 rgba(255,255,255,.9);
}
.ov-w:not(.full):hover .ov-w-body { transform: translateY(-3px); box-shadow:
    0 2px 3px rgba(16,43,92,.04),
    0 16px 30px -14px rgba(16,43,92,.16),
    0 40px 70px -34px rgba(16,43,92,.22),
    inset 0 1px 0 rgba(255,255,255,.95); }
/* тёмная керамика: матовая глубина + холодный внутренний хайлайт сверху */
.ov-w.ov-skin-dark .ov-w-body, .ov-w.ov-skin-midnight .ov-w-body, .ov-w.ov-skin-aurora .ov-w-body, .ov-w.ov-skin-silk .ov-w-body {
  border-radius: 22px;
  box-shadow: 0 16px 40px -20px rgba(6,17,38,.55), inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px color-mix(in srgb, var(--accent) 6%, transparent);
}
.ov-w.ov-skin-gradient .ov-w-body { border-radius: 22px; box-shadow: 0 18px 42px -18px color-mix(in srgb, var(--accent) 60%, transparent), inset 0 1px 0 rgba(255,255,255,.18); }
/* иконки-чипы — керамическое тиснение (мягкий градиент + внутренний свет + микро-тень) */
.ov2-kpi-ic, .kc-chip-ic, .kbn-c-ic, .kb-c-ic, .ov2-att-ic {
  background: linear-gradient(160deg, color-mix(in srgb, var(--accent) 20%, #fff), color-mix(in srgb, var(--accent) 10%, transparent));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), inset 0 -1px 2px color-mix(in srgb, var(--accent) 14%, transparent), 0 3px 8px -4px color-mix(in srgb, var(--accent) 40%, transparent);
}
/* внутренние под-карточки (плитки/чипы/строки-кнопки) — матовая керамика */
.kc-chip, .ov2-kh-row, .kbn-cell, .kt-row, .ov2-hc, .ov2-wa-t, .ov2-kpi {
  border: 1px solid rgba(255,255,255,.6);
  background: linear-gradient(180deg, #fff, color-mix(in srgb, var(--card) 94%, #EEF2F8));
  box-shadow: 0 1px 2px rgba(16,43,92,.04), inset 0 1px 0 rgba(255,255,255,.85);
}
.kc-chip:hover, .ov2-hc:hover, .ov2-wa-t:hover, .ov2-kpi:hover { box-shadow: 0 6px 16px -8px rgba(16,43,92,.2), inset 0 1px 0 rgba(255,255,255,.9); }
/* заголовки виджетов — чуть воздушнее, буквица тоньше */
.ov2-card-hd { letter-spacing: -.015em; }
/* мягкая пружинная анимация */
.ov-w-body, .ov2-kpi, .ov2-hc, .kc-chip { transition: box-shadow .3s cubic-bezier(.34,1.3,.5,1), transform .3s cubic-bezier(.34,1.3,.5,1), border-color .2s; }

/* библиотека виджетов: реалистичные превью (реальный рендер), full-виджеты во всю ширину */
.ov2-lib-i.wide { grid-column: 1 / -1; }
.ov2-lib-i.wide .ov2-lib-prev { height: 150px; }
.ov2-lib-prev-in.ov-w-body { border-radius: 0; border: none; background: transparent; box-shadow: none; }
.ov2-lib-prev { background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 4%, var(--bg-2)), var(--bg-2)); }

/* ============ Reels: формула + психология в карточке сценария ============ */
.sh-formula { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-2, #5B2BD8)); border-radius: 8px; padding: 4px 10px; margin-right: 8px; letter-spacing: .01em; }
.sh-formula svg { width: 12px; height: 12px; }
.sh-psych { display: flex; align-items: flex-start; gap: 7px; font-size: 12px; line-height: 1.5; color: var(--ink-2); background: color-mix(in srgb, var(--accent) 6%, var(--bg-2)); border: 1px solid color-mix(in srgb, var(--accent) 16%, var(--stroke)); border-radius: 10px; padding: 9px 12px; margin: 8px 0 2px; }
.sh-psych svg { width: 14px; height: 14px; color: var(--accent); flex: none; margin-top: 1px; }
.sh-psych b { color: var(--navy-900); font-weight: 700; }
.sh-gen-foot .sh-sel { max-width: 220px; }

/* ============ Карта желаний (мудборд брокера) ============ */
.mb-wrap { display: flex; flex-direction: column; gap: 9px; }   /* ближе к холсту (было 16) */
.mb-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
/* минимализм: заголовок + кнопки приглушены, загораются при наведении на шапку */
.mb-top .mb-title, .mb-top .mb-tools { opacity: .42; transition: opacity .24s var(--ease-soft); }
.mb-top:hover .mb-title, .mb-top:hover .mb-tools, .mb-top:focus-within .mb-title, .mb-top:focus-within .mb-tools { opacity: 1; }
/* тот же приём для встроенной шапки Карты желаний в «Мои задачи» (раскрытый блок) */
.mb-collcard.op .mb-coll-hd { opacity: .5; transition: opacity .24s var(--ease-soft); }
.mb-collcard.op .mb-coll-hd:hover { opacity: 1; }
/* встроенная Карта в «Мои задачи»: кнопки Добавить/Править — В ОДНУ СТРОКУ с заголовком блока
   (не отдельным рядом) → холст сразу под заголовком, без лишнего вертикального ряда */
.mb-collcard { position: relative; }
.mb-collcard.op .mb-coll-body { padding-top: 0; }
.mb-collcard.op .mb-coll-body .mb-top { position: absolute; top: 12px; right: 50px; width: auto; margin: 0; z-index: 4; }
.mb-collcard.op .mb-coll-body .mb-top .mb-tools { opacity: .7; }
.mb-collcard.op .mb-coll-body .mb-top:hover .mb-tools { opacity: 1; }
.mb-title { display: flex; align-items: center; gap: 11px; }
.mb-emblem { width: 26px; height: 26px; color: var(--accent); opacity: .85; flex: 0 0 auto; }
.mb-t-k { font-family: 'Fraunces', serif; font-size: 25px; font-weight: 500; color: var(--navy-900); letter-spacing: .01em; line-height: 1; }
.mb-t-n { font-size: 11px; color: var(--ink-3); letter-spacing: .14em; text-transform: uppercase; align-self: center; padding-left: 11px; margin-left: 4px; border-left: 1px solid var(--stroke); }
/* минималистичные иконки-инструменты вместо крупных кнопок «Фото/Стикер/Создать» на виду */
.mb-tools { display: inline-flex; gap: 7px; margin-left: auto; }
.mb-iconbtn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--stroke); background: var(--card); border-radius: 12px; height: 36px; padding: 0 13px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; transition: .16s; }
.mb-iconbtn svg { width: 16px; height: 16px; }
.mb-iconbtn:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--stroke)); color: var(--navy-900); }
.mb-iconbtn.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.mb-iconbtn#mbEdit { padding: 0 10px; } .mb-iconbtn#mbEdit span { display: none; }
/* панель добавления — свёрнута по умолчанию, раскрывается по «Добавить» (сохраняет минимализм) */
/* ⚠️ у панели ДВА прямых ребёнка (.mb-inp + .mb-addopts) — одного grid-template-rows:0fr мало,
   второй уходил в неявный auto-ряд → фантомные 55px с кликабельным input/select. Схлопываем и неявные ряды
   + pointer-events:none в закрытом состоянии (никаких «невидимых кнопок» и выпадающих меню). */
.mb-addpanel { display: grid; grid-template-rows: 0fr; grid-auto-rows: 0fr; opacity: 0; pointer-events: none; transition: grid-template-rows .28s cubic-bezier(.4,0,.2,1), grid-auto-rows .28s cubic-bezier(.4,0,.2,1), opacity .22s, margin .28s; margin: 0; }
.mb-addpanel:not(.open) { display: none; }   /* закрытая — 0 высоты (холст сразу под шапкой, без остаточного зазора) */
.mb-addpanel.open { display: grid; grid-template-rows: 1fr; grid-auto-rows: auto; opacity: 1; pointer-events: auto; margin: -4px 0 2px; }
.mb-addpanel > * { min-height: 0; overflow: hidden; }
/* padding по бокам/снизу = запас под 3px фокус-ринг инпута: .mb-addpanel>* имеет overflow:hidden
   (нужен для грид-коллапса), и без запаса ринг обрезался по краям. */
.mb-addpanel .mb-inp { display: flex; gap: 8px; padding: 5px 5px 6px; }
.mb-inp input { flex: 1; min-width: 0; border: 1px solid var(--stroke); border-radius: 12px; padding: 12px 15px; font-size: 13.5px; outline: none; background: var(--card); }
.mb-inp input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.mb-addopts { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 10px 2px 2px; }
.mb-seg { display: inline-flex; gap: 4px; background: var(--bg-2); border-radius: 20px; padding: 3px; }
.mb-st { border: none; background: none; border-radius: 16px; padding: 6px 15px; font-size: 12px; font-weight: 600; color: var(--ink-3); cursor: pointer; }
.mb-st.on { background: var(--card); color: var(--accent); box-shadow: 0 2px 6px -3px rgba(16,43,92,.2); }
.mb-tm { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); font-weight: 700; transition: opacity .2s; }
.mb-tm.off { opacity: .32; pointer-events: none; }
.mb-select { border: 1px solid var(--stroke); background: var(--card); border-radius: 10px; padding: 7px 11px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); font-family: inherit; cursor: pointer; text-transform: none; letter-spacing: 0; }
/* кастомные чипы режима текста (вместо нативного select) — в стилистике дашборда */
.mb-tm-seg { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.mb-tm-b { border: 1px solid var(--stroke); background: var(--card); border-radius: 999px; padding: 5px 11px; font-size: 12px; font-weight: 600; color: var(--ink-2); font-family: inherit; cursor: pointer; text-transform: none; letter-spacing: 0; transition: all .14s; }
.mb-tm-b:hover { border-color: var(--accent); color: var(--accent); }
.mb-tm-b.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.mb-select:focus { border-color: var(--accent); outline: none; }
/* доска — эстетичный минимализм: тёплая бумага + мягкая сетка */
.mb-board { position: relative; min-height: 64vh; border-radius: 22px; overflow: hidden; border: 1px solid var(--stroke);
  background:
    radial-gradient(circle at 20px 20px, rgba(16,43,92,.03) 1.5px, transparent 1.6px) 0 0 / 40px 40px,
    linear-gradient(160deg, #FBFAF7, #F3F1EC);
  box-shadow: inset 0 2px 20px rgba(16,43,92,.05); }
html[data-night] .mb-board { background: radial-gradient(circle at 20px 20px, rgba(255,255,255,.03) 1.5px, transparent 1.6px) 0 0 / 40px 40px, linear-gradient(160deg, #0c1424, #0a1120); }
.mb-item { position: absolute; cursor: grab; user-select: none; touch-action: none; transition: box-shadow .2s, transform .15s; animation: mbPop .5s cubic-bezier(.2,.8,.25,1) both; animation-delay: calc(var(--i, 0) * 45ms); }
@keyframes mbPop { from { opacity: 0; transform: scale(.86) translateY(10px) rotate(var(--r0, 0deg)); } to { opacity: 1; } }
.mb-item img { display: block; width: 100%; border-radius: 10px; box-shadow: 0 10px 26px -10px rgba(16,43,92,.35), 0 2px 6px rgba(16,43,92,.15); background: #fff; }
/* стикер = вырезанный на прозрачном фоне (die-cut) — без подложки, мягкая тень-лифт по контуру */
.mb-item.stk img { background: none; border-radius: 0; box-shadow: none; filter: drop-shadow(0 9px 14px rgba(16,43,92,.26)) drop-shadow(0 2px 3px rgba(16,43,92,.2)); }
.mb-item.drag { cursor: grabbing; animation: none; opacity: 1 !important; }
.mb-item.drag img { box-shadow: 0 24px 50px -14px rgba(16,43,92,.5); }
/* die-cut стикер при перетаскивании: тень по силуэту (не квадратная) */
.mb-item.stk.drag img { box-shadow: none; filter: drop-shadow(0 20px 28px rgba(16,43,92,.4)) drop-shadow(0 5px 9px rgba(16,43,92,.28)); }
/* режим правки: понятно, что стикеры двигаются */
.mb-editing .mb-item { cursor: grab; }
.mb-editing .mb-item:hover { outline: 1.5px dashed color-mix(in srgb, var(--accent) 55%, transparent); outline-offset: 6px; border-radius: 6px; }
.mb-editing .mb-item .mb-grip, .mb-editing .mb-item .mb-del { display: grid; }
.mb-editing .mb-item:hover .mb-rs, .mb-item.resizing .mb-rs { display: block; }
/* подсказка «разложить» поверх доски (view-mode, при пересечении) */
.mb-hint { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); z-index: 20; display: inline-flex; align-items: center; gap: 7px; padding: 8px 15px; border: none; border-radius: 999px; background: rgba(16,43,92,.82); color: #fff; font-size: 12.5px; font-weight: 600; cursor: pointer; box-shadow: 0 8px 22px -8px rgba(16,43,92,.5); backdrop-filter: blur(6px); animation: mbHintIn .4s ease both; }
.mb-hint svg { width: 15px; height: 15px; }
.mb-hint:hover { background: rgba(16,43,92,.95); }
@keyframes mbHintIn { from { opacity: 0; transform: translateX(-50%) translateY(8px); } }
/* плейсхолдер генерации (шиммер-орб) */
.mb-pending { pointer-events: none; }
.mb-pending-box { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 28px 18px; border-radius: 16px; background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(240,244,251,.8)); border: 1px solid var(--stroke); box-shadow: 0 10px 26px -12px rgba(16,43,92,.3); position: relative; overflow: hidden; }
.mb-pending-box::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); transform: translateX(-100%); animation: mbShimmer 1.5s infinite; }
@keyframes mbShimmer { to { transform: translateX(100%); } }
.mb-pending-orb { width: 34px; height: 34px; border-radius: 50%; background: conic-gradient(from 0deg, var(--accent), var(--accent-2, #7C3AED), var(--accent)); animation: mbSpin 1s linear infinite; box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent); position: relative; }
.mb-pending-orb::after { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: var(--card); }
@keyframes mbSpin { to { transform: rotate(360deg); } }
.mb-pending-t { font-size: 12.5px; font-weight: 600; color: var(--navy-900); text-align: center; line-height: 1.25; z-index: 1; }
.mb-pending-s { font-size: 11px; color: var(--accent); font-weight: 600; letter-spacing: .04em; z-index: 1; }
html[data-night] .mb-pending-box { background: linear-gradient(135deg, rgba(30,41,60,.9), rgba(20,30,48,.8)); }
/* анимированное пустое состояние — золотой Higgsfield-луп + мотивирующий CTA */
.mb-empty-anim { position: absolute; inset: 0; border-radius: 22px; overflow: hidden; display: grid; place-items: center; background: #0c1424; }
.mb-empty-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.mb-empty-ov { position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 40%, rgba(12,20,36,.25), rgba(12,20,36,.78)); }
.mb-empty-c { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 30px; max-width: 480px; }
.mb-empty-anim .mb-empty-c b { font-family: 'Fraunces', serif; font-weight: 500; font-size: 27px; color: #fff; letter-spacing: .01em; }
.mb-empty-anim .mb-empty-c span { font-size: 13.5px; color: rgba(255,255,255,.78); line-height: 1.55; }
.mb-empty-cta { margin-top: 8px; box-shadow: 0 10px 26px -8px color-mix(in srgb, var(--accent) 60%, transparent); }
/* плюс на синей CTA должен быть БЕЛЫМ + мелким (перебиваем .mb-empty svg{color:accent;width:34px} — та же (0,1,1), но объявлена позже; поэтому даём (0,2,1)) */
.mb-empty-anim .mb-empty-cta svg { color: #fff; width: 16px; height: 16px; opacity: 1; }
/* ⭐ анимированная демо-доска: реальные стикеры «влетают» на доску (мотивация собрать свою) */
.mb-demo { position: absolute; inset: 0; overflow: hidden; }
.mb-demo-board { position: absolute; inset: 0; }
/* влёт (pop) → затем непрерывное плавание (drift), чтобы доска «жила» */
/* влёт ОДИН раз (без бесконечного плавания — оно раздражало) */
.mb-demo-st { position: absolute; transform-origin: 50% 50%; opacity: 0; filter: drop-shadow(0 9px 15px rgba(16,43,92,.26)) drop-shadow(0 2px 4px rgba(16,43,92,.2)); animation: mbDemoPop .66s cubic-bezier(.34,1.5,.5,1) var(--d, 0s) both; }
@keyframes mbDemoPop { 0% { opacity: 0; transform: translateY(-18px) scale(.72) rotate(calc(var(--r) - 8deg)); } 62% { opacity: 1; } 100% { opacity: 1; transform: translateY(0) scale(1) rotate(var(--r)); } }
.mb-demo-fade { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 44%, color-mix(in srgb, var(--navy-900) 10%, transparent) 78%, color-mix(in srgb, var(--navy-900) 26%, transparent)); }
.mb-demo .mb-empty-c { position: absolute; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 3; max-width: 540px; padding: 19px 26px; border-radius: 20px; background: color-mix(in srgb, var(--card) 80%, transparent); backdrop-filter: blur(16px) saturate(1.25); -webkit-backdrop-filter: blur(16px) saturate(1.25); border: 1px solid color-mix(in srgb, #fff 28%, var(--stroke)); box-shadow: 0 18px 44px -16px rgba(16,43,92,.42); }
.mb-demo .mb-empty-c b { font-family: 'Fraunces', serif; font-weight: 550; font-size: 22px; color: var(--navy-900); letter-spacing: .01em; text-wrap: balance; hyphens: none; }
.mb-demo .mb-empty-c span { font-size: 13px; color: var(--ink-2); line-height: 1.5; }
.mb-demo .mb-empty-cta svg { color: #fff; width: 16px; height: 16px; opacity: 1; }
html[data-night] .mb-demo .mb-empty-c b { color: #fff; }
@media (prefers-reduced-motion: reduce) { .mb-demo-st { animation-duration: .01s; } }
/* крепёж — реалистичные вырезанные PNG (Apple-стиль), поверх стикера */
.mb-fast { position: absolute; z-index: 4; pointer-events: none; filter: drop-shadow(0 3px 4px rgba(16,43,92,.28)); }
.mb-pin { top: -20px; left: 50%; width: 40px; transform: translateX(-50%) rotate(-4deg); }
.mb-clip { top: -20px; left: 22%; width: 30px; transform: rotate(9deg); }
.mb-cap { margin-top: 6px; text-align: center; font-size: 12px; font-weight: 600; color: var(--navy-900); background: rgba(255,255,255,.7); backdrop-filter: blur(3px); border-radius: 8px; padding: 3px 8px; }
html[data-night] .mb-cap { background: rgba(20,30,50,.7); color: var(--ink); }
/* ── типографика-слой карты желаний (арт-директорское решение, рендер фронтом) ── */
.mb-txt { margin-top: 9px; text-align: center; line-height: 1.06; color: var(--navy-900); }
.mb-tx-pri { font-weight: 800; font-size: 15px; letter-spacing: -.01em; }
.mb-tx-sec { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); margin-top: 4px; }
.mb-tx-mic { font-size: 8.5px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; color: var(--ink-3); margin-top: 4px; opacity: .82; }
.mb-txt-handwritten .mb-tx-pri, .mb-txt-mixed .mb-tx-pri { font-family: 'Caveat', cursive; font-size: 28px; font-weight: 700; letter-spacing: .01em; display: inline-block; transform: rotate(-2.5deg); }
.mb-txt-editorial .mb-tx-pri { font-family: 'Bebas Neue', sans-serif; font-size: 23px; font-weight: 400; letter-spacing: .05em; text-transform: uppercase; }
.mb-txt-goal .mb-tx-pri { font-family: 'Bebas Neue', sans-serif; font-size: 36px; font-weight: 400; letter-spacing: .015em; line-height: .95; }
/* контраст на тёмной доске и в ночи */
.mb-bg-dark .mb-txt, html[data-night] .mb-txt { color: #f2f5fb; }
.mb-bg-dark .mb-tx-sec, html[data-night] .mb-tx-sec { color: #c7d0e0; }
.mb-bg-dark .mb-tx-mic, html[data-night] .mb-tx-mic { color: #9aa6bd; }
.mb-del { position: absolute; top: -8px; right: -8px; width: 22px; height: 22px; border-radius: 50%; border: none; background: var(--bad); color: #fff; display: none; place-items: center; cursor: pointer; z-index: 4; box-shadow: 0 3px 8px -2px rgba(0,0,0,.4); }
.mb-del svg { width: 12px; height: 12px; }
.mb-item:hover .mb-del { display: grid; }
.mb-grip { position: absolute; bottom: 4px; left: 4px; width: 22px; height: 22px; border-radius: 7px; background: rgba(255,255,255,.85); color: var(--ink-3); display: none; place-items: center; cursor: grab; z-index: 3; }
/* угловой хэндл ресайза стикера (индивидуальный размер) */
.mb-rs { position: absolute; right: -7px; bottom: -7px; width: 16px; height: 16px; border-radius: 50%; background: var(--accent); border: 2px solid #fff; cursor: nwse-resize; display: none; z-index: 6; box-shadow: 0 2px 7px -1px rgba(16,43,92,.5); touch-action: none; }
.mb-item.resizing { cursor: nwse-resize; }
.mb-item.resizing img { box-shadow: 0 20px 40px -14px rgba(16,43,92,.45); }
.mb-grip svg { width: 13px; height: 13px; }
.mb-item:hover .mb-grip { display: grid; }
/* глубина: фоновые (крупные, низкий z) — чуть мягче, чтобы передний план читался ярче */
.mb-item.mb-soft { filter: saturate(.95); }
.mb-item.mb-soft img { opacity: .965; }
.mb-item.mb-soft.stk img { opacity: .965; }
/* мини-панель действий над объектом (режим правки): герой / вперёд / назад */
.mb-iacts { position: absolute; top: -8px; left: -8px; display: none; gap: 4px; z-index: 6; }
.mb-editing .mb-item:hover .mb-iacts { display: inline-flex; }
.mb-iacts button { width: 22px; height: 22px; border-radius: 7px; border: 1px solid var(--stroke); background: rgba(255,255,255,.92); color: var(--ink-2); display: grid; place-items: center; cursor: pointer; padding: 0; transition: .14s; box-shadow: 0 3px 8px -3px rgba(16,43,92,.4); }
.mb-iacts button:hover { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, var(--stroke)); }
.mb-iacts button svg { width: 12px; height: 12px; }
.mb-iacts button[data-mbback] svg { transform: rotate(180deg); }
html[data-night] .mb-iacts button { background: rgba(20,30,50,.92); }
.mb-empty { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; padding: 30px; }
.mb-empty svg, .mb-empty .mb-emblem { width: 34px; height: 34px; color: var(--accent); opacity: .8; }
.mb-empty b { font-size: 17px; color: var(--navy-900); font-weight: 700; font-family: 'Fraunces', serif; }
.mb-empty span { font-size: 13px; color: var(--ink-3); max-width: 440px; line-height: 1.55; }
@media (max-width: 640px) { .mb-top { flex-direction: column; align-items: stretch; gap: 12px; } .mb-tools { justify-content: flex-end; } }

/* ============ Карта желаний · правка, шрифты, фоны, крепёж ============ */
.mb-editbtn.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.mb-title-edit { font-size: 30px; font-weight: 600; color: var(--navy-900); border: none; border-bottom: 2px dashed var(--stroke); background: none; outline: none; padding: 0 2px 3px; max-width: 60vw; letter-spacing: -.02em; }
.mb-title-edit:focus { border-color: var(--accent); }
.mb-cfg { display: flex; flex-wrap: wrap; gap: 18px; padding: 12px 16px; background: var(--bg-2); border-radius: 14px; margin-bottom: 12px; }
.mb-cfg-g { display: flex; align-items: center; gap: 6px; }
.mb-cfg-g > span { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); font-weight: 700; margin-right: 3px; }
.mb-chip { display: inline-flex; align-items: center; gap: 6px; border: 1.5px solid var(--stroke); background: var(--card); border-radius: 18px; padding: 5px 13px; font-size: 12.5px; font-weight: 600; line-height: 1; color: var(--ink-2); cursor: pointer; font-family: inherit; white-space: nowrap; }
.mb-chip svg { width: 14px; height: 14px; flex: 0 0 auto; }   /* ⚠️ без размера иконка раздувала кнопку «Скомпоновать» до 120px */
.mb-chip.on { border-color: var(--accent); color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent); }
.mb-bgchip { width: 30px; height: 26px; padding: 0; border-radius: 8px; }
.mb-bgchip.on { outline: 2px solid var(--accent); outline-offset: 1px; }
/* фоны доски */
.mb-bg-paper { background: radial-gradient(circle at 20px 20px, rgba(16,43,92,.03) 1.5px, transparent 1.6px) 0 0 / 40px 40px, linear-gradient(160deg, #FBFAF7, #F3F1EC); }
.mb-bg-linen { background: repeating-linear-gradient(45deg, rgba(0,0,0,.012) 0 2px, transparent 2px 4px), repeating-linear-gradient(-45deg, rgba(0,0,0,.012) 0 2px, transparent 2px 4px), #F6F4EF; }
.mb-bg-dark { background: radial-gradient(circle at 20px 20px, rgba(255,255,255,.03) 1.5px, transparent 1.6px) 0 0 / 40px 40px, linear-gradient(160deg, #0e1a30, #0a1120); }
.mb-bg-cork { background: radial-gradient(circle at 30% 30%, rgba(120,72,20,.1) 0 2px, transparent 3px) 0 0 / 14px 14px, linear-gradient(160deg, #D9B382, #CBA06A); }
.mb-bg-gradient { background: radial-gradient(120% 90% at 15% 10%, color-mix(in srgb, var(--accent) 16%, #fff), transparent 55%), radial-gradient(100% 80% at 90% 90%, rgba(124,58,237,.14), transparent 55%), #F5F7FC; }
.mb-bg-blush { background: radial-gradient(circle at 20px 20px, rgba(200,60,110,.03) 1.5px, transparent 1.6px) 0 0 / 40px 40px, linear-gradient(160deg, #FCF1F3, #F7E8EC); }
.mb-bg-dark .mb-cap { background: rgba(20,30,50,.72); color: #eef; }
/* фон-свотчи в пикере — мини-версия */
.mb-bgchip.mb-bg-paper, .mb-bgchip.mb-bg-linen, .mb-bgchip.mb-bg-cork, .mb-bgchip.mb-bg-gradient, .mb-bgchip.mb-bg-blush, .mb-bgchip.mb-bg-dark { background-size: cover, cover, cover; }
/* крепёж: скотч (CSS — юзеру нравится); булавка/скрепка — реалистичные PNG выше */
/* ═══ ATTACHMENT ART-DIRECTOR ═══ крепёж ≤15% веса объекта, три семейства */
/* — НАКЛЕЙКА (adhesive): крепежа не видно, объект «приклеен» разной глубиной тени/рамкой — */
.mb-adh-cutout img { filter: drop-shadow(0 7px 12px rgba(16,43,92,.22)) drop-shadow(0 1px 2px rgba(16,43,92,.18)); }
.mb-adh-lift img { filter: drop-shadow(0 11px 17px rgba(16,43,92,.28)) drop-shadow(0 2px 3px rgba(16,43,92,.2)); }
.mb-adh-float img { filter: drop-shadow(0 20px 30px rgba(16,43,92,.34)) drop-shadow(0 4px 7px rgba(16,43,92,.18)); }
.mb-adh-card img { background: #fff; padding: 7%; border-radius: 12px; filter: none; box-shadow: 0 10px 24px -10px rgba(16,43,92,.34), 0 1px 3px rgba(16,43,92,.12); }
.mb-adh-polaroid img { background: #fff; padding: 7% 7% 20%; border-radius: 4px; filter: none; box-shadow: 0 12px 26px -12px rgba(16,43,92,.4), 0 1px 3px rgba(16,43,92,.14); }
html[data-night] .mb-adh-card img, html[data-night] .mb-adh-polaroid img { background: #182338; box-shadow: 0 12px 26px -12px rgba(0,0,0,.6); }
/* — СКОТЧ (tape): маленький кусочек, 18–32% ширины, разные материалы + расстановка — */
.mb-tape { position: absolute; height: 22px; z-index: 4; border-radius: 1px; box-shadow: 0 1px 3px rgba(16,43,92,.18); transform: rotate(var(--trot, -3deg)); }
.mb-tape::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, transparent 0 6px, rgba(255,255,255,.14) 6px 7px); border-radius: inherit; }
.mb-tape-clear { background: linear-gradient(180deg, rgba(228,236,248,.34), rgba(210,222,240,.3)); border-left: 1px solid rgba(255,255,255,.4); border-right: 1px solid rgba(255,255,255,.4); }
.mb-tape-white { background: rgba(250,250,248,.82); }
.mb-tape-beige { background: rgba(216,198,168,.7); }
.mb-tape-cream { background: rgba(240,232,214,.82); }
.mb-tape-frosted { background: rgba(238,242,248,.55); backdrop-filter: blur(1px); }
.mb-tape-washi { background: rgba(206,224,224,.6); }
.mb-tape-black { background: rgba(28,32,42,.78); }
.mb-tape-pastel { background: rgba(206,214,242,.62); }
.mb-tape-torn { background: rgba(244,238,226,.8); clip-path: polygon(0 12%, 6% 0, 14% 10%, 24% 2%, 34% 12%, 46% 3%, 58% 12%, 70% 2%, 82% 11%, 92% 2%, 100% 12%, 100% 88%, 93% 100%, 82% 90%, 70% 99%, 58% 88%, 46% 98%, 34% 88%, 24% 99%, 14% 90%, 6% 100%, 0 88%); }
/* расстановка скотча (top/left/right/diag/edge/corner) */
.mb-tp-tc { top: -9px; left: 50%; transform: translateX(-50%) rotate(-3deg); }
.mb-tp-tl { top: -8px; left: 6%; --trot: -6deg; }
.mb-tp-tr { top: -8px; right: 6%; --trot: 5deg; }
.mb-tp-dl { top: -4px; left: 1%; --trot: -20deg; }
.mb-tp-dr { top: -4px; right: 1%; --trot: 20deg; }
.mb-tp-le { top: 24%; left: -12px; transform: rotate(90deg); }
.mb-tp-re { top: 24%; right: -12px; transform: rotate(90deg); }
.mb-tp-bl { bottom: -8px; left: 8%; --trot: 4deg; }
.mb-tp-br { bottom: -8px; right: 8%; --trot: -4deg; }
.mb-tp-cw { top: -6px; left: -6px; --trot: -42deg; }
/* — 3D-ЭМОДЗИ: маленький глянцевый стикер-чип у угла объекта — */
.mb-emoji { position: absolute; z-index: 5; line-height: 1; display: grid; place-items: center; width: 1.5em; height: 1.5em; border-radius: 50%; background: radial-gradient(circle at 34% 28%, #fff, #eef1f7 70%, #dfe4ee); box-shadow: 0 4px 10px -3px rgba(16,43,92,.4), inset 0 1px 2px rgba(255,255,255,.8), inset 0 -2px 3px rgba(16,43,92,.12); filter: drop-shadow(0 1px 1px rgba(0,0,0,.1)); }
html[data-night] .mb-emoji { background: radial-gradient(circle at 34% 28%, #33405a, #232f45 70%, #182135); box-shadow: 0 4px 10px -3px rgba(0,0,0,.5), inset 0 1px 2px rgba(255,255,255,.14); }
.mb-emj-tro { top: -0.6em; right: -0.6em; }
.mb-emj-tlo { top: -0.6em; left: -0.6em; }
.mb-emj-re { top: 40%; right: -0.7em; }
.mb-emj-le { top: 40%; left: -0.7em; }
.mb-emj-bro { bottom: 8%; right: -0.5em; }
.mb-emj-blo { bottom: 8%; left: -0.5em; }
/* — СКРЕПКА (📎): цепляет верхний край стикера, будто он приколот к доске — */
.mb-clip { position: absolute; z-index: 6; line-height: 1; pointer-events: none; filter: drop-shadow(0 3px 5px rgba(16,43,92,.34)) drop-shadow(0 1px 1px rgba(0,0,0,.2)); }
.mb-clip-tl { top: -.5em; left: 9%; }
.mb-clip-tr { top: -.5em; right: 9%; }
.mb-clip-tc { top: -.54em; left: 50%; margin-left: -.5em; }
.mb-clip-trl { top: -.42em; right: 18%; }
.mb-clip-tll { top: -.42em; left: 18%; }
/* сворачиваемая карта в «Мои задачи» */
.mb-embed { margin-bottom: 16px; }
.mb-embed .mb-board { min-height: 46vh; }

/* сворачиваемая карта желаний в «Мои задачи» — тонкая, дорогая шапка */
.mb-collcard { padding: 0; overflow: hidden; margin-bottom: 16px; border: 1px solid var(--stroke); border-radius: 18px; position: relative; background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 3%, var(--card)), var(--card)); }
.mb-coll-hd { width: 100%; display: flex; align-items: center; gap: 12px; padding: 16px 18px; background: none; border: none; cursor: pointer; text-align: left; position: relative; z-index: 2; transition: transform .16s var(--ease-soft); }
.mb-coll-hd .mb-ch-em { width: 32px; height: 32px; flex: 0 0 auto; border-radius: 10px; display: grid; place-items: center; color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent); transition: background .18s, color .18s; }
.mb-coll-hd .mb-ch-em svg { width: 18px; height: 18px; }
.mb-coll-hd .mb-ch-t { display: flex; flex-direction: column; gap: 2px; }
.mb-coll-hd b { font-family: 'Fraunces', serif; font-weight: 500; font-size: 16px; color: var(--navy-900); letter-spacing: .01em; }
.mb-coll-hd .sub { font-weight: 400; font-size: 11.5px; color: var(--ink-3); }
.mb-coll-ar { margin-left: auto; color: var(--ink-3); display: grid; place-items: center; transition: transform .25s; }
.mb-coll-ar.op { transform: rotate(90deg); }
.mb-coll-ar svg { width: 16px; height: 16px; }
.mb-coll-body { padding: 4px 16px 16px; }
.mb-coll-hd:hover .mb-ch-em { background: color-mix(in srgb, var(--accent) 16%, transparent); }
/* ⭐ СВЁРНУТО = живая премиум-кнопка: трендовый mesh-gradient aurora (чистый CSS). Дышит пока свёрнуто, гаснет при открытии */
.mb-collcard:not(.op) { border-color: transparent; box-shadow: 0 14px 34px -18px rgba(16,43,92,.55); background: var(--ov-hero-a); }
.mb-collcard:not(.op)::before { content: ''; position: absolute; inset: 0; z-index: 0;
  background:
    radial-gradient(60% 130% at 12% 30%, color-mix(in srgb, var(--accent) 42%, transparent), transparent 60%),
    radial-gradient(55% 130% at 88% 70%, color-mix(in srgb, var(--accent-3, var(--accent)) 26%, transparent), transparent 62%),
    radial-gradient(40% 120% at 60% 120%, color-mix(in srgb, var(--accent) 34%, transparent), transparent 60%),
    linear-gradient(112deg, var(--ov-hero-b), var(--ov-hero-a) 55%, var(--ov-hero-c));
  background-size: 200% 200%, 190% 190%, 210% 210%, 100% 100%;
  animation: tkMesh 22s ease-in-out infinite; }
.mb-collcard:not(.op)::after { content: ''; position: absolute; inset: 0; z-index: 1; background: radial-gradient(120% 140% at 50% -20%, transparent 50%, rgba(5,8,16,.45)); pointer-events: none; }
.mb-collcard:not(.op) .mb-coll-hd b { color: #fff; }
.mb-collcard:not(.op) .mb-coll-hd .sub { color: rgba(255,255,255,.8); }
.mb-collcard:not(.op) .mb-ch-em { color: #fff; background: rgba(255,255,255,.18); }
.mb-collcard:not(.op) .mb-coll-ar { color: rgba(255,255,255,.82); }
.mb-collcard:not(.op) .mb-coll-hd:hover { transform: translateY(-1px); }
.mb-collcard:not(.op) .mb-coll-hd:hover .mb-ch-em { background: rgba(255,255,255,.26); }
.mb-collcard:not(.op) .mb-coll-hd::after { content: ''; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 34%, rgba(255,255,255,.16) 50%, transparent 64%); transform: translateX(-130%); animation: mbSheen 6.5s ease-in-out infinite; pointer-events: none; }
@keyframes mbSheen { 0% { transform: translateX(-130%); } 48%, 100% { transform: translateX(130%); } }
@media (prefers-reduced-motion: reduce) { .mb-collcard:not(.op)::before, .mb-collcard:not(.op) .mb-coll-hd::after { animation: none; } }

/* ═══════════════════════════════════════════════════════════════════════
   ОБЗОР — премиум-дашборд 2026. Единая токен-библиотека компонентов.
   Один фиксированный вид на виджет (без скинов/форматов/паков).
   Блок в конце файла — намеренно перекрывает устаревшие правила по порядку.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  --ov-primary: #2F6BFF; --ov-primary-hover: #245AF0;
  --ov-soft-blue: #EAF1FF; --ov-soft-green: #E8F8F2; --ov-soft-red: #FDEDEC;
  --ov-soft-amber: #FBF3E4; --ov-soft-purple: #F0EDFF;
  --ov-cat-blue: #2F6BFF; --ov-cat-green: #18B77E; --ov-cat-red: #F04B42;
  --ov-cat-amber: #D99A2B; --ov-cat-purple: #7A66FF;
  --ov-chip-gray: #F3F5F9; --ov-gold-soft: #FBF7F0;
  --gauge-track: #E8ECF3;
  --ov-hero-a: #0B1E45; --ov-hero-b: #132F68; --ov-hero-c: #173A78;
  --ov-shadow-card: 0 6px 24px rgba(20,33,58,.05); --ov-shadow-elev: 0 12px 32px rgba(20,33,58,.09);
  /* ─── иерархия поверхностей (v2): 1 мягкий офф-вайт · 2 белый elevated · 3 семантичный тинт ─── */
  --surface-1: #F6F8FC; --surface-2: #FFFFFF;
  --surf-tint-blue: #F0F5FF; --surf-tint-mint: #EDF9F3; --surf-tint-violet: #F4F1FF; --surf-tint-amber: #FBF6EC;
  --surf-line-blue: color-mix(in srgb, var(--accent) 20%, transparent); --surf-line-mint: rgba(24,183,126,.22); --surf-line-violet: rgba(122,102,255,.22); --surf-line-amber: rgba(217,154,43,.24);
}
html[data-night] {
  --ov-soft-blue: color-mix(in srgb, var(--accent) 16%, transparent); --ov-soft-green: rgba(24,183,126,.16);
  --ov-soft-red: rgba(240,75,66,.17); --ov-soft-amber: rgba(217,154,43,.18);
  --ov-soft-purple: rgba(122,102,255,.18);
  --ov-chip-gray: rgba(255,255,255,.07); --ov-gold-soft: rgba(217,154,43,.1);
  --gauge-track: #1E2C49;
  --ov-shadow-card: 0 6px 24px rgba(0,0,0,.35); --ov-shadow-elev: 0 14px 34px rgba(0,0,0,.5);
  --surface-1: #121C31; --surface-2: #16233D;
  --surf-tint-blue: #132649; --surf-tint-mint: #10322A; --surf-tint-violet: #211C42; --surf-tint-amber: #2A2313;
  --surf-line-blue: color-mix(in srgb, var(--accent) 22%, transparent); --surf-line-mint: rgba(52,211,153,.24); --surf-line-violet: rgba(160,140,255,.26); --surf-line-amber: rgba(230,180,80,.26);
}

/* панель конструктора */
.ov2-bar { display:flex; align-items:center; justify-content:flex-end; gap:12px; min-height:30px; margin-bottom:12px; }
.ov2-hint { margin-right:auto; font-size:11.5px; color:var(--ink-3); }
.ov2-edit { display:inline-flex; align-items:center; gap:6px; padding:7px 13px; border-radius:10px; font-size:12.5px; font-weight:600; color:var(--ink-3); background:transparent; opacity:.75; transition:opacity .15s, background .15s, color .15s; }
.ov2-edit svg { width:14px; height:14px; }
.ov2-edit:hover { opacity:1; background:var(--bg-2); color:var(--ink); }
.ov2-edit.on { opacity:1; background:var(--ov-primary); color:#fff; }

/* 12-колоночная сетка */
.ov2-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:22px; max-width:1600px; align-items:start; column-count:initial; }
.ov-w { grid-column:span 6; min-width:0; margin:0; display:block; }
.ov-w.full { grid-column:span 12; }
@media (max-width:1180px){ .ov2-grid { grid-template-columns:repeat(6,1fr); } .ov-w, .ov-w.full { grid-column:span 6; } }
@media (max-width:760px){ .ov2-grid { grid-template-columns:1fr; gap:14px; } .ov-w, .ov-w.full { grid-column:span 1; } }
.ov-w-body { padding:18px; height:100%; }
/* full-контейнеры (KPI-hero, статус-алерты) — без своей карточки: их плитки сами по себе карточки */
.ov-w[data-w="kpi"] > .ov-w-body, .ov-w[data-w="attention"] > .ov-w-body { background:transparent; border:none; box-shadow:none; padding:0; }
.ov-w[data-w="kpi"]:hover > .ov-w-body, .ov-w[data-w="attention"]:hover > .ov-w-body { transform:none; box-shadow:none; }

/* режим конструктора */
.ov2-grid.editing .ov-w { outline:1.5px dashed var(--stroke); outline-offset:4px; border-radius:22px; background:transparent; border:none; padding:0; }
.ov2-grid.editing .ov-w.drag { opacity:.45; }
.ov2-grid.editing .ov-w.ov-over { outline-color:var(--ov-primary); }
.ov-w-bar { display:flex; align-items:center; gap:8px; padding:2px 6px 8px; font-size:12px; font-weight:650; color:var(--ink-3); }
.ov-w-grip { cursor:grab; display:grid; place-items:center; color:var(--ink-3); touch-action:none; }
.ov-w-grip svg { width:16px; height:16px; }
.ov-w-bar b { flex:1; color:var(--ink); }
.ov-w-rm { width:26px; height:26px; border-radius:8px; display:grid; place-items:center; color:var(--ink-3); margin-left:auto; }
.ov-w-rm:hover { background:var(--ov-soft-red); color:var(--ov-cat-red); }
.ov-w-rm svg { width:14px; height:14px; }
.ov2-add-tile { grid-column:1 / -1; display:flex; align-items:center; justify-content:center; gap:8px; padding:20px; border:1.5px dashed var(--stroke); border-radius:20px; color:var(--ink-3); font-size:13px; font-weight:600; background:transparent; transition:border-color .15s, color .15s, background .15s; }
.ov2-add-tile:hover { border-color:var(--ov-primary); color:var(--ov-primary); background:var(--ov-soft-blue); }
.ov2-add-tile svg { width:16px; height:16px; }

/* заголовок виджета (Fraunces только для заголовка, не для цифр) */
.ov2-card-hd { display:flex; align-items:center; gap:9px; font-family:var(--font-display); font-size:15.5px; font-weight:600; letter-spacing:-.01em; color:var(--ink); margin-bottom:15px; }
.ov2-card-hd svg { width:17px; height:17px; color:var(--ink-3); flex:none; }
.ov2-card-hd span { font-family:var(--font); font-weight:400; font-size:12px; color:var(--ink-3); }
.ov2-card-hd .btn { margin-left:auto; }
.ov2-empty { padding:24px 8px; text-align:center; color:var(--ink-3); font-size:12.5px; }
.ov2-clean { display:flex; align-items:center; justify-content:center; gap:8px; padding:18px; color:var(--ov-cat-green); font-size:13px; font-weight:600; }
.ov2-clean svg { width:17px; height:17px; }

/* ── HERO KPI ── */
.ovx-kpi { display:grid; grid-template-columns:minmax(300px,1.55fr) 1fr; gap:16px; }
@media (max-width:840px){ .ovx-kpi { grid-template-columns:1fr; } }
.ovx-hero { position:relative; overflow:hidden; text-align:left; display:flex; flex-direction:column; gap:5px; padding:22px 24px; border-radius:22px; color:#fff; border:none;
  background:linear-gradient(135deg,var(--ov-hero-a),var(--ov-hero-b) 60%,var(--ov-hero-c));
  box-shadow:0 16px 38px -16px rgba(11,30,69,.55); transition:transform .16s var(--ease-soft), box-shadow .16s var(--ease-soft); }
.ovx-hero::after { content:''; position:absolute; inset:0; background:radial-gradient(120% 90% at 88% -10%, color-mix(in srgb, var(--accent) 28%, transparent), transparent 55%); pointer-events:none; }
.ovx-hero:hover { transform:translateY(-1px); box-shadow:0 22px 48px -18px rgba(11,30,69,.62); }
/* ⟲ спокойный навюшный фон вместо видео-«вихря»: прячем небулу (у карточки уже ровный навюшный градиент),
   добавляем ОДИН мягкий медленно-дрейфующий блик — атмосфера без суматохи. */
.ovx-hero .ovm-poster, .ovx-hero .ovm-vid { display:none !important; }
.ovx-hero::before { content:''; position:absolute; inset:-28%; z-index:0; pointer-events:none;
  background:radial-gradient(44% 56% at 26% 36%, rgba(104,150,238,.18), transparent 72%);
  filter:blur(30px); animation:ovxDrift 34s ease-in-out infinite alternate; }
@keyframes ovxDrift { from { transform:translate3d(-6%,-4%,0) scale(1.05); } to { transform:translate3d(8%,6%,0) scale(1.16); } }
@media (prefers-reduced-motion:reduce){ .ovx-hero::before { animation:none; } }
.ovx-hero-top { display:flex; align-items:center; gap:10px; position:relative; z-index:1; }
.ovx-hero-lbl { font-size:12.5px; font-weight:500; color:rgba(224,235,255,.82); }
.ovx-hero-num { font-size:44px; font-weight:700; line-height:1.05; letter-spacing:-.02em; font-variant-numeric:tabular-nums; position:relative; z-index:1; }
.ovx-hero-sub { font-size:12.5px; color:rgba(208,223,255,.72); margin-bottom:10px; position:relative; z-index:1; }
.ovx-bars { display:flex; align-items:flex-end; gap:5px; height:54px; margin-top:auto; position:relative; z-index:1; }
.ovx-bar { flex:1; height:100%; display:flex; align-items:flex-end; background:rgba(255,255,255,.05); border-radius:5px; overflow:hidden; }
.ovx-bar i { display:block; width:100%; background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(255,255,255,.2)); border-radius:5px; transition:height .6s var(--ease-spring); }
.ovx-bar.now i { background:linear-gradient(180deg,#fff,color-mix(in srgb,var(--accent) 50%,#fff)); }
.ovx-bar.z { background:rgba(255,255,255,.035); }   /* день без новых лидов — почти прозрачный трек, без «пустого квадрата» */
/* нулевое состояние: спокойная базовая линия + подпись вместо 10 пустых квадратиков */
.ovx-bars.is-empty { align-items:center; justify-content:flex-start; gap:0; }
.ovx-bars-line { position:absolute; left:0; right:0; bottom:10px; height:1px; background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.28),rgba(255,255,255,.05)); }
.ovx-bars-note { font-size:11.5px; color:rgba(255,255,255,.5); letter-spacing:.01em; }
.ovx-hero .ov-delta { background:rgba(255,255,255,.14); color:#CFE0FF; }
.ovx-hero .ov-delta.up { color:#7EE0B4; background:rgba(126,224,180,.16); }
.ovx-hero .ov-delta.down { color:#FF9E96; background:rgba(255,158,150,.16); }
.ovx-hero .ov-delta.flat { color:#CFE0FF; background:rgba(255,255,255,.12); }

.ovx-kcards { display:flex; flex-direction:column; gap:12px; }
.ovx-kcard { display:flex; align-items:center; gap:13px; text-align:left; padding:14px 16px; border-radius:16px; background:var(--card); border:1px solid var(--stroke); box-shadow:var(--ov-shadow-card); transition:transform .16s var(--ease-soft), box-shadow .16s var(--ease-soft); }
.ovx-kcard:hover { transform:translateY(-1px); box-shadow:var(--ov-shadow-elev); }
.ovx-kc-ic { flex:none; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; box-shadow:none; }
.ovx-kc-ic svg { width:19px; height:19px; }
.ovx-kc-ic.cat-blue { background:var(--ov-soft-blue); color:var(--ov-cat-blue); }
.ovx-kc-ic.cat-green { background:var(--ov-soft-green); color:var(--ov-cat-green); }
.ovx-kc-ic.cat-purple { background:var(--ov-soft-purple); color:var(--ov-cat-purple); }
.ovx-kc-b { display:flex; flex-direction:column; min-width:0; line-height:1.25; }
.ovx-kc-v { font-size:24px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.ovx-kc-k { font-size:12.5px; font-weight:600; color:var(--ink-2); }
.ovx-kc-s { font-size:11px; color:var(--ink-3); }

/* ── СТАТУС-АЛЕРТЫ (внимание) ── */
.ov2-attn { display:grid; grid-template-columns:repeat(auto-fit,minmax(235px,1fr)); gap:14px; }
.ov2-att { display:flex; align-items:center; gap:13px; padding:15px 16px; border-radius:16px; border:1px solid var(--stroke); background:var(--card); box-shadow:var(--ov-shadow-card); text-align:left; transition:transform .16s var(--ease-soft), box-shadow .16s var(--ease-soft); }
.ov2-att:hover { transform:translateY(-1px); box-shadow:var(--ov-shadow-elev); }
.ov2-att-ic { flex:none; width:40px; height:40px; border-radius:12px; display:grid; place-items:center; box-shadow:none; background:var(--bg-2); }
.ov2-att-ic svg { width:19px; height:19px; }
.ov2-att.bad .ov2-att-ic { background:var(--ov-soft-red); color:var(--ov-cat-red); }
.ov2-att.warn .ov2-att-ic { background:var(--ov-soft-amber); color:var(--ov-cat-amber); }
.ov2-att.ok .ov2-att-ic { background:var(--ov-soft-green); color:var(--ov-cat-green); }
.ov2-att-b { display:flex; flex-direction:column; min-width:0; line-height:1.2; }
.ov2-att-n { font-size:22px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.ov2-att-k { font-size:11.5px; color:var(--ink-3); }
.ov2-att-who { margin-left:auto; font-size:11.5px; font-weight:600; color:var(--ink-2); background:var(--ov-chip-gray); border:none; border-radius:999px; padding:4px 11px; flex:none; }
.ov2-att-go { flex:none; display:grid; place-items:center; color:var(--ink-3); }
.ov2-att-go svg { width:16px; height:16px; }
.ov2-att-who + .ov2-att-go { margin-left:2px; }
.ov2-att-b + .ov2-att-go { margin-left:auto; }

/* ── ДОНАТ статусов ── */
.ov2-donut { display:flex; align-items:center; gap:22px; }
.ov2-donut-c { position:relative; width:164px; height:164px; flex:none; }
.ov2-donut-c svg { width:100%; height:100%; }
.ovx-donut-seg { transition:stroke-dashoffset .7s var(--ease-soft); }
.ov2-donut-mid { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.ov2-donut-mid b { font-size:32px; font-weight:700; color:var(--ink); line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.ov2-donut-mid i { font-size:11.5px; color:var(--ink-3); font-style:normal; margin-top:2px; }
.ov2-donut-leg { flex:1; display:flex; flex-direction:column; gap:2px; min-width:0; }
.ov2-dl-row { display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--ink-2); background:none; border:none; cursor:pointer; text-align:left; padding:6px 6px; border-radius:8px; transition:background .14s; }
.ov2-dl-row:hover { background:var(--bg-2); }
.ov2-dl-row i { width:9px; height:9px; border-radius:3px; flex:none; }
.ov2-dl-row span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ov2-dl-row b { margin-left:auto; color:var(--ink); font-weight:700; font-variant-numeric:tabular-nums; }
@media (max-width:440px){ .ov2-donut { flex-direction:column; } }

/* ── ЗАДАЧИ ── */
.ov2-task { display:flex; align-items:center; gap:12px; min-height:44px; padding:7px 8px; border-radius:12px; border-top:none; transition:background .14s; }
.ov2-task:hover { background:var(--bg-2); }
.ov2-task-ck { flex:none; width:22px; height:22px; border-radius:50%; border:2px solid var(--stroke); background:var(--card); display:grid; place-items:center; color:transparent; transition:all .15s; }
.ov2-task-ck svg { width:12px; height:12px; }
.ov2-task-ck:hover { border-color:var(--ov-cat-green); color:var(--ov-cat-green); }
.ov2-task-ck.add { border-style:dashed; border-color:color-mix(in srgb,var(--ov-cat-purple) 45%,var(--stroke)); color:var(--ov-cat-purple); }
.ov2-task-ck.add:hover { border-color:var(--ov-cat-purple); color:var(--ov-cat-purple); }
.ov2-task-t { flex:1; font-size:13.5px; color:var(--ink); min-width:0; }
.ov2-task-t i { display:block; font-size:11px; font-style:normal; color:var(--ink-3); margin-top:1px; }
.ov2-task-t i.over { color:var(--ov-cat-red); }
.ov2-task.sug { background:var(--ov-soft-purple); padding-left:10px; }
.ov2-task.sug .ov2-task-t { color:var(--ink-2); }
.ov2-task.sug .ov2-task-t i { color:var(--ov-cat-purple); font-weight:600; }

/* ── ВСТРЕЧИ ── */
.ov2-meet { display:flex; align-items:center; gap:12px; min-height:44px; padding:7px 8px; border-radius:12px; border-top:none; transition:background .14s; }
.ov2-meet:hover { background:var(--bg-2); }
.ov2-meet-tm { flex:none; width:56px; text-align:center; }
.ov2-meet-tm b { font-size:14px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.ov2-meet-tm i { display:block; font-size:10px; font-style:normal; color:var(--ink-3); }
.ov2-meet-b { flex:1; min-width:0; }
.ov2-meet-n { font-size:13.5px; font-weight:600; color:var(--ink); }
.ov2-meet-k { font-size:11.5px; color:var(--ink-3); }

/* ── АКТИВНОСТЬ ── */
.ov2-act { display:flex; align-items:center; gap:11px; padding:9px 4px; border-top:1px solid var(--stroke-soft); }
.ov2-act:first-of-type { border-top:none; }
.ov2-act-ic { flex:none; width:32px; height:32px; border-radius:10px; display:grid; place-items:center; background:var(--bg-2); color:var(--ink-3); }
.ov2-act-ic svg { width:15px; height:15px; }
.ov2-act.ok .ov2-act-ic { background:var(--ov-soft-green); color:var(--ov-cat-green); }
.ov2-act.warn .ov2-act-ic { background:var(--ov-soft-amber); color:var(--ov-cat-amber); }
.ov2-act-t { flex:1; min-width:0; font-size:12.5px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ov2-act-tm { flex:none; font-size:10.5px; color:var(--ink-3); }

/* ── ЛИДЕРБОРД ── */
.ovx-board { display:flex; flex-direction:column; }
.ovx-brow { display:flex; align-items:center; gap:13px; min-height:54px; padding:9px 12px; border-radius:14px; text-align:left; border-top:1px solid var(--stroke-soft); transition:background .14s; }
.ovx-brow:first-child { border-top:none; }
.ovx-brow:hover { background:var(--bg-2); }
.ovx-brow.top { background:var(--ov-gold-soft); border-top:none; }
.ovx-brank { flex:none; width:20px; text-align:center; font-size:12.5px; font-weight:700; color:var(--ink-3); font-variant-numeric:tabular-nums; }
.ovx-brow.top .ovx-brank { color:var(--ov-cat-amber); }
.ovx-bava { flex:none; width:32px; height:32px; border-radius:50%; overflow:hidden; background:linear-gradient(135deg,var(--ov-primary),var(--ov-cat-purple)); color:#fff; display:grid; place-items:center; font-size:12px; font-weight:700; }
.ovx-bava img { width:100%; height:100%; object-fit:cover; }
.ovx-bname { flex:1; min-width:0; font-size:13.5px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ovx-bcrown { flex:none; display:grid; place-items:center; color:var(--ov-cat-amber); }
.ovx-bcrown svg { width:16px; height:16px; }
.ovx-bval { flex:none; font-size:16px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; min-width:22px; text-align:right; }

/* ── ГОРЯЧИЕ ЛИДЫ (2×2) ── */
.ovx-hotgrid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
@media (max-width:440px){ .ovx-hotgrid { grid-template-columns:1fr; } }
.ovx-hc { display:flex; flex-direction:column; gap:12px; padding:14px; border-radius:16px; border:1px solid var(--stroke); background:var(--card); box-shadow:var(--ov-shadow-card); cursor:pointer; transition:transform .16s var(--ease-soft), box-shadow .16s var(--ease-soft), border-color .16s; }
.ovx-hc:hover { transform:translateY(-2px); box-shadow:var(--ov-shadow-elev); border-color:color-mix(in srgb,#EF4F3D 40%,var(--stroke)); }
.ovx-hc-top { display:flex; align-items:center; gap:11px; }
.ovx-hc-ring { position:relative; width:44px; height:44px; flex:none; }
.ovx-hc-ring svg { width:100%; height:100%; }
.ovx-hc-ring .hc-bg { fill:none; stroke:var(--gauge-track); stroke-width:4; }
.ovx-hc-ring .hc-fg { fill:none; stroke:#EF4F3D; stroke-width:4; stroke-linecap:round; transition:stroke-dashoffset .7s var(--ease-soft); }
.ovx-hc-ring b { position:absolute; inset:0; display:grid; place-items:center; font-size:13px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.ovx-hc-id { min-width:0; }
.ovx-hc-nm { font-size:13.5px; font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ovx-hc-loc { font-size:11px; color:var(--ink-3); }
.ovx-hc-acts { display:flex; align-items:center; gap:8px; }
.ovx-hc-btn { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:var(--bg-2); color:var(--ink-2); transition:background .14s, color .14s; }
.ovx-hc:hover .ovx-hc-btn { background:var(--ov-soft-blue); color:var(--ov-cat-blue); }
.ovx-hc-btn svg { width:15px; height:15px; }
.ovx-hc-arrow { margin-left:auto; display:grid; place-items:center; color:var(--ink-3); }
.ovx-hc-arrow svg { width:16px; height:16px; }

/* ── ЦЕЛЬ МЕСЯЦА (gauge) ── */
.ov2-gauge-wrap { position:relative; text-align:center; padding:8px 0 2px; }
.ov-gauge { width:190px; max-width:100%; height:auto; margin:0 auto; display:block; }
.ov-gauge path[stroke^="url"] { transition:stroke-dasharray .7s var(--ease-soft); }
.ov2-gauge-c { margin-top:-22px; }
.ov2-gauge-c b { font-size:34px; font-weight:700; color:var(--ink); line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.ov2-gauge-c i { display:block; font-size:11.5px; color:var(--ink-3); font-style:normal; }
.ov2-gauge-pct { font-size:12.5px; font-weight:700; color:var(--ov-primary); margin-top:5px; font-variant-numeric:tabular-nums; }
.ov2-goal-note { text-align:center; font-size:12px; color:var(--ink-2); font-weight:600; margin-top:8px; }

/* горизонтальные списки лидов (свежие/чейны/гео/брокеры) */
.ov2-lrow { display:flex; align-items:center; gap:11px; padding:9px 6px; border-top:1px solid var(--stroke-soft); border-radius:10px; }
.ov2-lrow:first-of-type { border-top:none; }
.ov2-lrow-b { flex:1; min-width:0; }
.ov2-lrow-n { font-size:13.5px; font-weight:600; color:var(--ink); }
.ov2-lrow-s { font-size:11px; color:var(--ink-3); }
.ov2-lrow-t { font-size:10.5px; color:var(--ink-3); flex:none; }

/* ── тёмная тема: нейтрализуем устаревший «керамический» белый градиент карточек ── */
html[data-night] .ov-w:not([class*="ov-skin-"]) .ov-w-body,
html[data-night] .ov-w.ov-skin-clean .ov-w-body {
  background: var(--card); border:1px solid var(--stroke);
  box-shadow: var(--ov-shadow-card);
}
html[data-night] .ov-w[data-w="kpi"] > .ov-w-body,
html[data-night] .ov-w[data-w="attention"] > .ov-w-body { background:transparent; border:none; box-shadow:none; }
html[data-night] .ov2-task-ck, html[data-night] .ovx-hc-ring .hc-bg { }

/* ============ Карточка лида: Файлы и голосовые ============ */
.lc-fv-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 6px 0 10px; }
.lc-fv-hint { font-size: 11px; margin-left: auto; }
#lcFVMic.rec { background: var(--bad); color: #fff; border-color: var(--bad); animation: tkpulse 1.1s ease-in-out infinite; }
#lcFVMic.busy { opacity: .7; pointer-events: none; }
.lc-fv-prog { font-size: 11.5px; color: var(--accent); background: var(--blue-100); border: 1px solid var(--accent-soft-bd); border-radius: 9px; padding: 7px 11px; margin-bottom: 10px; }
.lc-fv-empty { display: flex; align-items: center; gap: 9px; font-size: 12px; color: var(--ink-3); background: var(--bg-2); border: 1px dashed var(--stroke); border-radius: 12px; padding: 14px 15px; line-height: 1.5; }
.lc-fv-empty svg { width: 18px; height: 18px; flex: 0 0 18px; color: var(--accent); opacity: .8; }
.lc-fv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 10px; margin-bottom: 4px; }
.lc-fv-tile { position: relative; display: flex; flex-direction: column; gap: 7px; padding: 9px; border: 1px solid var(--stroke); border-radius: 13px; background: var(--card); transition: box-shadow .15s, transform .15s, border-color .15s; }
.lc-fv-tile:hover { box-shadow: 0 8px 20px -12px rgba(16, 43, 92, .35); border-color: var(--accent-soft-bd); }
.lc-fv-thumb { display: block; border-radius: 9px; overflow: hidden; height: 84px; background: var(--bg-2); }
.lc-fv-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.lc-fv-thumb.ic { display: grid; place-items: center; background: var(--blue-100); }
.lc-fv-thumb.ic svg { width: 30px; height: 30px; color: var(--accent); }
.lc-fv-thumb.ic.pdf { background: #FBE7E3; } .lc-fv-thumb.ic.pdf svg { color: #C0392B; }
.lc-fv-thumb.ic.deck { background: var(--warn-bg); } .lc-fv-thumb.ic.deck svg { color: var(--warn); }
.lc-fv-meta { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.lc-fv-nm { font-size: 12px; font-weight: 600; color: var(--navy-900); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lc-fv-nm:hover { color: var(--accent); }
.lc-fv-sub { font-size: 10.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.lc-fv-x { position: absolute; top: 5px; right: 5px; width: 24px; height: 24px; padding: 0; border-radius: 7px; background: rgba(255, 255, 255, .82); backdrop-filter: blur(4px); opacity: 0; transition: opacity .14s; }
.lc-fv-tile:hover .lc-fv-x, .lc-fv-voice:hover .lc-fv-x { opacity: 1; }
.lc-fv-x svg { width: 13px; height: 13px; }
.lc-fv-voices { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.lc-fv-voice { position: relative; display: flex; align-items: flex-start; gap: 10px; padding: 10px 11px; border: 1px solid var(--stroke); border-radius: 12px; background: var(--card); }
.lc-fv-play { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: var(--accent); border: none; cursor: pointer; transition: transform .12s, background .15s; }
.lc-fv-play:hover { transform: scale(1.06); background: var(--accent-2); }
.lc-fv-play svg { width: 15px; height: 15px; margin-left: 1px; }
.lc-fv-vbody { flex: 1; min-width: 0; }
.lc-fv-vhead { display: flex; align-items: center; gap: 9px; }
.lc-fv-dur { font-size: 12px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.lc-fv-tr { font-size: 12px; font-style: italic; color: var(--ink-2); line-height: 1.5; margin-top: 4px; }
.lc-fv-tr.muted { font-style: normal; color: var(--ink-3); }

/* ============ Свои поля: контролы 12 типов ============ */
.cf-cell.cf-t-textarea, .cf-cell.cf-t-multiselect { grid-column: 1 / -1; }
.cf-unit { position: relative; display: flex; align-items: center; }
.cf-unit input { width: 100%; padding-right: 40px; }
.cf-unit-s { position: absolute; right: 11px; font-size: 12px; font-weight: 600; color: var(--ink-3); pointer-events: none; }
.cf-link { position: relative; display: flex; align-items: center; gap: 6px; }
.cf-link input { flex: 1; min-width: 0; }
.cf-link-open { flex: 0 0 30px; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: var(--accent); background: var(--blue-100); border: 1px solid var(--accent-soft-bd); }
.cf-link-open svg { width: 15px; height: 15px; }
.cf-stars { display: flex; gap: 2px; padding: 3px 0; }
.cf-star { padding: 2px; background: none; border: none; cursor: pointer; color: #C9D3E3; transition: color .12s, transform .12s; }
.cf-star svg { width: 20px; height: 20px; fill: none; }
.cf-star:hover { transform: scale(1.12); }
.cf-star.on { color: var(--warn); } .cf-star.on svg { fill: currentColor; }
.cf-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0; }
.cf-chip { padding: 5px 11px; font-size: 12px; font-weight: 550; border-radius: 20px; border: 1px solid var(--stroke); background: var(--card); color: var(--ink-2); cursor: pointer; transition: all .13s; }
.cf-chip:hover { border-color: var(--hover-bd); }
.cf-chip.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.cf-bool { display: inline-flex; margin-top: 6px; }
.cf-cell textarea { width: 100%; }
.cf-cell { min-height: 0; }
.cf-tbadge { display: inline-block; margin-left: 8px; font-size: 10px; font-weight: 600; letter-spacing: .02em; color: var(--accent); background: var(--blue-100); border: 1px solid var(--accent-soft-bd); border-radius: 6px; padding: 1px 7px; vertical-align: middle; }

/* ============ Реанимация: конфигуратор кампании ============ */
.cmp-count { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 10px; padding: 9px 12px; margin: 4px 0 12px; }
.cmp-count b { font-size: 15px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.cmp-count-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 8px var(--ok); flex: 0 0 8px; }
.cmp-prev { margin-top: 8px; }
.cmp-prev-h { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 6px; }
.cmp-prev-h svg { width: 14px; height: 14px; color: var(--accent); }
.cmp-prev-b { font-size: 13px; line-height: 1.55; color: var(--ink); background: #E8F0E4; border: 1px solid #CCE0C4; border-radius: 12px 12px 12px 3px; padding: 11px 13px; }
.cmp-prev-empty { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-3); background: var(--bg-2); border: 1px dashed var(--stroke); border-radius: 10px; padding: 11px 13px; }
.cmp-prev-empty svg { width: 15px; height: 15px; flex: 0 0 15px; color: var(--accent); }
.cmp-card.sched { border-color: var(--accent-soft-bd); }
.cmp-sched { display: flex; align-items: center; gap: 6px; font-size: 11.8px; color: var(--accent); background: var(--blue-100); border: 1px solid var(--accent-soft-bd); border-radius: 9px; padding: 6px 10px; margin-top: 8px; }
.cmp-sched svg { width: 14px; height: 14px; flex: 0 0 14px; }
html[data-night] .cmp-prev-b { background: rgba(80, 140, 90, .16); border-color: rgba(120, 190, 130, .3); color: var(--ink); }

/* ═══════════════════════════════════════════════════════════════════════
   ОБЗОР v2 — иерархия поверхностей + фирменные композиции виджетов.
   Цель: убрать «одинаковые белые прямоугольники». Операционные виджеты —
   мягкий офф-вайт; интеллект/связь — семантичный тинт; hero — единственный тёмный якорь.
   ═══════════════════════════════════════════════════════════════════════ */
/* поверхности: тянем контраст фоном, границы приглушаем, тень — мягкая */
.ov-w-body.ov-surf-1 { background: var(--surface-1); border-color: color-mix(in srgb, var(--stroke) 55%, transparent); box-shadow: var(--ov-shadow-card); }
.ov-w-body.ov-surf-2 { background: var(--surface-2); border-color: color-mix(in srgb, var(--stroke) 70%, transparent); box-shadow: var(--ov-shadow-elev); }
.ov-w-body.ov-tint-blue   { background: var(--surf-tint-blue);   border-color: var(--surf-line-blue); }
.ov-w-body.ov-tint-mint   { background: var(--surf-tint-mint);   border-color: var(--surf-line-mint); }
.ov-w-body.ov-tint-violet { background: var(--surf-tint-violet); border-color: var(--surf-line-violet); }
.ov-w-body.ov-tint-amber  { background: var(--surf-tint-amber);  border-color: var(--surf-line-amber); }
.ov-w-body[class*="ov-tint-"] { box-shadow: var(--ov-shadow-card); }
/* сдержанный hover-lift (2px, ~160ms) только в обычном режиме */
.ov2-grid:not(.editing) .ov-w-body.ov-surf-1,
.ov2-grid:not(.editing) .ov-w-body.ov-surf-2,
.ov2-grid:not(.editing) .ov-w-body[class*="ov-tint-"] { transition: transform .16s var(--ease-soft), box-shadow .16s var(--ease-soft); }
.ov2-grid:not(.editing) .ov-w-body.ov-surf-1:hover,
.ov2-grid:not(.editing) .ov-w-body.ov-surf-2:hover,
.ov2-grid:not(.editing) .ov-w-body[class*="ov-tint-"]:hover { transform: translateY(-2px); box-shadow: var(--ov-shadow-elev); }
/* заголовки тинт-виджетов подсвечиваем в тон семейства */
.ov-tint-mint .ov2-card-hd svg { color: var(--ov-cat-green); }
.ov-tint-violet .ov2-card-hd svg { color: var(--ov-cat-purple); }
.ov-tint-blue .ov2-card-hd svg { color: var(--ov-cat-blue); }
.ov-tint-amber .ov2-card-hd svg { color: var(--ov-cat-amber); }

/* ── AI-инсайт-строка (общий примитив) ── */
.ov-insight { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 9px 12px; border-radius: 11px; background: color-mix(in srgb, var(--ov-cat-purple) 12%, transparent); font-size: 12px; font-weight: 600; color: var(--ov-cat-purple); }
.ov-insight svg { width: 15px; height: 15px; flex: none; }

/* ── СРАВНЕНИЕ: ИИ vs человек (горизонтальные бары) ── */
.ov-cmp { display: flex; flex-direction: column; gap: 13px; }
.ov-cmp-leg { display: flex; gap: 16px; font-size: 11px; color: var(--ink-3); }
.ov-cmp-key { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.ov-cmp-key i { width: 10px; height: 10px; border-radius: 3px; }
.ov-cmp-key.ai i { background: var(--ov-cat-purple); }
.ov-cmp-key.hu i { background: color-mix(in srgb, var(--ink-3) 55%, transparent); }
.ov-cmp-row { display: flex; flex-direction: column; gap: 5px; }
.ov-cmp-k { font-size: 12px; color: var(--ink-2); font-weight: 500; }
.ov-cmp-bars { display: flex; flex-direction: column; gap: 4px; }
.ov-cmp-bar { position: relative; display: flex; align-items: center; }
.ov-cmp-bar i { display: block; height: 9px; border-radius: 20px; transition: width .7s var(--ease-spring); }
.ov-cmp-bar.ai i { background: linear-gradient(90deg, var(--ov-cat-purple), color-mix(in srgb, var(--ov-cat-purple) 60%, #B7A6FF)); }
.ov-cmp-bar.hu i { background: color-mix(in srgb, var(--ink-3) 42%, transparent); }
.ov-cmp-bar b { margin-left: 9px; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ov-cmp-bar.ai b { color: var(--ov-cat-purple); }
.ov-cmp-bar.hu b { color: var(--ink-3); }

/* ── ИНФРА-МОНИТОР WhatsApp ── */
.ov-mon { display: flex; align-items: center; gap: 18px; }
.ov-mon-ring { position: relative; width: 76px; height: 76px; flex: none; }
.ov-mon-ring svg { width: 100%; height: 100%; }
.ov-mon-ring-c { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.ov-mon-ring-c b { font-size: 21px; font-weight: 800; color: var(--ink); line-height: 1; font-variant-numeric: tabular-nums; }
.ov-mon-ring-c b span { font-size: 11px; font-weight: 700; }
.ov-mon-ring-c i { font-size: 9px; font-style: normal; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; }
.ov-mon-score.ok .ov-mon-ring-c i { color: var(--ov-cat-green); }
.ov-mon-score.mid .ov-mon-ring-c i { color: var(--ov-cat-amber); }
.ov-mon-score.bad .ov-mon-ring-c i { color: var(--ov-cat-red); }
.ov-mon-score.bad .ov-ring circle:last-child { stroke: var(--ov-cat-red) !important; }
.ov-mon-side { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 11px; }
.ov-mon-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.ov-mon-stat { text-align: left; background: color-mix(in srgb, var(--card) 55%, transparent); border: 1px solid color-mix(in srgb, var(--ov-cat-green) 16%, transparent); border-radius: 11px; padding: 8px 11px; transition: border-color .14s; }
.ov-mon-stat:hover { border-color: var(--ov-cat-green); }
.ov-mon-stat b { display: block; font-size: 19px; font-weight: 800; color: var(--ink); line-height: 1.05; font-variant-numeric: tabular-nums; }
.ov-mon-stat i { font-size: 10.5px; font-style: normal; color: var(--ink-3); }
.ov-mon-rows { display: flex; flex-direction: column; gap: 6px; }
.ov-mon-r { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--ink-2); }
.ov-mon-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; }
.ov-mon-r.ok .ov-mon-dot { background: var(--ov-cat-green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ov-cat-green) 20%, transparent); }
.ov-mon-r.bad .ov-mon-dot { background: var(--ov-cat-amber); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ov-cat-amber) 20%, transparent); }
.ov-mon-r .ov-mon-t { flex: 1; }
.ov-mon-r b { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; }
@media (max-width: 400px) { .ov-mon { flex-direction: column; align-items: stretch; } }

/* ── ЗАГРУЗКА БРОКЕРОВ (капасити) ── */
.ov-caps { display: flex; flex-direction: column; gap: 4px; }
.ov-cap { display: flex; align-items: center; gap: 12px; padding: 8px 6px; border-radius: 12px; transition: background .14s; cursor: pointer; }
.ov-cap:hover { background: color-mix(in srgb, var(--ov-primary) 5%, transparent); }
.ov-cap-ava { flex: none; width: 34px; height: 34px; border-radius: 50%; overflow: hidden; background: linear-gradient(135deg, var(--ov-primary), var(--ov-cat-purple)); color: #fff; display: grid; place-items: center; font-size: 12px; font-weight: 700; }
.ov-cap-ava img { width: 100%; height: 100%; object-fit: cover; }
.ov-cap-b { flex: 1; min-width: 0; }
.ov-cap-top { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; }
.ov-cap-nm { flex: 1; min-width: 0; font-size: 13px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-cap-st { flex: none; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 8px; border-radius: 20px; }
.ov-cap-st.low { color: var(--ink-3); background: var(--ov-chip-gray); }
.ov-cap-st.norm { color: var(--ov-cat-green); background: var(--ov-soft-green); }
.ov-cap-st.high { color: var(--ov-cat-amber); background: var(--ov-soft-amber); }
.ov-cap-st.over { color: var(--ov-cat-red); background: var(--ov-soft-red); }
.ov-cap-track { height: 8px; border-radius: 20px; background: var(--gauge-track); overflow: hidden; }
.ov-cap-track i { display: block; height: 100%; border-radius: 20px; transition: width .6s var(--ease-spring); }
.ov-cap-track i.low { background: color-mix(in srgb, var(--ink-3) 55%, transparent); }
.ov-cap-track i.norm { background: var(--ov-cat-green); }
.ov-cap-track i.high { background: var(--ov-cat-amber); }
.ov-cap-track i.over { background: var(--ov-cat-red); }
.ov-cap-v { flex: none; font-size: 14px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.ov-cap-v i { font-size: 11px; font-weight: 600; font-style: normal; color: var(--ink-3); }

/* ── ЗАДАЧИ: секции ── */
.ov-sec { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); margin: 12px 4px 4px; }
.ov-sec:first-child { margin-top: 0; }
.ov-tk-flag { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--ov-cat-red); margin-right: 5px; vertical-align: middle; }
.ov2-task-t i svg { width: 12px; height: 12px; vertical-align: -2px; margin-right: 3px; }

/* ── АКТИВНОСТЬ: таймлайн ── */
.ov-tl { position: relative; padding-left: 6px; }
.ov-tl::before { content: ''; position: absolute; left: 21px; top: 14px; bottom: 14px; width: 2px; background: var(--stroke-soft); }
.ov-tl-i { position: relative; display: flex; align-items: flex-start; gap: 12px; padding: 7px 0; }
.ov-tl-node { position: relative; z-index: 1; flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; background: var(--surface-2); border: 1px solid var(--stroke-soft); color: var(--ink-3); box-shadow: 0 0 0 3px var(--surface-1); }
.ov-tl-node svg { width: 15px; height: 15px; }
.ov-tl-i.ok .ov-tl-node { background: var(--ov-soft-green); border-color: transparent; color: var(--ov-cat-green); }
.ov-tl-i.warn .ov-tl-node { background: var(--ov-soft-amber); border-color: transparent; color: var(--ov-cat-amber); }
.ov-tl-b { flex: 1; min-width: 0; padding-top: 2px; }
.ov-tl-t { display: block; font-size: 12.5px; color: var(--ink); line-height: 1.35; }
.ov-tl-tm { display: block; font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }

/* ── СВЕЖИЕ ЛИДЫ: свежесть ── */
.ov-lr { display: flex; align-items: center; gap: 11px; padding: 8px 6px; border-radius: 11px; cursor: pointer; transition: background .14s, opacity .2s; }
.ov-lr:hover { background: color-mix(in srgb, var(--ov-primary) 5%, transparent); }
.ov-lr-ava { position: relative; flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: var(--ink-2); background: var(--ov-chip-gray); }
.ov-lr.fresh .ov-lr-ava { color: #fff; background: linear-gradient(135deg, var(--ov-primary), var(--ov-cat-purple)); }
.ov-lr-dot { position: absolute; top: -1px; right: -1px; width: 10px; height: 10px; border-radius: 50%; background: var(--ov-cat-green); border: 2px solid var(--surface-1); }
.ov-lr-b { flex: 1; min-width: 0; }
.ov-lr-n { font-size: 13px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-lr-s { font-size: 11px; color: var(--ink-3); }
.ov-lr-t { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; color: var(--ink-3); }
.ov-lr-badge { font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--ov-cat-green); background: var(--ov-soft-green); border-radius: 20px; padding: 2px 6px; }
.ov-lr.stale { opacity: .5; }
.ov-lr.stale:hover { opacity: .8; }

/* ── ГЕО: мини-аналитика ── */
.ov-geos { display: flex; flex-direction: column; gap: 12px; }
.ov-geo { cursor: pointer; padding: 4px 6px; border-radius: 11px; transition: background .14s; }
.ov-geo:hover { background: color-mix(in srgb, var(--ov-cat-green) 6%, transparent); }
.ov-geo.top { background: var(--ov-soft-green); padding: 8px 10px; }
.ov-geo-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px; }
.ov-geo-nm { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ink); }
.ov-geo-crown { display: grid; place-items: center; color: var(--ov-cat-green); }
.ov-geo-crown svg { width: 13px; height: 13px; }
.ov-geo-v { font-size: 15px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.ov-geo-low { font-size: 10.5px; font-weight: 600; color: var(--ink-3); font-variant-numeric: normal; }
.ov-geo-track { height: 9px; border-radius: 20px; background: var(--gauge-track); overflow: hidden; }
.ov-geo-track i { display: block; height: 100%; border-radius: 20px; background: var(--ov-cat-green); transition: width .6s var(--ease-spring); }
.ov-geo-track i.low { background: repeating-linear-gradient(90deg, var(--ink-3) 0 3px, transparent 3px 6px); opacity: .4; }
.ov-geo-sub { font-size: 10.5px; color: var(--ink-3); margin-top: 4px; }

/* ── ЦЕПОЧКИ: секвенс-ноды ── */
.ov-chains { display: flex; flex-direction: column; gap: 8px; }
.ov-chain { padding: 11px 12px; border-radius: 13px; background: color-mix(in srgb, var(--card) 45%, transparent); border: 1px solid var(--stroke-soft); cursor: pointer; transition: border-color .14s, background .14s; }
.ov-chain:hover { border-color: var(--surf-line-blue); }
.ov-chain.on { background: var(--ov-soft-blue); border-color: var(--surf-line-blue); }
.ov-chain-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ov-chain-nm { font-size: 13px; font-weight: 650; color: var(--ink); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-chain-seq { display: flex; align-items: center; margin: 9px 0; }
.ov-seq-node { flex: none; width: 9px; height: 9px; border-radius: 50%; background: var(--stroke); }
.ov-seq-node.on { background: var(--ov-cat-blue); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ov-cat-blue) 22%, transparent); }
.ov-seq-link { flex: 1; height: 2px; background: var(--stroke-soft); min-width: 8px; max-width: 26px; }
.ov-chain.on .ov-seq-link { background: color-mix(in srgb, var(--ov-cat-blue) 35%, transparent); }
.ov-chain-meta { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-3); }
.ov-chain-meta span { opacity: .5; }

/* ── ЦЕЛЬ МЕСЯЦА: компактный прогресс-борд ── */
.ov-goal2 { display: flex; flex-direction: column; gap: 14px; }
.ov-goal2-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.ov-goal2-num { display: flex; align-items: baseline; gap: 4px; }
.ov-goal2-num b { font-size: 44px; font-weight: 800; color: var(--ink); line-height: .95; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.ov-goal2-num span { font-size: 18px; font-weight: 700; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.ov-goal2-lbl { text-align: right; font-size: 13px; font-weight: 700; color: var(--ov-primary); line-height: 1.2; }
.ov-goal2-lbl i { display: block; font-size: 11px; font-weight: 500; font-style: normal; color: var(--ink-3); margin-top: 2px; }
.ov-goal2-track { position: relative; height: 12px; border-radius: 20px; background: var(--gauge-track); overflow: visible; }
.ov-goal2-track i { display: block; height: 100%; border-radius: 20px; background: linear-gradient(90deg, var(--ov-primary), var(--ov-cat-purple)); transition: width .7s var(--ease-spring); }
.ov-goal2-proj { position: absolute; top: -3px; width: 2px; height: 18px; background: var(--ov-cat-green); border-radius: 2px; }
.ov-goal2-proj::after { content: ''; position: absolute; top: -3px; left: -2px; width: 6px; height: 6px; border-radius: 50%; background: var(--ov-cat-green); }
.ov-goal2-pace { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ov-goal2-p { text-align: center; padding: 10px 6px; border-radius: 12px; background: color-mix(in srgb, var(--card) 50%, transparent); }
.ov-goal2-p b { display: block; font-size: 22px; font-weight: 800; color: var(--ink); line-height: 1; font-variant-numeric: tabular-nums; }
.ov-goal2-p i { font-size: 10.5px; font-style: normal; color: var(--ink-3); }
.ov-goal2-note { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; padding: 8px 11px; border-radius: 10px; }
.ov-goal2-note svg { width: 15px; height: 15px; flex: none; }
.ov-goal2-note.ok { color: color-mix(in srgb, var(--ov-cat-green) 74%, #06170f); background: var(--ov-soft-green); }
.ov-goal2-note.warn { color: color-mix(in srgb, var(--ov-cat-amber) 56%, #3a2200); background: var(--ov-soft-amber); }

/* ── ГОРЯЧИЕ ЛИДЫ: рельс срочности ── */
.ov-urg { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 460px) { .ov-urg { grid-template-columns: 1fr; } }
.ov-urg-c { position: relative; overflow: hidden; padding: 13px 14px 12px 16px; border-radius: 15px; background: var(--surface-2); border: 1px solid var(--stroke-soft); cursor: pointer; transition: transform .16s var(--ease-soft), box-shadow .16s var(--ease-soft); }
.ov-urg-c:hover { transform: translateY(-2px); box-shadow: var(--ov-shadow-elev); }
.ov-urg-rail { position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: linear-gradient(180deg, #FF6A57, #EF4F3D); opacity: calc(.28 + var(--u, .5) * .72); }
.ov-urg-rail::after { content: ''; position: absolute; inset: 0; box-shadow: 0 0 14px 1px rgba(239, 79, 61, calc(var(--u, .5) * .5)); }
.ov-urg-h { display: flex; align-items: center; gap: 10px; }
.ov-urg-ava { flex: none; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 11.5px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #FF7A68, #E8442F); }
.ov-urg-id { flex: 1; min-width: 0; }
.ov-urg-nm { font-size: 13.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-urg-meta { display: block; font-size: 10.5px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ov-urg-score { flex: none; font-size: 16px; font-weight: 800; color: #E8442F; font-variant-numeric: tabular-nums; }
.ov-urg-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 11px; }
.ov-urg-ago { font-size: 10.5px; color: var(--ink-3); }
.ov-urg-acts { display: flex; align-items: center; gap: 6px; }
.ov-urg-btn { width: 28px; height: 28px; border-radius: 9px; display: grid; place-items: center; background: var(--ov-chip-gray); color: var(--ink-2); transition: background .14s, color .14s; }
.ov-urg-btn:hover { background: var(--ov-primary); color: #fff; }
.ov-urg-btn svg { width: 14px; height: 14px; }
.ov-urg-open { display: grid; place-items: center; color: var(--ink-3); }
.ov-urg-open svg { width: 15px; height: 15px; }

/* ── ПУСТЫЕ СОСТОЯНИЯ (компактные, без резерва высоты) ── */
.ov-empty2 { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 18px 12px 8px; }
.ov-empty2-ic { width: 40px; height: 40px; border-radius: 13px; display: grid; place-items: center; background: var(--ov-chip-gray); color: var(--ink-3); margin-bottom: 2px; }
.ov-empty2-ic svg { width: 20px; height: 20px; }
.ov-empty2-t { font-size: 13.5px; font-weight: 700; color: var(--ink); }
.ov-empty2-s { font-size: 11.5px; color: var(--ink-3); line-height: 1.4; max-width: 250px; }
.ov-empty2-btn { margin-top: 8px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ov-primary); background: var(--ov-soft-blue); border-radius: 9px; padding: 7px 13px; transition: background .14s; }
.ov-empty2-btn:hover { background: color-mix(in srgb, var(--ov-primary) 16%, transparent); }
.ov-empty2-btn svg { width: 14px; height: 14px; }

/* приток лидов = ноль: компактная метрика вместо пустого графика */
.ov-metric-empty { display: flex; align-items: center; gap: 14px; padding: 6px 4px; }
.ov-metric-empty-n { font-size: 40px; font-weight: 800; color: var(--ink-3); line-height: 1; font-variant-numeric: tabular-nums; opacity: .5; }
.ov-metric-empty-b { flex: 1; min-width: 0; }
.ov-metric-empty-b b { display: block; font-size: 13.5px; font-weight: 700; color: var(--ink); }
.ov-metric-empty-b i { font-size: 11px; font-style: normal; color: var(--ink-3); }
.ov-metric-empty-btn { flex: none; display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--ov-primary); background: var(--ov-soft-blue); border-radius: 9px; padding: 7px 11px; }
.ov-metric-empty-btn svg { width: 13px; height: 13px; }

/* база кейсов пуста: призрачная стопка документов */
.ov-ghost { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; padding: 16px 14px 8px; }
.ov-ghost-stack { position: relative; width: 46px; height: 46px; display: grid; place-items: center; color: var(--ink-3); margin-bottom: 4px; }
.ov-ghost-stack svg { position: relative; z-index: 2; width: 26px; height: 26px; opacity: .55; }
.ov-ghost-p { position: absolute; width: 30px; height: 38px; border-radius: 6px; border: 1.5px solid var(--stroke); background: var(--surface-2); }
.ov-ghost-p:nth-child(2) { transform: rotate(-8deg) translate(-6px, 2px); z-index: 0; opacity: .55; }
.ov-ghost-p:nth-child(3) { transform: rotate(7deg) translate(6px, 1px); z-index: 1; opacity: .75; }
.ov-ghost-t { font-size: 13.5px; font-weight: 700; color: var(--ink); }
.ov-ghost-s { font-size: 11.5px; color: var(--ink-3); line-height: 1.4; max-width: 260px; }

/* ===== Ф1: панель дизайн-движка подборок (конструктор + модалка) ===== */
.ds-fold { border: 1px solid var(--stroke); border-radius: 14px; margin: 6px 0 4px; overflow: hidden; background: var(--card, #fff); }
.ds-fold-h { display: flex; align-items: center; gap: 8px; width: 100%; border: 0; background: transparent; cursor: pointer; padding: 12px 14px; font: inherit; font-weight: 700; font-size: 13.5px; color: var(--ink); }
.ds-fold-h svg { width: 16px; height: 16px; flex: 0 0 auto; color: var(--brand, var(--accent)); }
.ds-fold-h .ds-hint { margin-left: 4px; font-weight: 500; font-size: 11.5px; color: var(--ink-3); }
.ds-fold-h .ds-caret { margin-left: auto; display: flex; transition: transform .25s var(--ease-spring, ease); transform: rotate(90deg); }
.ds-fold-h .ds-caret svg { width: 15px; height: 15px; color: var(--ink-3); }
.ds-fold.open .ds-fold-h .ds-caret { transform: rotate(-90deg); }
.ds-fold-b { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s var(--ease-spring, ease); }
.ds-fold.open .ds-fold-b { grid-template-rows: 1fr; }
.ds-fold-b > * { min-height: 0; overflow: hidden; }
.ds-fold-b .ds-grid { padding: 4px 14px 10px; }
.ds-fold.open .ds-fold-b > * { overflow: visible; }
.ds-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px; }
.ds-ax label { display: block; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin: 0 0 5px 2px; }
.ds-note { padding: 0 14px 14px; font-size: 11.5px; color: var(--ink-3); line-height: 1.5; }
.ds-modal .ds-lead { font-size: 13.5px; color: var(--ink-2, var(--ink)); line-height: 1.55; margin-bottom: 16px; }
.ds-modal .ds-grid { margin-bottom: 8px; }
.ds-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--stroke); }
@media (max-width: 560px) { .ds-grid { grid-template-columns: 1fr; } }

/* ═══════════════════════════════════════════════════════════════════════
   ОБЗОР v3 — углубление иерархии/контраста/плотности + motion-слой.
   Строится ПОВЕРХ v2 (surfaces/архетипы). Блок в конце файла — намеренно
   перекрывает предыдущие правила по каскаду.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  --r-xl: 22px; --r-card: 18px; --r-analytics: 16px; --r-nested: 12px; --r-chip: 9px; --r-pill: 999px;
  --shadow-subtle: 0 1px 2px rgba(20,33,58,.045), 0 2px 8px -3px rgba(20,33,58,.07), 0 8px 22px -12px rgba(20,33,58,.13);
  --shadow-elevated: 0 2px 6px -2px rgba(20,33,58,.10), 0 16px 40px -16px rgba(20,33,58,.26);
  --shadow-hero: 0 24px 60px -22px rgba(11,30,69,.60);
}
html[data-night] {
  --shadow-subtle: 0 1px 2px rgba(0,0,0,.30), 0 6px 18px -10px rgba(0,0,0,.45);
  --shadow-elevated: 0 12px 32px -14px rgba(0,0,0,.55);
  --shadow-hero: 0 18px 44px -18px rgba(0,0,0,.7);
}

/* ── асимметр. сетка: dense-упаковка + пер-виджет спаны (стаггер, но выровнено) ── */
.ov2-grid { grid-auto-flow: row dense; }
/* ⭐ МОЗАИКА: ЕДИНАЯ grid-раскладка в правке И просмотре (WYSIWYG). Мелкая строчная сетка (10px) → высоту
   виджета задаём grid-row span (JS ovMasonry по контенту ИЛИ явная при ресайзе). Интервалы (gap) сохраняются
   всегда — виджеты не налезают друг на друга; ширина = span колонок. */
.ov2-grid.ov-masonry { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); grid-auto-rows: 1px; column-gap: 14px; row-gap: 0; grid-auto-flow: row; }
.ov2-grid.ov-masonry .ov-w, .ov2-grid.ov-masonry .ov-w[class*="ov-span-"] { grid-column: span 1; align-self: start; }
.ov2-grid.ov-masonry .ov-w.ov-cw-2 { grid-column: span 2; }
.ov2-grid.ov-masonry .ov-w.ov-cw-3 { grid-column: span 3; }
.ov2-grid.ov-masonry .ov-w.full, .ov2-grid.ov-masonry .ov-w.ov-cw-full { grid-column: 1 / -1; }
@media (max-width: 1180px) { .ov2-grid.ov-masonry .ov-w.ov-cw-3 { grid-column: span 2; } }
@media (max-width: 760px) { .ov2-grid.ov-masonry { grid-template-columns: 1fr; grid-auto-rows: auto; } .ov2-grid.ov-masonry .ov-w, .ov2-grid.ov-masonry .ov-w[class*="ov-cw-"] { grid-column: 1 / -1 !important; grid-row: auto !important; } }
/* пользовательская мин-высота тела (ресайз по вертикали) */
.ov-w-body { min-height: var(--ovh, auto); }
/* ── HR · подбор (бета) ── */
.beta-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: #B45309; background: color-mix(in srgb, #E5844B 15%, transparent); padding: 3px 9px; border-radius: 20px; vertical-align: middle; margin-left: 8px; }
.plo-beta { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 4px; padding: 9px 14px; border-radius: 12px; background: color-mix(in srgb, #E5844B 12%, transparent); border: 1px solid color-mix(in srgb, #E5844B 30%, transparent); font-size: 12.5px; line-height: 1.4; color: var(--ink); }
.plo-beta svg { width: 15px; height: 15px; color: #E5844B; flex: none; }
.plo-beta b { color: var(--navy-900); }
.hr-hero { margin-bottom: 16px; }
.hr-hero-t { display: flex; align-items: center; gap: 10px; font-family: var(--font-display); font-size: 22px; font-weight: 600; color: var(--navy-900); }
.hr-hero-t svg { width: 22px; height: 22px; color: var(--accent); }
.hr-hero-s { font-size: 13px; color: var(--ink-2); line-height: 1.55; margin-top: 8px; max-width: 720px; }
.hr-board { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 16px; opacity: .72; }
.hr-col { background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 14px; padding: 12px; min-height: 160px; }
.hr-col-h { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; font-weight: 650; color: var(--navy-900); margin-bottom: 10px; }
.hr-col-h span { font-size: 11px; color: var(--ink-3); background: var(--card); border-radius: 20px; padding: 1px 8px; }
.hr-col-empty { font-size: 11.5px; color: var(--ink-3); text-align: center; padding: 24px 0; border: 1px dashed var(--stroke); border-radius: 10px; }
.hr-plan-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.hr-plan-list li { display: flex; align-items: center; gap: 9px; font-size: 13px; color: var(--ink-2); }
.hr-plan-list li svg { width: 15px; height: 15px; color: var(--accent); flex: none; }
@media (max-width: 860px) { .hr-board { grid-template-columns: 1fr 1fr; } }
/* ── ШТАБ РУКОВОДИТЕЛЯ ── */
.ov-tp { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ov-tp th { text-align: left; font-size: 10.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: var(--ink-3); padding: 4px 6px; border-bottom: 1px solid var(--stroke); }
.ov-tp th:not(:first-child), .ov-tp td:not(:first-child) { text-align: center; }
.ov-tp td { padding: 7px 6px; border-bottom: 1px solid var(--bg-2); color: var(--navy-900); font-variant-numeric: tabular-nums; }
.ov-tp tr:last-child td { border-bottom: 0; }
.ov-tp-nm { font-weight: 600; text-align: left !important; display: flex; align-items: center; gap: 6px; }
.ov-tp-hot { font-style: normal; font-size: 10px; color: #E5484D; font-weight: 700; }
.ov-tp-v { display: inline-block; font-size: 10.5px; font-weight: 650; padding: 2px 8px; border-radius: 20px; }
.ov-tp-v.ok { background: color-mix(in srgb, #2FA98C 14%, transparent); color: #1E7A64; }
.ov-tp-v.warn { background: color-mix(in srgb, #E5844B 16%, transparent); color: #B45309; }
.ov-tp-v.mut { background: var(--bg-2); color: var(--ink-3); }
.ov-sig-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 10px; }
.ov-sig { display: flex; align-items: center; gap: 11px; text-align: left; border: 1px solid var(--stroke); border-left: 3px solid var(--ink-3); border-radius: 12px; padding: 11px 13px; background: var(--card); cursor: pointer; font-family: inherit; transition: transform .14s, box-shadow .14s, border-color .14s; }
.ov-sig:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); }
.ov-sig.crit { border-left-color: #E5484D; background: linear-gradient(180deg, color-mix(in srgb, #E5484D 6%, var(--card)), var(--card) 60%); }
.ov-sig.warn { border-left-color: #E5844B; }
.ov-sig.ok { border-left-color: #2FA98C; }
.ov-sig.info { border-left-color: var(--accent); }
.ov-sig-ic { flex: none; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--bg-2); color: var(--ink-2); }
.ov-sig.crit .ov-sig-ic { background: color-mix(in srgb, #E5484D 12%, transparent); color: #E5484D; }
.ov-sig.warn .ov-sig-ic { background: color-mix(in srgb, #E5844B 14%, transparent); color: #B45309; }
.ov-sig.ok .ov-sig-ic { background: color-mix(in srgb, #2FA98C 14%, transparent); color: #1E7A64; }
.ov-sig.info .ov-sig-ic { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.ov-sig-ic svg { width: 17px; height: 17px; }
.ov-sig-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ov-sig-b b { font-size: 13px; color: var(--navy-900); font-weight: 650; }
.ov-sig-b i { font-style: normal; font-size: 11.5px; color: var(--ink-3); }
.ov-sig-go { flex: none; color: var(--ink-3); opacity: .5; }
.ov-sig-go svg { width: 15px; height: 15px; }
/* ручка ресайза — ТОЛЬКО в режиме «Настроить», крупная и явно видимая */
.ov-w { position: relative; }
.ov-w-rz { display: none; }
.ov2-grid.editing .ov-w-rz { display: flex; align-items: center; justify-content: center; position: absolute; right: 6px; bottom: 6px; width: 26px; height: 26px; cursor: nwse-resize; z-index: 6; border-radius: 8px; background: var(--accent); box-shadow: 0 4px 12px -3px color-mix(in srgb, var(--accent) 60%, transparent); transition: transform var(--dur-fast); touch-action: none; }
.ov2-grid.editing .ov-w-rz::before { content: ''; width: 9px; height: 9px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; margin: -2px -2px 0 0; }
.ov2-grid.editing .ov-w-rz:hover { transform: scale(1.1); }
.ov-w.ov-rzing { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: calc(var(--r-card) + 2px); z-index: 7; }
.ov-w.ov-rzing .ov-w-body { box-shadow: var(--shadow-elevated); }
body.ov-rz-cursor, body.ov-rz-cursor * { cursor: nwse-resize !important; user-select: none; }
.ov-w.ov-span-4 { grid-column: span 4; }
.ov-w.ov-span-5 { grid-column: span 5; }
.ov-w.ov-span-6 { grid-column: span 6; }
.ov-w.ov-span-7 { grid-column: span 7; }
.ov-w.ov-span-8 { grid-column: span 8; }
@media (max-width:1180px){ .ov-w[class*="ov-span-"] { grid-column: span 6; } }
@media (max-width:760px){ .ov-w[class*="ov-span-"] { grid-column: span 1; } }

/* ── плотность +10-15%: меньше воздуха в оболочке и заголовке, но не тесно ── */
.ov2-grid .ov-w-body { padding: 16px 17px; }
.ov2-card-hd { margin-bottom: 13px; }
.ov2-task, .ov2-meet { min-height: 40px; padding: 6px 8px; }

/* ── карт-варианты: единая иерархия радиус/тень/бордер (не «всё одинаково плывёт») ── */
.ov2-grid:not(.editing) .ov-w-body { border-radius: var(--r-card); }
.ov2-grid:not(.editing) .ov-w-body.cv-standard { box-shadow: var(--shadow-subtle); }
/* аналитика — БЕЗ тени: контраст держим поверхностью + 1px бордер */
.ov2-grid:not(.editing) .ov-w-body.cv-analytics { box-shadow: none; border-radius: var(--r-analytics); border-color: color-mix(in srgb, var(--stroke) 88%, transparent); }
.ov2-grid:not(.editing) .ov-w-body.cv-analytics:hover { transform: translateY(-1px); box-shadow: var(--shadow-subtle); }
/* тинт-архетипы (связь/интеллект/лидеры) — плоско, играем цветом поверхности */
.ov2-grid:not(.editing) .ov-w-body.cv-tinted,
.ov2-grid:not(.editing) .ov-w-body.cv-system,
.ov2-grid:not(.editing) .ov-w-body.cv-editorial { box-shadow: none; }
.ov2-grid:not(.editing) .ov-w-body.cv-tinted:hover,
.ov2-grid:not(.editing) .ov-w-body.cv-system:hover,
.ov2-grid:not(.editing) .ov-w-body.cv-editorial:hover { transform: translateY(-1px); box-shadow: var(--shadow-subtle); }
/* AI-виджеты — фиолет + мягкая тень; акцент-бордер */
.ov2-grid:not(.editing) .ov-w-body.cv-ai { box-shadow: var(--shadow-subtle); border-color: var(--surf-line-violet); }
.ov2-grid:not(.editing) .ov-w-body.cv-ai:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); }
/* цель месяца — приподнятый фокус */
.ov2-grid:not(.editing) .ov-w-body.cv-goal { box-shadow: var(--shadow-elevated); border-radius: var(--r-xl); }
.ov2-grid:not(.editing) .ov-w-body.cv-goal:hover { transform: translateY(-2px); box-shadow: var(--shadow-hero); }
/* инсет — «утоплённая» вспомогательная плитка (низкий приоритет: часовые пояса) */
.ov2-grid:not(.editing) .ov-w-body.cv-inset { box-shadow: none; background: var(--bg-2); border-color: transparent; border-radius: var(--r-analytics); }
.ov2-grid:not(.editing) .ov-w-body.cv-standard:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); }
/* горячие лиды — тёплый контейнер (премиум, не аларм-красный) */
.ov2-grid:not(.editing) .ov-w-body.cv-urgent { background: linear-gradient(180deg, color-mix(in srgb, #EF4F3D 5%, var(--surface-1)), var(--surface-1) 60%); border-color: color-mix(in srgb, #EF4F3D 22%, var(--stroke)); box-shadow: var(--shadow-subtle); border-radius: var(--r-xl); }
.ov2-grid:not(.editing) .ov-w-body.cv-urgent:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); }
.cv-urgent .ov2-card-hd svg { color: #EF4F3D; }
/* онбординг — setup-journey, слейт-блю тинт (не аналитика) */
.ov2-grid:not(.editing) .ov-w-body.cv-setup { background: var(--surf-tint-blue); border-color: var(--surf-line-blue); box-shadow: var(--shadow-subtle); }

/* ── онбординг: сегментированный прогресс + done/pending ── */
.ov-setup-prog { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; }
.ov-setup-segs { display: flex; gap: 5px; flex: 1; }
.ov-setup-seg { flex: 1; height: 6px; border-radius: var(--r-pill); background: var(--gauge-track); transition: background .5s var(--ease-spring); }
.ov-setup-seg.on { background: linear-gradient(90deg, var(--ov-cat-blue), var(--ov-cat-purple)); }
.ov-setup-frac { font-size: 13px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; flex: none; }
.ov-setup-frac i { font-weight: 500; color: var(--ink-3); font-style: normal; }
.ov-setup-done { margin-left: auto; font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ov-cat-green); background: var(--ov-soft-green); border-radius: var(--r-pill); padding: 2px 9px; }

/* ── активность: семантичные чипы события + тише таймстемпы ── */
.ov-tl-tm { display: inline-flex; align-items: center; gap: 7px; }
.ov-tl-chip { font-size: 9.5px; font-weight: 700; letter-spacing: .02em; padding: 1px 8px; border-radius: var(--r-pill); }
.ov-tl-chip.c-price { color: var(--ov-cat-green); background: var(--ov-soft-green); }
.ov-tl-chip.c-neg { color: var(--ov-cat-red); background: var(--ov-soft-red); }
.ov-tl-chip.c-interest { color: var(--ov-cat-blue); background: var(--ov-soft-blue); }
.ov-tl-chip.c-mortgage { color: var(--ov-cat-purple); background: var(--ov-soft-purple); }
.ov-tl-chip.c-loc { color: var(--ov-cat-amber); background: var(--ov-soft-amber); }
.ov-tl-chip.c-q { color: var(--ink-2); background: var(--ov-chip-gray); }

/* ── AI-vs-человек: инсайт как градиент-вывод (не плоская полоска) ── */
.ov-insight { margin-top: 14px; padding: 11px 13px; border-radius: var(--r-nested); border: 1px solid var(--surf-line-violet);
  background: linear-gradient(120deg, color-mix(in srgb, var(--ov-cat-purple) 17%, transparent), color-mix(in srgb, var(--ov-cat-purple) 6%, transparent));
  color: var(--ov-cat-purple); font-weight: 700; }

/* ═══ MOTION-СЛОЙ: тонкая видео-атмосфера под hero/AI-зонами ═══ */
.ovm { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: inherit; pointer-events: none; }
.ovm-poster, .ovm-vid { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ovm-poster { z-index: 0; }
.ovm-vid { z-index: 1; }
.ovm-scrim { position: absolute; inset: 0; z-index: 2; }
.ovm-subtle .ovm-poster, .ovm-subtle .ovm-vid { opacity: .32; }
.ovm-soft .ovm-poster, .ovm-soft .ovm-vid { opacity: .5; }
/* scrim держит текст читаемым (WCAG) */
.ovm-scrim-navyHero { background: linear-gradient(120deg, rgba(9,20,46,.58), rgba(11,26,60,.30) 55%, rgba(15,34,80,.24)); }
.ovm-scrim-ai { background: linear-gradient(160deg, rgba(30,22,58,.80), rgba(20,16,42,.66)); }
.ovm-scrim-warmGoal { background: linear-gradient(160deg, rgba(20,14,4,.60), rgba(10,8,4,.72)); }
/* светлый scrim для AI-empty (Идея дня) — остаётся светлой поверхностью с еле-движущимся тинтом */
.ovm-scrim-aiLight { background: linear-gradient(160deg, rgba(245,242,255,.84), rgba(238,235,255,.93)); }
html[data-night] .ovm-scrim-aiLight { background: linear-gradient(160deg, rgba(30,25,58,.82), rgba(17,14,36,.90)); }
/* reduced-motion / мобайл → только постер (без видео) */
@media (prefers-reduced-motion: reduce) { .ovm-vid { display: none !important; } }
@media (max-width: 760px) { .ovm-vid { display: none !important; } }

/* Идея дня: motion-подложка под пустым AI-состоянием (текст остаётся читаемым) */
.idea-deck-motion { position: relative; overflow: hidden; border-radius: 16px; }
.idea-deck-motion .idea-empty { position: relative; z-index: 3; }
.idea-deck-motion .idea-empty-t { color: var(--ink); }
.idea-deck-motion .idea-empty-s { color: var(--ink-3); }

/* задачи не должны доминировать по высоте: контролируемый скролл при длинном списке */
.ov-tasks-body { max-height: 400px; overflow-y: auto; margin: 0 -4px; padding: 0 4px; }
.ov-tasks-body::-webkit-scrollbar { width: 6px; }
.ov-tasks-body::-webkit-scrollbar-thumb { background: var(--stroke); border-radius: 999px; }
.ov-tasks-body { scrollbar-width: thin; }

/* тумблер «Меньше движения» в панели обзора */
.ov2-motion { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border-radius: 10px; font-size: 12.5px; font-weight: 600; color: var(--ink-3); background: transparent; opacity: .75; transition: opacity .15s, background .15s, color .15s; }
.ov2-motion svg { width: 14px; height: 14px; }
.ov2-motion:hover { opacity: 1; background: var(--bg-2); color: var(--ink); }
.ov2-motion.off { opacity: 1; color: var(--ink-2); background: var(--bg-2); }

/* ═══════════════════════════════════════════════════════════════════════════
   АДДИТИВНЫЙ RESPONSIVE-СЛОЙ ДЛЯ ОБЗОРА (только @media, десктоп ≥1200 не трогаем)
   Планшет ≤1100 — плотнее; Мобайл ≤760 — приоритет-стек + tap-цели.
   Всё ниже живёт ТОЛЬКО внутри max-width — байт-в-байт тот же десктоп.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── ПЛАНШЕТ 761–1100: сетка уже 6-кол (см. блок ≤1180); тут только чуть уплотняем ──
   Нижняя граница 761px обязательна: span-6 из этого блока НЕ должен утекать в мобайл
   (там одна колонка — span-6 создал бы неявные колонки и сломал стек). */
@media (min-width: 761px) and (max-width: 1100px) {
  .ov2-grid { gap: 15px; }
  .ov2-grid .ov-w-body { padding: 15px 15px; }
  .content { padding: 6px 20px 26px; }
  .topbar { padding: 16px 20px 12px; }
  /* сетка уже 6-кол. Приоритетные/широкие виджеты — на всю строку (span 6),
     вторичные — 2-в-ряд (span 3), чтобы использовать ширину планшета. */
  .ov-w.full,
  .ov-w[data-w="kpi"], .ov-w[data-w="attention"],
  .ov-w[data-w="hotleads"], .ov-w[data-w="tasks"],
  .ov-w[data-w="aivs"], .ov-w[data-w="onboarding"] { grid-column: span 6; }
  .ov-w[data-w="funnel"], .ov-w[data-w="goal"], .ov-w[data-w="meetings"],
  .ov-w[data-w="leaders"], .ov-w[data-w="geo"], .ov-w[data-w="spark"],
  .ov-w[data-w="numbers"], .ov-w[data-w="chains"], .ov-w[data-w="activity"],
  .ov-w[data-w="recent"], .ov-w[data-w="brokers"], .ov-w[data-w="worldclock"],
  .ov-w[data-w="casebase"], .ov-w[data-w="ideas"] { grid-column: span 3; }
}

/* ── МОБАЙЛ ≤760: одноколоночный приоритет-стек ──
   Порядок: hero KPI → внимание → горячие лиды → задачи → свежие лиды → цель → активность → остальное.
   Виджеты в DOM помечены [data-w]; используем CSS order (работает и в grid). */
@media (max-width: 760px) {
  .ov-w[data-w="kpi"]       { order: -70; }
  .ov-w[data-w="attention"] { order: -60; }
  .ov-w[data-w="hotleads"]  { order: -50; }
  .ov-w[data-w="tasks"]     { order: -40; }
  .ov-w[data-w="recent"]    { order: -30; }
  .ov-w[data-w="goal"]      { order: -20; }
  .ov-w[data-w="activity"]  { order: -10; }
  /* всё прочее (funnel, meetings, leaders, geo, spark, numbers, chains, ideas, brokers,
     worldclock, casebase, onboarding) сохраняет естественный порядок (order:0) */

  /* уплотнение оболочки + гарантия отсутствия горизонтального скролла */
  .content { padding: 6px 12px 22px; }
  .ov2-grid { gap: 12px; max-width: 100%; }
  .ov2-grid .ov-w-body { padding: 14px 14px; }
  .ov2-bar { flex-wrap: wrap; gap: 8px; }
  .ov2-head { flex-wrap: wrap; gap: 8px; }

  /* tap-цели ≥40px: чекбоксы задач, кнопки-иконки, навигационные строки */
  .ov2-task-ck { width: 26px; height: 26px; }
  .ov2-task { min-height: 44px; padding: 8px 4px; }
  .ov2-att, .ovx-kcard, .ov2-lib-i { min-height: 44px; }
  .ov2-motion, .ov2-edit { min-height: 40px; padding-top: 9px; padding-bottom: 9px; }
  /* иконочный рельс: строки навигации остаются ≥40px для пальца */
  .nav-item { min-height: 42px; }

  /* размеры шрифтов не опускаем ниже 12px + чуть сжимаем гигантские числа hero */
  .ovx-hero-num { font-size: clamp(38px, 12vw, 54px); }
  .ov2-att-n, .ovx-kc-v { font-size: 19px; }

  /* тексты/номера-пилюли не должны распирать колонку */
  code.pill { white-space: normal; word-break: break-word; }
  .ov-w-body { overflow-wrap: anywhere; }

  /* читабельный пол для самых мелких подписей (10–10.5px → 11px);
     премиум-микрошкалу не ломаем на 12px (это был бы редизайн, а не reflow) */
  .ov-sec, .ov-urg-meta, .ov-urg-ago { font-size: 11px; }

  /* кнопки-действия в топбаре — комфортная tap-цель */
  .topbar .btn-accent, .topbar .btn { min-height: 40px; }
}

/* очень узкие экраны ≤400: ещё компактнее, но всё читаемо */
@media (max-width: 400px) {
  .content { padding: 6px 10px 20px; }
  .ovx-hero { padding: 18px 18px; }
  .ovx-hero-num { font-size: clamp(34px, 13vw, 46px); }
}

/* ============================================================
   МЕДИАПЛАНЫ (подрядчики трафика · план/факт · согласование)
   ============================================================ */
.mp-toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.mp-toolbar .mp-hint { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; margin-left: auto; }
.mp-toolbar .mp-hint svg { width: 14px; height: 14px; color: var(--accent); }
.mp-cmp td b.mp-good { color: var(--ok); }
.mp-cmp td b.mp-bad { color: var(--bad); }
.mp-group { margin-bottom: 22px; }
.mp-group-hd { display: flex; align-items: center; gap: 8px; font-size: 13.5px; margin: 0 2px 12px; color: var(--ink-2); flex-wrap: wrap; }
.mp-group-hd svg { width: 15px; height: 15px; color: var(--accent); }
.mp-group-hd b { color: var(--navy-900); font-weight: 700; }
.mp-group-hd .muted { font-size: 12px; font-weight: 500; }
.mp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.mp-card { display: flex; flex-direction: column; }
.mp-card-hd { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; }
.mp-card-hd .badge { margin-left: auto; flex: 0 0 auto; }
.mp-title { font-family: var(--font-display); font-size: 17px; font-weight: 600; letter-spacing: -.01em; color: var(--navy-900); line-height: 1.2; }
.mp-sub { font-size: 11.5px; color: var(--ink-3); margin-top: 3px; }
.mp-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 12px 0; border-top: 1px solid var(--stroke-soft); border-bottom: 1px solid var(--stroke-soft); }
.mp-m { display: flex; flex-direction: column; gap: 2px; }
.mp-m span { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; }
.mp-m b { font-size: 15px; font-weight: 750; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.mp-m b.accent { color: var(--accent); }
.mp-pf { padding: 12px 0 6px; }
.mp-pf-row { display: flex; align-items: baseline; gap: 8px; font-size: 12px; margin-bottom: 3px; }
.mp-pf-row span { color: var(--ink-3); width: 62px; flex: 0 0 62px; }
.mp-pf-row b { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--navy-900); }
.mp-pf-row i { color: var(--ink-3); font-style: normal; font-size: 11px; margin-left: auto; }
.mp-pf-row.cpl { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--stroke-soft); }
.mp-pf-row b.good { color: var(--ok); }
.mp-pf-row b.bad { color: var(--bad); }
.mp-bar { height: 5px; border-radius: 99px; background: var(--bg-2); overflow: hidden; margin: 2px 0 9px; }
.mp-bar span { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--accent), #5B8DEF); }
.mp-nofact { padding: 12px 0; font-size: 11.5px; color: var(--ink-3); font-style: italic; }
.mp-bd { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.mp-bd-h { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; margin-bottom: 8px; }
.mp-bd-row { display: flex; align-items: center; gap: 7px; font-size: 11.5px; margin-bottom: 6px; }
.mp-bd-row span { flex: 0 0 auto; max-width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-2); }
.mp-bd-row b { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--navy-900); font-weight: 700; }
.mp-bd-bar { flex: 1; height: 4px; border-radius: 99px; background: var(--bg-2); overflow: hidden; }
.mp-bd-bar span { display: block; height: 100%; max-width: none; background: var(--accent); opacity: .55; border-radius: 99px; }
.mp-acts { display: flex; gap: 7px; margin-top: 14px; flex-wrap: wrap; }
.mp-acts .btn { flex: 0 0 auto; }
.mp-acts .btn-danger { margin-left: auto; }

/* билдер медиаплана (модалка) */
.mp-b-top { display: flex; gap: 12px; flex-wrap: wrap; }
.mp-b-top .form-row { margin-bottom: 10px; }
.mp-lbl { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; margin: 16px 0 9px; }
.mp-lbl .muted { text-transform: none; letter-spacing: 0; font-weight: 500; font-size: 11px; }
.mp-tbl-wrap { overflow-x: auto; border: 1px solid var(--stroke); border-radius: var(--r-md); }
.mp-tbl { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 720px; }
.mp-tbl th { text-align: left; font-size: 9.5px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--navy-700); padding: 8px 8px; border-bottom: 1.5px solid var(--stroke); white-space: nowrap; background: var(--bg); }
.mp-tbl th.num { text-align: right; }
.mp-tbl th.fct, .mp-tbl td.fct { background: var(--bg-2); }
.mp-tbl td { padding: 4px 6px; border-bottom: 1px solid var(--stroke-soft); }
.mp-tbl input.li { width: 100%; border: 1px solid transparent; background: transparent; padding: 7px 8px; font-size: 12.5px; border-radius: 7px; }
.mp-tbl input.li:hover { border-color: var(--stroke); }
.mp-tbl input.li:focus { border-color: var(--accent); background: var(--card); outline: none; }
.mp-tbl input.li.num { text-align: right; font-variant-numeric: tabular-nums; width: 84px; }
.mp-cpl { text-align: right; font-variant-numeric: tabular-nums; font-weight: 700; color: var(--accent); white-space: nowrap; padding-right: 10px; }
.mp-cpl.mp-good { color: var(--ok); }
.mp-cpl.mp-bad { color: var(--bad); }
.mp-delc { width: 34px; text-align: center; }
.mp-delrow { width: 24px; height: 24px; border-radius: 6px; border: none; background: transparent; color: var(--ink-3); cursor: pointer; display: inline-grid; place-items: center; }
.mp-delrow:hover { background: var(--bad-bg); color: var(--bad); }
.mp-delrow svg { width: 13px; height: 13px; }
.mp-tot td { padding: 11px 8px; border-top: 2px solid var(--stroke); font-weight: 800; font-size: 13px; color: var(--navy-900); background: var(--bg); font-variant-numeric: tabular-nums; }
.mp-tot td.num { text-align: right; }

/* менеджер подрядчиков */
.mp-ct-list { display: flex; flex-direction: column; gap: 8px; }
.mp-ct-row { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid var(--stroke); border-radius: var(--r-md); background: var(--card); }
.mp-ct-main { flex: 1; min-width: 0; }
.mp-ct-nm { font-weight: 700; font-size: 14px; color: var(--navy-900); }
.mp-ct-meta { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }

@media (max-width: 720px) {
  .mp-metrics { grid-template-columns: repeat(3, 1fr); }
  .mp-bd { grid-template-columns: 1fr; }
  .mp-toolbar .mp-hint { margin-left: 0; width: 100%; }
}

/* ══════════ Аналитика медиапланов (Фаза 2) ══════════ */
.mpa-seg { display: inline-flex; gap: 3px; padding: 3px; background: var(--bg-2); border: 1px solid var(--stroke-soft); border-radius: 11px; margin-bottom: 16px; }
.mpa-seg-b { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; font-size: 12.8px; font-weight: 600; color: var(--ink-3); border-radius: 8px; transition: background var(--dur-fast) var(--ease-soft), color var(--dur-fast); }
.mpa-seg-b svg { width: 14px; height: 14px; }
.mpa-seg-b:hover { color: var(--ink-2); }
.mpa-seg-b.on { background: var(--card); color: var(--navy-900); box-shadow: var(--shadow); }
.mpa-seg-b.on svg { color: var(--accent); }

.mpa-filter { display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.mpa-fl { display: flex; flex-direction: column; gap: 4px; }
.mpa-fl-lbl { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; }
.mpa-fl select, .mpa-fl input { padding: 8px 11px; font-size: 12.5px; }
.mpa-filter .mpa-scope { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; margin-left: auto; }
.mpa-filter .mpa-scope svg { width: 13px; height: 13px; color: var(--accent); }

.mpa-hero { display: grid; grid-template-columns: 1fr 1fr 1.3fr; gap: 22px; margin-bottom: 16px; }
.mpa-stat { display: flex; flex-direction: column; gap: 6px; }
.mpa-stat-k { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; }
.mpa-stat b { font-size: 21px; font-weight: 750; color: var(--navy-900); font-variant-numeric: tabular-nums; font-family: var(--font); letter-spacing: -.01em; }
.mpa-stat b i { font-size: 13px; font-weight: 500; font-style: normal; color: var(--ink-3); font-family: var(--font); margin-left: 4px; }
.mpa-stat .mp-bar { margin: 2px 0 0; }
.mpa-stat-s { font-size: 11px; color: var(--ink-3); }
.mpa-h-cpl { display: flex; flex-direction: column; gap: 6px; justify-content: center; padding-left: 22px; border-left: 1px solid var(--stroke-soft); }
.mpa-h-k { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; }
.mpa-h-cpl b { font-size: 22px; font-weight: 750; color: var(--navy-900); font-variant-numeric: tabular-nums; font-family: var(--font); }
.mpa-h-cpl b i { font-style: normal; color: var(--ink-3); margin: 0 4px; font-size: 17px; }
.mpa-h-cpl.good b { color: var(--ok); }
.mpa-h-cpl.bad b { color: var(--bad); }
.mpa-h-d { font-size: 12px; }

.mpa-delta { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 20px; font-variant-numeric: tabular-nums; }
.mpa-delta.good { color: color-mix(in srgb, var(--ok) 74%, #06170f); background: var(--ok-bg); }
.mpa-delta.bad { color: color-mix(in srgb, var(--bad) 78%, #2a0209); background: var(--bad-bg); }

.mpa-ct-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.mpa-ct { border: 1px solid var(--stroke-soft); border-radius: var(--r-md); padding: 15px; background: var(--bg); }
.mpa-ct.best { border-color: color-mix(in srgb, var(--ok) 45%, var(--stroke)); background: linear-gradient(180deg, color-mix(in srgb, var(--ok-bg) 55%, transparent), var(--bg)); }
.mpa-ct-hd { margin-bottom: 12px; }
.mpa-ct-nm { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14.5px; font-weight: 700; color: var(--navy-900); }
.mpa-badge-best { display: inline-flex; align-items: center; gap: 3px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ok); background: var(--ok-bg); padding: 2px 8px; border-radius: 20px; }
.mpa-badge-best svg { width: 11px; height: 11px; }
.mpa-ct-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; padding: 12px 0; border-top: 1px solid var(--stroke-soft); }
.mpa-ct-m { display: flex; flex-direction: column; gap: 1px; }
.mpa-ct-m span { font-size: 9.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; }
.mpa-ct-m b { font-size: 15px; font-weight: 750; color: var(--navy-900); font-variant-numeric: tabular-nums; }
.mpa-ct-m b.accent { color: var(--accent); } .mpa-ct-m b.muted { color: var(--ink-3); font-weight: 600; }
.mpa-ct-m b.mp-good { color: var(--ok); } .mpa-ct-m b.mp-bad { color: var(--bad); }
.mpa-ct-m i { font-style: normal; font-size: 10.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; min-height: 13px; }
.mpa-ct-pace { display: flex; flex-direction: column; gap: 7px; padding-top: 11px; border-top: 1px solid var(--stroke-soft); }
.mpa-ct-pb { display: grid; grid-template-columns: 92px 1fr 34px; align-items: center; gap: 8px; font-size: 11px; color: var(--ink-3); }
.mpa-ct-pb i { font-style: normal; text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-2); font-weight: 650; }

.mpa-list { display: flex; flex-direction: column; }
.mpa-row { display: grid; grid-template-columns: minmax(140px, 1.4fr) 90px minmax(260px, 2fr); align-items: center; gap: 14px; padding: 11px 4px; border-bottom: 1px solid var(--stroke-soft); }
.mpa-row:last-child { border-bottom: none; }
.mpa-row.lead { background: linear-gradient(90deg, color-mix(in srgb, var(--ok-bg) 55%, transparent), transparent); border-radius: 8px; }
.mpa-row.worst { background: linear-gradient(90deg, color-mix(in srgb, var(--bad-bg) 45%, transparent), transparent); border-radius: 8px; }
.mpa-row-nm { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: 13px; font-weight: 650; color: var(--navy-900); min-width: 0; }
.mpa-row-nm > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mpa-ctx { display: block; width: 100%; font-size: 10.5px; font-weight: 500; color: var(--ink-3); }
.mpa-mix { font-style: normal; color: var(--warn); font-weight: 700; }
.mpa-row-bar { height: 6px; border-radius: 99px; background: var(--bg-2); overflow: hidden; }
.mpa-row-bar span { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--accent), #5B8DEF); }
.mpa-row-val { display: flex; gap: 16px; flex-wrap: wrap; justify-content: flex-end; }
.mpa-row-b { grid-template-columns: minmax(200px, 1fr) auto; align-items: center; }
.mpa-row-b .mpa-row-nm { align-self: center; }
.mpa-row-b .mpa-row-val { flex-wrap: nowrap; }
.mpa-cell { display: flex; flex-direction: column; gap: 1px; font-size: 12.5px; font-weight: 700; color: var(--navy-900); font-variant-numeric: tabular-nums; text-align: right; min-width: 54px; }
.mpa-cell i { font-style: normal; font-size: 9.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); font-weight: 650; }
.mpa-cplc b.accent { color: var(--accent); } .mpa-cplc b.mp-good { color: var(--ok); } .mpa-cplc b.mp-bad { color: var(--bad); }
.mpa-bdg { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 2px 7px; border-radius: 20px; }
.mpa-bdg.lead { color: var(--ok); background: var(--ok-bg); } .mpa-bdg.worst { color: var(--bad); background: var(--bad-bg); }
.mpa-crm { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ink-2); padding: 6px 4px 10px; }
.mpa-crm svg { width: 13px; height: 13px; color: var(--accent); flex: 0 0 auto; }
.mpa-crm b { color: var(--navy-900); }
.mpa-hint-fact { margin-top: 12px; font-size: 11.5px; color: var(--ink-3); font-style: italic; }

.mpa-pace-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.mpa-pace { border: 1px solid var(--stroke-soft); border-radius: var(--r-md); padding: 14px; background: var(--bg); }
.mpa-pace-hd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 11px; font-size: 13.5px; font-weight: 700; color: var(--navy-900); }
.mpa-pace-hd .muted { font-size: 11px; font-weight: 500; }
.mpa-pace-days { margin-left: auto; font-size: 10.5px; font-weight: 650; color: var(--accent); background: var(--blue-100); padding: 2px 9px; border-radius: 20px; }
.mpa-pace-bars { display: flex; flex-direction: column; gap: 9px; }
.mpa-pace-b { display: grid; grid-template-columns: 1fr 34px; grid-template-areas: 'l l' 'bar val'; align-items: center; gap: 3px 8px; }
.mpa-pace-l { grid-area: l; display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--ink-3); font-weight: 600; }
.mpa-pace-b .mp-bar { grid-area: bar; margin: 0; }
.mpa-pace-b .mp-bar.ghost span { background: var(--ink-3); opacity: .4; }
.mpa-pace-b i { grid-area: val; font-style: normal; text-align: right; font-size: 11px; font-weight: 700; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.mpa-pace-ft { font-size: 11px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--stroke-soft); }
.mpa-sig { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; padding: 1px 7px; border-radius: 20px; }
.mpa-sig.ahead { color: var(--ok); background: var(--ok-bg); }
.mpa-sig.behind { color: var(--bad); background: var(--bad-bg); }
.mpa-sig.ontrack { color: var(--ink-3); background: var(--bg-2); }

@media (max-width: 860px) {
  .mpa-hero { grid-template-columns: 1fr; gap: 16px; }
  .mpa-h-cpl { padding-left: 0; border-left: none; padding-top: 14px; border-top: 1px solid var(--stroke-soft); }
  .mpa-row { grid-template-columns: 1fr; gap: 8px; }
  .mpa-row-bar { display: none; }
  .mpa-row-val { justify-content: flex-start; }
}

/* ═══════════════ Parlo — промо-страница переводчика звонков ═══════════════ */
.plo-wrap { display: flex; flex-direction: column; gap: 16px; }
.plo-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: 1.35fr .9fr; gap: 24px; align-items: center; padding: 40px 44px; border-radius: 28px;
  background: radial-gradient(120% 130% at 92% -10%, color-mix(in srgb, var(--accent-3) 22%, transparent), transparent 55%), linear-gradient(160deg, color-mix(in srgb, var(--accent) 8%, var(--card)), var(--card)); }
.plo-badge { display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px; border-radius: 100px; font-size: 12px; font-weight: 650; color: var(--accent-3); background: color-mix(in srgb, var(--accent-3) 11%, transparent); margin-bottom: 18px; }
.plo-badge svg { width: 14px; height: 14px; }
.plo-h1 { font-family: var(--font-display); font-weight: 500; font-size: clamp(30px, 4.2vw, 50px); line-height: 1.04; letter-spacing: -.02em; color: var(--navy-900); margin: 0 0 14px; }
.plo-h1 span { background: linear-gradient(100deg, var(--accent), var(--accent-3)); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.plo-sub { font-size: 15.5px; line-height: 1.55; color: var(--ink-2); max-width: 54ch; margin: 0 0 24px; }
.plo-sub b { color: var(--navy-900); font-weight: 650; }
.plo-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.plo-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 17px; border-radius: 13px; font-size: 13.5px; font-weight: 650; color: var(--ink-2); background: var(--card); border: 1px solid var(--stroke); cursor: pointer; transition: transform .14s var(--ease-soft), box-shadow .16s, border-color .16s; }
.plo-btn:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--accent) 40%, var(--stroke)); box-shadow: 0 8px 20px -12px rgba(16,43,92,.4); }
.plo-btn.lg { padding: 12px 20px; font-size: 14px; border-radius: 14px; }
.plo-btn.primary { color: #fff; border: none; background: linear-gradient(120deg, var(--accent), var(--accent-3) 60%, var(--accent-3)); box-shadow: 0 12px 30px -12px color-mix(in srgb, var(--accent) 45%, transparent); }
.plo-btn.primary:hover { box-shadow: 0 16px 38px -12px color-mix(in srgb, var(--accent) 50%, transparent); }
.plo-btn.ghost { background: transparent; border-color: transparent; color: var(--ink-3); }
.plo-btn.ghost:hover { color: var(--accent); box-shadow: none; }
.plo-langs { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-3); }
.plo-langs b { color: var(--ink-2); font-weight: 650; letter-spacing: .04em; }
.plo-dot { width: 7px; height: 7px; border-radius: 50%; background: #2FA98C; box-shadow: 0 0 0 4px color-mix(in srgb, #2FA98C 20%, transparent); animation: ploPulse 2s ease-in-out infinite; }
@keyframes ploPulse { 50% { opacity: .45; } }
.plo-hero-r { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.plo-halo { position: absolute; width: 230px; height: 230px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--accent-3) 28%, transparent), transparent 66%); filter: blur(14px); }
.plo-icon-wrap { position: relative; animation: ploFloat 5.5s ease-in-out infinite; }
@keyframes ploFloat { 50% { transform: translateY(-9px); } }
.plo-appicon { display: block; border-radius: 30px; }
.plo-name { position: relative; font-family: var(--font-display); font-weight: 600; font-size: 26px; color: var(--navy-900); margin-top: 16px; letter-spacing: .01em; }
.plo-tag { position: relative; font-size: 12px; color: var(--ink-3); letter-spacing: .16em; text-transform: uppercase; margin-top: 3px; }
.plo-feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.plo-feat { display: flex; flex-direction: column; gap: 9px; padding: 22px; border-radius: 20px; }
.plo-feat-ic { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; color: var(--accent-3); background: linear-gradient(140deg, color-mix(in srgb, var(--accent) 14%, transparent), color-mix(in srgb, var(--accent-3) 12%, transparent)); }
.plo-feat-ic svg { width: 21px; height: 21px; }
.plo-feat b { font-size: 15px; font-weight: 650; color: var(--navy-900); }
.plo-feat span:not(.plo-feat-ic) { font-size: 13px; line-height: 1.5; color: var(--ink-3); }
.plo-how { padding: 26px 28px; border-radius: 22px; }
.plo-how-hd { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 18px; font-weight: 550; color: var(--navy-900); margin-bottom: 18px; }
.plo-how-hd svg { width: 20px; height: 20px; color: var(--accent-3); }
.plo-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.plo-step { display: flex; flex-direction: column; gap: 6px; }
.plo-step-n { width: 30px; height: 30px; border-radius: 10px; display: grid; place-items: center; font-weight: 700; font-size: 14px; color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-3)); margin-bottom: 5px; }
.plo-step b { font-size: 14.5px; color: var(--navy-900); }
.plo-step span:not(.plo-step-n) { font-size: 12.5px; line-height: 1.5; color: var(--ink-3); }
.plo-band { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 26px 30px; border-radius: 22px;
  background: radial-gradient(120% 200% at 88% -30%, color-mix(in srgb, var(--accent-3) 20%, transparent), transparent 55%), linear-gradient(120deg, color-mix(in srgb, var(--accent) 7%, var(--card)), var(--card)); }
.plo-band-t { font-family: var(--font-display); font-size: 20px; font-weight: 550; color: var(--navy-900); }
.plo-band-s { font-size: 13px; color: var(--ink-3); margin-top: 3px; }
.plo-dl-modal { text-align: center; }
.plo-dl-ic { display: flex; justify-content: center; margin-bottom: 12px; }
.plo-dl-mt { font-size: 14px; color: var(--ink-2); margin-bottom: 16px; }
.plo-dl-rows { display: flex; flex-direction: column; gap: 9px; }
.plo-dl-rows .plo-btn { justify-content: center; }
.plo-dl-note { font-size: 11.5px; color: var(--ink-3); line-height: 1.5; margin-top: 14px; }
@media (max-width: 900px) { .plo-hero { grid-template-columns: 1fr; } .plo-hero-r { order: -1; } .plo-feats, .plo-steps { grid-template-columns: 1fr; } }
/* ⭐ живой мок звонка в герое */
.plo-mock { position: relative; width: 100%; max-width: 380px; border-radius: 20px; overflow: hidden; background: #0c1120; box-shadow: 0 26px 60px -24px rgba(20,20,60,.55), 0 0 0 1px rgba(255,255,255,.06) inset; }
.plo-mock-top { display: flex; align-items: center; gap: 8px; padding: 9px 13px; background: #12172a; color: rgba(255,255,255,.7); font-size: 11.5px; font-weight: 600; }
.plo-mdots { display: flex; gap: 5px; } .plo-mdots i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.22); }
.plo-mdots i:first-child { background: #FF5F57; } .plo-mdots i:nth-child(2) { background: #FEBC2E; } .plo-mdots i:nth-child(3) { background: #28C840; }
.plo-mtitle { flex: 1; } .plo-mrec { display: inline-flex; align-items: center; gap: 5px; color: #ff9a9a; font-size: 10.5px; }
.plo-mrec i { width: 7px; height: 7px; border-radius: 50%; background: #ff5b5b; animation: ploPulse 1.6s infinite; }
.plo-mock-stage { position: relative; min-height: 300px; padding: 13px; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px;
  background: radial-gradient(120% 80% at 72% 8%, rgba(94,73,230,.42), transparent 55%), radial-gradient(100% 80% at 18% 92%, rgba(62,116,255,.36), transparent 55%), linear-gradient(160deg, #1a2140, #0c1120); }
.plo-mock-pill { position: absolute; top: 13px; left: 13px; display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px 5px 6px; border-radius: 12px; background: rgba(255,255,255,.96); box-shadow: 0 10px 26px -10px rgba(8,14,38,.6); font-size: 12px; color: #14151a; }
.plo-mock-pill .plo-appicon { border-radius: 7px; }
.plo-mock-pill b { font-weight: 700; } .plo-mock-pill .pm-st { display: inline-flex; align-items: center; gap: 5px; color: var(--accent-3); font-weight: 600; }
.plo-mock-pill .pm-st i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-3); animation: ploPulse 1.4s infinite; }
.plo-mock-pill .pm-lng { background: #EEF0FF; color: #3E44C7; border-radius: 7px; padding: 2px 7px; font-size: 11px; font-weight: 700; }
.plo-mock-cap { background: rgba(10,14,26,.72); backdrop-filter: blur(8px); border-radius: 13px; padding: 11px 13px; }
.plo-mock-cap .pm-lbl { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: #bfe0ff; margin-bottom: 5px; }
.plo-mock-cap .pm-wv { display: inline-flex; gap: 2px; align-items: flex-end; height: 12px; }
.plo-mock-cap .pm-wv i { width: 2.5px; background: #7fd0ff; border-radius: 2px; }
.plo-mock-cap .pm-wv i:nth-child(1) { height: 6px; animation: ploWv 1s infinite; } .plo-mock-cap .pm-wv i:nth-child(2) { height: 12px; animation: ploWv 1s infinite .15s; } .plo-mock-cap .pm-wv i:nth-child(3) { height: 8px; animation: ploWv 1s infinite .3s; }
@keyframes ploWv { 50% { transform: scaleY(.4); } }
.plo-mock-cap .pm-txt { font-size: 13px; line-height: 1.4; color: #fff; }
.plo-mock-cop { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; background: linear-gradient(120deg, var(--accent), var(--accent-3)); color: #fff; border-radius: 11px; padding: 8px 12px; font-size: 12px; font-weight: 600; box-shadow: 0 12px 26px -12px color-mix(in srgb, var(--accent) 45%, transparent); }
.plo-mock-cop svg { width: 15px; height: 15px; }
/* ⭐ статы */
.plo-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 24px 26px; border-radius: 22px;
  background: radial-gradient(120% 170% at 90% -20%, rgba(107,75,230,.85), transparent 55%), linear-gradient(120deg, #141a35, #0e1224) !important; color: #fff !important; border: none !important; box-shadow: 0 18px 44px -20px rgba(16,43,92,.4); }
.plo-beta-tag { display: inline-flex; align-items: center; margin-left: 7px; font-size: 9.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; padding: 2px 7px; border-radius: 20px; background: color-mix(in srgb, var(--accent) 20%, transparent); color: var(--accent); vertical-align: middle; }
.plo-btn.primary .plo-beta-tag { background: rgba(255,255,255,.24); color: #fff; }
.plo-cta-note { display: flex; align-items: flex-start; gap: 7px; margin-top: 12px; font-size: 12px; line-height: 1.5; color: var(--ink-3); max-width: 520px; }
.plo-cta-note svg { width: 14px; height: 14px; color: var(--accent); flex: none; margin-top: 1px; }
.plo-stat { text-align: center; }
.plo-stat b { display: block; font-family: var(--font-display); font-weight: 500; font-size: clamp(26px, 3vw, 38px); line-height: 1; background: linear-gradient(120deg, #a9c0ff, #d7b8ff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.plo-stat span { display: block; font-size: 11.5px; color: rgba(255,255,255,.66); margin-top: 7px; line-height: 1.4; }
/* ⭐ схема подключения */
.plo-cschema { padding: 26px 28px; border-radius: 22px; }
.plo-cs-hd { display: flex; align-items: center; gap: 9px; font-family: var(--font-display); font-size: 18px; font-weight: 550; color: var(--navy-900); margin-bottom: 18px; }
.plo-cs-hd svg { width: 20px; height: 20px; color: var(--accent-3); }
.plo-cs-grid { display: grid; grid-template-columns: 1fr auto 1fr; gap: 16px; align-items: stretch; }
.plo-cs-card { border: 1px solid var(--stroke); border-radius: 16px; padding: 16px 18px; background: var(--bg-2); }
.plo-cs-plat { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; font-size: 15px; font-weight: 700; color: var(--navy-900); }
.plo-cs-plat svg { width: 20px; height: 20px; color: var(--accent-3); }
.plo-cs-card ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.plo-cs-card li { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink-2); }
.plo-cs-card li b { color: var(--navy-900); }
.plo-cs-card li > span { flex: none; width: 21px; height: 21px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; color: var(--accent-3); background: color-mix(in srgb, var(--accent-3) 12%, transparent); }
.plo-cs-flow { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.plo-cs-node { display: flex; flex-direction: column; align-items: center; text-align: center; font-size: 12px; font-weight: 650; color: var(--navy-900); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 12px; padding: 8px 12px; min-width: 96px; }
.plo-cs-node small { font-weight: 500; color: var(--ink-3); font-size: 10.5px; margin-top: 2px; }
.plo-cs-node.mid { color: var(--accent-3); border-color: color-mix(in srgb, var(--accent-3) 32%, var(--stroke)); }
.plo-cs-arr { color: var(--ink-3); display: grid; place-items: center; transform: rotate(90deg); } .plo-cs-arr svg { width: 16px; height: 16px; }
.plo-cs-note { margin-top: 16px; text-align: center; font-size: 12px; color: var(--ink-3); line-height: 1.5; }
@media (max-width: 900px) { .plo-stats { grid-template-columns: repeat(2, 1fr); } .plo-cs-grid { grid-template-columns: 1fr; } .plo-cs-flow { flex-direction: row; flex-wrap: wrap; } .plo-cs-arr { transform: none; } .plo-mock { max-width: none; } }

/* ⭐ Обзор: лёгкое появление виджетов (стаггер) + мягкий ховер-подъём карточки */
@keyframes ovwIn { from { opacity: 0; transform: translateY(12px) scale(.99); } to { opacity: 1; transform: none; } }
.ov2-grid:not(.editing) .ov-w { animation: ovwIn .5s cubic-bezier(.22,.61,.36,1) both; }
.ov2-grid:not(.editing) .ov-w:nth-child(1) { animation-delay: 0s }
.ov2-grid:not(.editing) .ov-w:nth-child(2) { animation-delay: .045s }
.ov2-grid:not(.editing) .ov-w:nth-child(3) { animation-delay: .09s }
.ov2-grid:not(.editing) .ov-w:nth-child(4) { animation-delay: .135s }
.ov2-grid:not(.editing) .ov-w:nth-child(5) { animation-delay: .18s }
.ov2-grid:not(.editing) .ov-w:nth-child(6) { animation-delay: .225s }
.ov2-grid:not(.editing) .ov-w:nth-child(7) { animation-delay: .27s }
.ov2-grid:not(.editing) .ov-w:nth-child(8) { animation-delay: .315s }
.ov2-grid:not(.editing) .ov-w:nth-child(9) { animation-delay: .36s }
.ov2-grid:not(.editing) .ov-w:nth-child(n+10) { animation-delay: .4s }
.ov-w-body { transition: transform .22s cubic-bezier(.4,0,.2,1), box-shadow .22s cubic-bezier(.4,0,.2,1); }
.ov2-grid:not(.editing) .ov-w:hover .ov-w-body { transform: translateY(-3px); box-shadow: 0 18px 44px -20px rgba(16,43,92,.42); }
@media (prefers-reduced-motion: reduce) { .ov2-grid .ov-w { animation: none !important; } .ov-w-body { transition: none; } }

/* ===== Академия продаж + Оценка звонка (методология Синенко) ===== */
.ac-lessons{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 16px}
.ac-lchip{padding:6px 12px;border-radius:20px;border:1px solid var(--line,#2a3550);background:transparent;color:var(--ink,#dbe4f7);font-size:12.5px;cursor:pointer;transition:.15s}
.ac-lchip:hover{border-color:var(--blue-300)88}
.ac-lchip.on{background:var(--blue-300);border-color:var(--blue-300);color:#0a1430;font-weight:600}
.ac-lt{font-size:19px;font-weight:700;margin:6px 0 10px}
.ac-intro{font-size:13.5px;color:var(--muted,#9fb0d0);margin-bottom:16px;line-height:1.55}
.ac-intro p{margin:0 0 8px}
.pb-b .ac-cal,.ac-intro .ac-cal,.ac-cal{border-radius:10px;padding:9px 12px;margin:8px 0;font-size:13px;line-height:1.5}
.ac-cal.tip{background:rgba(124,155,255,.12);border-left:3px solid var(--blue-300)}
.ac-cal.warn{background:rgba(255,150,90,.12);border-left:3px solid #F59E5B}
.pb-b b,.ac-intro b{color:var(--ink,#eaf0ff)}
.cr-wrap{max-width:900px;margin:0 auto}
.cr-input{padding:18px;border-radius:16px;margin-bottom:16px}
.cr-hd{font-size:15px;font-weight:700;margin-bottom:10px}
.cr-ta{width:100%;min-height:180px;resize:vertical;background:rgba(6,17,38,.5);border:1px solid var(--line,#2a3550);border-radius:12px;color:var(--ink,#dbe4f7);font-size:13.5px;padding:12px;font-family:inherit;line-height:1.5}
.cr-actions{display:flex;align-items:center;gap:12px;margin-top:12px}
.cr-status{font-size:12.5px;color:var(--muted,#9fb0d0)}
.cr-result{margin-top:6px}
.cr-overall{display:flex;align-items:center;gap:18px;padding:18px;border-radius:16px;background:rgba(124,155,255,.08);border:1px solid var(--blue-300)33;margin-bottom:16px}
.cr-score{font-size:44px;font-weight:800;line-height:1;min-width:96px;text-align:center}
.cr-score small{font-size:16px;color:var(--muted,#9fb0d0);font-weight:600}
.cr-verdict{font-size:14px;line-height:1.5}
.cr-dims{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.cr-dim{padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid var(--line,#2a3550)}
.cr-dim-top{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;font-weight:600;margin-bottom:6px}
.cr-bar{height:6px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}
.cr-bar>i{display:block;height:100%;border-radius:6px}
.cr-dim-c{font-size:12px;color:var(--muted,#9fb0d0);margin-top:7px;line-height:1.45}
.cr-block{margin-bottom:16px}
.cr-block h4{font-size:13px;font-weight:700;margin:0 0 8px;display:flex;align-items:center;gap:7px}
.cr-mist{padding:11px 13px;border-radius:11px;background:rgba(255,150,90,.08);border-left:3px solid #F59E5B;margin-bottom:8px;font-size:13px;line-height:1.5}
.cr-mist b{color:#F5B77E}
.cr-mist .better{margin-top:5px;color:var(--ink,#dbe4f7)}
.cr-scr{padding:10px 13px;border-radius:11px;background:rgba(124,155,255,.09);border-left:3px solid var(--blue-300);margin-bottom:8px;font-size:13px;line-height:1.5;font-style:italic}
.cr-q{padding:7px 12px;border-radius:9px;background:rgba(255,255,255,.03);margin-bottom:6px;font-size:12.5px;font-style:italic;color:var(--muted,#c3d0ea)}
.cr-hist{margin-top:22px}
.cr-hist-hd{font-size:13px;font-weight:700;margin-bottom:9px}
.cr-hchip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:20px;border:1px solid var(--line,#2a3550);background:transparent;color:var(--ink,#dbe4f7);font-size:12.5px;cursor:pointer;margin:0 7px 7px 0}
.cr-hchip b{font-size:14px;color:var(--blue-300)}
.cr-hchip i{color:var(--muted,#9fb0d0)}
/* fix: constrain inline icons inside review block headers */
.cr-block h4 svg,.cr-hd svg{width:15px;height:15px;flex:0 0 auto}

/* ===== Академия: «второй формат» — источник и глубокое чтение ===== */
.ac-srcbar{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:11px;border-top:1px dashed var(--line,#2a3550)}
.ac-srcbtn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:9px;border:1px solid var(--blue-300)55;background:rgba(124,155,255,.1);color:var(--blue-300);font-size:12.5px;font-weight:600;cursor:pointer;text-decoration:none;transition:.15s}
.ac-srcbtn:hover{background:rgba(124,155,255,.2)}
.ac-srcbtn.ghost{background:transparent;border-color:var(--line,#2a3550);color:var(--muted,#9fb0d0)}
.ac-srcbtn svg{width:14px;height:14px;flex:0 0 auto}
.ac-modal-ov{position:fixed;inset:0;z-index:400;background:rgba(4,10,24,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:24px;animation:reveal .2s ease both}
.ac-modal{position:relative;width:760px;max-width:100%;max-height:86vh;display:flex;flex-direction:column;padding:24px 26px;border-radius:18px}
.ac-modal-x{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--muted,#9fb0d0);font-size:18px;cursor:pointer;line-height:1}
.ac-modal-hd{font-size:17px;font-weight:700;padding-right:30px}
.ac-modal-sub{font-size:12.5px;color:var(--muted,#9fb0d0);margin:6px 0 14px}
.ac-modal-body{overflow-y:auto;font-size:14px;line-height:1.62;color:var(--ink,#dbe4f7)}
.ac-modal-body p{margin:0 0 11px}

/* ⭐ RBAC — роли и доступы (матрица команды) */
.rbac-card { padding: 18px 20px; margin-bottom: 16px; }
.rbac-hd { display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 650; color: var(--navy-900); margin-bottom: 14px; }
.rbac-hd svg { width: 18px; height: 18px; color: var(--accent); flex: none; }
.rbac-hd span { font-weight: 400; font-size: 12px; color: var(--ink-3); margin-left: auto; }
.rbac-list { display: flex; flex-direction: column; gap: 8px; }
.rbac-row { border: 1px solid var(--stroke); border-radius: 14px; overflow: hidden; background: var(--card); }
.rbac-row.open { border-color: color-mix(in srgb, var(--accent) 32%, var(--stroke)); }
.rbac-main { width: 100%; display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: none; border: none; cursor: pointer; text-align: left; }
.rbac-ava { width: 36px; height: 36px; flex: none; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #4F5BD5, #7C4DFF); overflow: hidden; }
.rbac-ava img { width: 100%; height: 100%; object-fit: cover; }
.rbac-nm { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.rbac-nm b { font-size: 14px; font-weight: 650; color: var(--navy-900); }
.rbac-nm i { font-style: normal; font-size: 12px; color: var(--ink-3); }
.rbac-chev { color: var(--ink-3); transition: transform .2s; } .rbac-chev svg { width: 16px; height: 16px; }
.rbac-row.open .rbac-chev { transform: rotate(90deg); }
.rbac-body { padding: 4px 14px 14px; border-top: 1px solid var(--stroke); }
.rbac-role { display: flex; align-items: center; gap: 12px; margin: 12px 0 14px; }
.rbac-role span { font-size: 12px; font-weight: 600; color: var(--ink-3); }
.rbac-secs { display: flex; flex-wrap: wrap; gap: 7px; }
.rbac-sec { font-size: 12px; font-weight: 600; border-radius: 9px; padding: 7px 12px; cursor: pointer; border: 1px solid var(--stroke); font-family: inherit; transition: all .13s; }
.rbac-sec.on { background: color-mix(in srgb, #2FA98C 12%, transparent); border-color: color-mix(in srgb, #2FA98C 40%, var(--stroke)); color: #1F8A70; }
.rbac-sec.off { background: color-mix(in srgb, var(--ink) 5%, transparent); color: var(--ink-3); text-decoration: line-through; }
.rbac-sec.locked { opacity: .5; cursor: not-allowed; text-decoration: none; }
.rbac-sec:not(.locked):hover { transform: translateY(-1px); }
.rbac-note { font-size: 11.5px; color: var(--ink-3); line-height: 1.45; margin-top: 12px; }

/* RBAC — панель для команды 30-50: поиск + группы по ролям */
.rbac-bar { display: flex; gap: 8px; margin-bottom: 12px; }
.rbac-search { flex: 1; border: 1px solid var(--stroke); border-radius: 10px; padding: 9px 12px; font-size: 13px; font-family: inherit; outline: none; }
.rbac-search:focus { border-color: var(--accent); }
.rbac-grp { margin-bottom: 12px; }
.rbac-grp-h { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); margin: 4px 2px 8px; }
.rbac-grp-h span { background: var(--bg-2); border-radius: 99px; padding: 1px 8px; font-size: 11px; letter-spacing: 0; }
.rbac-grp .rbac-row { margin-bottom: 6px; }
.rbac-del { margin-left: auto; color: var(--ink-3); }
.rbac-del:hover { color: #E0483D; }

/* RBAC — видимость карточек лидов (упрощённый режим: по роли / по фильтру) */
.rbac-lf { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--stroke); }
.rbac-lf-h { font-size: 12.5px; font-weight: 700; color: var(--navy-900); margin-bottom: 9px; }
.rbac-lf-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.rbac-lfm { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; border: 1px solid var(--stroke); border-radius: 11px; padding: 9px 12px; background: var(--card); cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 650; color: var(--ink-2); transition: all .14s; }
.rbac-lfm i { font-style: normal; font-size: 11px; font-weight: 500; color: var(--ink-3); }
.rbac-lfm:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--stroke)); }
.rbac-lfm.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--card)); color: var(--navy-900); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
.rbac-lf-crit { margin-top: 12px; }
.rbac-lf-lbl { font-size: 11px; font-weight: 600; color: var(--ink-3); margin: 9px 0 6px; }
.rbac-lf-srcs { display: flex; flex-wrap: wrap; gap: 7px; }
.rbac-lf-src { font-size: 12px; font-weight: 600; border-radius: 9px; padding: 6px 11px; cursor: pointer; border: 1px solid var(--stroke); background: var(--card); font-family: inherit; color: var(--ink-2); transition: all .13s; }
.rbac-lf-src.on { background: color-mix(in srgb, var(--accent) 12%, transparent); border-color: var(--accent); color: var(--accent); }
.rbac-lf-tags { width: 100%; border: 1px solid var(--stroke); border-radius: 10px; padding: 9px 11px; font: inherit; font-size: 13px; background: var(--card); color: var(--navy-900); }

/* Настройки → карта-ссылка на подстраницу «Роли и доступы» + кнопка назад */
.set-link { display: flex; align-items: center; gap: 14px; width: 100%; text-align: left; cursor: pointer; padding: 16px 18px; margin-bottom: 16px; font-family: inherit; transition: transform .14s, box-shadow .14s; }
.set-link:hover { transform: translateY(-1px); box-shadow: var(--shadow-lift); }
.set-link-ic { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.set-link-ic svg { width: 20px; height: 20px; }
.set-link-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.set-link-main b { font-size: 14.5px; font-weight: 700; color: var(--navy-900); }
.set-link-main i { font-style: normal; font-size: 12px; color: var(--ink-3); line-height: 1.4; }
.set-link-meta { flex: none; font-size: 12px; color: var(--ink-3); }
.set-link-chev { flex: none; color: var(--ink-3); } .set-link-chev svg { width: 18px; height: 18px; }
.set-back { margin-bottom: 14px; } .set-back svg { transform: rotate(180deg); width: 15px; height: 15px; }
.roles-intro .roles-steps { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.roles-step { display: flex; gap: 11px; align-items: flex-start; font-size: 12.8px; line-height: 1.5; color: var(--ink-2); }
.roles-step span { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent); font-size: 12px; font-weight: 700; }
.roles-step b { color: var(--navy-900); }
@media (max-width: 560px) { .rbac-lf-modes { grid-template-columns: 1fr; } }

/* обзор: кнопка «Добавить виджет» сверху + категории в библиотеке */
.ov2-addtop { display: inline-flex; align-items: center; gap: 7px; border: none; background: linear-gradient(120deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #7C4DFF)); color: #fff; border-radius: 11px; padding: 9px 15px; font-size: 13px; font-weight: 650; font-family: inherit; cursor: pointer; box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--accent) 70%, transparent); transition: transform .14s, box-shadow .14s; }
.ov2-addtop:hover { transform: translateY(-1px); box-shadow: 0 14px 30px -12px color-mix(in srgb, var(--accent) 75%, transparent); }
.ov2-addtop svg { width: 15px; height: 15px; }
.ov2-lib-search { margin-bottom: 14px; }
.ov2-lib-search input { width: 100%; border: 1px solid var(--stroke); border-radius: 11px; padding: 11px 14px; font-size: 14px; font-family: inherit; outline: none; }
.ov2-lib-search input:focus { border-color: var(--accent); }
.ov2-lib-cat { margin-bottom: 22px; }
.ov2-lib-cat-h { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); margin: 0 2px 10px; }
.ov2-lib-cat-h span { background: var(--bg-2); border-radius: 99px; padding: 1px 9px; font-size: 11px; letter-spacing: 0; }

/* обзор: пресеты готовых наборов виджетов */
.ov2-preset-sec { margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--stroke); }
.ov2-lib-cat-h.ovp-h { color: var(--accent); }
.ov2-presets { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (max-width: 640px) { .ov2-presets { grid-template-columns: 1fr; } }
.ov2-preset { display: flex; align-items: center; gap: 12px; text-align: left; border: 1px solid var(--stroke); border-radius: 14px; padding: 13px 15px; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 6%, var(--card)), var(--card)); cursor: pointer; font-family: inherit; transition: border-color .14s, transform .14s, box-shadow .14s; }
.ov2-preset:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 14px 30px -16px color-mix(in srgb, var(--accent) 55%, transparent); }
.ov2-preset-ic { width: 40px; height: 40px; flex: none; border-radius: 12px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 55%, #7C4DFF)); }
.ov2-preset-ic svg { width: 20px; height: 20px; }
.ov2-preset-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ov2-preset-t b { font-size: 14px; font-weight: 650; color: var(--navy-900); }
.ov2-preset-t i { font-style: normal; font-size: 11.5px; color: var(--ink-3); }
.ov2-preset-go { flex: none; color: var(--ink-3); } .ov2-preset-go svg { width: 16px; height: 16px; }

/* ═══════════════════════════════════════════════════════════════════
   ⭐ ВИЗУАЛ v4 — глобальный премиум-слой (усиление глубины/атмосферы/микровзаимодействий).
   Аддитивно поверх токенов, без правки разметки страниц. Уважает reduced-motion.
   ═══════════════════════════════════════════════════════════════════ */
/* атмосферный фон рабочей зоны: мягкие цветные ореолы + едва заметное зерно → глубина, не плоскость */
.content { position: relative; }
.content::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(60% 42% at 82% 6%, color-mix(in srgb, var(--accent) 7%, transparent), transparent 70%),
    radial-gradient(52% 40% at 6% 96%, color-mix(in srgb, var(--violet) 6%, transparent), transparent 72%);
}
:root[data-theme="dark"] .content::before, .dark .content::before {
  background:
    radial-gradient(60% 42% at 82% 6%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 70%),
    radial-gradient(52% 40% at 6% 96%, color-mix(in srgb, var(--violet) 13%, transparent), transparent 72%);
}
/* стеклянные карточки: тонкий верхний хайлайт (свет сверху) + чуть более выразительная кромка → «дорого» */
.glass { position: relative; box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.6); }
:root[data-theme="dark"] .glass, .dark .glass { box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.05); }
/* единый premium focus-ring на интерактиве (доступность + аккуратность) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
[tabindex]:focus-visible, [role="button"]:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--accent) 72%, transparent); outline-offset: 2px; border-radius: 8px;
}
/* мягкая spring-физика на всех кнопках .btn (нажатие «дышит») */
.btn { transition: transform var(--dur-fast) var(--ease-spring), box-shadow var(--dur-fast) var(--ease-soft), background var(--dur-fast), border-color var(--dur-fast); }
.btn:active { transform: translateY(1px) scale(.985); }
.btn-accent:hover { box-shadow: 0 8px 20px -8px color-mix(in srgb, var(--accent) 55%, transparent); }
/* чуть живее скролл-бар рабочей зоны (тонкий, премиальный) */
.content::-webkit-scrollbar { width: 10px; }
.content::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--ink-3) 34%, transparent); border-radius: 20px; border: 3px solid transparent; background-clip: content-box; }
.content::-webkit-scrollbar-thumb:hover { background: color-mix(in srgb, var(--ink-3) 52%, transparent); background-clip: content-box; }
@media (prefers-reduced-motion: reduce) { .content::before { display: none; } }

/* ═══ ВИЗУАЛ v4 · СЛОЙ 2 — стекло + motion (по запросу «больше стекла/мошн») ═══ */
/* настоящее матовое стекло на карточках поверх атмосферного фона (высокая непрозрачность → читаемо) */
@supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
  .glass { background: color-mix(in srgb, var(--card) 86%, transparent); -webkit-backdrop-filter: blur(16px) saturate(1.35); backdrop-filter: blur(16px) saturate(1.35); }
  :root[data-theme="dark"] .glass, .dark .glass { background: color-mix(in srgb, var(--card) 74%, transparent); }
}
/* живой дрейф атмосферы (медленно, GPU, reduced-motion уже гасит ::before) */
@keyframes ambientDrift {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(-2.2%, 1.6%, 0) scale(1.05); }
  100% { transform: translate3d(0, 0, 0) scale(1); }
}
.content::before { animation: ambientDrift 26s var(--ease-soft) infinite; will-change: transform; }
/* стеклянный «блик» и мягкий подъём карточек по наведению (микровзаимодействие) */
.glass.card { transition: box-shadow var(--dur) var(--ease-soft), transform var(--dur) var(--ease-spring); }
.glass.card:hover { box-shadow: var(--shadow-lift), inset 0 1px 0 rgba(255,255,255,.7); }
/* тонкая живая градиент-кромка на акцентных кнопках (дорого-футуристично) */
@keyframes sheenSlide { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }
.btn-accent { background-image: linear-gradient(110deg, var(--accent), color-mix(in srgb, var(--accent) 55%, var(--accent-3)), var(--accent)); background-size: 200% 100%; transition: background-position var(--dur-slow, .8s) var(--ease-soft), transform var(--dur-fast) var(--ease-spring), box-shadow var(--dur-fast); }
.btn-accent:hover { background-position: 100% 50%; }
@media (prefers-reduced-motion: reduce) { .btn-accent { background-image: none; } }

/* ── Академия агентства (внутренние уроки) ── */
.lrn-bar { display: flex; gap: 10px; margin-bottom: 16px; }
.lrn-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.lrn-card { display: flex; flex-direction: column; gap: 9px; padding: 0; overflow: hidden; }
.lrn-vid { width: 100%; aspect-ratio: 16/9; background: #0b1220; }
.lrn-vid iframe, .lrn-vid video { width: 100%; height: 100%; border: 0; display: block; }
.lrn-vid .sh-embed.ig, .lrn-vid .sh-embed.tt { aspect-ratio: 9/16; }
.lrn-cat { font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--accent); padding: 12px 16px 0; }
.lrn-t { font-family: var(--font-display); font-size: 18px; font-weight: 600; color: var(--navy-900); padding: 0 16px; line-height: 1.25; }
.lrn-b { padding: 0 16px; font-size: 13px; color: var(--ink-2); max-height: 200px; overflow: hidden; -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent); }
.lrn-acts { display: flex; gap: 8px; align-items: center; padding: 4px 16px 16px; margin-top: auto; }
.lrn-acts .btn { flex: 1; justify-content: center; }

/* ═══ ВИДЖЕТЫ ×3 — эстетика (по запросу «ещё круче»): иконка-чип, крупнее заголовок, богаче поверхность ═══ */
.ov2-card-hd { font-size: 15px; font-weight: 700; gap: 10px; align-items: center; margin-bottom: 14px; }
.ov2-card-hd > svg:first-child { width: 30px; height: 30px; padding: 7px; box-sizing: border-box; border-radius: 10px; background: color-mix(in srgb, var(--accent) 11%, transparent); color: var(--accent); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 14%, transparent); }
.ov2-card-hd span { margin-left: 1px; font-weight: 450; }
.ov2-card-hd .btn, .ov2-card-hd > button:last-child { margin-left: auto; }
.ov2-grid .ov-w-body { border-radius: var(--r-card, 18px); padding: 18px 19px; position: relative; overflow: hidden; }
/* тончайшая световая линия по верхней кромке (свет сверху = премиум-стекло) */
.ov2-grid .ov-w-body::after { content: ''; position: absolute; left: 14px; right: 14px; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent); pointer-events: none; z-index: 1; }
:root[data-theme="dark"] .ov2-grid .ov-w-body::after, .dark .ov2-grid .ov-w-body::after { background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent); }
/* крупные числа в виджетах — плотнее и выразительнее */
.ov-rep-n b, .ov2-kpi-v { letter-spacing: -.02em; }

/* ── HR · подбор (функционал) ── */
.hr-bar { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.hr-board { opacity: 1; }
.hr-col-b { display: flex; flex-direction: column; gap: 8px; }
.hr-cand { text-align: left; width: 100%; background: var(--card); border: 1px solid var(--stroke); border-radius: 12px; padding: 11px 12px; cursor: pointer; transition: transform .14s var(--ease-spring), box-shadow .14s, border-color .14s; font-family: inherit; }
.hr-cand:hover { transform: translateY(-2px); box-shadow: var(--shadow); border-color: color-mix(in srgb, var(--accent) 40%, var(--stroke)); }
.hr-cand-top { display: flex; align-items: center; gap: 8px; }
.hr-cand-top b { font-size: 13.5px; color: var(--navy-900); }
.hr-cand-v { font-size: 11.5px; color: var(--ink-2); margin-top: 4px; }
.hr-cand-v.muted { color: var(--ink-3); font-style: italic; }
.hr-cand-t { font-size: 10.5px; color: var(--ink-3); margin-top: 4px; }
.hr-sc { flex: none; min-width: 30px; height: 24px; padding: 0 7px; border-radius: 7px; display: inline-grid; place-items: center; font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.hr-sc.hi { background: color-mix(in srgb, #2FA98C 16%, transparent); color: #1E7A64; }
.hr-sc.mid { background: color-mix(in srgb, #E5844B 16%, transparent); color: #B45309; }
.hr-sc.lo { background: color-mix(in srgb, #E5484D 14%, transparent); color: #C0392B; }
.hr-sc.pend { background: var(--bg-2); color: var(--ink-3); letter-spacing: 1px; }
.hr-det { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 14px; }
.hr-det-ans { display: flex; flex-direction: column; gap: 12px; }
.hr-ans span { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 3px; }
.hr-ans div { font-size: 13.5px; color: var(--navy-900); line-height: 1.5; }
.hr-det-ai { background: var(--bg-2); border-radius: 14px; padding: 16px; }
.hr-ai-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; color: var(--ink-3); font-size: 13px; padding: 24px 8px; }
.hr-ai-empty svg { width: 26px; height: 26px; color: var(--accent); opacity: .7; }
.hr-ai-hd { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.hr-ai-hd b { font-size: 14px; color: var(--navy-900); }
.hr-ai-re { margin-left: auto; font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--accent); }
.hr-ai-sum { font-size: 13px; line-height: 1.55; color: var(--ink-2); margin-bottom: 12px; }
.hr-ai-l { margin-bottom: 10px; font-size: 12.5px; color: var(--navy-900); line-height: 1.6; }
.hr-ai-l div { padding-left: 2px; }
.hr-ai-tag { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 8px; border-radius: 20px; margin-bottom: 5px; }
.hr-ai-tag.g { background: color-mix(in srgb, #2FA98C 14%, transparent); color: #1E7A64; }
.hr-ai-tag.r { background: color-mix(in srgb, #E5484D 12%, transparent); color: #C0392B; }
.hr-ai-tag.q { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
.hr-stagebar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding-top: 14px; border-top: 1px solid var(--stroke); }
.hr-stbtn { font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 20px; border: 1px solid var(--stroke); background: var(--card); color: var(--ink-2); cursor: pointer; font-family: inherit; }
.hr-stbtn.on { background: var(--accent); color: #fff; border-color: var(--accent); }
.hr-stbtn.rej { color: #C0392B; }
.hr-stbtn.rej.on { background: #C0392B; color: #fff; border-color: #C0392B; }
.hr-fld { display: grid; grid-template-columns: 1fr 120px auto auto; gap: 8px; align-items: center; margin-bottom: 8px; }
.hr-fld input.hr-fl-l, .hr-fld select { padding: 8px 10px; border: 1px solid var(--stroke); border-radius: 9px; font: inherit; font-size: 13px; }
.hr-fl-r { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--ink-3); white-space: nowrap; }
@media (max-width: 760px) { .hr-det { grid-template-columns: 1fr; } .hr-fld { grid-template-columns: 1fr 1fr; } }

/* ═══ ВИЗУАЛ v4 · СЛОЙ 3 — полировка примитивов (таблицы/пустые/чипы/инпуты/модалки) ═══ */
/* таблицы: мягче хедер, строки с accent-подсветкой при наведении, ровнее ритм */
.tbl th { border-bottom: 1px solid var(--stroke); padding: 9px 11px; color: var(--ink-3); }
.tbl td { padding: 11px; border-bottom: 1px solid var(--stroke-soft); transition: background .14s; }
.tbl tr:hover td { background: color-mix(in srgb, var(--accent) 4%, transparent); }
.tbl tr:last-child td { border-bottom: 0; }
/* пустые состояния — премиальнее (иконка/мягкий фон) */
.empty { padding: 44px 24px; border-radius: var(--r-md); background: linear-gradient(180deg, var(--bg-2), transparent); border: 1px dashed var(--stroke); }
/* бейджи/чипы — единый плотный pill */
.badge, .mini-badge { border-radius: 20px; letter-spacing: .01em; }
.mini-badge { padding: 3px 9px; }
/* инпуты/textarea/select — мягкая глубина + плавный фокус */
input:not([type=checkbox]):not([type=radio]):not([type=range]), textarea, select { transition: border-color var(--dur-fast), box-shadow var(--dur-fast), background var(--dur-fast); }
input:not([type=checkbox]):not([type=radio]):focus, textarea:focus, select:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 12%, transparent); }
/* модалка — матовое стекло + глубже тень + мягче вход */
@supports (backdrop-filter: blur(1px)) { .modal { -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); background: color-mix(in srgb, var(--card) 90%, transparent); } }
.modal { box-shadow: 0 30px 80px -30px rgba(6,17,38,.55), inset 0 1px 0 rgba(255,255,255,.6); }
.modal-bd { -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); background: rgba(6,17,38,.28); }
/* активный пункт нав-рейла — чётче «дорогая» подсветка */
.nav-item.active { position: relative; }

/* ── Видео-студия ── */
.stu-topseg { margin-bottom: 16px; display: inline-flex; }
.stu-card { padding: 18px; }
/* ═══ СТУДИЯ ПРЕЗЕНТАЦИЙ ═══ */
/* каталог */
.dk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 15px; }
.dk-card { position: relative; padding: 0; overflow: hidden; cursor: pointer; transition: transform .16s, box-shadow .16s; }
.dk-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lift); }
.dk-cover { position: relative; aspect-ratio: 16/9; display: flex; align-items: flex-end; padding: 14px 16px; }
.dk-cover-t { font-size: 15px; font-weight: 750; line-height: 1.15; max-height: 62px; overflow: hidden; }
.dk-cover-badge { position: absolute; top: 12px; left: 14px; width: 26px; height: 5px; border-radius: 4px; background: var(--ac); }
.dk-meta { padding: 11px 14px 13px; display: flex; flex-direction: column; gap: 3px; }
.dk-meta b { font-size: 13.5px; font-weight: 650; color: var(--navy-900); }
.dk-meta span { font-size: 11px; color: var(--ink-3); }
.dk-del { position: absolute; top: 10px; right: 10px; width: 26px; height: 26px; border-radius: 8px; background: rgba(6,17,38,.5); color: #fff; display: grid; place-items: center; opacity: 0; transition: opacity .15s; }
.dk-card:hover .dk-del { opacity: 1; } .dk-del svg { width: 13px; height: 13px; }
/* редактор */
.dk-topbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.dk-back svg { transform: rotate(180deg); width: 14px; height: 14px; }
.dk-title-in { flex: 1; min-width: 180px; border: 1px solid var(--stroke); border-radius: 10px; padding: 9px 12px; font: inherit; font-size: 14.5px; font-weight: 650; color: var(--navy-900); background: var(--card); }
.dk-themes, .dk-accents { display: flex; gap: 6px; }
.dk-theme { width: 30px; height: 22px; border-radius: 7px; border: 2px solid transparent; cursor: pointer; }
.dk-theme.on { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 25%, transparent); }
.dk-accent { width: 20px; height: 20px; border-radius: 50%; border: 2px solid transparent; cursor: pointer; }
.dk-accent.on { border-color: var(--navy-900); transform: scale(1.12); }
.dk-ai { border: 1px solid var(--stroke); border-radius: 13px; padding: 14px; margin-bottom: 14px; background: var(--bg-2); }
.dk-ai-lbl { font-size: 12.5px; color: var(--ink-2); margin-bottom: 8px; }
.dk-ai-text { width: 100%; border: 1px solid var(--stroke); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 13px; resize: vertical; background: var(--card); color: var(--navy-900); }
.dk-ai-foot { display: flex; align-items: center; gap: 12px; margin-top: 9px; }
.dk-ai-cnt, .dk-ai-mode { font-size: 12px; color: var(--ink-3); display: inline-flex; align-items: center; gap: 6px; }
.dk-ai-cnt select { border: 1px solid var(--stroke); border-radius: 8px; padding: 4px 8px; font: inherit; background: var(--card); }
.dk-editor { display: grid; grid-template-columns: 148px 1fr 300px; gap: 14px; align-items: start; }
.dk-rail { display: flex; flex-direction: column; gap: 9px; max-height: 72vh; overflow-y: auto; padding-right: 4px; }
.dk-thumb { position: relative; border: 2px solid var(--stroke); border-radius: 10px; overflow: hidden; cursor: pointer; transition: border-color .14s; }
.dk-thumb.on { border-color: var(--accent); }
.dk-thumb-n { position: absolute; top: 4px; left: 5px; z-index: 2; font-size: 10px; font-weight: 700; color: #fff; background: rgba(6,17,38,.55); border-radius: 20px; padding: 1px 6px; }
.dk-thumb-prev { pointer-events: none; }
.dk-thumb-del { position: absolute; top: 3px; right: 3px; z-index: 2; width: 18px; height: 18px; border-radius: 6px; background: rgba(6,17,38,.55); color: #fff; display: grid; place-items: center; opacity: 0; transition: opacity .14s; }
.dk-thumb:hover .dk-thumb-del { opacity: 1; } .dk-thumb-del svg { width: 10px; height: 10px; }
.dk-addslide { display: flex; align-items: center; justify-content: center; gap: 6px; border: 1px dashed var(--stroke); border-radius: 10px; padding: 10px; font-size: 12.5px; font-weight: 600; color: var(--ink-3); cursor: pointer; font-family: inherit; background: transparent; }
.dk-addslide:hover { border-color: var(--accent); color: var(--accent); } .dk-addslide svg { width: 14px; height: 14px; }
.dk-canvas { border-radius: 16px; overflow: hidden; box-shadow: 0 18px 44px rgba(6,17,38,.24); }
.dk-inspect { display: flex; flex-direction: column; gap: 12px; }
.dk-insp-lbl { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink-3); }
.dk-layouts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.dk-lay { font-size: 11.5px; font-weight: 600; border: 1px solid var(--stroke); border-radius: 8px; padding: 7px 4px; cursor: pointer; background: var(--card); color: var(--ink-2); font-family: inherit; }
.dk-lay.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--card)); color: var(--accent); }
.dk-inspect .fl { display: flex; flex-direction: column; gap: 5px; }
.dk-inspect .fl > span { font-size: 11.5px; color: var(--ink-3); font-weight: 600; }
.dk-inspect .dk-f { border: 1px solid var(--stroke); border-radius: 9px; padding: 8px 10px; font: inherit; font-size: 12.5px; background: var(--card); color: var(--navy-900); resize: vertical; }
/* сам слайд — типографика в cqw, масштабируется от размера контейнера (thumb/canvas/present) */
.dslide { position: relative; container-type: inline-size; aspect-ratio: 16/9; width: 100%; overflow: hidden; color: var(--fg); display: flex; }
.dslide .ds-bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .28; }
.dslide .ds-bg-veil { position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(0,0,0,.35)); }
.dslide .ds-c { position: relative; z-index: 1; width: 100%; padding: 7cqw 8cqw; display: flex; flex-direction: column; justify-content: center; gap: 2.4cqw; }
.ds-eyebrow { font-size: 2.6cqw; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.ds-title { font-size: 6cqw; font-weight: 800; line-height: 1.08; letter-spacing: -.01em; }
.ds-title.ds-xl { font-size: 9cqw; } .ds-title.ds-lg { font-size: 7cqw; }
.ds-body { font-size: 3.1cqw; line-height: 1.5; color: var(--sub); max-width: 82%; }
.ds-body-lg { font-size: 3.6cqw; }
.ds-cover { justify-content: flex-end; } .ds-cover .ds-body { margin-top: 1cqw; }
.ds-bullets { list-style: none; margin: 1.5cqw 0 0; padding: 0; display: flex; flex-direction: column; gap: 2.2cqw; }
.ds-bullets li { position: relative; font-size: 3.5cqw; line-height: 1.3; padding-left: 5cqw; }
.ds-bullets li::before { content: ''; position: absolute; left: 0; top: .5cqw; width: 2.6cqw; height: 2.6cqw; border-radius: 6px; background: var(--ac); }
.ds-statc { align-items: flex-start; }
.ds-stat { font-size: 17cqw; font-weight: 900; line-height: .95; letter-spacing: -.02em; }
.ds-statlbl { font-size: 3.8cqw; font-weight: 700; margin-top: 1cqw; }
.ds-quotec { justify-content: center; }
.ds-quote-m { font-size: 14cqw; line-height: .6; font-weight: 800; }
.ds-quote { font-size: 5cqw; font-weight: 650; line-height: 1.25; margin-top: 1cqw; }
.ds-mediac { padding: 0; }
.ds-media { width: 100%; height: 100%; object-fit: cover; display: block; }
.ds-media.ph { display: grid; place-items: center; background: rgba(255,255,255,.06); color: var(--sub); font-size: 3cqw; }
.ds-mediacap { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 5cqw 6cqw; background: linear-gradient(transparent, rgba(0,0,0,.6)); display: flex; flex-direction: column; gap: 1cqw; }
.ds-mediacap b { font-size: 4.5cqw; font-weight: 800; } .ds-mediacap span { font-size: 3cqw; color: rgba(255,255,255,.85); }
.ds-ctac { justify-content: center; }
/* показ */
.dk-present { position: fixed; inset: 0; z-index: 4000; background: #05070d; display: flex; align-items: center; justify-content: center; }
.dk-present-stage { width: min(100vw, 177.7vh); aspect-ratio: 16/9; cursor: pointer; }
.dk-present-stage .dslide { border-radius: 0; }
.dk-present-bar { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 14px; background: rgba(10,17,33,.7); backdrop-filter: blur(8px); border-radius: 30px; padding: 8px 16px; }
.dp-x { color: #fff; display: grid; place-items: center; } .dp-x svg { width: 16px; height: 16px; }
.dp-n { color: rgba(255,255,255,.8); font-size: 12.5px; font-variant-numeric: tabular-nums; }
@media (max-width: 900px) { .dk-editor { grid-template-columns: 1fr; } .dk-rail { flex-direction: row; overflow-x: auto; max-height: none; } .dk-thumb { min-width: 130px; } }
.stu-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.stu-mode .seg-btn { font-size: 12.5px; }
.stu-mic { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink-2); cursor: pointer; }
.stu-mic svg { width: 14px; height: 14px; }
.stu-time { font-variant-numeric: tabular-nums; font-weight: 700; color: #E5484D; font-size: 15px; }
#stuRec.rec { background: #E5484D; }
.stu-stage { position: relative; width: 100%; aspect-ratio: 16/9; background: #0b1220; border-radius: 14px; overflow: hidden; display: grid; place-items: center; }
.stu-stage video, .stu-stage canvas { width: 100%; height: 100%; object-fit: contain; display: block; }
.stu-hint { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; color: rgba(255,255,255,.66); font-size: 13.5px; line-height: 1.5; padding: 24px; z-index: 3; }
.stu-hint svg { width: 34px; height: 34px; opacity: .7; }
.stu-after { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
/* студия записи: источник/чипы/дека */
.stu-deck { border: 1px solid var(--stroke); border-radius: 9px; padding: 7px 10px; font: inherit; font-size: 12.5px; background: var(--card); color: var(--navy-900); max-width: 220px; }
.stu-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; border: 1px solid var(--stroke); border-radius: 9px; padding: 6px 10px; background: var(--card); font-family: inherit; }
.stu-chip.on { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--card)); color: var(--accent); }
.stu-chip svg { width: 14px; height: 14px; }
/* кольцевая лампа: контрол */
.stu-ringrow { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.stu-ring-lbl { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 650; color: var(--ink-2); } .stu-ring-lbl svg { width: 14px; height: 14px; color: #C89B5A; }
.stu-range { flex: 1; min-width: 160px; max-width: 320px; accent-color: var(--accent); height: 4px; }
/* сцена */
.stu-stage { position: relative; width: 100%; aspect-ratio: 16/9; background: #0b1220; border-radius: 14px; overflow: hidden; }
.stu-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; z-index: 1; }
.stu-stage video#stuPlayback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; z-index: 4; background: #0b1220; }
/* кольцевая подсветка: мягкий световой ободок по краям (лечит лицо через экран) + акцент сверху */
.stu-ringlight { position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; transition: opacity .25s; --ri: .5; --rc: 255,255,255; box-shadow: inset 0 0 120px 24px rgba(var(--rc), calc(var(--ri) * .55)), inset 0 70px 90px -30px rgba(var(--rc), calc(var(--ri) * .6)); }
.stu-ringlight::after { content: ''; position: absolute; left: 50%; top: 10px; transform: translateX(-50%); width: 46%; height: 12px; border-radius: 50%; background: rgba(var(--rc), calc(var(--ri) * .9)); filter: blur(14px); }
/* навигация по слайдам поверх сцены */
.stu-navbar { position: absolute; z-index: 3; bottom: 12px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 12px; background: rgba(10,17,33,.62); backdrop-filter: blur(8px); border-radius: 30px; padding: 6px 12px; color: #fff; font-size: 12.5px; font-variant-numeric: tabular-nums; }
.stu-navb { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: rgba(255,255,255,.12); } .stu-navb svg { width: 15px; height: 15px; transform: rotate(180deg); } .stu-navb.stu-next svg { transform: none; }
.stu-navb:hover { background: rgba(255,255,255,.24); }
/* суфлёр */
.stu-tele { position: absolute; z-index: 3; right: 14px; top: 14px; bottom: 60px; width: 34%; max-width: 320px; overflow-y: auto; background: rgba(6,12,26,.82); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; padding: 16px 18px; color: #fff; }
.stu-tele-in b { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #C89B5A; }
.stu-tele-in h4 { font-size: 18px; font-weight: 750; margin: 6px 0 8px; line-height: 1.15; }
.stu-tele-in p { font-size: 13.5px; line-height: 1.55; color: rgba(230,238,255,.82); margin: 0 0 8px; }
.stu-tele-in ul { margin: 0; padding-left: 18px; font-size: 13.5px; line-height: 1.6; }
.stu-tele-note { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.12); font-size: 12.5px; color: rgba(230,238,255,.7); font-style: italic; }
@media (max-width: 640px) { .stu-tele { width: auto; left: 14px; max-width: none; } }

/* ── HR хантинг Threads/IG (inline, без попапов) ── */
.hr-hunt-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 18px; }
.hr-hunt-lbl { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; font-weight: 650; color: var(--navy-900); margin-bottom: 8px; }
.hr-hunt-compose textarea, .hr-hunt-cfg textarea, .hr-hunt-cfg input { width: 100%; border: 1px solid var(--stroke); border-radius: 11px; padding: 11px 13px; font: inherit; font-size: 13.5px; }
.hr-hunt-acts { display: flex; gap: 8px; margin-top: 10px; }
.hr-hunt-cfg .fl { display: block; margin-bottom: 10px; }
.hr-hunt-cfg .fl span { display: block; font-size: 11.5px; color: var(--ink-3); margin-bottom: 4px; }
.hr-hunt-auto { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-2); margin: 4px 0 10px; }
@media (max-width: 820px) { .hr-hunt-grid { grid-template-columns: 1fr; } }

/* ── Академия агентства · конструктор (inline, drag-and-drop) ── */
.lc-share { margin-bottom: 14px; padding: 16px 18px; }
.lc-share-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 12px; margin: 10px 0; }
.lc-share-foot { display: flex; justify-content: flex-end; }
.lc-list { display: flex; flex-direction: column; gap: 10px; }
.lc-item { border-radius: 14px; overflow: hidden; transition: box-shadow .16s, opacity .16s; }
.lc-item.lc-dragging { opacity: .85; box-shadow: var(--shadow-lift); }
.lc-head { display: flex; align-items: center; gap: 11px; padding: 13px 15px; cursor: pointer; }
.lc-grip { display: grid; place-items: center; width: 24px; height: 28px; color: var(--ink-3); cursor: grab; flex: none; touch-action: none; }
.lc-grip:active { cursor: grabbing; }
.lc-grip svg { width: 16px; height: 16px; }
.lc-vico { flex: none; position: relative; display: grid; place-items: center; }
.lc-vico svg { width: 16px; height: 16px; }
.lc-vico-play { position: absolute; right: -3px; bottom: -3px; width: 16px; height: 16px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; box-shadow: 0 2px 6px rgba(6,17,38,.35); }
.lc-vico-play svg { width: 9px; height: 9px; }

/* ═══ АКАДЕМИЯ АГЕНТСТВА — премиум-модули с кастомными обложками ═══ */
/* hero-баннер (Higgsfield-арт) */
.lm-hero { position: relative; border-radius: 18px; overflow: hidden; background: #0A1833; padding: 32px 34px; margin-bottom: 18px; min-height: 172px; display: flex; align-items: center; box-shadow: 0 18px 44px rgba(6,17,38,.28); }
.lm-hero-v { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lm-hero-veil { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(6,17,38,.94) 22%, rgba(6,17,38,.5) 62%, rgba(6,17,38,.2)); }
.lm-hero-in { position: relative; z-index: 1; }
.lm-hero-badge { display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: #EAD9B0; background: rgba(200,155,90,.16); border: 1px solid rgba(200,155,90,.3); padding: 5px 12px; border-radius: 30px; }
.lm-hero-badge svg { width: 14px; height: 14px; }
.lm-hero-h { font-size: 26px; font-weight: 800; color: #fff; margin: 12px 0 5px; letter-spacing: -.01em; line-height: 1.1; }
.lm-hero-s { font-size: 13px; color: rgba(230,238,255,.78); max-width: 560px; line-height: 1.5; }
/* папка-обложка модуля */
.lm-fold { position: relative; flex: none; border-radius: 13px; overflow: hidden; display: grid; place-items: center; background: #0A1833; box-shadow: 0 8px 20px -8px rgba(6,17,38,.5); }
.lm-fold img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--ease-spring, ease); }
.lm-folder:hover .lm-fold img, .lm-card:hover .lm-fold img { transform: scale(1.06); }
/* живой блик по обложке — модуль не выглядит статичным */
.lm-fold .lm-fold-g { position: absolute; inset: 0; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--hue,var(--accent-2)) 45%, transparent), inset 0 -18px 30px -14px color-mix(in srgb, var(--hue,var(--accent-2)) 60%, transparent); border-radius: inherit; pointer-events: none; overflow: hidden; }
.lm-fold .lm-fold-g::after { content: ''; position: absolute; top: -60%; left: -30%; width: 40%; height: 220%; background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent); transform: rotate(8deg); animation: lmSheen 5.5s ease-in-out infinite; }
@keyframes lmSheen { 0%, 100% { left: -40%; } 55%, 100% { left: 120%; } }
@media (prefers-reduced-motion: reduce) { .lm-fold .lm-fold-g::after { animation: none; } }
.lm-fold.noimg { color: color-mix(in srgb, var(--hue,var(--accent-2)) 70%, #fff); border: 1px solid color-mix(in srgb, var(--hue,var(--accent-2)) 35%, transparent); }
.lm-fold.noimg svg { width: 44%; height: 44%; }
/* полка модулей (владелец) — папки-фильтры */
.lm-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; margin-bottom: 18px; }
.lm-folder { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 14px; border: 1px solid var(--stroke); background: var(--card); cursor: pointer; font-family: inherit; text-align: left; transition: transform .15s, box-shadow .15s, border-color .15s; }
.lm-folder:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.lm-folder.on { border-color: color-mix(in srgb, var(--hue) 60%, transparent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--hue) 14%, transparent); }
.lm-folder-tt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lm-folder-tt b { font-size: 13.5px; font-weight: 700; color: var(--navy-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lm-folder-tt span { font-size: 11px; color: var(--ink-3); }
/* модуль (чтение) */
.lm-mod { margin-bottom: 26px; }
.lm-mod-h { display: flex; align-items: center; gap: 14px; margin-bottom: 13px; }
.lm-mod-tt b { font-size: 17px; font-weight: 750; color: var(--navy-900); display: block; }
.lm-mod-tt span { font-size: 12px; color: var(--ink-3); }
.lm-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; align-items: start; }
.lm-card { padding: 0; overflow: hidden; cursor: pointer; transition: transform .16s, box-shadow .16s; border-top: 3px solid var(--hue); }
.lm-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-lift); }
.lm-card-cover { position: relative; display: flex; align-items: center; gap: 10px; padding: 13px 14px 0; }
.lm-play { position: absolute; top: 13px; right: 14px; width: 26px; height: 26px; border-radius: 50%; background: color-mix(in srgb, var(--hue) 90%, #000); color: #fff; display: grid; place-items: center; box-shadow: 0 4px 10px -3px color-mix(in srgb, var(--hue) 70%, transparent); }
.lm-play svg { width: 12px; height: 12px; }
.lm-card-b { padding: 10px 14px 14px; display: flex; flex-direction: column; gap: 5px; }
.lm-card-cat { font-size: 10.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; color: color-mix(in srgb, var(--hue) 75%, var(--ink-2)); }
.lm-card-t { font-size: 14.5px; font-weight: 700; color: var(--navy-900); line-height: 1.25; }
.lm-card-p { font-size: 12px; color: var(--ink-3); line-height: 1.5; }
.lm-card-read { padding: 0 14px 14px; border-top: 1px solid var(--stroke-soft); margin-top: 2px; }
.lm-card.open { cursor: default; }
.lm-embed { margin: 12px 0; border-radius: 12px; overflow: hidden; aspect-ratio: 16/9; background: #0b1220; }
.lm-embed iframe, .lm-embed video { width: 100%; height: 100%; border: 0; display: block; }
.lm-body { font-size: 13px; line-height: 1.65; color: var(--ink-2); }
.lm-preview-exit { margin-bottom: 12px; } .lm-preview-exit svg { transform: rotate(180deg); width: 14px; height: 14px; }
@media (max-width: 640px) { .lm-hero-h { font-size: 21px; } .lm-shelf { grid-template-columns: 1fr 1fr; } }
.lc-h-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lc-h-title { font-size: 14.5px; color: var(--navy-900); font-weight: 650; }
.lc-h-cat { font-size: 11.5px; color: var(--ink-3); }
.lc-saved { font-size: 11px; color: var(--ok); opacity: 0; transition: opacity .2s; }
.lc-saved.show { opacity: 1; }
.lc-caret { color: var(--ink-3); transition: transform .2s; flex: none; }
.lc-caret svg { width: 16px; height: 16px; }
.lc-item.open .lc-caret { transform: rotate(90deg); }
.lc-edit { padding: 4px 15px 16px; border-top: 1px solid var(--stroke); }
.lc-e-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.lc-edit .fl { display: block; margin: 12px 0 0; }
.lc-edit .fl > span { display: block; font-size: 11.5px; color: var(--ink-3); margin-bottom: 5px; }
.lc-edit input, .lc-edit textarea { width: 100%; border: 1px solid var(--stroke); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 13.5px; }
.lc-vprev { margin-top: 10px; }
.lc-vprev iframe, .lc-vprev video { width: 100%; max-width: 360px; aspect-ratio: 16/9; border: 0; border-radius: 10px; background: #0b1220; }
.lc-vprev .sh-embed.ig, .lc-vprev .sh-embed.tt { aspect-ratio: 9/16; max-width: 240px; }
.lc-e-foot { margin-top: 12px; }
.lc-del { color: #C0392B; }
@media (max-width: 680px) { .lc-e-grid, .lc-share-grid { grid-template-columns: 1fr; } }

/* ── умный поиск в сайдбаре ── */
.navsearch { position: relative; padding: 0 14px 10px; }
.navsearch input { width: 100%; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #fff; border-radius: 11px; padding: 9px 12px; font: inherit; font-size: 13px; outline: none; transition: border-color .15s, background .15s; }
.navsearch input::placeholder { color: rgba(255,255,255,.45); }
.navsearch input:focus { border-color: color-mix(in srgb, var(--accent) 60%, transparent); background: rgba(255,255,255,.10); }
.navsearch-res { position: fixed; z-index: 300; background: var(--card); border: 1px solid var(--stroke); border-radius: 12px; box-shadow: var(--shadow-lift); padding: 5px; max-height: 340px; overflow-y: auto; }
:root[data-theme="dark"] .navsearch-res, .dark .navsearch-res { background: var(--surface-2, #16233D); }
.ns-item { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 0; background: transparent; border-radius: 9px; padding: 9px 10px; cursor: pointer; font: inherit; color: var(--navy-900); }
.ns-item svg { width: 16px; height: 16px; color: var(--ink-3); flex: none; }
.ns-item.sel, .ns-item:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
.ns-item.sel svg, .ns-item:hover svg { color: var(--accent); }
.ns-nm { display: flex; flex-direction: column; gap: 1px; font-size: 13.5px; font-weight: 600; }
.ns-nm i { font-style: normal; font-size: 11px; font-weight: 400; color: var(--ink-3); }
.ns-empty { padding: 14px; text-align: center; color: var(--ink-3); font-size: 12.5px; }

/* ── вкладки страницы «Реклама» ── */
.adtabs { display: flex; gap: 6px; margin: 4px 0 16px; flex-wrap: wrap; border-bottom: 1px solid var(--stroke); padding-bottom: 0; }
.adtab { display: inline-flex; align-items: center; gap: 7px; border: 0; background: transparent; color: var(--ink-2); font: inherit; font-size: 13.5px; font-weight: 600; padding: 9px 14px; cursor: pointer; border-radius: 10px 10px 0 0; position: relative; transition: color .14s, background .14s; }
.adtab svg { width: 15px; height: 15px; color: var(--ink-3); }
.adtab:hover { color: var(--navy-900); background: var(--bg-2); }
.adtab.on { color: var(--accent); }
.adtab.on svg { color: var(--accent); }
.adtab.on::after { content: ''; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 2.5px; border-radius: 3px; background: var(--accent); }
.adtab-panel { animation: reveal .3s var(--ease-soft) both; }

/* ═══════════ КОНТРОЛЬ — командный центр рисков ═══════════ */
.ctrl-wrap { display: flex; flex-direction: column; gap: 16px; }
.ctrl-hero { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: var(--card); border: 1px solid var(--stroke); border-radius: 16px; padding: 20px 24px; box-shadow: var(--shadow); border-left: 4px solid var(--ok); }
.ctrl-hero.alarm { border-left-color: var(--bad); }
.ctrl-hero.watch { border-left-color: var(--warn); }
.ctrl-hero.calm { border-left-color: var(--ok); }
.ctrl-hero-l { display: flex; align-items: baseline; gap: 14px; }
.ctrl-hero-big { font-size: 40px; font-weight: 800; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.ctrl-hero.alarm .ctrl-hero-big { color: var(--bad); }
.ctrl-hero.watch .ctrl-hero-big { color: var(--warn); }
.ctrl-hero.calm .ctrl-hero-big { color: var(--ok); }
.ctrl-hero-t { font-size: 14px; color: var(--ink-2); font-weight: 550; }
.ctrl-crit { color: var(--bad); font-weight: 700; }
.ctrl-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.ctrl-card { background: var(--card); border: 1px solid var(--stroke); border-radius: 15px; padding: 16px 17px; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.ctrl-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; }
.ctrl-card.s-crit::before { background: var(--bad); }
.ctrl-card.s-warn::before { background: var(--warn); }
.ctrl-card-hd { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; }
.ctrl-ico { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; flex: none; background: var(--bg-2); }
.ctrl-ico svg { width: 17px; height: 17px; color: var(--ink-2); }
.ctrl-card.s-crit .ctrl-ico { background: var(--bad-bg); } .ctrl-card.s-crit .ctrl-ico svg { color: var(--bad); }
.ctrl-card.s-warn .ctrl-ico { background: var(--warn-bg); } .ctrl-card.s-warn .ctrl-ico svg { color: var(--warn); }
.ctrl-card-hd b { font-size: 14.5px; letter-spacing: -.01em; display: block; }
.ctrl-card-hd small { font-size: 11.5px; color: var(--ink-3); }
.ctrl-card-hd > div { flex: 1; min-width: 0; }
.ctrl-badge { font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink); background: var(--bg-2); border-radius: 9px; padding: 3px 10px; flex: none; }
.ctrl-card.s-crit .ctrl-badge { color: color-mix(in srgb, var(--bad) 78%, #2a0209); background: var(--bad-bg); }
.ctrl-card.s-warn .ctrl-badge { color: color-mix(in srgb, var(--warn) 56%, #3a2200); background: var(--warn-bg); }
.ctrl-list { display: flex; flex-direction: column; }
.ctrl-row { display: flex; align-items: center; gap: 8px; padding: 9px 0; border-top: 1px solid var(--stroke); }
.ctrl-row:first-child { border-top: none; }
.ctrl-row[data-ovlead]:hover { background: var(--bg-2); margin: 0 -8px; padding: 9px 8px; border-radius: 8px; }
.ctrl-row-nm { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 0 1 auto; }
.ctrl-row-meta { font-size: 12px; color: var(--ink-3); margin-left: auto; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 62%; }
.ctrl-row-go { flex: none; } .ctrl-row-go svg { width: 14px; height: 14px; color: var(--ink-3); }
.ctrl-more { font-size: 12px; color: var(--accent); padding: 9px 0 2px; font-weight: 600; }
.ctrl-calm-box { display: flex; align-items: center; gap: 14px; background: var(--ok-bg); border: 1px solid #C4E6D6; border-radius: 15px; padding: 20px 22px; }
.ctrl-calm-box svg { width: 26px; height: 26px; color: var(--ok); flex: none; }
.ctrl-calm-box b { display: block; font-size: 15px; } .ctrl-calm-box span { font-size: 13px; color: var(--ink-2); }
html[data-night] .ctrl-calm-box { border-color: #1D4A38; }
.ctrl-team { background: var(--card); border: 1px solid var(--stroke); border-radius: 15px; padding: 16px 18px; box-shadow: var(--shadow); }
.ctrl-team-hd { display: flex; align-items: center; gap: 9px; font-size: 14.5px; font-weight: 700; margin-bottom: 12px; }
.ctrl-team-hd svg { width: 17px; height: 17px; color: var(--ink-2); }
.ctrl-team-hd small { font-weight: 400; font-size: 11.5px; color: var(--ink-3); margin-left: auto; }
.ctrl-team-list { display: flex; flex-direction: column; }
.ctrl-team-row { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-top: 1px solid var(--stroke); }
.ctrl-team-row:first-child { border-top: none; }
.ctrl-team-nm { font-size: 14px; font-weight: 600; flex: 1; } .ctrl-team-nm i { font-style: normal; color: var(--ink-3); font-weight: 400; font-size: 12px; margin-left: 8px; }
.ctrl-team-load { font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ink-2); background: var(--bg-2); border-radius: 8px; padding: 3px 9px; }
.ctrl-team-load.over { color: var(--bad); background: var(--bad-bg); }
/* мастер передачи дел */
.off-sum { font-size: 14px; line-height: 1.55; margin-bottom: 16px; }
.off-lbl { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); display: block; margin-bottom: 7px; }
.off-dist { background: var(--bg-2); border-radius: 12px; padding: 12px 14px; margin: 14px 0; }
.off-dist-hd { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); margin-bottom: 8px; }
.off-dist-row { display: flex; justify-content: space-between; font-size: 13.5px; padding: 4px 0; }
.off-dist-row b { font-variant-numeric: tabular-nums; }
.off-check { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--ink-2); margin-top: 6px; cursor: pointer; }
.off-check input { width: 17px; height: 17px; accent-color: var(--accent); }
.off-warn { margin-top: 12px; font-size: 13px; color: var(--bad); background: var(--bad-bg); border-radius: 10px; padding: 10px 12px; }

/* Фаза 4: дежурство, тон, слияние дублей */
.btn-xs { padding: 4px 9px; font-size: 11px; border-radius: 7px; }
.ctrl-away-tag { font-size: 10.5px; font-weight: 700; color: var(--warn); background: var(--warn-bg); border-radius: 6px; padding: 1px 7px; margin-left: 8px; vertical-align: 1px; }
.ctrl-tone-tag { font-size: 10.5px; font-weight: 700; color: var(--bad); background: var(--bad-bg); border-radius: 6px; padding: 1px 7px; margin-left: 6px; vertical-align: 1px; }
.ctrl-team-row .btn-xs { flex: none; }
.ctrl-row .btn-xs { flex: none; margin-left: auto; }
.mrg-list { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.mrg-row { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid var(--stroke); border-radius: 12px; cursor: pointer; transition: .12s; }
.mrg-row:has(input:checked) { border-color: var(--accent); background: var(--bg-2); }
.mrg-row input { width: 17px; height: 17px; accent-color: var(--accent); flex: none; }
.mrg-row b { font-size: 14px; } .mrg-row small { display: block; font-size: 12px; color: var(--ink-3); margin-top: 2px; }

/* Риск-срез воронки (Контроль) */
.cav-wrap { margin-top: 2px; }
.cav-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-bottom: 6px; }
.cav-sub { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); margin-bottom: 11px; }
.cav-bar { margin-bottom: 9px; }
.cav-bar-t { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--ink-2); margin-bottom: 4px; }
.cav-bar-t b { color: var(--ink); font-variant-numeric: tabular-nums; }
.cav-track { position: relative; height: 8px; background: var(--bg-2); border-radius: 5px; overflow: hidden; }
.cav-track > span { position: absolute; inset: 0 auto 0 0; background: var(--accent); border-radius: 5px; }
.cav-stall { position: absolute; right: 4px; top: -5px; font-size: 10px; font-weight: 700; color: var(--warn); font-style: normal; }
.cav-leaks { display: flex; flex-direction: column; gap: 8px; }
.cav-leak { padding: 9px 12px; background: var(--bad-bg); border-radius: 10px; font-size: 13px; }
.cav-leak-k { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--bad); margin-right: 7px; }
.cav-leak b { font-size: 13.5px; } .cav-leak-v { display: block; font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.cav-ok { font-size: 13px; color: color-mix(in srgb, var(--ok) 74%, #06170f); background: var(--ok-bg); border-radius: 10px; padding: 12px 14px; }
.cav-segs { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 18px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--stroke); }
.cav-seg-h { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); margin-bottom: 9px; }
.cav-seg-row { display: flex; align-items: center; gap: 9px; padding: 5px 0; }
.cav-seg-nm { font-size: 12.5px; width: 78px; flex: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cav-seg-bars { flex: 1; height: 7px; background: var(--bg-2); border-radius: 4px; overflow: hidden; display: flex; }
.cav-win { background: var(--ok); height: 100%; } .cav-loss { background: var(--bad); height: 100%; opacity: .55; }
.cav-seg-pct { font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; width: 36px; text-align: right; flex: none; color: var(--ink-2); }
.cav-seg-pct.bad { color: var(--bad); }
@media (max-width: 720px) { .cav-grid { grid-template-columns: 1fr; gap: 16px; } }

/* Настройки контроля + делегирование */
.cst-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.cst-f { display: flex; flex-direction: column; gap: 5px; font-size: 12.5px; color: var(--ink-2); }
.cst-f span { font-weight: 600; }
.cst-f input, .cst-f select { padding: 9px 11px; border: 1px solid var(--stroke); border-radius: 10px; background: var(--card); color: var(--ink); font-family: inherit; font-size: 14px; }
.cst-deleg { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--stroke); }
.cst-deleg-h { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; margin-bottom: 6px; }
.cst-deleg-h svg { width: 16px; height: 16px; color: var(--accent); }
.cst-deleg-d { font-size: 12.5px; color: var(--ink-3); margin: 0 0 11px; line-height: 1.5; }
.cst-deleg select { width: 100%; padding: 10px 12px; border: 1px solid var(--stroke); border-radius: 10px; background: var(--card); color: var(--ink); font-family: inherit; font-size: 14px; }
.cst-note { margin-top: 16px; font-size: 12.5px; color: var(--ink-3); background: var(--bg-2); border-radius: 10px; padding: 11px 13px; }
@media (max-width: 560px) { .cst-grid { grid-template-columns: 1fr; } }

/* ═══════════ ТЕМА «МОНО» — чёрно-белый минимализм 2026 ═══════════
   Пресет поверх светлой базы: хром обесцвечен (акцент→графит, синие/фиолет→серые,
   hero→уголь), семантика (ok/warn/bad) приглушена, но различима. Только токены —
   компоненты уже на var(). Не комбинируется с data-night (свой самостоятельный вид). */
:root[data-theme="mono"] {
  --navy-950: #0a0a0a; --navy-900: #141414; --navy-700: #262626;
  --accent: #171717; --accent-2: #262626;
  --blue-300: #9a9a9a; --blue-100: #ededed;
  --bg: #f6f6f6; --bg-2: #efefef; --card: #ffffff;
  --ink: #0d0d0d; --ink-2: #3a3a3a; --ink-3: #6b6b6b;
  --stroke: #e0e0e0; --stroke-soft: #eaeaea; --glass: rgba(255,255,255,.7);
  --violet: #4a4a4a; --violet-bg: #eeeeee;
  --ok: #2f6b52; --ok-bg: #e9efeb;
  --warn: #6d5a2e; --warn-bg: #f0ece2;
  --bad: #7a3a34; --bad-bg: #f0e7e5;
  --shadow: 0 1px 2px rgba(0,0,0,.05), 0 3px 8px -3px rgba(0,0,0,.08), 0 14px 32px -16px rgba(0,0,0,.14);
  --shadow-lift: 0 2px 6px -2px rgba(0,0,0,.12), 0 20px 48px -18px rgba(0,0,0,.28);
  /* Обзор/виджеты */
  --logo-a: #6b6b6b; --logo-b: #2b2b2b; --logo-c: #111111;
  --ov-primary: #171717; --ov-primary-hover: #000000;
  --ov-soft-blue: #eeeeee; --ov-soft-green: #eaefec; --ov-soft-red: #f0e7e5;
  --ov-soft-amber: #f0ece2; --ov-soft-purple: #ededed;
  --ov-cat-blue: #2b2b2b; --ov-cat-green: #4a5f54; --ov-cat-red: #7a4b45;
  --ov-cat-amber: #6d5a2e; --ov-cat-purple: #4a4a4a;
  --ov-chip-gray: #f0f0f0; --ov-gold-soft: #f3f1ec;
  --gauge-track: #e6e6e6;
  --ov-hero-a: #0d0d0d; --ov-hero-b: #1f1f1f; --ov-hero-c: #2e2e2e;
}
/* приглушаем цветные градиенты бренда в моно (кнопки-акценты, орбы) */
:root[data-theme="mono"] .btn-accent, :root[data-theme="mono"] .btn-primary {
  background: #171717; border-color: #171717; color: #fff;
}
:root[data-theme="mono"] .btn-accent:hover, :root[data-theme="mono"] .btn-primary:hover { background: #000; }
/* моно: обесцветить фирменные хардкод-градиенты (FAB-орб, логотип, ИИ-палочка) */
:root[data-theme="mono"] .qfab-orb { background: radial-gradient(circle at 32% 28%, #4a4a4a, #1f1f1f 45%, #000 100%); box-shadow: 0 10px 30px -6px rgba(0,0,0,.5), inset 0 2px 6px rgba(255,255,255,.25), inset 0 -6px 12px rgba(0,0,0,.5); }
:root[data-theme="mono"] .qfab-orb::after { background: radial-gradient(circle, rgba(0,0,0,.4), transparent 70%); }
:root[data-theme="mono"] .brand-mark { filter: grayscale(1) contrast(1.05) drop-shadow(0 2px 8px rgba(0,0,0,.35)); }
:root[data-theme="mono"] .aiwand { background: linear-gradient(120deg, #2b2b2b, #0d0d0d); }
:root[data-theme="mono"] .brand-mark img { filter: grayscale(1) contrast(1.04); }

/* ═══════════ ПИКЕР ОФОРМЛЕНИЯ (меню пресетов) ═══════════ */
.theme-menu { position: fixed; z-index: 900; width: 268px; background: var(--card); border: 1px solid var(--stroke); border-radius: 14px; box-shadow: var(--shadow-lift); padding: 7px; animation: tmIn .16s var(--ease-spring, ease); }
@keyframes tmIn { from { opacity: 0; transform: translateY(-6px) scale(.98); } }
.tm-h { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--ink-3); padding: 6px 9px 8px; }
.tm-item { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left; border: none; background: none; padding: 8px 9px; border-radius: 10px; cursor: pointer; font-family: inherit; color: var(--ink); transition: background .12s; }
.tm-item:hover { background: var(--bg-2); }
.tm-item.on { background: var(--bg-2); }
.tm-sw { display: flex; flex: none; border-radius: 7px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.tm-sw i { width: 13px; height: 30px; display: block; }
.tm-tx { flex: 1; min-width: 0; } .tm-tx b { font-size: 13.5px; font-weight: 700; display: block; } .tm-tx small { font-size: 11px; color: var(--ink-3); }
.tm-ok { color: var(--accent); font-weight: 800; }

/* ═══ LUMEN BURGUNDY — бордо = БРЕНД-АКЦЕНТ, а НЕ красный фильтр на весь экран ═══
   Принцип: workspace ЧИСТЫЙ светлый нейтраль; бордо живёт в сайдбаре, primary-кнопках,
   активной навигации, hero-графике, бренд-иконке. Семантика — нормальные цвета. */
:root[data-theme="warm"] {
  /* бордо-шкала (бренд) */
  --burgundy-900: #32101C; --burgundy-700: #6B1830; --burgundy-600: #8D1F42;
  --burgundy-500: #AC2852; --burgundy-300: #DD7693; --burgundy-100: #F9E4EA;
  /* тёмная база сайдбара (navy-токены переиспользуются структурой) */
  --navy-950: #210810; --navy-900: #42121F; --navy-700: #6B1830;
  --accent: #861C3C; --accent-2: #9E2348; --accent-3: #6B1830; --accent-hover: #741832;
  --blue-300: #DD7693; --blue-100: #F9E4EA;
  /* нейтрали — workspace остаётся ЧИСТЫМ светлым, БЕЗ розового тинта */
  --bg: #F8FAFD; --bg-2: #F2F5F9; --card: #FFFFFF;
  --ink: #141821; --ink-2: #56505A; --ink-3: #78727A;
  --stroke: rgba(30,40,60,.08); --stroke-soft: rgba(30,40,60,.05); --glass: rgba(255,255,255,.7);
  /* семантика — НОРМАЛЬНЫЕ цвета (НЕ бордо!) */
  --ok: #1F9D73; --ok-bg: #DFF5EC; --warn: #D99A34; --warn-bg: #FFF2D8; --bad: #D94757; --bad-bg: #FCE5E8;
  --violet: #7657D9; --violet-bg: #EDE8FB;
  --ov-primary: #861C3C; --ov-primary-hover: #741832;
  --ov-chip-gray: #F1F4F8; --gauge-track: rgba(30,40,60,.10);
  /* hero — тёмное почти-чёрное ВИНО (глубоко, не «кровь»; служит базой под видеофон) */
  --ov-hero-a: #2C0C15; --ov-hero-b: #180710; --ov-hero-c: #45121F;
  /* логотип на ТЁМНОМ сайдбаре — светлый бордо */
  --logo-a: #F4C9D5; --logo-b: #DD7693; --logo-c: #AC2852;
  /* accent-soft границы под бордо (были хардкод-синие #C3D6FA/#B9CBEE → клеш с розовым фоном) */
  --accent-soft-bd: rgba(134,28,60,.20); --hover-bd: rgba(134,28,60,.26);
}
:root[data-theme="warm"] .ha-obj { filter: hue-rotate(118deg) saturate(1.1) brightness(.98) drop-shadow(0 20px 26px rgba(0,0,0,.5)); }

/* ── Контур: чёткие рамки, минимум теней (bold outline) ── */
:root[data-theme="frame"] {
  --accent: #111827; --accent-2: #1F2937;
  --blue-300: #6B7280; --blue-100: #E5E7EB;
  --bg: #FFFFFF; --bg-2: #F3F4F6; --card: #FFFFFF;
  --ink: #0B0F19; --ink-2: #374151; --ink-3: #6B7280;
  --stroke: #111827; --stroke-soft: #9CA3AF;   /* рамки — тёмные и заметные */
  --shadow: none; --shadow-lift: 0 2px 0 #111827;
  --ok: #14532D; --ok-bg: #E7F0E9; --warn: #713F12; --warn-bg: #F3ECD9; --bad: #7F1D1D; --bad-bg: #F3E4E4;
  --violet: #3730A3; --violet-bg: #E7E6F5;
  --ov-primary: #111827; --ov-primary-hover: #000; --gauge-track: #D1D5DB;
  --logo-a: #4B5563; --logo-b: #1F2937; --logo-c: #111827;
  --r-lg: 8px; --r-md: 6px; --r-sm: 4px;
}
:root[data-theme="frame"] .card, :root[data-theme="frame"] .glass, :root[data-theme="frame"] .kpi,
:root[data-theme="frame"] .ctrl-card, :root[data-theme="frame"] .ctrl-hero, :root[data-theme="frame"] .ctrl-team,
:root[data-theme="frame"] .ov2-card, :root[data-theme="frame"] .modal { border-width: 1.5px; box-shadow: 3px 3px 0 rgba(17,24,39,.12); }
:root[data-theme="frame"] .brand-mark img { filter: grayscale(1) contrast(1.1); }

/* ═══ LUMEN GLASS — атмосферное стекло, premium-OS (спека Lumen Glass 2026) ═══ */
:root[data-theme="emerald"] {
  --navy-950: #071426; --navy-900: #0A1930; --navy-700: #17365F;
  --accent: #397BFF; --accent-2: #2868FF; --accent-3: #65A0FF;
  --blue-300: #9AC1FF; --blue-100: #E8F1FF;
  --bg: #F5F8FD; --bg-2: #EAF1FB; --card: rgba(255,255,255,.68);
  --ink: #0F1E36; --ink-2: #344054; --ink-3: #5C6675;
  --stroke: rgba(15,35,65,.08); --stroke-soft: rgba(255,255,255,.62); --glass: rgba(255,255,255,.55);
  --ok: #24B47E; --ok-bg: #E4F6EE; --warn: #F4A340; --warn-bg: #FBF1DF; --bad: #EF596F; --bad-bg: #FCE9EC;
  --violet: #8268FF; --violet-bg: #EEEAFF;
  --ov-primary: #2868FF; --ov-primary-hover: #1E54DB; --gauge-track: rgba(15,35,65,.08);
  --ov-hero-a: #071426; --ov-hero-b: #0A1930; --ov-hero-c: #17365F;
  --logo-a: #9AC1FF; --logo-b: #397BFF; --logo-c: #2868FF;
  --shadow: 0 8px 28px rgba(14,30,55,.07); --shadow-lift: 0 18px 55px rgba(14,30,55,.11);
  --r-lg: 22px; --r-md: 16px; --r-sm: 12px;
}
/* атмосферная среда: приложение сидит на мягком голубо-белом градиенте с радиальными свечениями */
:root[data-theme="emerald"] .app, :root[data-theme="emerald"] body {
  background:
    radial-gradient(circle at 74% -4%, rgba(116,164,255,.16), transparent 44%),
    radial-gradient(circle at 22% 26%, rgba(197,218,255,.14), transparent 40%),
    radial-gradient(circle at 96% 70%, rgba(154,193,255,.10), transparent 46%),
    linear-gradient(135deg, #F8FBFF 0%, #EEF5FF 38%, #F7F9FC 72%, #FFFFFF 100%);
  background-attachment: fixed;
}
:root[data-theme="emerald"] .main, :root[data-theme="emerald"] .content { background: transparent; }
/* сайдбар — светлый frosted-слой (spatial), тёмный текст */
:root[data-theme="emerald"] .sidebar { background: rgba(248,251,255,.60); -webkit-backdrop-filter: blur(28px) saturate(1.4); backdrop-filter: blur(28px) saturate(1.4); border-right: 1px solid rgba(255,255,255,.6); box-shadow: 1px 0 40px rgba(14,30,55,.05); }
:root[data-theme="emerald"] .sidebar .nav-item, :root[data-theme="emerald"] .brand-name, :root[data-theme="emerald"] .agency .nm { color: var(--ink); }
:root[data-theme="emerald"] .nav-item { color: var(--ink-2) !important; }
:root[data-theme="emerald"] .nav-item:hover { background: rgba(255,255,255,.55); color: var(--ink) !important; }
/* активный пункт: ТЁМНЫЙ текст на плотной frosted-пилюле + акцентный левый бар и синяя иконка
   (раньше был синий текст на бледной подложке — сливался со стеклом) */
:root[data-theme="emerald"] .nav-item.active { background: rgba(255,255,255,.92); color: var(--ink) !important; font-weight: 700; box-shadow: inset 3px 0 0 var(--accent), inset 0 0 0 1px rgba(255,255,255,.7), 0 6px 18px rgba(14,30,55,.10); }
:root[data-theme="emerald"] .nav-item.active svg, :root[data-theme="emerald"] .nav-item.active .ni-ic { color: var(--accent); opacity: 1; }
:root[data-theme="emerald"] .nav-label, :root[data-theme="emerald"] .agency .rl { color: var(--ink-3); }
/* поиск в сайдбаре и топбаре: плотный матовый фон + читаемый текст/плейсхолдер (были почти прозрачны) */
:root[data-theme="emerald"] .navsearch { background: rgba(255,255,255,.78) !important; box-shadow: inset 0 0 0 1px rgba(15,35,65,.07), 0 2px 10px rgba(14,30,55,.05) !important; }
:root[data-theme="emerald"] .navsearch input { color: var(--ink) !important; background: transparent !important; }
:root[data-theme="emerald"] .gsearch { background: rgba(255,255,255,.82) !important; }
:root[data-theme="emerald"] #gsInput { color: var(--ink) !important; }
:root[data-theme="emerald"] .navsearch input::placeholder, :root[data-theme="emerald"] #gsInput::placeholder, :root[data-theme="emerald"] #navSearch::placeholder { color: rgba(52,64,84,.72) !important; }
:root[data-theme="emerald"] .brand-name span { color: var(--ink-2); }
/* Стекло: карточки — матовое стекло с blur; много воздуха, тонкие линии, меньше текста */
:root[data-theme="emerald"] .card, :root[data-theme="emerald"] .glass, :root[data-theme="emerald"] .ov2-card,
:root[data-theme="emerald"] .kpi, :root[data-theme="emerald"] .ctrl-card, :root[data-theme="emerald"] .ctrl-hero,
:root[data-theme="emerald"] .ctrl-team, :root[data-theme="emerald"] .modal, :root[data-theme="emerald"] .ovx-kcard,
:root[data-theme="emerald"] .ovx-hero, :root[data-theme="emerald"] .navsearch, :root[data-theme="emerald"] .gsearch,
:root[data-theme="emerald"] .navsearch, :root[data-theme="emerald"] .gsearch { background: rgba(255,255,255,.55); -webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4); border: 1px solid var(--stroke-soft); box-shadow: var(--shadow); }
:root[data-theme="emerald"] .card, :root[data-theme="emerald"] .glass, :root[data-theme="emerald"] .ov2-card,
:root[data-theme="emerald"] .kpi, :root[data-theme="emerald"] .ctrl-card, :root[data-theme="emerald"] .ctrl-hero,
:root[data-theme="emerald"] .ctrl-team, :root[data-theme="emerald"] .modal, :root[data-theme="emerald"] .ovx-kcard {
  background: rgba(255,255,255,.66); -webkit-backdrop-filter: blur(22px) saturate(1.4); backdrop-filter: blur(22px) saturate(1.4);
  border: 1px solid var(--stroke-soft); border-radius: var(--r-lg);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.6);
}
/* тёмный data-hero (Glass 04) — премиальная панель под главный график */
:root[data-theme="emerald"] .ovx-hero { background: linear-gradient(145deg, rgba(7,20,38,.96), rgba(19,48,87,.92)); border: 1px solid rgba(255,255,255,.10); box-shadow: 0 16px 55px rgba(7,20,38,.20); border-radius: var(--r-lg); }
:root[data-theme="emerald"] .topbar { background: transparent; -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); border: none; box-shadow: none; }
:root[data-theme="emerald"] .card, :root[data-theme="emerald"] .glass, :root[data-theme="emerald"] .ov2-card { padding: 24px 26px; }
:root[data-theme="emerald"] .ovx-kc-s, :root[data-theme="emerald"] .card-title .sub, :root[data-theme="emerald"] .hint { display: none !important; }
:root[data-theme="emerald"] .ha-obj { filter: saturate(.35) brightness(1.12) drop-shadow(0 20px 26px rgba(0,0,0,.4)); }

/* логотип + флёр-цвет градиентов на токенах: перекрашивается под тему */
:root { --logo-a: #B4CFFF; --logo-b: #4E82FF; --logo-c: #1D4FD8; --accent-3: #7C3AED; }
html[data-night] { --logo-a: #C2D6FF; --logo-b: #6B93FF; --logo-c: #3A63E0; --accent-3: #8B5CF6; }
:root[data-theme="mono"] { --accent-3: #3a3a3a; }
:root[data-theme="frame"] { --accent-3: #374151; }
:root[data-theme="warm"] { --accent-3: #6B1830; }
:root[data-theme="emerald"] { --accent-3: #5AC8FA; }

/* Оформление в профиле агентства (свотчи тем) */
.ag-themes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ag-theme { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1.5px solid var(--stroke); border-radius: 12px; background: var(--card); cursor: pointer; font-family: inherit; color: var(--ink); text-align: left; transition: border-color .14s, background .14s; }
.ag-theme:hover { background: var(--bg-2); }
.ag-theme.on { border-color: var(--accent); background: var(--bg-2); }
.ag-theme-sw { display: flex; flex: none; border-radius: 6px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.ag-theme-sw i { width: 11px; height: 26px; display: block; }
.ag-theme-tx { flex: 1; min-width: 0; } .ag-theme-tx b { font-size: 13px; font-weight: 700; display: block; } .ag-theme-tx small { font-size: 10.5px; color: var(--ink-3); }
.ag-theme-ok { color: var(--accent); display: grid; place-items: center; } .ag-theme-ok svg { width: 15px; height: 15px; }
.ag-theme-hint { font-size: 11.5px; color: var(--ink-3); margin-top: 10px; }
@media (max-width: 560px) { .ag-themes { grid-template-columns: 1fr; } }

/* все темы теперь на НАТИВНЫХ AI-видеофонах (skyline-<theme>.mp4) — CSS-тинт видео не нужен */
/* лого лоадера/логина теперь ИНЛАЙН-SVG на токенах --logo-* → цвет верный сам по себе.
   Фильтры перекраски (grayscale/hue-rotate) УБРАНЫ: они ломали уже-правильный токен-цвет (warm крутил бордо). */

/* ═══════════ РАЗНЫЙ ПОДХОД НА КАЖДУЮ ТЕМУ (не только цвет) ═══════════
   Контур/Моно = минимализм: меньше текста на виджетах, больше воздуха, суть.
   Насыщенные темы (Кобальт/Ночь/Аметист/Изумруд) — полный богатый вид. */
/* Контур — швейцарский минимал: только цифры и заголовки, описания прочь */
:root[data-theme="frame"] .card-title .sub,
:root[data-theme="frame"] .ov2-card-hd > span,
:root[data-theme="frame"] .ov2-card-hd small,
:root[data-theme="frame"] .page-sub,
:root[data-theme="frame"] .hint,
:root[data-theme="frame"] .kpi .sub,
:root[data-theme="frame"] .lp-ai-state small { display: none !important; }
:root[data-theme="frame"] .card, :root[data-theme="frame"] .glass, :root[data-theme="frame"] .ov2-card { padding: 24px 26px; }
:root[data-theme="frame"] .card-title, :root[data-theme="frame"] .ov2-card-hd { text-transform: uppercase; letter-spacing: .05em; font-weight: 800; }
/* Моно — сдержанный редакторский минимал: убираем подсказки, оставляем суть */
:root[data-theme="mono"] .hint,
:root[data-theme="mono"] .page-sub,
:root[data-theme="mono"] .lp-ai-state small { display: none !important; }
:root[data-theme="mono"] .card, :root[data-theme="mono"] .glass, :root[data-theme="mono"] .ov2-card { padding: 21px 23px; }

/* Контур — углубление минимала: KPI-карточки только цифра+заголовок, цифры крупнее */
:root[data-theme="frame"] .ovx-kc-s, :root[data-theme="frame"] .kpi .delta small { display: none !important; }
:root[data-theme="frame"] .ovx-kc-v { font-size: 31px; letter-spacing: -.035em; }
:root[data-theme="frame"] .ovx-hero-num { letter-spacing: -.04em; }
:root[data-theme="frame"] .ovx-kcard { padding: 18px 18px; }
/* Моно — редакторская сдержанность: тоньше, чуть больше воздуха между карточками */
:root[data-theme="mono"] .ovx-kc-s { opacity: .62; }
:root[data-theme="mono"] .ovx-kcard, :root[data-theme="mono"] .card { letter-spacing: -.01em; }

/* ═══ Обложки (.ha) и Higgsfield-иконки под тему ═══ */
:root[data-theme="frame"] { --ov-hero-a: #0B0F19; --ov-hero-b: #1F2937; --ov-hero-c: #374151; }
/* лого на ТЁМНОМ сайдбаре — Моно/Контур были тёмные (сливались) → светлое серебро/сталь */
:root[data-theme="mono"] { --logo-a: #f0f0f0; --logo-b: #c8c8c8; --logo-c: #9a9a9a; }
:root[data-theme="frame"] { --logo-a: #E2E8F0; --logo-b: #CBD5E1; --logo-c: #94A3B8; }
/* Higgsfield 3D-объекты (art/*.png — синие) тонируем под стилистику, тень сохраняем */
:root[data-theme="atelier"] .ha-obj { filter: grayscale(1) brightness(1.1) contrast(1.02) drop-shadow(0 20px 26px rgba(0,0,0,.6)); }
:root[data-theme="mono"] .ha-obj, :root[data-theme="frame"] .ha-obj { filter: grayscale(1) brightness(1.08) drop-shadow(0 20px 26px rgba(0,0,0,.5)); }

/* ═══ Категорийные цвета (--ov-cat/--ov-soft) под каждую тему — убираем «чужую» синеву/зелень ═══ */
/* Контур — графит/сталь (как Моно) */
:root[data-theme="frame"] {
  --ov-soft-blue: #EEF0F3; --ov-soft-green: #ECF0EE; --ov-soft-red: #F3E7E7; --ov-soft-amber: #F1EDE2; --ov-soft-purple: #EEEEF2;
  --ov-cat-blue: #1F2937; --ov-cat-green: #3F5A4E; --ov-cat-red: #7F3F3A; --ov-cat-amber: #6B5A2E; --ov-cat-purple: #3A3F4A;
  --ov-chip-gray: #F1F3F6; --ov-gold-soft: #F3F1EC;
}
/* Бургунди — категорийные цвета РАЗЛИЧИМЫЕ и семантические (blue/green/amber/purple),
   НЕ моно-винный спред: графики/донат/воронка должны читаться. Бордо — только бренд-акцент. */
:root[data-theme="warm"] {
  --ov-soft-blue: #EAEEF5; --ov-soft-green: #E6F1EC; --ov-soft-red: #FBE6E9; --ov-soft-amber: #F6EEDD; --ov-soft-purple: #EFE9F0;
  /* приглушённая ТЁПЛАЯ дата-виз (не радуга, не яркий синий): пыльно-синий/муравленый-зелёный/золото/плюм — читается, но тихо и когерентно с бордо */
  --ov-cat-blue: #6E86B0; --ov-cat-green: #4E9E82; --ov-cat-red: #C85462; --ov-cat-amber: #C39A52; --ov-cat-purple: #8A6A9E;
  --ov-chip-gray: #F1F4F8; --ov-gold-soft: #FBF3E4;
}
/* Стекло — Apple-системные цвета (яркие, но на матовом — премиально и когерентно) */
:root[data-theme="emerald"] {
  --ov-soft-blue: rgba(0,113,227,.09); --ov-soft-green: rgba(48,168,90,.10); --ov-soft-red: rgba(255,59,48,.09); --ov-soft-amber: rgba(245,147,49,.10); --ov-soft-purple: rgba(94,92,230,.10);
  /* Apple-системные, но чуть приглушены (неон зелёного/оранжевого «кричал» на стекле) + purple→индиго = синяя семья, когерентнее */
  --ov-cat-blue: #0071E3; --ov-cat-green: #2FA85A; --ov-cat-red: #F0453B; --ov-cat-amber: #F0902A; --ov-cat-purple: #5E5CE6;
  --ov-chip-gray: rgba(0,0,0,.05); --ov-gold-soft: rgba(0,0,0,.04);
}
/* Цвета СТАДИЙ (донат/канбан) тематизированы через --stg-* (JS отдаёт var(--stg-id, дефолт)).
   Бургунди — тихая ТЁПЛАЯ шкала (без яркого синего): роза/мов/шалфей/золото/плюм/вино. */
:root[data-theme="warm"] {
  --stg-new:#9C8791; --stg-touch:#C08A9A; --stg-dialog:#A85E7A; --stg-qualified:#5E9E86;
  --stg-handover:#9A7BA0; --stg-viewing:#C39A52; --stg-deal:#2E9E76; --stg-sleeping:#A99AA0; --stg-lost:#C85462;
}
/* Стекло — прохладная Apple-шкала (синий/тил/индиго/зелёный/оранж), приглушённая */
:root[data-theme="emerald"] {
  --stg-new:#8A94A6; --stg-touch:#5AC8FA; --stg-dialog:#0071E3; --stg-qualified:#30B85C;
  --stg-handover:#5E5CE6; --stg-viewing:#F0902A; --stg-deal:#2FA85A; --stg-sleeping:#98A2B3; --stg-lost:#F0453B;
}

/* Донат «Статусы» (цвета стадий — data-viz): координируем под тему */
:root[data-theme="mono"] .ov2-donut, :root[data-theme="frame"] .ov2-donut { filter: grayscale(1) contrast(1.03); }
/* Бургунди: донат/воронка — РАСПОЗНАВАЕМЫЕ цвета стадий (без моно-красного тинта) */
:root[data-theme="emerald"] .ov2-donut { filter: saturate(.9); }

/* Lumen Glass — ЧИСТАЯ атмосфера: мягкие полноэкранные свечения (БЕЗ фото-скайлайна).
   Раньше здесь торчал обрезанный кусок фото Дубая в правом-верхнем углу КАЖДОГО экрана — убрано. */
:root[data-theme="emerald"] .app::before {
  content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(90% 62% at 92% -12%, rgba(120,165,255,.20), transparent 62%),
    radial-gradient(70% 55% at 4% 104%, rgba(180,205,255,.13), transparent 58%);
}
:root[data-theme="emerald"] .sidebar, :root[data-theme="emerald"] .main { position: relative; z-index: 1; }

/* ═══ Lumen Glass — пер-экранная атмосфера (data-page) ═══ */
/* Контроль — аналитический, свечение почти убрано */
:root[data-theme="emerald"][data-page="control"] .app::before { opacity: .5; }
/* Лента — editorial media-hero: вилла справа, текст слева на холодной стеклянной маске */
:root[data-theme="emerald"][data-page="feed"] .ha {
  background:
    linear-gradient(100deg, rgba(244,249,255,.95) 0%, rgba(244,249,255,.80) 42%, rgba(244,249,255,.30) 68%, rgba(244,249,255,.06) 100%),
    url('lumen-media/editorial/villa-mediterranean.webp') right center / cover no-repeat;
  color: var(--ink); border: 1px solid var(--stroke-soft); grid-template-columns: 1fr; min-height: 190px;
}
:root[data-theme="emerald"][data-page="feed"] .ha-stage { display: none; }
:root[data-theme="emerald"][data-page="feed"] .ha-body { padding: 8px 0 8px 6px; max-width: 60%; }
:root[data-theme="emerald"][data-page="feed"] .ha-title,
:root[data-theme="emerald"][data-page="feed"] .ha-body .nm2,
:root[data-theme="emerald"][data-page="feed"] .ha h1 { color: var(--ink); }
:root[data-theme="emerald"][data-page="feed"] .ha-title .sub,
:root[data-theme="emerald"][data-page="feed"] .ha-body { color: var(--ink-2); }
:root[data-theme="emerald"][data-page="feed"] .ha-title svg { color: var(--accent); }

/* Lumen Glass — База/Объекты: cool editorial residence справа, текст слева на стеклянной маске */
:root[data-theme="emerald"][data-page="properties"] .ha {
  background:
    linear-gradient(100deg, rgba(244,249,255,.95) 0%, rgba(244,249,255,.80) 42%, rgba(244,249,255,.30) 68%, rgba(244,249,255,.05) 100%),
    url('lumen-media/editorial/residence-cliff.webp') right center / cover no-repeat;
  color: var(--ink); border: 1px solid var(--stroke-soft); grid-template-columns: 1fr; min-height: 190px;
}
:root[data-theme="emerald"][data-page="properties"] .ha-stage { display: none; }
:root[data-theme="emerald"][data-page="properties"] .ha-body { padding: 8px 0 8px 6px; max-width: 62%; }
:root[data-theme="emerald"][data-page="properties"] .ha-title,
:root[data-theme="emerald"][data-page="properties"] .ha-body .nm2,
:root[data-theme="emerald"][data-page="properties"] .ha h1 { color: var(--ink); }
:root[data-theme="emerald"][data-page="properties"] .ha-title .sub,
:root[data-theme="emerald"][data-page="properties"] .ha-body { color: var(--ink-2); }
:root[data-theme="emerald"][data-page="properties"] .ha-title svg,
:root[data-theme="emerald"][data-page="properties"] .ha-row .nm2 b { color: var(--accent); }

/* ═══ Lumen Burgundy — editorial media-heroes (Лента + Объекты) ═══
   Маска слева — НЕЙТРАЛЬНО-БЕЛАЯ (workspace-фон), НЕ бордовая (охраняемое правило).
   Фото натуральное; 3D-объект .ha-stage скрыт. */
/* ХУК-ГРАФИКА: тёмный hero + абстракт-видеофон (атлас), как у data-hero. Белый текст, ноль обрезки. */
:root[data-theme="warm"][data-page="feed"] .ha,
:root[data-theme="warm"][data-page="properties"] .ha {
  background: linear-gradient(150deg, var(--ov-hero-a), var(--ov-hero-b) 52%, color-mix(in srgb, var(--accent) 26%, var(--ov-hero-c)) 135%) !important;
  color: #fff !important; border: 1px solid rgba(255,255,255,.1) !important; grid-template-columns: 1fr; min-height: 172px;
}
:root[data-theme="warm"][data-page="feed"] .ha .ha-title, :root[data-theme="warm"][data-page="feed"] .ha .ha-body .nm2, :root[data-theme="warm"][data-page="feed"] .ha h1,
:root[data-theme="warm"][data-page="properties"] .ha .ha-title, :root[data-theme="warm"][data-page="properties"] .ha .ha-body .nm2, :root[data-theme="warm"][data-page="properties"] .ha h1 { color: #fff !important; }
:root[data-theme="warm"][data-page="feed"] .ha .ha-title .sub, :root[data-theme="warm"][data-page="feed"] .ha .ha-body,
:root[data-theme="warm"][data-page="properties"] .ha .ha-title .sub, :root[data-theme="warm"][data-page="properties"] .ha .ha-body { color: rgba(255,255,255,.84) !important; }
:root[data-theme="warm"][data-page="feed"] .ha .ha-title svg, :root[data-theme="warm"][data-page="properties"] .ha .ha-title svg,
:root[data-theme="warm"][data-page="properties"] .ha .ha-row .nm2 b { color: #fff !important; }
:root[data-theme="warm"][data-page="feed"] .ha .ha-chip, :root[data-theme="warm"][data-page="properties"] .ha .ha-chip { background: rgba(255,255,255,.14) !important; color: #fff !important; border-color: rgba(255,255,255,.22) !important; }
:root[data-theme="warm"][data-page="feed"] .ha-stage,
:root[data-theme="warm"][data-page="properties"] .ha-stage { display: none; }
:root[data-theme="warm"][data-page="feed"] .ha-body,
:root[data-theme="warm"][data-page="properties"] .ha-body { padding: 8px 0 8px 6px; max-width: 62%; }
:root[data-theme="warm"][data-page="feed"] .ha-title,
:root[data-theme="warm"][data-page="feed"] .ha-body .nm2,
:root[data-theme="warm"][data-page="feed"] .ha h1,
:root[data-theme="warm"][data-page="properties"] .ha-title,
:root[data-theme="warm"][data-page="properties"] .ha-body .nm2,
:root[data-theme="warm"][data-page="properties"] .ha h1 { color: var(--ink); }
:root[data-theme="warm"][data-page="feed"] .ha-title .sub,
:root[data-theme="warm"][data-page="feed"] .ha-body,
:root[data-theme="warm"][data-page="properties"] .ha-title .sub,
:root[data-theme="warm"][data-page="properties"] .ha-body { color: var(--ink-2); }
/* акцент в hero — бордовый бренд (иконка + цифра «вход в рынок») */
:root[data-theme="warm"][data-page="feed"] .ha-title svg,
:root[data-theme="warm"][data-page="properties"] .ha-title svg,
:root[data-theme="warm"][data-page="properties"] .ha-row .nm2 b { color: var(--accent); }

/* Оба премиум-героя: на узких экранах фото уходит, остаётся чистый светлый card —
   тёмный текст читается уверенно (фото-hero — десктоп-история). */
@media (max-width: 760px) {
  :root[data-theme="warm"][data-page="feed"] .ha,
  :root[data-theme="warm"][data-page="properties"] .ha,
  :root[data-theme="emerald"][data-page="feed"] .ha,
  :root[data-theme="emerald"][data-page="properties"] .ha { background: var(--card); }
  :root[data-theme="warm"][data-page="feed"] .ha-body,
  :root[data-theme="warm"][data-page="properties"] .ha-body,
  :root[data-theme="emerald"][data-page="feed"] .ha-body,
  :root[data-theme="emerald"][data-page="properties"] .ha-body { max-width: 100%; }
}

/* ═══════════ Lumen Glass · Apple-рефайн: спокойствие, деликатное стекло, без жёсткой белизны ═══════════ */
/* 1. ТИШИНА за логотипом: цветная вуаль мигала зелёным сквозь стекло + пульсации логотипа/пункта.
      Apple-стекло = спокойно: нейтральная статичная вуаль, без дыхания и свечения. */
:root[data-theme="emerald"] .sidebar::before { background: linear-gradient(180deg, rgba(255,255,255,.42), rgba(232,240,251,.16)) !important; opacity: 1 !important; filter: none !important; animation: none !important; }
:root[data-theme="emerald"] .brand-mark { animation: none !important; filter: drop-shadow(0 2px 10px rgba(57,123,255,.28)) !important; }
:root[data-theme="emerald"] .nav-item.active { animation: none !important; }

/* 2. ПОИСК — стилим САМ input (единый скруглённый капсуль). Контейнер прозрачный:
      раньше фон висел на КОНТЕЙНЕРе, а input внутри имел свой бордер+радиус → двойной бокс,
      и на фокусе синела внутренняя прямоугольная рамка «торчащими углами». Теперь один капсуль,
      фокус-ринг box-shadow идёт ПО РАДИУСУ (без квадратных углов). */
:root[data-theme="emerald"] .navsearch,
:root[data-theme="emerald"] .gsearch {
  background: transparent !important; border: none !important; box-shadow: none !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
:root[data-theme="emerald"] .navsearch input,
:root[data-theme="emerald"] #gsInput {
  background: rgba(255,255,255,.6) !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: 12px !important;
  color: var(--ink) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 1px 3px rgba(14,30,55,.05) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.3) !important; backdrop-filter: blur(16px) saturate(1.3) !important;
}
:root[data-theme="emerald"] .navsearch input:focus,
:root[data-theme="emerald"] #gsInput:focus {
  background: rgba(255,255,255,.84) !important;
  border-color: color-mix(in srgb, var(--accent) 48%, transparent) !important;
  box-shadow: 0 0 0 3px rgba(57,123,255,.15) !important;  /* округлый ринг, следует радиусу */
  outline: none !important;
}

/* 3. ВЫПАДАШКИ + ПОПАПЫ — плотное матовое стекло + ЗЕРНО (frosted grain), чтобы не сливались с фоном.
      Раньше меню/поповеры были блёклые (полупрозрачный --card просвечивал). */
:root[data-theme="emerald"] .cs-list, :root[data-theme="emerald"] .dtp-pop, :root[data-theme="emerald"] .pop,
:root[data-theme="emerald"] .navsearch-res, :root[data-theme="emerald"] .gs-results, :root[data-theme="emerald"] .navsearch-res,
:root[data-theme="emerald"] .modal, :root[data-theme="emerald"] .menu, :root[data-theme="emerald"] .ctx {
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='120' height='120' filter='url(%23n)' opacity='0.05'/></svg>"),
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.9)) !important;
  -webkit-backdrop-filter: blur(30px) saturate(1.6) !important; backdrop-filter: blur(30px) saturate(1.6) !important;
  border: 1px solid rgba(255,255,255,.75) !important;
  box-shadow: 0 24px 64px -12px rgba(14,30,55,.28), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
/* блёклые фильтр-кнопки выпадашек — плотнее (были прозрачный --card .68) */
:root[data-theme="emerald"] .cs-btn { background: rgba(255,255,255,.72) !important; border-color: rgba(15,35,65,.1) !important; }
:root[data-theme="emerald"] .cs-opt:hover { background: rgba(57,123,255,.1) !important; }

/* 4. EDITORIAL HERO — фото на ВСЮ ширину под равномерной стеклянной вуалью (раньше было обрезано «на пол-экрана»
      right-anchored со швом). Теперь фото центрировано/cover заполняет весь бокс, вуаль чуть плотнее слева под текст. */
/* ХУК-ГРАФИКА: тёмный hero + абстракт-видеофон (жидкое стекло), белый текст, ноль обрезки */
:root[data-theme="emerald"][data-page="feed"] .ha,
:root[data-theme="emerald"][data-page="properties"] .ha {
  background: linear-gradient(150deg, var(--ov-hero-a), var(--ov-hero-b) 52%, color-mix(in srgb, var(--accent) 26%, var(--ov-hero-c)) 135%) !important;
  color: #fff !important; border: 1px solid rgba(255,255,255,.1) !important;
}
:root[data-theme="emerald"][data-page="feed"] .ha .ha-title, :root[data-theme="emerald"][data-page="feed"] .ha .ha-body .nm2, :root[data-theme="emerald"][data-page="feed"] .ha h1,
:root[data-theme="emerald"][data-page="properties"] .ha .ha-title, :root[data-theme="emerald"][data-page="properties"] .ha .ha-body .nm2, :root[data-theme="emerald"][data-page="properties"] .ha h1 { color: #fff !important; }
:root[data-theme="emerald"][data-page="feed"] .ha .ha-title .sub, :root[data-theme="emerald"][data-page="feed"] .ha .ha-body,
:root[data-theme="emerald"][data-page="properties"] .ha .ha-title .sub, :root[data-theme="emerald"][data-page="properties"] .ha .ha-body { color: rgba(255,255,255,.84) !important; }
:root[data-theme="emerald"][data-page="feed"] .ha .ha-title svg, :root[data-theme="emerald"][data-page="properties"] .ha .ha-title svg,
:root[data-theme="emerald"][data-page="properties"] .ha .ha-row .nm2 b { color: #BEDBFF !important; }
:root[data-theme="emerald"][data-page="feed"] .ha .ha-chip, :root[data-theme="emerald"][data-page="properties"] .ha .ha-chip { background: rgba(255,255,255,.14) !important; color: #fff !important; border-color: rgba(255,255,255,.22) !important; }
:root[data-theme="emerald"][data-page="feed"] .ha-body,
:root[data-theme="emerald"][data-page="properties"] .ha-body { max-width: 100%; }

/* 5. Меньше «выбеленности»: карточки чуть прозрачнее и глубже (стекло, а не белые плиты) */
:root[data-theme="emerald"] .card, :root[data-theme="emerald"] .glass, :root[data-theme="emerald"] .ov2-card,
:root[data-theme="emerald"] .kpi, :root[data-theme="emerald"] .ctrl-card, :root[data-theme="emerald"] .ctrl-hero,
:root[data-theme="emerald"] .ctrl-team, :root[data-theme="emerald"] .ovx-kcard {
  background: rgba(255,255,255,.58) !important;
  box-shadow: 0 10px 34px rgba(14,30,55,.08), inset 0 1px 0 rgba(255,255,255,.7) !important;
  border: 1px solid rgba(255,255,255,.55) !important;
}

/* ═══════════ Ателье — тихая роскошь: КРЕМОВЫЙ workspace + тёмный сайдбар + тёмные hero-панели ═══════════
   Не «всё чёрное» — контрастная альтернация как на лендинге land.html (тёмный герой ↔ кремовый контент). */
:root[data-theme="atelier"] {
  --bg: #f3f1ec; --bg-2: #eae7df; --card: #faf9f5;
  --ink: #141311; --ink-2: #57544e; --ink-3: #8b8983;
  --navy-900: #141311; --navy-950: #0c0c0e; --navy-700: #1e1b17;   /* navy-950/700 — ТЁМНЫЕ (акцент-панели: vs-col.ai, bulk-bar); navy-900 — тёмный текст на креме */
  --stroke: rgba(20,19,17,.13); --stroke-soft: rgba(20,19,17,.07); --glass: rgba(255,255,255,.55);
  --accent: #1a1815; --accent-2: #35322c; --accent-3: #57544e;   /* акцент = уголь: чёрные пилюли на креме */
  --accent-soft-bd: rgba(20,19,17,.16); --hover-bd: rgba(20,19,17,.22);
  --blue-100: rgba(20,19,17,.05); --blue-300: #8b8983;
  --ok: #4f7a58; --ok-bg: #e6ede4; --warn: #9a7636; --warn-bg: #f2ead8; --bad: #a9564a; --bad-bg: #f2e2df;
  --violet: #6f6491; --violet-bg: #ebe7f0;
  --ov-primary: #1a1815; --ov-primary-hover: #000; --gauge-track: rgba(20,19,17,.1);
  --ov-hero-a: #0c0c0e; --ov-hero-b: #141311; --ov-hero-c: #1e1b17;   /* hero/data-панели — тёмные (контраст-акцент) */
  --logo-a: #35322c; --logo-b: #57544e; --logo-c: #8b8983;
  --shadow: 0 8px 30px rgba(53,50,44,.09); --shadow-lift: 0 20px 54px rgba(53,50,44,.15);
  --stg-new:#9a968d; --stg-touch:#8a94a6; --stg-dialog:#6b6a68; --stg-qualified:#4f7a58; --stg-handover:#6f6491; --stg-viewing:#9a7636; --stg-deal:#4f7a58; --stg-sleeping:#b9b7b3; --stg-lost:#a9564a;
  --ov-cat-blue:#6b6a68; --ov-cat-green:#4f7a58; --ov-cat-red:#a9564a; --ov-cat-amber:#9a7636; --ov-cat-purple:#6f6491;
  --ov-soft-blue:#ece9e2; --ov-soft-green:#e6ede4; --ov-soft-red:#f2e2df; --ov-soft-amber:#f2ead8; --ov-soft-purple:#ebe7f0;
  --ov-chip-gray:#ece9e2; --r-lg:16px; --r-md:12px; --r-sm:9px;
}
:root[data-theme="atelier"] .app, :root[data-theme="atelier"] body { background: #f3f1ec; }
/* ШРИФТЫ — разнообразие: Cormorant (крупный дисплей) + Cormorant ITALIC (редакторские подзаголовки) + Manrope (тело) + uppercase-Manrope (микро-лейблы) */
:root[data-theme="atelier"] .page-title,
:root[data-theme="atelier"] .ovx-hero-num, :root[data-theme="atelier"] .ovx-kc-v,
:root[data-theme="atelier"] .kpi .val, :root[data-theme="atelier"] .ha-title, :root[data-theme="atelier"] .ha h1,
:root[data-theme="atelier"] .an-hero-hd b, :root[data-theme="atelier"] .hp-top-t, :root[data-theme="atelier"] .ovx-donut-mid b {
  font-family: 'Cormorant', Georgia, serif !important; font-weight: 500; letter-spacing: 0; }
:root[data-theme="atelier"] .page-title { font-size: 28px; }
:root[data-theme="atelier"] .page-sub, :root[data-theme="atelier"] .ha-title .sub, :root[data-theme="atelier"] .card-title .sub {
  font-family: 'Cormorant', Georgia, serif; font-style: italic; font-size: 15px; letter-spacing: .01em; text-transform: none; }
:root[data-theme="atelier"] .brand-name { font-family: 'Cormorant', Georgia, serif; font-size: 19px; font-weight: 500; letter-spacing: .12em; }
/* uppercase spaced микро-лейблы */
:root[data-theme="atelier"] .nav-label, :root[data-theme="atelier"] .card-title, :root[data-theme="atelier"] .ov2-card-hd,
:root[data-theme="atelier"] .sh-sec-h, :root[data-theme="atelier"] .hp-sec-h, :root[data-theme="atelier"] .hd {
  letter-spacing: .13em; text-transform: uppercase; font-weight: 600; }
/* пилюли-кнопки: primary — УГОЛЬ на креме (dark pill), текст кремовый */
:root[data-theme="atelier"] .btn { border-radius: 999px; }
:root[data-theme="atelier"] .btn-accent, :root[data-theme="atelier"] .btn-primary, :root[data-theme="atelier"] .btn-cta { background: #1a1815; color: #f3f1ec; border: 1px solid transparent; box-shadow: none; }
:root[data-theme="atelier"] .btn-accent:hover, :root[data-theme="atelier"] .btn-primary:hover, :root[data-theme="atelier"] .btn-cta:hover { background: #000; filter: none; }
:root[data-theme="atelier"] .btn-accent svg, :root[data-theme="atelier"] .btn-primary svg, :root[data-theme="atelier"] .btn-cta svg { color: #f3f1ec; }
:root[data-theme="atelier"] .btn:not(.btn-accent):not(.btn-primary):not(.btn-cta):not(.btn-danger):not(.active):not(.on) { border-color: rgba(20,19,17,.18); color: var(--ink); }
/* ⚠️ АКТИВНЫЕ плашки-табы/тумблеры (.active/.on) красятся тёмным фоном (navy-900) → текст ОБЯЗАН быть светлым.
   Раньше atelier-правило .btn выше (специфичнее) перебивало базовый color:#fff → чёрное-по-чёрному (баг lc-f). */
:root[data-theme="atelier"] .btn.active:not(.btn-danger), :root[data-theme="atelier"] .btn.on:not(.btn-danger),
:root[data-theme="mono"] .btn.active:not(.btn-danger), :root[data-theme="mono"] .btn.on:not(.btn-danger) { color: #fff; }
:root[data-theme="atelier"] .btn.active:not(.btn-danger) svg, :root[data-theme="atelier"] .btn.on:not(.btn-danger) svg,
:root[data-theme="mono"] .btn.active:not(.btn-danger) svg, :root[data-theme="mono"] .btn.on:not(.btn-danger) svg { color: #fff; }
/* САЙДБАР — тёмный near-black (контраст-якорь) на кремовом workspace */
:root[data-theme="atelier"] .sidebar { background: #0c0c0e; border-right: 1px solid rgba(255,255,255,.07); }
:root[data-theme="atelier"] .sidebar::before { display: none; }
:root[data-theme="atelier"] .brand-name { color: #f3f1ec; }
:root[data-theme="atelier"] .brand-name span { color: #8b8983; }
:root[data-theme="atelier"] .brand-mark { filter: grayscale(1) brightness(1.7); }
:root[data-theme="atelier"] .nav-label { color: #6f6c64; }
:root[data-theme="atelier"] .nav-item { color: #a7a6a3 !important; }
:root[data-theme="atelier"] .nav-item:hover { background: rgba(255,255,255,.05); color: #f3f1ec !important; }
:root[data-theme="atelier"] .nav-item.active { background: rgba(255,255,255,.08); color: #f3f1ec !important; box-shadow: inset 2px 0 0 #f3f1ec; }
:root[data-theme="atelier"] .nav-item.active svg { color: #f3f1ec; }
:root[data-theme="atelier"] .navsearch input { background: rgba(255,255,255,.06); color: #f3f1ec; border-color: rgba(255,255,255,.13); }
:root[data-theme="atelier"] .navsearch input::placeholder { color: #8b8983; }
:root[data-theme="atelier"] .side-foot .agency .nm { color: #f3f1ec; }
:root[data-theme="atelier"] .side-foot .agency .rl { color: #8b8983; }
/* карточки — тёплый near-white, hairline */
:root[data-theme="atelier"] .card, :root[data-theme="atelier"] .glass, :root[data-theme="atelier"] .ov2-card,
:root[data-theme="atelier"] .kpi, :root[data-theme="atelier"] .ctrl-card, :root[data-theme="atelier"] .ovx-kcard, :root[data-theme="atelier"] .modal {
  background: #faf9f5; border: 1px solid rgba(20,19,17,.09); box-shadow: var(--shadow); }
:root[data-theme="atelier"] .topbar { background: transparent; border: none; }
/* видеофон hero — грейскейл (монохром-люкс) */
/* тёмные/монохром hero-панели: screen-блендинг гасил тёмное видео → normal + ярче, чтобы абстракт-текстура была ВИДНА */
:root[data-theme="atelier"] .hero-vid, :root[data-theme="mono"] .hero-vid, :root[data-theme="frame"] .hero-vid,
:root[data-theme="dark"] .hero-vid { filter: grayscale(1) contrast(1.18) brightness(1.25); mix-blend-mode: normal; opacity: .6; }
/* синий onboard-баннер (чужой инлайн) → уголь, чтобы не выбивался */
:root[data-theme="atelier"] [data-onboard] { background: rgba(20,19,17,.06) !important; border-color: rgba(20,19,17,.18) !important; color: var(--ink) !important; }

/* ═══ Пер-темовая персонализация иконок: каждая стилистика — свой характер штриха ═══
   ic()-иконки в рабочей области несут атрибут stroke-width; CSS-свойство его перекрывает.
   Стекло (Apple) — тоньше/воздушнее; Бургунди — плотнее/характернее; Моно/Контур — швейцарски-тонко. */
:root[data-theme="emerald"] .content svg[stroke-width], :root[data-theme="emerald"] .sidebar svg[stroke-width] { stroke-width: 1.55; }
:root[data-theme="warm"] .content svg[stroke-width], :root[data-theme="warm"] .sidebar svg[stroke-width] { stroke-width: 1.8; }
:root[data-theme="atelier"] .content svg[stroke-width], :root[data-theme="atelier"] .sidebar svg[stroke-width],
  :root[data-theme="mono"] .content svg[stroke-width], :root[data-theme="frame"] .content svg[stroke-width],
:root[data-theme="mono"] .sidebar svg[stroke-width], :root[data-theme="frame"] .sidebar svg[stroke-width] { stroke-width: 1.5; }

/* ФОРМА ШТРИХА: технические темы (Контур/Моно) — острые концы; остальные — мягкие круглые (дефолт ic) */
:root[data-theme="frame"] .content svg[stroke-width], :root[data-theme="mono"] .content svg[stroke-width],
:root[data-theme="frame"] .sidebar svg[stroke-width], :root[data-theme="mono"] .sidebar svg[stroke-width] { stroke-linecap: square; stroke-linejoin: miter; }

/* ЧИП-КОНТЕЙНЕРЫ ИКОНОК — своя отрисовка на каждую стилистику.
   Две группы: НЕЙТРАЛЬНЫЕ (эмблема/KPI/запуск/attention-бейдж) — полная перекраска формы;
   SEVERITY (сигналы Обзора/внимание, где ЦВЕТ = СМЫСЛ) — меняем ТОЛЬКО форму, цвет сохраняем. */

/* ——— Нейтральные чипы (эмблема страницы, KPI, запуск, мелкие бейджи) ——— */
/* Ателье — редакторские hairline-КОЛЬЦА (тонкий контур, без заливки, монохром) */
:root[data-theme="atelier"] .page-emblem, :root[data-theme="atelier"] .ovx-kc-ic, :root[data-theme="atelier"] .ov2-kpi-ic,
:root[data-theme="atelier"] .ov-launch-ic, :root[data-theme="atelier"] .attn-ic, :root[data-theme="atelier"] .kc-chip-ic {
  background: transparent !important; border: 1px solid var(--stroke); border-radius: 50% !important; color: var(--ink-2) !important; box-shadow: none !important; }
/* Стекло — frosted КРУГИ с бликом */
:root[data-theme="emerald"] .page-emblem, :root[data-theme="emerald"] .ovx-kc-ic, :root[data-theme="emerald"] .ov2-kpi-ic,
:root[data-theme="emerald"] .ov-launch-ic, :root[data-theme="emerald"] .attn-ic, :root[data-theme="emerald"] .kc-chip-ic {
  border-radius: 50% !important; -webkit-backdrop-filter: blur(10px) saturate(1.3); backdrop-filter: blur(10px) saturate(1.3); box-shadow: inset 0 0 0 1px rgba(255,255,255,.55); }
/* Контур — острые бордер-КВАДРАТЫ, без заливки (швейцарски) */
:root[data-theme="frame"] .page-emblem, :root[data-theme="frame"] .ovx-kc-ic, :root[data-theme="frame"] .ov2-kpi-ic,
:root[data-theme="frame"] .ov-launch-ic, :root[data-theme="frame"] .attn-ic, :root[data-theme="frame"] .kc-chip-ic {
  background: transparent !important; border: 1.5px solid var(--ink); border-radius: 6px !important; color: var(--ink) !important; box-shadow: none !important; }
/* Моно — ЧЁРНЫЙ залитый квадрат, белая иконка */
:root[data-theme="mono"] .page-emblem, :root[data-theme="mono"] .ovx-kc-ic, :root[data-theme="mono"] .ov2-kpi-ic,
:root[data-theme="mono"] .ov-launch-ic, :root[data-theme="mono"] .attn-ic, :root[data-theme="mono"] .kc-chip-ic {
  background: var(--ink) !important; color: #fff !important; border-radius: 8px !important; box-shadow: none !important; }
/* Бургунди — мягкий бордо rounded-square (глубже радиус) */
:root[data-theme="warm"] .page-emblem, :root[data-theme="warm"] .ovx-kc-ic, :root[data-theme="warm"] .ov2-kpi-ic,
:root[data-theme="warm"] .ov-launch-ic, :root[data-theme="warm"] .attn-ic, :root[data-theme="warm"] .kc-chip-ic { border-radius: 13px !important; }

/* ЦВЕТ ИКОНКИ внутри чипа следует за темой — иначе базовый .page-emblem svg{color:#fff}
   на прозрачном (Ателье/Контур) и светлом frost (Стекло) фоне сливается с кремом. */
:root[data-theme="atelier"] .page-emblem svg, :root[data-theme="atelier"] .ovx-kc-ic svg, :root[data-theme="atelier"] .ov2-kpi-ic svg,
:root[data-theme="atelier"] .ov-launch-ic svg, :root[data-theme="atelier"] .attn-ic svg, :root[data-theme="atelier"] .kc-chip-ic svg { color: var(--ink-2) !important; }
:root[data-theme="frame"] .page-emblem svg, :root[data-theme="frame"] .ovx-kc-ic svg, :root[data-theme="frame"] .ov2-kpi-ic svg,
:root[data-theme="frame"] .ov-launch-ic svg, :root[data-theme="frame"] .attn-ic svg, :root[data-theme="frame"] .kc-chip-ic svg { color: var(--ink) !important; }
:root[data-theme="emerald"] .page-emblem svg, :root[data-theme="emerald"] .ovx-kc-ic svg, :root[data-theme="emerald"] .ov2-kpi-ic svg,
:root[data-theme="emerald"] .ov-launch-ic svg, :root[data-theme="emerald"] .attn-ic svg, :root[data-theme="emerald"] .kc-chip-ic svg { color: var(--accent) !important; }
:root[data-theme="mono"] .page-emblem svg, :root[data-theme="mono"] .ovx-kc-ic svg, :root[data-theme="mono"] .ov2-kpi-ic svg,
:root[data-theme="mono"] .ov-launch-ic svg, :root[data-theme="mono"] .attn-ic svg, :root[data-theme="mono"] .kc-chip-ic svg { color: #fff !important; }

/* ——— SEVERITY-чипы (сигналы Обзора · внимание) — ТОЛЬКО форма, цвет-смысл сохраняем ———
   color контейнера уже = цвет severity (crit/warn/ok/info) → currentColor даёт кольцо/бордер в том же тоне. */
:root[data-theme="atelier"] .ov-sig-ic, :root[data-theme="atelier"] .ov2-att-ic { border-radius: 50%; background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }
:root[data-theme="frame"] .ov-sig-ic, :root[data-theme="frame"] .ov2-att-ic { border-radius: 5px; background: transparent; box-shadow: inset 0 0 0 1.5px currentColor; }
:root[data-theme="emerald"] .ov-sig-ic, :root[data-theme="emerald"] .ov2-att-ic { border-radius: 50%; -webkit-backdrop-filter: blur(8px) saturate(1.3); backdrop-filter: blur(8px) saturate(1.3); box-shadow: inset 0 0 0 1px rgba(255,255,255,.5); }
:root[data-theme="mono"] .ov-sig-ic, :root[data-theme="mono"] .ov2-att-ic { border-radius: 5px; }
:root[data-theme="warm"] .ov-sig-ic, :root[data-theme="warm"] .ov2-att-ic { border-radius: 12px; }

/* ═══ Editorial empty states (нет объектов / постов / подборок) ═══
   Натуральное фото сверху карточки + приглушённый текст. Работает во всех темах. */
.es-art { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 0 !important; overflow: hidden; }
.es-art .es-art-img { display: block; width: 100%; height: 138px; background-position: center; background-size: cover; background-repeat: no-repeat; opacity: .96; }
.es-art .es-art-tx { display: block; padding: 14px 16px; color: var(--ink-3); font-size: 12.5px; text-align: center; }
.es-art.es-props .es-art-img { background-image: url('lumen-media/empty/room-empty.webp'); }
.es-art.es-feed .es-art-img { background-image: url('lumen-media/empty/still-console.webp'); }
.es-art.es-coll .es-art-img { background-image: url('lumen-media/empty/facade-calm.webp'); }
/* в тёмных темах фото чуть притушено, чтобы не выбивалось */
:root[data-night] .es-art .es-art-img { opacity: .8; }

/* ═══ Lumen Glass — финальные примитивы (кнопки, таблицы, скролл) ═══ */
/* Primary — тёмная navy-стеклянная (спека §12), как в референсе */
:root[data-theme="emerald"] .btn-accent { background: linear-gradient(180deg,#17345F,#09182D); background-image: linear-gradient(180deg,#17345F,#09182D); border: 1px solid rgba(255,255,255,.08); color: #fff; box-shadow: 0 8px 24px rgba(11,31,60,.16), inset 0 1px 0 rgba(255,255,255,.12); }
:root[data-theme="emerald"] .btn-accent:hover { background-image: linear-gradient(180deg,#1D3F70,#0B1F3C); }
/* Secondary/btn — стеклянные (primary/accent НЕ трогаем — остаётся navy) */
:root[data-theme="emerald"] .btn:not(.btn-accent):not(.btn-primary):not(.btn-danger):not(.active):not(.on) { background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border: 1px solid var(--stroke-soft); }
/* Таблицы — editorial: мягкие строки, без вертикальных линий и жирных рамок (спека §19) */
:root[data-theme="emerald"] .tbl, :root[data-theme="emerald"] .mp-tbl, :root[data-theme="emerald"] .an-tbl,
:root[data-theme="emerald"] .lead-tbl, :root[data-theme="emerald"] .ad-tbl { border: none; }
:root[data-theme="emerald"] .tbl td, :root[data-theme="emerald"] .tbl th, :root[data-theme="emerald"] .an-tbl td, :root[data-theme="emerald"] .an-tbl th,
:root[data-theme="emerald"] .mp-tbl td, :root[data-theme="emerald"] .mp-tbl th, :root[data-theme="emerald"] .lead-tbl td, :root[data-theme="emerald"] .lead-tbl th { border-left: none; border-right: none; border-color: var(--stroke); }
:root[data-theme="emerald"] .tbl tbody tr:hover, :root[data-theme="emerald"] .tbl tr:hover, :root[data-theme="emerald"] .an-tbl tr:hover, :root[data-theme="emerald"] .lead-tbl tr:hover { background: rgba(39,103,255,.035); }
:root[data-theme="emerald"] .tbl th, :root[data-theme="emerald"] .an-tbl th, :root[data-theme="emerald"] .mp-tbl th { color: var(--ink-3); font-weight: 600; }
/* тонкий glass-скролл */
:root[data-theme="emerald"] ::-webkit-scrollbar-thumb { background: rgba(15,35,65,.14); border-radius: 8px; }

/* ═══ Lumen Glass — КОНТРАСТ и ЧИТАЕМОСТЬ (фикс «текст сливается») ═══ */
:root[data-theme="emerald"] { --ink: #0A1A33; --ink-2: #2B3E58; --ink-3: #5A6B84; }
/* стёкла плотнее — текст читается уверенно */
:root[data-theme="emerald"] .card, :root[data-theme="emerald"] .glass, :root[data-theme="emerald"] .ov2-card,
:root[data-theme="emerald"] .kpi, :root[data-theme="emerald"] .ctrl-card, :root[data-theme="emerald"] .ctrl-hero,
:root[data-theme="emerald"] .ctrl-team, :root[data-theme="emerald"] .modal, :root[data-theme="emerald"] .ovx-kcard {
  background: rgba(255,255,255,.86); border-color: rgba(15,35,65,.09);
}
:root[data-theme="emerald"] .sidebar { background: rgba(250,252,255,.80); }
/* мягкое свечение — деликатно, контент на первом плане (фото убрано, это чистый градиент) */
:root[data-theme="emerald"] .app::before { opacity: .85; }
:root[data-theme="emerald"][data-page="control"] .app::before { opacity: .5; }
/* картинки — заполнять контейнер (фикс «нерастянутых») */
:root[data-theme="emerald"] .fd-media img, :root[data-theme="emerald"] .prop-thumb img, :root[data-theme="emerald"] .cl2-thumb img,
:root[data-theme="emerald"] .ov-cap-ava img, :root[data-theme="emerald"] .ava img, :root[data-theme="emerald"] .lc-media img,
:root[data-theme="emerald"] .mediaimg, :root[data-theme="emerald"] .card-media img { object-fit: cover; width: 100%; height: 100%; display: block; }

/* ══════════════════════════════════════════════════════════════════════
   LUMEN BURGUNDY — примитивы (Ф1). Бордо = бренд-поверхности, НЕ фон.
   ══════════════════════════════════════════════════════════════════════ */
/* ── Тёмно-бордовый САЙДБАР (главная бренд-поверхность, сигнатура) ── */
:root[data-theme="warm"] .sidebar { background: linear-gradient(180deg, #42121F 0%, #2B0C16 55%, #210810 100%); color: #F4E8EC; }
:root[data-theme="warm"] .sidebar::before { opacity: .10; mix-blend-mode: soft-light; }
:root[data-theme="warm"] .nav-item { color: rgba(255,255,255,.68); }
:root[data-theme="warm"] .nav-item svg { opacity: .8; }
:root[data-theme="warm"] .nav-item:hover { background: rgba(255,255,255,.05); color: rgba(255,255,255,.92); }
:root[data-theme="warm"] .nav-item.active { background: rgba(183,50,86,.20); color: #fff; border: 1px solid rgba(255,255,255,.07); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); }
:root[data-theme="warm"] .nav-item.active svg { color: var(--burgundy-300); opacity: 1; }
:root[data-theme="warm"] .nav-item .cnt { color: var(--burgundy-300); background: rgba(183,50,86,.22); }
:root[data-theme="warm"] .nav-label { color: rgba(255,255,255,.42); }
:root[data-theme="warm"] .nav-sub .nav-subitem { color: rgba(255,255,255,.60); }
:root[data-theme="warm"] .nav-sub .nav-subitem:hover, :root[data-theme="warm"] .nav-sub .nav-subitem.on { color: #fff; background: rgba(183,50,86,.16); }
:root[data-theme="warm"] .nav-sub .nav-subitem::before { background: rgba(255,255,255,.12); }
:root[data-theme="warm"] .nav-sub .nav-subitem.on::before { background: var(--burgundy-300); }
:root[data-theme="warm"] .brand-name { color: #fff; }
:root[data-theme="warm"] .brand-name span { color: var(--burgundy-300); }
:root[data-theme="warm"] .agency .nm { color: #fff; }
:root[data-theme="warm"] .agency .rl { color: rgba(255,255,255,.55); }
:root[data-theme="warm"] .agency .ava { background: linear-gradient(135deg, var(--burgundy-500), var(--burgundy-700)); }
:root[data-theme="warm"] .side-foot { border-top-color: rgba(255,255,255,.10); }
:root[data-theme="warm"] .navsearch input { border-color: rgba(255,255,255,.14); background: rgba(255,255,255,.06); color: #fff; }
:root[data-theme="warm"] .navsearch input::placeholder { color: rgba(255,255,255,.42); }
:root[data-theme="warm"] .navsearch input:focus { border-color: rgba(221,118,147,.5); background: rgba(255,255,255,.10); }

/* ── Топ-бар светлый; заголовок — тёмный графит (не бордо на всю ширину) ── */
:root[data-theme="warm"] .topbar { background: transparent; border: none; box-shadow: none; }
:root[data-theme="warm"] .page-title { color: var(--ink); }

/* ── PRIMARY-кнопка: плотный бордо-градиент, без большого glow ── */
:root[data-theme="warm"] .btn-accent, :root[data-theme="warm"] .btn-primary {
  background: linear-gradient(180deg, #9E2348, #781732);
  background-image: linear-gradient(180deg, #9E2348, #781732);
  border: 1px solid rgba(120,23,50,.5); color: #fff;
  box-shadow: 0 8px 22px rgba(96,20,43,.18);
}
:root[data-theme="warm"] .btn-accent:hover, :root[data-theme="warm"] .btn-primary:hover {
  background-image: linear-gradient(180deg, #A82A50, #86183A); box-shadow: 0 10px 26px rgba(96,20,43,.24);
}

/* ── Формы: фокус-кольцо бордо ── */
:root[data-theme="warm"] input:focus, :root[data-theme="warm"] textarea:focus, :root[data-theme="warm"] select:focus,
:root[data-theme="warm"] .field:focus-within { border-color: rgba(134,28,60,.38); box-shadow: 0 0 0 3px rgba(134,28,60,.08); }

/* ── Таблицы: белые, hover — лёгкий бордо-tint, header muted ── */
:root[data-theme="warm"] .tbl tbody tr:hover, :root[data-theme="warm"] .tbl tr:hover,
:root[data-theme="warm"] .an-tbl tr:hover, :root[data-theme="warm"] .lead-tbl tr:hover,
:root[data-theme="warm"] .mp-tbl tbody tr:hover { background: rgba(134,28,60,.055); }
:root[data-theme="warm"] .tbl th, :root[data-theme="warm"] .an-tbl th, :root[data-theme="warm"] .mp-tbl th { color: var(--ink-3); }

/* ── Модалки: белые, бордо-backdrop полупрозрачный ── */
:root[data-theme="warm"] .modal-bd { background: rgba(18,12,16,.26); }

/* ── ЧАТ (Диалоги): бабблы НЕ бордовые. Клиент — белый; менеджер — светло-зелёный ── */
:root[data-theme="warm"] .bubble.out {
  background: var(--ok-bg); color: #14432F; border: 1px solid rgba(31,157,115,.20);
  box-shadow: 0 1px 2px rgba(20,67,47,.06);
}
:root[data-theme="warm"] .bubble.out .via-tag { background: rgba(31,157,115,.16); color: #1F7D5B; }
:root[data-theme="warm"] .bubble.out .bmeta { color: #2E6B52; opacity: .9; }

/* ── Картинки — заполнять контейнер (фикс «нерастянутых») ── */
:root[data-theme="warm"] .fd-media img, :root[data-theme="warm"] .prop-thumb img, :root[data-theme="warm"] .cl2-thumb img,
:root[data-theme="warm"] .ov-cap-ava img, :root[data-theme="warm"] .ava img, :root[data-theme="warm"] .lc-media img,
:root[data-theme="warm"] .mediaimg, :root[data-theme="warm"] .card-media img { object-fit: cover; width: 100%; height: 100%; display: block; }

/* ═══ Гайд-центр: пошаговые инструкции (openGuide) ═══ */
.gd { display: flex; flex-direction: column; gap: 16px; }
.gd-intro { font-size: 14px; line-height: 1.6; color: var(--ink-2); }
.gd-intro b, .gd-outro b { color: var(--navy-900); font-weight: 700; }
.gd code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; background: var(--bg-2); border: 1px solid var(--stroke-soft); border-radius: 5px; padding: 1px 6px; color: var(--accent); }
.gd-sec { border: 1px solid var(--stroke); border-radius: 16px; padding: 14px 16px 8px; background: var(--card); }
.gd-sec-h { font-size: 13px; font-weight: 800; color: var(--navy-900); margin-bottom: 12px; letter-spacing: .01em; }
.gd-step { display: flex; gap: 13px; align-items: flex-start; padding: 0 0 14px; }
.gd-n { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; font-weight: 800; background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); font-variant-numeric: tabular-nums; }
.gd-tx { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gd-tx b { font-size: 13.5px; font-weight: 700; color: var(--navy-900); line-height: 1.35; }
.gd-tx span { font-size: 12.5px; line-height: 1.55; color: var(--ink-2); }
.gd-tx code { font-size: 11.5px; }
.gd-shot { border: 1px solid var(--stroke); border-radius: 14px; overflow: hidden; background: var(--bg-2); }
.gd-shot img { display: block; width: 100%; }
.gd-shot span { display: block; padding: 8px 12px; font-size: 11.5px; color: var(--ink-3); text-align: center; border-top: 1px solid var(--stroke-soft); }
.gd-outro { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.6; color: var(--ink-2); background: color-mix(in srgb, var(--accent) 7%, var(--bg-2)); border: 1px solid var(--accent-soft-bd, var(--stroke)); border-radius: 13px; padding: 13px 15px; }
.gd-outro svg { width: 17px; height: 17px; flex: none; color: var(--accent); margin-top: 1px; }

/* Центр инструкций — грид карточек-гайдов (openGuideCenter) */
.gdc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 11px; }
.gdc-card { display: flex; align-items: center; gap: 13px; text-align: left; border: 1px solid var(--stroke); border-radius: 15px; padding: 14px 15px; background: var(--card); cursor: pointer; font-family: inherit; transition: transform .14s, box-shadow .14s, border-color .14s; }
.gdc-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-elevated); border-color: var(--accent-soft-bd, var(--stroke)); }
.gdc-ic { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, var(--accent) 11%, transparent); color: var(--accent); }
.gdc-ic svg { width: 20px; height: 20px; }
.gdc-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gdc-tx b { font-size: 13.5px; font-weight: 700; color: var(--navy-900); }
.gdc-tx i { font-size: 11.5px; font-style: normal; color: var(--ink-3); line-height: 1.4; }
.gdc-go { flex: none; color: var(--ink-3); opacity: .55; }
.gdc-go svg { width: 16px; height: 16px; }

/* Персональные окна занятости брокера (busyBlocks) */
.br-blk-list { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; }
.br-blk { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; color: var(--navy-900); background: var(--bg-2); border: 1px solid var(--stroke); border-radius: 9px; padding: 4px 6px 4px 10px; }
.br-blk button { border: none; background: none; color: var(--ink-3); cursor: pointer; font-size: 15px; line-height: 1; padding: 0 2px; }
.br-blk button:hover { color: var(--bad, #C0392B); }
.br-blk-add { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 7px; }
.br-blk-add select, .br-blk-add input[type="time"], .br-blk-add .br-blk-label { border: 1px solid var(--stroke); border-radius: 9px; padding: 7px 9px; font-family: inherit; font-size: 12.5px; background: var(--card); color: var(--ink); outline: none; }
.br-blk-add select:focus, .br-blk-add input:focus { border-color: var(--accent); }
.br-blk-add .br-blk-label { flex: 1; min-width: 110px; }