/* css/components/tokens.css — Цвета и базовые переменные (--neon-*, --text-* и т. п.), которыми пользуются все остальные стили.
   Порядок подключения всех стилей задан в layout/head.php — он важен. */


/* =============================================================
   css/components/tokens.css — цвета и переменные темы
   ============================================================= */


/* =============================================================
   ЦВЕТОВЫЕ ПЕРЕМЕННЫЕ И БАЗОВЫЕ ТОКЕНЫ
   Используются через var(--название) во всём файле.
   Чтобы поменять акцентный цвет — достаточно изменить здесь.
   ============================================================= */

:root {
  --purple:    #7c5cff;           /* Основной фиолетовый акцент */
  --cyan:      #00e5ff;           /* Вторичный голубой акцент */
  --success:   #00e5a0;           /* Зелёный — успех, кнопка Download All */
  --error:     #ff5c7a;           /* Красный — ошибки, drag-reject */
  --text-muted: #b8c1d1;          /* Приглушённый текст (подписи, плейсхолдеры) */
  --text-dim:   #7c8599;          /* Ещё более тусклый текст (имя файла, subtitle) */
  --text-link:  #7aa2ff;          /* Голубоватый — model-info, счётчики */
  --radius:     10px;             /* Базовый радиус скругления */
  --font-mono:  monospace;        /* Моноширинный шрифт для кнопки ZIP */

  /* Палитра из neon-color-palette.html (корень проекта) — источник цветов
     для Stats Strip и Settings Summary (см. классы .stat- и .ss- ниже). Не
     заменяет основную палитру выше (--purple, --cyan и т.д. используются
     по всему остальному сайту, их не трогаем) — отдельный набор конкретно
     под эти две панели "вдохновляйся и применяй". */
  --neon-pink:      #ff2bd6;
  --hot-pink:       #ff1493;
  --neon-purple:    #b026ff;
  --electric-violet:#8a2be2;
  --neon-blue:      #00d9ff;
  --electric-blue:  #0066ff;
  --neon-cyan:      #00ffff;
  --neon-green:     #39ff14;
  --lime:           #b6ff00;
  --neon-yellow:    #ffff00;
  --neon-orange:    #ff6d00;
  --neon-red:       #ff1744;
}

.card-title {
      font-size: 11px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: 18px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .card-title::after {
      content: '';
      flex: 1;
      height: 1px;
      background: rgba(100, 159, 255, 0.411);
    }

	#card-title-images{margin-top:40px;}