/**
 * Токены визуального языка (ТЗ, раздел 8). Тёмная тема первична, светлая —
 * производная: те же имена переменных, другие значения.
 *
 * Значения берут только компоненты — hex в них не хардкодим.
 */
:root {
  color-scheme: dark;

  --bg: #07090d;
  --fg: #e8ecf4;
  --fg-dim: rgba(232, 236, 244, .62);

  /* Стекло: карточки, таб-бар, шиты. */
  --glass: rgba(255, 255, 255, .04);
  --glass-hi: rgba(255, 255, 255, .1); /* заливка выбранного и дорожка полосы */
  --glass-border: rgba(255, 255, 255, .08);
  --glass-blur: blur(20px) saturate(140%);

  /* Свечение ауры колбы (ТЗ, 8): на светлом фоне его нужно меньше. */
  --glow-op: .55;

  /* Палитра жидкости, 12 цветов под тёмный фон (ТЗ, раздел 8). */
  --liq-1: #6E8BFF;
  --liq-2: #33D6A6;
  --liq-3: #FFB020;
  --liq-4: #FF6B8A;
  --liq-5: #A78BFA;
  --liq-6: #22D3EE;
  --liq-7: #F472B6;
  --liq-8: #84CC16;
  --liq-9: #FB923C;
  --liq-10: #38BDF8;
  --liq-11: #E879F9;
  --liq-12: #94A3B8; /* «Пауза» */

  --r-pill: 999px;
  --r-card: 20px;
  --r-sheet: 28px;

  --ease: cubic-bezier(.2, .9, .25, 1);
  --dur-sheet: 320ms;
  --dur-layer: 600ms;

  --font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* Светлая — явная (настройки) ... */
:root[data-theme="light"] {
  color-scheme: light;

  --bg: #f3f5fa;
  --fg: #0b0f17;
  --fg-dim: rgba(11, 15, 23, .6);

  --glass: rgba(255, 255, 255, .62);
  --glass-hi: rgba(11, 15, 23, .08);
  --glass-border: rgba(11, 15, 23, .08);

  --glow-op: .50;
}

/* ... и системная: атрибута нет — значит «system». */
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;

    --bg: #f3f5fa;
    --fg: #0b0f17;
    --fg-dim: rgba(11, 15, 23, .6);

    --glass: rgba(255, 255, 255, .62);
    --glass-hi: rgba(11, 15, 23, .08);
    --glass-border: rgba(11, 15, 23, .08);

    --glow-op: .50;
  }
}