/* SPDX-FileCopyrightText: 2026 Andreii Alferov <oldtonel@gmail.com> */
/* SPDX-License-Identifier: LicenseRef-Proprietary */

/*
  Задача 58 — заглушка бета-доступа. Размытие ниже — декоративный градиент
  на теле уже показанной страницы заглушки, не оверлей поверх настоящего
  контента сайта (контент до сервера с валидной кукой не доезжает вовсе —
  BetaGateMiddleware).

  Единственный подключаемый файл страницы — намеренно (найдено живьём
  после первой выкладки, отчёт §7): страница НЕ ссылается на tokens.css/
  base.css/components.css сайта — оба этих файла тоже за замком заглушки
  (единственное изъятие — /static/beta_gate/, чужие пути под него не
  подпадают и не должны), и первый же анонимный запрос браузера получал
  бы вместо CSS страницу заглушки (HTML вместо text/css) — сайт выглядел
  неоформленным. Значения ниже — копия конкретных токенов из
  static/css/tokens.css на дату написания (не импорт, не общий :root —
  расхождение с общей дизайн-системой при её обновлении возможно и
  осознанно допустимо для одной служебной страницы).
*/

:root {
  --bg-navy: #0f243f;
  --bg-navy-2: #16365b;
  --bg-ocean: #2a6790;
  --bg-aqua: #5bb6c6;
  --bg-gold-soft: #ecdcb6;
  --bg-ivory: #fdfbf6;
  --bg-ink: #16233a;
  --bg-ink-soft: #4a586e;
  --bg-danger: #a83b34;
  --bg-danger-soft: #f0d5d1;
  --bg-line-strong: rgba(20, 35, 58, .18);
  --bg-glow: 0 30px 90px rgba(13, 30, 54, .16);
  --bg-radius-lg: 40px;
  --bg-radius-sm: 18px;
  --bg-font-serif: Georgia, "Times New Roman", serif;
  --bg-font-sans: Inter, "Manrope", -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, Arial, sans-serif;
}

/* Минимальная нормализация — обычно даёт base.css сайта, здесь недоступен. */
*, *::before, *::after { box-sizing: border-box }
img { display: block; max-width: 100% }

.beta-gate-body {
  min-height: 100vh;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-navy);
  position: relative;
  overflow: hidden;
}

.beta-gate-backdrop {
  position: absolute;
  inset: -20%;
  background:
    radial-gradient(circle at 20% 20%, var(--bg-ocean) 0%, transparent 55%),
    radial-gradient(circle at 80% 15%, var(--bg-gold-soft) 0%, transparent 45%),
    radial-gradient(circle at 50% 90%, var(--bg-aqua) 0%, transparent 50%),
    linear-gradient(160deg, var(--bg-navy) 0%, var(--bg-navy-2) 100%);
  filter: blur(60px);
  opacity: 0.85;
}

.beta-gate {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 24px;
  display: flex;
  justify-content: center;
}

.beta-gate-card {
  width: 100%;
  max-width: 420px;
  background: var(--bg-ivory);
  border-radius: var(--bg-radius-lg);
  box-shadow: var(--bg-glow);
  padding: 40px 32px;
  text-align: center;
  font-family: var(--bg-font-sans);
}

/* Текстовый вордмарк вместо растрового логотипа (задача 58, доп. правка
   после выкладки): раскладка логотипа платформы через data:-URI ловится
   тем же гвардом, что запрещает base64 в шаблонах вообще
   (test_no_brand_or_base64_in_island_and_templates, ADR 0019 — только
   {% static %}), а сам файл — вне {% static %} по конструкции этой
   страницы (§6.2 отчёта). {{ brand_name }} тем же приёмом, что и везде
   на сайте — не литерал. */
.beta-gate-wordmark {
  font-family: var(--bg-font-serif);
  font-weight: 700;
  font-size: 1.4rem;
  letter-spacing: 0.02em;
  color: var(--bg-navy);
  margin: 0 auto 24px;
}

.beta-gate-card .eyebrow {
  display: inline-block;
  color: var(--bg-ocean);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.8rem;
  margin-bottom: 8px;
}

.beta-gate-card h1 {
  font-family: var(--bg-font-serif);
  color: var(--bg-ink);
  margin: 0 0 12px;
  font-size: 1.6rem;
}

.beta-gate-lede {
  color: var(--bg-ink-soft);
  margin: 0 0 24px;
  line-height: 1.5;
}

.beta-gate-error {
  color: var(--bg-danger);
  background: var(--bg-danger-soft);
  border-radius: var(--bg-radius-sm);
  padding: 10px 14px;
  margin: 0 0 16px;
  font-size: 0.9rem;
}

.beta-gate-card form .field {
  text-align: left;
  margin-bottom: 20px;
}

.beta-gate-card label {
  display: block;
  color: var(--bg-ink-soft);
  font-size: 0.85rem;
  margin-bottom: 6px;
}

.beta-gate-card input[type="password"] {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border: 1px solid var(--bg-line-strong);
  border-radius: var(--bg-radius-sm);
  font-size: 1rem;
  font-family: inherit;
}

/* .btn/.btn-primary/.btn-full — обычно даёт components.css сайта, здесь
   недоступен по той же причине, что и остальная дизайн-система (см.
   комментарий вверху файла). Минимальная копия варианта .btn-primary,
   без ободка/hover-нюансов оригинала — этой странице хватает. */
.beta-gate-card .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 24px;
  border-radius: 16px;
  font-weight: 700;
  font-size: 15px;
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
}

.beta-gate-card .btn-primary {
  background: linear-gradient(135deg, var(--bg-navy), var(--bg-ocean));
  color: white;
}

.beta-gate-card .btn-full {
  width: 100%;
}

@media (min-width: 640px) {
  .beta-gate-card {
    padding: 48px 40px;
  }
}