[v-cloak] { display: none; }

/* ===== СВЕТЛАЯ ТЕМА — нейморфизм: мягкий серо-бежевый рельеф ===== */
:root {
  --bg: #e4e4e8;            /* фон — база для рельефа */
  --surface: #e9e9ed;       /* карточки — чуть светлее фона */
  --surface-soft: #dedee3;
  --text: #3d3d42;
  --muted: #8a8a92;
  --border: #d3d3da;
  --border-soft: #e0e0e6;
  --input-bg: #e4e4e8;
  --vk-border: #c9a227;
  --mat-border: #2f5b8a;
  --otb-border: #b03a35;
  --vk-bg: #fff2cc;
  --mat-bg: #cfe2f3;
  --otb-bg: #d9534f;
  --vk-variant-bg: #fbf4df;
  --theme-glow: #c9a227;
  --chip-geo: #5b83ad;
  --chip-titr: #b3922e;
  --modal-bg: #e9e9ed;
  --accent: #d1a34b;        /* тёплый золотистый акцент */
  --accent-hover: #c4963f;
  --accent-soft: #f3e7c8;
  --accent-text: #3d3a2e;
  --shadow: 6px 6px 14px rgba(170, 170, 178, 0.45), -6px -6px 14px rgba(255, 255, 255, 0.85);
  --shadow-sm: 3px 3px 8px rgba(170, 170, 178, 0.4), -3px -3px 8px rgba(255, 255, 255, 0.85);
  --shadow-inset: inset 3px 3px 7px rgba(170, 170, 178, 0.45), inset -3px -3px 7px rgba(255, 255, 255, 0.85);
  --radius: 16px;
  --skl-color: #8a7a4e;
  --tc-color: #7a6a4e;
}

/* ===== ТЁМНАЯ ТЕМА — глубокий сине-серый (по образцу) ===== */
[data-theme="dark"] {
  --bg: #1d2027;
  --surface: #262a32;
  --surface-soft: #2e323c;
  --text: #f2f2f4;
  --muted: #838384;
  --border: #3e404b;
  --border-soft: #33363f;
  --vk-bg: #332e1c;
  --vk-border: #a08c4e;
  --mat-bg: #232b33;
  --mat-border: #6f8d80;
  --otb-bg: #3a2622;
  --otb-border: #a97161;
  --theme-glow: #6f6134;
  --chip-geo: #5d7d70;
  --chip-titr: #8a7a42;
  --modal-bg: #262a32;
  --input-bg: #1d2027;
  --shadow: 6px 6px 14px rgba(0, 0, 0, 0.6), -6px -6px 14px rgba(255, 255, 255, 0.04);
  --shadow-sm: 3px 3px 8px rgba(0, 0, 0, 0.55), -3px -3px 8px rgba(255, 255, 255, 0.04);
  --shadow-inset: inset 3px 3px 7px rgba(0, 0, 0, 0.65), inset -3px -3px 7px rgba(255, 255, 255, 0.04);
  --skl-color: #b8a768;
  --tc-color: #b0a374;
}

body {
  font-family: Verdana, Geneva, Tahoma, sans-serif; /* как в оригинальном монтажном листе */
  background: var(--bg);
  color: var(--text);
  line-height: 1.55;
  transition: background 0.25s, color 0.25s;
}

.login-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.login-card {
  width: 100%; max-width: 380px;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
}

