/* =============================================================================
   quiz-theme-aibot.css — брендовая тема квиза под aibot.direct (Forge, dark)
   Автор: Ари (art-director). Дата: 2026-07-02.

   НАЗНАЧЕНИЕ:
   - Override поверх дефолтов assets/quiz-engine.css.
   - Приводит квиз к боевой палитре сайта (тёмная тёплая «Forge»: ember/solar/
     flame + тёплый уголь). Источник значений: assets/css/brandbook.css,
     homepage-theme-forge.css. Ничего не выдумано — токены = боевые --bb-*.

   ПОДКЛЮЧАТЬ ПОСЛЕ quiz-engine.css:
     <link rel="stylesheet" href="/assets/quiz-engine.css">
     <link rel="stylesheet" href="/assets/quiz-theme-aibot.css">
   Требует загруженных на странице шрифтов Inter + JetBrains Mono
   (на боевых страницах aibot.direct уже подключены).

   ВНИМАНИЕ по именам: движок читает --quiz-* (НЕ --qz-*). Здесь — --quiz-*.
   ============================================================================= */

:root {
  /* ── Фоны / поверхности (тёплый уголь) ─────────────────────────────── */
  --quiz-bg:         #1A1714;              /* oklch(.16 .012 60)  — фон/фолбэк */
  --quiz-surface:    #221E1A;              /* oklch(.20 .013 60)  — панель/шапка */
  --quiz-surface-2:  #2C2722;              /* oklch(.25 .014 60)  — опции/инпуты */
  --quiz-border:     #36302A;              /* oklch(.30 .014 60)  — границы/трек */

  /* ── Текст ─────────────────────────────────────────────────────────── */
  --quiz-text:       #F2EDE3;              /* oklch(.94 .012 75)  — основной */
  --quiz-text-muted: #9A9182;              /* oklch(.62 .012 65)  — мета/лейблы (AA ≥4.5) */

  /* ── Акцент (раскалённый металл) ───────────────────────────────────── */
  --quiz-primary:    #F5A03A;              /* solar oklch(.78 .17 65) — бордеры/прогресс/фокус */
  --quiz-primary-h:  #F0D040;              /* straw oklch(.86 .13 92) — bright-текст на тёмном */
  --quiz-primary-bg: rgba(245,160,58,0.12);/* мягкий тинт под выбранным/hover/offer */

  /* ── Статусы ───────────────────────────────────────────────────────── */
  --quiz-danger:     #F2856B;              /* тёплый коралл — читаемый red-текст на тёмном (AA) */
  --quiz-success:    #F0D040;              /* straw */
  --quiz-warn:       #F0B429;              /* amber */

  /* ── Форма / шрифт / доп-токен ─────────────────────────────────────── */
  --quiz-radius:     14px;                 /* = brand r-md */
  --quiz-radius-sm:  8px;                  /* = brand r-sm */
  --quiz-shadow:     0 24px 60px rgba(0,0,0,0.6), 0 0 0 1px rgba(245,160,58,0.06);
  --quiz-font:       'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --quiz-font-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --quiz-transition: 0.18s ease;
}

/* ── Заголовок вопроса: brand-трекинг ────────────────────────────────── */
.quiz-question { letter-spacing: -0.01em; }

/* ── Прогресс / служебные числа — моно (brand tnum) ──────────────────── */
.quiz-progress-text {
  font-family: var(--quiz-font-mono);
  font-feature-settings: 'tnum';
  letter-spacing: 0.02em;
}

/* ── PRIMARY-кнопка: горячий градиент + ТЁМНЫЙ текст (движок хардкодит #fff,
      бел-на-оранж = ~1.7:1 FAIL; дарк-на-оранж = 5.4–8.5:1 AA) ──────────── */
.quiz-btn {
  background: linear-gradient(180deg, #F5A03A 0%, #E26B22 100%);
  color: #1A1714;
  box-shadow: 0 8px 24px rgba(226,107,34,0.35), inset 0 1px 0 rgba(255,255,255,0.18);
}
.quiz-btn:hover, .quiz-btn:focus-visible {
  background: linear-gradient(180deg, #F0D040 0%, #E26B22 100%);
  box-shadow: 0 12px 36px rgba(226,107,34,0.5), inset 0 1px 0 rgba(255,255,255,0.25);
}
/* Ghost-кнопка «Далее»/«Ещё раз» — восстанавливаем после override .quiz-btn */
.quiz-btn--next {
  background: transparent;
  color: var(--quiz-primary-h);
  border: 1.5px solid var(--quiz-primary);
  box-shadow: none;
}
.quiz-btn--next:hover, .quiz-btn--next:focus-visible {
  background: var(--quiz-primary-bg);
  color: var(--quiz-primary-h);
  box-shadow: none;
}
.quiz-error-screen .quiz-btn { /* сохраняем auto-ширину из движка */ width: auto; }

/* ── Чек multiple-choice: тёмная галка на solar (бел-на-solar <3:1 для глифа) ── */
.quiz-options--multiple .quiz-option--sel::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 5l3.5 3.5L11 1' stroke='%231A1714' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* ── Валидация: тёплый коралл-тинт вместо дефолтного «чужого» красного ── */
.quiz-validation-err { background: rgba(242,133,107,0.10); }

/* ── Score-бейджи: убираем холодный синий «cold» из тёплого бренда ────── */
.quiz-score--cold {
  background: rgba(154,145,130,0.16);
  color: #C7BDAF;                          /* тёплый нейтрал = «спокойный/низкий» */
}
/* hot/warm уже в тёплой гамме — оставляем как в движке */

/* ── Тач-таргеты: close до ≥40px (движок 36px) ───────────────────────── */
.quiz-close { min-width: 40px; min-height: 40px; }

@media (max-width: 480px) {
  .quiz-close { min-width: 44px; min-height: 44px; }
  .quiz-back  { min-height: 44px; }
}