/* Полировка интерфейса 2026-09-18 — по замечаниям владельца со скриншотов.
   Разделы по участкам: работа шла параллельно, каждый участок правит только
   свой раздел (между своими маркерами). Только токены темы (--pk-*, --bd-*
   и т.п.), чтобы светлая и тёмная темы держались обе. */

/* ==== [pricing] begin ==== */
/* Тарифные карточки (пункт 01, 18 сентября 2026). Владелец: «описания бедные,
   карточки одинаковые, непонятно, какой брать». Иерархия теперь одна на всех
   поверхностях: имя → цена → одно обещание → пункты с галочками → кнопка
   внизу. Популярный тариф — с плашкой, акцентной рамкой, свечением и подъёмом.
   Только токены темы (--primary, --surface, --border, --text-*), поэтому
   светлая и тёмная темы держатся обе. */

/* Общее для всех карточек тарифа (кабинет, партнёрский кабинет, онбординг). */
.plan-card { --uip-accent: var(--primary); position: relative; }
.plan-card__promise {
  margin: 2px 0 0;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--text-main);
}
.plan-card__inherits {
  margin: 4px 0 -2px;
  font-size: 0.76rem;
  font-weight: 700;
  color: var(--uip-accent);
}
.plan-card__features { list-style: none; padding-inline-start: 0; gap: 7px; }
.plan-card__features li {
  position: relative;
  padding-inline-start: 24px;
  line-height: 1.4;
  color: var(--text-soft);
}
.plan-card__features li::before,
.plan-card__features li::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  top: 0.12em;
  width: 16px;
  height: 16px;
  border-radius: 50%;
}
.plan-card__features li::before { background: color-mix(in srgb, var(--uip-accent) 18%, transparent); }
.plan-card__features li::after {
  background: var(--uip-accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.3l2.4 2.4 5.2-5.4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.3l2.4 2.4 5.2-5.4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat;
}

/* Страница «Подписка»: сетка основных тарифов. */
.billing-workspace #plans.plan-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 236px), 1fr));
  gap: 18px;
  align-items: stretch;
  /* место под плашку «Популярный» и подъём карточки */
  padding-top: 16px;
}
.billing-workspace .plan-card--full,
.billing-workspace .billing-line-widget .plan-card--compact {
  gap: 10px;
  padding: 24px 20px 20px;
  border-radius: 16px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--uip-accent) 4%, var(--surface)) 0%, var(--surface) 60%);
}
.billing-workspace .plan-card__name { font-size: 1.2rem; font-weight: 800; letter-spacing: -0.01em; }
.billing-workspace .plan-card__head { gap: 6px; }
.billing-workspace .plan-card__badge {
  align-self: flex-start;
  padding: 3px 10px;
  border-radius: 10px;
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--text-main);
  background: color-mix(in srgb, var(--uip-accent) 12%, transparent);
}
.billing-workspace .plan-card__price { margin-top: 6px; }
.billing-workspace .plan-card--full .plan-card__price strong { font-size: 2.15rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.05; }
.billing-workspace .plan-card--compact .plan-card__price strong { font-size: 1.7rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.05; }
.billing-workspace .plan-card__price small { font-size: 0.86rem; }
.billing-workspace .plan-card__features { margin: 2px 0 10px; }
.billing-workspace .plan-card__features li { font-size: 0.84rem; }
.billing-workspace .plan-card__cta { min-height: 44px; border-radius: 10px; font-weight: 700; }

/* «ТАРИФ» над каждым именем — шум: имя и так говорит. Остаются только
   плашки, которые что-то сообщают: «Популярный» и «Ваш тариф». */
.billing-workspace .plan-card:not(.plan-card--featured):not(.plan-card--current) .plan-card__eyebrow { display: none; }
.billing-workspace .plan-card--featured .plan-card__eyebrow,
.billing-workspace .plan-card--current .plan-card__eyebrow {
  position: absolute;
  top: -12px;
  inset-inline: 0;
  margin-inline: auto;
  width: max-content;
  max-width: calc(100% - 24px);
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: #fff;
  background: var(--uip-accent);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--uip-accent) 35%, transparent);
  white-space: nowrap;
}
.billing-workspace .plan-card--current .plan-card__eyebrow { background: var(--live); box-shadow: none; }

/* Популярный: акцентная рамка, свечение, подъём. */
.billing-workspace .plan-card--featured:not(.plan-card--current) {
  border: 1.5px solid var(--uip-accent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--uip-accent) 12%, var(--surface)) 0%, var(--surface) 62%);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--uip-accent) 30%, transparent),
    0 18px 44px color-mix(in srgb, var(--uip-accent) 22%, transparent);
  transform: translateY(-8px);
}
.billing-workspace .plan-card--featured:not(.plan-card--current):hover,
.billing-workspace .plan-card--featured:not(.plan-card--current):focus-within { transform: translateY(-10px); }

/* Линейки (Голос, Медиа, Рассылки, Boro): акцент — цвет линейки. */
.billing-workspace .billing-line-widget .plan-card { --uip-accent: rgb(var(--line-accent, var(--ch-blue))); }
.billing-workspace .billing-line-widget .plan-grid--compact {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap: 16px;
  align-items: stretch;
  padding-top: 14px;
}
.billing-workspace .billing-line-widget .plan-card--featured:not(.plan-card--current) { transform: translateY(-6px); }
.billing-workspace .billing-line-widget .plan-card--featured:not(.plan-card--current):hover,
.billing-workspace .billing-line-widget .plan-card--featured:not(.plan-card--current):focus-within { transform: translateY(-8px); }
/* Плашка «Популярный» в линейке: белый текст на ярком голубом/янтарном не
   читается, поэтому — тонированная плашка с рамкой цвета линейки и обычным
   цветом текста темы. Кнопка остаётся основной синей: одно действие — один цвет. */
.billing-workspace .billing-line-widget .plan-card--featured:not(.plan-card--current) .plan-card__eyebrow {
  color: var(--text-main);
  background: color-mix(in srgb, var(--uip-accent) 26%, var(--surface));
  border: 1px solid var(--uip-accent);
}
.billing-workspace .billing-line-widget { padding: 20px 22px 22px; }
.billing-workspace .billing-line-widget-head strong { font-size: 1.12rem; font-weight: 800; }
.billing-workspace .billing-line-widget-head p { font-size: 0.86rem; line-height: 1.45; max-width: 90ch; }

@media (prefers-reduced-motion: reduce) {
  .billing-workspace .plan-card--featured:not(.plan-card--current),
  .billing-workspace .plan-card--featured:not(.plan-card--current):hover { transform: none; }
}
@media (max-width: 720px) {
  .billing-workspace #plans.plan-grid,
  .billing-workspace .billing-line-widget .plan-grid--compact { grid-template-columns: 1fr; }
  .billing-workspace .plan-card--featured:not(.plan-card--current) { transform: none; }
}
/* ==== [pricing] end ==== */

/* ==== [cmo] begin ==== */
/* AI-директор по маркетингу (/marketing/cmo, AiCmoPage.js). Карточка — flex-
   колонка: прямой ребёнок-кнопка растягивался на всю ширину. Кнопки теперь
   живут в .uip-cmo-toolbar и держат свой размер. */
/* styles.css держит .eyebrow { letter-spacing: 0.16em !important } — на
   русском и арабском это «р а з р я д к а». Перебить можно только тем же. */
