/* ВХОДНАЯ СТРАНИЦА Clike.ru (AUTH-ENTRY-01, утверждённый макет 27.10.2026).
   Разметка — includes/auth/entry_page.php, поведение — assets/auth-entry.js.

   Слой задаёт ТОЛЬКО композицию: фон, фотографии, логотип, слоган, карточку, вкладки и
   подвал. Поля, подписи, кнопки и согласие форм остаются в прежнем каскаде auth.css /
   register-email.css: каждая форма стоит в панели с прежними классами карточки, и здесь
   с этой панели снимается лишь её собственный вид (фон, рамка, отступы). Геометрию полей
   не трогаем — при конфликте сохраняется исходная форма, а не обложка.

   Порядок слоёв: базовый фон → фотографии → вуаль → логотип/слоган и карточка → подвал.
   Desktop > 760px — четыре фотополя по краям; mobile ≤ 760px — одна сплошная подложка. */

@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/overlay/caveat/caveat-500-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('fonts/overlay/caveat/caveat-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Оболочка: страница во всю ширину окна, естественный вертикальный скролл ──
   Схема оболочки входа сохраняется: html/body закреплены под видимую область (экранная
   клавиатура iOS, dc-viewport-keyboard), .wrap — колонка на всю высоту, прокручивается
   .auth-scroll-pane. Здесь снимаются только узкая колонка и отступы прежней карточки. */
html.auth-form-open:has(body.auth-entry-page),
html body.auth-entry-page.auth-form-open {
  background-color: #171719 !important;
}
html body.user-mode.auth-mode.auth-entry-page::before { content: none !important; }
html body.user-mode.auth-mode.auth-entry-page .wrap {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-scroll-pane {
  display: block !important;
  flex: 1 1 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
/* Высота страницы = высота прокручиваемой панели (а не окна): на телефоне с открытой
   клавиатурой это видимая область, и фон тянется ровно на неё. */
html body.user-mode.auth-mode.auth-entry-page .auth-entry { min-height: 100% !important; }

.auth-entry {
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  padding: 25px 20px 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #171719;
  font-family: Arial, Helvetica, sans-serif;
}

/* ── Фотографии: декоративный слой, никогда не перекрывает поля и ссылки ── */
.auth-photos {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #171719;
}
.auth-photo {
  position: absolute;
  width: calc((100% - 410px) / 2);
  height: calc(50% - 5px);
  overflow: hidden;
  border-radius: 15px;
  background: #242326;
}
.auth-photo--l1 { left: 0; top: 0; }
.auth-photo--l2 { left: 0; bottom: 0; }
.auth-photo--r1 { right: 0; top: 0; }
.auth-photo--r2 { right: 0; bottom: 0; }
.auth-photos.is-empty .auth-photo { display: none; }
.auth-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.auth-photo img.is-shown { opacity: 1; }
.auth-photo-veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 15%, #13131555 30%, #131315c7 42%, #131315c7 58%, #13131555 70%, transparent 85%);
}

/* ── Логотип и слоган ── */
.auth-entry__main {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.auth-cover {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 0 20px;
}
.auth-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 3px 14px #0008);
}
.auth-brand img {
  display: block;
  width: 180px;
  max-width: 85%;
  height: auto;
}
.auth-entry .auth-slogan {
  margin: 8px 0 0;
  padding: 0;
  font-family: Caveat, 'Segoe Print', cursive;
  font-size: 34px;
  font-weight: 500;
  font-style: normal;
  line-height: 1.03;
  letter-spacing: 0;
  color: #f6eee3;
  text-align: center;
  text-transform: none;
  transform: rotate(-4deg);
  transform-origin: center;
  text-shadow: 0 2px 14px #0008;
}
.auth-entry .auth-slogan span { display: block; }
.auth-entry .auth-slogan span + span { color: #edbc96; margin-left: 23px; margin-top: 3px; }

/* ── Карточка ── */
.auth-entry .auth-entry-card {
  box-sizing: border-box;
  width: 470px;
  max-width: 100%;
  margin: 0;
  padding: 14px 15px;
  border: .8px solid #ddd3c925;
  border-radius: 18px;
  background: linear-gradient(145deg, #242326f0, #191a1df7);
  box-shadow: 0 15px 45px #0005, inset 0 1px 0 #ffffff06;
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}

/* Вкладки «Вход / Регистрация» — ссылки; активная подложка рисуется самой ссылкой. */
.auth-tabs {
  display: flex;
  box-sizing: border-box;
  height: 36px;
  margin: 0 0 16px;
  padding: 3px;
  border: 1px solid #ffffff10;
  border-radius: 9px;
  background: #0d0e10;
}
.auth-entry .auth-tabs .auth-tab {
  flex: 1 1 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  border-radius: 6px;
  font: 500 12px/1 Arial, Helvetica, sans-serif;
  letter-spacing: 0;
  color: #929098;
  text-decoration: none;
  transition: background-color .24s ease, color .24s ease;
  -webkit-tap-highlight-color: transparent;
}
.auth-entry .auth-tabs .auth-tab:hover { color: #fff; }
.auth-entry .auth-tabs .auth-tab[aria-current="page"] {
  background: #353538;
  box-shadow: 0 1px 5px #0004;
  color: #fff;
}
.auth-tab:focus-visible { outline: 2px solid #f5872e; outline-offset: 1px; }
/* Тач-таргет ≥ 44px без изменения видимой высоты вкладок. */
@media (pointer: coarse) {
  .auth-tab { position: relative; }
  .auth-tab::after { content: ''; position: absolute; left: 0; right: 0; top: -5px; bottom: -5px; }
}

/* Панель формы: прежние классы карточки остаются ради каскада полей, её собственный вид снят. */
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane.auth-card {
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane[hidden] { display: none !important; }

/* ── Подвал ── */
.auth-footer {
  box-sizing: border-box;
  width: 438.4px;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-top: 12px;
  font: 11px Arial, Helvetica, sans-serif;
  color: #c3bab3;
  text-shadow: 0 1px 8px #000;
}
.auth-footer a { color: inherit; text-decoration: none; }
.auth-footer a:hover, .auth-footer a:focus-visible { color: #fff; text-decoration: underline; }
/* Тач-таргет ≥ 44px: область нажатия шире видимой ссылки, раскладка подвала прежняя. */
@media (pointer: coarse) {
  .auth-footer a { position: relative; }
  .auth-footer a::after { content: ''; position: absolute; left: -6px; right: -6px; top: -16px; bottom: -16px; }
}

/* ── Mobile ≤ 760px: одна сплошная фотоподложка, логотип и слоган слева ── */
@media (max-width: 760px) {
  .auth-entry {
    justify-content: flex-start;
    padding: calc(30px + env(safe-area-inset-top, 0px)) calc(10px + env(safe-area-inset-right, 0px))
             calc(24px + env(safe-area-inset-bottom, 0px)) calc(10px + env(safe-area-inset-left, 0px));
    background: #17181b;
  }
  .auth-photos { background: #17181b; }
  .auth-photo { display: none; }
  .auth-photo--l1 {
    display: block;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 0;
    background: #17181b;
  }
  .auth-photos.is-empty .auth-photo--l1 { display: none; }
  .auth-photo--l1 img { filter: saturate(.62); }
  .auth-photo-veil {
    background: linear-gradient(180deg, #0d101538 0%, #10121780 20%, #15171bc7 38%, #17191ced 70%, #17191c 100%);
  }
  .auth-entry__main { align-items: stretch; }
  /* Обложка без фиксированной высоты: от нижней строки слогана до карточки 20px.
     19px отступа + ~1px, на который наклон строки (-3°) опускает её левый край. */
  .auth-cover {
    box-sizing: border-box;
    align-items: flex-start;
    margin: 0 0 19px;
    padding: 0 14px;
  }
  .auth-brand { justify-content: flex-start; filter: drop-shadow(0 2px 12px #0007); }
  .auth-brand img { width: 152px; max-width: 100%; }
  .auth-entry .auth-slogan {
    margin-top: 15px;
    padding-left: 3px;
    font-size: 31px;
    line-height: 1.05;
    text-align: left;
    transform: rotate(-3deg);
    transform-origin: left center;
  }
  .auth-entry .auth-slogan span + span { margin-left: 19px; color: #f0cfad; }
  .auth-entry .auth-entry-card {
    width: 100%;
    padding: 14px 7.2px;
    border-radius: 16px;
    border-color: #e9e7df25;
    background: linear-gradient(145deg, #22252bdf, #181b20f5);
    box-shadow: 0 15px 40px #0004, inset 0 1px 0 #ffffff08;
  }
  .auth-footer {
    width: 100%;
    padding: 12px 8px 0;
    color: #b4b5b9;
  }
}

/* ── Компактные формы (согласованное изменение 27.10.2026) ──
   Только на входной странице: ширина полей, шрифты, подписи и подсказки прежние, сжаты лишь
   вертикальные расстояния и высота главных кнопок. Без scale/zoom, отрицательных отступов и
   обрезания: перенос текста, фокус и область нажатия сохраняются. Селектор с префиксом панели
   формы перебивает !important-каскад auth.css только здесь — кнопки сайта не меняются. */
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .login-submit,
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .register-submit {
  height: 44px !important;
  min-height: 44px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 12px rgba(232, 101, 28, .16) !important;
}
/* Вход: подпись → поле 6px, группа → группа 12px. */
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .user-login-form > label {
  margin: 0 0 6px !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .user-login-form > label ~ label {
  margin-top: 12px !important;
}
/* Пароль → строка «Вход сохранится / Забыли пароль?» 10px, строка → «Войти» 14px. Высота
   строки — по тексту; область нажатия ссылки ≥ 44px даёт прозрачный слой, а не высота строки. */
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .remember-login-row {
  min-height: 0 !important;
  margin: 10px 0 0 !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .login-forgot-link {
  position: relative;
  min-height: 0 !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .login-forgot-link::after {
  content: '';
  position: absolute;
  left: -8px;
  right: -8px;
  top: calc(50% - 22px);
  height: 44px;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .login-submit {
  margin: 14px 0 0 !important;
}
/* Регистрация: подпись → поле 6px (grid-gap 4px + 2px), поле → подсказка 4px (gap),
   группа → группа 12px, подсказка пароля → согласие 14px (12 + 2), согласие → кнопка 12px. */
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .reg-field {
  margin: 0 0 12px !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .reg-field > label {
  margin: 0 0 2px !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .auth-agreements {
  margin: 2px 0 0 !important;
  padding: 10px 12px !important;
}
html body.user-mode.auth-mode.auth-entry-page .auth-entry .auth-entry-pane .register-submit {
  margin: 12px 0 0 !important;
}

/* ── Гостевая оболочка «Помощь» и документов (AUTH-ENTRY-01) ──
   Одна оболочка на обеих: сплошной фон страницы (html и body - один цвет, включая область
   под карточкой, safe-area и «резиновую» прокрутку iOS), закреплённая компактная шапка с
   логотипом слева в одной позиции и одном размере, ниже - карточка. Прокрутка - обычная,
   документом; ничего не запрещается.
   Отступы .wrap задаёт оболочка правилом специфичности (0,7,1)
   (dc-mobile-pwa-shell.css: body.user-mode:not(.auth-mode):not(.admin-mode)…); здесь то же
   перечисление плюс класс страницы — чтобы снять их только на этих страницах. */
html:has(body.auth-entry-page:not(.auth-mode)),
html body.user-mode.auth-entry-page:not(.auth-mode) {
  background: #171719 !important;
  min-height: 100%;
}
/* Прокручивается документ. Общий стиль сайта даёт body overflow-x:hidden, а это по правилам CSS
   превращает body в контейнер прокрутки (overflow-y становится auto): sticky-шапка привязывалась
   к body, который сам не двигается, и уезжала вместе с текстом. clip режет по горизонтали так
   же, но контейнера прокрутки не создаёт. */
html body.user-mode.auth-entry-page:not(.auth-mode) {
  overflow: visible !important;
  overflow-x: clip !important;
}
/* Полосы safe-area оболочки (статус-бар и индикатор «домой») - цветом страницы, без рамки:
   на iPhone ни сверху, ни снизу нет стыка другого цвета. Нижняя полоса на этих страницах не
   нужна вовсе: нижней навигации нет, фон страницы и так доходит до края. */
/* Цвет полосы задаётся переменной: у элемента инлайн-стиль background:var(--dc-safe-top-ink)!important. */
html body.user-mode.auth-entry-page:not(.auth-mode) { --dc-safe-top-ink: #171719 !important; }
html body.user-mode.auth-entry-page:not(.auth-mode) > .dc-safe-top-chrome {
  border: 0 !important;
}
html body.user-mode.auth-entry-page:not(.auth-mode) > .dc-safe-bottom-chrome { display: none !important; }
html body.user-mode.auth-entry-page:not(.auth-mode)::before { content: none !important; }
html body.user-mode.auth-entry-page:not(.auth-mode):not(.admin-mode):not(.feed-v2-surface):not(.contest-user-hub-page) .wrap {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* Шапка: логотип слева, справа «Назад» и «Помощь». Высота 52 (+ safe-area сверху). */
.auth-legal-bar {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-sizing: border-box;
  width: 100%;
  min-height: calc(52px + env(safe-area-inset-top, 0px));
  padding: env(safe-area-inset-top, 0px) max(16px, env(safe-area-inset-right, 0px)) 0 max(16px, env(safe-area-inset-left, 0px));
  background: #171719;
  border-bottom: 1px solid #ffffff12;
}
.auth-legal-bar__brand { display: inline-flex; align-items: center; height: 44px; flex: none; }
.auth-legal-bar__brand img { display: block; width: 104px; height: auto; }
.auth-legal-bar__links { display: flex; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; margin-left: auto; }
.auth-legal-bar__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 34px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid #ffffff1c;
  background: #ffffff08;
  color: #e6e7ea;
  font: 600 13px/1 Arial, Helvetica, sans-serif;
  text-decoration: none;
  white-space: nowrap;
}
/* Область нажатия 44px - прозрачным слоем, кнопка остаётся компактной. */
.auth-legal-bar__link::after { content: ''; position: absolute; left: -3px; right: -3px; top: -5px; bottom: -5px; }
.auth-legal-bar__link:hover { background: #ffffff12; color: #fff; }
.auth-legal-bar__link:focus-visible { outline: 2px solid #f5872e; outline-offset: 2px; }
/* «Назад» видна всегда: без подходящей истории это переход ко входу (прежнее правило legal
   её прятало, потому что там рядом была «На главную»). */
.auth-legal-bar .js-legal-back.is-fallback-home { display: inline-flex !important; }

/* ── Помощь ── */
.auth-help-page {
  box-sizing: border-box;
  width: 100%;
  max-width: 502px;
  margin: 0 auto;
  padding: 20px max(16px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  display: flex;
  flex-direction: column;
  align-items: center;
}
.auth-help-page .auth-entry-card {
  box-sizing: border-box;
  width: 100%;
  padding: 18px 16px 16px;
  border: .8px solid #ddd3c925;
  border-radius: 18px;
  background: linear-gradient(145deg, #242326, #1c1d20);
  box-shadow: 0 15px 45px #0004, inset 0 1px 0 #ffffff06;
}
.auth-help-page .auth-footer { width: 100%; padding: 12px 4px 0; }
.auth-help { color: #e6eaf0; font: 14px/1.5 Arial, Helvetica, sans-serif; }
.auth-help__title { margin: 0 0 6px; font-size: 20px; line-height: 1.25; font-weight: 700; color: #fff; }
.auth-help__text { margin: 0 0 12px; color: #b8bfca; }
.auth-help a { color: #f5872e; }
.auth-help .pwreset-lead { margin: 0 0 14px; font-size: 14px; line-height: 1.45; color: #b8bfca; }
.auth-help .reg-form-error:empty { display: none; }
.auth-help .reg-field { margin: 0 0 12px; }
.auth-help .reg-field > label { display: block; margin: 0 0 6px; font: 600 13px Arial, Helvetica, sans-serif; color: #e6e7ea; }
.auth-help .reg-field input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 44px;
  padding: 0 12px;
  border: 1px solid #ffffff1f;
  border-radius: 12px;
  background: #121316;
  color: #f1f1f3;
  font: 16px Arial, Helvetica, sans-serif;
}
.auth-help .reg-field input:focus { outline: none; border-color: #f5872e; }
.auth-help .reg-field__hint { margin: 4px 0 0; font-size: 12px; line-height: 1.35; color: #8f949c; }
.auth-help .reg-field__hint:empty { display: none; }
.auth-help .reg-field__hint.is-error,
.auth-help .reg-field--error .reg-field__hint { color: #ff8a7a; }
.auth-help .reg-field--error input { border-color: #ff8a7a; }
.auth-help .ds-auth-primary,
.auth-help .reg-modal--inline [data-otc-primary] {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  margin: 2px 0 0;
  padding: 0 16px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(180deg, #f5872e, #e8651c);
  color: #fff;
  box-shadow: 0 4px 12px rgba(232, 101, 28, .16);
  font: 700 15px Arial, Helvetica, sans-serif;
  cursor: pointer;
}
.auth-help .ds-auth-primary:disabled,
.auth-help .reg-modal--inline [data-otc-primary]:disabled { opacity: .6; cursor: default; }

/* Ввод кода в самой карточке: тот же движок и та же разметка, без оверлея и фона. */
.auth-help .reg-modal--inline,
.auth-help .reg-modal--inline .reg-modal__positioner,
.auth-help .reg-modal--inline .reg-modal__panel {
  position: static !important;
  inset: auto !important;
  display: block;
  width: auto !important;
  max-width: none !important;
  max-height: none !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.auth-help .reg-modal--inline[hidden] { display: none !important; }
.auth-help .reg-modal--inline .reg-modal__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 6px; padding: 0; background: none; border: 0; position: static; }
.auth-help .reg-modal--inline .reg-modal__title { margin: 0; font: 700 15px Arial, Helvetica, sans-serif; color: #fff; }
.auth-help .reg-modal--inline .reg-modal__close { flex: none; width: 36px; height: 36px; border: 1px solid #ffffff1c; border-radius: 12px; background: #ffffff08; color: #c9ccd2; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.auth-help .reg-modal--inline .reg-modal__lead { margin: 0 0 12px; font-size: 13px; line-height: 1.45; color: #b8bfca; }
.auth-help .reg-modal--inline .reg-modal__timer { margin: 8px 0 10px; font-size: 12px; color: #8f949c; text-align: center; }
.auth-help .reg-modal--inline .reg-modal__error { margin: 8px 0 0; font-size: 13px; color: #ff8a7a; text-align: center; }
.auth-help .reg-modal--inline .reg-modal__error:empty { display: none; }

/* Поддержка и возврат ко входу. */
.auth-help__support { margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid #ffffff12; }
.auth-help__support-btn {
  display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 100%; height: 44px; margin: 0 0 8px;
  border: 1px solid #ffffff1f; border-radius: 14px; background: #ffffff0a; color: #fff;
  font: 700 14px Arial, Helvetica, sans-serif; cursor: pointer;
}
.auth-help__support-btn:hover { background: #ffffff14; }
.auth-help__mail { margin: 0; font-size: 13px; color: #b8bfca; text-align: center; }
.auth-help__remember {
  margin: 14px 0 0; padding: 12px 0 0; border-top: 1px solid #ffffff12;
  font-size: 13px; line-height: 1.4; color: #b8bfca; text-align: center;
}
/* «Войти» - текстовая ссылка; область нажатия 44px - прозрачным слоем, без высоты строки. */
.auth-help .auth-help__login { position: relative; color: #f5872e; font-weight: 700; text-decoration: none; }
.auth-help .auth-help__login::after { content: ''; position: absolute; left: -8px; right: -8px; top: -14px; bottom: -14px; }
.auth-help .auth-help__login:hover, .auth-help .auth-help__login:focus-visible { text-decoration: underline; }

/* Окно поддержки на этих страницах - в тех же цветах, что карточка помощи: без случайных
   оранжевых свечений и рамок прежнего окна. Только на гостевой оболочке. */
html body.auth-entry-page:not(.auth-mode) .dc-support__panel {
  border-color: #ffffff1a !important;
  background: linear-gradient(180deg, #1f2023, #18191b) !important;
  box-shadow: 0 24px 64px #0008 !important;
}
html body.auth-entry-page:not(.auth-mode) .dc-support__head {
  background: #1f2023 !important;
  border-bottom: 1px solid #ffffff12 !important;
}
html body.auth-entry-page:not(.auth-mode) .dc-support__head-back {
  border-color: #ffffff1c !important;
  background: #ffffff08 !important;
  color: #e6e7ea !important;
}
html body.auth-entry-page:not(.auth-mode) .dc-support__composer .cc-composer {
  --ccx-pill: #121316;
  --ccx-line: #ffffff1f;
  --ccx-text: #f1f1f3;
  --ccx-faint: #7c818a;
}
html body.auth-entry-page:not(.auth-mode) .dc-support__composer {
  background: linear-gradient(180deg, #18191b00, #18191b 20%) !important;
}

/* ── Документы гостю (pages/guest/legal.php) ──
   Прежняя карточка документа (legal-pages.css) в цветах оболочки: те же токены, тёмные
   значения. Текст и типографика документа не меняются. Вошедший - в оболочке сайта. */
html body.user-mode.auth-entry-page.legal-page-open {
  --ds-panel: #1f2023;
  --ds-panel-2: #1a1b1e;
  --ds-panel-bd: #ffffff14;
  --ds-panel-soft: #ffffff0a;
  --ds-ink: #f1f1f3;
  --ds-muted: #a9adb5;
  --ds-muted-2: #7c818a;
  --ds-link: #f5872e;
  --ds-link-brand: #f5872e;
  --ds-shadow-2: 0 10px 30px #0004;
}
html body.user-mode.auth-entry-page.legal-page-open .legal-page {
  box-sizing: border-box;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 16px max(16px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  background: transparent;
}
html body.user-mode.auth-entry-page.legal-page-open .legal-hub-page { padding-top: 12px; }
/* ≤1100 переключатель документов закреплён под шапкой (legal-pages.css + dc_legal_page_back_script).
   Зазоры над ним и под ним (по 10px) закрыты фоном страницы: при прокрутке текст уходит под
   ровную непрозрачную полосу, а не просвечивает между шапкой и переключателем. */
@media (max-width: 1100px) {
  html body.user-mode.auth-entry-page.legal-page-open .legal-nav__sticky {
    background: #171719;
    box-shadow: 0 -10px 0 #171719, 0 10px 0 #171719;
  }
}

@media (prefers-reduced-motion: reduce) {
  .auth-photo img, .auth-tab { transition: none; }
}