/* Дизайн-токены — числа переписаны из docs/DESIGN_CODE.md дословно, там их
   единственное место (CLAUDE.md: «одно решение живёт в одном месте»).
   Тема ставится через [data-theme] на <html> — js/telegram.js читает
   Telegram.WebApp.colorScheme, вне Telegram по умолчанию світла (§2). */

:root {
  --bg: #ECEEF2;
  --surface: #FFFFFF;
  --divider: #EEF1F5;
  --stroke: #D4DAE2;
  --text: #22252A;
  --text-2: #4B515A;
  --muted: #8D949E;
  --accent: #0E9488;
  --accent-chip-bg: rgba(14, 148, 136, .12);
  --scrim: rgba(15, 17, 20, .35);
  --sheet-shadow: 0 -12px 40px rgba(15, 17, 20, .25);
  --card-shadow: 0 1px 3px rgba(23, 28, 38, .05);
  --fab-shadow: 0 8px 20px rgba(14, 148, 136, .30);
  --fab-text: #FFFFFF;

  /* Категории — восемь тонов по кругу (§6.2). Хекс первым — запасной для
     WebView без oklch(), вычислен из тех же L/C/H, что записаны в
     DESIGN_CODE.md (докстрока в конце файла). */
  --cat-0: #D59F8D; --cat-0: oklch(0.75 0.07 40);
  --cat-1: #C8A87C; --cat-1: oklch(0.75 0.07 75);
  --cat-2: #B0B27F; --cat-2: oklch(0.75 0.07 110);
  --cat-3: #8FBB97; --cat-3: oklch(0.75 0.07 150);
  --cat-4: #77BCBF; --cat-4: oklch(0.75 0.07 200);
  --cat-5: #8CB2D9; --cat-5: oklch(0.75 0.07 250);
  --cat-6: #B4A4D4; --cat-6: oklch(0.75 0.07 300);
  --cat-7: #CF9DB8; --cat-7: oklch(0.75 0.07 345);

  /* Шкала календаря — пять ступеней тона 183 (§6.3), від найменшої
     активності до найбільшої. */
  --cal-0: #E1F3F0; --cal-0: oklch(0.95 0.02 183);
  --cal-1: #B8DDD7; --cal-1: oklch(0.87 0.04 183);
  --cal-2: #8CC4BB; --cal-2: oklch(0.78 0.06 183);
  --cal-3: #5AA99D; --cal-3: oklch(0.68 0.08 183);
  --cal-4: #098A7D; --cal-4: oklch(0.57 0.10 183);
  /* до другої ступені число темне, з третьої — біле (§6.3) */
  --cal-0-ink: var(--text);
  --cal-1-ink: var(--text);
  --cal-2-ink: #FFFFFF;
  --cal-3-ink: #FFFFFF;
  --cal-4-ink: #FFFFFF;

  --radius-card: 20px;
  --radius-inset: 16px;
  --radius-button: 14px;
  --radius-pill: 999px;
  --radius-cell: 10px;
  --radius-sheet: 24px;

  --space-screen: 16px;
  --gap-card: 12px;
  --pad-card: 15px;

  --font-family: 'Golos Text', system-ui, -apple-system, sans-serif;
  /* Ступень / розмір / вага / трек (§4) */
  --fs-display: 40px; --fw-display: 700;
  --fs-title: 24px;   --fw-title: 600;
  --fs-screen: 22px;  --fw-screen: 700;
  --fs-number: 20px;  --fw-number: 600;
  --fs-body: 15px;    --fw-body: 400;
  --fs-secondary: 13.5px; --fw-secondary: 400;
  --fs-caption: 12px; --fw-caption: 400;
  --fs-section: 11px; --fw-section: 500;

  --motion-fast: 160ms;
  --motion-ease: ease-out;
}

:root[data-theme="dark"] {
  --bg: #0F1114;
  --surface: #1A1E24;
  --divider: #232830;
  --stroke: #363D47;
  --text: #E9EBEF;
  --text-2: #B6BCC6;
  --muted: #7F8792;
  --accent: #35B3A5;
  --accent-chip-bg: rgba(53, 179, 165, .16);
  --scrim: rgba(0, 0, 0, .45);
  /* Тёмная — тени выключены целиком (§2, §5: «поверхности светлее фона»). */
  --sheet-shadow: none;
  --card-shadow: none;
  --fab-shadow: none;
  --fab-text: #0F1114;

  --cat-0: #D1947F; --cat-0: oklch(0.72 0.08 40);
  --cat-1: #C29E6B; --cat-1: oklch(0.72 0.08 75);
  --cat-2: #A7A96E; --cat-2: oklch(0.72 0.08 110);
  --cat-3: #80B38A; --cat-3: oklch(0.72 0.08 150);
  --cat-4: #63B4B8; --cat-4: oklch(0.72 0.08 200);
  --cat-5: #7EA9D5; --cat-5: oklch(0.72 0.08 250);
  --cat-6: #AC9AD0; --cat-6: oklch(0.72 0.08 300);
  --cat-7: #C991B0; --cat-7: oklch(0.72 0.08 345);

  --cal-0: #1C332F; --cal-0: oklch(0.30 0.03 183);
  --cal-1: #224E47; --cal-1: oklch(0.39 0.05 183);
  --cal-2: #266A61; --cal-2: oklch(0.48 0.07 183);
  --cal-3: #2B8C7F; --cal-3: oklch(0.58 0.09 183);
  --cal-4: #37B4A5; --cal-4: oklch(0.70 0.11 183);
  /* Тёмный календар не отрисован в макете (design/ШІденник - MVP.dc.html —
     «покажу тёмним після затвердження світлого»), поэтому порог свой:
     клетка светлеет к акценту — там, где акцент сам берёт тёмный текст
     (кнопка «сказати» в тёмній темі: color:#0F1114), клетка тоже. */
  --cal-0-ink: var(--text);
  --cal-1-ink: var(--text);
  --cal-2-ink: var(--text);
  --cal-3-ink: #0F1114;
  --cal-4-ink: #0F1114;
}