/* КОПИЯ design/tokens.css — не править здесь, править там и запустить `node design/sync.mjs`. */
/* PROrent — дизайн-токены. ЕДИНСТВЕННЫЙ источник правды для лендинга (prorentapp.by), веб-кабинета (/app/) и админки.
   Описание и правила — design/DESIGN.md. Лендинг получает копию landing/assets/tokens.css: `node design/sync.mjs`
   и app/…/ui/Tokens.kt для Android (проверка — `node design/sync.mjs --check`, она же в server/tests/test_design_tokens.py).
   База — тема Hallmark «Rim» (тёмная тёплая бумага, один оранжевый сигнал, глубина светлотой, без теней и свечения),
   подогнанная под Android-приложение PROrent (тёмные значения = палитра APK 0.6.x). */
:root {
  /* ---- бренд ---- */
  --primary: #3B82F6;        /* акцент: действие и текущее состояние. Один на экран. */
  --on-primary: #060E1E;     /* текст на оранжевой заливке (контраст 7.4:1) */
  --primary-c: #0E1D33;      /* тихая подложка акцента = lerp(bg, primary, .22) как primaryC в Android */
  --primary-line: #1E40AF;   /* обводка на подложке акцента */
  --focus: #93C5FD;          /* кольцо :focus-visible */

  /* ---- поверхности: глубина только светлотой (bg < s1 < s2 < s3) ---- */
  --bg: #0F1115; --nav: #151820; --s1: #171A21; --s2: #1E222B; --s3: #262B36;
  --line: #2C3240;           /* волосяная линия: карточки, разделители */
  --line2: #394050;          /* линия поля ввода / сильнее */

  /* ---- текст ---- */
  --text: #E6E8EE; --muted: #9AA2B1; --faint: #6B7280;

  /* ---- статусы (текст + подложка) ---- */
  --ok: #5FD39A; --ok-c: #123526;
  --warn: #FFC56B; --warn-c: #3D2D10;
  --err: #FF8A80; --err-c: #46181A;

  /* ---- бумага документа (договор, подпись) — всегда светлая, в обеих темах ---- */
  --paper: #FBFAF7; --ink: #1D1F23; --ink-muted: #555A62; --paper-line: #9A9A9A;

  /* ---- шрифты: системный гротеск (SF Pro на iPhone/Mac, Roboto на Android — как в приложении). Без веб-шрифтов. ---- */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ---- шкала текста (px / межстрочный) ---- */
  --fs-hero: clamp(34px, 6vw, 60px);  /* только лендинг, первый экран */
  --fs-section: clamp(26px, 4vw, 36px); /* только лендинг, заголовок секции */
  --fs-display: 28px; --lh-display: 34px;  /* крупная цифра / заголовок экрана на компьютере */
  --fs-h1: 24px; --lh-h1: 30px;
  --fs-h2: 18px; --lh-h2: 24px;
  --fs-h3: 15px; --lh-h3: 20px;
  --fs-body: 16px; --lh-body: 1.45;  /* 16px — меньше нельзя в полях (iOS зумит) */
  --fs-small: 13px; --lh-small: 18px;
  --fw-head: 650; --fw-title: 600; --fw-medium: 500;
  --tracking-head: -0.01em;          /* только заголовки; разрядки капслоком нет нигде */

  /* ---- отступы: 4/8/12/16/24/32/40 ---- */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 40px;

  /* ---- радиусы ---- */
  --r-xs: 6px;    /* чипы, метки */
  --r-s: 10px;    /* кнопки, поля, сегменты, плашки */
  --r: 14px;      /* карточки, таблицы */
  --r-l: 20px;    /* крупные блоки лендинга, скриншоты телефона */
  --r-pill: 999px;

  /* ---- контролы ---- */
  --btn-h: 48px; --btn-h-sm: 36px; --btn-px: 20px;  /* 48px — палец на телефоне */
  --input-h: 44px; --input-bg: var(--bg); --input-line: var(--line2);
  --card-bg: var(--s1); --card-line: var(--line); --card-pad: 16px;

  /* ---- движение ----
     Акцент бренда — --primary выше (оранжевый PROrent, тот же, что в Android). Чужую палитру сюда не подмешивать.
     --dur — контролы. --dur-page — смена раздела: оболочка кабинета стоит, меняется только колонка. */
  --dur: .12s; --dur-page: .18s; --ease: cubic-bezier(.2, .7, .2, 1);

  /* ---- iPhone: вырезы и home indicator ---- */
  --sat: env(safe-area-inset-top); --sab: env(safe-area-inset-bottom); --sal: env(safe-area-inset-left); --sar: env(safe-area-inset-right);

  color-scheme: dark;
}

/* Светлая тема — веб-кабинет и Android (Ещё → Настройки → Тема). Тот же оттенок акцента, темнее для контраста на светлом. */
:root[data-theme="light"] {
  --primary: #1D4ED8; --on-primary: #FFFFFF; --primary-c: #DBEAFE; --primary-line: #93C5FD; --focus: #1D4ED8;
  --bg: #F5F4F1; --nav: #FBFAF8; --s1: #FFFFFF; --s2: #EFEDE9; --s3: #E2DFD9;
  --line: #E6E3DD; --line2: #D6D2CA;
  --text: #1C1E22; --muted: #5B616B; --faint: #868C95;
  --ok: #1D7A4C; --ok-c: #E0F2E8; --warn: #8A5A00; --warn-c: #FBF0D9; --err: #B8322A; --err-c: #FBE4E1;
  color-scheme: light;
}