/* mygm.top — базовая самостоятельная стилизация */
:root {
  --bg: #f5f6f8;
  --panel: #ffffff;
  --text: #212529;
  --muted: #6c757d;
  --border: #dee2e6;
  --primary: #0d6efd;
  --primary-dark: #0b5ed7;
  --danger: #dc3545;
  --ok: #198754;
  --warn-bg: #fff3cd;
  --warn-border: #ffeeba;
  --warn-text: #856404;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: var(--text);
  background: var(--bg);
  line-height: 1.5;
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Верхняя навигация */
.app-nav {
  background: var(--panel);
  border-bottom: 1px solid var(--border);
  padding: 0 20px;
}
.app-nav-inner {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 20px;
  height: 52px;
}
.app-brand {
  font-weight: 700;
  font-size: 16px;
  color: var(--text);
}
.app-brand:hover { text-decoration: none; }
.app-nav a.nav-link { color: var(--muted); font-size: 14px; }
.app-nav a.nav-link:hover { color: var(--text); text-decoration: none; }
.app-nav .spacer { flex: 1; }
.app-nav .nav-user { color: var(--muted); font-size: 13px; }

/* Контейнер контента */
.app-container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 24px 20px 60px;
}

/* Панель-баннеры */
.banner {
  padding: 10px 12px;
  margin: 0 0 16px;
  border-radius: 4px;
}
.banner-warn { background: var(--warn-bg); border: 1px solid var(--warn-border); color: var(--warn-text); }
.banner-error { background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; }
.banner-ok { background: #d1e7dd; border: 1px solid #badbcc; color: #0f5132; }
.banner-info { background: #e7f1ff; border: 1px solid #b6d4fe; color: #084298; }

/* Заголовки */
h1 { font-size: 20px; margin: 0 0 16px; }
h2 { font-size: 16px; }

/* Кнопки */
button, .btn {
  font: inherit;
  cursor: pointer;
  padding: 8px 16px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel);
  color: var(--text);
}
button:hover, .btn:hover { background: #f1f3f5; }
.btn-primary, button.btn-primary {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.btn-primary:hover, button.btn-primary:hover { background: var(--primary-dark); }

/* Поля ввода */
input[type="text"], input[type="email"], input[type="password"],
input[type="time"], select {
  font: inherit;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: #fff;
}

/* Формы аутентификации */
.auth-card {
  max-width: 380px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 24px;
}
.auth-card label { display: block; margin: 12px 0 4px; font-weight: 600; }
.auth-card input { width: 100%; }
.auth-card button { width: 100%; margin-top: 16px; }
/* Чекбоксы 18+ и правил (T060): в строку, а не на всю ширину карточки. */
.auth-card label.check { display: flex; align-items: flex-start; gap: 8px; font-weight: 500; margin: 14px 0 0; }
.auth-card label.check input { width: auto; margin: 3px 0 0; flex: 0 0 auto; }
/* Honeypot (T056/T060): поле есть в разметке, но человек его не видит. */
.honeypot-field { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px;
  overflow: hidden; pointer-events: none; }

/* Таблицы */
table.grid { border-collapse: collapse; width: 100%; background: var(--panel); }
table.grid th, table.grid td { padding: 8px 10px; border: 1px solid var(--border); text-align: left; }
table.grid thead th { background: #f1f3f5; }

/* Длинные списки файлов: видны первые несколько, остальные — по «Показать все». */
.flist:not(.flist-open) .flist-more { display: none !important; }
.flist-toggle { background: none; border: none; padding: 2px 0; margin: 2px 0 0;
  font: inherit; font-size: 12px; color: #1a5fb4; cursor: pointer; text-decoration: underline dotted; }
.flist-open .flist-toggle-show, .flist:not(.flist-open) .flist-toggle-hide { display: none; }

/* Утилиты */
.muted { color: var(--muted); }
.pill { display: inline-block; padding: 6px 12px; border-radius: 4px; background: #f1f3f5; font-size: 13px; }
.footer { margin-top: 40px; color: var(--muted); font-size: 12px; }

/* Горизонтально-прокручиваемая обёртка для широких таблиц (чтобы на узких
   экранах таблица скроллилась внутри себя, а не ломала всю раскладку). */
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ─────────────────────────── Адаптив: мобильные ─────────────────────────── */
@media (max-width: 640px) {
  /* Отсекаем горизонтальную прокрутку от off-canvas панелей (инструкция) и
     случайных широких элементов. Широкие таблицы скроллятся в .table-scroll. */
  html, body { overflow-x: hidden; }

  /* Навигация: переносим на несколько строк, email — отдельной строкой. */
  .app-nav { padding: 0 12px; }
  .app-nav-inner {
    height: auto; min-height: 52px;
    flex-wrap: wrap; gap: 6px 14px; padding: 8px 0;
  }
  .app-nav .spacer { display: none; }
  .app-brand { font-size: 15px; flex-basis: 100%; }
  .app-nav .nav-user { order: 10; width: 100%; }

  /* Контейнер контента — меньше боковых полей. */
  .app-container { padding: 16px 12px 48px; }
  h1 { font-size: 18px; }

  /* Боковая панель с инструкцией — на весь экран. */
  #manual-panel { width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; }

  /* Широкие таблицы .grid скроллятся по горизонтали внутри .table-scroll,
     сохраняя минимальную ширину колонок (чтобы не «схлопывались» в кашу). */
  .table-scroll table.grid { min-width: 560px; }

  /* Таблицы без обёртки .table-scroll (биллинг, админка) скроллятся сами. */
  table.bill-table, table.admin-table { display: block; max-width: 100%;
    overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Модальные формы: поле под лейблом (а не в узкую строку). */
  .modal .form-group { flex-direction: column; align-items: stretch; gap: 4px; }
  .modal .form-group label { min-width: 0; white-space: normal; }
  .modal { width: 94%; padding: 14px; }
}

/* ── Переключатель языка STUDIO (T040) ─────────────────────────────────────── */
.lang-switch { position: relative; margin-left: 8px; }
.lang-switch-btn { background: none; border: 1px solid #cdd6e0; border-radius: 6px;
  color: #19324d; cursor: pointer; font-weight: 600; font-size: 12px;
  padding: 4px 10px; letter-spacing: .04em; }
.lang-switch-btn:hover { background: #eef2f6; }
.lang-switch-menu { display: none; position: absolute; right: 0; top: calc(100% + 6px);
  min-width: 150px; margin: 0; padding: 4px; list-style: none; z-index: 1300;
  background: #fff; border: 1px solid #e2e8f0; border-radius: 8px;
  box-shadow: 0 8px 24px rgba(15, 27, 42, .14); }
.lang-switch.is-open .lang-switch-menu { display: block; }
.lang-switch-menu a { display: block; padding: 6px 10px; border-radius: 6px;
  color: #19324d; text-decoration: none; font-size: 13px; }
.lang-switch-menu a:hover { background: #eef2f6; }
.lang-switch-menu a.active { background: #e0ecff; font-weight: 600; }

/* ── Превью игры в карточке, правке и модерации (T100) ─────────────────────── */
.btn-sm { padding: 5px 10px; font-size: 13px; }
.game-preview-box {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 16px;
}
.game-preview-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 12px;
}
.game-preview-group, .game-preview-actions {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.preview-viewport-btn.is-active,
.preview-lang-btn.is-active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.game-preview-stage {
  margin: 0 auto;
  background: #0f172a;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--border);
  transition: width .2s ease, height .2s ease;
}
.game-preview-stage.viewport-mobile {
  width: 390px;
  max-width: 100%;
  height: 700px;
}
.game-preview-stage.viewport-tablet {
  width: 768px;
  max-width: 100%;
  height: 680px;
}
.game-preview-stage.viewport-desktop {
  width: 100%;
  height: 640px;
}
.game-preview-box.is-fullscreen .game-preview-stage.viewport-desktop {
  height: 78vh;
  min-height: 540px;
}
.game-preview-frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.preview-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

/* ── Интерфейс автора STUDIO (Этап 10, T105–T115) ─────────────────────────── */
.games-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 16px;
}
.games-header h1 { margin: 0; }
.quota-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}
.games-empty-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 28px 24px;
  text-align: center;
}
.games-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}
.game-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 16px;
  color: var(--text);
  text-decoration: none;
  transition: border-color .15s, box-shadow .15s;
}
.game-card:hover {
  border-color: #9dbde4;
  box-shadow: 0 2px 10px rgba(20, 50, 90, .08);
  text-decoration: none;
}
.game-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.game-card-icon { font-size: 28px; line-height: 1; }
.game-card-title { font-weight: 600; font-size: 15px; color: #19324d; overflow-wrap: anywhere; }
.game-card-meta { font-size: 12px; margin-top: auto; }
.status-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.status-draft, .status-unpublished { background: #e9ecef; color: #495057; }
.status-generating, .status-in_review { background: #fff3cd; color: #856404; }
.status-ready_spec { background: #cfe2ff; color: #084298; }
.status-ready, .status-published { background: #d1e7dd; color: #0f5132; }
.status-failed, .status-rejected, .status-deleted { background: #f8d7da; color: #842029; }
.games-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 22px;
}
.panel-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 16px;
}
.form-row { margin-bottom: 14px; }
.form-row label { display: block; font-weight: 600; margin-bottom: 4px; }
.form-row textarea, .form-row input[type="text"], .form-row select {
  width: 100%;
  font: inherit;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.form-check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0;
  font-weight: 500;
}
.char-counter { font-size: 12px; color: var(--muted); margin-top: 4px; }
.example-cards {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0 16px;
}
.example-btn {
  text-align: left;
  flex: 1 1 220px;
  padding: 10px 12px;
  border-radius: 6px;
  background: #f8fafc;
  border: 1px solid #dbe3ec;
}
.example-btn:hover { background: #eef4fb; border-color: #9dbde4; }
.steps-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 12px 0 16px;
}
.step-item {
  padding: 6px 12px;
  border-radius: 6px;
  background: #e9ecef;
  color: #495057;
  font-size: 13px;
  font-weight: 500;
}
.step-item.is-done { background: #d1e7dd; color: #0f5132; }
.step-item.is-active { background: #cfe2ff; color: #084298; font-weight: 700; }
.step-item.is-failed { background: #f8d7da; color: #842029; }
.action-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 14px 0;
}
.inline-form { display: inline-block; margin: 0; }
.btn-danger {
  background: var(--danger);
  border-color: var(--danger);
  color: #fff;
}
.btn-danger:hover { background: #bb2d3b; color: #fff; }
.live-log-box {
  background: #0f172a;
  color: #e2e8f0;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 12px;
  padding: 12px;
  border-radius: 6px;
  max-height: 240px;
  overflow-y: auto;
  white-space: pre-wrap;
  margin: 10px 0;
}
.screens-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 10px;
}
.screen-thumb {
  max-width: 220px;
  border: 1px solid var(--border);
  border-radius: 6px;
}
.edit-split {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
}
@media (max-width: 820px) {
  .edit-split { grid-template-columns: 1fr; }
}
.diff-box {
  background: #f8f9fa;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 12px;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 12px;
  overflow-x: auto;
}
.diff-line { white-space: pre; padding: 1px 4px; }
.diff-add { background: #e6ffed; color: #14532d; }
.diff-del { background: #ffeef0; color: #7f1d1d; }
.diff-hunk { color: #1d4ed8; font-weight: 600; }
.empty-cell-input { border-color: #f59e0b !important; background: #fffbeb !important; }
.field-error { color: var(--danger); font-size: 12px; margin-top: 3px; }



/* === Вынесенные стили шаблонов и утилитарные классы (T118) === */
/* === templates/_admin_nav.html === */
.admin-links a { margin-left:14px; }
  .admin-links a.current { color:#fff; background:#2563eb; padding:3px 9px; border-radius:4px; text-decoration:none; font-weight:600; }

/* === templates/_layout.html === */
.sub-notice { display:flex; align-items:center; gap:12px; justify-content:center;
        background:#fff3cd; border-bottom:1px solid #ffe08a; color:#7a5900;
        font-size:13px; padding:8px 16px; }
      .sub-notice-expired { background:#fdecec; border-bottom-color:#f5b5b5; color:#a12a2a; }
      .sub-notice-btn { background:#2563eb; color:#fff; text-decoration:none;
        border-radius:6px; padding:4px 12px; font-weight:600; }
      .sub-notice-btn:hover { background:#1d4ed8; }

/* === templates/admin_accounts.html === */
/* Общий контейнер сайта ограничен 1000px — это ширина для чтения, а не для
       таблицы с восемью колонками и четырьмя действиями: строка не помещалась,
       и кнопки уезжали за край. Список пользователей — плотные данные, ему нужна
       вся ширина окна. */
    .app-container { max-width: none; }
    .admin-header { display:flex; justify-content:space-between; align-items:center; margin:18px 0; flex-wrap:wrap; gap:10px; }
    .admin-filters { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; }
    .admin-filters label { display:flex; flex-direction:column; gap:3px; font-size:11px; color:#6c757d; }
    .admin-filters input, .admin-filters select { padding:5px 7px; font-size:13px; }
    .admin-filters button { padding:6px 12px; font-size:13px; }
    .admin-count { font-size:12px; color:#6c757d; margin:10px 0 0; }
    .admin-table { width:100%; min-width:940px; border-collapse:collapse; margin-top:6px; font-size:13px; }
    /* Email — самая «жадная» колонка: длинный адрес растягивал таблицу так, что
       кнопки действий уходили за край экрана. Обрезаем с многоточием, полный
       адрес остаётся в подсказке. */
    .admin-table td.col-email a.email-login { color:#2563eb; text-decoration:none; }
    .admin-table td.col-email a.email-login:hover { text-decoration:underline; }
    .admin-table td.col-email { max-width:230px; overflow:hidden; text-overflow:ellipsis;
        white-space:nowrap; }
    .admin-table th, .admin-table td { padding:8px 10px; text-align:left; border-bottom:1px solid #ddd; vertical-align:middle; }
    .admin-table th { background:#f8f9fa; font-weight:bold; white-space:nowrap; }
    .admin-table tr:hover { background:#f5f5f5; }
    .flag-ok { color:#28a745; font-weight:bold; }
    .flag-no { color:#dc3545; font-weight:bold; }
    /* Действия — последняя колонка. Раньше она сжималась до обрезков слов: кнопки
       переносились по одной в столбик и уезжали за край. Запрещаем перенос и не
       даём таблице сужаться — за края отвечает горизонтальная прокрутка. */
    .admin-actions { white-space:nowrap; }
    /* Действия собраны в одно меню: кнопка + всплывающий список. Меню
       позиционируется fixed (JS), иначе его обрезает горизонтальная прокрутка
       таблицы у нижних строк. */
    .act-toggle { font-size:12px; padding:3px 9px; }
    .act-pop { position:fixed; z-index:1000; min-width:230px; background:#fff;
        border:1px solid #d0d7de; border-radius:6px; box-shadow:0 6px 18px rgba(0,0,0,.12);
        padding:4px 0; }
    .act-pop form { margin:0; }
    .act-item { display:block; width:100%; text-align:left; background:none; border:0;
        padding:7px 14px; font-size:13px; cursor:pointer; white-space:nowrap; color:#212529; }
    .act-item:hover { background:#f1f3f5; }
    .act-danger { color:#c00; }
    .act-plan label { display:flex; align-items:center; justify-content:space-between; gap:10px;
        padding:5px 14px; font-size:13px; color:#212529; }
    .act-plan select { font-size:12px; padding:2px 4px; }
    .act-sep { border-top:1px solid #e9ecef; margin:4px 0; }
    .admin-notice { margin:10px 0 0; padding:9px 12px; border-radius:6px; font-size:13px; }
    .admin-notice.ok { background:#e7f6ec; border:1px solid #b7e4c7; color:#1b6b3a; }
    .admin-notice.err { background:#fdecec; border:1px solid #f3b7b7; color:#8a1c1c; }
    #mail-dialog { border:1px solid #d0d7de; border-radius:8px; padding:18px; width:min(520px, 92vw); }
    #mail-dialog h3 { margin:0 0 12px; font-size:16px; }
    #mail-dialog label { display:block; font-size:12px; color:#6c757d; margin:8px 0 3px; }
    #mail-dialog input, #mail-dialog textarea { width:100%; box-sizing:border-box; font-size:14px;
        padding:6px 8px; font-family:inherit; }
    #mail-dialog textarea { min-height:160px; resize:vertical; }
    #mail-dialog .mail-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:14px; }
    .col-limit form { margin-top:4px; white-space:nowrap; }
    .col-limit input { width:58px; font-size:12px; padding:2px 4px; }
    .col-limit button { font-size:12px; padding:2px 6px; }
    .pager { display:flex; gap:6px; align-items:center; flex-wrap:wrap; margin:14px 0; font-size:13px; }
    .pager a, .pager span.cur { padding:4px 9px; border:1px solid #dee2e6; border-radius:4px;
        text-decoration:none; color:#0d6efd; }
    .pager span.cur { background:#0d6efd; border-color:#0d6efd; color:#fff; font-weight:bold; }
    .pager .gap { border:0; color:#adb5bd; padding:4px 2px; }

/* === templates/admin_login.html === */
.admin-login {
        width: 360px;
        margin: 40px 0;
    }

    .admin-login label {
        display: block;
        margin: 14px 0 6px;
        font-weight: bold;
    }

    .admin-login input {
        width: 100%;
        box-sizing: border-box;
        padding: 8px;
    }

    .admin-error {
        margin: 12px 0;
        color: #dc3545;
        font-weight: bold;
    }

/* === templates/admin_mailing.html === */
.admin-header { display:flex; justify-content:space-between; align-items:center; margin:18px 0; }
  .admin-table { width:100%; border-collapse:collapse; font-size:13px; }
  .admin-table th, .admin-table td { padding:6px 8px; text-align:left; border-bottom:1px solid #ddd; vertical-align:top; }
  .admin-table th { background:#f8f9fa; font-weight:bold; }
  .drip-box { border:1px solid #dee2e6; border-radius:6px; padding:12px; margin-bottom:14px; }
  .drip-box textarea { width:100%; min-height:130px; font-family:monospace; font-size:12px; }
  .drip-box input[type=text] { width:100%; }
  .st-sent { color:#198754; font-weight:bold; } .st-failed { color:#c0392b; font-weight:bold; }
  .st-test { color:#0d6efd; font-weight:bold; } .st-skipped { color:#6c757d; }
  .drip-msg { background:#e7f1ff; padding:8px 12px; border-radius:4px; margin-bottom:12px; }
  .muted { color:#6c757d; font-size:12px; }
  h2 { font-size:16px; margin-top:22px; }

/* === templates/admin_payments.html === */
.admin-header { display:flex; justify-content:space-between; align-items:center; margin:18px 0; }
  /* Плотная таблица платежей не помещается в читательскую ширину 1000px. */
  .app-container { max-width: none; }
  .admin-table { width:100%; border-collapse:collapse; font-size:12.5px; }
  .admin-table th, .admin-table td { padding:5px 7px; text-align:left; border-bottom:1px solid #ddd; vertical-align:middle; }
  .admin-table th { background:#f8f9fa; font-weight:bold; }
  .admin-table input[type=text], .admin-table input[type=number], .admin-table input[type=date] {
    padding:3px 5px; border:1px solid #ced4da; border-radius:4px; font-size:12px; }
  .admin-table button { font-size:12px; padding:3px 7px; }
  .st { font-weight:600; padding:1px 8px; border-radius:20px; font-size:12px; }
  .st-paid { background:#e7f6ec; color:#1e7e34; }
  .st-unpaid { background:#fdf3e3; color:#b26a00; }
  .st-canceled { background:#eef1f7; color:#6c757d; }
  .addbar input, .addbar label { padding:6px; }

/* === templates/admin_plans.html === */
.admin-header { display:flex; justify-content:space-between; align-items:center; margin:18px 0; }
  .admin-table { width:100%; border-collapse:collapse; font-size:13px; }
  .admin-table th, .admin-table td { padding:6px 8px; text-align:left; border-bottom:1px solid #ddd; vertical-align:middle; }
  .admin-table th { background:#f8f9fa; font-weight:bold; }
  .admin-table input[type=text], .admin-table input[type=number] { padding:3px 5px; border:1px solid #ced4da; border-radius:4px; font-size:12px; }
  .admin-table button { font-size:12px; padding:3px 8px; }
  .addbar input, .addbar label { padding:6px; }

/* === templates/admin_settings.html === */
.admin-header { display:flex; justify-content:space-between; align-items:center; margin:18px 0; }
  .cfg-summary { border:1px solid #ddd; border-radius:6px; padding:12px 14px; margin-bottom:18px; background:#f8f9fa; }
  .cfg-summary dl { display:grid; grid-template-columns:auto 1fr; gap:4px 14px; margin:0; font-size:13px; }
  .cfg-summary dt { color:#6c757d; }
  .cfg-summary dd { margin:0; font-family:ui-monospace,Menlo,Consolas,monospace; word-break:break-all; }
  .cfg-state { margin-top:10px; font-size:13px; }
  .cfg-ok { color:#28a745; font-weight:bold; }
  .cfg-bad { color:#dc3545; font-weight:bold; }
  .cfg-sec { margin:22px 0 6px; font-size:15px; }
  .cfg-note { font-size:12px; color:#6c757d; margin:0 0 8px; }
  .cfg-table { width:100%; border-collapse:collapse; font-size:13px; }
  .cfg-table th, .cfg-table td { padding:6px 10px; text-align:left; border-bottom:1px solid #e6e6e6; vertical-align:top; }
  .cfg-table th { background:#f8f9fa; font-weight:bold; }
  .cfg-name { font-family:ui-monospace,Menlo,Consolas,monospace; white-space:nowrap; }
  .cfg-val { font-family:ui-monospace,Menlo,Consolas,monospace; word-break:break-all; }
  .cfg-empty { color:#adb5bd; }
  .cfg-src { white-space:nowrap; font-size:12px; color:#6c757d; }
  .cfg-desc { color:#495057; }
  .cfg-inactive { opacity:.55; }
  .cfg-badge { display:inline-block; font-size:11px; padding:1px 6px; border-radius:9px; background:#e9ecef; color:#495057; margin-left:8px; vertical-align:middle; }

/* === templates/billing.html === */
.bill-wrap { max-width: 900px; margin: 18px auto; }
  .bill-card { border:1px solid #e3e9ef; border-radius:10px; padding:16px 18px; margin-bottom:18px; background:#fff; }
  .bill-card h2 { font-size:16px; margin:0 0 12px; }
  .plan-grid { display:flex; gap:14px; flex-wrap:wrap; }
  .plan { flex:1 1 220px; border:1px solid #dce3ec; border-radius:10px; padding:14px; display:flex; flex-direction:column; }
  .plan.current { border-color:#28a745; box-shadow:0 0 0 2px rgba(40,167,69,.12); }
  .plan .name { font-weight:700; font-size:15px; color:#19324d; }
  .plan .price { font-size:22px; font-weight:700; margin:8px 0 2px; }
  .plan .price small { font-size:12px; color:#6c757d; font-weight:400; }
  .plan .lim { font-size:13px; color:#495057; margin-bottom:12px; }
  .plan form { margin-top:auto; display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
  .plan input[type=number] { width:56px; padding:5px 6px; border:1px solid #ced4da; border-radius:5px; }
  .btn-pay { background:#2563eb; color:#fff; border:none; border-radius:6px; padding:7px 14px; cursor:pointer; font-size:14px; }
  .btn-pay:hover { background:#1d4ed8; }
  .pill-cur { background:#e7f6ec; color:#1e7e34; border-radius:20px; padding:2px 10px; font-size:12px; font-weight:600; }
  .bill-table { width:100%; border-collapse:collapse; font-size:13px; }
  .bill-table th, .bill-table td { padding:7px 10px; text-align:left; border-bottom:1px solid #eef2f6; }
  .bill-table th { color:#8494a3; font-weight:600; font-size:11px; text-transform:uppercase; letter-spacing:.03em; }
  .st { font-weight:600; padding:1px 9px; border-radius:20px; font-size:12px; }
  .st-paid { background:#e7f6ec; color:#1e7e34; }
  .st-unpaid { background:#fdf3e3; color:#b26a00; }
  .st-canceled { background:#eef1f7; color:#6c757d; }
  .bill-err { color:#dc3545; margin-bottom:12px; }

/* === templates/configuration_editor.html === */
/* Минимальная высота, чтобы модальные диалоги (position:fixed, 100vh)
       помещались целиком. */
    html, body { min-height: 860px; }

    .cfg-header {
        display: flex; align-items: center; justify-content: space-between;
        margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid #e9ecef;
        gap: 12px; flex-wrap: wrap;
    }
    .sched-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px;
        border: 1px solid #d7e0ea; border-radius: 6px; background: #fff; color: #41525f;
        font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }
    .sched-btn:disabled { opacity: .5; cursor: default; }
    .sched-btn.on { border-color: #9fd5b4; background: #effaf3; color: #1e6b3a; }
    .sched-btn.paused { border-color: #f0c98a; background: #fff8ec; color: #8a5a00; }
    .sched-badge { font-weight: 400; font-size: 12px; }
    .sched-btn:not(.on):not(.paused) .sched-badge { color: #8494a3; }
    .sched-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%;
        background: #22a35a; margin-right: 4px; vertical-align: 1px; }
    .cfg-back { font-size: 13px; color: #007bff; text-decoration: none; }
    .cfg-back:hover { text-decoration: underline; }

    .cfg-name-form {
        display: flex; align-items: center; gap: 8px; flex: 1;
        justify-content: flex-end; flex-wrap: wrap;
    }
    .cfg-name-form input[type=text] {
        min-width: 180px; max-width: 320px;
        border: 1px solid #ced4da; border-radius: 5px;
        padding: 6px 10px; font-size: 14px; font-weight: 600;
        color: #19324d; font-family: inherit;
    }
    .cfg-name-form input[type=text]:focus {
        outline: none; border-color: #007bff;
        box-shadow: 0 0 0 3px rgba(0,123,255,.15);
    }
    .btn-save {
        background: #fff; color: #007bff; border: 1px solid #007bff;
        padding: 8px 16px; border-radius: 5px; cursor: pointer; font-size: 13px;
        white-space: nowrap;
    }
    .btn-save:hover { background: #e8f0fe; }

    /* Адаптив: на мобильных шапка редактора выравнивается по левому краю
       (иначе кнопки Файлы/Секреты/API «висят» справа с пустотой слева). */
    @media (max-width: 640px) {
        html, body { min-height: 0; }
        .cfg-name-form { justify-content: flex-start; flex: 1 1 100%; }
        .cfg-name-form input[type=text] { min-width: 0; max-width: 100%; flex: 1; }
        .cfg-header { gap: 8px; }

        /* Широкие таблицы (история запусков, задачи, а также таблицы внутри
           модальных окон) не помещаются в узкий экран. Делаем контейнер
           горизонтально прокручиваемым, а таблице задаём min-width, чтобы
           колонки не «схлопывались» в нечитаемую кашу. */
        #runs-container, #tasks-container {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }
        #runs-container > table.tasks-table { min-width: 620px; }
        #tasks-container > table.tasks-table { min-width: 460px; }
        /* Обёртки таблиц внутри модальных окон (секреты / API-ключи / журнал). */
        .table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
        .table-scroll > table.tasks-table { min-width: 460px; }
        /* Сужаем усечение длинного текста запроса, чтобы строка задачи
           не растягивала таблицу сверх меры. */
        .task-text { max-width: 190px; }
    }

    .create-panel {
        background: #f8f9fa; border: 1px solid #e9ecef; border-radius: 8px;
        padding: 16px 18px; margin-top: 28px;
    }
    .create-panel label {
        display: block; font-size: 13px; font-weight: 600;
        color: #19324d; margin-bottom: 6px;
    }
    .create-panel textarea {
        width: 100%; box-sizing: border-box; border: 1px solid #ced4da;
        border-radius: 5px; padding: 8px 10px; font-size: 14px;
        min-height: 90px; resize: vertical; font-family: inherit;
    }
    .create-panel textarea:focus {
        outline: none; border-color: #007bff;
        box-shadow: 0 0 0 3px rgba(0,123,255,.15);
    }
    .create-row { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
    .btn-run {
        background: #28a745; color: #fff; border: none;
        padding: 9px 22px; border-radius: 5px; cursor: pointer;
        font-size: 14px; font-weight: 600;
    }
    .btn-run:hover { background: #1e7e34; }
    .btn-run:disabled { background: #6c757d; cursor: not-allowed; }
    .task-error { color: #dc3545; font-size: 13px; display: none; }

    .section-title { font-size: 14px; font-weight: 700; color: #19324d; margin-bottom: 10px; }

    .tasks-table { width: 100%; border-collapse: collapse; font-size: 14px; }
    .tasks-table th {
        background: #f8f9fa; font-weight: bold; padding: 10px 12px;
        text-align: left; border-bottom: 2px solid #dee2e6;
    }
    .tasks-table td { padding: 10px 12px; border-bottom: 1px solid #e9ecef; vertical-align: top; }
    .task-text-wrap { display: flex; align-items: center; gap: 6px; }
    .task-text { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: default; }
    .btn-task-text { background: #e9ecef; border: 1px solid #ced4da; border-radius: 4px; color: #495057;
        font-size: 12px; font-weight: 600; padding: 3px 10px; cursor: pointer; flex-shrink: 0; white-space: nowrap; }
    .btn-task-text:hover { background: #dee2e6; color: #19324d; }
    /* Text view modal */
    #text-view-modal .code-modal-box { max-width: 560px; }
    #text-view-modal textarea { width: 100%; height: 160px; resize: vertical; font-size: 13px;
        font-family: inherit; border: 1px solid #ced4da; border-radius: 4px; padding: 10px;
        box-sizing: border-box; background: #f8f9fa; }
    .btn-copy-text { background: #17a2b8; color: #fff; border: none; border-radius: 4px;
        padding: 7px 18px; font-size: 13px; cursor: pointer; }
    .btn-copy-text:hover { background: #138496; }
    .copy-notice { font-size: 12px; color: #28a745; display: none; margin-left: 8px; }
    #task-tooltip {
        display: none; position: fixed; z-index: 9000;
        background: #19324d; color: #fff; font-size: 12px; line-height: 1.6;
        padding: 8px 12px; border-radius: 6px; white-space: pre-wrap; word-break: break-word;
        max-width: 420px; min-width: 180px; box-shadow: 0 4px 16px rgba(0,0,0,0.25);
        pointer-events: none;
    }
    .tasks-table tr:hover td { background: #f8f9fa; }

    .badge { display: inline-block; padding: 3px 8px; border-radius: 10px; font-size: 12px; font-weight: bold; }
    .badge-generating { background: #fef3c7; color: #92400e; }
    .badge-generated  { background: #e0f2fe; color: #0369a1; }
    .badge-running    { background: #dbeafe; color: #1e40af; }
    .badge-done       { background: #dcfce7; color: #166534; }
    .badge-failed     { background: #fee2e2; color: #991b1b; }

    .spinner {
        display: inline-block; width: 14px; height: 14px;
        border: 2px solid #ccc; border-top-color: #007bff;
        border-radius: 50%; animation: spin 0.8s linear infinite;
        vertical-align: middle; margin-right: 4px;
    }
    @keyframes spin { to { transform: rotate(360deg); } }

    .result-text {
        background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px;
        padding: 8px; max-height: 200px; overflow-y: auto;
        white-space: pre-wrap; font-size: 12px; font-family: monospace; margin-top: 6px;
    }
    .error-text { color: #991b1b; font-size: 12px; margin-top: 4px; }

    .row-actions { display: flex; gap: 6px; align-items: center; white-space: nowrap; }
    .btn-delete { background: none; border: none; color: #dc3545; cursor: pointer; font-size: 12px; padding: 0; }
    .btn-code {
        background: none; border: 1px solid #6c757d; color: #495057;
        cursor: pointer; font-size: 11px; padding: 2px 7px; border-radius: 3px;
    }
    .btn-code:hover { background: #f0f0f0; }
    .btn-download {
        background: #28a745; color: #fff; border: none;
        padding: 4px 10px; border-radius: 4px; cursor: pointer;
        font-size: 12px; text-decoration: none; display: inline-block;
    }
    .btn-download:hover { background: #1e7e34; }
    .run-files { display: flex; flex-wrap: wrap; gap: 4px; }
    /* Ссылки на файлы результата в футере окна запуска: слева, буквы влево */
    .run-download-files { flex: 0 1 auto; max-height: 34vh; overflow-y: auto;
        margin-top: 10px; min-height: 0; }
    .run-download-files:empty { display: none; }
    .run-download-files .run-files { gap: 6px 8px; }
    .run-file-link { font-size: 12px; color: #007bff; text-decoration: none;
        background: #e8f0fe; border-radius: 4px; padding: 2px 7px; white-space: nowrap; }
    /* Имя файла и его «Просмотр» — одна неразрывная пара. */
    .run-file-group { display: inline-flex; flex-wrap: wrap; gap: 3px; align-items: center; max-width: 100%; }
    .run-file-group .run-file-link:first-child { white-space: normal; overflow-wrap: anywhere; }
    .run-file-link:hover { background: #cfe2ff; text-decoration: underline; }
    .run-file-size { color: #6c8bbf; font-size: 11px; }
    .run-file-partial { font-size: 11px; color: #b26a00; background: #fff4e0;
        border-radius: 4px; padding: 2px 6px; white-space: nowrap; }

    .empty-hint { color: #6c757d; font-style: italic; padding: 12px 0; }

    /* Ожидание уточнения: модальное окно с размытым фоном. Минута молчания без
       объяснения читается как «зависло», поэтому говорим, чего ждём, и считаем
       секунды. */
    #clarify-wait { display: none; position: fixed; inset: 0; z-index: 1100;
        align-items: center; justify-content: center;
        background: rgba(23, 38, 56, .35); backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px); }
    #clarify-wait.open { display: flex; }
    .cw-box { background: #fff; border-radius: 10px; padding: 26px 30px;
        box-shadow: 0 12px 40px rgba(15,35,60,.22); max-height: 84vh; overflow-y: auto;
        box-sizing: border-box; }
    .cw-box.cw-waiting { max-width: 460px; text-align: center; }
    /* Состояние «план»: шире и по левому краю — это текст для чтения, а не
       уведомление. Длинный план прокручивается внутри окна. */
    .cw-box.cw-plan { max-width: 680px; width: calc(100vw - 40px); text-align: left; }
    .cw-title { font-size: 16px; font-weight: 700; color: #19324d; margin-bottom: 8px; }
    .cw-text { font-size: 13.5px; color: #5a6b7b; line-height: 1.55; }
    .cw-timer { font-size: 26px; font-weight: 700; color: #2563eb; margin: 14px 0 4px;
        font-variant-numeric: tabular-nums; }
    .cw-skip { margin-top: 14px; font-size: 12.5px; color: #8494a3; background: none;
        border: none; cursor: pointer; text-decoration: underline; }
    .cw-skip:hover { color: #5a6b7b; }

    /* Содержимое диалога с планом (см. .cw-box.cw-plan) */
    .clarify-fix { margin: 12px 0 2px; }
    .clarify-fix-label { font-size: 13px; color: #19324d; margin-bottom: 5px; }
    .clarify-fix textarea { width: 100%; box-sizing: border-box; border: 1px solid #cfd8e3;
        border-radius: 6px; padding: 8px 10px; font-size: 13px; font-family: inherit;
        min-height: 58px; resize: vertical; }
    .clarify-title { font-size: 13px; font-weight: 700; color: #19324d; margin-bottom: 8px; }
    .clarify-plan { margin: 0 0 12px; padding-left: 18px; font-size: 13.5px; color: #2b3d4f; line-height: 1.55; }
    .clarify-plan li { margin-bottom: 3px; }
    .clarify-q { margin-bottom: 10px; }
    .clarify-q-text { font-size: 13px; color: #19324d; margin-bottom: 5px; }
    .clarify-opts { display: flex; gap: 14px; flex-wrap: wrap; }
    .clarify-opt { font-size: 13px; color: #41525f; cursor: pointer; display: inline-flex;
        align-items: center; gap: 5px; }
    .clarify-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 12px; }
    .clarify-hint { font-size: 12px; color: #8494a3; }

    .modal-overlay {
        display: none; position: fixed; inset: 0;
        background: rgba(0,0,0,0.4); z-index: 1000;
        align-items: flex-start; justify-content: center;
        padding-top: 24px; box-sizing: border-box;
    }
    .modal-overlay.open { display: flex; }
    .modal-footer { display: flex; gap: 10px; justify-content: flex-end; margin-top: 14px; flex-shrink: 0; }
    /* Панель кнопок сверху диалога: все кнопки одного размера, прижаты влево */
    .modal-topbar { display: flex; gap: 10px; align-items: center; justify-content: flex-start; margin: 6px 0 12px; flex-shrink: 0; flex-wrap: wrap; }
    .modal-topbar button {
        flex: 0 0 auto; min-width: 190px; padding: 8px 16px;
        font-size: 14px; text-align: center; box-sizing: border-box;
    }
    .btn-cancel-modal {
        background: #6c757d; color: #fff; border: none;
        padding: 8px 16px; border-radius: 5px; cursor: pointer; font-size: 14px;
    }
    .btn-cancel-modal:hover { background: #5a6268; color: #fff; }
    .btn-rerun {
        background: #fd7e14; color: #fff; border: none;
        padding: 8px 16px; border-radius: 5px; cursor: pointer; font-size: 14px;
    }
    .btn-rerun:hover { background: #e8680c; }
    .btn-save-code {
        background: #28a745; color: #fff; border: none;
        padding: 8px 16px; border-radius: 5px; cursor: pointer; font-size: 14px;
    }
    .btn-save-code:hover { background: #1e7e34; }
    .modal-error { color: #dc3545; font-size: 13px; margin-bottom: 10px; display: none; }
    .modal-notice {
        color: #155724; background: #d4edda; border: 1px solid #c3e6cb;
        border-radius: 4px; font-size: 13px; padding: 6px 10px; margin-bottom: 10px; display: none;
    }

    .code-modal-box {
        position: relative;
        background: #fff; border-radius: 8px; padding: 24px;
        width: min(860px, calc(100vw - 32px));
        height: 640px;
        max-height: calc(100vh - 48px);
        display: flex; flex-direction: column; overflow: hidden;
        box-shadow: 0 8px 32px rgba(0,0,0,0.2);
    }
    .modal-close-x {
        position: absolute; top: 10px; right: 12px;
        width: 32px; height: 32px; padding: 0;
        background: none; border: none; cursor: pointer;
        font-size: 26px; line-height: 1; color: #adb5bd;
        border-radius: 6px;
    }
    .modal-close-x:hover { color: #495057; background: #f1f3f5; }
    .code-modal-box h3 { margin: 0 0 4px; font-size: 16px; }
    .code-modal-subtitle { font-size: 12px; color: #6c757d; margin-bottom: 12px; }
    .cm-wrapper {
        flex: 1 1 0; overflow: hidden; border: 1px solid #ced4da; border-radius: 4px;
        min-height: 200px; display: flex; flex-direction: column;
    }
    .cm-wrapper .CodeMirror { flex: 1; height: 100% !important; min-height: 200px; font-size: 13px; font-family: 'Fira Code', 'Consolas', monospace; }
    .cm-wrapper .CodeMirror-scroll { height: 100%; }
    .code-warn {
        font-size: 12px; color: #856404; background: #fff3cd;
        border: 1px solid #ffc107; border-radius: 4px;
        padding: 6px 10px; margin-bottom: 10px;
    }

    /* Главный layout: левая панель (скрипт + запуски) + правая панель (задачи) */
    .page-layout {
        display: grid;
        grid-template-columns: 360px 1fr;
        gap: 24px;
        align-items: start;
    }
    .left-panel { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
    .right-panel { min-width: 0; }

    /* Блок скрипта + история запусков (устарел, оставлен для совместимости) */
    .script-and-runs { display: contents; }
    .script-col { min-width: 0; }
    .runs-col { min-width: 0; }

    /* Главный скрипт — компактная горизонтальная карточка */
    .script-card {
        padding: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    }
    .script-icon { flex-shrink: 0; color: #007bff; line-height: 1; }
    .script-info { flex: 1; min-width: 0; }
    .script-title {
        font-size: 13px; font-weight: 700; color: #19324d; white-space: nowrap;
    }
    .script-has { font-size: 11px; color: #0369a1; }
    .script-none { font-size: 11px; color: #6c757d; font-style: italic; }
    .script-actions { display: flex; gap: 6px; flex-shrink: 0; }
    .btn-ms-edit {
        background: #fff; color: #007bff; border: 1px solid #007bff;
        padding: 5px 10px; border-radius: 5px; cursor: pointer; font-size: 12px;
        white-space: nowrap;
    }
    .btn-ms-edit:hover { background: #e8f0fe; }
    .btn-ms-run {
        background: #007bff; color: #fff; border: none;
        padding: 5px 12px; border-radius: 5px; cursor: pointer; font-size: 12px;
        font-weight: 600; white-space: nowrap;
    }
    .btn-ms-run:hover { background: #0056b3; }
    .btn-ms-run:disabled { background: #6c757d; cursor: not-allowed; }
    .btn-ms-history {
        background: none; color: #6c757d; border: 1px solid #dee2e6;
        padding: 5px 10px; border-radius: 5px; cursor: pointer; font-size: 12px;
        white-space: nowrap;
    }
    .btn-ms-history:hover { background: #f8f9fa; }
    .btn-ms-edit:disabled, .btn-ms-history:disabled {
        opacity: .5; cursor: not-allowed; background: none;
    }
    .ms-link {
        font-size: 13px; color: #7a8a99; text-decoration: underline;
        cursor: pointer; white-space: nowrap;
    }
    .ms-link:hover { color: #4b5563; }
    .ms-link.disabled {
        opacity: .5; cursor: not-allowed; pointer-events: none;
    }
    .ms-run-status { font-size: 11px; }

    /* История версий скрипта */
    /* Диалог истории изменений: компактнее, чем полноэкранный редактор кода */
    #history-modal .code-modal-box {
        height: auto; max-height: calc(100vh - 80px);
        width: min(680px, calc(100vw - 32px));
    }
    .history-scroll { flex: 1; overflow-y: auto; margin-top: 8px; }
    .history-list { list-style: none; padding: 0; margin: 0; }
    .history-list li {
        display: flex; align-items: center; gap: 6px;
        padding: 5px 0; border-bottom: 1px solid #f0f0f0; font-size: 11px;
    }
    .history-list li:last-child { border-bottom: none; }
    .history-note { color: #495057; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .history-date { color: #6c757d; white-space: nowrap; }
    .btn-restore {
        background: none; border: 1px solid #6c757d; color: #495057;
        padding: 1px 6px; border-radius: 3px; cursor: pointer; font-size: 10px; white-space: nowrap;
    }
    .btn-restore:hover { background: #f0f0f0; }
    .btn-tasks-toggle {
        background: none; border: 1px solid #dee2e6; color: #6c757d;
        padding: 4px 16px; border-radius: 4px; cursor: pointer; font-size: 12px;
    }
    .btn-tasks-toggle:hover { background: #f8f9fa; }

    /* Кнопка «Сделать главным» в диалоге скрипта */
    .btn-set-main {
        background: #17a2b8; color: #fff; border: none;
        padding: 8px 16px; border-radius: 5px; cursor: pointer; font-size: 14px;
    }
    .btn-set-main:hover { background: #138496; }

    /* Модал запуска / лог */
    .run-modal-box {
        position: relative;
        background: #fff; border-radius: 8px; padding: 22px;
        width: min(720px, calc(100vw - 24px));
        height: 640px;
        max-height: calc(100vh - 48px);
        display: flex; flex-direction: column;
        box-shadow: 0 8px 32px rgba(0,0,0,.2);
    }
    .run-modal-box h3 { margin: 0 0 4px; font-size: 16px; }
    .run-modal-meta { font-size: 12px; color: #6c757d; margin-bottom: 12px; }
    .log-box {
        flex: 1 1 0; background: #0d1117; color: #c9d1d9; border-radius: 5px;
        padding: 12px; font-size: 13px; font-family: 'Fira Code','Consolas',monospace;
        white-space: pre-wrap; word-break: break-word;
        overflow-y: auto; min-height: 120px;
    }
    #run-result-box { flex-shrink: 0; max-height: 22vh; overflow-y: auto; }
    /* Причина отказа агента — markdown (см. fmtAgentText) */
    #agent-verdict .verdict-body { margin-top: 6px; }
    #agent-verdict .verdict-body p { margin: 0 0 6px; }
    #agent-verdict .verdict-body ul, #agent-verdict .verdict-body ol { margin: 0 0 6px; padding-left: 20px; }
    #agent-verdict .verdict-body li { margin: 2px 0; }
    #agent-verdict .verdict-body h1, #agent-verdict .verdict-body h2,
    #agent-verdict .verdict-body h3, #agent-verdict .verdict-body h4 { font-size: 14px; margin: 8px 0 4px; }
    #agent-verdict .verdict-body code { background: rgba(0,0,0,.06); padding: 0 3px; border-radius: 3px; font-size: 12.5px; }
    #agent-verdict .verdict-tail { margin-top: 8px; opacity: .85; }
    .log-box.markdown-mode {
        white-space: normal;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
        line-height: 1.5;
    }
    .log-box.markdown-mode pre {
        background: rgba(255, 255, 255, 0.1);
        padding: 10px;
        border-radius: 4px;
        white-space: pre-wrap;
        font-family: 'Fira Code', monospace;
    }
    .log-box.markdown-mode code {
        background: rgba(255, 255, 255, 0.1);
        padding: 2px 4px;
        border-radius: 3px;
        font-family: 'Fira Code', monospace;
    }
    .log-box.markdown-mode h1,
    .log-box.markdown-mode h2,
    .log-box.markdown-mode h3 {
        margin-top: 0.5em;
        margin-bottom: 0.25em;
        border-bottom: 1px solid rgba(255,255,255,0.1);
        padding-bottom: 4px;
    }
    .log-box.markdown-mode p { margin-top: 0; margin-bottom: 8px; }
    .log-empty { color: #484f58; font-style: italic; }
    /* Блок результата под логом: не даём ему выпихнуть футер, добавляем свой скролл */
    #run-result-box { flex-shrink: 0; max-height: 30vh; overflow-y: auto; }
    #run-result-box:empty { display: none; }
    .run-result {
        margin-top: 10px; padding: 10px 12px; border-radius: 5px; font-size: 13px;
    }
    .run-result.done { background: #e6ffed; color: #145523; }
    .run-result.failed { background: #ffeef0; color: #86181d; }
    .run-result pre { margin: 4px 0 0; font-size: 12px; white-space: pre-wrap; word-break: break-word; }

    /* История запусков — правая колонка */
    .run-row-done td { }
    .run-row-failed td { color: #86181d; }
    .btn-view-log {
        background: none; border: 1px solid #6c757d; color: #495057;
        cursor: pointer; font-size: 11px; padding: 2px 7px; border-radius: 3px;
    }
    .btn-view-log:hover { background: #f0f0f0; }
    .btn-stop-run {
        background: none; border: 1px solid #d99; color: #c0392b;
        cursor: pointer; font-size: 10px; line-height: 1; padding: 3px 6px; border-radius: 3px;
    }
    .btn-stop-run:hover { background: #fdeeee; }
    .btn-stop-run:disabled { opacity: .6; cursor: default; }

    /* Выбор для сравнения */
    .select-cb { cursor: pointer; width: 15px; height: 15px; accent-color: #007bff; }
    .row-selected td { background: #eff6ff !important; }

    /* Плавающая панель сравнения */
    .compare-bar {
        display: none; position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%);
        background: #19324d; color: #fff; border-radius: 30px;
        padding: 10px 20px; gap: 14px; align-items: center;
        box-shadow: 0 4px 20px rgba(0,0,0,.3); z-index: 1100; white-space: nowrap;
    }
    .compare-bar.visible { display: flex; }
    .compare-bar-label { font-size: 13px; }
    .btn-compare {
        background: #007bff; color: #fff; border: none;
        padding: 7px 18px; border-radius: 20px; cursor: pointer; font-size: 13px; font-weight: 600;
    }
    .btn-compare:hover { background: #0056b3; }
    .btn-compare-clear {
        background: none; color: #adb5bd; border: none; cursor: pointer; font-size: 18px; line-height: 1;
    }

    /* Diff modal */
    .diff-modal-box {
        position: relative;
        background: #fff; border-radius: 8px; padding: 20px;
        width: min(1100px, calc(100vw - 24px));
        max-height: calc(100vh - 40px);
        display: flex; flex-direction: column;
        box-shadow: 0 8px 32px rgba(0,0,0,.2);
    }
    .diff-modal-box h3 { margin: 0 0 6px; font-size: 16px; }
    .diff-labels {
        display: grid; grid-template-columns: 1fr 1fr;
        gap: 8px; margin-bottom: 10px; font-size: 12px;
    }
    .diff-label-del { background: #ffeef0; color: #86181d; border-radius: 4px; padding: 5px 10px; }
    .diff-label-ins { background: #e6ffed; color: #145523; border-radius: 4px; padding: 5px 10px; }
    .diff-wrapper {
        flex: 1; overflow: auto; border: 1px solid #dee2e6; border-radius: 4px;
        max-height: calc(100vh - 230px);
    }
    .diff-table {
        width: 100%; border-collapse: collapse;
        font-size: 12px; font-family: 'Fira Code','Consolas',monospace;
    }
    .diff-table td { padding: 1px 8px; white-space: pre; line-height: 1.6; }
    .diff-table .ln { color: #8b949e; user-select: none; text-align: right;
        padding-right: 12px; min-width: 36px; border-right: 1px solid #e1e4e8; }
    .diff-table .sign { width: 18px; text-align: center; padding: 1px 4px; font-weight: bold; }
    .diff-del { background: #ffeef0; }
    .diff-del .sign { color: #cb2431; }
    .diff-del .ln  { background: #ffdce0; }
    .diff-ins { background: #e6ffed; }
    .diff-ins .sign { color: #22863a; }
    .diff-ins .ln  { background: #cdffd8; }
    .diff-ctx { background: #fff; }
    .diff-ctx .sign { color: #c8c8c8; }
    .diff-sep td { background: #f6f8fa; color: #8b949e; text-align: center;
        font-style: italic; font-size: 11px; padding: 3px; border-top: 1px solid #e1e4e8; border-bottom: 1px solid #e1e4e8; }

/* === templates/configuration_editor.html === */
/* Сравнение версий показывает код — только админу. */
  .select-cb[data-sel-type="version"], #compare-bar { display: none !important; }

/* === templates/dashboard.html === */
.icon-action {
    background: none; border: none; padding: 4px 6px; margin: 0;
    font-size: 15px; line-height: 1; cursor: pointer;
    color: #c2ccd6; opacity: .55; transition: opacity .12s, color .12s;
  }
  tr:hover .icon-action { opacity: .9; }
  .icon-action:hover { opacity: 1; color: #5b6b7a; }
  .run-status { font-size: 12px; font-weight: 600; white-space: nowrap; }
  .run-status.done    { color: #1e8e4e; }
  .run-status.failed  { color: #c0392b; }
  .run-status.running { color: #b8860b; }
  .run-status.none    { color: #9aa7b3; font-weight: 400; }
  .run-meta { font-size: 12px; color: #6c757d; white-space: nowrap; }
  .run-dur { font-size: 11px; color: #9aa7b3; margin-top: 1px; }
  .file-links { font-size: 12px; min-width: 230px; }
  .file-links a { display: inline-block; margin: 0 8px 2px 0; white-space: nowrap; }
  .file-links .muted { color: #9aa7b3; }
  /* Один файл — одна строка: «Просмотр» сразу за именем. Длинное имя
     переносится само, чтобы колонка не раздвигала таблицу. */
  .file-group { display: block; }
  .file-group a:first-child { display: inline; white-space: normal; overflow-wrap: anywhere; }
  .file-preview { color: #6c8bbf !important; margin-left: 2px !important; }
  /* Расписание */
  .sched { font-size: 12px; white-space: nowrap; }
  .sched-on { color: #1e6b8e; font-weight: 600; }
  .sched-off { color: #9aa7b3; }
  .sched-next { font-size: 11px; color: #9aa7b3; margin-top: 1px; }
  .sched-auto-off { color: #b26a00; font-weight: 600; cursor: help; }
  /* Изменение объёма выгрузки против прошлого прогона */
  .delta { font-size: 11px; border-radius: 4px; padding: 1px 5px; white-space: nowrap;
           cursor: help; display: inline-block; margin-top: 2px; }
  .delta.up   { background: #e7f6ec; color: #1e6b3a; }
  .delta.down { background: #fdecea; color: #b3261e; }
  .btn-run-row { font-size: 12px; padding: 3px 9px; border: 1px solid #cfe0f5;
                 background: #eaf3ff; color: #1a5fb4; border-radius: 5px; cursor: pointer;
                 white-space: nowrap; }
  .btn-run-row:hover { background: #d8e9ff; }
  .btn-run-row:disabled { opacity: .45; cursor: default; }
  /* Пустой экран: заготовки задач */
  .start-cards { display: flex; gap: 14px; flex-wrap: wrap; margin: 14px 0 4px; }
  .start-card { display: block; flex: 1 1 240px; max-width: 320px; text-decoration: none;
     border: 1px solid #dde5ee; border-radius: 8px; padding: 14px 16px; background: #fff;
     color: inherit; transition: border-color .12s, box-shadow .12s; }
  .start-card:hover { border-color: #9dbde4; box-shadow: 0 2px 8px rgba(20,50,90,.08); }
  .start-card b { display: block; font-size: 14px; color: #19324d; margin-bottom: 4px; }
  .start-card span { font-size: 12px; color: #6c757d; }

  /* Таблица задач всегда помещается в контейнер — без горизонтального скролла.
     Фиксированная раскладка: служебные колонки узкие, «Задача» и «Файлы» тянутся
     и переносят длинный текст, поэтому правые кнопки не уезжают за экран. */
  .dash-table { table-layout: fixed; width: 100%; }
  .dash-table th, .dash-table td { vertical-align: top; overflow-wrap: anywhere; }
  .dash-table .col-sched   { width: 120px; }
  .dash-table .col-last    { width: 112px; }
  .dash-table .col-finish  { width: 124px; }
  .dash-table .col-status  { width: 96px; }
  .dash-table .col-files   { width: 20%; }
  .dash-table .col-actions { width: 150px; }
  .dash-table .file-links  { min-width: 0; }
  .dash-table .run-meta, .dash-table .sched { white-space: normal; }

  /* Мобильные: таблица превращается в карточки — по одной на задачу,
     у каждого поля подпись слева (из data-label), кнопки — внизу карточки. */
  @media (max-width: 760px) {
    .table-scroll table.grid.dash-table { min-width: 0; }
    .dash-table, .dash-table tbody, .dash-table tr, table.grid.dash-table td { display: block; width: auto !important; }
    .dash-table { background: none; table-layout: auto; }
    .dash-table thead { display: none; }
    .dash-table tr { background: #fff; border: 1px solid #dde5ee; border-radius: 8px;
                     margin-bottom: 12px; padding: 10px 12px; }
    table.grid.dash-table td { border: none; padding: 4px 0 4px 112px; position: relative;
                     text-align: left !important; min-height: 22px; }
    .dash-table td[data-label]::before { content: attr(data-label); position: absolute;
                     left: 0; top: 5px; width: 104px; font-size: 12px; color: #6c757d; }
    .dash-table .run-dur { display: inline; margin-left: 6px; }
    table.grid.dash-table td.cell-task { font-size: 15px; font-weight: 600; padding: 0 0 8px;
                     border-bottom: 1px solid #eef2f6; margin-bottom: 4px; }
    table.grid.dash-table td.col-actions { display: flex; align-items: center; gap: 4px;
                     padding: 10px 0 0; margin-top: 6px; border-top: 1px solid #eef2f6; }
    .dash-table td.col-actions .btn-run-row { font-size: 14px; padding: 7px 14px; margin-right: auto; }
    .dash-table .icon-action { font-size: 18px; padding: 6px 8px; opacity: .8; color: #8a99a8; }
  }

/* Боковая панель справки (_layout.html) */
#manual-backdrop.manual-backdrop { display: none; position: fixed; inset: 0; background: rgba(15,27,42,.35); z-index: 1200; }
#manual-backdrop.manual-backdrop.is-open { display: block; }
#manual-panel.manual-panel { position: fixed; top: 0; right: 0; height: 100vh; width: 52vw; min-width: 420px; max-width: 820px; background: #fff; box-shadow: -8px 0 28px rgba(15,27,42,.18); z-index: 1201; transform: translateX(100%); transition: transform .25s ease; display: flex; flex-direction: column; }
#manual-panel.manual-panel.is-open { transform: translateX(0); }
.u-st-99ef824f { display:none;position:fixed;inset:0;background:rgba(15,27,42,.35);z-index:1200; }
.u-st-8d38e72e { position:fixed;top:0;right:0;height:100vh;width:52vw;min-width:420px;max-width:820px; background:#fff;box-shadow:-8px 0 28px rgba(15,27,42,.18);z-index:1201; transform:translateX(100%);transition:transform .25s ease;display:flex;flex-direction:column; }
.u-st-550e80b1 { display:flex;align-items:center;justify-content:space-between;gap:10px; padding:10px 14px;border-bottom:1px solid #eef2f6; }
.u-st-9c463722 { color:#19324d;font-size:14px; }
.u-st-25458515 { background:none;border:none;cursor:pointer;color:#7a8a99;font-size:20px;line-height:1;padding:2px 6px; }
.u-st-93c0322d { border:0;flex:1;width:100%; }
.u-st-9b49c245 { font-size:20px; }
.u-st-67798350 { width:240px; }
.u-st-6ee031cb { font-size:12px;padding-bottom:8px; }
.u-st-16543531 { display:inline;margin:0; }
.u-st-2b12d862 { width:60px; }
.u-st-2fd7789b { margin-top:6px; }
.u-st-8fa046b2 { margin-top:6px;display:flex;gap:10px;align-items:center;flex-wrap:wrap; }
.u-st-13bf890c { width:220px; }
.u-st-090fefb6 { color:#c0392b; }
.u-st-23fb37a2 { width:260px;margin-top:6px; }
.u-st-e4ad4a16 { margin-bottom:8px; }
.u-st-a9efa544 { white-space:nowrap; }
.u-st-ea93e07f { max-width:360px;word-break:break-word; }
.u-st-3ef1fa1a { margin-bottom:12px; }
.u-st-17559ac4 { padding:6px;width:260px; }
.u-st-4e78a6e5 { padding:6px 12px; }
.u-st-d5503de8 { width:48px; }
.u-st-1ae12e6d { width:74px; }
.u-st-d4a09a0d { width:200px; }
.u-st-0cd28ce9 { display:inline; }
.u-st-70af38fb { color:#6c757d; }
.u-st-a22a4c65 { font-size:15px;margin-top:24px; }
.u-st-7ecf04e9 { font-size:12px;color:#6c757d;margin:0 0 8px; }
.u-st-3895bb85 { display:flex;gap:8px;flex-wrap:wrap;align-items:center; }
.u-st-885d720a { padding:6px; }
.u-st-887ccd92 { width:70px;padding:6px; }
.u-st-ca41dc23 { width:100px;padding:6px; }
.u-st-e71ae94b { font-size:12px; }
.u-st-8d1b3316 { width:220px;padding:6px; }
.u-st-9e6595fb { font-size:13px; }
.u-st-77a4060f { padding:6px 14px; }
.u-st-4244efbb { font-size:13px;color:#6c757d; }
.u-st-1a91ef9e { width:80px; }
.u-st-29dbf95c { width:130px; }
.u-st-d26d79f4 { width:70px; }
.u-st-e24ee2de { width:52px; }
.u-st-34f7b3df { width:180px; }
.u-st-fcf7e407 { font-size:15px;margin-top:22px; }
.u-st-9bec53c9 { width:90px; }
.u-st-821e4857 { width:150px; }
.u-st-0db2e550 { width:64px; }
.u-st-1540cf76 { border-color:#7c3aed;color:#7c3aed; }
.u-st-8a359a76 { margin-top:16px; }
.u-st-df0c14b3 { margin:4px 0 0; font-size:13px; }
.u-st-d8f767e8 { margin:14px 0; }
.u-st-d4c632d4 { font-size:14px;color:#19324d; }
.u-st-6c538630 { border:2px dashed #f0b37e;background:#fffaf2; }
.u-st-f1578b98 { font-size:13px;color:#7a4a00;margin-bottom:12px; }
.u-st-ce54f0c2 { display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px; }
.u-st-7cbe5ecf { width:160px; }
.u-st-cf06b1b9 { width:56px; }
.u-st-fb78800a { font-size:12px;color:#6c757d;margin-top:10px; }
.u-st-6eab5e78 { display:flex;flex-direction:column; }
.u-st-a9773f2f { order:3;margin:8px 0; }
.u-st-a9508b17 { display:flex;align-items:baseline;gap:10px;padding:6px 0; }
.u-st-c9fb4179 { display:inline-flex;align-items:baseline;gap:6px;font-size:13px;color:#7a8a99;cursor:pointer;user-select:none; }
.u-st-b31c6f8c { transition:transform .15s;display:inline-block;{% if config.script %}{% else %}transform:rotate(90deg);{% endif %}; }
.u-st-bc6a0317 { display:block;font-size:12px;color:#9aa7b3;font-weight:400;margin-top:2px; }
.u-st-7623f055 { flex:1; }
.u-st-1eafa64e { border-left:2px solid #e3e9ef;padding:4px 0 4px 12px;margin:4px 0 0 3px;{% if config.script %}display:none;{% endif %}; }
.u-st-af11277a { font-size:13px;font-weight:600;color:#19324d;margin-bottom:6px; }
.u-st-c9dfbb0f { width:100%;padding:10px;border:1px solid #ced4da;border-radius:6px;font-size:14px;resize:vertical; }
.u-st-574e7055 { margin-top:8px;display:flex;gap:8px;align-items:center; }
.u-st-afa0c1af { padding:8px 16px; }
.u-st-1fe58de4 { padding:8px 14px;display:none; }
.u-st-100e3c53 { padding:8px 16px;display:none; }
.u-st-231bed2f { font-size:13px;color:#5a6b7b; }
.u-st-64cfb762 { font-size:12px;color:#7a8a99;display:none; }
.u-st-65e26dd9 { display:none;margin-top:10px;padding:11px 13px;border-radius:6px;font-size:13.5px;line-height:1.5; }
.u-st-0f56906a { display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:12px 0 4px; }
.u-st-3ee2de54 { font-size:11px;font-weight:700;color:#b26a00;background:#fff4e5;border:1px dashed #f0b37e;border-radius:4px;padding:0 5px; }
.u-st-30b6191a { display:none;margin-top:12px;padding:10px 12px;border:1px solid #ffd88a;background:#fff8e8;border-radius:6px; }
.u-st-a20c24a9 { font-size:13px;color:#7a5b00;margin-bottom:8px; }
.u-st-8ff99612 { font-family:monospace; }
.u-st-30b7b643 { padding:5px 12px; }
.u-st-ba853ea6 { display:none;margin-top:12px; }
.u-st-bd510dba { font-size:11.5px;color:#9aa7b3;margin-bottom:3px; }
.u-st-77cf7a58 { margin:0;padding:10px 12px;background:#0f1b2a;color:#cfe3f5;font-size:12px;white-space:pre-wrap;word-break:break-word;max-height:240px;overflow:auto;border-radius:6px; }
.u-st-98ae68fa { margin-top:12px;display:none; }
.u-st-2c40bf4f { font-size:12px;color:#7a8a99;cursor:pointer;user-select:none; }
.u-st-a30f907b { margin-top:4px;max-height:320px;overflow:auto;border:1px solid #eef2f6;border-radius:6px;display:none; }
.u-st-8949a7d4 { width:100%;border-collapse:collapse;font-size:12.5px; }
.u-st-80542131 { max-width:460px;height:auto; }
.u-st-fc00be0a { display:none;margin-top:12px;padding:10px 12px;background:#fff4e5;border:1px solid #f0b37e;border-radius:5px;font-size:13px;color:#7a4a00; }
.u-st-0295bdf8 { display:none;margin-top:12px;padding:10px 12px;background:#fff3cd;border:1px solid #ffe08a;border-radius:5px;font-size:13px;color:#7a5900; }
.u-st-88b9d5c6 { margin-top:14px; }
.u-st-2aa22d63 { display:flex;align-items:center;gap:10px;margin-bottom:16px; }
.u-st-3d498716 { font-size:14px;font-weight:600;color:#19324d;cursor:pointer; }
.u-st-eaafe19d { margin-right:6px;width:16px;height:16px;cursor:pointer; }
.u-st-a82d7062 { margin-bottom:14px; }
.u-st-d2636ddf { display:block;font-size:13px;font-weight:600;color:#19324d;margin-bottom:6px; }
.u-st-69686866 { width:100%;padding:8px 10px;border:1px solid #ced4da;border-radius:5px;font-size:14px; }
.u-st-bb012c72 { margin-bottom:14px;display:none; }
.u-st-93958085 { width:100px;padding:8px 10px;border:1px solid #ced4da;border-radius:5px;font-size:14px; }
.u-st-3961a748 { padding:8px 10px;border:1px solid #ced4da;border-radius:5px;font-size:14px; }
.u-st-3e60040e { font-size:12px;color:#6c757d;margin-bottom:8px;display:none; }
.u-st-ac61cafd { margin-top:16px;padding-top:14px;border-top:1px solid #e9ecef; }
.u-st-41db1849 { display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#19324d;cursor:pointer; }
.u-st-16a162db { width:16px;height:16px;cursor:pointer; }
.u-st-a23f8b7f { margin-top:8px;display:none; }
.u-st-e6cdc392 { display:block;font-size:13px;color:#19324d;margin-bottom:6px; }
.u-st-c04d055b { font-size:12px;color:#6c757d;margin-top:6px; }
.u-st-9374e842 { margin-top:12px; }
.u-st-8e4794e4 { height:auto;max-height:calc(100vh - 80px);width:min(620px,calc(100vw - 32px)); }
.u-st-08c6efdb { margin-top:16px;padding:12px 14px;border:2px dashed #f0b37e;border-radius:8px;background:#fffaf2; }
.u-st-4c1c5b87 { font-size:11px;font-weight:700;color:#b26a00;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px; }
.u-st-4ba81e8a { font-size:13px;font-weight:700;color:#19324d;margin-bottom:4px; }
.u-st-f5a37a66 { font-size:12px;color:#8494a3;margin-bottom:8px;line-height:1.4; }
.u-st-d378c4f4 { display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px; }
.u-st-759f3a4f { list-style:none;padding:0;margin:0;font-size:13px;color:#41525f; }
.u-st-5c08df55 { order:1; }
.u-st-4ec1161d { display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #d7e0ea;border-radius:6px;background:#fff;color:#41525f;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap; }
.u-st-7141ed39 { color:#8494a3;font-weight:400; }
.u-st-68ecafbb { font-size:15px;font-weight:600;color:#19324d; }
.u-st-775548de { background:none;border:none;cursor:pointer;color:#adb5bd;font-size:14px;padding:2px 4px;line-height:1; }
.u-st-3dd4ce82 { display:none;align-items:center;gap:8px; }
.u-st-ebf802d2 { padding:6px 12px;font-size:13px; }
.u-st-5763f171 { order:2;display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px; }
.u-st-e92a4d9b { order:2;{% if not config.script %}display:none;{% endif %}; }
.u-st-7dde5e56 { margin-bottom:20px; }
.u-st-d98c9f8c { text-align:right;margin-top:6px; }
.u-st-754fa712 { font-size:12px;color:#c0392b;text-decoration:none; }
.u-st-805c6a1b { display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:8px; }
.u-st-54a1e35c { display:none;white-space:nowrap; }
.u-st-25502ff9 { color:#6c757d;font-size:11px; }
.u-st-c8be1ccb { display:none; }
.u-st-f0ab45a3 { font-size:12px;color:#6c757d;margin-bottom:4px; }
.u-st-6c002e21 { margin-bottom:6px; }
.u-st-7be43cd6 { font-size:11px;color:#6c757d; }
.u-st-362871c6 { display:none;background:#dc3545; }
.u-st-b2f128c3 { display:flex;gap:12px;flex-wrap:wrap;margin:0 0 20px; }
.u-st-fc816956 { margin-top:22px; }
.u-st-e201de19 { font-size:13px;color:#6c757d;margin-top:4px; }
.u-st-a527bac1 { text-align:right; }
.share-token-box { display: flex; gap: 8px; align-items: center; margin-top: 8px; }
.share-token-input { flex: 1; font-family: monospace; font-size: 13px; padding: 8px 12px; background: #fff; border: 1px solid var(--border); border-radius: 4px; }
.admin-stats-grid { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.admin-stat-card { flex: 1 1 200px; background: #fff; border: 1px solid #e3e9ef; border-radius: 8px; padding: 16px; }
.admin-stat-card .stat-value { font-size: 24px; font-weight: 700; color: #19324d; margin-top: 4px; }
.admin-stat-card .stat-label { font-size: 13px; color: #6c757d; }
.admin-chart-box { background: #fff; border: 1px solid #e3e9ef; border-radius: 8px; padding: 16px; margin-bottom: 24px; height: 350px; position: relative; }
.admin-grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); gap: 20px; margin-top: 20px; margin-bottom: 24px; }
.admin-icon-cell { font-size: 1.5rem; text-align: center; }
.admin-jobs-overview { display: flex; gap: 1rem; flex-wrap: wrap; }
.admin-job-card { flex: 1 1 250px; min-width: 250px; }
.admin-oldest-age { font-size: 1.8rem; font-weight: bold; color: #0d6efd; }
.admin-oldest-age.is-late { color: #dc3545; }
.admin-empty-queue { font-size: 1.4rem; color: #198754; }
.admin-job-counters { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.admin-counter-badge { font-size: 1rem; padding: 0.5rem 1rem; }
.admin-error-cell { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-comment-box { max-width: 320px; }
.pointer-cursor { cursor: pointer; }


