/* ============================================================================
   ИДЕАЛИСТ · единая дизайн-система оболочки
   ----------------------------------------------------------------------------
   Основа — система Linear (плотная тёмная холст-панель, лестница поверхностей,
   волосяные границы, отсутствие теней и градиентов). Единственная замена:
   лавандовый акцент заменён на фирменный терракотовый «Идеалиста».
   Второй хроматический акцент не вводим — это правило системы.

   Файл ОДИН на всю систему: /home/deploy/shared/idealist_ui.css
   Отдаётся по адресу /ui.css. Его подключают портал, дашборды и рой.
   Правим только здесь.

   Что НЕ трогаем: внутренности самих дашбордов. Их вёрстка живёт своей
   жизнью, у неё свои цвета и своя сетка — сюда она не заглядывает.
   ========================================================================= */

/* ── Токены ─────────────────────────────────────────────────────────────── */
:root {
  /* Холст и лестница поверхностей. Чистый #000 не используем: он «проваливает»
     границы и делает интерфейс плоским. */
  --canvas:      #0A0908;
  --surface-1:   #121110;
  --surface-2:   #171614;
  --surface-3:   #1C1A18;
  --surface-4:   #201E1B;

  --hairline:        #26231F;
  --hairline-strong: #37322C;
  --hairline-third:  #453E36;

  /* Текст */
  --ink:          #F7F6F4;
  --ink-muted:    #D6D1C9;
  --ink-subtle:   #8E877D;
  --ink-tertiary: #635D55;

  /* Акцент — фирменный терракотовый. Используется скупо:
     логотип, активный пункт меню, главная кнопка, фокус. */
  --accent:        #DB5A2C;
  --accent-hover:  #F0703F;
  --accent-press:  #BE4A20;
  --accent-soft:   rgba(219, 90, 44, 0.12);
  --accent-ring:   rgba(219, 90, 44, 0.45);

  /* Семантика — единственные цветные исключения */
  --success: #3FA05A;
  --warning: #D2A03C;
  --danger:  #C7513F;

  /* Скругления */
  --r-xs: 4px;  --r-sm: 6px;  --r-md: 8px;
  --r-lg: 12px; --r-xl: 16px; --r-pill: 9999px;

  /* Шаг сетки — 4px */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px;
  --s-6: 24px; --s-8: 32px; --s-12: 48px; --s-24: 96px;

  --nav-h: 56px;
  --content: 1280px;

  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Display',
          'Segoe UI', Roboto, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}


/* ── Светлая тема ───────────────────────────────────────────────────────────
   Те же роли, другие значения. Компоненты об этом не знают: они читают
   переменные, а не цвета. */
[data-theme="light"] {
  --canvas:    #FAF9F7;
  --surface-1: #FFFFFF;
  --surface-2: #F5F3F0;
  --surface-3: #EEEBE7;
  --surface-4: #E7E3DE;

  --hairline:        #E4E0DA;
  --hairline-strong: #D2CCC4;
  --hairline-third:  #BDB6AC;

  --ink:          #181716;
  --ink-muted:    #45413C;
  --ink-subtle:   #6D675F;
  --ink-tertiary: #969087;

  --accent-soft: rgba(219, 90, 44, 0.10);
}
[data-theme="light"] .idl-nav { background: rgba(250, 249, 247, .88); }
[data-theme="light"] .idl-card::before { background: none; }

/* ── База ───────────────────────────────────────────────────────────────── */
.idl,
body.idl {
  background: var(--canvas);
  color: var(--ink);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.05px;
  -webkit-font-smoothing: antialiased;
  margin: 0;
}

.idl *,
.idl *::before,
.idl *::after { box-sizing: border-box; }

.idl ::selection { background: var(--accent-soft); color: var(--ink); }

.idl-wrap {
  max-width: var(--content);
  margin: 0 auto;
  padding: var(--s-8) var(--s-6) var(--s-24);
}

