/* ==========================================================================
   knigochit.ru — дизайн-токены (Phase 1)
   Перенесено без изменений из дизайн-системы:
   agents/design_agent/web/tasks/active/web_catalog_mvp_uiux_phase1_2026_06_09/
     design_system.md §2-§5 + prototype/styles.css §1.
   Палитра «коралл + мята». Значения менять только по согласованию с design.
   ========================================================================== */

:root {
  /* Brand (коралл) */
  --color-brand: #ff5d73;
  --color-brand-600: #ec455c;
  --color-brand-50: #ffe7eb;

  /* Accent / CTA (мята / бирюза) */
  --color-accent: #12b3a6;
  --color-accent-600: #0b8074;
  --color-accent-700: #0a6a62;
  --color-accent-50: #d8f5f1;

  /* Нейтральные (нейтральный светлый фон — без розового подтона, решение owner 2026-06-10) */
  --color-ink: #2a1f2a;
  --color-ink-2: #54514d;
  --color-muted: #6a635b;
  --color-line: #e6e4e0;
  --color-surface: #ffffff;
  --color-bg: #f8f8f6;
  --color-bg-2: #eeede9;

  /* Семантика */
  --color-success: #2f7d4f;
  --color-warning: #b8791a;
  --color-error: #b33a3a;
  --color-info: #2f6b8c;
  --color-success-bg: #e8f3ec;
  --color-warning-bg: #fbf2e0;
  --color-warning-border: #ecd9a8;  /* мягкая амбра — рамка правового предупреждения (LAW-016) */
  --color-error-bg: #f7e9e9;
  --color-info-bg: #e8f1f6;

  /* Реклама / LAW-015 */
  --color-ad-bg: #f2f1ed;
  --color-ad-border: #e2e0da;
  --color-ad-label: #6f6a64;

  /* Рейтинг */
  --color-star: #ffb020;
  --color-star-empty: #d8cfbf;

  /* Шрифты */
  --font-head: "Golos Text", "PT Sans", system-ui, sans-serif;
  --font-body: "Inter", "Golos Text", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Code", monospace;

  /* Типошкала */
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.25rem;
  --lh-tight: 1.2;
  --lh-base: 1.55;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* Spacing */
  --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-sm: 6px; --radius-md: 10px; --radius-lg: 16px; --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgba(31,27,24,0.06);
  --shadow-md: 0 4px 12px rgba(31,27,24,0.08);
  --shadow-lg: 0 12px 28px rgba(31,27,24,0.12);
  --border-1: 1px solid var(--color-line);

  /* Переходы / слои / фокус */
  --ease: cubic-bezier(0.2, 0, 0, 1);
  --dur-fast: 120ms; --dur-base: 200ms;
  --z-header: 100; --z-dropdown: 200; --z-overlay: 300; --z-modal: 400;
  --focus-ring: 0 0 0 3px var(--color-accent-50), 0 0 0 1px var(--color-accent);
  --tap-min: 44px;

  /* Контейнеры */
  --container-max: 1200px;
  --container-text: 760px;
  --gutter: 16px;
  --gutter-lg: 24px;
}