/* Кентавр — стили экранов подготовки.
   Токены скопированы из ClinTalk Design System (~/virtual-patient-pilot/docs/design-system.md):
   clinical teal — chrome и кнопки, #075985 — ссылки в тексте, cream — фон, slate — границы,
   Inter — интерфейс, системный моноширинный — время/слоты/коды. Свой бренд — позже (спека §6.4).

   Шрифты только свои (client/fonts, Inter под SIL OFL 1.1 — см. fonts/LICENSE.txt): Google Fonts
   отдавал бы IP каждого зрителя третьей стороне (ПДн — только e-mail для входа) и не грузился бы
   офлайн в зале. Файлы полные, Latin + Cyrillic, по одному на начертание; оболочка SW их кэширует. */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url(/fonts/Inter-Regular.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 500; font-display: swap; src: url(/fonts/Inter-Medium.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 600; font-display: swap; src: url(/fonts/Inter-SemiBold.woff2) format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url(/fonts/Inter-Bold.woff2) format("woff2"); }

:root {
  --clinical: #156082;
  --clinical-hover: #0c7ba0;
  --clinical-deep: #0e2841;
  --clinical-soft: #e8f0f5;
  --link: #075985;

  --cream: #fafaf7;
  --surface: #ffffff;
  --surface-2: #f4f6f8;
  --charcoal: #1f2937;
  --charcoal-mute: #6b7280; /* светлее на cream не проходит AA */

  --slate-200: #e2e8f0;
  --slate-300: #cbd5e1;
  --slate-600: #475569;

  --success: #166534;
  --success-bg: #dcfce7;
  --warning: #b45309;
  --warning-bg: #fef3c7;
  --danger: #991b1b;
  --danger-bg: #fee2e2;

  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;
  --r-sm: 4px; --r-md: 6px; --r-lg: 8px; --r-xl: 12px; --r-2xl: 16px; --r-pill: 999px;

  --shadow-xs: 0 1px 2px rgba(31, 41, 55, .04);
  --shadow-sm: 0 1px 3px rgba(31, 41, 55, .07), 0 1px 2px rgba(31, 41, 55, .04);
  --ring-soft: 0 0 0 3px rgba(21, 96, 130, .12);

  --t-fast: 120ms;
  --ease: cubic-bezier(.4, 0, .2, 1);
}

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

body {
  margin: 0;
  background: var(--cream);
  color: var(--charcoal);
  font: 400 16px/1.5 var(--font-sans);
  -webkit-text-size-adjust: 100%;
}

h1, h2, h3, h4 { line-height: 1.2; text-wrap: balance; margin: 0 0 var(--sp-3); }
h1 { font-size: 30px; font-weight: 600; letter-spacing: -.015em; }
h2 { font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
h3 { font-size: 18px; font-weight: 600; }
h4 { font-size: 16px; font-weight: 600; }
p { margin: 0 0 var(--sp-3); text-wrap: pretty; }
a { color: var(--link); }
.mono { font-family: var(--font-mono); letter-spacing: .02em; }
.muted { color: var(--charcoal-mute); }
.overline { font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--charcoal-mute); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

:focus-visible { outline: 2px solid var(--clinical); outline-offset: 2px; }

/* --- каркас --- */
.topbar {
  display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3);
  padding: var(--sp-3) max(var(--sp-4), env(safe-area-inset-left));
  background: var(--surface); border-bottom: 1px solid var(--slate-200);
}
.brand { display: inline-flex; align-items: center; gap: var(--sp-2); min-height: 44px; color: var(--clinical); font-weight: 700; font-size: 18px; text-decoration: none; }
.brand img { border-radius: var(--r-md); }
.topbar-user { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; }
.user { color: var(--charcoal-mute); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.page { max-width: 1040px; margin: 0 auto; padding: var(--sp-5) var(--sp-4) var(--sp-7); }
.page > h2 { margin-top: var(--sp-6); }

.card {
  background: var(--surface); border: 1px solid var(--slate-200); border-radius: var(--r-xl);
  box-shadow: var(--shadow-xs); padding: var(--sp-5); margin-bottom: var(--sp-5);
}
.back { display: inline-flex; align-items: center; gap: var(--sp-1); margin-bottom: var(--sp-4); color: var(--clinical); text-decoration: none; font-weight: 500; min-height: 44px; }
.page-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4); margin-bottom: var(--sp-3); }
.title-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); }
.title-row h1 { margin: 0; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); margin-top: var(--sp-4); }
.page-head .actions { margin-top: 0; }
.row { display: flex; flex-wrap: wrap; gap: var(--sp-4); }
.grow { flex: 1 1 260px; }