/* ── Типографика ────────────────────────────────────────────────────────── */
.idl h1, .idl-h1 {
  font-size: 40px; font-weight: 600; line-height: 1.15;
  letter-spacing: -1px; margin: 0 0 var(--s-2);
}
.idl h2, .idl-h2 {
  font-size: 28px; font-weight: 600; line-height: 1.2;
  letter-spacing: -0.6px; margin: 0 0 var(--s-3);
}
.idl h3, .idl-h3 {
  font-size: 22px; font-weight: 500; line-height: 1.25;
  letter-spacing: -0.4px; margin: 0 0 var(--s-2);
}
.idl-lead   { font-size: 18px; color: var(--ink-subtle); letter-spacing: -0.1px; margin: 0; }
.idl-sm     { font-size: 14px; }
.idl-caption{ font-size: 12px; line-height: 1.4; color: var(--ink-subtle); }
.idl-mono   { font-family: var(--mono); font-size: 13px; }

/* Надзаголовок раздела: единственное место с положительным трекингом —
   так глаз отличает таксономию от заголовка. */
.idl-eyebrow {
  font-size: 13px; font-weight: 500; line-height: 1.3;
  letter-spacing: 0.4px; text-transform: uppercase;
  color: var(--ink-subtle);
  margin: var(--s-8) 0 var(--s-3);
}
.idl-eyebrow:first-child { margin-top: 0; }

/* ── Меню ───────────────────────────────────────────────────────────────── */
.idl-nav {
  position: sticky; top: 0; z-index: 900;
  height: var(--nav-h);
  background: rgba(10, 9, 8, 0.86);
  backdrop-filter: saturate(140%) blur(12px);
  border-bottom: 1px solid var(--hairline);
}
.idl-nav-in {
  max-width: var(--content); margin: 0 auto; height: 100%;
  padding: 0 var(--s-6);
  display: flex; align-items: center; gap: var(--s-2);
}
.idl-brand {
  display: inline-flex; align-items: center; gap: 9px;
  color: var(--ink); text-decoration: none;
  font-size: 15px; font-weight: 600; letter-spacing: -0.3px;
  margin-right: var(--s-4); flex: 0 0 auto;
}
.idl-brand-mark {
  width: 22px; height: 22px; border-radius: var(--r-sm);
  background: var(--accent);
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: 12px; font-weight: 700;
}
.idl-nav-links { display: flex; align-items: center; gap: 2px; overflow-x: auto; }
.idl-nav-links::-webkit-scrollbar { display: none; }

.idl-tab {
  display: inline-flex; align-items: center; gap: 7px;
  height: 34px; padding: 0 12px; border-radius: var(--r-md);
  color: var(--ink-subtle); text-decoration: none;
  font-size: 14px; font-weight: 500; white-space: nowrap;
  border: 1px solid transparent;
  transition: background .14s ease, color .14s ease, border-color .14s ease;
}
.idl-tab:hover { color: var(--ink); background: var(--surface-2); }
.idl-tab--on {
  color: var(--ink); background: var(--surface-2);
  border-color: var(--hairline-strong);
}
.idl-tab--on .idl-tab-dot { background: var(--accent); }
.idl-tab-dot {
  width: 5px; height: 5px; border-radius: var(--r-pill);
  background: var(--ink-tertiary); flex: 0 0 auto;
}
.idl-nav-right {
  margin-left: auto; display: flex; align-items: center; gap: var(--s-2);
  flex: 0 0 auto;
}
.idl-who {
  font-size: 13px; color: var(--ink-tertiary); white-space: nowrap;
  max-width: 260px; overflow: hidden; text-overflow: ellipsis;
}


/* ── Переключатель темы ─────────────────────────────────────────────────── */
.idl-theme {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; flex: 0 0 auto;
  border-radius: var(--r-md); border: 1px solid var(--hairline);
  background: var(--surface-1); color: var(--ink-subtle);
  cursor: pointer; font-size: 15px; line-height: 1; padding: 0;
  transition: background .14s ease, color .14s ease, border-color .14s ease;
}
.idl-theme:hover { background: var(--surface-2); color: var(--ink); border-color: var(--hairline-strong); }
.idl-theme:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: 2px; }
.idl-theme .idl-ico-dark  { display: none; }
[data-theme="light"] .idl-theme .idl-ico-dark  { display: inline; }
[data-theme="light"] .idl-theme .idl-ico-light { display: none; }

