/*
 * gaming-dark-1 — design tokens (Sci-fi gaming / immersive)
 * Источник: — (обезличено)
 *
 * Стиль: тёмная sci-fi-палитра + uppercase typography + сигнатурные
 * inset-glow тени по контуру кнопок (не border-line, а ауро по всему фону).
 * Композиция: hero с full-bleed background, левый action-sidebar
 * (плотный список крупных uppercase-кнопок), правый info-panel
 * (серверы / тарифы / live-данные).
 */

:root {
  /* ═══ ФОНЫ (deep space) ═══════════════════════════════════════ */
  --gd1-bg-base:        #0F161E;   /* body — тёмно-синий космос */
  --gd1-bg-surface:     #1B1E24;   /* карточки, action-buttons */
  --gd1-bg-deep:        #15181D;   /* server-rows, modals */
  --gd1-bg-elevated:    #25292F;   /* hover, активный elem */
  --gd1-bg-overlay-10:  rgba(255, 255, 255, 0.10);  /* самый частый surface (25 исп) */
  --gd1-bg-overlay-05:  rgba(255, 255, 255, 0.05);
  --gd1-bg-overlay-00:  rgba(255, 255, 255, 0.00);  /* invisible base */

  /* ═══ ТЕКСТ (white + opacity-based) ═══════════════════════════ */
  --gd1-text:           #FFFFFF;                   /* основной (434 исп) */
  --gd1-text-muted:     rgba(255, 255, 255, 0.60); /* body — самый частый (200 исп) */
  --gd1-text-dim:       rgba(255, 255, 255, 0.40); /* подсказки */
  --gd1-text-grey:      #999999;                   /* meta, времена */

  /* ═══ АКЦЕНТЫ (sci-fi triad: cyan/green/orange) ═══════════════ */
  --gd1-cyan:           #30B2E6;   /* основной brand (12 исп) — для primary actions */
  --gd1-cyan-soft:      rgba(48, 178, 230, 0.05);
  --gd1-cyan-glow:      rgba(48, 178, 230, 0.50);

  --gd1-green:          #0CB754;   /* успех, online (5 исп) */
  --gd1-green-soft:     rgba(12, 183, 84, 0.05);
  --gd1-green-glow:     rgba(12, 183, 84, 0.50);

  --gd1-orange:         #F2994A;   /* premium / promo (21 исп) */
  --gd1-orange-alt:     #F59E5A;
  --gd1-orange-soft:    rgba(245, 158, 90, 0.10);
  --gd1-orange-glow:    rgba(245, 158, 90, 0.50);

  --gd1-error:          #EB5757;

  /* ═══ БОРДЕРЫ (hairlines) ════════════════════════════════════ */
  --gd1-border-subtle:  rgba(255, 255, 255, 0.06);  /* самый частый (18 исп) */
  --gd1-border-medium:  rgba(255, 255, 255, 0.20);
  --gd1-border-cyan:    var(--gd1-cyan);
  --gd1-border-green:   var(--gd1-green);
  --gd1-border-orange:  var(--gd1-orange);

  /* ═══ ТИПОГРАФИКА ═════════════════════════════════════════════ */
  /* Оригинал — Rogan (commercial). Free-аналоги: Sora, Manrope, Outfit. */
  --gd1-font-body:      'Sora', 'Rogan Regular', -apple-system, BlinkMacSystemFont, sans-serif;
  --gd1-font-display:   'Sora', 'Rogan Semibold', sans-serif;

  /* Кегли (px). Базовый ~26.67px (1.33rem при 20px-base). */
  --gd1-fs-12:          12px;
  --gd1-fs-14:          14px;
  --gd1-fs-16:          16px;
  --gd1-fs-18:          18px;
  --gd1-fs-21:          21px;
  --gd1-fs-24:          24px;
  --gd1-fs-26:          26px;     /* BASE — 447 исп */
  --gd1-fs-29:          29px;
  --gd1-fs-32:          32px;
  --gd1-fs-44:          44px;     /* H1 page */
  --gd1-fs-56:          56px;     /* H1 hero */

  --gd1-fw-light:       300;
  --gd1-fw-regular:     400;     /* BASE — 733 исп */
  --gd1-fw-medium:      500;

  --gd1-lh-tight:       1.0;
  --gd1-lh-snug:        1.2;
  --gd1-lh-body:        1.3;     /* 34.67 / 26.67 — самый частый */
  --gd1-lh-relaxed:     1.46;    /* 39 / 26.67 */

  /* Letter-spacing для uppercase (gaming-стиль очень widespacing) */
  --gd1-ls-normal:      1.33px;
  --gd1-ls-wide:        1.92px;
  --gd1-ls-wider:       2.13px;  /* 79 исп — самый частый */
  --gd1-ls-widest:      3.52px;

  /* ═══ РАДИУСЫ ═════════════════════════════════════════════════ */
  --gd1-radius-sm:      6px;
  --gd1-radius-md:      9px;
  --gd1-radius-lg:      13px;    /* 44 исп — самый частый */
  --gd1-radius-xl:      26px;    /* pill для action-buttons */
  --gd1-radius-pill:    40px;
  --gd1-radius-circle:  50%;

  /* ═══ ТЕНИ (signature: inset-glow) ════════════════════════════
   * Сигнатурный приём gaming-dark — НЕ outer drop-shadow, а
   * inset 0 0 40px цветной — создаёт ощущение «свечения изнутри
   * элемента». Это очень характерный sci-fi приём.
   */
  --gd1-glow-white:     0 0 0 0 rgba(255,255,255,.20),
                        inset 0 0 40px 0 rgba(255,255,255,0);
  --gd1-glow-white-on:  0 0 53px 0 rgba(255,255,255,.20),
                        inset 0 0 40px 0 rgba(255,255,255,0);
  --gd1-glow-cyan:      inset 0 0 40px 0 var(--gd1-cyan-glow);
  --gd1-glow-green:     inset 0 0 40px 0 var(--gd1-green-glow);
  --gd1-glow-orange:    inset 0 0 40px 0 var(--gd1-orange-glow);

  --gd1-shadow-sm:      0 5px 32px -1px rgba(0,0,0,.20);

  /* ═══ TRANSITIONS ═════════════════════════════════════════════ */
  --gd1-ease:           ease-in-out;
  --gd1-duration-fast:  0.1s;
  --gd1-duration-base:  0.3s;
  --gd1-transition:     all var(--gd1-duration-base) var(--gd1-ease);

  /* ═══ SPACING ═════════════════════════════════════════════════ */
  --gd1-space-1:        4px;
  --gd1-space-2:        8px;
  --gd1-space-3:        12px;
  --gd1-space-4:        16px;
  --gd1-space-5:        20px;
  --gd1-space-6:        24px;
  --gd1-space-8:        32px;
  --gd1-space-10:       40px;
  --gd1-space-12:       48px;

  /* ═══ LAYOUT ══════════════════════════════════════════════════ */
  --gd1-container-max:  1400px;
  --gd1-action-sidebar-w: 280px;
  --gd1-info-panel-w:   320px;

  /* ═══ BREAKPOINTS ══════════════════════════════════════════════ */
  --gd1-bp-s:           640px;
  --gd1-bp-m:           960px;
  --gd1-bp-l:           1200px;
  --gd1-bp-xl:          1600px;
}