/*
  Внешний вид сайта авито.228.

  Простыми словами:
    --переменные сверху = «палитра красок», чтобы не копировать цвета везде.
    Дальше идут блоки: фон, форма входа, пустая админка, анимации.
*/

:root {
  /* Мост legacy → DS: те же токены, что admin (см. frontend/css/ds/tokens.css). */
  --ink: var(--ds-ink, #0a1212);
  --ink-soft: var(--ds-teal-deep, #002b2b);
  --fog: var(--ds-text-muted, rgba(255, 255, 255, 0.81));
  --fog-dim: var(--ds-text-muted, rgba(255, 255, 255, 0.81));
  --paper: var(--ds-text, #ffffff);
  /* Lime — legacy/вторичный; primary CTA в DS — белый/glass. */
  /* Figma DS: акцент белый; салатовый больше не палитра UI */
  --lime: #ffffff;
  --lime-deep: rgba(255, 255, 255, 0.88);
  --line: var(--ds-line, rgba(255, 255, 255, 0.35));
  /* Мост на формализованный danger DS (#e5484d) — раньше был отдельный ярче-оранжевый красный. */
  --danger: var(--ds-danger, #ff6b5a);
  --radius: var(--ds-radius-panel, 15px);
  --font-display: var(--ds-font-display, "Montserrat Alternates", "Montserrat", system-ui, sans-serif);
  --font-body: var(--ds-font-body, "Montserrat", system-ui, sans-serif);
  --ease-out: var(--ds-ease, cubic-bezier(0.22, 1, 0.36, 1));
}

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

html {
  color-scheme: dark;
  /* Страница должна скроллиться по вертикали; по горизонтали — без полосы от фона. */
  overflow-x: hidden;
  overflow-y: auto;
  min-height: 100%;
}

body {
  margin: 0;
  min-height: 100%;
  min-height: 100dvh;
  font-family: var(--font-body);
  color: var(--paper);
  background: var(--ink);
  overflow-x: hidden;
  overflow-y: auto;
}

.page {
  position: relative;
  isolation: isolate;
  /* Раньше overflow:hidden резал высоту и убивал скролл всей админки. */
  overflow-x: hidden;
}

.field {
  display: grid;
  gap: 0.45rem;
}

.field__label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.field__label {
  font-size: 0.86rem;
  font-weight: 500;
  color: var(--fog);
}

.field__input {
  width: 100%;
  min-height: 48px;
  padding: 0.8rem 1rem;
  border: 1px solid rgba(200, 212, 204, 0.16);
  border-radius: var(--radius);
  background: rgba(12, 18, 16, 0.72);
  color: var(--paper);
  font: inherit;
  font-size: 1rem;
  outline: none;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

.field__input::placeholder {
  color: rgba(138, 154, 144, 0.7);
}

.field__input:hover {
  border-color: rgba(255, 255, 255, 0.35);
}

.field__input:focus-visible {
  border-color: var(--lime);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2);
  background: rgba(18, 28, 22, 0.92);
}

.field__input:user-invalid {
  border-color: var(--danger);
}

.password-toggle {
  border: 0;
  padding: 0.2rem 0;
  background: transparent;
  color: var(--lime);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 600;
  cursor: pointer;
}

.password-toggle:hover,
.password-toggle:focus-visible {
  color: var(--paper);
}

.app-button,
.submit-button {
  margin-top: 0.35rem;
  min-height: 52px;
  border: 0;
  border-radius: var(--radius);
  padding: 0.85rem 1.25rem;
  font: inherit;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  cursor: pointer;
  transition:
    transform 0.18s var(--ease-out),
    filter 0.18s ease,
    box-shadow 0.18s ease;
  color: var(--ink);
}

.app-button--primary,
.submit-button {
  background: linear-gradient(180deg, var(--lime) 0%, var(--lime-deep) 100%);
  box-shadow: 0 10px 30px rgba(255, 255, 255, 0.18);
}

.app-button--primary:hover,
.submit-button:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}

.app-button--primary:active,
.submit-button:active {
  transform: translateY(0);
}

.app-button:focus-visible,
.submit-button:focus-visible {
  outline: 2px solid var(--paper);
  outline-offset: 3px;
}

.app-button.is-busy,
.submit-button.is-busy {
  pointer-events: none;
  opacity: 0.72;
}

/*
  Админка: primary CTA — белый/glass (DESIGN_LOCK), не lime-градиент.
  Danger и откат не трогаем; .app-switch без изменений.
*/
.page--admin .app-button--primary:not(.app-dialog__confirm--danger):not(.admin-rollback-button),
.page--admin .submit-button:not(.app-dialog__confirm--danger):not(.admin-rollback-button) {
  border: 1px solid var(--ds-line, var(--line));
  background: var(--ds-glass-bg, rgba(255, 255, 255, 0.06));
  color: var(--ds-text, var(--paper));
  box-shadow: none;
  backdrop-filter: blur(var(--ds-glass-blur, 43.8px));
  -webkit-backdrop-filter: blur(var(--ds-glass-blur, 43.8px));
}

.page--admin .app-button--primary:not(.app-dialog__confirm--danger):not(.admin-rollback-button):hover,
.page--admin .submit-button:not(.app-dialog__confirm--danger):not(.admin-rollback-button):hover {
  filter: none;
  border-color: var(--ds-text, var(--paper));
  background: rgba(255, 255, 255, 0.12);
  color: var(--ds-text, var(--paper));
}

.page--admin .app-button--primary:not(.app-dialog__confirm--danger):not(.admin-rollback-button):focus-visible,
.page--admin .submit-button:not(.app-dialog__confirm--danger):not(.admin-rollback-button):focus-visible {
  outline: 2px solid var(--ds-text, var(--paper));
  outline-offset: 3px;
}

/* Панели вкладок: убираем lime-бордер/glow, оставляем glass-линию. */
.page--admin .parser-panel {
  border-color: var(--ds-line, var(--line));
  box-shadow: none;
}

.page--admin .stats-viewer {
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: var(--ds-glass-bg, rgba(255, 255, 255, 0.06));
  backdrop-filter: blur(var(--ds-glass-blur, 43.8px)) saturate(1.15);
  -webkit-backdrop-filter: blur(var(--ds-glass-blur, 43.8px)) saturate(1.15);
  box-shadow: none;
}

.admin-empty {
  min-height: 100dvh;
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 0.75rem;
  width: min(100% - 2rem, 28rem);
  margin-inline: auto;
  padding-block: 3rem;
  animation: rise-in 0.65s var(--ease-out) both;
}

.admin-shell {
  min-height: 100dvh;
  display: grid;
  align-content: start;
  justify-items: stretch;
  gap: 1.25rem;
  width: min(100% - 2rem, 28rem);
  margin-inline: auto;
  padding-block: 3rem;
  animation: rise-in 0.65s var(--ease-out) both;
}

/* На всю ширину окна: таблицы читаются без «колонки» по центру. */
.admin-shell--wide {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  /* Чуть воздуха у края окна, без широких полей. */
  padding-inline: 0.5rem;
}

.admin-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  /* Кнопки рядом с высоким тайлом — натуральная высота, не «стена». */
  align-items: start;
}

/* Одна кнопка («Открыть таблицу спроса») — не растягивать на полэкрана. */
.admin-actions:not(.admin-actions--branch) {
  grid-template-columns: minmax(14rem, 22rem);
  justify-content: start;
}

/*
  На широком экране блок загрузки не раздуваем на всю ширину —
  тянутся только таблицы ниже. max-width держит кнопки компактными,
  minmax(0, …) даёт сжиматься без горизонтального вылезания.
*/
.admin-actions--branch {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  justify-content: start;
  align-items: start;
  width: 100%;
  max-width: 60rem;
}

.admin-actions--branch > #toggle-stats-table {
  align-self: start;
  height: auto;
  min-height: 52px;
  width: 100%;
  min-width: 0;
}

/* У кнопок в шапке убираем лишний margin от .submit-button — иначе ряд «прыгает» по высоте. */
.admin-actions .submit-button {
  margin-top: 0;
}

/* Тайл загрузки: одна композиция вместо плавающего уведомления для прогресса.
   Здесь живут и primary-кнопка, и безопасный откат, и строка статуса. */
.upload-tile {
  container: inline-size / upload-tile;
  display: grid;
  gap: 0.95rem;
  min-width: 0;
  padding: 1rem 1.05rem 1.05rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 20px;
  background:
    radial-gradient(120% 130% at 0% 0%, rgba(255, 255, 255, 0.14), transparent 52%),
    linear-gradient(165deg, rgba(13, 20, 17, 0.92), rgba(8, 13, 10, 0.9));
  box-shadow:
    0 20px 48px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.upload-tile__intro {
  display: grid;
  gap: 0.32rem;
}

.upload-tile__title {
  margin: 0;
  color: var(--paper);
  font-family: var(--font-display);
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.upload-tile__lead {
  margin: 0;
  color: var(--fog-dim);
  font-size: 0.9rem;
  line-height: 1.45;
}

.upload-tile__actions {
  /* Склеиваем primary и rollback в один split-button:
     без gap и без разного вертикального сдвига у половинок. */
  display: flex;
  gap: 0;
  align-items: stretch;
}

.upload-tile__primary {
  flex: 1 1 auto;
  min-width: 0;
  margin-top: 0;
  border-radius: 16px 0 0 16px;
}

.upload-tile__rollback {
  flex: 0 0 3.15rem;
  margin: 0;
  min-height: 52px;
  border-left: 1px solid rgba(10, 16, 13, 0.28);
  border-radius: 0 16px 16px 0;
  box-shadow: 0 10px 24px rgba(255, 255, 255, 0.16);
}

.upload-tile__primary:hover,
.upload-tile__primary:active,
.upload-tile__rollback:hover,
.upload-tile__rollback:active {
  transform: none;
}

.upload-tile__progress {
  position: relative;
  display: grid;
  gap: 0.55rem;
  padding: 0.9rem 0.95rem 0.95rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 16px;
  overflow: hidden;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.08), transparent 58%),
    rgba(255, 255, 255, 0.03);
  transition:
    border-color 0.24s ease,
    background-color 0.24s ease,
    box-shadow 0.24s ease;
}

/* display:grid иначе перебивает [hidden]; idle тоже прячем на всякий случай. */
.upload-tile__progress[hidden],
.upload-tile__progress[data-state="idle"] {
  display: none !important;
}

.upload-tile__progress::after {
  content: "";
  position: absolute;
  inset: -35% auto auto 62%;
  width: 7.5rem;
  height: 7.5rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.2), transparent 68%);
  filter: blur(12px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.24s ease;
}

.upload-tile__progress[data-state="running"] {
  border-color: rgba(255, 255, 255, 0.34);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}

.upload-tile__progress[data-state="running"]::after {
  opacity: 0.9;
  animation: upload-tile-glow 2.7s ease-in-out infinite alternate;
}

