/* =============================================================================
   ТЕМА WEWO — единственный источник палитры для всего проекта.

   Все цвета живут здесь. Если понадобится поменять оттенок — правится одно
   место, а не двадцать файлов. Ниже по каскаду остальные стили ссылаются
   на эти переменные, а не на литералы.

   Оранжевого в проекте больше нет: акцент — сине-фиолетовый градиент.
   ============================================================================= */

:root {
  /* --- Основа --- */
  --wv-bg:        #0A0B14;   /* фон приложения            */
  --wv-bg-2:      #080912;   /* глубже фона: боковые панели */
  --wv-surf:      #12131F;   /* поверхность карточек       */
  --wv-surf-2:    #191A28;   /* приподнятая поверхность    */
  --wv-glass:     rgba(18,19,31,.72);   /* стекло: поверхность + размытие */

  /* --- Границы --- */
  --wv-line:      rgba(255,255,255,.08);
  --wv-line-2:    rgba(255,255,255,.18);

  /* --- Текст --- */
  --wv-text:      #EAECF5;
  --wv-mute:      #8B90A8;
  --wv-faint:     #5A5F78;   /* совсем тихие подписи */

  /* --- Акцент: градиент от голубого к фиолетовому --- */
  --wv-a1:        #4DA6FF;   /* голубой конец    */
  --wv-a2:        #A855F7;   /* фиолетовый конец */
  --wv-accent:    #6FA8FF;   /* сплошной акцент: контуры, знаки, иконки */
  --wv-accent-in: #0A0B14;   /* текст на заливке акцентом */
  --wv-grad:      linear-gradient(135deg, var(--wv-a1), var(--wv-a2));
  --wv-grad-soft: linear-gradient(135deg, rgba(77,166,255,.16), rgba(168,85,247,.16));

  /* --- Свечения: мягкие, не резкие --- */
  --wv-glow:      0 0 40px rgba(77,166,255,.22), 0 0 80px rgba(168,85,247,.14);
  --wv-glow-soft: 0 8px 40px rgba(77,166,255,.14);

  /* --- Состояния --- */
  --wv-ok:        #2DD4BF;   /* позитив, спокойствие */
  --wv-warn:      #FBBF24;
  --wv-err:       #FF8A8A;

  /* --- Форма --- */
  --wv-r:         28px;      /* крупные контейнеры */
  --wv-r-2:       18px;      /* внутренние блоки   */
  --wv-e:         cubic-bezier(.2,0,0,1);
}

/* Утилита стекла: крупный радиус, полупрозрачность, размытие, мягкое свечение.
   Используется и на главной, и в разделах — чтобы глубина была одна и та же. */
.wv-glass {
  background: var(--wv-glass);
  border: 1px solid var(--wv-line);
  border-radius: var(--wv-r);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 24px 60px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.05);
}