/* NetAura — дизайн-токены v2 «Optical / Deep Signal» (claude/artdirection-iter2.md §3–4).
   Токены v1 сохранены; добавлены тёмные. Других цветов, кроме токенов, в CSS нет. */
:root {
  /* --- Светлые (v1) — светлые панели --- */
  --c-ink: #0E1A2B;          /* 16.1:1 на surface */
  --c-slate: #4A5568;        /* 7.0:1 на surface */
  --c-bg: #FFFFFF;
  --c-surface: #F4F6F8;      /* фон светлых панелей */
  --c-line: #DDE2E8;
  --c-accent: #0B6E72;       /* 5.6:1 на surface */
  --c-accent-hover: #085A5D;
  --c-error-on-light: #B3261E; /* 6.0:1 на surface */

  /* --- Тёмные (v2) — основной холст --- */
  --c-deep: #08111C;         /* холст */
  --c-deep-2: #0E1A2B;       /* приподнятые панели (= ink) */
  --c-deep-3: #132235;       /* поля формы, модули */
  --c-text-on-dark: #E8EEF3; /* 16.2:1 на deep, 13.7:1 на deep-3 */
  --c-muted-on-dark: #9AA8B8;/* 7.8:1 на deep, 6.6:1 на deep-3 */
  --c-aura: #2FC4BE;         /* 8.8:1 на deep; кнопка: текст deep 8.8:1 */
  --c-aura-hover: #5FD8D2;   /* текст deep 11.0:1 */
  --c-error-on-dark: #FF8A80;/* 7.0:1 на deep-3 */

  /* --- Производные (те же цвета с прозрачностью) --- */
  --c-line-on-dark: rgba(232, 238, 243, 0.12);       /* рамки модулей, разделители */
  --c-line-on-dark-strong: rgba(232, 238, 243, 0.24);
  --c-field-border: rgba(154, 168, 184, 0.6);         /* рамка поля: 3.3:1 к deep-3 (WCAG 1.4.11) */
  --c-dot: rgba(232, 238, 243, 0.07);                 /* точечная сетка */
  --c-glow: rgba(47, 196, 190, 0.35);                 /* свечение aura, максимум 35 % */
  --c-glow-soft: rgba(47, 196, 190, 0.12);
  --c-glow-none: rgba(47, 196, 190, 0);
  --c-header-bg: rgba(8, 17, 28, 0.78);               /* шапка: deep 78 % + размытие */
  --c-error-bg-dark: rgba(255, 138, 128, 0.08);

  /* --- Шрифты --- */
  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --fw-regular: 400;
  --fw-semibold: 600;

  /* --- Шкала (мобильная по умолчанию) --- */
  --fs-h1: 40px;  --lh-h1: 46px;  --ls-h1: -0.02em;
  --fs-h2: 32px;  --lh-h2: 40px;  --ls-h2: -0.01em;
  --fs-h3: 22px;  --lh-h3: 30px;
  --fs-statement: 24px; --lh-statement: 34px;
  --fs-lead: 18px; --lh-lead: 30px;
  --fs-body: 17px; --lh-body: 28px;
  --fs-small: 14px; --lh-small: 20px;
  --fs-mono: 13px; --lh-mono: 16px; --ls-mono: 0.08em;

  /* --- Отступы: шаг 8 px --- */
  --sp-1: 8px;  --sp-2: 16px; --sp-3: 24px; --sp-4: 32px; --sp-5: 40px;
  --sp-6: 48px; --sp-8: 64px; --sp-10: 80px; --sp-12: 96px; --sp-16: 128px;

  /* --- Сетка --- */
  --container: 1200px;
  --gutter: 16px;
  --grid-gap: 16px;
  --section-y: var(--sp-10);
  --header-h: 64px;
  --dot-step: 24px;

  /* --- Радиусы, рамки, фокус --- */
  --radius-s: 6px;
  --radius-m: 8px;
  --radius-l: 12px;
  --radius-panel: 24px;     /* светлые панели на тёмном холсте */
  --focus-dark: 2px solid var(--c-aura);
  --focus-light: 2px solid var(--c-accent);
  --focus-offset: 2px;

  /* --- Движение --- */
  --dur: 180ms;
  --ease: cubic-bezier(.2, .6, .2, 1);
  --pulse: 10s;
}

@media (min-width: 768px) {
  :root {
    --fs-h1: 56px; --lh-h1: 60px;
    --fs-h2: 40px; --lh-h2: 48px;
    --fs-statement: 28px; --lh-statement: 38px;
    --fs-lead: 20px; --lh-lead: 32px;
    --gutter: 32px; --grid-gap: 24px;
    --section-y: var(--sp-12);
    --header-h: 72px;
  }
}
@media (min-width: 1200px) {
  :root {
    --fs-h1: 76px; --lh-h1: 80px;
    --fs-h2: 48px; --lh-h2: 56px;
    --fs-statement: 32px; --lh-statement: 44px;
    --gutter: 40px;
    --section-y: var(--sp-16);
  }
}