.upload-tile__progress[data-state="done"] {
  border-color: rgba(255, 255, 255, 0.42);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.14), transparent 58%),
    rgba(255, 255, 255, 0.04);
}

.upload-tile__progress[data-state="error"] {
  border-color: rgba(255, 107, 90, 0.38);
  background:
    linear-gradient(145deg, rgba(255, 107, 90, 0.14), transparent 58%),
    rgba(26, 14, 14, 0.74);
}

.upload-tile__status-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.8rem;
}

.upload-tile__status {
  margin: 0;
  min-width: 0;
  color: var(--paper);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.4;
}

.upload-tile__percent {
  flex: 0 0 auto;
  color: var(--lime);
  font-family: var(--font-display);
  font-size: 0.8rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.upload-tile__progress[data-state="idle"] .upload-tile__percent {
  color: var(--fog-dim);
}

.upload-tile__progress[data-state="error"] .upload-tile__percent {
  color: #ffb4a8;
}

.upload-tile__track {
  position: relative;
  height: 0.65rem;
  border-radius: 999px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.32);
}

.upload-tile__fill {
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--lime-deep), var(--lime));
  box-shadow: 0 0 16px rgba(255, 255, 255, 0.42);
  transition: width 0.45s var(--ease-out);
}

.upload-tile__progress[data-state="running"] .upload-tile__fill {
  background-image: linear-gradient(
    90deg,
    var(--lime-deep) 0%,
    var(--lime) 32%,
    #efffb7 50%,
    var(--lime) 68%,
    var(--lime-deep) 100%
  );
  background-size: 220% 100%;
  animation: upload-tile-shimmer 2.6s linear infinite;
}

.upload-tile__progress[data-state="error"] .upload-tile__fill {
  background: linear-gradient(90deg, #cc5142, var(--danger));
  box-shadow: none;
  animation: none;
}

.upload-tile__hint {
  margin: 0;
  color: var(--fog-dim);
  font-size: 0.82rem;
  line-height: 1.45;
}

.brand-mark {
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--ds-brand-size, 25px);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--ds-text, var(--paper));
}

.brand-mark--compact {
  font-size: 0.95rem;
}

.admin-header {
  display: grid;
  gap: 0.55rem;
}

.admin-header__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.admin-header__copy {
  display: grid;
  gap: 0.55rem;
  min-width: 0;
}

.admin-accounts-button {
  flex: 0 0 auto;
  margin: 0.15rem 0 0;
  padding: 0.7rem 1.15rem;
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 999px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.16), transparent 60%),
    rgba(255, 255, 255, 0.04);
  color: var(--lime);
  font: inherit;
  font-family: var(--font-display);
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.18s var(--ease-out);
}

.admin-accounts-button:hover,
.admin-accounts-button:focus-visible {
  border-color: rgba(255, 255, 255, 0.72);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.28), transparent 55%),
    rgba(255, 255, 255, 0.1);
  color: var(--paper);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.16);
  outline: none;
}

.admin-accounts-button:active {
  transform: translateY(1px);
}

.admin-empty__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.6rem;
  font-weight: 500;
}

.admin-empty__note {
  margin: 0;
  color: var(--fog-dim);
}

.admin-open-button {
  width: 100%;
}

.admin-open-button--secondary {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: var(--paper);
  box-shadow: none;
}

.admin-open-button--secondary:hover,
.admin-open-button--secondary:focus-visible {
  border-color: rgba(255, 255, 255, 0.55);
  background: rgba(255, 255, 255, 0.1);
  color: var(--lime);
}

.admin-rollback-button {
  box-sizing: border-box;
  flex: 0 0 3.15rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid rgba(10, 16, 13, 0.28);
  /* Скругление справа — пара к левому краю у «Загрузить». */
  border-radius: 0 var(--radius) var(--radius) 0;
  background: linear-gradient(180deg, var(--lime) 0%, var(--lime-deep) 100%);
  color: var(--ink);
  cursor: pointer;
  /* Те же свойства transition, что у .submit-button — визуально единый hover через группу. */
  transition:
    transform 0.18s var(--ease-out),
    filter 0.18s ease,
    box-shadow 0.18s ease;
}

/* Hover/active у отката тоже через .admin-upload-group — иначе кнопки «разъедутся». */
.admin-rollback-button:hover,
.admin-rollback-button:focus-visible,
.admin-rollback-button:active {
  filter: none;
  transform: none;
}

.admin-rollback-button:focus-visible {
  outline: 2px solid var(--paper);
  outline-offset: -3px;
}

.admin-rollback-button:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: none;
}

.admin-rollback-button__icon {
  width: 1.2rem;
  height: 1.2rem;
  display: block;
}

/* Раскрытие блока таблицы.
   Закрытый блок — display:none: иначе 0fr-ячейка всё равно ест gap у .admin-shell
   и оставляет огромную пустоту над/под свёрнутой таблицей. */
.stats-viewer-reveal {
  display: none;
  margin: 0;
  padding: 0;
  border: 0;
}

.stats-viewer-reveal.is-open {
  display: grid;
  grid-template-rows: 1fr;
}

.stats-viewer-reveal > .stats-viewer {
  overflow: hidden;
  min-height: 0;
  margin: 0;
  opacity: 0;
  transform: translateY(-0.55rem);
  transition:
    opacity 0.32s var(--ease-out),
    transform 0.42s var(--ease-out);
}

.stats-viewer-reveal.is-open > .stats-viewer {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 720px) {
  .admin-actions {
    grid-template-columns: 1fr;
  }
}

@container upload-tile (max-width: 29rem) {
  .upload-tile__actions {
    flex-direction: column;
  }

  .upload-tile__primary {
    border-radius: 16px 16px 0 0;
  }

  .upload-tile__rollback {
    width: 100%;
    flex: 0 0 auto;
    border-left: 0;
    border-top: 1px solid rgba(10, 16, 13, 0.28);
    border-radius: 0 0 16px 16px;
  }
}

/* ===== Парсер Dolphin: кнопка + кастомная консоль логов ===== */

.parser-panel {
  display: grid;
  gap: 0.85rem;
  /* Отступ даёт gap у .admin-shell — лишний margin-top раздувал пустоту под таблицей. */
  margin-top: 0;
  padding: 1.1rem 1.15rem 1.2rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.03);
}

.parser-panel__intro {
  display: grid;
  gap: 0.35rem;
}

.parser-panel__title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.parser-panel__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 600;
}

.parser-settings-button {
  box-sizing: border-box;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--fog);
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    color 0.18s ease,
    background 0.18s ease;
}

.parser-settings-button:hover {
  border-color: rgba(255, 255, 255, 0.55);
  color: var(--lime);
  background: rgba(255, 255, 255, 0.1);
}

.parser-settings-button:focus-visible {
  border-color: rgba(255, 255, 255, 0.72);
  color: var(--paper);
  background: rgba(255, 255, 255, 0.14);
  outline: 3px solid rgba(255, 255, 255, 0.32);
  outline-offset: 3px;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.7),
    0 0 0 7px rgba(255, 255, 255, 0.14);
}

.parser-settings-button__icon {
  width: 1.15rem;
  height: 1.15rem;
  display: block;
}

.parser-panel__last-parse {
  margin: 0;
  color: var(--fog);
  font-size: 0.88rem;
}

.parser-panel__status {
  margin: 0;
  color: var(--fog);
  font-size: 0.9rem;
}

.parser-panel .admin-open-button {
  width: auto;
  max-width: 22rem;
  justify-self: start;
}

.parser-panel__launch {
  display: grid;
  gap: 0.85rem;
}

.parser-scope {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  align-items: start;
}

.parser-scope__panel {
  position: relative;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background:
    linear-gradient(165deg, rgba(22, 28, 24, 0.96), rgba(10, 14, 12, 0.92));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}

.parser-scope__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  cursor: pointer;
  list-style: none;
  user-select: none;
}

.parser-scope__summary::-webkit-details-marker {
  display: none;
}

.parser-scope__summary-label {
  color: var(--paper);
  font-weight: 650;
  letter-spacing: 0.01em;
}

.parser-scope__count {
  flex: 0 0 auto;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.1);
  color: var(--lime);
  font-size: 0.78rem;
  font-weight: 700;
}

.parser-scope__body {
  display: grid;
  gap: 0.55rem;
  padding: 0 0.85rem 0.85rem;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.parser-scope__toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  padding-top: 0.65rem;
}

.parser-scope__tool {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
  color: var(--fog);
  padding: 0.28rem 0.7rem;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    color 0.18s ease,
    background-color 0.18s ease;
}

.parser-scope__tool:hover {
  border-color: rgba(255, 255, 255, 0.45);
  color: var(--paper);
  background: rgba(255, 255, 255, 0.08);
}

.parser-scope__list {
  display: grid;
  gap: 0.28rem;
  max-height: 11rem;
  overflow: auto;
  padding-right: 0.15rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.45) transparent;
}

.parser-scope__list--tall {
  max-height: 14rem;
}

.parser-scope__option {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  padding: 0.42rem 0.5rem;
  border-radius: 0.7rem;
  cursor: pointer;
  color: var(--fog);
  transition: background-color 0.16s ease, color 0.16s ease;
}

.parser-scope__option:hover {
  background: rgba(255, 255, 255, 0.07);
  color: var(--paper);
}

.parser-scope__option input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: var(--lime);
  flex: 0 0 auto;
}

.parser-scope__option-text {
  min-width: 0;
  font-size: 0.9rem;
  line-height: 1.3;
}

.parser-scope__empty {
  margin: 0;
  padding: 0.55rem 0.35rem 0.2rem;
  color: rgba(220, 230, 220, 0.55);
  font-size: 0.88rem;
  line-height: 1.35;
}

.parser-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

@media (max-width: 720px) {
  .parser-scope {
    grid-template-columns: 1fr;
  }
}

.admin-open-button--danger {
  background: transparent;
  border: 1px solid rgba(255, 120, 100, 0.45);
  color: #ffb4a8;
}

.admin-open-button--danger:hover:not(:disabled) {
  border-color: rgba(255, 120, 100, 0.8);
  color: #ffd2ca;
}

.admin-open-button--danger:disabled {
  opacity: 0.45;
}

/* Статус прогона отдельно от debug-консоли. */
.parser-run {
  display: grid;
  gap: 0.55rem;
}

.parser-run__status {
  margin: 0;
  min-height: 1.35em;
  color: var(--fog);
  font-size: 0.95rem;
  line-height: 1.4;
  opacity: 1;
  transform: translateY(0);
}

.parser-run__status.is-entering {
  animation: parser-status-in 0.38s var(--ease-out) both;
}

.parser-run__track {
  position: relative;
  height: 0.55rem;
  border-radius: 999px;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03)),
    rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.02);
}

.parser-run__fill {
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background-image: linear-gradient(
    90deg,
    var(--lime-deep) 0%,
    var(--lime) 34%,
    #efffa9 50%,
    var(--lime) 66%,
    var(--lime-deep) 100%
  );
  background-size: 220% 100%;
  box-shadow:
    0 0 16px rgba(255, 255, 255, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.12);
  will-change: width, transform, background-position;
  transition: width 0.5s var(--ease-out);
}

