/* ═══════════════════════════════════════════
   variables.css  ·  Дизайн-токены DebPixel
   Меняй здесь — изменится весь сайт
   ═══════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,600;12..96,700;12..96,800&display=swap');

:root {
  /* Фон */
  --bg:        #06080f;
  --bg2:       #0b0f1a;
  --surface:   #0f1422;
  --surface2:  #141926;
  --border:    #1c2438;
  --border2:   #253050;

  /* Акценты */
  --cyan:      #00d4ff;
  --cyan-dim:  rgba(0,212,255,.12);
  --violet:    #7c3aed;
  --green:     #10f090;
  --green-dim: rgba(16,240,144,.1);
  --red:       #ff3560;
  --red-dim:   rgba(255,53,96,.1);
  --yellow:    #fbbf24;
  --yellow-dim:rgba(251,191,36,.1);

  /* Текст */
  --text:      #dce8f8;
  --muted:     #56687e;
  --muted2:    #374559;

  /* Типографика */
  --font:      'Bricolage Grotesque', sans-serif;
  --mono:      'JetBrains Mono', monospace;

  /* Радиусы */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 24px;

  /* Тени */
  --glow-cyan:  0 0 28px rgba(0,212,255,.2);
  --glow-green: 0 0 20px rgba(16,240,144,.18);
}