/* ── Кнопки ─────────────────────────────────────────────────────────────── */
.idl-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  min-height: 34px; padding: 8px 14px;
  border-radius: var(--r-md); border: 1px solid transparent;
  font-family: var(--font); font-size: 14px; font-weight: 500; line-height: 1.2;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background .14s ease, border-color .14s ease, color .14s ease;
}
.idl-btn--primary { background: var(--accent); color: #fff; }
.idl-btn--primary:hover  { background: var(--accent-hover); }
.idl-btn--primary:active { background: var(--accent-press); }
.idl-btn--secondary {
  background: var(--surface-1); color: var(--ink); border-color: var(--hairline);
}
.idl-btn--secondary:hover { background: var(--surface-2); border-color: var(--hairline-strong); }
.idl-btn--ghost { background: transparent; color: var(--ink-subtle); }
.idl-btn--ghost:hover { color: var(--ink); background: var(--surface-1); }
.idl-btn--danger { background: transparent; color: var(--danger); border-color: var(--hairline); }
.idl-btn--danger:hover { background: rgba(199, 81, 63, .1); border-color: var(--danger); }
.idl-btn:focus-visible { outline: 2px solid var(--accent-ring); outline-offset: 2px; }

/* ── Карточки ───────────────────────────────────────────────────────────── */
.idl-grid {
  display: grid; gap: var(--s-3);
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.idl-grid--2 { grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); }

.idl-card {
  position: relative; display: block;
  background: var(--surface-1);
  border: 1px solid var(--hairline);
  border-radius: var(--r-lg);
  padding: var(--s-4) var(--s-4);
  color: var(--ink); text-decoration: none;
  transition: background .14s ease, border-color .14s ease;
}
/* Тонкая светлая грань сверху — от неё тёмная панель перестаёт быть «дырой» */
.idl-card::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px;
  border-radius: var(--r-lg) var(--r-lg) 0 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.06) 30%,
              rgba(255,255,255,.06) 70%, transparent);
}
a.idl-card:hover { background: var(--surface-2); border-color: var(--hairline-strong); }

.idl-card-row { display: flex; align-items: center; gap: var(--s-3); }
.idl-card-num {
  flex: 0 0 auto; width: 24px; height: 24px; border-radius: var(--r-sm);
  background: var(--surface-3); color: var(--ink-subtle);
  font-size: 12px; font-weight: 600;
  display: inline-flex; align-items: center; justify-content: center;
}
a.idl-card:hover .idl-card-num { background: var(--accent-soft); color: var(--accent); }
.idl-card-ico {
  flex: 0 0 auto; width: 34px; height: 34px; border-radius: var(--r-md);
  background: var(--surface-3); border: 1px solid var(--hairline);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 16px;
}
.idl-card-body { min-width: 0; flex: 1 1 auto; }
.idl-card-title {
  font-size: 15px; font-weight: 500; letter-spacing: -0.2px; color: var(--ink);
}
.idl-card-sub {
  font-size: 13px; color: var(--ink-subtle); margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.idl-card-go {
  flex: 0 0 auto; color: var(--ink-tertiary); font-size: 16px;
  transition: color .14s ease, transform .14s ease;
}
a.idl-card:hover .idl-card-go { color: var(--accent); transform: translateX(2px); }

/* ── Панели, плашки, таблицы ────────────────────────────────────────────── */
.idl-panel {
  background: var(--surface-1); border: 1px solid var(--hairline);
  border-radius: var(--r-lg); overflow: hidden;
}
.idl-panel-head {
  padding: var(--s-4) var(--s-4); border-bottom: 1px solid var(--hairline);
  display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s-4);
}
.idl-panel-body { padding: var(--s-4); }
.idl-row {
  display: flex; align-items: center; gap: var(--s-3);
  padding: var(--s-3) var(--s-4); border-top: 1px solid var(--hairline);
}
.idl-row:first-child { border-top: none; }
.idl-row:hover { background: var(--surface-2); }
.idl-group-head {
  padding: var(--s-2) var(--s-4);
  background: var(--surface-2);
  border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline);
  font-size: 11px; font-weight: 600; letter-spacing: .6px; text-transform: uppercase;
  color: var(--ink-subtle);
}

