/* ============================================================
   variables.css — Tokens de design (cores, tipografia, espaços)
   ============================================================ */

:root {
  /* Cores de fundo */
  --bg:       #0f0f13;
  --surface:  #1a1a22;
  --surface2: #22222e;
  --border:   #2e2e3e;

  /* Cores de destaque */
  --accent:   #7c6ef0;
  --accent2:  #e06c75;
  --accent3:  #56d9b0;
  --gold:     #f0c060;

  /* Texto */
  --text:     #f0f0f8;
  --muted:    #7878a0;

  /* Tipografia */
  --font-display: 'Syne', sans-serif;
  --font-body:    'DM Sans', sans-serif;

  /* Raios de borda */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;

  /* Espaçamentos base */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 24px;
  --space-2xl: 32px;
}