/* --- кнопки --- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
  min-height: 44px; padding: 0 var(--sp-4); border-radius: var(--r-lg); border: 1px solid transparent;
  font: 500 15px/1 var(--font-sans); text-decoration: none; cursor: pointer;
  transition: background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.btn:disabled { opacity: .6; cursor: default; }
.btn-primary { background: var(--clinical); color: #fff; }
.btn-primary:hover:not(:disabled) { background: var(--clinical-hover); }
.btn-secondary { background: var(--surface); color: var(--charcoal); border-color: var(--slate-300); }
.btn-secondary:hover:not(:disabled) { border-color: var(--clinical); color: var(--clinical); }
.btn-ghost { background: transparent; color: var(--clinical); }
.btn-ghost:hover:not(:disabled) { background: var(--clinical-soft); }
.btn-pill { border-radius: var(--r-pill); padding: 0 var(--sp-5); }
.btn-sm { padding: 0 var(--sp-3); font-size: 14px; } /* компактнее только внешне: зона касания та же 44 px, что у .btn */
.btn-block { width: 100%; }
.btn-icon {
  display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
  border: 0; border-radius: var(--r-lg); background: transparent; color: var(--charcoal-mute); cursor: pointer;
}
.btn-icon:hover { background: var(--danger-bg); color: var(--danger); }
.icon { flex: none; }
.spin { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .spin { animation: none; } * { transition: none !important; } }

/* --- поля --- */
.field { display: flex; flex-direction: column; gap: var(--sp-1); margin-bottom: var(--sp-3); min-width: 0; }
.field-label { font-size: 14px; font-weight: 500; color: var(--slate-600); }
input[type="text"], input[type="email"], input[type="number"], input[type="datetime-local"], select, textarea {
  width: 100%; min-height: 44px; padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--slate-300); border-radius: var(--r-md); background: var(--surface);
  color: var(--charcoal); font: 400 16px/1.4 var(--font-sans); /* 16px — iOS не зумит поле */
}
textarea { resize: vertical; }
input[type="file"] { font: inherit; font-size: 15px; min-height: 44px; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--clinical); box-shadow: var(--ring-soft); }
input:disabled, select:disabled, textarea:disabled { background: var(--surface-2); color: var(--charcoal); opacity: 1; }

.msg { margin: 0; font-size: 14px; color: var(--slate-600); }
.actions + .msg { margin-top: var(--sp-2); }
.msg:empty { display: none; }
.msg-error { color: var(--danger); }
.msg-ok { color: var(--success); }
.page-banner { max-width: 1040px; margin: var(--sp-4) auto 0; padding: 0 var(--sp-4); }
.notice { background: var(--clinical-soft); color: var(--clinical-deep); border-radius: var(--r-lg); padding: var(--sp-3) var(--sp-4); }

/* --- бейджи и статусы --- */
.badge, .chip {
  display: inline-flex; align-items: center; gap: var(--sp-1); padding: 2px var(--sp-3); border-radius: var(--r-pill);
  font-size: 13px; font-weight: 500; background: var(--surface-2); color: var(--slate-600); white-space: nowrap;
}
.badge-live { background: var(--success-bg); color: var(--success); }
.badge-prepared { background: var(--clinical-soft); color: var(--clinical); }
.chip-done { background: var(--success-bg); color: var(--success); }
.chip-error { background: var(--danger-bg); color: var(--danger); }
.chip-pending { background: var(--clinical-soft); color: var(--clinical); }