/* Шапка выпуска — закреплена при прокрутке, хронометраж всегда виден */
.issue-toolbar {
  position: sticky;
  top: 0;
  z-index: 90;
  background: var(--bg);
  padding: 8px 2px 10px;
  border-bottom: 1px solid var(--border-soft);
  margin-bottom: 12px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

/* Карточки — мягкий рельеф */
.card { background: var(--surface); border: 1px solid var(--border-soft); border-radius: var(--radius); color: var(--text); box-shadow: var(--shadow); }
.block-card {
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border: 1px solid var(--border-soft);
}
/* Блок-дайджест — своё оформление (персиковое) */
.block-card.block-digest {
  background: #fdf3e8;
}
[data-theme="dark"] .block-card.block-digest { background: #2e2519; }
.block-card.block-digest .card-header { background: #f7e3d0; border-bottom: 1px solid #e8cbaa; }
[data-theme="dark"] .block-card.block-digest .card-header { background: #3a2c1c; border-bottom-color: #4a3a26; }
.block-card .card-header { background: var(--surface-soft); border-bottom: 1px solid var(--border-soft); border-radius: var(--radius) var(--radius) 0 0; }
.list-group-item { background: var(--surface); border-color: var(--border-soft); color: var(--text); }
.form-control, .form-select {
  background: var(--input-bg);
  border: none;
  border-radius: 12px;
  box-shadow: var(--shadow-inset);
  color: var(--text);
  font-weight: 600;
  font-size: 1.02rem;
}
.form-control:focus, .form-select:focus {
  background: var(--input-bg);
  color: var(--text);
  border: none;
  box-shadow: var(--shadow-inset), 0 0 0 0.15rem rgba(209, 163, 75, 0.25);
}
.form-control::placeholder { color: var(--muted); }
/* Чекбоксы — вдавленные квадратики */
.form-check-input {
  background-color: var(--surface);
  border: none;
  box-shadow: var(--shadow-inset);
}
.form-check-input:checked { background-color: var(--accent); box-shadow: var(--shadow-inset); }

.cursor-pointer { cursor: pointer; }
.handle { cursor: grab; color: var(--muted); }

/* Карточки строчек — природные пастельные */
.line-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: var(--shadow);
  color: var(--text);
  transition: outline 0.2s;
  max-width: 100%;
}
.line-card .card-body { color: var(--text); }
/* Строчки — мягкие карточки без цветных полосок слева (цвет = фон) */
.line-card {
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  border: 1px solid var(--border-soft);
}
.line-card.vk { background: #fff2cc; } /* В КАДРЕ — жёлтый, как в оригинале */
[data-theme="dark"] .line-card.vk { background: #332e1c; }
/* Видео в окно — яркая зелёная окантовка со свечением */
.line-card.vk-video {
  outline: 4px solid #00c853 !important;
  outline-offset: -2px !important;
  box-shadow: 0 0 0 6px rgba(0, 200, 83, 0.28), inset 0 0 0 1px rgba(0, 150, 60, 0.25), var(--shadow) !important;
}
[data-theme="dark"] .line-card.vk-video { outline-color: #00e676 !important; box-shadow: 0 0 0 6px rgba(0, 230, 118, 0.3), inset 0 0 0 1px rgba(0, 200, 83, 0.3), var(--shadow) !important; }
.line-card.mat { background: #cfe2f3; } /* БЗ и материалы — синий, как в оригинале */
[data-theme="dark"] .line-card.mat { background: #232b33; }
.line-card.dg { background: #fce4d6; } /* ДАЙДЖЕСТ — отдельный цвет */
[data-theme="dark"] .line-card.dg { background: #38291c; }
.line-card.otb { background: #d9534f; } /* ОТБИВКА — полностью красная */
[data-theme="dark"] .line-card.otb { background: #3d2421; }
/* Тема заполнена — зелёная метка и поле, видно на любом фоне */
.line-card.has-theme .theme-input {
  background: #e2f0d8;
  border: 2px solid #6f9e4f;
  font-weight: 600;
}
[data-theme="dark"] .line-card.has-theme .theme-input { background: #2a3520; border-color: #7fae5e; color: #dcecc8; }
.theme-ok {
  background: #6f9e4f;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 10px;
  white-space: nowrap;
}
[data-theme="dark"] .theme-ok { background: #7fae5e; }

/* Строчка вырезана из выпуска — серая, текст приглушён */
.line-card.line-cut {
  background: #e4e4e0 !important;
  border-left-color: #9a9a94 !important;
  opacity: 0.8;
}
.line-card.line-cut .text-flow s { color: #6a6a64; }
[data-theme="dark"] .line-card.line-cut { background: #2b2e33 !important; border-left-color: #6e6f6a !important; }

/* Текст начитан — жёлтая рамка строчки + подсветка фона текста */
.line-card.line-recorded {
  outline: 3px solid #ffd21e;
  outline-offset: -1px;
}
[data-theme="dark"] .line-card.line-recorded { outline-color: #d4a800; }
.line-card.line-recorded .text-window {
  background: rgba(255, 213, 40, 0.35);
  box-shadow: var(--shadow-inset), 0 0 0 2px rgba(255, 210, 30, 0.5);
}
[data-theme="dark"] .line-card.line-recorded .text-window { background: rgba(196, 160, 30, 0.3); }

/* Отбивка: мягкая красная плашка в общем стиле, текст ОТБИВКА чёрным по центру */
.otbivka-card {
  border: none;
  border-radius: var(--radius);
  padding: 10px 12px;
  background: #ecc4bf;
  box-shadow: var(--shadow);
}
[data-theme="dark"] .otbivka-card { background: #5a2a26; }
.otbivka-title {
  flex-grow: 1;
  text-align: center;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: #1a1a1a;
  font-size: 0.95rem;
}

/* Окно текста со встроенными элементами — фон в цвет строчки */
.text-window {
  border: 1px solid var(--border);
  border-radius: 8px;
  background: transparent;       /* не белый — просвечивает цвет строчки */
  padding: 6px;
  max-width: 100%;
}
.text-flow {
  min-height: 44px;
  padding: 6px 8px;
  border-radius: 6px;
  outline: none;
  line-height: 1.6;
  font-size: 1.08rem;            /* крупнее */
  font-weight: 600;              /* жирный текст, как в монтажном листе */
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
}
[data-theme="dark"] .text-window { border-color: rgba(255, 255, 255, 0.18); }
.text-flow:focus { box-shadow: 0 0 0 2px rgba(179, 160, 103, 0.22); }
/* Зачёркнутый текст: перечёркнут + фоновый цвет, чтобы было видно */
.text-flow s, .text-flow strike, .text-flow del {
  background: #ffd9d0;
  padding: 0 2px;
  border-radius: 3px;
}
[data-theme="dark"] .text-flow s, [data-theme="dark"] .text-flow strike, [data-theme="dark"] .text-flow del {
  background: #5a2b24;
}

/* Встроенные чипы ГЕО/ТИТР — отдельной строкой, текст после — с новой */
.flow-chip {
  display: block;
  align-items: center;
  gap: 3px;
  border-radius: 6px;
  padding: 1px 4px;
  margin: 2px 0;
  vertical-align: middle;
  white-space: normal;
  width: fit-content;
  max-width: 100%;
  flex-wrap: wrap;
}
/* Внутри чипа всё переносится: инпуты не шире чипа, кнопки всегда видны */
.flow-chip .chip-input { max-width: 100%; min-width: 40px; }
.flow-chip .chip-btn { flex: 0 0 auto; }
.chip-geo { background: var(--chip-geo); }
.chip-titr { background: var(--chip-titr); }
.flow-chip .chip-label {
  color: #fff;
  font-weight: 700;
  font-size: 0.7rem;
  padding: 0 4px;
}
.flow-chip .chip-input {
  border: none;
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 0.85rem;
  width: auto;
  min-width: 90px;
  flex: 1 1 auto;
  background: rgba(255, 255, 255, 0.92);
  color: #333;
}
.flow-chip .chip-btn {
  border: none;
  background: rgba(0, 0, 0, 0.12);
  color: #fff;
  border-radius: 4px;
  font-size: 0.72rem;
  padding: 0 5px;
  line-height: 1.4;
  cursor: pointer;
}
.flow-chip .chip-btn:hover { background: rgba(0, 0, 0, 0.25); }
.flow-chip .chip-del { background: rgba(120, 50, 40, 0.5); }

.field-label {
  font-weight: 700;
  font-size: 0.78rem;
  color: var(--muted);
  letter-spacing: 0.05em;
  white-space: nowrap;
}

/* Правая колонка примечаний */
.notes-col {
  border-left: 1px dashed var(--border);
  padding-left: 10px;
  background: rgba(255, 255, 255, 0.12);
  min-width: 0;
}
@media (max-width: 767px) {
  .notes-col { border-left: none; border-top: 1px dashed var(--border); padding-left: 0; padding-top: 6px; margin-top: 4px; }
}

/* Сортировка */
.sortable-ghost { opacity: 0.4; background: var(--surface-soft) !important; }

.type-select { font-weight: 600; }
.theme-input { max-width: 340px; font-weight: 600; }

/* Модалки */
.modal-backdrop-custom {
  position: fixed;
  inset: 0;
  background: rgba(50, 44, 30, 0.45);
  z-index: 1050;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 40px 12px;
  overflow: auto;
}
.modal-card {
  width: 100%; max-width: 620px;
  border-radius: 12px;
  background: var(--modal-bg);
  color: var(--text);
  border: 1px solid var(--border);
}
.modal-card .card-header, .modal-card .card-footer { background: var(--surface-soft); border-color: var(--border-soft); }
.transcript-modal { max-width: 860px; max-height: 92vh; display: flex; flex-direction: column; }
.transcript-modal .card-body { overflow-y: auto; flex: 1; -webkit-overflow-scrolling: touch; }

/* Панель действий расшифровки — закреплена сверху, видна при прокрутке */
.transcript-toolbar {
  position: sticky;
  top: 0;
  z-index: 10;
  background: var(--modal-bg);
  padding: 8px 10px;
  margin: -6px -10px 10px;
  border-bottom: 1px solid var(--border-soft);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.transcript-rows {
  max-height: 320px; overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  padding: 6px;
}
.transcript-row { padding: 4px 8px; border-radius: 6px; font-size: 0.9rem; cursor: text; user-select: text; }
.transcript-row:hover { background: var(--surface-soft); }

/* Фрагменты в расшифровке — приглушённые природные; убранные — зачёркнуты */
.tr-frag { border-radius: 4px; padding: 0 2px; }
.tr-frag.q0 { background: #c9d6c2; }  /* шалфей */
.tr-frag.q1 { background: #dcd3b8; }  /* песок */
.tr-frag.q2 { background: #d8c8c0; }  /* глина */
.tr-frag.q3 { background: #c6cdd9; }  /* туман */
.tr-frag.q4 { background: #d5cbda; }  /* вереск */
.tr-frag.q5 { background: #c6d6d2; }  /* мох */
.tr-hidden {
  text-decoration: line-through;
  opacity: 0.6;
  background: #d8d5cb !important;
}

.transcript-body { user-select: text; }

/* Ответ спикера в монтажном листе */
.answer-text {
  border-left: 3px solid var(--mat-border);
  padding: 4px 8px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  font-size: 0.9rem;
  line-height: 1.55;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.answer-label { font-weight: 700; color: var(--muted); }
.answer-struck { color: var(--muted); }
.skl-badge {
  display: inline-block;
  background: var(--skl-color);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  border-radius: 4px;
  padding: 0 5px;
  margin: 0 2px;
  vertical-align: middle;
}
.tc-badge {
  display: inline-block;
  background: var(--tc-color);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
  border-radius: 4px;
  padding: 0 4px;
  margin-right: 2px;
  vertical-align: middle;
}

/* Плашки «суфлёр» и «начитать» — свои цвета */
.suf-plate {
  background: #edeaf6;
  border: 1px solid #b3a5dd;
  color: #4f4191;
  border-radius: 6px;
  padding: 1px 8px;
}
.rec-plate {
  background: #fdf6d6;
  border: 1px solid #e0bd38;
  color: #7a6100;
  border-radius: 6px;
  padding: 1px 8px;
}
[data-theme="dark"] .suf-plate { background: #2c2a3a; border-color: #6a5ca0; color: #cfc4f0; }
[data-theme="dark"] .rec-plate { background: #34301a; border-color: #9a8330; color: #e8dda0; }

/* Ссылки: url + описание в одной карточке */
.link-item {
  border-left: 3px solid var(--mat-border);
  background: #eef3f8;
  border-radius: 6px;
  padding: 4px 6px;
  margin-bottom: 6px;
}
[data-theme="dark"] .link-item { background: #232b33; border-left-color: #6f8db0; }
.link-item .form-control { background: rgba(255, 255, 255, 0.75); }
[data-theme="dark"] .link-item .form-control { background: rgba(38, 41, 33, 0.6); color: var(--text); }

/* Графика: заметная зелёная карточка + статус (цветной) */
.grafika-block {
  border: 2px solid #7ba05b;
  background: #e4f0da;
  border-radius: 8px;
  padding: 5px 8px;
  margin-bottom: 6px;
  box-shadow: 0 0 0 3px rgba(123, 160, 91, 0.15);
}
.grafika-block:last-of-type { margin-bottom: 0; }
[data-theme="dark"] .grafika-block { background: #24301d; border-color: #6f8f52; box-shadow: 0 0 0 3px rgba(111, 143, 82, 0.15); }
.grafika-block .form-control { background: rgba(255, 255, 255, 0.7); }
[data-theme="dark"] .grafika-block .form-control { background: rgba(38, 41, 33, 0.6); color: var(--text); }
.graf-status { font-weight: 700; }
.graf-draft { background: #cfcdc4 !important; color: #4a473f !important; }
.graf-edited { background: #a9c2d9 !important; color: #23455e !important; }
.graf-montazh { background: #a9d9ae !important; color: #1f5527 !important; }
[data-theme="dark"] .graf-draft { background: #4a4d44 !important; color: #d8d5ca !important; }
[data-theme="dark"] .graf-edited { background: #3a5268 !important; color: #cfe2f0 !important; }
[data-theme="dark"] .graf-montazh { background: #3a5c40 !important; color: #d0e8d4 !important; }

/* Кнопка расшифровки в скайпе — заметная, не сливается с фоном */
.transcript-btn {
  font-weight: 700;
  font-size: 0.85rem;
  background: #1d6fb8;
  border-color: #1d6fb8;
  box-shadow: 0 2px 6px rgba(29, 111, 184, 0.35);
}
.transcript-btn:hover { background: #175d99; border-color: #175d99; }
[data-theme="dark"] .transcript-btn { background: #2f80c9; border-color: #2f80c9; }

/* Календарь выпусков */
.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}
.cal-dow {
  text-align: center;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--muted);
  padding: 4px 0;
}
.cal-cell {
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  min-height: 64px;
  padding: 4px 6px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.cal-empty-cell { border: none; background: none; }
.cal-not-sat { opacity: 0.45; }
.cal-day { font-weight: 700; font-size: 0.85rem; }
.cal-sat { color: var(--otb-border); }
.cal-has-issue {
  background: var(--mat-bg);
  border-color: var(--mat-border);
}
.cal-free-sat { border-style: dashed; border-color: var(--border); }
.cal-issue {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 3px;
  margin-top: 3px;
  font-size: 0.72rem;
  font-weight: 700;
  color: #2c4a63;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 5px;
  padding: 2px 5px;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-del {
  border: none;
  background: transparent;
  color: #a04545;
  font-size: 0.7rem;
  padding: 0 2px;
  flex: 0 0 auto;
  cursor: pointer;
}
.cal-del:hover { color: #e53935; }
[data-theme="dark"] .cal-issue { color: #cfe2f0; background: rgba(0, 0, 0, 0.25); }
.cal-issue:hover { outline: 1px solid var(--mat-border); }
.cal-empty {
  margin-top: 3px;
  font-size: 0.72rem;
  color: var(--muted);
  border: 1px dashed var(--border);
  border-radius: 5px;
  padding: 2px 5px;
  cursor: pointer;
  text-align: center;
}
.cal-empty:hover { color: var(--text); border-color: var(--mat-border); }

/* Уведомление «Скопировано» */
.toast-msg {
  position: fixed;
  top: 16px;
  right: 16px;
  background: #3f3a2e;
  color: #fff;
  padding: 8px 16px;
  border-radius: 8px;
  font-size: 0.9rem;
  z-index: 2000;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.fade-enter-active, .fade-leave-active { transition: opacity 0.25s; }
.fade-enter-from, .fade-leave-to { opacity: 0; }

/* Тёмная тема: нейморф — поля и элементы в стиле рельефа */
[data-theme="dark"] .flow-chip .chip-input { background: rgba(255, 255, 255, 0.9); color: #222; }
[data-theme="dark"] .line-card .form-control, [data-theme="dark"] .line-card .form-select {
  background: var(--input-bg);
  color: var(--text);
  box-shadow: var(--shadow-inset);
}

/* Тёмная тема: полностью тёмная, никаких светлых плашек */
[data-theme="dark"] html, [data-theme="dark"] body { background: var(--bg) !important; }
[data-theme="dark"] .bg-light { background: #33362c !important; color: var(--text) !important; }
[data-theme="dark"] .text-dark { color: var(--text) !important; }
[data-theme="dark"] .bg-info { background: #2c3b44 !important; color: #d8e4ea !important; }
[data-theme="dark"] .bg-warning { background: #4a3f24 !important; color: #f0e6c8 !important; }
[data-theme="dark"] .bg-success { background: #2c3f30 !important; color: #d8e8da !important; }
[data-theme="dark"] .bg-danger { background: #4a2c28 !important; color: #f0d8d4 !important; }
[data-theme="dark"] .bg-primary { background: #3d4a3d !important; }
[data-theme="dark"] .app-navbar { background: #191c22; border-bottom-color: #2c3038; }
[data-theme="dark"] .modal-backdrop-custom { background: rgba(8, 10, 14, 0.65); }
[data-theme="dark"] .alert { background: var(--surface-soft); color: var(--text); border-color: var(--border); }
[data-theme="dark"] .form-check-input { background-color: var(--surface); border-color: var(--border); box-shadow: var(--shadow-inset); }
[data-theme="dark"] .answer-text { background: rgba(0, 0, 0, 0.25); }
[data-theme="dark"] .otbivka-card { background: #442824; }

/* Шапка — светлая, в спокойном стиле */
.app-navbar {
  background: var(--surface);
  border-bottom: 1px solid var(--border-soft);
}
.app-navbar .navbar-brand { color: var(--text); }
.app-badge { background: var(--accent); color: var(--accent-text); font-weight: 600; }
[data-theme="dark"] .app-navbar { background: #171914; border-bottom-color: #2c2f26; }
[data-theme="dark"] .app-navbar .navbar-brand { color: #e2dfd3; }

/* Главные кнопки — тёплый золотистый акцент */
.btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-text);
  font-weight: 600;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
  color: var(--accent-text) !important;
}
.btn-outline-primary {
  border-color: var(--accent);
  color: #8a6d1f;
}
.btn-outline-primary:hover { background: var(--accent); border-color: var(--accent); color: var(--accent-text); }
[data-theme="dark"] .btn-primary { background: #b08a3a; border-color: #b08a3a; color: #201c12; }
[data-theme="dark"] .btn-outline-primary { border-color: #b08a3a; color: #e0c07a; }

/* Карточка «актуальный выпуск» — золотая рамка в общем стиле */
.current-issue-card { border: 1px solid var(--accent); }

/* Нейморф-кнопки: мягкие, выпуклые; нажатие — вдавливание */
.btn {
  border-radius: 12px;
  border: none;
  box-shadow: var(--shadow-sm);
}
.btn:active { box-shadow: var(--shadow-inset); }
.btn-outline-secondary, .btn-secondary {
  background: var(--surface);
  color: var(--text);
}
.btn-outline-secondary:hover, .btn-secondary:hover { background: var(--surface-soft); color: var(--text); }
.btn-outline-success { background: var(--surface); color: #4a7a3a; }
.btn-outline-success:hover { background: #e4efe0; color: #3d6b2e; }
.btn-outline-danger { background: var(--surface); color: #b04545; }
.btn-outline-danger:hover { background: #f4e2e0; color: #a03a3a; }
.btn-outline-warning { background: var(--surface); color: #8a6d1f; }
.btn-outline-info { background: var(--surface); color: #2f6f8a; }
.btn-outline-dark { background: var(--surface); color: var(--text); }
.btn-outline-dark:hover { background: var(--surface-soft); color: var(--text); }

/* Плашки-чекбоксы: выпуклые, закруглённые */
.suf-plate, .rec-plate {
  background: var(--surface);
  border-radius: 12px;
  box-shadow: var(--shadow-sm);
  padding: 2px 10px;
}
.suf-plate:has(input:checked) { box-shadow: var(--shadow-inset); background: var(--surface-soft); }
.rec-plate:has(input:checked) { box-shadow: var(--shadow-inset); background: var(--surface-soft); }
.suf-plate { color: #5b4a9e; }
.rec-plate { color: #8a6d00; }

/* Окно текста — вдавленное */
.text-window { box-shadow: var(--shadow-inset); }

/* Модалки — рельефные */
.modal-card { border-radius: var(--radius); box-shadow: var(--shadow); background: var(--modal-bg); border: 1px solid var(--border-soft); }

/* ===== СЛЕДИТЬ ЗА ИЗМЕНЕНИЯМИ ===== */
.watch-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-text);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  box-shadow: var(--shadow);
  cursor: pointer;
  z-index: 1500;
  border: none;
}
.watch-fab:hover { background: var(--accent-hover); }
.watch-fab-count {
  position: absolute;
  top: -6px;
  right: -6px;
  background: #e53935;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 700;
  min-width: 20px;
  height: 20px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}
.watch-panel {
  position: fixed;
  right: 18px;
  bottom: 82px;
  width: 340px;
  max-width: calc(100vw - 24px);
  max-height: 60vh;
  background: var(--modal-bg);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  z-index: 1500;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.watch-panel-header { padding: 8px 12px; border-bottom: 1px solid var(--border-soft); background: var(--surface-soft); }
.watch-list { overflow-y: auto; flex: 1; }
.watch-item { padding: 8px 12px; border-bottom: 1px solid var(--border-soft); cursor: pointer; }
.watch-item:hover { background: var(--surface-soft); }
.watch-item:last-child { border-bottom: none; }

/* Подсветка места изменения при переходе */
.flash-highlight {
  outline: 3px solid #ffd21e !important;
  outline-offset: 2px;
  animation: flash-pulse 2.5s ease;
}
@keyframes flash-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 210, 30, 0); }
  25% { box-shadow: 0 0 0 8px rgba(255, 210, 30, 0.35); }
  60% { box-shadow: 0 0 0 4px rgba(255, 210, 30, 0.2); }
}

/* ===== ТУР ОБУЧЕНИЯ ===== */
.tour-highlight {
  position: relative;
  z-index: 3900;
  outline: 3px solid var(--accent) !important;
  outline-offset: 3px;
  border-radius: 12px;
  box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.55);
}
.tour-pop {
  position: fixed;
  z-index: 4000;
  background: var(--modal-bg);
  border: 2px solid var(--accent);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 12px 14px;
  color: var(--text);
}
.tour-title { color: var(--accent); }
.tour-text { line-height: 1.45; }
[data-theme="dark"] .tour-highlight { box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7); }

/* ===== СУФЛЁР ===== */
.prompter-overlay {
  position: fixed;
  inset: 0;
  background: #14151a;
  color: #f2f0e8;
  z-index: 3000;
  display: flex;
  flex-direction: column;
}
.prompter-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 12px 16px;
  background: #1e2026;
  border-bottom: 1px solid #33363d;
  flex-wrap: wrap;
}
.prompter-counter { text-align: center; font-size: 1.1rem; font-weight: 700; min-width: 120px; }
.prompter-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  cursor: pointer;
  user-select: none;
}
.prompter-badge {
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: #c9c2ae;
  border: 2px solid #4a4d55;
  border-radius: 8px;
  padding: 4px 16px;
  margin-bottom: 28px;
  text-transform: uppercase;
}
.prompter-badge.prompter-recorded { border-color: #5c9a6d; color: #8fd0a0; }
.prompter-text {
  font-size: clamp(1.6rem, 4vw, 3.2rem);
  line-height: 1.45;
  max-width: 1100px;
  text-align: center;
  white-space: pre-wrap;
  word-break: break-word;
}
.prompter-hint { position: absolute; bottom: 12px; right: 16px; color: #6a6d75; font-size: 0.8rem; }

/* Замок шаблона: содержимое неактивно, баннер сверху */
.locked-banner {
  background: var(--otb-bg);
  color: #fff;
  border-radius: var(--radius);
  padding: 10px 14px;
  margin-bottom: 12px;
  font-weight: 700;
  text-align: center;
}
.issue-body.template-locked > *:not(.locked-banner) {
  pointer-events: none;
  opacity: 0.55;
  filter: grayscale(0.35);
}

/* Строчка «записано» — жёлтая подсветка (см. .line-recorded выше) */

/* Мобильная вёрстка: ничего не вылезает за экран */
.row { margin-left: 0; margin-right: 0; }
.col-12, .col-md-8, .col-md-4 { padding-left: 6px; padding-right: 6px; }
.line-card, .block-card, .skype-q, .otbivka-card, .notes-col, .text-window, .meta-chip { max-width: 100%; }
.skype-q { overflow-wrap: anywhere; word-break: break-word; }
.d-flex { flex-wrap: wrap; }
@media (max-width: 576px) {
  .line-card .form-control, .line-card .form-select { font-size: 0.9rem; }
  .navbar-brand { font-size: 0.95rem; }
  .flow-chip .chip-input { min-width: 70px; }
  .flow-chip { max-width: 100%; }

  /* Верхняя панель строчки: ничего не наезжает друг на друга */
  .line-card .card-body > .d-flex {
    flex-wrap: wrap !important;
    gap: 0.45rem 0.5rem;
    row-gap: 0.5rem;
    max-width: 100%;
  }
  .line-card .card-body > .d-flex > * { max-width: 100%; }
  .line-card .card-body { overflow-x: clip; }
  .line-card .card-body > .d-flex .ms-auto { margin-left: 0 !important; max-width: 100%; }
  .suf-plate, .rec-plate {
    display: inline-flex !important;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    white-space: nowrap;
    margin-right: 2px !important;
  }
  .suf-plate .form-check-input, .rec-plate .form-check-input {
    float: none !important;
    margin: 0 !important;
    flex: 0 0 auto;
  }
  .line-card .form-check-input { width: 1.15em; height: 1.15em; margin-right: 3px; }
  .line-card .type-select { max-width: 110px; }
  .theme-input { min-width: 120px !important; max-width: 100%; }
  /* Панель значков не наезжает на окно текста */
  .line-card .card-body > .d-flex { margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px dashed rgba(0,0,0,0.08); }
  .line-card .text-window { display: block; width: 100%; overflow-wrap: anywhere; }

  /* Панель расшифровки: компактно, не вылезает за экран */
  .transcript-modal { max-width: 100%; max-height: 94vh; }
  .transcript-toolbar { gap: 4px !important; padding: 6px 8px; margin: -4px -8px 8px; }
  .transcript-toolbar .btn { padding: 3px 8px; font-size: 0.78rem; }
  .transcript-toolbar select { max-width: 130px; }
  .transcript-toolbar .small { width: 100%; }
  .prompter-text { font-size: 1.4rem; }
  .prompter-header { gap: 8px; }
}