.uip-cmo-page .uip-cmo-eyebrow { letter-spacing: 0.02em !important; text-transform: none; font-size: 12.5px; font-weight: 600; opacity: 0.95; }
.uip-cmo-page .module-header .uip-cmo-eyebrow { text-transform: uppercase; letter-spacing: 0.05em !important; }
.uip-cmo-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 2px 0; }
.uip-cmo-toolbar > .uip-cmo-btn,
.uip-cmo-toolbar > .uip-cmo-btnwrap,
.uip-cmo-page .uip-cmo-btn { width: auto; flex: 0 0 auto; align-self: auto; white-space: nowrap; }
.uip-cmo-page a.uip-cmo-btn { display: inline-flex; align-items: center; text-decoration: none; }
.uip-cmo-btnwrap { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; }
/* Недоступная кнопка читается и говорит почему. */
.uip-cmo-page .uip-cmo-btn:disabled,
.uip-cmo-page .uip-cmo-btn[aria-disabled="true"] {
  /* .primary-button в styles.css красится через background … !important —
     без !important недоступная кнопка оставалась синей с бледным текстом. */
  opacity: 1; cursor: not-allowed; color: var(--pk-muted); background: transparent !important; background-image: none !important;
  border: 1px dashed color-mix(in srgb, var(--pk-muted) 55%, transparent); box-shadow: none; filter: none;
}
.uip-cmo-page .uip-cmo-why { font-size: 12.5px; line-height: 1.4; color: var(--pk-amber); margin: 0; }
.uip-cmo-page .uip-cmo-intro { margin: 0; max-width: 860px; line-height: 1.5; color: var(--pk-text); }
.uip-cmo-page p.cmo-muted.uip-cmo-intro { color: var(--pk-muted); }
.uip-cmo-page .uip-cmo-card > p { max-width: 900px; }
.uip-cmo-page .uip-cmo-empty { margin: 0; padding: 10px 12px; border: 1px dashed var(--pk-line); border-radius: 10px; }
.uip-cmo-page .uip-cmo-hint { margin: 0; }
.uip-cmo-page .uip-cmo-label { margin: 6px 0 0; font-size: 13px; font-weight: 600; color: var(--pk-text); }
/* Шапка: кнопки в ряд, счётчик AI-анализов маленьким значком под ними. */
.uip-cmo-header-tools { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.uip-cmo-usage {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 600; color: var(--pk-muted); background: var(--pk-blue-soft);
  border: 1px solid var(--pk-blue-line); white-space: nowrap;
}
/* Напоминания: текст и «Открыть» разведены. */
.uip-cmo-page .uip-cmo-reminders { display: flex; flex-direction: column; gap: 8px; margin: 0; padding-inline-start: 18px; }
.uip-cmo-page .uip-cmo-reminder { display: list-item; }
.uip-cmo-page .uip-cmo-reminder > .uip-cmo-reminder-text { margin-inline-end: 12px; }
.uip-cmo-page .uip-cmo-reminder > .uip-cmo-btn { vertical-align: middle; }
/* Каналы — ровная сетка: название · статус · что умеет. */
.uip-cmo-page .cmo-channels { display: flex; flex-direction: column; gap: 6px; }
.uip-cmo-page .uip-cmo-channel { display: grid; grid-template-columns: minmax(170px, 200px) auto 1fr; align-items: center; gap: 10px; }
.uip-cmo-page .uip-cmo-channel > .status-pill { justify-self: start; }
/* Форма: две колонки на десктопе, одна на телефоне. */
.uip-cmo-page .uip-cmo-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; max-width: 900px; }
.uip-cmo-page .uip-cmo-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.uip-cmo-page .uip-cmo-field-wide { grid-column: 1 / -1; }
.uip-cmo-page .uip-cmo-field-label { font-size: 13px; font-weight: 600; color: var(--pk-text); }
.uip-cmo-page .uip-cmo-field-hint { font-size: 12px; color: var(--pk-muted); }
.uip-cmo-page .uip-cmo-field input,
.uip-cmo-page .uip-cmo-field select,
.uip-cmo-page .uip-cmo-field textarea { width: 100%; max-width: 420px; min-height: 38px; box-sizing: border-box; }
.uip-cmo-page .uip-cmo-field-wide textarea { max-width: none; resize: vertical; font: inherit; padding: 8px 10px; }
.uip-cmo-page .uip-cmo-field select { cursor: pointer; }
.uip-cmo-page .uip-cmo-card h4 { margin: 8px 0 0; }
/* Галочки — сетка карточек с подписями. */
.uip-cmo-page .uip-cmo-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px 12px; max-width: 900px; }
.uip-cmo-page .uip-cmo-checks-one { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
.uip-cmo-page .uip-cmo-check {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px;
  border: 1px solid var(--pk-line); background: var(--pk-card-hi); cursor: pointer; line-height: 1.3;
}
.uip-cmo-page .uip-cmo-check input { margin: 0; flex: 0 0 auto; width: 16px; height: 16px; accent-color: var(--pk-blue); }
.uip-cmo-page .uip-cmo-check:has(input:disabled) { cursor: default; opacity: 0.85; }
/* LinkedIn для клиента. */
.uip-cmo-page .uip-cmo-li { display: flex; flex-direction: column; gap: 10px; }
.uip-cmo-page .uip-cmo-li p { margin: 0; max-width: 860px; }
.uip-cmo-page .uip-cmo-li-state { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
@media (max-width: 760px) {
  .uip-cmo-page .uip-cmo-form { grid-template-columns: minmax(0, 1fr); }
  .uip-cmo-page .uip-cmo-field input, .uip-cmo-page .uip-cmo-field select, .uip-cmo-page .uip-cmo-field textarea { max-width: none; }
  .uip-cmo-page .uip-cmo-channel { grid-template-columns: 1fr auto; }
  .uip-cmo-page .uip-cmo-channel > .cmo-muted { grid-column: 1 / -1; }
  .uip-cmo-header-tools { align-items: stretch; }
  .uip-cmo-toolbar > .uip-cmo-btn { flex: 1 1 auto; }
}
/* ==== [cmo] end ==== */

/* ==== [media] begin ==== */
/* 04 · Контент-календарь (/media-factory/calendar) — месяц крупно, счётчики,
   «Сегодня» кольцом, выходные (сб/вс, неделя ОАЭ) тонированы, фишки постов
   со знаком сети и превью, «+ Запланировать» на наведении. */
.uip-mcal-head { align-items: center; gap: 14px 18px; margin-bottom: 14px; }
.uip-mcal-title .eyebrow { margin: 0; text-transform: uppercase; }
.uip-mcal-title { order: 1; }
.uip-mcal-nav { order: 2; }
.uip-mcal-stats { order: 3; flex-basis: 100%; }
.uip-mcal-month { display: flex; align-items: baseline; gap: 10px; margin: 2px 0 0; }
.uip-mcal-monthname { font-size: 1.9rem; font-weight: 800; letter-spacing: -0.01em; color: var(--pk-text); text-transform: capitalize; line-height: 1.1; }
.uip-mcal-year { font-size: 1.1rem; font-weight: 600; color: var(--pk-muted); }
.uip-mcal-stats { display: flex; flex-wrap: wrap; gap: 8px; flex: 1 1 auto; }
.uip-mcal-stat { display: inline-flex; align-items: baseline; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--pk-line-2); background: var(--pk-card); color: var(--pk-muted); font-size: 0.8rem; }
.uip-mcal-stat b { color: var(--pk-text); font-size: 1rem; font-variant-numeric: tabular-nums; }
.uip-mcal-stat.is-scheduled b { color: var(--pk-blue); }
.uip-mcal-stat.is-published b { color: var(--pk-low); }
.uip-mcal-stat.is-drafts b { color: var(--pk-amber); }
.uip-mcal-stat.is-error b { color: var(--pk-high); }
.uip-mcal-nav { align-items: center; flex-wrap: wrap; }
.uip-mcal-nav .mf-cal-navbtn { background: var(--pk-card); border-color: var(--pk-line-2); color: var(--pk-text); }
.uip-mcal-nav .mf-cal-navbtn:hover { border-color: var(--pk-blue-line); }
.uip-mcal-nav .uip-mcal-new { background: var(--pk-blue); border-color: var(--pk-blue); color: #fff; font-size: 0.82rem; }
.uip-mcal-nav .uip-mcal-new:hover { filter: brightness(1.08); color: #fff; }
.uip-mcal-notice { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 14px; margin-bottom: 12px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--pk-amber) 40%, transparent); background: color-mix(in srgb, var(--pk-amber) 9%, transparent); color: var(--pk-text); font-size: 0.86rem; line-height: 1.45; }
.uip-mcal-notice-t { flex: 1 1 320px; }
.uip-mcal-grid { gap: 6px; }
.uip-mcal-grid .mf-cal-wd.is-weekend { color: var(--pk-stage-coral); }
.uip-mcal-day { display: flex; flex-direction: column; gap: 5px; min-height: 108px; padding: 7px 7px 8px; background: var(--pk-card); border: 1px solid var(--pk-line); transition: border-color .15s, background .15s, box-shadow .15s; }
.uip-mcal-day.is-weekend { background: color-mix(in srgb, var(--pk-stage-coral) 10%, var(--pk-card)); border-color: color-mix(in srgb, var(--pk-stage-coral) 16%, var(--pk-line)); }
.uip-mcal-day.is-past { opacity: 0.72; }
.uip-mcal-day.is-past.has-posts { opacity: 0.92; }
.uip-mcal-day:hover { border-color: var(--pk-blue-line); }
.uip-mcal-day.is-today { border-color: var(--pk-blue); box-shadow: 0 0 0 2px var(--pk-blue-soft), inset 0 0 0 1px var(--pk-blue); background: color-mix(in srgb, var(--pk-blue) 7%, var(--pk-card)); }
.uip-mcal-daytop { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.uip-mcal-day .mf-cal-daynum { color: var(--pk-muted); font-size: 0.84rem; font-weight: 700; }
.uip-mcal-day.is-today .mf-cal-daynum { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; border-radius: 999px; background: var(--pk-blue); color: #fff; }
.uip-mcal-todaylbl { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--pk-blue); }
.uip-mcal-chips { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.uip-mcal-chip { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 5px; min-width: 0; width: 100%; padding-block: 4px; padding-inline-start: 5px; padding-inline-end: 6px; border-radius: 7px; border: 1px solid var(--pk-line-2); border-inline-start: 3px solid var(--pk-blue); background: var(--pk-panel); color: var(--pk-text); font: inherit; font-size: 0.72rem; line-height: 1.25; text-align: start; }
button.uip-mcal-chip { cursor: pointer; }
button.uip-mcal-chip:hover { border-color: var(--pk-blue-line); }
.uip-mcal-chip.is-published { border-inline-start-color: var(--pk-low); }
.uip-mcal-chip.is-scheduled { border-inline-start-color: var(--pk-blue); }
.uip-mcal-chip.is-draft, .uip-mcal-chip.is-local { border-inline-start-color: var(--pk-amber); }
.uip-mcal-chip.is-local { border-style: dashed; border-inline-start-style: solid; }
.uip-mcal-chip.is-error { border-inline-start-color: var(--pk-high); background: color-mix(in srgb, var(--pk-high) 8%, var(--pk-panel)); }
.uip-mcal-thumb { flex: 0 0 auto; width: 22px; height: 22px; border-radius: 5px; background: var(--pk-card-hi) center / cover no-repeat; display: inline-flex; align-items: center; justify-content: center; font-size: 0.6rem; color: var(--pk-text); }
.uip-mcal-thumb.is-video { background: linear-gradient(135deg, #1f2a44, #3b2a5c); color: #fff; }
.uip-mcal-marks { display: inline-flex; align-items: center; gap: 2px; flex: 0 0 auto; }
.uip-mcal-mark { display: inline-flex; align-items: center; justify-content: center; min-width: 17px; height: 17px; padding: 0 2px; border-radius: 4px; color: #fff; font-size: 0.56rem; font-weight: 800; letter-spacing: .02em; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22); }
.uip-mcal-more { font-size: 0.62rem; color: var(--pk-muted); font-weight: 700; }
.uip-mcal-time { flex: 0 0 auto; color: var(--pk-muted); font-variant-numeric: tabular-nums; font-weight: 600; }
.uip-mcal-text { flex: 1 1 100%; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; word-break: break-word; }
.uip-mcal-overflow { font-size: 0.68rem; color: var(--pk-muted); font-weight: 600; padding-inline-start: 4px; }
.uip-mcal-add { margin-top: auto; align-self: stretch; padding: 5px 6px; border-radius: 7px; border: 1px dashed var(--pk-blue-line); background: var(--pk-blue-soft); color: var(--pk-accent-ink, var(--pk-blue)); font: inherit; font-size: 0.72rem; font-weight: 700; line-height: 1.2; white-space: normal; overflow: visible; text-overflow: clip; cursor: pointer; opacity: 0; transition: opacity .15s; }
.uip-mcal-day:hover .uip-mcal-add, .uip-mcal-day:focus-within .uip-mcal-add, .uip-mcal-day.is-hover .uip-mcal-add { opacity: 1; }
.uip-mcal-day.is-today.is-free .uip-mcal-add { opacity: 0.85; }
@media (hover: none) { .uip-mcal-day.is-free .uip-mcal-add { opacity: 0.8; } }
.uip-mcal-empty { margin-bottom: 14px; padding: 22px 20px; border-radius: 14px; border: 1px dashed var(--pk-blue-line); background: var(--pk-blue-soft); text-align: center; }
.uip-mcal-empty-t { margin: 0 0 4px; font-size: 1.05rem; font-weight: 700; color: var(--pk-text); }
.uip-mcal-empty-d { margin: 0 auto 12px; max-width: 560px; color: var(--pk-muted); font-size: 0.88rem; line-height: 1.5; }
.uip-mcal-empty-actions { display: inline-flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.uip-mcal-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 12px; color: var(--pk-muted); font-size: 0.76rem; }
.uip-mcal-leg { display: inline-flex; align-items: center; gap: 6px; }
.uip-mcal-leg i { width: 10px; height: 10px; border-radius: 3px; background: var(--pk-blue); }
.uip-mcal-leg.is-published i { background: var(--pk-low); }
.uip-mcal-leg.is-draft i { background: var(--pk-amber); }
.uip-mcal-leg.is-local i { background: transparent; border: 1.5px dashed var(--pk-amber); }
.uip-mcal-leg.is-error i { background: var(--pk-high); }
@media (max-width: 900px) {
  .uip-mcal-day { min-height: 78px; }
  .uip-mcal-text, .uip-mcal-time { display: none; }
  .uip-mcal-monthname { font-size: 1.5rem; }
}

/* 05 · Каналы (/media-factory/channels) — «Нужна настройка» словами и три
   кнопки ровно туда, где подключают: Instagram, Facebook, TikTok. */
.uip-mch-guide { margin-bottom: 14px; padding: 16px 18px; border-radius: 14px; border: 1px solid var(--pk-blue-line); background: linear-gradient(120deg, var(--pk-blue-soft), color-mix(in srgb, var(--pk-stage-teal) 7%, transparent)); color: var(--pk-text); }
.uip-mch-guide-head { display: flex; gap: 12px; align-items: flex-start; }
.uip-mch-guide-icon { font-size: 1.4rem; line-height: 1; margin-top: 2px; }
.uip-mch-guide h3 { margin: 0 0 4px; font-size: 1.05rem; color: var(--pk-text); }
.uip-mch-guide-head p { margin: 0; color: var(--pk-muted); font-size: 0.88rem; line-height: 1.5; max-width: 820px; }
.uip-mch-rows { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 8px; margin-top: 14px; }
.uip-mch-row { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 10px; row-gap: 2px; padding: 12px; border-radius: 12px; border: 1px solid var(--pk-line-2); background: var(--pk-panel); }
.uip-mch-row .uip-mch-mark { grid-column: 1; grid-row: 1 / span 2; }
.uip-mch-row .uip-mch-connect { grid-column: 1 / -1; grid-row: 3; margin-top: 8px; width: 100%; justify-content: center; }
.uip-mch-name { color: var(--pk-text); font-size: 0.95rem; grid-column: 2; grid-row: 1; }
.uip-mch-state { display: inline-flex; align-items: center; gap: 5px; font-size: 0.76rem; font-weight: 700; color: var(--pk-muted); grid-column: 2; grid-row: 2; white-space: nowrap; }
.uip-mch-state::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.uip-mch-state.is-on { color: var(--pk-low); }
.uip-mch-state.is-off { color: var(--pk-amber); }
.uip-mch-connect { flex: 0 0 auto; white-space: nowrap; }
.uip-mch-reason { margin: 10px 0 0; font-size: 0.84rem; color: var(--pk-text); }
.uip-mch-facts { margin: 8px 0 0; padding-inline-start: 18px; color: var(--pk-muted); font-size: 0.8rem; line-height: 1.55; }
.uip-mch-links { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--pk-line); color: var(--pk-muted); font-size: 0.8rem; }
/* Плитки каналов: имя сети целиком, а не «Insta…», статус — одной строкой. */
.mf-channels-wrap .media-channel-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.mf-channels-wrap .media-channel-head-text strong { white-space: normal; overflow: visible; }
.mf-channels-wrap .media-channel-status-off { color: var(--pk-amber); }
.mf-channels-wrap .media-channel-status-off .media-channel-status-dot { background: var(--pk-amber); }
/* ==== [media] end ==== */

/* ==== [agents] begin ==== */
/* CRM: карточек агента нет — фраза и выход (CrmPipelinePage, AgentCardsEmpty). */
.uip-agents-crm-empty {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  margin: 8px 0 12px; padding: 14px 18px; border-radius: 14px;
  background: rgb(var(--ch-blue, 59 130 246) / .08); border: 1px solid rgb(var(--ch-blue, 59 130 246) / .28);
}
.uip-agents-crm-empty-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1 1 320px; }
.uip-agents-crm-empty-text b { font-size: 15px; font-weight: 600; color: var(--bd-ink, #e9eef7); }
.uip-agents-crm-empty-text span { font-size: 13.5px; line-height: 1.45; color: var(--bd-ink-2, #94a3b8); }
.uip-agents-crm-reset { white-space: nowrap; }
/* ==== [agents] end ==== */

/* ==== [operations] begin ==== */
/* Операции → «Маршруты между отделами» (пункт 10, 18 сентября 2026).
   Владелец: блок нравится, но непонятно, как создать маршрут. Теперь это
   конструктор с видимой лестницей из четырёх шагов; только токены --pk-*
   (light-dark()), поэтому светлая и тёмная темы держатся обе. */
.uip-ops-works strong { color: var(--pk-green); }
.uip-ops-start { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 2px 0 4px; }
.uip-ops-new { font-weight: 650; }
.uip-ops-builder {
  display: grid; gap: 14px;
  padding: 16px 18px; border-radius: 14px;
  border: 1px solid var(--pk-blue-line);
  background: var(--pk-panel);
  box-shadow: 0 0 0 3px var(--pk-blue-soft);
}
.uip-ops-builder-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 14px; }
.uip-ops-builder-head strong { font-size: 15px; color: var(--pk-text); }
.uip-ops-stepper {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px;
  counter-reset: none;
}
.uip-ops-stepper-item { position: relative; min-inline-size: 0; }
.uip-ops-stepper-btn {
  inline-size: 100%; display: flex; align-items: center; gap: 10px;
  padding: 9px 12px; border-radius: 11px; cursor: pointer;
  border: 1px solid var(--pk-line-2); background: var(--pk-card);
  color: var(--pk-muted); font: inherit; font-size: 13px; text-align: start;
}
.uip-ops-stepper-btn:focus-visible { outline: 2px solid var(--pk-blue); outline-offset: 2px; }
.uip-ops-stepper-no {
  flex: none; inline-size: 24px; block-size: 24px; border-radius: 50%;
  display: grid; place-items: center; font-size: 12px; font-weight: 700;
  border: 1px solid var(--pk-line-2); color: var(--pk-muted);
}
.uip-ops-stepper-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.uip-ops-stepper-item.is-current .uip-ops-stepper-btn {
  border-color: var(--pk-blue); background: var(--pk-blue-soft); color: var(--pk-text); font-weight: 650;
}
.uip-ops-stepper-item.is-current .uip-ops-stepper-no { background: var(--pk-blue); border-color: var(--pk-blue); color: #fff; }
.uip-ops-stepper-item.is-done .uip-ops-stepper-btn { color: var(--pk-text); }
.uip-ops-stepper-item.is-done .uip-ops-stepper-no { border-color: var(--pk-green); color: var(--pk-green); }
.uip-ops-errors {
  padding: 10px 14px; border-radius: 11px;
  border: 1px solid color-mix(in srgb, var(--pk-amber) 55%, transparent);
  background: color-mix(in srgb, var(--pk-amber) 10%, transparent);
  color: var(--pk-text); font-size: 13px;
}
.uip-ops-errors strong { color: var(--pk-amber); }
.uip-ops-errors ul { margin: 6px 0 0; padding-inline-start: 18px; display: grid; gap: 4px; line-height: 1.45; }
.uip-ops-panel { display: grid; gap: 10px; }
.uip-ops-field { display: grid; gap: 5px; min-inline-size: 0; }
.uip-ops-label { font-size: 12px; font-weight: 650; color: var(--pk-muted); letter-spacing: 0.01em; }
.uip-ops-hint { margin: 0; color: var(--pk-muted); font-size: 12.5px; line-height: 1.5; }
.uip-ops-chosen {
  margin: 0; padding: 8px 12px; border-radius: 10px; font-size: 13px; font-weight: 600;
  color: var(--pk-text); background: var(--pk-blue-soft); border: 1px solid var(--pk-blue-line);
}
.uip-ops-steplist { display: grid; gap: 10px; }
.uip-ops-stepcard {
  display: grid; gap: 10px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--pk-line-2); background: var(--pk-card);
}
.uip-ops-stepcard.is-kept { border-style: dashed; }
.uip-ops-stepcard-head { display: flex; align-items: center; gap: 10px; }
.uip-ops-stepcard-head strong { font-size: 13.5px; color: var(--pk-text); }
.uip-ops-stepcard-head .ghost-button { margin-inline-start: auto; }
.uip-ops-stepgrid {
  display: grid; gap: 10px 12px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr);
}
.uip-ops-when { display: flex; gap: 8px; }
.uip-ops-when select { flex: 1 1 auto; min-inline-size: 0; }
.uip-ops-num { flex: 0 0 84px; inline-size: 84px; }
.uip-ops-stepgrid .ops-step-mode { inline-size: 100%; }
.uip-ops-preview {
  display: grid; gap: 8px; padding: 14px 16px; border-radius: 12px;
  border: 1px solid var(--pk-line-2); background: var(--pk-card);
}
.uip-ops-preview-when { margin: 0; font-size: 14px; font-weight: 650; color: var(--pk-text); }
.uip-ops-preview-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.uip-ops-preview-list li { font-size: 13.5px; line-height: 1.5; color: var(--pk-text); padding-inline-start: 6px; }
.uip-ops-adv-toggle { justify-self: start; }
.uip-ops-nav {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  padding-top: 12px; border-top: 1px solid var(--pk-line);
}
.uip-ops-next { font-weight: 650; }
.uip-ops-said { color: var(--pk-green); font-weight: 600; }
.uip-ops-elsewhere { margin-inline-start: auto; font-style: italic; }
@media (max-width: 900px) {
  .uip-ops-stepper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .uip-ops-stepgrid { grid-template-columns: minmax(0, 1fr); }
}

/* Экран операций как продукт (19 сентября 2026): плитки, схема маршрута,
   шаблоны карточками, «Что дальше». Владелец: «экран какой-то странный» —
   он читался как текстовый документ. Только токены --pk-*. */
.ops-page { display: grid; gap: 18px; }
.ops-hero .page-sub { max-inline-size: 760px; }
.ops-kpis .sw-row { gap: 12px; }
.ops-sec-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 16px; }
.ops-sec-titles { min-inline-size: 0; }
.ops-sec-titles h2, .ops-flow-head h2, .ops-templates > h2 { margin: 0; font-size: 18px; color: var(--pk-text); }
.ops-sec-sub { margin: 4px 0 0; font-size: 13px; line-height: 1.5; color: var(--pk-muted); }

.ops-flow {
  display: grid; gap: 14px; padding: 18px; border-radius: 16px;
  border: 1px solid var(--pk-line-2);
  background: linear-gradient(135deg, var(--pk-blue-soft), transparent 70%), var(--pk-panel);
}
.ops-flow-head { display: grid; gap: 4px; }
.ops-flow-eyebrow {
  justify-self: start; padding: 3px 10px; border-radius: 999px; font-size: 11.5px;
  border: 1px solid color-mix(in srgb, var(--pk-green) 45%, transparent);
  background: color-mix(in srgb, var(--pk-green) 10%, transparent);
}
.ops-flow-track {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px;
}
.ops-flow-node {
  position: relative; display: grid; align-content: start; gap: 6px; padding: 14px; border-radius: 14px;
  border: 1px solid var(--pk-line-2); background: var(--pk-card); min-inline-size: 0;
}
.ops-flow-node + .ops-flow-node::before {
  content: "→"; position: absolute; inset-inline-start: -22px; top: 50%; transform: translateY(-50%);
  font-size: 18px; font-weight: 700; color: var(--pk-blue);
}
[dir="rtl"] .ops-flow-node + .ops-flow-node::before { content: "←"; }
.ops-flow-icon {
  inline-size: 36px; block-size: 36px; border-radius: 11px; display: grid; place-items: center; font-size: 19px;
  background: var(--pk-blue-soft); border: 1px solid var(--pk-blue-line);
}
.ops-flow-title { font-size: 14px; color: var(--pk-text); }
.ops-flow-desc { font-size: 12.5px; line-height: 1.5; color: var(--pk-muted); }
.ops-flow-chip {
  justify-self: start; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
  color: var(--pk-text); background: var(--pk-blue-soft); border: 1px solid var(--pk-blue-line);
}
.ops-flow-list { display: grid; gap: 4px; }
.ops-flow-who { font-size: 12px; color: var(--pk-text); padding: 4px 8px; border-radius: 8px; background: var(--pk-panel); border: 1px solid var(--pk-line); }
.ops-flow-who em { color: var(--pk-amber); font-style: normal; }

.ops-routes, .ops-templates { display: grid; gap: 12px; }
.ops-presets { display: grid; gap: 8px; }
.ops-presets-label { margin: 0; font-size: 12px; font-weight: 650; color: var(--pk-muted); }
.ops-preset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.ops-preset {
  display: grid; align-content: start; gap: 6px; padding: 14px; border-radius: 14px; cursor: pointer; text-align: start;
  font: inherit; color: var(--pk-text); border: 1px solid var(--pk-line-2); background: var(--pk-card);
  transition: border-color .15s ease, transform .15s ease;
  white-space: normal; min-inline-size: 0; block-size: auto;
}
.ops-preset > span { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.ops-preset:hover { border-color: var(--pk-blue); transform: translateY(-1px); }
.ops-preset:focus-visible { outline: 2px solid var(--pk-blue); outline-offset: 2px; }
.ops-preset-icon { font-size: 24px; line-height: 1; }
.ops-preset-title { font-size: 14px; font-weight: 650; }
.ops-preset-out { font-size: 12.5px; line-height: 1.5; color: var(--pk-muted); }
.ops-preset-go { font-size: 12.5px; font-weight: 650; color: var(--pk-blue); }
.ops-route-row { align-items: center; }
.ops-route-dot { inline-size: 9px; block-size: 9px; border-radius: 50%; flex: none; background: var(--pk-line-2); }
.ops-route-row.is-on .ops-route-dot { background: var(--pk-green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--pk-green) 20%, transparent); }

.ops-doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.ops-doc-card {
  display: grid; align-content: start; justify-items: start; gap: 6px; padding: 14px; border-radius: 14px;
  border: 1px solid var(--pk-line-2); background: var(--pk-card);
}
.ops-doc-icon { font-size: 24px; line-height: 1; }

.ops-next-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.ops-next-card {
  display: grid; align-content: start; gap: 4px; padding: 12px 14px; border-radius: 12px;
  border: 1px dashed var(--pk-line-2); background: var(--pk-panel); font-size: 12.5px; line-height: 1.45; color: var(--pk-muted);
}
.ops-next-card strong { font-size: 13.5px; color: var(--pk-text); }
.ops-next-icon { font-size: 20px; line-height: 1; }
.ops-payroll-card {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid var(--pk-line-2); background: var(--pk-card);
}
.ops-payroll-card .source-note { margin: 0; flex: 1 1 320px; }

@media (max-width: 1100px) {
  .ops-flow-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-flow-node:nth-child(3)::before { display: none; }
}
@media (max-width: 640px) {
  .ops-flow-track, .ops-next-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .ops-flow-node + .ops-flow-node::before { content: "↓"; inset-inline-start: 50%; top: -20px; transform: translateX(-50%); display: block; }
  [dir="rtl"] .ops-flow-node + .ops-flow-node::before { content: "↓"; transform: translateX(50%); }
  .ops-next-grid { gap: 10px; }
}
/* ==== [operations] end ==== */

/* ==== [dashboard] begin ==== */
/* «Обзор»: пока CRM не ответила — мерцающая полоса на месте числа, а не «—»
   с «Источник не подключён» (src/services/loadingVerdict.js). */
.rp-kpi-value.uip-dash-skel {
  display: inline-block;
  width: min(62%, 170px);
  height: 26px;
  border-radius: 7px;
  background: linear-gradient(90deg,
    color-mix(in srgb, var(--rp-ink-3, #8b95a7) 12%, transparent),
    color-mix(in srgb, var(--rp-ink-3, #8b95a7) 26%, transparent),
    color-mix(in srgb, var(--rp-ink-3, #8b95a7) 12%, transparent));
  background-size: 200% 100%;
  animation: uip-dash-shimmer 1.4s linear infinite;
}
.rp-kpis.uip-dash-loading .rp-kpi-sub { color: var(--rp-ink-3, #8b95a7); }
@keyframes uip-dash-shimmer { to { background-position: -200% 0; } }
/* «Диалоги»: список из памяти браузера показан, свежий ещё едет. */
.uip-dash-refresh {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 500; color: var(--rp-ink-3, #8b95a7);
  margin-inline-start: 8px; vertical-align: middle;
}
.uip-dash-refresh::before {
  content: ""; width: 10px; height: 10px; border-radius: 50%;
  border: 2px solid currentColor; border-inline-end-color: transparent;
  animation: uip-dash-spin .8s linear infinite;
}
@keyframes uip-dash-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .rp-kpi-value.uip-dash-skel, .uip-dash-refresh::before { animation: none; }
}
/* ==== [dashboard] end ==== */

/* ==== [crm-loading] begin ==== */
/* CRM, ПОКА ВОРОНКА ЕДЕТ (№19): заготовка доски той же геометрии, что и сама
   доска (src/pages/crm/CrmPipelinePage.js → CrmBoardSkeleton). Полоса 36 px и
   зазор 12 px — как .pk-bar над .pk-board; колонки по --pk-col (280 px) через
   12 px. Пришедшая доска встаёт ровно на это место — ничего не прыгает.
   Цвета — токены --pk-* (light-dark()), поэтому обе темы без отдельных правил.
   Заготовка не прокручивается и не берёт фокус: всё, что не влезло, обрезано. */
.pk-page.uip-crmsk {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  overflow: hidden;
}
.uip-crmsk-bar {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 36px;
}
.uip-crmsk-status {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  line-height: 1.35;
}
.uip-crmsk-title { flex: 0 0 auto; color: var(--pk-text); font-size: 14px; font-weight: 650; white-space: nowrap; }
.uip-crmsk-sub { min-width: 0; color: var(--pk-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uip-crmsk-spin {
  flex: 0 0 14px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid var(--pk-blue-line);
  border-top-color: var(--pk-blue);
  animation: uip-crmsk-spin 0.9s linear infinite;
}
.uip-crmsk-tools { flex: 0 1 auto; display: flex; align-items: center; gap: 10px; min-width: 0; }
.uip-crmsk-pill { display: block; width: 92px; height: 30px; border-radius: 11px; border: 1px solid var(--pk-line); }
.uip-crmsk-pill.is-search { width: 260px; }
.uip-crmsk-pill.is-new {
  width: 112px;
  border-color: var(--pk-blue-line);
  background: var(--pk-blue-soft);
}
.uip-crmsk-board {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: stretch;
  gap: 12px;
  overflow: hidden;
  /* Колонка, не влезшая в ширину, гаснет к краю, а не режется по рамке:
     обрубленная рамка читается как поломка, затухание — как «дальше ещё». */
  -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 72px), transparent);
  mask-image: linear-gradient(to right, #000 calc(100% - 72px), transparent);
}
[dir="rtl"] .uip-crmsk-board {
  -webkit-mask-image: linear-gradient(to left, #000 calc(100% - 72px), transparent);
  mask-image: linear-gradient(to left, #000 calc(100% - 72px), transparent);
}
.uip-crmsk-col {
  --uip-crmsk-tone: var(--pk-stage-blue);
  flex: 0 0 var(--pk-col, 280px);
  display: flex;
  flex-direction: column;
  min-height: 0;
  border: 1px solid var(--pk-line);
  border-radius: 10px;
  background: var(--rp-lift-1, rgba(255, 255, 255, 0.02));
  overflow: hidden;
}
.uip-crmsk-col.is-indigo { --uip-crmsk-tone: var(--pk-stage-indigo); }
.uip-crmsk-col.is-violet { --uip-crmsk-tone: var(--pk-stage-violet); }
.uip-crmsk-col.is-teal { --uip-crmsk-tone: var(--pk-stage-teal); }
.uip-crmsk-col.is-sand { --uip-crmsk-tone: var(--pk-stage-sand); }
.uip-crmsk-col.is-mint { --uip-crmsk-tone: var(--pk-stage-mint); }
.uip-crmsk-rule { flex: 0 0 3px; height: 3px; border-radius: 2px; background: var(--uip-crmsk-tone); opacity: 0.6; }
.uip-crmsk-head { display: grid; gap: 8px; padding: 12px 10px 11px; border-bottom: 1px solid var(--pk-line); }
.uip-crmsk-cards { display: grid; align-content: start; gap: 8px; padding: 10px 8px 0; }
.uip-crmsk-card {
  display: grid;
  gap: 9px;
  padding: 12px 10px 10px;
  border: 1px solid var(--pk-line);
  border-radius: 8px;
  background: var(--pk-card);
}
.uip-crmsk-foot { display: flex; align-items: center; gap: 8px; margin-top: 3px; }
.uip-crmsk-dot { flex: 0 0 20px; width: 20px; height: 20px; border-radius: 50%; }
.uip-crmsk-line { display: block; height: 11px; border-radius: 6px; }
.uip-crmsk-line.is-thin { height: 8px; }
.uip-crmsk-line.is-strong { height: 13px; }
.uip-crmsk-line.w35 { width: 35%; }
.uip-crmsk-line.w40 { width: 40%; }
.uip-crmsk-line.w45 { width: 45%; }
.uip-crmsk-line.w55 { width: 55%; }
.uip-crmsk-line.w60 { width: 60%; }
.uip-crmsk-line.w75 { width: 75%; }
.uip-crmsk-line.w80 { width: 80%; }
/* Мерцание — только на заглушках текста, не на рамках: рамки стоят, «течёт»
   содержимое. Каждая следующая колонка чуть позже — волна, а не мигание. */
.uip-crmsk-line,
.uip-crmsk-dot,
.uip-crmsk-pill:not(.is-new) {
  background-image: linear-gradient(90deg,
    color-mix(in srgb, var(--pk-dim) 14%, transparent) 0%,
    color-mix(in srgb, var(--pk-dim) 32%, transparent) 50%,
    color-mix(in srgb, var(--pk-dim) 14%, transparent) 100%);
  background-size: 200% 100%;
  animation: uip-crmsk-shimmer 1.5s linear infinite;
}
.uip-crmsk-head .uip-crmsk-line:first-child {
  background-image: linear-gradient(90deg,
    color-mix(in srgb, var(--uip-crmsk-tone) 22%, transparent) 0%,
    color-mix(in srgb, var(--uip-crmsk-tone) 42%, transparent) 50%,
    color-mix(in srgb, var(--uip-crmsk-tone) 22%, transparent) 100%);
}
.uip-crmsk-col:nth-child(2) :is(.uip-crmsk-line, .uip-crmsk-dot) { animation-delay: 0.12s; }
.uip-crmsk-col:nth-child(3) :is(.uip-crmsk-line, .uip-crmsk-dot) { animation-delay: 0.24s; }
.uip-crmsk-col:nth-child(4) :is(.uip-crmsk-line, .uip-crmsk-dot) { animation-delay: 0.36s; }
.uip-crmsk-col:nth-child(5) :is(.uip-crmsk-line, .uip-crmsk-dot) { animation-delay: 0.48s; }
.uip-crmsk-col:nth-child(6) :is(.uip-crmsk-line, .uip-crmsk-dot) { animation-delay: 0.6s; }
[dir="rtl"] :is(.uip-crmsk-line, .uip-crmsk-dot, .uip-crmsk-pill) { animation-direction: reverse; }
@keyframes uip-crmsk-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@keyframes uip-crmsk-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .uip-crmsk-line, .uip-crmsk-dot, .uip-crmsk-pill, .uip-crmsk-spin { animation: none; }
}
@media (max-width: 1180px) { .uip-crmsk-tools { display: none; } }
@media (max-width: 720px) {
  .uip-crmsk-status { flex-wrap: wrap; }
  .uip-crmsk-sub { flex-basis: 100%; white-space: normal; }
}
/* ==== [crm-loading] end ==== */

/* ==== [core] begin ==== */

/* «МОЯ ЛИНИЯ» ВЫЛЕЗАЛА НА СТРОКУ СОСТОЯНИЯ (владелец, 18.09.2026, №13).
   Не вёрстка карточки, а сетка страницы. `.page-stack` — сетка с ОПРЕДЕЛЁННОЙ
   высотой (прокручиваемая область), и содержимого в ней больше, чем высоты.
   Карточка — готовый узел вкладки: blockRoom ставит ей inline `min-height`
   прошлого раза. Явный min-height ЗАМЕНЯЕТ автоматический минимум элемента
   сетки, и перегруженная сетка ужимает строку ровно до него: запомнилось 97 px
   (короткое состояние, другой режим просмотра) — карточка 97 px, а логин,
   «Сохранить» и пунктирная «Где взять логин» висят ниже её рамки, поверх
   «Телефония: … · Активных звонков». Воспроизведено на превью подстановкой
   97 px в br.blockRoom.v1: рамка 633–730, справка 815–906, строка состояния 744.
   Строки этой сетки теперь по содержимому (max-content): пол из памяти
   по-прежнему держит место, пока данные грузятся, но ужать карточку ниже её
   содержимого больше нельзя. */
main.workspace > .page-stack.voice-page { grid-auto-rows: max-content; }
.voice-page > .voice-myline { margin-bottom: 4px; }
.voice-myline .team-sip { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.voice-myline .team-sip-help { margin-top: 8px; width: 100%; box-sizing: border-box; }
/* Колонка клавиатуры занимает обе строки рабочей области и выше их суммы.
   При `auto auto` лишняя высота делилась между строками поровну — и под
   верхними карточками («Активный звонок», «Состояние линии», «Оценка»)
   появлялась пустая полоса ~70 px перед «Последними звонками». Лишнее
   теперь уходит в нижнюю строку, под список, где пустота читается как место. */
@media (min-width: 1241px) {
  .voice-comp { grid-template-rows: auto 1fr; }
}

/* ТЕСТ АГЕНТА ГОЛОСОМ (№9): что происходит — видно всегда. */
.uip-voicetest-empty { display: grid; gap: 8px; padding: 6px 2px; }
.uip-voicetest-steps { margin: 0; padding-inline-start: 20px; display: grid; gap: 4px; color: var(--pk-text-2, var(--text-soft)); font-size: 0.84rem; line-height: 1.45; }
.uip-voicetest-status {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px;
  margin: 10px 0 8px; padding: 9px 12px;
  border: 1px solid var(--pk-line-2, var(--border)); border-radius: 10px;
  background: var(--pk-panel, var(--surface));
  font-size: 0.86rem; font-weight: 600; color: var(--pk-text, var(--text-main));
}
.uip-voicetest-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--pk-text-3, #8b95a7); flex: 0 0 10px; }
.uip-voicetest-status.is-idle .uip-voicetest-dot { background: var(--pk-green, #22c55e); }
.uip-voicetest-status.is-listening { border-color: var(--pk-red, #ef4444); }
.uip-voicetest-status.is-listening .uip-voicetest-dot { background: var(--pk-red, #ef4444); animation: uip-vt-pulse 1s ease-in-out infinite; }
.uip-voicetest-status.is-thinking { border-color: var(--pk-amber, #f59e0b); }
.uip-voicetest-status.is-thinking .uip-voicetest-dot { background: var(--pk-amber, #f59e0b); animation: uip-vt-pulse 0.8s ease-in-out infinite; }
.uip-voicetest-status.is-speaking { border-color: var(--pk-blue, #3b82f6); }
.uip-voicetest-status.is-speaking .uip-voicetest-dot { background: var(--pk-blue, #3b82f6); animation: uip-vt-pulse 0.6s ease-in-out infinite; }
.uip-voicetest-status.is-error { border-color: var(--pk-red, #ef4444); background: color-mix(in srgb, var(--pk-red, #ef4444) 8%, var(--pk-panel, var(--surface))); }
.uip-voicetest-status.is-error .uip-voicetest-dot { background: var(--pk-red, #ef4444); }
.uip-voicetest-status .compact-button { margin-inline-start: auto; }
@keyframes uip-vt-pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.45); opacity: 0.55; } }
.uip-voicetest-mic { display: flex; justify-content: center; margin: 4px 0 10px; }
.agent-mic-btn.uip-voicetest-talk {
  width: auto; min-width: 260px; height: 52px; padding: 0 26px; border-radius: 999px;
  font-size: 1rem; font-weight: 700; letter-spacing: 0.01em;
  background: var(--pk-blue, #2f6bff); color: #fff; border: 0;
  box-shadow: 0 8px 22px color-mix(in srgb, var(--pk-blue, #2f6bff) 35%, transparent);
}
.agent-mic-btn.uip-voicetest-talk.listening { background: var(--pk-red, #ef4444); box-shadow: 0 0 0 6px color-mix(in srgb, var(--pk-red, #ef4444) 22%, transparent); }
.agent-mic-btn.uip-voicetest-talk:disabled { opacity: 0.6; cursor: progress; }
.uip-voicetest-draft { border-color: var(--pk-amber, #f59e0b); }
@media (prefers-reduced-motion: reduce) {
  .uip-voicetest-status .uip-voicetest-dot { animation: none !important; }
}

/* Ключи каналов (№11): находка — спокойным синим, а не тревожным янтарным;
   янтарь остаётся за одноразовым показом нового ключа, где он и нужен. */
.ws-sec-reveal.uip-keys-finding {
  border-color: color-mix(in srgb, var(--pk-blue, #3b82f6) 45%, transparent);
  background: color-mix(in srgb, var(--pk-blue, #3b82f6) 7%, var(--pk-panel, var(--surface)));
}
.ws-sec-reveal.uip-keys-finding h4 { color: var(--pk-text, var(--text-main)); }
.uip-keys-steps { margin: 4px 0 10px; padding-inline-start: 20px; display: grid; gap: 5px; font-size: 0.86rem; line-height: 1.45; color: var(--pk-text-2, var(--text-soft)); }
.uip-keys-calm-note { opacity: 0.9; font-style: normal; }

/* «На решение» в рельсе (№18): свой значок — лоток входящих с галочкой, тем
   же набором линий 1.6px, что у соседей (пустой квадрат был «иконкой по
   умолчанию» для ключа без глифа). */
.nav-icon-approvals {
  --nav-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.6 13.4h4.3l1.6 2.6h5l1.6-2.6h4.3'/%3E%3Cpath d='M5.4 5.2h13.2l1.8 8.2v5a1.6 1.6 0 0 1-1.6 1.6H5.2a1.6 1.6 0 0 1-1.6-1.6v-5z'/%3E%3Cpath d='M9.3 9.4l1.9 1.9 3.6-3.6'/%3E%3C/svg%3E");
}
/* Значок числа — спокойная плашка; красный только когда ждёт клиент. */
.nav-badge.nav-badge-calm {
  background: color-mix(in srgb, var(--rp-blue, #3b82f6) 26%, transparent);
  color: var(--rp-ink, #e6edf7);
  border: 1px solid color-mix(in srgb, var(--rp-blue, #3b82f6) 45%, transparent);
  font-weight: 650;
}
html[data-theme="light"] .nav-badge.nav-badge-calm { color: #123a8a; }
.nav-badge.nav-badge-urgent { background: var(--rp-red, #ef4444); color: #fff; }

/* Подсказки для базы знаний — одной строкой со ссылкой на их экран (№18). */
.approvals-kb-summary {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px;
  margin: 10px 0 12px; padding: 10px 14px;
  border: 1px dashed var(--pk-line-2, var(--border)); border-radius: 12px;
  background: var(--pk-panel, var(--surface));
}
.approvals-kb-summary .approvals-kb-text { font-weight: 650; }
.approvals-kb-summary .compact-button { margin-inline-start: auto; }

/* Профиль компании (№2): поле «Другое» под списком. */
.uip-profile-choice input[type="text"] { margin-top: 6px; }
.uip-profile-choice small { display: block; margin-top: 4px; }
/* Подсказка под списком не должна сдвигать соседнее поле строки вниз. */
.set13-profile-form .setup-form-grid { align-items: start; }

/* Пузырёк приветствия — в сторону экрана от причала.
   rtl-exempt: причал Boro — физическая сторона окна (JS пишет left/top в
   экранных пикселях при любом направлении письма), поэтому и пузырёк
   ставится физическими left/right, а не логическими свойствами. */
.boro-root.boro-dock-left .boro-bubble { inset-inline: auto; left: 100px; border-radius: 14px 14px 14px 4px; }
.boro-root.boro-dock-right .boro-bubble { inset-inline: auto; right: 132px; }
/* На телефоне — над фигуркой, а не сбоку (24.09.2026): сбоку пузырёк ложился
   на подвал страницы («Руководство · Настроить») и прижимался к краю окна.
   rtl-exempt: та же физическая сторона причала, что и выше. */
@media (max-width: 560px) {
  .boro-root.boro-dock-left .boro-bubble,
  .boro-root.boro-dock-right .boro-bubble { top: auto; bottom: calc(100% + 8px); }
  .boro-root.boro-dock-left .boro-bubble { left: 0; right: auto; }
  .boro-root.boro-dock-right .boro-bubble { right: 0; left: auto; border-radius: 14px 14px 4px 14px; }
  /* Лист разговора на телефоне (геометрия — styles.css, «Boro on phones»):
     подписи не мельче 12 px, кнопки шапки — 36 px под палец. «Развернуть»
     не нужна: на телефоне обе величины окна — один и тот же лист. */
  .boro-root .boro-panel :is(.boro-panel-voice, .boro-panel-close, .boro-sessions-toggle) { min-width: 36px; min-height: 36px; }
  .boro-root .boro-panel .boro-panel-wide-toggle { display: none; }
  .boro-root .boro-panel :is(.boro-panel-head-title span, .boro-panel-voice, .boro-mic, .boro-live-toggle, .boro-boundary, .boro-day-chev, .boro-head-note) { font-size: 12px; }
  .boro-root .boro-panel .boro-tier-badge { font-size: 12px; letter-spacing: 0; }
}

/* Boro идёт к причалу плавно, а не прыгает (boroCompanion.js, dockPos). */
.boro-root.boro-docking { transition: left 0.32s cubic-bezier(.2,.8,.2,1), top 0.32s cubic-bezier(.2,.8,.2,1); }
@media (prefers-reduced-motion: reduce) {
  .boro-root.boro-docking { transition: none; }
}
/* ==== [core] end ==== */


/* «НАВЕРХ» НА ДЛИННЫХ ЭКРАНАХ (владелец, 20 сентября 2026: «смотри как высоко
   и нет кнопки, не видно её, обратно выйти»).

   Левый нижний угол — намеренно: правый занят Boro и панелью звонка, и третья
   круглая кнопка рядом с ними читалась бы как часть их. Появляется только
   когда прокрутили больше 600 px, то есть на экране, где она действительно
   нужна; до этого её нет ни глазом, ни на Tab. */
.br-to-top {
  position: fixed; z-index: 45;
  inset-inline-start: 18px; bottom: 22px;
  width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 17px; line-height: 1; font-family: inherit;
  color: var(--rp-ink-1, #e6ebf3);
  background: var(--rp-panel, #0e1420);
  border: 1px solid var(--rp-line, rgba(127, 127, 127, 0.28));
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
  cursor: pointer;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.br-to-top.is-on { opacity: .92; visibility: visible; transform: none; }
.br-to-top:hover { opacity: 1; border-color: var(--rp-ink-3, #6b7a90); }
.br-to-top:focus-visible { outline: 2px solid var(--rp-ink-2, #c3ccda); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .br-to-top { transition: none; } }

/* ТЕЛЕФОННЫЙ ВИДЖЕТ ZADARMA — ПРАВИЛА ЗДЕСЬ БОЛЬШЕ НЕТ (26 сентября 2026).
   20–21 сентября его белая полоса стояла на рельсе, 24-го — над подвалом
   страницы; здесь её сдвигали на 208 px. Причина была не в отступе: пятый
   аргумент zadarmaWidgetFn — это `fixed`, а не autoStart, и с false контейнер
   #zdrmWPhI становился обычным блоком в конце <body>. Теперь виджет
   поднимается с fixed=true, скрыт, пока нет звонка, и во время звонка стоит
   справа внизу в стороне от Boro, «Наверх» и панели звонка — всё это в
   src/lib/zadarmaPhone.js («THE WIDGET'S OWN BAR»), стилями из самого модуля.
   Отступ 208 px у неподвижной полосы был бы прозрачной полосой, которая
   перехватывает щелчки по странице, поэтому он снят. */

/* ШРИФТ И ПАЛЕЦ НА ТЕЛЕФОНЕ (24 сентября 2026, мобильный проход).
   Владелец: «чтобы всё видно, и текст, и управлять можно было». Замер всех
   экранов на 375 px: подписи, значки, «глазки» над заголовками и шапки таблиц
   жили на 9,5–11,5 px — плотность рабочего стола, которая на телефоне читается
   с трудом. Здесь — пол в 12 px для этих классов и только на телефоне.
   !important — потому что у двух из них размер уже стоит с !important
   (styles.css: .eyebrow .66rem, .status-pill .72rem); всё, что в списке, на
   телефоне меньше 12 px, так что правило только увеличивает. Заголовок
   первой группы меню «Медиафабрики» (13 px) в список нарочно не входит. */
@media (max-width: 560px) {
  .nav-badge, .rail-collapsed .nav-item > span.nav-badge:not([hidden]), .rp-bell-badge,
  .profile-caret, .rp-topbar .profile-caret,
  .eyebrow, .module-header .eyebrow, .section-title .eyebrow,
  .cs-note, .agent-cabchip, .agent-cabfactk, .agent-cabbtn,
  .voice-headpill, .voice-footlink, .voice-footsep,
  .media-safety-note, .pay-chip, .pay-kpi-hint, .mf-state-chip,
  .media-workspace-nav .mw-nav-group:not(:first-child) .mw-nav-label,
  .pk-score-ic, .status-pill, .status-badge, .data-source-badge,
  .boro-root .boro-bubble strong,
  th { font-size: 12px !important; }
  /* Кнопки кабинета агента и «назад» — 30 px в высоту, под мышь. */
  .agent-cabbtn, .agent-back-button, .set13-lensbtn, .pk-inbox-btn { min-height: 36px; }
  /* Кнопки-ссылки, чипы и заголовки-сортировки, которые на телефоне были
     14–26 px в высоту: «Почему…» в уведомлениях и аналитике, часы в базе
     знаний, фильтры аналитики, сортировка списка CRM (на столе заголовок
     нарочно низкий — pack-design.css, .crm-listv; на телефоне его нажимают
     пальцем), «+» дня в календаре медиа, кнопки «Академии». */
  .an-link, .an-retry, .kb-hours-chip, .an-chip, .link-button { min-height: 32px; }
  .link-button { min-width: 32px; }
  .crm-listv .crm-list th > button, .crm-list th > button { min-height: 32px; }
  .uip-mcal-add { min-width: 32px; min-height: 32px; }
  .academy-page .btn { display: inline-flex; align-items: center; min-height: 36px; }
  .tsk-table .tsk-check { width: 32px; height: 32px; }
}

/* ПАЛЕЦ, ВТОРОЙ ЗАМЕР (24 сентября 2026, 375×812, все маршруты после первого
   прохода). Что ещё оставалось меньше 32 px — и почему именно это. */
@media (max-width: 560px) {
  /* (Фильтры «Возврата лидов» и вкладки «Маркетинга» — .module-tabs button —
     поправлены в redesign.css, рядом с остальными 42 px под палец.) */
  /* «CRM ›» над заголовком «Возврата» и «Встреч» — кнопка 28×20 (на столе ей
     нарочно снят минимум: pack-design.css, «THE CRUMB PARENT IS TEXT…»). */
  .app-shell .pk-header .pk-crumb-sec, .pk-crumb-sec { display: inline-flex; align-items: center; justify-content: center; min-height: 32px; min-width: 32px; }
  /* Строка списка CRM открывает карточку нажатием на всю строку: на столе она
     28 px (плотная таблица — pack-design.css), на телефоне — 40. */
  .crm-listv .crm-list td { height: 40px; }
  /* «Новый звонок» и «Импорт контактов» на «Голосе» — 28 px; «Открыть
     задачи» в «Отчётах» — 30. */
  .voice-quickitem, .ac15-link { min-height: 36px; }
  /* «×» у менеджера в инструкции агента и «▶» прослушать голос — 30 px в
     ширину. */
  .managers-remove { width: 36px; height: 36px; }
  .agent-voice-preview { width: 36px; }
  /* Поля «Счёт из сделки» в «Бухгалтерии» — 27 px в высоту при шрифте 16 px
     (он на телефоне у всех полей — иначе iOS увеличивает страницу). */
  .zf-input { min-height: 36px; }
  /* «Условия использования» и «Политика конфиденциальности» в настройках —
     ссылки в 17 px высотой. */
  .suplegal-legallink { display: inline-flex; align-items: center; min-height: 32px; }
  /* Открытые меню и окна (замер нажатием, 375×812): «Воронка / Список» под
     «⋯» CRM — 24 px, стрелки «‹ ›» по колонкам — 28×28, «×» окна «Новый
     лид» — 24 px в ширину. */
  .pk-bar .pk-ctl-view .pk-seg-btn { height: 36px; }
  .pk-nav-btn { width: 36px; height: 36px; }
  .kb-close { min-width: 40px; }
  .kb-panel-lead .kb-close { width: 36px; height: 36px; min-height: 36px; }
  /* Меню профиля: язык EN · RU · AR — 31 px, кружки цвета Boro — 18 px в
     ширину; «Звук» в уведомлениях — галочка 15 px в строке 30 px. */
  .profile-language button { min-height: 36px; }
  .profile-boro-swatch { width: 32px; height: 32px; min-height: 32px; }
  .rp-bell-sound { min-height: 36px; }
  .rp-bell-sound input { inline-size: 20px; block-size: 20px; }
}

/* ШРИФТ, ВТОРОЙ ЗАМЕР (24 сентября 2026, 375×812, все маршруты). Тот же пол в
   12 px, что и выше, — для подписей, которые первый список не назвал: итоги и
   подписи «Обзора», карточки лида на доске, строки списка CRM, счётчики
   вкладок, состояния каналов и интеграций, подписи «Голоса», «Бухгалтерии»,
   AI-совета, Медиафабрики, тарифов и команды. Только классы, которые замер
   нашёл меньше 12 px; одиночные значки (▾ ● ! ›), буквы в кружках-аватарах и
   буквы под цифрами набора номера в список нарочно не входят — это рисунок,
   а не текст. Не входят и экраны, которые правит другой проход (карточка
   лида, «Диалоги»): их замер — в docs/MOBILE_AUDIT_2026-09-24.md. */
@media (max-width: 560px) {
  .ov-today-title, .ov-today-sub, .rp-kpi-scope, .xo-chip, .rp-funnel-name, .rp-funnel-share, .rp-card-note,
  .approvals-channel,
  .pk-chat-mark, .pk-lead-cf-k, .pk-lead-cf-v, .pk-lead-cf-sep, .pk-lead-age, .pk-score-n, .pk-score-w, .pk-col-conv,
  .crm-list-tasks, .crm-list-stage, .crm-prio, .crm-listv-sumlabel, .crm-listv-range, .crm-listv-page,
  .business-source, .tsk-count, .crm-bar-count, .meet-rel,
  .voice-quickitem, .voice-cardstate, .voice-livesub, .voice-cardsub, .voice-qaword, .voice-notice-state, .local-label,
  .voice-footer, .voice-footer strong, .chat-statusbar,
  .acc-tab-badge, .metric-delta,
  .status-chip, .source-note,
  .aib-fig-hint, .aib-join, .aib-badge, .aib-stage-hint,
  .plib-chip, .pc-lbl, .agent-sugg-title, .plan-card__note, .plan-card__eyebrow, .agent-mic-hint,
  .managers-field-hint, .managers-channel-note, .managers-field-label, .bc-hint, .chx-note, .ch-badge, .ch-count, .kb-hours-chip,
  .mf10-empty, .mf10-note, .mf10-matkind, .mf10-mattitle, .mf10-tag, .mf-pulse-chip, .media-channel-status,
  .mf-cal-wd, .uip-mcal-todaylbl, .mf-card-kind, .mf-card-state,
  .mk-cardtag, .mk-desk-sub,
  .ac15-link, .ac15-tableempty,
  .an-tile-label, .an-weeklabel, .an-weekn,
  .suplegal-legallink, .idesk-shelf-count, .idesk-soon-count, .idesk-state,
  .team-chip, .team-locked, .team-org-count, .team-org-role,
  .plat-chip, .plat-method, .help-center-section-count,
  /* Подписи без своего класса — по родителю (замер по всем маршрутам). */
  .rp-kpi-sub, .rp-card-head p, .rp-row-sub, .rp-row-side, .rp-risk-deal-name, .rp-risk-deal-idle, .rp-risk-deal-value,
  .xo-csub, .rp-legend-name, .rp-legend-pct, .rp-legend-num, .rp-statcell > span, .rp-statcell > small,
  .pk-col-more > span, .tsk-ai, .tsk-ai > span, .voice-wave > span,
  .agent-cabcopy > p, .ac15-chart > span, .ac15-chart > em, .cs-brand-hint > span,
  .setup-progress-step > span, .setup-readiness-score > small, .pk-card-foot > small, .setup-status-row > small,
  .setup-agent-choice small, .draft-field > small,
  .workspace-session-strip small, .workspace-live-readiness-head small, .workspace-launch-list > button > small, .workspace-live-checks > button > small,
  .ops-flow-eyebrow > strong, .sw-meta > li, .org-person-txt > small,
  .suplegal-copy > strong, .suplegal-copy > span, .team-head > strong, .rp-bell-stats-title, .rp-viewmode-label,
  .boro-root .boro-panel .boro-msg-role, .boro-root .boro-panel .boro-sessions-toggle { font-size: 12px !important; }
  /* Буквы под цифрами набора (ABC, DEF…) — 8 px: рисунок клавиши, но не
     настолько мелкий. */
  .voice-key-s { font-size: 10px; }
}

/* СТРОКА С КНОПКОЙ НЕ СЖИМАЕТ КНОПКУ (24 сентября 2026, замер 375/390). У
   кнопок в этом продукте overflow: hidden, поэтому в строке-flex они
   сжимаются уже своей подписи, и текст вылезал за рамку: «Открыть» в
   «Зарплатах» (39 px из 45), «Подключить Telegram» в оповещениях команды
   (44 из 87), «Открыть тариф» на баннере Медиафабрики (46 из 68); на
   планшете (768) — те же две последние. На узком экране такая строка
   переносится: кнопка встаёт под текстом целиком. */
@media (max-width: 980px) {
  .pay-row, .tn-row, .media-cs-banner { flex-wrap: wrap; }
  .pay-row > button, .tn-row > button, .media-cs-banner > button { flex: none; }
}
/* «+ Запланировать» в клетке календаря не помещается: 43 px на телефоне,
   69 на планшете, а слово — 92. На узком экране в клетке — один «+» (подпись
   остаётся именем кнопки для экранного диктора). 900 px — порог, с которого
   календарь уже прячет в клетке текст и время поста (ui-polish.css выше). */
@media (max-width: 900px) {
  .uip-mcal-add { font-size: 0; }
  .uip-mcal-add::before { content: "+"; font-size: 18px; font-weight: 700; line-height: 1; }
}

/* МЕНЮ МЕДИАФАБРИКИ НА ТЕЛЕФОНЕ — ПОЛОСОЙ, А НЕ ПОЛУТОРА ЭКРАНАМИ (24 сентября
   2026). На рабочем столе это колонка слева: значок, название и строка о том,
   что будет по нажатию (владелец, 13.09: «надо описание дать»). На телефоне
   та же колонка вставала над экраном: 1241 px меню — и «Календарь» начинался
   на 1979-м пикселе, после полутора экранов пролистывания, на КАЖДОМ разделе.
   Здесь — полоса значков с названиями, которая листается вбок; объяснения и
   подписи групп остаются рабочему столу, первая подпись («Медиафабрика»)
   стоит в начале полосы. «Рабочее пространство» (.ws-sections-nav) — уже
   полоса, его не трогаем. */
@media (max-width: 560px) {
  .media-workspace-nav:not(.ws-sections-nav) {
    display: flex !important; flex-wrap: nowrap; align-items: center; gap: 6px;
    max-height: none; overflow-x: auto !important; overflow-y: hidden !important;
    padding: 6px !important;
    overscroll-behavior-x: contain; scrollbar-width: none;
  }
  .media-workspace-nav:not(.ws-sections-nav)::-webkit-scrollbar { display: none; }
  .media-workspace-nav:not(.ws-sections-nav) .mw-nav-group { display: contents; }
  .media-workspace-nav:not(.ws-sections-nav) .mw-nav-group:not(:first-child) .mw-nav-label,
  .media-workspace-nav:not(.ws-sections-nav) .mw-nav-desc { display: none; }
  .media-workspace-nav:not(.ws-sections-nav) .mw-nav-group:first-child .mw-nav-label {
    flex: none; margin: 0 4px; padding: 0 6px; border-bottom: 0; white-space: nowrap;
  }
  .media-workspace-nav:not(.ws-sections-nav) button.mw-nav-item {
    flex: none; width: auto; min-height: 42px;
    grid-template-columns: 26px auto; align-items: center;
    padding: 6px 10px !important;
    white-space: nowrap;
  }
  .media-workspace-nav:not(.ws-sections-nav) .mw-nav-title { flex-wrap: nowrap; }
  /* Раздел, на котором стоишь, — сразу за «Медиафабрикой», а не восьмым за
     краем полосы: страница перерисовывается целиком, и прокрутка полосы к
     нему не пережила бы первой же перерисовки. Остальные — в прежнем
     порядке. */
  .media-workspace-nav:not(.ws-sections-nav) .mw-nav-group:first-child .mw-nav-label { order: -2; }
  .media-workspace-nav:not(.ws-sections-nav) button.mw-nav-item[aria-current="page"] { order: -1; }
  .media-workspace-nav:not(.ws-sections-nav) button.mw-nav-item + button.mw-nav-item { margin-top: 0; }
}

/* ── Полоса «Вышла новая версия» (26.09.2026, src/lib/versionWatch.js) ──────
   Вкладка пережила выкладку: наверху по центру одна полоса и «Обновить».
   Контейнер на всю ширину и без событий мыши — центр без left:50%, поэтому
   в RTL ничего не переворачивается, а всё под полосой остаётся нажимаемым.
   Селекторы от .app-shell: общие правила кнопок кабинета не должны её
   перекрасить (pack-design.css грузится раньше, но бывает сильнее). */
.app-shell > .app-update-bar {
  position: fixed;
  inset-block-start: 10px;
  inset-inline: 0;
  z-index: 58;
  display: flex;
  justify-content: center;
  padding: 0 16px;
  pointer-events: none;
}
.app-shell > .app-update-bar .app-update-bar-pill {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 100%;
  padding-block: 6px;
  padding-inline: 16px 6px;
  background: light-dark(rgba(251, 252, 254, 0.97), rgba(7, 13, 24, 0.96));
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  box-shadow: var(--shadow);
  pointer-events: auto;
}
.app-shell > .app-update-bar .app-update-bar-text {
  color: var(--text-main);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
}
.app-shell > .app-update-bar .app-update-bar-button {
  flex: none;
  min-height: 32px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: var(--primary);
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.app-shell > .app-update-bar .app-update-bar-button:hover { filter: brightness(1.08); }
.app-shell > .app-update-bar .app-update-bar-button:focus-visible { outline: 2px solid var(--accent-cyan); outline-offset: 2px; }
/* На телефоне (до 767 px) сверху стоит .mobile-bar (fixed, z 57, ~65 px):
   полоса встаёт под ним и не закрывает меню. */
@media (max-width: 767px) {
  .app-shell > .app-update-bar { inset-block-start: 72px; padding: 0 12px; }
  .app-shell > .app-update-bar .app-update-bar-text { font-size: 12px; }
}