:root {
  /* Colores - Tema Oscuro Neutro (Default) */
  --color-bg: #09090b;      /* Zinc 950 */
  --color-surface: #27272a; /* Zinc 800 — visible against #09090b chat bg */
  --color-primary: #6366f1;
  --color-primary-hover: #818cf8;
  --color-text: #e2e8f0;
  --color-text-muted: #a1a1aa;
  --color-success: #22c55e;
  --color-relay: #3b82f6;
  --color-amber: #f59e0b;

  /* Espaciado */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* Type scale */
  --fs-2xs:   0.625rem;  /* 10px — badges mínimos */
  --fs-xs:    0.75rem;   /* 12px — metadata, indicadores */
  --fs-sm:    0.8125rem; /* 13px — labels secundarios */
  --fs-base:  0.875rem;  /* 14px — texto base app */
  --fs-md:    0.9375rem; /* 15px — texto medio */
  --fs-lg:    1rem;      /* 16px — nombres, títulos */
  --fs-xl:    1.125rem;  /* 18px — avatares texto */
  --fs-2xl:   1.5rem;    /* 24px — emojis grandes */
  --fs-3xl:   2rem;      /* 32px — status icons */
  --fs-icon:  3rem;      /* 48px — iconos decorativos */
  --fs-hero:  3.5rem;    /* 56px — lobby/empty hero */
  --fs-jumbo: 5rem;      /* 80px — duende emoji */

  /* Radios */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-full: 9999px;

  /* Transiciones */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease-out;
  --transition-slow: 400ms ease-in-out;

  /* Sombras */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 6px rgba(0,0,0,0.4);
  --shadow-lg: 0 10px 15px rgba(0,0,0,0.5);
}