.idl-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 2px 8px; border-radius: var(--r-pill);
  font-size: 12px; line-height: 1.4;
  background: var(--surface-3); color: var(--ink-muted);
  border: 1px solid var(--hairline);
}
.idl-badge--on     { color: var(--success); border-color: rgba(63,160,90,.35); background: rgba(63,160,90,.1); }
.idl-badge--off    { color: var(--ink-tertiary); }
.idl-badge--locked { color: var(--warning); border-color: rgba(210,160,60,.3); background: rgba(210,160,60,.08); }

.idl-note {
  border: 1px solid var(--hairline); border-left: 2px solid var(--accent);
  background: var(--surface-1); border-radius: var(--r-md);
  padding: var(--s-3) var(--s-4); font-size: 14px; color: var(--ink-muted);
}
.idl-note--warn { border-left-color: var(--warning); }
.idl-note--ok   { border-left-color: var(--success); }

/* ── Формы ──────────────────────────────────────────────────────────────── */
.idl-input, .idl-select {
  width: 100%; background: var(--surface-1); color: var(--ink);
  border: 1px solid var(--hairline); border-radius: var(--r-md);
  padding: 8px 12px; font-family: var(--font); font-size: 14px;
}
.idl-input:focus, .idl-select:focus {
  outline: 2px solid var(--accent-ring); outline-offset: 0; border-color: var(--hairline-strong);
}
.idl-check { width: 16px; height: 16px; accent-color: var(--accent); cursor: pointer; }

/* ── Пустое состояние и отказ ───────────────────────────────────────────── */
.idl-empty {
  border: 1px dashed var(--hairline-strong); border-radius: var(--r-lg);
  padding: var(--s-12) var(--s-6); text-align: center; color: var(--ink-subtle);
}
.idl-empty-title { color: var(--ink); font-size: 18px; font-weight: 500; margin: var(--s-3) 0 var(--s-1); }

/* ── Адаптив ────────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .idl-wrap { padding: var(--s-6) var(--s-4) var(--s-12); }
  .idl h1, .idl-h1 { font-size: 30px; letter-spacing: -0.7px; }
  .idl-who { display: none; }
  .idl-grid { grid-template-columns: 1fr; }
  .idl-grid--2 { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .idl-nav-in { padding: 0 var(--s-3); }
  .idl-brand span:last-child { display: none; }
  .idl-tab { padding: 0 10px; }
}

/* ============================================================================
   Мост для страниц портала на Tailwind.
   ----------------------------------------------------------------------------
   Шаблоны портала свёрстаны утилитами светлой темы. Переписывать их все —
   это часы работы и риск задеть логику форм. Вместо этого переопределяем
   тот небольшой словарь классов, который в них реально используется.
   Разметка не меняется — меняется только палитра.
   ========================================================================= */
[data-theme="dark"] body.idl-portal { background: var(--canvas); color: var(--ink); font-family: var(--font); }

[data-theme="dark"] body.idl-portal .bg-white,
[data-theme="dark"] body.idl-portal .bg-zinc-50   { background-color: var(--surface-1) !important; }
[data-theme="dark"] body.idl-portal .bg-zinc-100  { background-color: var(--surface-3) !important; }
[data-theme="dark"] body.idl-portal .bg-zinc-900  { background-color: var(--accent) !important; }
[data-theme="dark"] body.idl-portal .hover\:bg-zinc-50:hover  { background-color: var(--surface-2) !important; }
[data-theme="dark"] body.idl-portal .hover\:bg-zinc-100:hover { background-color: var(--surface-3) !important; }
[data-theme="dark"] body.idl-portal .hover\:bg-zinc-800:hover { background-color: var(--accent-hover) !important; }