.parser-run__track.is-indeterminate .parser-run__fill {
  width: 34%;
  will-change: transform;
  animation: parser-progress-indeterminate 1.25s ease-in-out infinite;
}

.parser-run__track.is-determinate .parser-run__fill {
  animation: none;
}

.parser-run__track.is-determinate.is-running {
  box-shadow:
    inset 0 1px 2px rgba(0, 0, 0, 0.35),
    0 0 22px rgba(255, 255, 255, 0.1);
}

.parser-run__track.is-determinate.is-running .parser-run__fill {
  animation: parser-progress-shimmer 2.6s linear infinite;
}

.parser-run__eta {
  margin: 0;
  min-height: 1.2em;
  color: var(--fog-dim);
  font-size: 0.85rem;
  line-height: 1.35;
}

.parser-settings-form {
  display: grid;
  gap: 1.1rem;
}

.app-dialog__panel--compact,
.parser-settings-dialog__panel {
  width: 100%;
}

.app-dialog__eyebrow,
.parser-settings-dialog__eyebrow {
  margin: 0 0 0.35rem;
  font-family: var(--font-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--lime);
}

.parser-settings-fields {
  display: grid;
  gap: 0.85rem;
}

/* Общий switch для булевых настроек: не используем голый системный checkbox. */
.app-switch,
.parser-switch {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.85rem;
  align-items: center;
  margin: 0;
  padding: 0.95rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.08), transparent 55%),
    rgba(255, 255, 255, 0.03);
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}

.app-switch:hover,
.parser-switch:hover {
  border-color: rgba(255, 255, 255, 0.4);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.app-switch__input,
.parser-switch__input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  pointer-events: none;
}

.app-switch__track,
.parser-switch__track {
  position: relative;
  box-sizing: border-box;
  width: 2.85rem;
  height: 1.55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(200, 212, 204, 0.22);
  transition:
    background 0.22s var(--ease-out),
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.app-switch__thumb,
.parser-switch__thumb {
  position: absolute;
  top: 50%;
  left: 0.18rem;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 50%;
  background: var(--paper);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
  transform: translateY(-50%);
  transition: transform 0.22s var(--ease-out);
}

.app-switch__input:checked + .app-switch__track,
.app-switch__input:checked + .parser-switch__track,
.parser-switch__input:checked + .app-switch__track,
.parser-switch__input:checked + .parser-switch__track {
  background: linear-gradient(90deg, var(--lime-deep), var(--lime));
  border-color: rgba(255, 255, 255, 0.65);
  box-shadow: 0 0 18px rgba(255, 255, 255, 0.28);
}

.app-switch__input:checked + .app-switch__track .app-switch__thumb,
.app-switch__input:checked + .parser-switch__track .parser-switch__thumb,
.parser-switch__input:checked + .app-switch__track .app-switch__thumb,
.parser-switch__input:checked + .parser-switch__track .parser-switch__thumb {
  transform: translate(1.2rem, -50%);
}

.app-switch__input:focus-visible + .app-switch__track,
.app-switch__input:focus-visible + .parser-switch__track,
.parser-switch__input:focus-visible + .app-switch__track,
.parser-switch__input:focus-visible + .parser-switch__track {
  outline: 2px solid var(--paper);
  outline-offset: 3px;
}

.app-switch__copy,
.parser-switch__copy {
  display: grid;
  gap: 0.2rem;
  min-width: 0;
}

.app-switch__title,
.parser-switch__title {
  color: var(--paper);
  font-size: 0.95rem;
  font-weight: 650;
  letter-spacing: -0.01em;
}

.app-switch__hint,
.parser-switch__hint {
  color: var(--fog-dim);
  font-size: 0.82rem;
  line-height: 1.35;
}

/* Общее предупреждение для диалогов: заметное, но в том же тёмном языке админки. */
.app-alert {
  --app-alert-border: rgba(255, 168, 76, 0.42);
  --app-alert-glow: rgba(255, 150, 50, 0.22);
  --app-alert-surface-start: rgba(40, 22, 10, 0.92);
  --app-alert-surface-end: rgba(18, 14, 10, 0.88);
  --app-alert-badge-bg: rgba(255, 168, 76, 0.22);
  --app-alert-badge-border: rgba(255, 180, 90, 0.45);
  --app-alert-badge-text: #ffd9a8;
  --app-alert-title: #ffe0b8;
  --app-alert-text: rgba(255, 220, 180, 0.86);
  display: grid;
  gap: 0.45rem;
  margin: 0.15rem 0 0;
  padding: 1rem 1.05rem 1.05rem;
  border-radius: 14px;
  border: 1px solid var(--app-alert-border);
  background:
    radial-gradient(120% 90% at 0% 0%, var(--app-alert-glow), transparent 55%),
    linear-gradient(165deg, var(--app-alert-surface-start), var(--app-alert-surface-end));
  box-shadow:
    inset 0 1px 0 rgba(255, 210, 150, 0.12),
    0 12px 28px rgba(0, 0, 0, 0.28);
}

/* display:grid иначе перебивает [hidden] — пустой алерт остаётся видимым. */
.app-alert[hidden] {
  display: none !important;
}

.app-alert--warning,
.parser-settings-alert {
  --app-alert-border: rgba(255, 168, 76, 0.42);
  --app-alert-glow: rgba(255, 150, 50, 0.22);
  --app-alert-surface-start: rgba(40, 22, 10, 0.92);
  --app-alert-surface-end: rgba(18, 14, 10, 0.88);
  --app-alert-badge-bg: rgba(255, 168, 76, 0.22);
  --app-alert-badge-border: rgba(255, 180, 90, 0.45);
  --app-alert-badge-text: #ffd9a8;
  --app-alert-title: #ffe0b8;
  --app-alert-text: rgba(255, 220, 180, 0.86);
}

/* Спокойная lime-подсказка (не warning): для «аккаунты теперь общие». */
.app-alert--info {
  --app-alert-border: rgba(255, 255, 255, 0.36);
  --app-alert-glow: rgba(255, 255, 255, 0.16);
  --app-alert-surface-start: rgba(20, 35, 17, 0.95);
  --app-alert-surface-end: rgba(10, 18, 12, 0.92);
  --app-alert-badge-bg: rgba(255, 255, 255, 0.16);
  --app-alert-badge-border: rgba(255, 255, 255, 0.42);
  --app-alert-badge-text: var(--lime);
  --app-alert-title: var(--paper);
  --app-alert-text: var(--fog);
}

.app-alert__badge,
.parser-settings-alert__badge {
  justify-self: start;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  background: var(--app-alert-badge-bg);
  border: 1px solid var(--app-alert-badge-border);
  color: var(--app-alert-badge-text);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.app-alert__title,
.parser-settings-alert__title {
  margin: 0;
  color: var(--app-alert-title);
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  line-height: 1.25;
}

.app-alert__text,
.parser-settings-alert__text {
  margin: 0;
  color: var(--app-alert-text);
  font-size: 0.86rem;
  line-height: 1.5;
}

@keyframes parser-status-in {
  from {
    opacity: 0;
    transform: translateY(0.35rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes parser-progress-indeterminate {
  from {
    transform: translateX(-115%);
  }
  to {
    transform: translateX(315%);
  }
}

@keyframes parser-progress-shimmer {
  from {
    background-position: 0% 0;
  }
  to {
    background-position: 100% 0;
  }
}

.demand-viewer .stats-table td.is-empty {
  color: var(--fog-dim);
}

/* Раскрытие города → районы (тот же язык, что у stats-table). */
.stats-table__expand-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1.35rem;
  height: 1.35rem;
  margin: 0 0.35rem 0 0;
  padding: 0;
  border: 0;
  border-radius: 0.2rem;
  background: transparent;
  color: var(--lime);
  font: inherit;
  font-size: 0.68rem;
  line-height: 1;
  cursor: pointer;
}

.stats-table__expand-btn:hover,
.stats-table__expand-btn:focus-visible {
  color: var(--paper);
  background: rgba(255, 255, 255, 0.12);
}

.stats-table__expand-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.55);
  outline-offset: 2px;
}

.stats-table__city-label {
  vertical-align: middle;
}

.stats-table tbody .stats-table__city-col--child {
  font-weight: 500;
  color: var(--fog);
  padding-left: 2.1rem;
}

.stats-table tbody tr.stats-table__row--child td {
  color: var(--fog);
}

.stats-table tbody tr.stats-table__row--child:hover td,
.stats-table tbody tr.stats-table__row--child:hover .stats-table__city-col {
  background-color: #122018;
}


.parser-console {
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: calc(var(--radius) - 4px);
  background: #070b09;
  overflow: hidden;
}

.parser-console__log {
  max-height: 16rem;
  overflow: auto;
  padding: 0.75rem 0.9rem;
  font-family: ui-monospace, "Cascadia Code", "Consolas", monospace;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--fog);
  white-space: pre-wrap;
  word-break: break-word;
}

.parser-console__line + .parser-console__line {
  margin-top: 0.2rem;
}

.parser-console__line {
  color: #d7e4db;
}

/* ===== Плавающие окна (загрузка, подтверждения) — общий язык .app-dialog ===== */

.app-dialog,
.upload-dialog {
  width: min(100% - 1.5rem, 26.5rem);
  max-height: min(90dvh, 44rem);
  margin: auto;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 20px;
  background: rgba(14, 20, 17, 0.92);
  color: var(--paper);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55);
  overflow: hidden;

  opacity: 0;
  transform: translateY(12px) scale(0.96);
  transition-property: opacity, transform, display, overlay;
  transition-duration: 0.28s;
  transition-timing-function: var(--ease-out);
  transition-behavior: allow-discrete;
}

/* У compact-окон ширина живёт только на dialog; panel просто тянется на 100%. */
.app-dialog--compact,
.app-dialog--compact.upload-dialog {
  width: min(100% - 1.5rem, 28rem);
}

.app-dialog[open],
.upload-dialog[open] {
  /* Явный display: иначе при transition на display/overlay окно может остаться невидимым. */
  display: block;
  opacity: 1;
  transform: translateY(0) scale(1);

  @starting-style {
    opacity: 0;
    transform: translateY(12px) scale(0.96);
  }
}

/* Блюр всего, что ЗА окном */
.app-dialog::backdrop,
.upload-dialog::backdrop {
  background: rgba(4, 8, 6, 0);
  backdrop-filter: blur(0);
  -webkit-backdrop-filter: blur(0);
  transition:
    display 0.28s allow-discrete,
    overlay 0.28s allow-discrete,
    background-color 0.28s var(--ease-out),
    backdrop-filter 0.28s var(--ease-out),
    -webkit-backdrop-filter 0.28s var(--ease-out);
}

