/*
 * design/tokens.css — токены дизайн-системы «Контура» (итерация v3).
 *
 * Что делает модуль
 *   Объявляет шрифты (локальные файлы design/fonts/*.woff2, лицензия OFL, без CDN) и полный
 *   набор семантических переменных --k-*: цвета, типографика, отступы, радиусы, высоты
 *   элементов, тени, движение, слои. Значения здесь — нейтральная основа; характер задают
 *   темы design/theme-tech.css, theme-site.css, theme-studio.css через data-theme на <html>.
 *   Режим по умолчанию — светлый. Тёмный — только по явному выбору: data-theme-mode="dark" на <html>,
 *   или data-theme-mode="auto" («как в системе») вместе с prefers-color-scheme: dark. Без атрибута —
 *   всегда светлый (витрины, админ-панель). Каждая тема задаёт оба набора.
 *   Внизу — псевдонимы старых переменных --ui-* и --mobile-*, чтобы прежние стили
 *   (ui-foundation.css, crm.css, online.css) тоже переключались вместе с темой.
 *
 * От чего зависит: ни от чего. Подключается первым из design/*.
 * Кто использует: design/components.css, темы, все *.css клиента, admin.css (только токены).
 * Правило: компоненты и экраны берут цвета только из --k-*; цифры hex в экранных CSS не пишем.
 */