[data-theme="dark"] body.idl-portal .text-zinc-900 { color: var(--ink) !important; }
[data-theme="dark"] body.idl-portal .text-zinc-800 { color: var(--ink) !important; }
[data-theme="dark"] body.idl-portal .text-zinc-700 { color: var(--ink-muted) !important; }
[data-theme="dark"] body.idl-portal .text-zinc-600 { color: var(--ink-subtle) !important; }
[data-theme="dark"] body.idl-portal .text-zinc-500 { color: var(--ink-subtle) !important; }
[data-theme="dark"] body.idl-portal .text-zinc-400 { color: var(--ink-tertiary) !important; }
[data-theme="dark"] body.idl-portal .text-white    { color: #fff !important; }
[data-theme="dark"] body.idl-portal .hover\:text-zinc-900:hover { color: var(--ink) !important; }

[data-theme="dark"] body.idl-portal .border-zinc-200,
[data-theme="dark"] body.idl-portal .border-zinc-300,
[data-theme="dark"] body.idl-portal .border-zinc-100 { border-color: var(--hairline) !important; }
[data-theme="dark"] body.idl-portal .divide-zinc-100 > * + * { border-color: var(--hairline) !important; }
[data-theme="dark"] body.idl-portal .hover\:border-zinc-300:hover { border-color: var(--hairline-strong) !important; }

/* Цветные плашки состояний — приглушаем под тёмный холст */
[data-theme="dark"] body.idl-portal .bg-green-50  { background-color: rgba(63,160,90,.10) !important; }
[data-theme="dark"] body.idl-portal .bg-green-100 { background-color: rgba(63,160,90,.16) !important; }
[data-theme="dark"] body.idl-portal .border-green-200 { border-color: rgba(63,160,90,.35) !important; }
[data-theme="dark"] body.idl-portal .text-green-800, [data-theme="dark"] body.idl-portal .text-green-700,
[data-theme="dark"] body.idl-portal .text-green-600 { color: var(--success) !important; }

[data-theme="dark"] body.idl-portal .bg-amber-50  { background-color: rgba(210,160,60,.10) !important; }
[data-theme="dark"] body.idl-portal .bg-amber-100 { background-color: rgba(210,160,60,.16) !important; }
[data-theme="dark"] body.idl-portal .border-amber-200 { border-color: rgba(210,160,60,.35) !important; }
[data-theme="dark"] body.idl-portal .text-amber-900, [data-theme="dark"] body.idl-portal .text-amber-800,
[data-theme="dark"] body.idl-portal .text-amber-700 { color: var(--warning) !important; }

[data-theme="dark"] body.idl-portal .bg-blue-50  { background-color: var(--accent-soft) !important; }
[data-theme="dark"] body.idl-portal .bg-blue-100 { background-color: var(--accent-soft) !important; }
[data-theme="dark"] body.idl-portal .border-blue-200 { border-color: var(--accent-ring) !important; }
[data-theme="dark"] body.idl-portal .text-blue-800, [data-theme="dark"] body.idl-portal .text-blue-700 { color: var(--accent-hover) !important; }

[data-theme="dark"] body.idl-portal .bg-red-50 { background-color: rgba(199,81,63,.10) !important; }
[data-theme="dark"] body.idl-portal .border-red-200 { border-color: rgba(199,81,63,.35) !important; }
[data-theme="dark"] body.idl-portal .text-red-600 { color: var(--danger) !important; }
[data-theme="dark"] body.idl-portal .hover\:bg-red-50:hover { background-color: rgba(199,81,63,.12) !important; }

[data-theme="dark"] body.idl-portal .bg-violet-100 { background-color: var(--accent-soft) !important; }
[data-theme="dark"] body.idl-portal .text-violet-700, [data-theme="dark"] body.idl-portal .text-violet-600 { color: var(--accent) !important; }

[data-theme="dark"] body.idl-portal .shadow-sm, [data-theme="dark"] body.idl-portal .shadow-md,
[data-theme="dark"] body.idl-portal .hover\:shadow-md:hover { box-shadow: none !important; }

/* Формы. Перечислять типы по одному оказалось ошибкой: у input без
   атрибута type, у date и у number цвет текста оставался тёмным — на тёмном
   фоне поле выглядело пустым. Берём все поля разом. */
[data-theme="dark"] body.idl-portal { color-scheme: dark; }
[data-theme="light"] body.idl-portal { color-scheme: light; }


[data-theme="dark"] body.idl-portal input,
[data-theme="dark"] body.idl-portal select,
[data-theme="dark"] body.idl-portal textarea {
  background-color: var(--surface-2) !important;
  border: 1px solid var(--hairline) !important;
  color: var(--ink) !important;
  caret-color: var(--accent);
}
[data-theme="dark"] body.idl-portal input:focus,
[data-theme="dark"] body.idl-portal select:focus,
[data-theme="dark"] body.idl-portal textarea:focus {
  outline: 2px solid var(--accent-ring) !important;
  outline-offset: 0;
  border-color: var(--hairline-strong) !important;
}
/* Флажки и переключатели рисует система — фон им навязывать нельзя,
   иначе галочка исчезает. */
[data-theme="dark"] body.idl-portal input[type="checkbox"],
[data-theme="dark"] body.idl-portal input[type="radio"] {
  background-color: initial !important;
  border: initial !important;
  accent-color: var(--accent);
  width: 16px; height: 16px;
}
[data-theme="dark"] body.idl-portal input[type="file"] { color: var(--ink-muted) !important; }
[data-theme="dark"] body.idl-portal input[type="range"] { background: transparent !important; border: none !important; }
[data-theme="dark"] body.idl-portal option, [data-theme="dark"] body.idl-portal optgroup {
  background-color: var(--surface-2); color: var(--ink);
}
[data-theme="dark"] body.idl-portal ::placeholder { color: var(--ink-tertiary) !important; opacity: 1; }
/* Иконка календаря у date-полей по умолчанию чёрная */
[data-theme="dark"] body.idl-portal input[type="date"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] body.idl-portal input[type="datetime-local"]::-webkit-calendar-picker-indicator,
[data-theme="dark"] body.idl-portal input[type="time"]::-webkit-calendar-picker-indicator { filter: invert(0.75); }
/* Автозаполнение браузера подставляет свой светлый фон */
[data-theme="dark"] body.idl-portal input:-webkit-autofill,
[data-theme="dark"] body.idl-portal input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--ink);
  -webkit-box-shadow: 0 0 0 1000px var(--surface-2) inset;
}
/* Кнопки инструментов, не размеченные утилитами Tailwind */
[data-theme="dark"] body.idl-portal button:not([class*="bg-"]):not(.idl-btn) {
  background-color: var(--surface-2); color: var(--ink);
  border: 1px solid var(--hairline); border-radius: var(--r-md);
}
[data-theme="dark"] body.idl-portal button:not([class*="bg-"]):not(.idl-btn):hover {
  background-color: var(--surface-3); border-color: var(--hairline-strong);
}