.app-dialog[open]::backdrop,
.upload-dialog[open]::backdrop {
  background: rgba(4, 8, 6, 0.55);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  @starting-style {
    background: rgba(4, 8, 6, 0);
    backdrop-filter: blur(0);
    -webkit-backdrop-filter: blur(0);
  }
}

.app-dialog__panel,
.upload-dialog__panel {
  display: grid;
  gap: 1.15rem;
  /* Равные поля слева/справа. scrollbar-gutter убран — он раздувал правый край. */
  padding: 1.25rem;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: min(90dvh, 44rem);
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.45) transparent;
}

/* Chromium: узкий скролл поверх контента, без съедания padding справа. */
.app-dialog__panel::-webkit-scrollbar,
.upload-dialog__panel::-webkit-scrollbar {
  width: 8px;
}

.app-dialog__panel::-webkit-scrollbar-track,
.upload-dialog__panel::-webkit-scrollbar-track {
  background: transparent;
}

.app-dialog__panel::-webkit-scrollbar-thumb,
.upload-dialog__panel::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.35);
  border: 2px solid transparent;
  background-clip: padding-box;
}

.app-dialog__header,
.upload-dialog__header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 0.75rem;
}

.app-dialog__header > :first-child,
.upload-dialog__header > :first-child {
  min-width: 0;
}

.app-dialog__title,
.upload-dialog__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 500;
}

.app-dialog__lead,
.upload-dialog__lead {
  margin: 0.35rem 0 0;
  color: var(--fog-dim);
  font-size: 0.9rem;
  line-height: 1.4;
}

.app-dialog__close,
.upload-dialog__close {
  flex: 0 0 auto;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid rgba(200, 212, 204, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--fog);
  font-size: 0.95rem;
  line-height: 1;
  cursor: pointer;
}

.app-dialog__close:hover,
.upload-dialog__close:hover {
  border-color: rgba(255, 255, 255, 0.45);
  color: var(--paper);
}

.app-dialog__close:focus-visible,
.upload-dialog__close:focus-visible {
  border-color: rgba(255, 255, 255, 0.72);
  color: var(--paper);
  outline: 3px solid rgba(255, 255, 255, 0.32);
  outline-offset: 3px;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.7),
    0 0 0 7px rgba(255, 255, 255, 0.14);
}

.app-dialog__error {
  margin: 0;
  color: var(--danger);
  font-size: 0.9rem;
  line-height: 1.4;
}

.app-dialog__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-end;
  gap: 0.65rem;
}

.app-dialog__cancel {
  box-sizing: border-box;
  min-height: 2.75rem;
  margin: 0;
  padding: 0.65rem 1.1rem;
  border: 1px solid rgba(200, 212, 204, 0.2);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.04);
  color: var(--fog);
  font: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    color 0.18s ease,
    background-color 0.18s ease;
}

.app-dialog__cancel:hover,
.app-dialog__cancel:focus-visible {
  border-color: rgba(255, 255, 255, 0.4);
  color: var(--paper);
  background: rgba(255, 255, 255, 0.06);
}

.app-dialog__confirm {
  margin: 0;
  min-height: 2.75rem;
  padding-block: 0;
  padding-inline: 1.15rem;
}

/* Красный вариант только для реально опасных действий, не для обычного «Сохранить». */
.app-dialog__confirm--danger {
  background: linear-gradient(180deg, #ff8a7a 0%, var(--danger) 100%);
  color: var(--paper);
  box-shadow: 0 10px 30px rgba(255, 107, 90, 0.22);
}

.app-dialog__confirm--danger:hover {
  filter: brightness(1.06);
}

/* class + submit-button не должны перебивать [hidden] — иначе «Откатить» остаётся видимой */
.app-dialog__confirm[hidden] {
  display: none !important;
}

.app-dialog__close:disabled,
.app-dialog__cancel:disabled,
.app-dialog__confirm:disabled {
  opacity: 0.58;
  cursor: not-allowed;
}

.upload-form {
  display: grid;
  gap: 1.1rem;
}

.upload-form__status {
  margin: 0;
  padding: 0.65rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.08);
  color: var(--lime);
  font-size: 0.9rem;
  line-height: 1.4;
}

.file-pickers {
  display: grid;
  gap: 0.7rem;
}

/* Красивая «кнопка-зона» вместо уродливого системного file input */
.file-picker {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 0.85rem;
  min-height: 4.1rem;
  padding: 0.85rem 1rem;
  border: 1px dashed rgba(255, 255, 255, 0.35);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.08), transparent 55%),
    rgba(8, 12, 10, 0.55);
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    background-color 0.2s ease,
    transform 0.2s var(--ease-out);
}

.file-picker:hover {
  border-color: rgba(255, 255, 255, 0.7);
  transform: translateY(-1px);
}

.file-picker:focus-within {
  border-color: var(--lime);
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.18);
}

.file-picker--filled {
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.55);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.14), transparent 55%),
    rgba(8, 12, 10, 0.7);
}

.file-picker__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.file-picker__badge {
  display: grid;
  place-items: center;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.16);
  color: var(--lime);
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 700;
}

.file-picker__body {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}

.file-picker__title {
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--fog);
}

.file-picker__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.95rem;
  color: var(--paper);
}

.file-picker:not(.file-picker--filled) .file-picker__name {
  color: var(--fog-dim);
}

.period-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.85rem;
}

@media (max-width: 520px) {
  .period-row {
    grid-template-columns: 1fr;
  }
}

.upload-ok {
  margin: 0;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, 0.1);
  color: var(--lime);
  font-size: 0.92rem;
}

.text-link {
  margin-top: 0.25rem;
  color: var(--lime);
  font-weight: 600;
  text-decoration: none;
}

/* Кнопка «Выйти» — выглядит как ссылка, но шлёт POST (защита от CSRF-картинки). */
button.text-link,
.ds-logout-form {
  display: inline;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  cursor: pointer;
}

button.text-link:hover,
button.text-link:focus-visible {
  text-decoration: underline;
}

/* ===== Просмотрщик дневных простыней ===== */

.stats-viewer {
  display: grid;
  gap: 1rem;
  padding: 1.15rem 1.2rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 18px;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.07), transparent 42%),
    rgba(10, 16, 13, 0.72);
}

.stats-viewer__intro {
  display: grid;
  gap: 0.35rem;
}

.stats-viewer__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 500;
}

.stats-viewer__lead,
.stats-status {
  margin: 0;
  color: var(--fog-dim);
  font-size: 0.9rem;
  line-height: 1.4;
}

/* Пустой aria-live статус не занимает место и не светит старые подсказки. */
.stats-status:empty {
  display: none;
}

/* Пока ждём API — статус заметнее, кнопка уже с is-busy. */
.stats-status--loading {
  color: var(--lime);
  font-weight: 600;
}

.stats-status--loading::before {
  content: "";
  display: inline-block;
  width: 0.7em;
  height: 0.7em;
  margin-right: 0.45em;
  border: 2px solid rgba(255, 255, 255, 0.25);
  border-top-color: var(--lime);
  border-radius: 50%;
  vertical-align: -0.05em;
  animation: stats-spin 0.7s linear infinite;
}

/* Пока upload пишет в DuckDB — вместо таблицы спокойная заглушка. */
.stats-processing {
  display: grid;
  gap: 0.45rem;
  justify-items: start;
  padding: 1.35rem 1.25rem;
  border: 1px dashed rgba(255, 255, 255, 0.35);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.08), transparent 55%),
    rgba(8, 12, 10, 0.55);
}

.stats-processing[hidden] {
  display: none;
}

.stats-processing__title {
  margin: 0;
  color: var(--lime);
  font-family: var(--font-display);
  font-size: 1.05rem;
  font-weight: 600;
}

.stats-processing__title::before {
  content: "";
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  margin-right: 0.5em;
  border: 2px solid rgba(255, 255, 255, 0.25);
  border-top-color: var(--lime);
  border-radius: 50%;
  vertical-align: -0.05em;
  animation: stats-spin 0.7s linear infinite;
}

@keyframes stats-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Фильтры — лёгкий toolbar без внешней «карточки в карточке». */
.stats-filters {
  container: inline-size / filter-bar;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}

.stats-filters__group,
.stats-filters__dates,
.stats-filters > .field,
.stats-filters__search {
  display: grid;
  gap: 0.5rem;
  min-width: 0;
  padding: 0.82rem 0.85rem 0.88rem;
  border: 1px solid rgba(200, 212, 204, 0.12);
  border-radius: 16px;
  background: rgba(9, 14, 12, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
  grid-column: span 3;
}

.stats-filters__dates {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-column: span 4;
}

.stats-filters__dates[data-mode-panel="day"] {
  grid-template-columns: minmax(0, 1fr);
  grid-column: span 3;
}

/* В режиме «Период» иначе сумма колонок = 13 и кнопка падает ниже. */
.stats-filters:has(.stats-filters__dates[data-mode-panel="range"]:not([hidden])) .stats-filters__search {
  grid-column: span 2;
}

/* Кнопка «Показать» в сетке без тёмного group--action и без фейковой подписи. */
.stats-filters__apply {
  box-sizing: border-box;
  grid-column: span 3;
  align-self: end;
  width: 100%;
  min-height: 3rem;
  margin: 0;
  padding-block: 0;
  padding-inline: 1.15rem;
  border-radius: 14px;
}

.stats-filters__mode {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  border: 0;
  min-inline-size: auto;
}

.stats-mode {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  box-sizing: border-box;
  min-height: 3rem;
  padding: 0.7rem 0.9rem;
  border: 1px solid rgba(200, 212, 204, 0.14);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.02)),
    rgba(255, 255, 255, 0.03);
  color: var(--fog);
  font-size: 0.84rem;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    color 0.18s ease,
    background-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s var(--ease-out);
}

.stats-mode:has(input:checked) {
  border-color: rgba(255, 255, 255, 0.58);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.2), transparent 62%),
    rgba(255, 255, 255, 0.12);
  color: var(--paper);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.stats-mode input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.stats-mode:hover {
  border-color: rgba(255, 255, 255, 0.34);
  color: var(--paper);
  transform: translateY(-1px);
}

.stats-mode:has(input:focus-visible) {
  outline: 2px solid rgba(255, 255, 255, 0.55);
  outline-offset: 2px;
}

/* Без !important display:flex перебивает [hidden] — панель периода остаётся видимой */
.stats-filters__dates[hidden] {
  display: none !important;
}

