/*
 * Eurecable 2.0 — дизайн-токены (обе темы).
 * Источник: холст «Eurecable 2.0» (doc/design/screens), SYSTEM.md §16.9.
 * Переключение: по системной настройке и вручную через data-theme на <html>.
 */

:root {
  /* Палитра — светлая тема */
  --paper: #F5F7F8;        /* фон страницы */
  --card: #FFFFFF;         /* карточки, поля */
  --ink: #18242B;          /* основной текст */
  --muted: #5A6B75;        /* вторичный текст (AA на paper и card) */
  --line: #E2E8EB;         /* рамки, разделители */
  --card-edge: 0 0 0 1px rgba(24, 36, 43, .05), 0 1px 2px rgba(24, 36, 43, .04), 0 8px 24px -16px rgba(24, 36, 43, .18); /* край карточки вместо рамки */
  --accent: #22536E;       /* фирменный синий, кнопки, ссылки, базовая норма */
  --accent-soft: #EAF1F5;  /* фон бейджей и подсветок */
  --on-accent: #FFFFFF;    /* текст на accent (8,6 : 1) */
  --star: #C08428;         /* звёзды и баллы */
  --good: #3D7A50;         /* «хорошо», свободная идея, приглашение оценить */
  --good-soft: #E9F1EC;
  --warn: #8A5E1C;         /* запрос на раскрытие (затемнён против макета ради AA) */
  --warn-soft: #F6EFE3;
  --warm: #C2410C;         /* тёплый акцент: тур гостю, призы (как оранжевый старого сайта); белый текст 5,2 : 1 */
  --on-warm: #FFFFFF;
  --warm-ink: #A84B0C;     /* тёплый текст на warm-soft, card, paper (AA) */
  --warm-soft: #FBEFE4;
  --lilac: #6E5A8C;        /* норма автора */
  --lilac-soft: #F1EDF6;
  --bad: #A23B2C;          /* ошибки форм */
  --bad-soft: #F8ECE9;
  --scrim: rgba(15, 37, 48, 0.45);

  /* Шкала фирменного синего: 600 — основа светлой, 300 — тёмной */
  --blue-50: #EEF4F7;
  --blue-100: #D6E4EC;
  --blue-200: #AFCADA;
  --blue-300: #7FB3CE;
  --blue-400: #4F8BAD;
  --blue-500: #33708F;
  --blue-600: #22536E;
  --blue-700: #1C4459;
  --blue-800: #163545;
  --blue-900: #0F2530;

  /* Типографика */
  --font-ui: "Golos Text", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-serif: "Literata", Charter, "Iowan Old Style", Georgia, serif; /* заголовки и текст идей */
  --text-xs: 0.8125rem;   /* 13 — мета, подписи */
  --text-sm: 0.9375rem;   /* 15 — вторичный текст */
  --text-base: 1rem;      /* 16 — интерфейс */
  --text-read: 1.125rem;  /* 18 — текст частей, line-height 1.65 */
  --text-h3: 1.3125rem;   /* 21 — заголовок части */
  --text-h2: 1.625rem;    /* 26 */
  --text-h1: 2.75rem;     /* 44 — clamp(2rem, 3.6vw, 2.75rem) на странице идеи */

  /* Ритм и форма */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --radius: 10px;          /* карточки (12 у крупных секций) */
  --radius-control: 8px;   /* кнопки, поля */
  --radius-pill: 99px;     /* бейджи */
  --content-max: 76rem;    /* шапка и двухколоночные страницы */
  --reading-max: 46rem;    /* колонка текста идеи */
  --gutter: 16px;          /* боковое поле на телефоне */
  --tap: 44px;             /* минимальная цель касания */
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #101A20;
    --card: #18242C;
    --ink: #DCE4E8;
    --muted: #93A5AF;
    --line: #26343D;
    --card-edge: 0 0 0 1px var(--line);
    --accent: #7FB3CE;
    --accent-soft: #1D2E39;
    --on-accent: #0D161B;
    --star: #D9A85C;
    --good: #8CC4A0;
    --good-soft: #1C2E23;
    --warn: #D4B06E;
    --warn-soft: #2E2820;
    --warm: #F0A050;
    --on-warm: #1A1208;
    --warm-ink: #F0A050;
    --warm-soft: #33251A;
    --lilac: #AE99C9;
    --lilac-soft: #29233A;
    --bad: #E8998C;
    --bad-soft: #331F1C;
    --scrim: rgba(0, 0, 0, 0.6);
  }
}

:root[data-theme="dark"] {
  --paper: #101A20;
  --card: #18242C;
  --ink: #DCE4E8;
  --muted: #93A5AF;
  --line: #26343D;
  --card-edge: 0 0 0 1px var(--line);
  --accent: #7FB3CE;
  --accent-soft: #1D2E39;
  --on-accent: #0D161B;
  --star: #D9A85C;
  --good: #8CC4A0;
  --good-soft: #1C2E23;
  --warn: #D4B06E;
  --warn-soft: #2E2820;
  --warm: #F0A050;
  --on-warm: #1A1208;
  --warm-ink: #F0A050;
  --warm-soft: #33251A;
  --lilac: #AE99C9;
  --lilac-soft: #29233A;
  --bad: #E8998C;
  --bad-soft: #331F1C;
  --scrim: rgba(0, 0, 0, 0.6);
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--text-base);
  line-height: 1.5;
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.tabular { font-variant-numeric: tabular-nums; } /* баллы, балансы, счётчики */