/* --- вход и список сессий --- */
.login { max-width: 440px; margin: var(--sp-6) auto; }
.login .btn-block { margin: var(--sp-4) 0 var(--sp-3); }
.sessions { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-3); }
.session-link {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-2) var(--sp-4);
  padding: var(--sp-4) var(--sp-5); min-height: 64px; text-decoration: none; color: var(--charcoal);
  background: var(--surface); border: 1px solid var(--slate-200); border-left: 3px solid var(--clinical);
  border-radius: var(--r-xl); box-shadow: var(--shadow-xs);
}
.session-link:hover { box-shadow: var(--shadow-sm); border-color: var(--slate-300); border-left-color: var(--clinical-hover); }
.session-title { font-weight: 600; font-size: 17px; }
.session-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); font-size: 14px; }

/* --- подготовка --- */
.invite-row { display: flex; gap: var(--sp-2); }
.invite-row input { flex: 1; font-family: var(--font-mono); font-size: 14px; }
.upload { border: 1px dashed var(--slate-300); border-radius: var(--r-lg); padding: 0 var(--sp-4); margin-bottom: var(--sp-5); }
.upload[open] { padding-bottom: var(--sp-4); }
.upload summary {
  display: flex; align-items: center; gap: var(--sp-2); min-height: 48px; cursor: pointer;
  color: var(--clinical); font-weight: 500; list-style: none;
}
.upload summary::-webkit-details-marker { display: none; }

.block { border-top: 1px solid var(--slate-200); padding-top: var(--sp-4); margin-top: var(--sp-4); }
.block:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.block-head { display: grid; grid-template-columns: auto 200px 110px 1fr; align-items: end; gap: var(--sp-3); }
.block-head.moderator-head { grid-template-columns: auto 1fr 1fr; }
.block-num { font-weight: 600; padding-bottom: 22px; white-space: nowrap; }

/* Строка спикера — карточка-сетка на любой ширине: длинные ФИО и регалии не режутся.
   Семантика таблицы остаётся в разметке, поля подписаны aria-label и data-label. */
.speakers, .speakers tbody { display: block; width: 100%; margin: var(--sp-2) 0; }
.speakers thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.speakers tr {
  display: grid; gap: var(--sp-2) var(--sp-3); align-items: start;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 44px;
  grid-template-areas: "name regalia del" "topic notes .";
  border: 1px solid var(--slate-200); border-radius: var(--r-lg); padding: var(--sp-3);
  margin-bottom: var(--sp-3); background: var(--surface);
}
.speakers td { display: block; padding: 0; min-width: 0; }
.speakers td::before { content: attr(data-label); display: block; font-size: 13px; font-weight: 500; color: var(--slate-600); margin-bottom: 2px; }
.speakers td:nth-child(1) { grid-area: name; }
.speakers td:nth-child(2) { grid-area: regalia; }
.speakers td:nth-child(3) { grid-area: topic; }
.speakers td:nth-child(4) { grid-area: notes; }
.speakers td.cell-action { grid-area: del; padding-top: 20px; }
.speakers td.cell-action::before { content: none; }

/* Поле растёт по тексту в любом браузере (field-sizing: content в Safari нет): невидимая копия
   значения (::after из data-value) задаёт высоту ячейки сетки, textarea растягивается на ту же
   ячейку. Отступы, рамка и шрифт копии — как у textarea, иначе строки переносятся по-разному. */
.autogrow { display: grid; }
.autogrow > textarea { grid-area: 1 / 1; resize: none; overflow: hidden; }
.autogrow::after {
  grid-area: 1 / 1; content: attr(data-value) " "; visibility: hidden;
  white-space: pre-wrap; overflow-wrap: break-word;
  padding: var(--sp-2) var(--sp-3); border: 1px solid transparent; font: 400 16px/1.4 var(--font-sans);
}