.stats-filters .field__label {
  display: block;
  margin: 0;
  min-height: 1.1rem;
  color: var(--fog);
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.1rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.stats-filters .field__input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 3rem;
  padding-block: 0;
  padding-inline: 0.95rem;
  border-color: rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(12, 18, 16, 0.88);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

/* Лупа внутри input — не обрезается краем поля и не конфликтует с webkit-search. */
.stats-filters input[type="search"].field__input {
  padding-right: 2.7rem;
  background-color: rgba(12, 18, 16, 0.88);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Ccircle cx='6.5' cy='6.5' r='4.25' stroke='%23ffffff' stroke-opacity='0.55' stroke-width='1.75'/%3E%3Cpath d='M10.1 10.1 13.75 13.75' stroke='%23ffffff' stroke-opacity='0.55' stroke-width='1.75' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.95rem center;
  background-size: 1rem 1rem;
}

.stats-filters input[type="search"].field__input::-webkit-search-decoration,
.stats-filters input[type="search"].field__input::-webkit-search-cancel-button,
.stats-filters input[type="search"].field__input::-webkit-search-results-button,
.stats-filters input[type="search"].field__input::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

.stats-filters select.field__input {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--lime) 50%),
    linear-gradient(135deg, var(--lime) 50%, transparent 50%);
  background-position:
    calc(100% - 1.1rem) 50%,
    calc(100% - 0.72rem) 50%;
  background-size: 0.42rem 0.42rem;
  background-repeat: no-repeat;
  padding-right: 2.6rem;
}

@container filter-bar (max-width: 58rem) {
  .stats-filters {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .stats-filters__group,
  .stats-filters > .field,
  .stats-filters__search,
  .stats-filters__apply {
    grid-column: span 3;
  }

  .stats-filters__dates {
    grid-column: span 6;
  }
}

@container filter-bar (max-width: 34rem) {
  .stats-filters {
    grid-template-columns: 1fr;
  }

  .stats-filters__group,
  .stats-filters__dates,
  .stats-filters > .field,
  .stats-filters__search,
  .stats-filters__apply,
  .stats-filters__dates[data-mode-panel="day"] {
    grid-column: 1 / -1;
  }

  .stats-filters__dates {
    grid-template-columns: 1fr;
  }
}

/* Таблица спроса: длинная подкатегория должна съедать пустую четверть строки. */
.demand-viewer .demand-filters__subcategory {
  grid-column: span 5;
}

.demand-viewer .stats-filters__search {
  grid-column: span 4;
}

.demand-viewer .demand-filters__apply {
  grid-column: span 3;
}

@container filter-bar (max-width: 58rem) {
  .demand-viewer .demand-filters__subcategory,
  .demand-viewer .stats-filters__search,
  .demand-viewer .demand-filters__apply {
    grid-column: span 3;
  }
}

@container filter-bar (max-width: 34rem) {
  .demand-viewer .demand-filters__subcategory,
  .demand-viewer .stats-filters__search,
  .demand-viewer .demand-filters__apply {
    grid-column: 1 / -1;
  }
}

.stats-table-shell {
  position: relative;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(6, 10, 8, 0.55);
}

/*
  Мягкие градиенты по краям оболочки: подсказка «справа/снизу ещё есть ячейки».
  Висят поверх скролла (pointer-events: none), поэтому sticky шапка и колонка города
  не ломаются. Классы is-overflow-* ставит маленький JS по scroll/resize.
*/
.stats-table-shell::before,
.stats-table-shell::after {
  content: "";
  position: absolute;
  z-index: 4;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s var(--ease-out);
}

/* Правый край — контент уезжает влево при горизонтальном скролле. */
.stats-table-shell::before {
  top: 0;
  right: 0;
  bottom: 0.7rem;
  width: 2rem;
  background: linear-gradient(
    to left,
    rgba(6, 10, 8, 0.98) 0%,
    rgba(18, 28, 22, 0.72) 38%,
    transparent 100%
  );
  box-shadow: -1px 0 0 rgba(255, 255, 255, 0.12);
}

/* Нижний край — контент уезжает вверх при вертикальном скролле. */
.stats-table-shell::after {
  left: 0;
  right: 0.7rem;
  bottom: 0;
  height: 1.65rem;
  background: linear-gradient(
    to top,
    rgba(6, 10, 8, 0.98) 0%,
    rgba(18, 28, 22, 0.65) 42%,
    transparent 100%
  );
  box-shadow: 0 -1px 0 rgba(255, 255, 255, 0.1);
}

.stats-table-shell.is-overflow-right::before,
.stats-table-shell.is-overflow-bottom::after {
  opacity: 1;
}

.stats-table-scroll {
  --scrollbar-thumb: rgba(255, 255, 255, 0.7);
  --scrollbar-thumb-hover: #ffffff;
  --scrollbar-track: #0c1310;

  overflow: auto;
  max-height: min(62dvh, 36rem);
  /* Sticky thead работает только внутри этого скролла; containment ломает прилипание. */
  position: relative;
  background: #0a100d;
  /* Новый stacking context без isolation:isolate — меньше сюрпризов с z-index. */
  z-index: 0;
  /* Колесо/тач не «пробрасывают» скролл на страницу за таблицей. */
  overscroll-behavior: contain;
}

/*
  Firefox и браузеры без ::-webkit-scrollbar: стандартные scrollbar-*.
  В Chromium нельзя одновременно задавать scrollbar-color/width и webkit-псевдоэлементы —
  стандартные свойства полностью отключают скруглённый бегунок. Поэтому они
  только здесь, а Chrome/Edge/Safari получают WebKit ниже.
*/
@supports not selector(::-webkit-scrollbar) {
  .stats-table-scroll {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
  }
}

/* WebKit/Blink: тонкий скруглённый бегунок в палитре авито.228 (лайм на тёмном треке). */
.stats-table-scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.stats-table-scroll::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
  border-radius: 999px;
  margin: 2px;
}

.stats-table-scroll::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 999px;
  border: 2px solid var(--scrollbar-track);
  background-clip: padding-box;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.25);
}

.stats-table-scroll::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

.stats-table-scroll::-webkit-scrollbar-corner {
  background: var(--scrollbar-track);
}

.stats-table {
  width: max-content;
  min-width: 100%;
  /* separate + 0: sticky работает; collapse ломает прилипание шапки. */
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.86rem;
}

/*
  Chrome/tables: sticky th иначе рисуется ПОД следующими строками.
  Разные stacking context у thead и tbody чинят перекрытие цифр.
*/
.stats-table thead {
  position: relative;
  z-index: 5;
}

.stats-table tbody {
  position: relative;
  z-index: 1;
}

.stats-table th,
.stats-table td {
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid rgba(200, 212, 204, 0.08);
  white-space: nowrap;
  text-align: right;
  font-variant-numeric: tabular-nums;
  background-color: #0a100d;
}

.stats-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  /* Полностью непрозрачный фон — иначе цифры «просвечивают» через шапку. */
  background-color: #121c17;
  background-clip: padding-box;
  color: var(--fog);
  font-weight: 600;
  text-align: right;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12);
  /* Отдельный слой композиции — меньше сюрпризов с paint order. */
  transform: translateZ(0);
}

/* Кликабельный заголовок: сортировка без ломания sticky. */
.stats-table__sort-btn {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35em;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-align: inherit;
  cursor: pointer;
  border-radius: 0.2rem;
}

.stats-table__sort-btn--start {
  justify-content: flex-start;
  width: 100%;
}

.stats-table__sort-btn:hover,
.stats-table__sort-btn:focus-visible {
  color: var(--lime);
}

.stats-table__sort-btn:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.55);
  outline-offset: 2px;
}

.stats-table thead th.is-sorted,
.stats-table thead th.is-sorted .stats-table__sort-btn {
  color: var(--lime);
}

.stats-table__sort-label {
  overflow: hidden;
  text-overflow: ellipsis;
}

.stats-table__sort-indicator {
  flex: 0 0 auto;
  min-width: 0.75em;
  font-size: 0.68em;
  line-height: 1;
  opacity: 0.92;
}

.stats-table tbody td {
  position: relative;
  z-index: 0;
}

.stats-table tbody .stats-table__city-col {
  position: sticky;
  left: 0;
  z-index: 2;
  text-align: left !important;
  background-color: #0c1310;
  color: var(--paper);
  font-weight: 600;
  /* Тень справа от sticky-города: вместо левого fade, чтобы не затемнять названия. */
  box-shadow:
    10px 0 18px -12px rgba(0, 0, 0, 0.78),
    1px 0 0 rgba(255, 255, 255, 0.1);
  transform: translateZ(0);
}

/* Кнопка ▶ и название города в одной линии. */
.stats-table tbody .stats-table__row--parent .stats-table__city-col {
  display: flex;
  align-items: center;
}

.stats-table thead .stats-table__city-col {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 6;
  background-color: #121c17;
  color: var(--lime);
  font-family: var(--font-display);
  font-size: 0.78rem;
  letter-spacing: 0.02em;
  box-shadow:
    10px 0 18px -12px rgba(0, 0, 0, 0.78),
    0 1px 0 rgba(255, 255, 255, 0.12),
    1px 0 0 rgba(255, 255, 255, 0.1);
}

.stats-table tbody tr:nth-child(even) td {
  background-color: #0d1511;
}

.stats-table tbody tr:nth-child(even) .stats-table__city-col {
  background-color: #0e1713;
}

.stats-table tbody tr:hover td {
  background-color: #122018;
}

.stats-table tbody tr:hover .stats-table__city-col {
  background-color: #13241a;
}

.stats-table tbody tr:last-child th,
.stats-table tbody tr:last-child td {
  border-bottom: 0;
}

.text-link:hover,
.text-link:focus-visible {
  text-decoration: underline;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@keyframes rise-in {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes brand-settle {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
    letter-spacing: 0.02em;
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    letter-spacing: -0.04em;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }

  .app-dialog,
  .app-dialog[open],
  .upload-dialog,
  .upload-dialog[open] {
    transform: none;
  }
}

@media (pointer: coarse) {
  .field__input,
  .submit-button {
    min-height: 52px;
  }
}

/* ===== AppNotice: прогресс фоновой загрузки (см. 30-notifications.mdc) ===== */

.app-notice-host {
  position: fixed;
  right: max(1rem, env(safe-area-inset-right));
  bottom: max(1rem, env(safe-area-inset-bottom));
  z-index: 80;
  display: grid;
  gap: 0.75rem;
  width: min(100% - 2rem, 22.5rem);
  pointer-events: none;
}

.app-notice {
  position: relative;
  overflow: hidden;
  pointer-events: auto;
  padding: 1rem 1.05rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.12), transparent 42%),
    rgba(10, 16, 13, 0.78);
  backdrop-filter: blur(18px) saturate(1.2);
  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(255, 255, 255, 0.03) inset;
  animation: app-notice-in 0.45s var(--ease-out) both;
}

.app-notice--leaving {
  animation: app-notice-out 0.28s var(--ease-out) both;
}

.app-notice__glow {
  position: absolute;
  top: -40%;
  right: -20%;
  width: 9rem;
  height: 9rem;
  border-radius: 50%;
  /* Мягкое «дыхание» огонька — без резких скачков opacity 0↔1. */
  background: radial-gradient(circle, rgba(255, 255, 255, 0.38), transparent 68%);
  filter: blur(12px);
  opacity: 0.65;
  pointer-events: none;
  will-change: transform, opacity;
  animation: app-notice-glow 3.2s ease-in-out infinite alternate;
}