/* ============================================================================
   Чат роя в светлой теме.
   ----------------------------------------------------------------------------
   Вёрстка чата написана своими цветами в <style> страницы. Перекрашиваем её
   через переменные — так чат следует за переключателем темы наравне с меню.
   Правила намеренно привязаны к .idl-chat: у дашбордов этого класса нет,
   их оформление остаётся нетронутым.
   ========================================================================= */
[data-theme="light"] body.idl-chat { background: var(--canvas); color: var(--ink); }
[data-theme="light"] body.idl-chat header,
[data-theme="light"] body.idl-chat footer {
  background: var(--surface-1); border-color: var(--hairline);
}
[data-theme="light"] body.idl-chat header .sub,
[data-theme="light"] body.idl-chat .sys,
[data-theme="light"] body.idl-chat .m th { color: var(--ink-subtle); }
[data-theme="light"] body.idl-chat select,
[data-theme="light"] body.idl-chat textarea,
[data-theme="light"] body.idl-chat #mic,
[data-theme="light"] body.idl-chat #clip {
  background: var(--surface-1); color: var(--ink); border-color: var(--hairline);
}
[data-theme="light"] body.idl-chat .a {
  background: var(--surface-1); border-color: var(--hairline); color: var(--ink);
}
[data-theme="light"] body.idl-chat .act { background: var(--surface-2); }
[data-theme="light"] body.idl-chat .no { background: var(--surface-3); color: var(--ink); }
[data-theme="light"] body.idl-chat .m b,
[data-theme="light"] body.idl-chat .m .h { color: var(--ink); }
[data-theme="light"] body.idl-chat .m hr,
[data-theme="light"] body.idl-chat .m th,
[data-theme="light"] body.idl-chat .m td { border-color: var(--hairline); }
[data-theme="light"] body.idl-chat .m code { background: var(--surface-3); color: var(--ink); }
/* Реплики человека остаются фирменным оранжевым в обеих темах — это акцент. */