.packs { list-style: none; margin: var(--sp-4) 0 0; padding: 0; border: 1px solid var(--slate-200); border-radius: var(--r-lg); }
.pack { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); padding: var(--sp-3) var(--sp-4); min-height: 56px; }
.pack + .pack { border-top: 1px solid var(--slate-200); }
.pack-name { flex: 1 1 220px; font-weight: 500; }
.pack-reason { flex-basis: 100%; font-size: 14px; }
.pack-view { margin-top: var(--sp-5); padding: var(--sp-5); background: var(--surface-2); border-radius: var(--r-lg); }
.md { line-height: 1.6; }
.md ul, .md ol { padding-left: var(--sp-5); margin: 0 0 var(--sp-3); }
.md li + li { margin-top: var(--sp-1); }
.md h3, .md h4 { margin-top: var(--sp-5); }
/* Таблица из пакета («кого с кем столкнуть») прокручивается сама — страница на 390 px не едет. */
.md-table { overflow-x: auto; margin: 0 0 var(--sp-3); }
.md table { border-collapse: collapse; width: 100%; font-size: 15px; line-height: 1.45; }
.md th, .md td { border: 1px solid var(--slate-200); padding: var(--sp-2) var(--sp-3); text-align: left; vertical-align: top; min-width: 9em; }
.md th { background: var(--surface); font-weight: 600; }
.sources { margin-top: var(--sp-5); font-size: 14px; }
.sources ol { padding-left: var(--sp-5); }
.sources a { overflow-wrap: anywhere; }

/* --- телефон: таблица спикеров превращается в карточки --- */
@media (max-width: 720px) {
  h1 { font-size: 24px; }
  .card { padding: var(--sp-4); }
  .page { padding-top: var(--sp-4); }
  .page-head .actions, .page-head .actions .btn { width: 100%; }
  .block-head { grid-template-columns: 1fr 110px; }
  .block-num { grid-column: 1 / -1; padding-bottom: 0; }
  .field-topic { grid-column: 1 / -1; }
  .speakers tr { grid-template-columns: minmax(0, 1fr) 44px; grid-template-areas: "name del" "regalia regalia" "topic topic" "notes notes"; }
  .invite-row { flex-direction: column; }
}

/* --- живой экран: тёмная сцена (§6.4) ---
   Те же имена токенов, тёмные значения: компоненты (кнопки, карточки, поля) перекрашиваются сами.
   Фон — clinical-deep «сцены» ClinTalk; сигнальные цвета — светлые версии (на тёмном проходят AA).
   Портрет планшета/телефона — одна колонка; крупный шрифт; движение — только короткое проявление. */
.stage {
  --clinical: #0b6f91; /* заливка кнопок: белый текст на ней ≥ 4.5:1 */
  --clinical-hover: #0c7ba0;
  --clinical-deep: #e0f2fe;
  --clinical-soft: rgba(14, 165, 233, .16);
  --link: #7dd3fc;

  --cream: #0e2841;
  --surface: #13314f;
  --surface-2: #1a3b5c;
  --charcoal: #f1f5f9;
  --charcoal-mute: #a8b8cc;

  --slate-200: #26496b;
  --slate-300: #3a6185;
  --slate-600: #cbd5e1;

  --success: #4ade80;
  --success-bg: rgba(74, 222, 128, .14);
  --warning: #fbbf24;
  --warning-bg: rgba(251, 191, 36, .14);
  --danger: #f87171;
  --danger-bg: rgba(248, 113, 113, .16);

  --shadow-xs: none;
  --shadow-sm: none;
  --ring-soft: 0 0 0 3px rgba(14, 165, 233, .35);
  color-scheme: dark;
}
.stage :focus-visible { outline-color: var(--link); }