.app-notice__header {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.app-notice__titles {
  display: grid;
  gap: 0.15rem;
  min-width: 0;
}

.app-notice__eyebrow {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--lime);
  text-transform: lowercase;
}

.app-notice__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 500;
  color: var(--paper);
}

.app-notice__close {
  flex: 0 0 auto;
  width: 2rem;
  height: 2rem;
  border: 1px solid rgba(200, 212, 204, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--fog);
  font-size: 0.85rem;
  line-height: 1;
  cursor: pointer;
  transition:
    border-color 0.2s ease,
    color 0.2s ease,
    background-color 0.2s ease;
}

.app-notice__close:hover,
.app-notice__close:focus-visible {
  border-color: rgba(255, 255, 255, 0.5);
  color: var(--paper);
  background: rgba(255, 255, 255, 0.1);
  outline: none;
}

.app-notice__message {
  position: relative;
  margin: 0.65rem 0 0;
  color: var(--fog);
  font-size: 0.9rem;
  line-height: 1.4;
}

.app-notice__bar {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0.65rem;
  margin-top: 0.9rem;
}

.app-notice__track {
  height: 0.55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.35);
}

.app-notice__fill {
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--lime-deep), var(--lime));
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.45);
  /* Плавный рост % при опросе; keyframes не трогаем из JS. */
  transition: width 0.35s ease;
}

.app-notice--running .app-notice__fill {
  /* Длинный сдвиг градиента — перелив, а не мигание. */
  background-image: linear-gradient(
    90deg,
    var(--lime-deep) 0%,
    var(--lime) 35%,
    #e8ff9a 50%,
    var(--lime) 65%,
    var(--lime-deep) 100%
  );
  background-size: 220% 100%;
  animation: app-notice-shimmer 2.8s linear infinite;
}

.app-notice__percent {
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--lime);
  min-width: 2.6rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.app-notice--done {
  border-color: rgba(255, 255, 255, 0.55);
}

.app-notice--done .app-notice__title {
  color: var(--lime);
}

.app-notice--error {
  border-color: rgba(255, 107, 90, 0.45);
  background:
    linear-gradient(145deg, rgba(255, 107, 90, 0.12), transparent 42%),
    rgba(16, 10, 10, 0.82);
}

.app-notice--error .app-notice__eyebrow,
.app-notice--error .app-notice__percent {
  color: var(--danger);
}

.app-notice--error .app-notice__fill {
  background: linear-gradient(90deg, #c94a3c, var(--danger));
  box-shadow: none;
  animation: none;
}

@keyframes app-notice-in {
  from {
    opacity: 0;
    transform: translate3d(0, 1rem, 0) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes app-notice-out {
  to {
    opacity: 0;
    transform: translate3d(0, 0.6rem, 0) scale(0.97);
  }
}

@keyframes app-notice-glow {
  from {
    opacity: 0.5;
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    opacity: 0.82;
    transform: translate3d(-6%, 4%, 0) scale(1.12);
  }
}

@keyframes app-notice-shimmer {
  from {
    background-position: 0% 0;
  }
  to {
    background-position: 100% 0;
  }
}

@keyframes upload-tile-shimmer {
  from {
    background-position: 0% 0;
  }
  to {
    background-position: 100% 0;
  }
}

@keyframes upload-tile-glow {
  from {
    transform: translate3d(0, 0, 0) scale(1);
    opacity: 0.48;
  }
  to {
    transform: translate3d(-8%, 5%, 0) scale(1.08);
    opacity: 0.92;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-notice,
  .app-notice--leaving,
  .app-notice__glow,
  .app-notice--running .app-notice__fill,
  .upload-tile__progress[data-state="running"]::after,
  .upload-tile__progress[data-state="running"] .upload-tile__fill {
    animation: none !important;
  }

  .app-notice__fill,
  .upload-tile__fill,
  .stats-mode {
    transition: none !important;
  }
}

/* ─── Рейтинг городов (#branch-score-ranking / .bsr) ─────────────────── */

.bsr {
  margin-bottom: 1.5rem;
}

/* Заголовок-аккордеон: убираем браузерный маркер, добавляем стрелку */
.bsr__summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--lime);
  padding: 0.4rem 0;
  user-select: none;
}

.bsr__summary::-webkit-details-marker {
  display: none;
}

.bsr__summary::before {
  content: "▸";
  font-size: 0.75rem;
  transition: transform 0.15s var(--ease-out);
}

.bsr[open] .bsr__summary::before {
  transform: rotate(90deg);
}

.bsr__hint {
  font-weight: 400;
  color: var(--fog-dim);
  font-size: 0.75rem;
}

.bsr__scroll {
  overflow-x: auto;
  margin-top: 0.5rem;
}

.bsr__table {
  border-collapse: collapse;
  font-size: 0.75rem;
  font-family: "Menlo", "Consolas", "Courier New", monospace;
  white-space: nowrap;
  width: 100%;
}

.bsr__table thead tr {
  border-bottom: 1px solid var(--line);
}

.bsr__col {
  padding: 0.3rem 0.65rem;
  text-align: right;
  color: var(--fog);
}

.bsr__col--place,
.bsr__col--city {
  text-align: left;
}

.bsr__table thead .bsr__col {
  color: var(--fog-dim);
  font-size: 0.6875rem;
  font-family: var(--font-body);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Score — lime-акцент как основной ориентир */
.bsr__col--score {
  color: var(--lime);
  font-weight: 600;
}

.bsr__table tbody tr:hover {
  background: rgba(255, 255, 255, 0.05);
}

/* ─── Какие города размещать? (#placement-recommend) ─────────────────── */

/*
  min-width:0 + max-width:100% по цепочке: иначе grid-ячейка с min-width:auto
  раздувается под 16 колонок, скролл-контейнер становится равен таблице
  и горизонтальной полосы внутри не появляется (страница просто обрезает край).
*/
.placement-recommend {
  margin-top: 1.75rem;
  min-width: 0;
  max-width: 100%;
}

.placement-recommend__results,
.placement-recommend__block,
.placement-recommend__table-shell {
  min-width: 0;
  max-width: 100%;
}

.placement-recommend__title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem;
}

.placement-recommend__formula-button {
  flex: 0 0 auto;
  min-height: 2.25rem;
  margin: 0;
  padding: 0.45rem 0.8rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  color: var(--lime);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    background-color 0.18s ease,
    color 0.18s ease,
    transform 0.18s var(--ease-out);
}

.placement-recommend__formula-button:hover {
  border-color: rgba(255, 255, 255, 0.62);
  background: rgba(255, 255, 255, 0.16);
  color: var(--paper);
  transform: translateY(-1px);
}

.placement-recommend__formula-button:focus-visible {
  outline: 2px solid var(--paper);
  outline-offset: 3px;
}

.placement-recommend__form {
  display: grid;
  gap: 1.1rem;
  margin: 1rem 0 0.75rem;
}

.placement-recommend__limits {
  display: grid;
  gap: 1rem;
}

@media (min-width: 900px) {
  .placement-recommend__limits {
    grid-template-columns: 1fr 1fr;
    gap: 1.1rem;
  }
}

.placement-recommend__limit-card {
  display: grid;
  gap: 0.75rem;
  padding: 1rem 1.05rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.06), transparent 55%),
    rgba(255, 255, 255, 0.025);
}

.placement-recommend__limit-label {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--paper);
}

.placement-recommend__limit-row {
  display: grid;
  gap: 0.85rem;
  align-items: end;
}

@media (min-width: 560px) {
  .placement-recommend__limit-row {
    grid-template-columns: minmax(7rem, 8.5rem) 1fr;
    align-items: stretch;
  }
}

.placement-recommend__limit-row .field__input.is-disabled,
.placement-recommend__limit-row .field__input:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.placement-recommend__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
}

.placement-recommend__submit,
.placement-recommend__export {
  margin-top: 0;
  justify-self: start;
  min-width: 10rem;
}

/*
  Вторичная CTA рядом с lime primary: контур, не destructive.
  Расширяет .app-button без нового примитива «кнопок вообще».
*/
.placement-recommend__export.app-button {
  color: var(--lime);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.38);
  box-shadow: none;
}

.placement-recommend__export.app-button:hover {
  color: var(--paper);
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.62);
  filter: none;
  transform: translateY(-1px);
}

.placement-recommend__results {
  display: grid;
  gap: 1.35rem;
  margin-top: 0.75rem;
}

/* Строки текста «город[, район]» после расчёта (не кнопка XLSX). */
.placement-recommend__city-texts {
  display: grid;
  gap: 1rem;
}

.placement-recommend__city-text-row {
  display: grid;
  gap: 0.45rem;
}

.placement-recommend__city-text-label {
  margin: 0;
  color: var(--paper);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.placement-recommend__city-text-field {
  width: 100%;
  min-height: 5.5rem;
  resize: vertical;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 14px;
  padding: 0.85rem 1rem;
  background: #0a100d;
  color: var(--paper);
  font: inherit;
  font-size: 0.92rem;
  line-height: 1.45;
  white-space: pre;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.placement-recommend__city-text-field:focus-visible {
  outline: 2px solid var(--lime);
  outline-offset: 2px;
}

.placement-recommend__city-text-copy {
  justify-self: start;
  min-height: 2.6rem;
  min-width: auto;
  margin-top: 0;
  padding: 0.55rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: var(--lime);
  font-size: 0.82rem;
  box-shadow: none;
}

.placement-recommend__city-text-copy:hover {
  border-color: rgba(255, 255, 255, 0.62);
  background: rgba(255, 255, 255, 0.18);
  color: var(--paper);
  filter: none;
  transform: translateY(-1px);
}

.placement-recommend__block-title {
  margin: 0 0 0.55rem;
  font-family: var(--font-display);
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--lime);
  letter-spacing: -0.01em;
}

.placement-recommend__empty {
  margin: 0;
  font-size: 0.85rem;
  color: rgba(232, 240, 234, 0.62);
}

/*
  Оболочка как у stats-table-shell: клип + градиент справа.
  Скролл только у .placement-recommend__scroll — иначе html/body
  с overflow-x:hidden съедают горизонтальную полосу.
*/
.placement-recommend__table-shell {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 14px;
  background: #0a100d;
}

.placement-recommend__table-shell::after {
  content: "";
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0.7rem;
  width: 2.4rem;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(
    to left,
    rgba(10, 16, 13, 0.98) 0%,
    rgba(18, 28, 22, 0.72) 38%,
    transparent 100%
  );
  box-shadow: -1px 0 0 rgba(255, 255, 255, 0.16);
  transition: opacity 0.2s var(--ease-out);
}

.placement-recommend__table-shell.is-overflow-right::after {
  opacity: 1;
}

.placement-recommend__scroll {
  --scrollbar-thumb: rgba(255, 255, 255, 0.7);
  --scrollbar-thumb-hover: #ffffff;
  --scrollbar-track: #0c1310;

  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: auto;
  max-height: min(62dvh, 34rem);
  overscroll-behavior: contain;
  outline: none;
  position: relative;
  z-index: 0;
  background: #0a100d;
}

.placement-recommend__scroll:focus-visible {
  box-shadow:
    inset 0 0 0 2px var(--lime),
    inset 0 0 0 5px rgba(255, 255, 255, 0.18);
}

@supports not selector(::-webkit-scrollbar) {
  .placement-recommend__scroll {
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
  }
}

.placement-recommend__scroll::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

.placement-recommend__scroll::-webkit-scrollbar-track,
.placement-recommend__scroll::-webkit-scrollbar-corner {
  background: var(--scrollbar-track);
  border-radius: 999px;
}

.placement-recommend__scroll::-webkit-scrollbar-thumb {
  border: 2px solid var(--scrollbar-track);
  border-radius: 999px;
  background: var(--scrollbar-thumb);
  background-clip: padding-box;
}

.placement-recommend__scroll::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}

