/* ============================================================================
   M3 Expressive Codex: Section 4 - Color & Surfaces
   Семантические цветовые токены для темной темы.
   ============================================================================ */

:root {
  /* Primary Palette */
  --md-sys-color-primary: #9ecaff;
  --md-sys-color-on-primary: #003258;
  --md-sys-color-primary-container: #00497d;
  --md-sys-color-on-primary-container: #d1e4ff;

  /* Secondary Palette */
  --md-sys-color-secondary: #bbc7db;
  --md-sys-color-on-secondary: #253140;
  --md-sys-color-secondary-container: #3b4858;
  --md-sys-color-on-secondary-container: #d7e3f7;

  /* Error Palette */
  --md-sys-color-error: #ffb4ab;
  --md-sys-color-on-error: #690005;
  --md-sys-color-error-container: #93000a;
  --md-sys-color-on-error-container: #ffdad6;

  /* Surface & Background Palette (Ключ к созданию глубины) */
  --md-sys-color-surface-dim: #111418; /* Самый темный */
  --md-sys-color-surface: #111418; /* Уровень 0: Основной фон */
  --md-sys-color-surface-bright: #37393d; /* Самый светлый */
  
  --md-sys-color-surface-container-lowest: #0c0f13;
  --md-sys-color-surface-container-low: #1f2226;
  --md-sys-color-surface-container: #23262a; /* Уровень 1: Карточки, панели */
  --md-sys-color-surface-container-high: #2e3135; /* Уровень 2: Элементы на карточках */
  --md-sys-color-surface-container-highest: #393c40; /* Уровень 3: Самые яркие элементы */

  /* Text & Icons On Surfaces */
  --md-sys-color-on-surface: #e2e2e6; /* Основной текст */
  --md-sys-color-on-surface-variant: #c2c7ce; /* Второстепенный текст */

  /* Outlines */
  --md-sys-color-outline: #8c9199;
  --md-sys-color-outline-variant: #42474e; /* Разделители */
}