/* ── Шрифты: латиница, кириллица и знаки валют (₸ ₽) отдельными подмножествами ── */
@font-face{font-family:"Inter";src:url("fonts/inter-latin.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";src:url("fonts/inter-cyrillic.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter";src:url("fonts/inter-currency.woff2") format("woff2");font-weight:100 900;font-display:swap;unicode-range:U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:"JetBrains Mono";src:url("fonts/jetbrains-mono-latin.woff2") format("woff2");font-weight:100 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";src:url("fonts/jetbrains-mono-cyrillic.woff2") format("woff2");font-weight:100 800;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";src:url("fonts/jetbrains-mono-currency.woff2") format("woff2");font-weight:100 800;font-display:swap;unicode-range:U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:"Manrope";src:url("fonts/manrope-latin.woff2") format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";src:url("fonts/manrope-cyrillic.woff2") format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Manrope";src:url("fonts/manrope-currency.woff2") format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+20A0-20AB,U+20AD-20CF}
@font-face{font-family:"Source Serif 4";src:url("fonts/source-serif-4-latin.woff2") format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";src:url("fonts/source-serif-4-cyrillic.woff2") format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Source Serif 4";src:url("fonts/source-serif-4-currency.woff2") format("woff2");font-weight:200 900;font-display:swap;unicode-range:U+20A0-20AB,U+20AD-20CF}

:root{
  color-scheme:light;

  /* ── Цвет: поверхности ── */
  --k-bg:#f2f3f1;            /* фон страницы */
  --k-surface:#ffffff;       /* карточки, поля, шапка */
  --k-surface-2:#e9ebe7;     /* второй нейтральный слой: панели, сегменты, строка итогов */
  --k-surface-3:#dcdfda;     /* нажатие, разделители-полосы */
  --k-line:#d2d7d1;          /* тонкие линии и рамки карточек */
  --k-line-strong:#7c867f;   /* рамки полей (≥ 3:1 к фону), линии чертежа */
  --k-page-pattern:none;     /* фоновый узор страницы (у «Чертежа» — миллиметровка) */

  /* ── Цвет: текст (все пары с фоном и поверхностями ≥ 4,5:1) ── */
  --k-ink:#151a17;           /* основной текст, цифры */
  --k-ink-2:#38423c;         /* второстепенный текст */
  --k-ink-3:#56615a;         /* подписи, единицы измерения */

  /* ── Цвет: действия ── */
  --k-primary:#1f5a3d;       /* фон главной кнопки */
  --k-primary-hover:#174730;
  --k-on-primary:#ffffff;    /* текст на главной кнопке */
  --k-accent:#e2c48e;        /* фирменная метка: заливки, выделения, отметка «вручную» */
  --k-on-accent:#271d0b;
  --k-accent-soft:#f3ead9;   /* мягкая подложка акцента */
  --k-accent-text:#7a5216;   /* акцент как цвет текста на светлом */
  --k-selected:#1f5a3d;      /* выбранный сегмент, фишка */
  --k-on-selected:#ffffff;
  --k-focus:#1f5a3d;         /* кольцо фокуса */
  --k-link:#1f5a3d;

  /* ── Цвет: состояния ── */
  --k-success:#1d6b43;  --k-success-soft:#dff0e5;
  --k-warning:#8a5200;  --k-warning-soft:#fbefd8;
  --k-danger:#b42a1c;   --k-danger-soft:#fbe4df;
  --k-info:#245694;     --k-info-soft:#e2ebf7;
  --k-overlay:rgb(14 20 17 / .56);

  /* ── Поля ввода ── */
  --k-field-bg:var(--k-surface);
  --k-field-line:var(--k-line-strong);
  --k-field-line-w:1px;

  /* ── Типографика ── */
  --k-font-sans:"Manrope","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --k-font-display:var(--k-font-sans);
  --k-font-num:var(--k-font-sans);
  --k-num-features:tabular-nums lining-nums;
  --k-fs-xs:.75rem;   /* 12 — служебные подписи */
  --k-fs-sm:.875rem;  /* 14 — подписи полей, таблицы */
  --k-fs-md:1rem;     /* 16 — основной текст и поля (не меньше 16: иначе iOS увеличивает страницу) */
  --k-fs-lg:1.125rem; /* 18 — заголовок карточки */
  --k-fs-xl:1.375rem; /* 22 — заголовок раздела */
  --k-fs-2xl:1.75rem; /* 28 — заголовок экрана */
  --k-fs-3xl:2.25rem; /* 36 — главный заголовок */
  --k-fs-num:1.5rem;  /* крупная цифра (площадь, итог комнаты) */
  --k-fs-total:2rem;  /* итог заказа */
  --k-lh-tight:1.2;
  --k-lh-body:1.55;
  --k-fw-regular:400; --k-fw-medium:500; --k-fw-strong:650; --k-fw-display:700;
  --k-tracking-display:-.02em;
  --k-tracking-caps:.06em;

  /* ── Отступы: шаг 4 px ── */
  --k-s-1:.25rem; --k-s-2:.5rem; --k-s-3:.75rem; --k-s-4:1rem; --k-s-5:1.25rem;
  --k-s-6:1.5rem; --k-s-7:2rem; --k-s-8:2.5rem; --k-s-9:3rem; --k-s-10:4rem;
  --k-gap:var(--k-s-3);          /* промежуток внутри компонента */
  --k-pad-card:var(--k-s-5);     /* внутренний отступ карточки */
  --k-gutter:var(--k-s-4);       /* поле страницы на телефоне */
  --k-page-max:1320px;

  /* ── Форма ── */
  --k-r-xs:4px; --k-r-sm:8px; --k-r-md:12px; --k-r-lg:16px; --k-r-pill:999px;
  --k-r-control:10px;            /* кнопки, поля, сегменты */
  --k-h-sm:36px; --k-h-md:44px; --k-h-lg:52px;   /* высоты элементов; на телефоне md ≥ 48 */
  --k-border:1px;

  /* ── Тени (окрашены в тон фона) ── */
  --k-shadow-1:0 1px 2px rgb(20 30 24 / .06);
  --k-shadow-2:0 4px 16px rgb(20 30 24 / .08);
  --k-shadow-3:0 18px 48px rgb(20 30 24 / .18);

  /* ── Движение ── */
  --k-ease:cubic-bezier(.22,1,.36,1);  /* ease-out-quint */
  --k-dur-fast:120ms; --k-dur:200ms; --k-dur-slow:320ms;

  /* ── Слои ── */
  --k-z-sticky:20; --k-z-header:30; --k-z-totalbar:35; --k-z-overlay:40; --k-z-modal:50; --k-z-toast:60;
}

@media (max-width:760px){
  :root{--k-h-md:48px;--k-h-lg:56px;--k-pad-card:var(--k-s-4)}
}

/* ── Тёмный режим основы (темы задают свой); только по выбору: auto + система или dark ── */
@media screen and (prefers-color-scheme:dark){
  :root[data-theme-mode="auto"]{
    color-scheme:dark;
    --k-bg:#101512; --k-surface:#171d19; --k-surface-2:#1e2621; --k-surface-3:#28322c;
    --k-line:#303b34; --k-line-strong:#6d7d73;
    --k-ink:#eef2ee; --k-ink-2:#c9d2cb; --k-ink-3:#a1ada5;
    --k-primary:#6cc495; --k-primary-hover:#86d3aa; --k-on-primary:#07160e;
    --k-accent:#e2c48e; --k-on-accent:#211808; --k-accent-soft:#2f2a1f; --k-accent-text:#e8cf9f;
    --k-selected:#6cc495; --k-on-selected:#07160e; --k-focus:#86d3aa; --k-link:#86d3aa;
    --k-success:#6fd09a; --k-success-soft:#173324; --k-warning:#f0b955; --k-warning-soft:#3a2c12;
    --k-danger:#ff8b7c; --k-danger-soft:#3d1c18; --k-info:#8db8f2; --k-info-soft:#182a40;
    --k-overlay:rgb(0 0 0 / .62);
    --k-shadow-1:0 1px 2px rgb(0 0 0 / .4); --k-shadow-2:0 4px 16px rgb(0 0 0 / .45); --k-shadow-3:0 18px 48px rgb(0 0 0 / .6);
  }
}
@media screen{
:root[data-theme-mode="dark"]{
  color-scheme:dark;
  --k-bg:#101512; --k-surface:#171d19; --k-surface-2:#1e2621; --k-surface-3:#28322c;
  --k-line:#303b34; --k-line-strong:#6d7d73;
  --k-ink:#eef2ee; --k-ink-2:#c9d2cb; --k-ink-3:#a1ada5;
  --k-primary:#6cc495; --k-primary-hover:#86d3aa; --k-on-primary:#07160e;
  --k-accent:#e2c48e; --k-on-accent:#211808; --k-accent-soft:#2f2a1f; --k-accent-text:#e8cf9f;
  --k-selected:#6cc495; --k-on-selected:#07160e; --k-focus:#86d3aa; --k-link:#86d3aa;
  --k-success:#6fd09a; --k-success-soft:#173324; --k-warning:#f0b955; --k-warning-soft:#3a2c12;
  --k-danger:#ff8b7c; --k-danger-soft:#3d1c18; --k-info:#8db8f2; --k-info-soft:#182a40;
  --k-overlay:rgb(0 0 0 / .62);
  --k-shadow-1:0 1px 2px rgb(0 0 0 / .4); --k-shadow-2:0 4px 16px rgb(0 0 0 / .45); --k-shadow-3:0 18px 48px rgb(0 0 0 / .6);
}

}

/* ── Псевдонимы прежних переменных: старые стили следуют за темой ── */
:root{
  --ui-ink:var(--k-ink); --ui-muted:var(--k-ink-3); --ui-bg:var(--k-bg); --ui-surface:var(--k-surface);
  --ui-line:var(--k-line); --ui-accent:var(--k-primary); --ui-accent-soft:var(--k-accent-soft);
  --ui-radius:var(--k-r-md); --ui-shadow:var(--k-shadow-1);
  --mobile-ink:var(--k-ink); --mobile-surface:var(--k-bg); --mobile-border:var(--k-line);
}
