:root {
  --fuente-principal: "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fuente-mono: ui-monospace, Menlo, Consolas, monospace;

  --color-texto-primario: #ffffff;
  --color-texto-secundario: rgba(255, 255, 255, 0.82);
  --color-texto-suave: rgba(255, 255, 255, 0.7);
  --color-texto-atenuado: rgba(255, 255, 255, 0.55);
  --color-superficie-base: #0a0624;
  --color-superficie-campo: rgba(10, 6, 36, 0.7);
  --color-superficie-tarjeta: rgba(255, 255, 255, 0.05);
  --color-superficie-sutil: rgba(255, 255, 255, 0.04);
  --color-superficie-hover: rgba(255, 255, 255, 0.08);
  --color-superficie-azul: #003399;
  --color-borde: rgba(255, 255, 255, 0.1);
  --color-borde-campo: rgba(255, 255, 255, 0.14);
  --color-borde-fuerte: rgba(255, 255, 255, 0.18);
  --color-acento: #e6007e;
  --color-acento-hover: #ff1a95;
  --color-acento-rosa: #ff4fb0;
  --color-acento-fondo: rgba(230, 0, 126, 0.12);
  --color-acento-borde: rgba(230, 0, 126, 0.4);
  --sombra-acento: 0 12px 30px rgba(230, 0, 126, 0.35);
  --color-oro: #ffb800;
  --color-plata: #c9d1e3;
  --color-bronce: #cd7f32;
  --color-error: #ff8f8f;

  --radio-sm: 10px;
  --radio-md: 12px;
  --radio-lg: 14px;
  --radio-xl: 18px;
  --radio-2xl: 24px;
  --radio-pildora: 999px;

  --margen-lateral: clamp(16px, 5vw, 64px);
  --ancho-max: 1280px;
}