.live {
  max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--sp-4);
  padding: max(var(--sp-3), env(safe-area-inset-top)) max(var(--sp-4), env(safe-area-inset-right))
    max(var(--sp-6), env(safe-area-inset-bottom)) max(var(--sp-4), env(safe-area-inset-left));
}
.live-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-4); font-size: 15px; }
.live-bar .back { margin: 0; color: var(--link); } /* clinical на тёмном — для заливки кнопок, тексту не хватает контраста */
.live-title { flex: 1 1 200px; min-width: 0; color: var(--charcoal-mute); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.live-notice { margin-top: var(--sp-6); }
.live-card { margin: 0; }
.live-card h2 { font-size: 22px; }
.live-card h3 { font-size: 16px; color: var(--charcoal-mute); margin: var(--sp-4) 0 var(--sp-2); }
.live-card ul { margin: 0; padding-left: var(--sp-5); font-size: 18px; line-height: 1.45; }
.live-card p { font-size: 18px; line-height: 1.5; }
.live-card blockquote { margin: var(--sp-4) 0; padding-left: var(--sp-4); border-left: 3px solid var(--slate-300); font-size: 18px; font-style: italic; }
.next-speaker { padding: var(--sp-3) var(--sp-4); border-radius: var(--r-lg); background: var(--surface-2); }

/* индикаторы: цвет + текст (не только цвет) */
.indicators { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.indicators .chip { font-size: 17px; padding: var(--sp-1) var(--sp-3); } /* ≥ 17 px: читается с пюпитра */
.dot { width: 10px; height: 10px; border-radius: 50%; background: currentColor; }
.chip-ok { background: var(--success-bg); color: var(--success); }
.chip-warn { background: var(--warning-bg); color: var(--warning); }
.chip-muted { background: var(--surface-2); color: var(--charcoal-mute); }

/* запись звука на устройстве-источнике; обрыв записи — крупно и красным: заметно с пюпитра */
.capture { display: grid; gap: var(--sp-3); justify-items: start; }
.live-card.capture p { margin: 0; }
.capture:has(.capture-alert) { border-color: var(--danger); background: var(--danger-bg); }
.live-card.capture .capture-alert { font-size: clamp(26px, 4.4vw, 40px); font-weight: 600; line-height: 1.2; color: var(--danger); }
.capture-line { display: flex; align-items: center; gap: var(--sp-2); }
.capture-ok { color: var(--success); }
.capture-reconnecting { color: var(--warning); }

/* сверху: кто говорит и таймеры */
.speaker-name { font-size: clamp(24px, 3.6vw, 34px); font-weight: 600; line-height: 1.2; margin: 0 0 var(--sp-1); }
.speaker-meta { font-size: 17px; color: var(--charcoal-mute); margin: 0 0 var(--sp-1); }
.speaker-topic { font-size: 17px; margin: 0; }
.timers { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-3) var(--sp-6); }
.timer { display: grid; gap: 2px; }
.timer-value { font-size: clamp(40px, 7vw, 60px); font-weight: 600; line-height: 1; }
.timer-small .timer-value { font-size: clamp(26px, 4vw, 36px); }
.timer-label { font-size: 15px; font-weight: 500; }
.timer-ok { color: var(--success); }
.timer-warn { color: var(--warning); }
.timer-over { color: var(--danger); }
.timer .overline { color: var(--charcoal-mute); }
.timer-forecast { flex-basis: 100%; margin: 0; font-size: 15px; }

/* панель: полоски времени говорения */
.balance { list-style: none; margin: var(--sp-3) 0 0; padding: 0; display: grid; gap: var(--sp-2); }
.balance li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-1) var(--sp-3); font-size: 17px; }
.balance-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.balance-bar { grid-column: 1 / -1; height: 8px; border-radius: var(--r-pill); background: var(--surface-2); overflow: hidden; }
.balance-bar > span { display: block; height: 100%; background: var(--link); }

