/* ── СПІЛЬНІ ТОКЕНИ БРЕНДУ: сайт і застосунок ──────────────────────────────
   Вантажиться ПЕРШИМ і там, і там (site/templates/_base.html, index.html).

   Навіщо. До перезбірки 2026-09 у сайту й застосунку не було жодної спільної
   змінної: той самий бурштин був записаний у двох місцях, темне тло — двома
   різними значеннями (сайт oklch(0.18…), застосунок #110f0c), а текст —
   двома шрифтами (сайт і застосунок у різних шрифтах). Людина, що тиснула
   «Відкрити застосунок», потрапляла на ледь інший продукт: тло темнішало,
   літери мінялись. Тепер обидві поверхні читають бренд з одного файла.

   Що тут є — лише ПЕРВИННЕ, те, що визначає бренд: колір, тло, шрифти,
   крива руху. Семантику (--fg, --dim, --line, поверхні карток) кожна
   поверхня будує сама, бо сайт і застосунок мають різні закони (вітрина і
   прилад — див. docs/DESIGN_SITE.md і docs/DESIGN.md), і зливати їх у один
   набір означало б змусити одну з них жити за чужими правилами. */
:root{
  --brand-amber: #f0a500;
  --brand-amber-hi: #ffc861;
  --brand-amber-deep: #c97f00;
  --brand-bg: #110f0c;          /* темне тло обох поверхонь */
  --brand-bg-2: #0c0a08;        /* глибше за тло: підложки, плівка */
  --brand-paper: oklch(0.955 0.012 85);  /* кремова смуга сайту, світла тема */

  /* Другий колір бренду — СТАН (живе, рахує, чекає, обрано), не дія.
     Застосунок має власні --violet/--violet-2 у css/core/01_base.css з тими
     самими значеннями; тут — первинні значення з префіксом --brand-,
     щоб не перебити їх (див. пастку --brand-ink, 2026-09). Сайт будує з них
     свої --violet* у site/noir.css. */
  --brand-violet: #7c5cff;
  --brand-violet-2: #b14bd8;

  /* Одна родина на весь продукт. Geologica: змінна вага, рідна кирилиця,
     читається як прилад, а не як шаблон. Запасний «Geologica Fallback» метрично підігнаний
     з близькими метриками: якщо woff2 не доїде, розкладка не поїде. */
  --sans: "Geologica", "Geologica Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
  /* Система B (2026-10-05): дисплейна роль теж Geologica, легкі начертання
     (300 від 40px, 400 нижче). Імʼя --serif лишилось, бо на нього посилаються
     ~90 правил; це вже НЕ засічки. --display — те саме, для нових правил. */
  --display: var(--sans);
  --serif: var(--display);
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Consolas, monospace; /* лише дані */

  /* ролі типографіки (fluid) */
  --fs-display: clamp(2.5rem, 1.6rem + 4vw, 4.5rem);   /* H1 */
  --fs-h2: clamp(1.875rem, 1.4rem + 2.2vw, 3rem);
  --fs-hook: clamp(1.125rem, 1rem + .6vw, 1.5rem);
  --fs-kicker: .75rem;
  --fw-display: 300; --fw-ui: 500; --fw-strong: 600;
  --num: "tnum" 1, "lnum" 1;

  --ease: cubic-bezier(.32,.72,0,1);

  /* ── Мова «бомби» (Direction 2026-10-05, F1): скляна бенто-картка з обідком
     амбер→фіолет. Компонент — shared/rim.css. Ролі кольору: фіолетовий = AI /
     живе / в процесі / вибране, бурштин = готово / головна дія. ── */
  --so-amber: var(--brand-amber); --so-amber-hi: var(--brand-amber-hi); --so-amber-deep: var(--brand-amber-deep);
  --so-violet: var(--brand-violet); --so-violet-2: var(--brand-violet-2); --so-violet-ink: #a892ff;
  --so-rim: linear-gradient(135deg, var(--so-amber-hi) 0%, var(--so-amber) 26%, var(--so-violet-2) 64%, var(--so-violet) 100%);
  --so-rim-calm: linear-gradient(135deg, color-mix(in srgb,var(--so-amber) 55%,transparent), transparent 40%, transparent 60%, color-mix(in srgb,var(--so-violet) 55%,transparent));
  --so-glass: linear-gradient(180deg, color-mix(in srgb,#fff 6.5%,transparent), color-mix(in srgb,#fff 2.5%,transparent) 60%);
  --so-r-xl: 28px; --so-r-l: 22px; --so-r-m: 16px; --so-r-s: 10px;
  --so-depth-1: 0 1px 0 rgba(255,255,255,.06) inset, 0 12px 32px -12px rgba(0,0,0,.6);
  --so-depth-2: 0 1px 0 rgba(255,255,255,.08) inset, 0 30px 60px -20px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.03);
  /* рух */
  --so-ease-out: cubic-bezier(.22,1,.36,1);      /* поява, вхід */
  --so-ease-io: cubic-bezier(.65,0,.35,1);       /* переходи станів */
  --so-ease-cam: cubic-bezier(.7,0,.2,1);        /* камера, зум */
  --so-spring: cubic-bezier(.34,1.56,.64,1);     /* «стук» галочки, підскок */
  --so-t-1: 160ms; --so-t-2: 320ms; --so-t-3: 560ms; --so-t-4: 900ms; --so-stagger: 70ms;
}

/* ── Типографіка, система B (2026-10-05): базові правила ролей ─────────────
   Тут лише елементні селектори — класи поверхонь (site.css, app_*.css) далі
   по каскаду перекривають їх, як і раніше. */
html{ font-synthesis:none; font-variant-numeric:lining-nums }  /* жодного фальшивого жирного/курсиву */
b,strong,th{ font-weight:var(--fw-strong) }                    /* було 700 за замовчуванням */
.tnum,.t-num,.num,time{ font-variant-numeric:lining-nums tabular-nums }
code,kbd,samp,pre{ font-family:var(--mono); font-weight:400 }
