/* Токени бази знань. Макет: файл «Godlike // Wordpress // New»
   (Figma pqGttCnPcAFQGbGvNa5zin), сторінка «Knowledge Base (New design Old
   colors)». Значення прочитані в самому файлі (панель Properties шарів), а не
   з ока по скріншоту.

   Розкладка розділу власна, а палітра — САЙТОВА: той самий синьо-фіолетовий
   акцент (#007CEE -> #5F39CB), що й на решті сторінок. Окремої «зеленої»
   візуальної мови в базі знань більше немає. Фон розділу лишається темнішим за
   сайтовий (#00000B проти #1B1B2C) — це навмисно, так у макеті.
   Хекси живуть ТІЛЬКИ тут: решта файлів kb-*.css ходить через ці змінні. */
:root {
  /* Gradient/Main Default — дві стопи. Ним залиті обидві плями фонового
     світіння, рамки всіх панелей і заливка кнопок. */
  --kb-accent: #007CEE;
  --kb-accent-2: #5F39CB;
  --kb-gradient-brand: linear-gradient(90deg, var(--kb-accent) 0%, var(--kb-accent-2) 100%);
  /* Ховер акцентної кнопки. Не власна вигадка: тема РЕВЕРСУЄ той самий градієнт
     (css/new/style.scss:927, тільки від 1201px) — саме ця умова й дає видимий
     ховер. Було filter: brightness(1.08), а на синьо-фіолетовому це майже
     нічого. */
  --kb-gradient-brand-hover: linear-gradient(90deg, var(--kb-accent-2) 0%, var(--kb-accent) 100%);

  /* Gradient/Chat — заливка АКТИВНОГО рядка списку категорій. Прочитано в
     макеті на компоненті Tab (state=on) у фреймі Minecraft_page. Це глибокий
     синьо-нічний перехід, а не акцент на 12%, який стояв тут раніше. */
  --kb-gradient-chat: linear-gradient(90deg, #24253C 0%, #202D70 100%);

  --kb-bg: #00000B;
  --kb-surface: #121111;
  /* Панелі й герой залиті поверхнею на 50% поверх фонового світіння. */
  --kb-surface-50: rgba(18, 17, 17, 0.5);

  --kb-text: #FFFFFF;
  --kb-text-muted: #CDD2D4;
  --kb-text-dim: #838788;
  /* grayscale/050 — неактивний таб фільтра. Окремо від --kb-text-dim: у макеті
     вимкнений таб майже білий, а не сірий (заміряно на компоненті Tab, state=off). */
  --kb-tab-text: #D9E0E3;
  --kb-placeholder: #6A6C6D;

  --kb-radius-card: 24px;
  --kb-radius-inner: 12px;
  --kb-radius-btn: 16px;
  /* corner/corner-sm — радіус табів фільтра на Game Servers. Значення токена в
     макеті недоступне без Variables, тож узяте з геометрії самого pill (88x32)
     у пропорції сусідніх компонентів. Звірити при першій же нагоді. */
  --kb-radius-pill: 8px;

  --kb-gap-tiny: 2px;
  --kb-gap: 12px;
  --kb-gap-grid: 16px;
  --kb-gap-large: 20px;
  --kb-pad-card: 24px;
  --kb-pad-card-mob: 20px;

  --kb-content: 1080px;
  --kb-search: 640px;

  /* Екран категорії шириший за головну: 1440 - 2×70 = 1300 (get_metadata 18:5267).
     Головна лишається 1080 — це різні ширини, не помилка. */
  --kb-content-wide: 1300px;
  /* Бокові колонки категорії/статті: 310 + 640 + 310 + 2×20 = 1300. */
  --kb-col-side: 310px;
  --kb-gap-col: 20px;
  /* Тонка розділова лінія. Окремим токеном, щоб rgba не розповзалась по файлах. */
  --kb-hairline: rgba(255, 255, 255, 0.08);
  /* Підсвітка активного/наведеного пункта — тінти акценту #007CEE на 12% і 6%.
     Записані літералами, бо rgba() не вміє брати канали з var(). */
  --kb-accent-12: rgba(0, 124, 238, 0.12);
  --kb-accent-06: rgba(0, 124, 238, 0.06);
}