/* центр: одна реплика крупно (на iPad в портрете ≥ 32 px) */
.hooks { display: flex; flex-direction: column; gap: var(--sp-2); }
.hook-card {
  display: block; width: 100%; min-height: 30vh; margin: 0; padding: var(--sp-5) var(--sp-5) var(--sp-6);
  background: var(--surface); color: var(--charcoal); border: 1px solid var(--slate-200); border-radius: var(--r-2xl);
  font: 500 clamp(28px, 4.6vw, 46px)/1.3 var(--font-sans); text-align: left; text-wrap: pretty;
  touch-action: pan-y; user-select: none; -webkit-user-select: none; cursor: pointer;
}
div.hook-card { cursor: default; }
.hook-text { margin: 0; font: inherit; }
.hook-author { margin-bottom: var(--sp-3); font-size: 14px; background: var(--clinical-soft); color: var(--link); }
.hooks-empty { margin: 0; padding: var(--sp-6) 0; text-align: center; color: var(--charcoal-mute); font-size: 18px; }
.hook-nav { display: flex; align-items: center; justify-content: center; gap: var(--sp-4); }
.hook-nav .btn-icon { width: 56px; height: 56px; color: var(--charcoal); }
.hook-nav .btn-icon:hover:not(:disabled) { background: var(--surface-2); color: var(--charcoal); }
.hook-nav .btn-icon:disabled { opacity: .35; cursor: default; }
.hook-count { min-width: 5ch; text-align: center; color: var(--charcoal-mute); font-size: 16px; }
.fade-in { animation: fade-in 180ms var(--ease); }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .fade-in { animation: none; } }

/* ассистент: крупные кнопки «кто говорит» и лента */
.speaker-buttons { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: var(--sp-3); }
.speaker-btn { min-height: 64px; font-size: 18px; line-height: 1.25; padding: var(--sp-2) var(--sp-4); white-space: normal; text-align: center; }
/* hover светлого экрана красит текст в clinical — на тёмном его не прочесть; на iPad hover ещё и «залипает» после касания */
.stage .btn-secondary:hover:not(:disabled) { color: var(--charcoal); border-color: var(--link); }
.stage .btn[aria-pressed="true"] { background: var(--clinical-soft); border-color: var(--link); color: var(--charcoal); }
.transcript { list-style: none; margin: 0; padding: 0; max-height: 50vh; overflow-y: auto; display: grid; gap: var(--sp-3); font-size: 17px; line-height: 1.45; }
.transcript .badge { margin-right: var(--sp-2); font-size: 12px; }
/* фраза с голосом — кнопка: ассистент выбирает её, затем — кто её сказал; без голоса — тот же отступ */
.transcript-row, .transcript-line { display: block; padding: var(--sp-2) var(--sp-3); border: 1px solid transparent; }
.transcript-row {
  width: 100%; min-height: 44px; margin: 0; border-radius: var(--r-lg); background: none; color: inherit;
  font: inherit; text-align: left; cursor: pointer;
}
.transcript-row:hover { border-color: var(--slate-200); }
.transcript-row[aria-pressed="true"] { background: var(--clinical-soft); border-color: var(--link); color: var(--charcoal); }
.conf-confirmed { background: var(--success-bg); color: var(--success); }
.conf-probable { background: var(--warning-bg); color: var(--warning); }
.conf-unknown { background: var(--surface-2); color: var(--charcoal-mute); }

/* конец сессии (модератор): внизу, отдельно от сценической части — случайно не задеть */
.live-end { margin-top: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid var(--slate-200); display: grid; gap: var(--sp-2); justify-items: start; }

/* экран после сессии (§6.4, экран 4): черновик поста, итоги, расшифровка */
.post-editor { min-height: 40vh; font-size: 17px; line-height: 1.5; }
.post-summaries { margin: 0; padding-left: var(--sp-5); display: grid; gap: var(--sp-4); }
.post-summaries h3 { margin: 0 0 var(--sp-1); }
.post-transcript summary { display: flex; align-items: center; min-height: 48px; cursor: pointer; font-size: 20px; font-weight: 600; }
.post-transcript[open] summary { margin-bottom: var(--sp-3); }