/* ============================================================
   AI-Platform — общие дизайн-токены (палитра)

   Источник: portal/mockup.html (задача C-4, перенос дословный —
   значения не менялись). Потребители: portal/ (сейчас), продукт-
   экран тьютора (задача C-5, план). Подключать через
   <link rel="stylesheet" href=".../ui-kit/theme.css">.

   Токены: светлая тема — реальная палитра AI-Tutor-Gemma4n
   (index.html), тёмная — те же роли токенов, значения Apple HIG
   dark system-colors + тот же тёмный градиент, что уже служит
   фоном аудио-визуализатора в тьюторе (#141a28→#1d2436).
   ============================================================ */
:root {
  --bg: #f4f6fb;
  --surface: #ffffff;
  --surface-2: #f8f9fc;
  --ink: #1c2333;
  --ink-2: #545e70;
  --ink-3: #8a93a6;
  --line: rgba(28, 35, 51, 0.1);

  --accent-tutor: #0076ff;
  --accent-tutor-soft: #e9f2ff;
  --accent-tutor-text: #0b5cc4;

  --accent-health: #34c759;
  --accent-health-soft: #e7f8ec;
  --accent-health-text: #1e8e3e;

  --hero-a: #141a28;
  --hero-b: #1d2436;
  --hero-ink: #eef1f8;
  --hero-ink-2: #98a2ba;
  --hero-line: rgba(255, 255, 255, 0.1);

  --shadow-card: 0 1px 2px rgba(28, 35, 51, 0.06), 0 8px 24px rgba(28, 35, 51, 0.06);
  --shadow-pop: 0 12px 32px rgba(28, 35, 51, 0.14);
  --radius-card: 20px;
  --radius-pill: 999px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0d0f17;
    --surface: #171c2a;
    --surface-2: #1d2434;
    --ink: #eef1f8;
    --ink-2: #a8b0c3;
    --ink-3: #6b7488;
    --line: rgba(238, 241, 248, 0.09);

    --accent-tutor: #0a84ff;
    --accent-tutor-soft: rgba(10, 132, 255, 0.14);
    --accent-tutor-text: #6cb2ff;

    --accent-health: #30d158;
    --accent-health-soft: rgba(48, 209, 88, 0.14);
    --accent-health-text: #6fe08a;

    --hero-a: #06070c;
    --hero-b: #10131e;
    --hero-line: rgba(255, 255, 255, 0.08);

    --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.5), 0 8px 28px rgba(0, 0, 0, 0.45);
    --shadow-pop: 0 16px 40px rgba(0, 0, 0, 0.55);
  }
}
:root[data-theme="dark"] {
  --bg: #0d0f17;
  --surface: #171c2a;
  --surface-2: #1d2434;
  --ink: #eef1f8;
  --ink-2: #a8b0c3;
  --ink-3: #6b7488;
  --line: rgba(238, 241, 248, 0.09);
  --accent-tutor: #0a84ff;
  --accent-tutor-soft: rgba(10, 132, 255, 0.14);
  --accent-tutor-text: #6cb2ff;
  --accent-health: #30d158;
  --accent-health-soft: rgba(48, 209, 88, 0.14);
  --accent-health-text: #6fe08a;
  --hero-a: #06070c;
  --hero-b: #10131e;
  --hero-line: rgba(255, 255, 255, 0.08);
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.5), 0 8px 28px rgba(0, 0, 0, 0.45);
  --shadow-pop: 0 16px 40px rgba(0, 0, 0, 0.55);
}
:root[data-theme="light"] {
  --bg: #f4f6fb;
  --surface: #ffffff;
  --surface-2: #f8f9fc;
  --ink: #1c2333;
  --ink-2: #545e70;
  --ink-3: #8a93a6;
  --line: rgba(28, 35, 51, 0.1);
  --accent-tutor: #0076ff;
  --accent-tutor-soft: #e9f2ff;
  --accent-tutor-text: #0b5cc4;
  --accent-health: #34c759;
  --accent-health-soft: #e7f8ec;
  --accent-health-text: #1e8e3e;
  --hero-a: #141a28;
  --hero-b: #1d2436;
  --hero-line: rgba(255, 255, 255, 0.1);
  --shadow-card: 0 1px 2px rgba(28, 35, 51, 0.06), 0 8px 24px rgba(28, 35, 51, 0.06);
  --shadow-pop: 0 12px 32px rgba(28, 35, 51, 0.14);
}