/* ============================================================
   VRTH v3 · tokens.css · @layer tokens  (DESIGN.md §2, §3.2, §2.7; v4: значення — напрям A «Скарбниця», design/ART-DIRECTION.md)
   Усі значення — на :root, префікс --vx-. Акцент сторінки приходить
   із {% block accent %} → --acc (контракт), тут лише читається.
   Похідні рахуються color-mix() один раз. Тема одна, темна.
   ============================================================ */
@layer tokens{
:root{
  color-scheme:dark;

  /* ---- 2.1 поверхні — v4 напрям A «Скарбниця» (design/ART-DIRECTION.md): тепла темрява сховища, драбина світлішає догори ---- */
  --vx-bg-0:#0e0b08;          /* тло сторінки (= theme-color) */
  --vx-bg-1:#120e0a;          /* секції, hero хабів, док */
  --vx-sf-1:#16120d;          /* картка, панель, дропдаун */
  --vx-sf-2:#1e1912;          /* вкладена картка, hover, чип, інпут */
  --vx-sf-3:#28211a;          /* модалка, sheet, активний таб */
  --vx-sf-cab:#0f0c09;        /* екран ігрового автомата */
  --vx-sf-bezel:linear-gradient(180deg,#2a2118,#16110c);
  --vx-scrim:rgba(14,11,8,.86);/* підкладка оверлеїв — без backdrop-filter */

  /* ---- 2.2 лінії (тепле чорнило з прозорістю) ---- */
  --vx-ln-1:rgba(245,239,230,.07);
  --vx-ln-2:rgba(245,239,230,.12);
  --vx-ln-3:rgba(245,239,230,.22);
  --vx-ln-field:#857967;      /* межа поля/тумблера — ≥ 3:1 на всіх поверхнях (WCAG 1.4.11) */
  --vx-focus:#f6d58e;         /* кільце фокусу — ≥ 3:1 на всіх поверхнях */

  /* ---- 2.3 чорнило (на --vx-bg-0: 17.2 · 12.4 · 8.3 · 5.3) ---- */
  --vx-ink-1:#f5efe6;
  --vx-ink-2:#d6ccbd;
  --vx-ink-3:#b2a795;         /* мінімум для тексту (CORE-27) */
  --vx-ink-4:#8f8472;         /* декор, плейсхолдери */
  --vx-ink-on-acc:#1a1206;
  --vx-ink-on-gold:#1a1206;

  /* ---- 2.4 бренд, валюти, семантика. Акцент один — золото; ціан лише для даних XP/прогресу.
          Імена cyan/violet/pink лишились від v3 (на них посилаються сторінки) — значення тепер спокійні, без неону ---- */
  --vx-cyan:#8ed9df; --vx-violet:#cbb0f8; --vx-pink:#f6a6d4;
  --vx-brand-grad:linear-gradient(180deg,#f2cd80,#e8bc62 55%,#c98a1e); /* лише марка; градієнтного тексту в оболонці більше нема */
  --vx-gold:#e8bc62; --vx-gold-deep:#c98a1e;
  --vx-gold-grad:linear-gradient(180deg,#efc670,#e2b357);   /* майже пласке золото, без помаранчевого «неону» */
  --vx-gem:#c3a6ff;
  --vx-ok:#8bd7a2; --vx-warn:#ff8440; --vx-err:#ff9a8a; --vx-info:#a7c7e7; --vx-live:#ff6a5c;
  --vx-xp:#8ed9df; --vx-bp:var(--vx-xp);   /* прогрес = ціан (дані), золото = гроші й дія */

  /* ---- 2.5 простір, радіуси, тіні, z ---- */
  --vx-sp-1:4px; --vx-sp-2:8px; --vx-sp-3:12px; --vx-sp-4:16px; --vx-sp-5:24px; --vx-sp-6:32px; --vx-sp-7:48px; --vx-sp-8:64px;
  --vx-gutter:32px; --vx-container:1200px; --vx-container-game:920px; --vx-container-text:760px;
  --vx-r-1:6px; --vx-r-2:10px; --vx-r-3:14px; --vx-r-4:20px; --vx-r-pill:999px;
  --vx-el-1:inset 0 1px 0 rgba(255,255,255,.04),0 6px 18px rgba(0,0,0,.35);
  --vx-el-2:inset 0 1px 0 rgba(255,255,255,.06),0 18px 44px -14px rgba(0,0,0,.7);
  --vx-z-bg:-1; --vx-z-raised:10; --vx-z-sticky:100; --vx-z-dock:200; --vx-z-drawer:300;
  --vx-z-modal:400; --vx-z-reward:450; --vx-z-toast:500; --vx-z-fx:600;
  --vx-nav-h:64px;                                   /* пише ResizeObserver у core.js */
  --vx-dock-h:calc(56px + env(safe-area-inset-bottom));
  --vx-h-sm:32px; --vx-h-md:40px; --vx-h-lg:48px; --vx-h-hero:56px; --vx-h-chip:32px;

  /* ---- 2.7 рух ---- */
  --vx-d-1:80ms; --vx-d-2:140ms; --vx-d-3:220ms; --vx-d-4:320ms; --vx-d-5:450ms;
  --vx-d-reward:480ms; --vx-d-flip:600ms; --vx-d-page:120ms; --vx-d-bar:600ms;
  --vx-d-cine:900ms;          /* лише один момент сторінки: проявлення кадру лендингу (A) */
  --vx-e-out:cubic-bezier(.2,.8,.2,1); --vx-e-in:cubic-bezier(.4,0,1,1);
  --vx-e-spring:cubic-bezier(.22,1.2,.32,1); --vx-e-stop:cubic-bezier(.2,.9,.3,1.15);
  --vx-rm:0;                  /* 1 під prefers-reduced-motion; JS читає VRTH.rm */
  --vx-inf:infinite;          /* iteration-count дозволених нескінченних анімацій; RM → 1 */

  /* ---- 3.1 шрифти (A): Cormorant Garamond 600 — лише заголовки ≥ 28 px; Plex Sans — текст і дрібні «дисплейні» місця; Plex Mono — числа ---- */
  --vx-f-serif:"Cormorant Garamond","Cormorant-fallback",Georgia,serif;
  --vx-f-display:"IBM Plex Sans","Plex-fallback",system-ui,"Segoe UI",Roboto,sans-serif;
  --vx-f-text:"IBM Plex Sans","Plex-fallback",system-ui,"Segoe UI",Roboto,sans-serif;
  --vx-f-num:"IBM Plex Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
  --vx-f-mono:"IBM Plex Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;

  /* ---- 3.2 шкала (clamp 375→1440) ---- */
  --vx-t-display:clamp(40px,30px + 2.6vw,72px);   /* Cormorant: вужчий за Unbounded, тому більший кегль */
  --vx-t-h1:clamp(30px,26px + 1vw,40px);            /* Cormorant ≥ 28 px */
  --vx-t-h2:clamp(20px,18.5px + .4vw,24px);
  --vx-t-h3:clamp(17px,16.3px + .2vw,19px);
  --vx-t-body:16px;                                 /* тіло ≥ 16 px на будь-якій ширині */
  --vx-t-small:13px; --vx-t-cap:12px; --vx-t-deco:11px;
  --vx-t-num-xl:clamp(34px,29px + 1.3vw,48px);
  --vx-t-num-l:clamp(22px,20px + .55vw,28px);
  --vx-t-num-m:clamp(16px,15.3px + .2vw,18px);

  /* ---- 2.6 редкість: джерело кольорів ---- */
  --vx-rar-common:#a3adc2;    --vx-rar-common-ink:#c9d0e0;
  --vx-rar-uncommon:#5ccb6a;  --vx-rar-uncommon-ink:#8fe39a;
  --vx-rar-rare:#3b9cff;      --vx-rar-rare-ink:#7dbcff;
  --vx-rar-mythical:#b45cff;  --vx-rar-mythical-ink:#cf94ff;
  --vx-rar-legendary:#ffc832; --vx-rar-legendary-ink:#ffd966;
  --vx-rar-immortal:#ff5a4e;  --vx-rar-immortal-ink:#ff8a80;
  --vx-rar-exalted:#ff8a2a;   --vx-rar-exalted-ink:#ffad66;
  --vx-rar-arcana:#ff5ad9;    --vx-rar-arcana-ink:#ff8fe6;
  --vx-rar-ancient:#22e8ff;   --vx-rar-ancient-ink:#7df2ff;
  --vx-rar-cheat:#4dff2e;     --vx-rar-cheat-ink:#93ff7d;
  --vx-rar-secret:#d7b3ff;    --vx-rar-secret-ink:#ecdcff;
  --vx-rar-common-soft:rgba(163,173,194,.14);
  --vx-rar-uncommon-soft:rgba(92,203,106,.14);
  --vx-rar-rare-soft:rgba(59,156,255,.14);
  --vx-rar-mythical-soft:rgba(180,92,255,.14);
  --vx-rar-legendary-soft:rgba(255,200,50,.14);
  --vx-rar-immortal-soft:rgba(255,90,78,.14);
  --vx-rar-exalted-soft:rgba(255,138,42,.14);
  --vx-rar-arcana-soft:rgba(255,90,217,.14);
  --vx-rar-ancient-soft:rgba(34,232,255,.14);
  --vx-rar-cheat-soft:rgba(77,255,46,.14);
  --vx-rar-secret-soft:rgba(215,179,255,.14);
}

/* акцент сторінки і похідні — на :root і на будь-якому [data-acc]/[style="--acc"] контейнері */
:root,[data-acc]{
  --vx-acc:var(--acc,#e8bc62);
  --vx-acc-soft:color-mix(in srgb,var(--vx-acc) 14%,transparent);
  --vx-acc-glow:color-mix(in srgb,var(--vx-acc) 38%,transparent);
  --vx-acc-ink:color-mix(in srgb,var(--vx-acc) 82%,white);
  --vx-ln-acc:color-mix(in srgb,var(--vx-acc) 45%,transparent);
  --vx-el-cab:0 0 0 1px var(--vx-ln-2),0 24px 60px -20px #000,0 0 40px -10px var(--vx-acc-glow);
}
/* A: один акцент на весь сайт — колишні акценти ігор/розділів (cyan, violet, red…) зведено до золота; ідентичність гри — у її сцені, не в кольорі кнопки */
[data-acc]{--acc:#e8bc62}

/* ---- 2.6 каскад редкості: компонент знає лише --vx-rc / --vx-rc-soft / --vx-rc-ink ---- */
[data-rar=common]   {--vx-rc:var(--vx-rar-common);   --vx-rc-soft:var(--vx-rar-common-soft);   --vx-rc-ink:var(--vx-rar-common-ink)}
[data-rar=uncommon] {--vx-rc:var(--vx-rar-uncommon); --vx-rc-soft:var(--vx-rar-uncommon-soft); --vx-rc-ink:var(--vx-rar-uncommon-ink)}
[data-rar=rare]     {--vx-rc:var(--vx-rar-rare);     --vx-rc-soft:var(--vx-rar-rare-soft);     --vx-rc-ink:var(--vx-rar-rare-ink)}
[data-rar=mythical] {--vx-rc:var(--vx-rar-mythical); --vx-rc-soft:var(--vx-rar-mythical-soft); --vx-rc-ink:var(--vx-rar-mythical-ink)}
[data-rar=legendary]{--vx-rc:var(--vx-rar-legendary);--vx-rc-soft:var(--vx-rar-legendary-soft);--vx-rc-ink:var(--vx-rar-legendary-ink)}
[data-rar=immortal] {--vx-rc:var(--vx-rar-immortal); --vx-rc-soft:var(--vx-rar-immortal-soft); --vx-rc-ink:var(--vx-rar-immortal-ink)}
[data-rar=exalted]  {--vx-rc:var(--vx-rar-exalted);  --vx-rc-soft:var(--vx-rar-exalted-soft);  --vx-rc-ink:var(--vx-rar-exalted-ink)}
[data-rar=arcana]   {--vx-rc:var(--vx-rar-arcana);   --vx-rc-soft:var(--vx-rar-arcana-soft);   --vx-rc-ink:var(--vx-rar-arcana-ink)}
[data-rar=ancient]  {--vx-rc:var(--vx-rar-ancient);  --vx-rc-soft:var(--vx-rar-ancient-soft);  --vx-rc-ink:var(--vx-rar-ancient-ink)}
[data-rar=cheat]    {--vx-rc:var(--vx-rar-cheat);    --vx-rc-soft:var(--vx-rar-cheat-soft);    --vx-rc-ink:var(--vx-rar-cheat-ink)}
[data-rar=secret]   {--vx-rc:var(--vx-rar-secret);   --vx-rc-soft:var(--vx-rar-secret-soft);   --vx-rc-ink:var(--vx-rar-secret-ink)}
/* похідні мапи (одна мапа, без нових кольорів): тири ачівок, кейси, банер виграшу, тири БП */
[data-tier=bronze]{--vx-rc:var(--vx-rar-uncommon);--vx-rc-soft:var(--vx-rar-uncommon-soft);--vx-rc-ink:var(--vx-rar-uncommon-ink)}
[data-tier=silver]{--vx-rc:var(--vx-rar-rare);--vx-rc-soft:var(--vx-rar-rare-soft);--vx-rc-ink:var(--vx-rar-rare-ink)}
[data-tier=gold]{--vx-rc:var(--vx-rar-legendary);--vx-rc-soft:var(--vx-rar-legendary-soft);--vx-rc-ink:var(--vx-rar-legendary-ink)}
[data-tier=plat]{--vx-rc:var(--vx-rar-immortal);--vx-rc-soft:var(--vx-rar-immortal-soft);--vx-rc-ink:var(--vx-rar-immortal-ink)}
[data-tier=diamond]{--vx-rc:var(--vx-rar-ancient);--vx-rc-soft:var(--vx-rar-ancient-soft);--vx-rc-ink:var(--vx-rar-ancient-ink)}
[data-tier=secret]{--vx-rc:var(--vx-rar-secret);--vx-rc-soft:var(--vx-rar-secret-soft);--vx-rc-ink:var(--vx-rar-secret-ink)}
[data-case=wood]{--vx-rc:var(--vx-rar-rare);--vx-rc-soft:var(--vx-rar-rare-soft);--vx-rc-ink:var(--vx-rar-rare-ink)}
[data-case=bronze]{--vx-rc:var(--vx-rar-mythical);--vx-rc-soft:var(--vx-rar-mythical-soft);--vx-rc-ink:var(--vx-rar-mythical-ink)}
[data-case=silver],[data-case=donate]{--vx-rc:var(--vx-rar-legendary);--vx-rc-soft:var(--vx-rar-legendary-soft);--vx-rc-ink:var(--vx-rar-legendary-ink)}
[data-case=gold]{--vx-rc:var(--vx-rar-immortal);--vx-rc-soft:var(--vx-rar-immortal-soft);--vx-rc-ink:var(--vx-rar-immortal-ink)}
[data-case=platinum]{--vx-rc:var(--vx-rar-arcana);--vx-rc-soft:var(--vx-rar-arcana-soft);--vx-rc-ink:var(--vx-rar-arcana-ink)}
[data-case=cosmic]{--vx-rc:var(--vx-rar-ancient);--vx-rc-soft:var(--vx-rar-ancient-soft);--vx-rc-ink:var(--vx-rar-ancient-ink)}
[data-case=forbidden]{--vx-rc:var(--vx-rar-cheat);--vx-rc-soft:var(--vx-rar-cheat-soft);--vx-rc-ink:var(--vx-rar-cheat-ink)}

/* ---- адаптивні значення ---- */
@media (max-width:1200px){:root{--vx-gutter:24px}}
/* телефонна оболонка: ≤ 760 АБО ландшафт телефона (висота ≤ 480, ширина ≤ 1024; 812×375 — MOB-10, A-VIS-04) */
@media (max-width:760px), (orientation:landscape) and (max-height:480px) and (max-width:1024px){:root{--vx-gutter:16px;--vx-nav-h:56px;--vx-h-sm:36px;--vx-h-md:44px;--vx-h-lg:52px;--vx-h-chip:36px}}

/* ---- 6.9 reduced motion: тривалості 1ms (не 0, щоб transitionend/finish спрацьовували), 0 infinite ---- */
@media (prefers-reduced-motion:reduce){
  :root{--vx-d-1:1ms;--vx-d-2:1ms;--vx-d-3:1ms;--vx-d-4:1ms;--vx-d-5:1ms;--vx-d-reward:1ms;--vx-d-flip:1ms;--vx-d-page:1ms;--vx-d-bar:1ms;--vx-d-cine:1ms;--vx-rm:1;--vx-inf:1}
}

/* ---- legacy aliases (DESIGN §2.7): реальні значення поки задає нешаровий vrth.css → зсуву нема (ризик R2);
        після переїзду vrth.css у @layer kit старі сторінки перефарбуються у нову палітру без правки ---- */
:root{
  --vt-bg:var(--vx-bg-0); --vt-surface:var(--vx-sf-1); --vt-surface-2:var(--vx-bg-1); --vt-elev:var(--vx-sf-2);
  --vt-line:var(--vx-ln-2); --vt-line-soft:var(--vx-ln-1); --vt-text:var(--vx-ink-1); --vt-dim:var(--vx-ink-3); --vt-dim-2:var(--vx-ink-4);
  --r-rare:var(--vx-rar-rare); --r-mythical:var(--vx-rar-mythical); --r-legendary:var(--vx-rar-legendary);
  --r-immortal:var(--vx-rar-immortal); --r-arcana:var(--vx-rar-arcana); --r-cheat:var(--vx-rar-cheat);
  --spring:var(--vx-e-spring);
}
}