/* Дизайн-токены. Система — редакторская (Cursor-inspired), перенесена
   с npdoc.ru: тёплый кремовый холст, белые поверхности, волосяные границы
   вместо теней, единственный оранжевый акцент только на первичных CTA.

   ЕДИНСТВЕННОЕ место в проекте, где допустимы hex-значения цвета.
   Во всех остальных файлах — только var(--...). Проверяется автотестами. */

:root {
  /* ── Поверхности ─────────────────────────────────────────────────── */
  --canvas: #F7F7F4;
  --canvas-soft: #FAFAF7;
  --surface: #FFFFFF;
  --surface-strong: #E6E5E0;

  /* ── Волосяные границы: механика глубины вместо теней ────────────── */
  --hairline: #E6E5E0;
  --hairline-soft: #EFEEE8;
  --hairline-strong: #CFCDC4;

  /* ── Текст ───────────────────────────────────────────────────────── */
  --ink: #26251E;
  --body: #5A5852;
  --muted: #6A675D;
  --muted-soft: #A09C92;

  /* ── Акцент: только первичные CTA ────────────────────────────────── */
  --primary: #C24000;
  --primary-active: #A33800;
  --on-primary: #FFFFFF;

  /* ── Статусы ─────────────────────────────────────────────────────── */
  --success: #15734F;
  --success-bg: #EDF7F3;
  --error: #CF2D56;
  --error-bg: #FCF0F3;

  /* ── Затемнение под полноэкранным просмотром образца ─────────────── */
  --overlay: rgba(38, 37, 30, .84);

  /* ── Радиусы ─────────────────────────────────────────────────────── */
  --r-xs: 4px;
  --r-sm: 6px;
  --r-md: 8px;
  --r-lg: 12px;
  --r-xl: 16px;
  --r-pill: 9999px;

  /* ── Отступы, база 4px ───────────────────────────────────────────── */
  --s-xxs: 2px;  --s-xs: 4px;   --s-sm: 8px;   --s-md: 12px;
  --s-lg: 16px;  --s-xl: 24px;  --s-2xl: 32px; --s-3xl: 48px;
  --s-4xl: 64px; --s-5xl: 96px;

  /* ── Шрифты ──────────────────────────────────────────────────────── */
  --font-ui: 'Inter', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;

  /* ── Раскладка ───────────────────────────────────────────────────── */
  --container: 1120px;
  --container-narrow: 720px;
}