/*
  Главный фикс скролла: .bsr__table задаёт width:100% и сжимает колонки
  в ширину контейнера — горизонтальный overflow не появляется.
  max-content заставляет таблицу расти по содержимому (16 колонок).
*/
.placement-recommend__table.bsr__table,
.placement-recommend__table {
  width: max-content;
  min-width: 100%;
  margin: 0;
  /* separate нужен для sticky # / город (collapse ломает прилипание). */
  border-collapse: separate;
  border-spacing: 0;
  font-size: 0.78rem;
}

.placement-recommend__table thead {
  position: relative;
  z-index: 5;
}

.placement-recommend__table tbody {
  position: relative;
  z-index: 1;
}

.placement-recommend__table .bsr__col {
  min-width: 5.75rem;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid rgba(200, 212, 204, 0.08);
  background-color: #0a100d;
  font-variant-numeric: tabular-nums;
}

.placement-recommend__table thead .bsr__col {
  position: sticky;
  top: 0;
  z-index: 5;
  background-color: #121c17;
  background-clip: padding-box;
  color: var(--fog);
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12);
  transform: translateZ(0);
}

.placement-recommend__table tbody tr:nth-child(even) .bsr__col {
  background-color: #0d1511;
}

.placement-recommend__table tbody tr:hover .bsr__col {
  background-color: #122018;
}

/* Sticky первые колонки: # и город не уезжают при горизонтальном скролле. */
.placement-recommend__table .bsr__col--place {
  position: sticky;
  left: 0;
  z-index: 2;
  min-width: 2.75rem;
  width: 2.75rem;
  color: var(--fog-dim);
  background-color: #0c1310;
  box-shadow: 1px 0 0 rgba(255, 255, 255, 0.08);
  transform: translateZ(0);
}

.placement-recommend__table .bsr__col--city {
  position: sticky;
  left: 2.75rem;
  z-index: 2;
  min-width: 8.5rem;
  color: var(--paper);
  font-weight: 600;
  background-color: #0c1310;
  box-shadow:
    10px 0 18px -12px rgba(0, 0, 0, 0.78),
    1px 0 0 rgba(255, 255, 255, 0.1);
  transform: translateZ(0);
}

.placement-recommend__table thead .bsr__col--place,
.placement-recommend__table thead .bsr__col--city {
  z-index: 6;
  background-color: #121c17;
  color: var(--lime);
}

.placement-recommend__table tbody tr:nth-child(even) .bsr__col--place,
.placement-recommend__table tbody tr:nth-child(even) .bsr__col--city {
  background-color: #0e1713;
}

.placement-recommend__table tbody tr:hover .bsr__col--place,
.placement-recommend__table tbody tr:hover .bsr__col--city {
  background-color: #13241a;
}

.placement-recommend__table .bsr__col--score {
  min-width: 8.25rem;
  color: var(--lime);
  font-weight: 700;
  background-image: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.06),
    transparent
  );
}

.placement-recommend__table thead .bsr__col--score {
  color: var(--lime);
}

.placement-formula-dialog__alert {
  --app-alert-border: rgba(255, 255, 255, 0.36);
  --app-alert-glow: rgba(255, 255, 255, 0.16);
  --app-alert-surface-start: rgba(20, 35, 17, 0.95);
  --app-alert-surface-end: rgba(10, 18, 12, 0.92);
  --app-alert-badge-bg: rgba(255, 255, 255, 0.16);
  --app-alert-badge-border: rgba(255, 255, 255, 0.42);
  --app-alert-badge-text: var(--lime);
  --app-alert-title: var(--paper);
  --app-alert-text: var(--fog);
}

.placement-formula-dialog__content {
  display: grid;
  gap: 0.75rem;
  color: var(--fog);
  font-size: 0.9rem;
  line-height: 1.5;
}

.placement-formula-dialog__content p {
  margin: 0;
}

/* ─── Применение цен ЦП ──────────────────────────────────────────────── */

.listings-cpx-apply {
  margin-top: 0.25rem;
}

.listings-cpx-apply__body {
  display: grid;
  gap: 1rem;
  margin-top: 0.85rem;
}

.listings-cpx-apply__mode {
  justify-self: start;
  max-width: 28rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  background: rgba(9, 14, 12, 0.55);
}

.listings-cpx-apply__account {
  max-width: 22rem;
}

.listings-cpx-apply__mode-block {
  display: grid;
  gap: 0.9rem;
  padding: 0.95rem 1rem;
  border: 1px solid rgba(200, 212, 204, 0.12);
  border-radius: 18px;
  background:
    linear-gradient(165deg, rgba(18, 28, 22, 0.72), rgba(8, 12, 10, 0.88));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
}

.listings-cpx-apply__mode-block[hidden] {
  display: none !important;
}

.listings-cpx-apply__range {
  display: grid;
  gap: 0.75rem;
}

@media (min-width: 520px) {
  .listings-cpx-apply__range {
    grid-template-columns: 1fr 1fr;
  }
}

.listings-cpx-apply select.field__input,
.listings-cpx-apply__select {
  appearance: none;
  background-color: rgba(6, 10, 8, 0.72);
  background-image:
    linear-gradient(45deg, transparent 50%, var(--lime) 50%),
    linear-gradient(135deg, var(--lime) 50%, transparent 50%);
  background-position:
    calc(100% - 1.1rem) 50%,
    calc(100% - 0.72rem) 50%;
  background-size: 0.42rem 0.42rem;
  background-repeat: no-repeat;
  padding-right: 2.6rem;
  color: var(--paper);
  cursor: pointer;
}

.listings-cpx-apply__cities-field {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
}

.listings-cpx-apply__cities-field .field__label {
  margin-bottom: 0.35rem;
}

.listings-cpx-apply__cities-hint {
  margin: 0 0 0.65rem;
  color: var(--fog-dim);
  font-size: 0.82rem;
  line-height: 1.4;
}

.listings-cpx-apply__cities {
  display: grid;
  gap: 0.5rem;
  max-height: 14rem;
  overflow: auto;
  padding: 0.15rem 0.2rem 0.15rem 0;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}

@media (min-width: 720px) {
  .listings-cpx-apply__cities {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.listings-cpx-apply__city-switch {
  padding: 0.7rem 0.85rem;
}

.listings-cpx-apply__cities-empty {
  margin: 0;
  color: var(--fog-dim);
  font-size: 0.88rem;
  line-height: 1.4;
}

.listings-cpx-apply__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
}

.listings-cpx-apply__actions .app-button[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

.listings-cpx-apply__status.is-error {
  color: #ffb4a2;
}

.listings-cpx-apply__console {
  margin-top: 0.75rem;
}

.listings-cpx-apply__results,
.listings-cpx-apply__apply-results {
  display: grid;
  gap: 0.65rem;
}

.listings-cpx-apply__preview {
  display: grid;
  gap: 0.65rem;
}

.listings-cpx-apply__listing-link {
  color: var(--lime, #ffffff);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.35);
  transition: color 160ms ease, border-color 160ms ease;
}

.listings-cpx-apply__listing-link:hover,
.listings-cpx-apply__listing-link:focus-visible {
  color: #d4ff6a;
  border-bottom-color: rgba(212, 255, 106, 0.7);
  outline: none;
}

.listings-cpx-apply__apply-title {
  margin: 0;
  color: var(--paper);
  font-size: 0.92rem;
  font-weight: 600;
}

.listings-cpx-apply__table-shell {
  overflow: auto;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  background: rgba(6, 10, 8, 0.55);
}

.listings-cpx-apply__table {
  width: 100%;
  border-collapse: collapse;
  min-width: 18rem;
}

.listings-cpx-apply__table th,
.listings-cpx-apply__table td {
  padding: 0.65rem 0.85rem;
  border-bottom: 1px solid rgba(200, 212, 204, 0.08);
  text-align: left;
  font-size: 0.9rem;
}

.listings-cpx-apply__table th {
  color: var(--fog-dim);
  font-weight: 600;
  letter-spacing: 0.02em;
  background: rgba(12, 18, 14, 0.9);
  position: sticky;
  top: 0;
}

.listings-cpx-apply__table th:last-child,
.listings-cpx-apply__table td:last-child {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.listings-cpx-apply__table td:first-child {
  color: var(--paper);
}

.listings-cpx-apply__table td:last-child {
  color: var(--lime);
  font-weight: 650;
}

.listings-cpx-apply__table tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.015);
}

.listings-cpx-apply__table tbody tr:hover td {
  background: rgba(255, 255, 255, 0.05);
}

.listings-cpx-apply__table tbody tr.is-error td {
  color: #ffb4a2;
}

.listings-cpx-apply__table tbody tr.is-error td:last-child {
  color: #ffb4a2;
  font-weight: 500;
}

.listings-cpx-apply .app-alert code {
  color: #ffd9a8;
  font-size: 0.86em;
}

.placement-recommend__export[href] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

@media (max-width: 520px) {
  .placement-recommend__title-row {
    align-items: flex-start;
  }

  .placement-recommend__formula-button {
    min-height: 2.5rem;
  }

  .placement-recommend__actions {
    flex-direction: column;
    align-items: stretch;
  }

  .placement-recommend__submit,
  .placement-recommend__export {
    width: 100%;
  }
}

/* ===== Глобальные аккаунты: большой диалог + пикеры у кнопок запуска ===== */

.accounts-dialog {
  width: min(100% - 1.25rem, 64rem);
  max-height: min(92dvh, 52rem);
}

.accounts-dialog__panel {
  max-height: min(92dvh, 52rem);
  gap: 1.25rem;
}

.accounts-dialog__content {
  display: grid;
  gap: 1.25rem;
}

.accounts-layout {
  display: grid;
  grid-template-columns: minmax(14rem, 0.9fr) minmax(0, 1.35fr);
  gap: 1.1rem;
  align-items: start;
}

.accounts-section {
  display: grid;
  gap: 0.75rem;
  padding: 1rem 1.05rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.06), transparent 45%),
    rgba(255, 255, 255, 0.025);
}

.accounts-section__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
}

.accounts-section__title {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: var(--paper);
}

.accounts-section__lead {
  margin: 0.25rem 0 0;
  color: var(--fog-dim);
  font-size: 0.84rem;
  line-height: 1.4;
}

.accounts-section__actions {
  display: flex;
  justify-content: flex-end;
}

.accounts-fields {
  display: grid;
  gap: 0.85rem;
}

.accounts-fields--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.partner-leads-sources-list {
  display: grid;
  gap: 0.75rem;
}

.partner-leads-source-row {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  align-items: end;
}

.partner-leads-source-row__actions {
  display: flex;
  align-items: flex-end;
  padding-bottom: 0.1rem;
}

.accounts-add-button {
  flex: 0 0 auto;
  margin: 0;
  padding: 0.55rem 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: var(--lime);
  font: inherit;
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    color 0.18s ease;
}

.accounts-add-button:hover,
.accounts-add-button:focus-visible {
  border-color: rgba(255, 255, 255, 0.65);
  background: rgba(255, 255, 255, 0.18);
  color: var(--paper);
  outline: none;
}

.accounts-card-list {
  display: grid;
  gap: 0.65rem;
  max-height: min(42dvh, 22rem);
  overflow: auto;
  padding-right: 0.15rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}

.accounts-card-list__empty {
  margin: 0;
  padding: 0.85rem 0.95rem;
  border: 1px dashed rgba(200, 212, 204, 0.22);
  border-radius: 12px;
  color: var(--fog-dim);
  font-size: 0.88rem;
  line-height: 1.4;
}

.accounts-card {
  display: grid;
  gap: 0.28rem;
  width: 100%;
  margin: 0;
  padding: 0.9rem 0.95rem;
  border: 1px solid rgba(200, 212, 204, 0.16);
  border-radius: 14px;
  background: rgba(8, 12, 10, 0.45);
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s var(--ease-out);
}

.accounts-card:hover,
.accounts-card:focus-visible {
  border-color: rgba(255, 255, 255, 0.45);
  background: rgba(255, 255, 255, 0.07);
  outline: none;
}

.accounts-card.is-selected {
  border-color: rgba(255, 255, 255, 0.7);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.14), transparent 55%),
    rgba(255, 255, 255, 0.08);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.accounts-card__title {
  font-family: var(--font-display);
  font-size: 0.98rem;
  font-weight: 650;
  color: var(--paper);
}

.accounts-card__meta,
.accounts-card__profile {
  color: var(--fog-dim);
  font-size: 0.82rem;
  line-height: 1.35;
}

.accounts-card__badge {
  justify-self: start;
  margin-top: 0.25rem;
  padding: 0.18rem 0.55rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.accounts-card__badge--yes {
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: rgba(255, 255, 255, 0.14);
  color: var(--lime);
}

.accounts-card__badge--no {
  border: 1px solid rgba(200, 212, 204, 0.2);
  background: rgba(255, 255, 255, 0.04);
  color: var(--fog-dim);
}

.accounts-fieldset {
  margin: 0;
  padding: 0.85rem 0.9rem 1rem;
  border: 1px solid rgba(200, 212, 204, 0.14);
  border-radius: 14px;
  display: grid;
  gap: 0.75rem;
  min-width: 0;
}

.accounts-fieldset__legend {
  padding: 0 0.25rem;
  font-family: var(--font-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lime);
}

.accounts-proxy-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.accounts-proxy-toggle {
  margin: 0;
  padding: 0.45rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--fog);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 650;
  cursor: pointer;
  transition:
    border-color 0.18s ease,
    color 0.18s ease,
    background 0.18s ease;
}

.accounts-proxy-toggle:hover,
.accounts-proxy-toggle:focus-visible,
.accounts-proxy-toggle[aria-expanded="true"] {
  border-color: rgba(255, 255, 255, 0.55);
  color: var(--lime);
  background: rgba(255, 255, 255, 0.08);
  outline: none;
}

.accounts-proxy-hint {
  margin: 0;
  color: #ffd9a8;
  font-size: 0.82rem;
  line-height: 1.35;
}

.accounts-proxy-advanced {
  display: grid;
  gap: 0.75rem;
  animation: accounts-reveal 0.22s var(--ease-out);
}

/* display:grid иначе перебивает [hidden] — «Расширенно» не скрывает поля. */
.accounts-proxy-advanced[hidden] {
  display: none !important;
}

@keyframes accounts-reveal {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.accounts-editor-form {
  display: grid;
  gap: 0.85rem;
}

.accounts-editor-actions {
  margin-top: 0.15rem;
}

.accounts-editor-actions .app-dialog__confirm--danger {
  margin-right: auto;
}

.account-picker {
  display: grid;
  gap: 0.45rem;
  margin-bottom: 0.85rem;
  padding: 0.95rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 14px;
  background:
    linear-gradient(150deg, rgba(255, 255, 255, 0.07), transparent 50%),
    rgba(255, 255, 255, 0.03);
}

.account-picker__label {
  margin: 0;
  font-family: var(--font-display);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lime);
}

.account-picker__control {
  position: relative;
}

.account-picker__select {
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
  padding-right: 2.4rem;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--lime) 50%),
    linear-gradient(135deg, var(--lime) 50%, transparent 50%);
  background-position:
    calc(100% - 1.15rem) 50%,
    calc(100% - 0.75rem) 50%;
  background-size: 0.4rem 0.4rem, 0.4rem 0.4rem;
  background-repeat: no-repeat;
  cursor: pointer;
}

.account-picker__hint {
  margin: 0;
  color: var(--fog-dim);
  font-size: 0.82rem;
  line-height: 1.35;
}

.account-picker__switches {
  display: grid;
  gap: 0.55rem;
  max-height: 16rem;
  overflow: auto;
  padding-right: 0.1rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}

.account-picker__switch {
  padding: 0.8rem 0.9rem;
}

/* Период синка объявлений: даты + ярлыки, без новой design-language. */
.listings-period {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 0.85rem;
  align-items: end;
  margin: 0.15rem 0 0.35rem;
}

.listings-period .field {
  flex: 1 1 9rem;
  min-width: 8.5rem;
  margin: 0;
}

.listings-period__shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  width: 100%;
}

.listings-period__shortcuts .admin-open-button {
  width: auto;
  min-width: 0;
  padding-inline: 0.85rem;
}

.listings-sync-dialog__content {
  display: grid;
  gap: 0.95rem;
}

/* Просмотрщик объявлений внутри панели синка. */
.listings-viewer {
  margin-top: 1.35rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.listings-viewer .stats-viewer__title {
  font-size: 1.05rem;
}

.listings-viewer__filters {
  align-items: start;
}

.listings-viewer__account {
  min-width: 14rem;
  grid-column: span 4;
}

.listings-viewer__period {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 0.85rem;
  align-items: end;
  grid-column: span 5;
  min-width: 0;
  padding: 0.82rem 0.85rem 0.88rem;
  border: 1px solid rgba(200, 212, 204, 0.12);
  border-radius: 16px;
  background: rgba(9, 14, 12, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

.listings-viewer__period .field {
  flex: 1 1 9rem;
  min-width: 8.5rem;
  margin: 0;
}

.listings-viewer__shortcuts {
  width: 100%;
}

.listings-viewer__categories {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 100%;
  grid-column: 1 / -1;
}

.listings-viewer__categories .field__label {
  margin-bottom: 0.55rem;
}

.listings-viewer__category-switches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 0.75rem;
}

.listings-viewer__category-switch {
  padding: 0.55rem 0.75rem;
  border-radius: 0.85rem;
  background: rgba(12, 16, 12, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.listings-viewer__hint {
  margin: 0;
  color: rgba(220, 230, 210, 0.62);
  font-size: 0.88rem;
}

.listings-viewer__apply {
  align-self: end;
}

.listings-viewer__title-col {
  min-width: 14rem;
}

.listings-viewer__title-link {
  color: #ffffff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.35);
}

.listings-viewer__title-link:hover {
  border-bottom-color: #ffffff;
}

.listings-viewer__day-row .stats-table__city-col--child {
  font-family: ui-monospace, "Cascadia Code", "Consolas", monospace;
  font-size: 0.86em;
  font-weight: 500;
  color: var(--fog);
}

.listings-viewer__empty-days {
  color: rgba(220, 230, 210, 0.55);
  font-size: 0.9rem;
  padding-left: 2.4rem !important;
  text-align: left !important;
}

.listings-batch-editor__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(18rem, 0.8fr);
  gap: 1rem;
  align-items: start;
}

.listings-batch-editor__cards,
.listings-batch-editor__controls,
.listings-batch-editor__preview {
  display: grid;
  gap: 0.85rem;
}

.listings-batch-editor__selection,
.listings-batch-editor__card-meta {
  margin: 0;
  color: rgba(220, 230, 210, 0.65);
  font-size: 0.86rem;
}

.listings-batch-editor__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
  gap: 0.8rem;
}

.listings-batch-editor__card,
.listings-batch-editor__form,
.listings-batch-editor__preview {
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 14px;
  background: rgba(9, 14, 12, 0.54);
  padding: 0.8rem;
}

.listings-batch-editor__card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.65rem;
}

.listings-batch-editor__card > .admin-open-button,
.listings-batch-editor__card-title,
.listings-batch-editor__card-meta {
  grid-column: 1 / -1;
}

.listings-batch-editor__thumbnail {
  width: 100%;
  height: 7.5rem;
  object-fit: cover;
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.06);
}

.listings-batch-editor__card-title,
.listings-batch-editor__form h3,
.listings-batch-editor__preview h3 {
  margin: 0;
  font-size: 0.96rem;
}

.listings-batch-editor__form {
  display: grid;
  gap: 0.7rem;
}

.listings-batch-editor__diff {
  padding: 0.65rem 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(230, 238, 228, 0.82);
  white-space: pre-wrap;
}

.listings-viewer__city-cell {
  text-align: left;
}

.listings-cpx-history__content {
  display: grid;
  gap: 0.95rem;
}

.listings-cpx-history__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 0.9rem;
  align-items: end;
}

.listings-cpx-history__account {
  flex: 1 1 14rem;
  min-width: 12rem;
}

.listings-cpx-history__item {
  flex: 1 1 10rem;
  min-width: 9rem;
}

.listings-cpx-history__load {
  flex: 0 0 auto;
}

.listings-cpx-history__table-shell {
  max-height: min(52vh, 28rem);
}

.listings-cpx-history__listing-cell {
  max-width: 18rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .listings-viewer__account,
  .listings-viewer__period,
  .listings-viewer__apply {
    width: 100%;
  }

  .listings-cpx-history__filters {
    flex-direction: column;
    align-items: stretch;
  }

  .listings-batch-editor__layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {
  .accounts-layout {
    grid-template-columns: 1fr;
  }

  .accounts-fields--two {
    grid-template-columns: 1fr;
  }

  .partner-leads-source-row {
    grid-template-columns: 1fr;
  }

  .admin-header__top {
    flex-direction: column;
    align-items: stretch;
  }

  .admin-accounts-button {
    width: 100%;
    text-align: center;
  }
}