diff --git a/nuxt4-app/app/assets/css/main.css b/nuxt4-app/app/assets/css/main.css
index 2129d9b..8f4b927 100644
--- a/nuxt4-app/app/assets/css/main.css
+++ b/nuxt4-app/app/assets/css/main.css
@@ -28,18 +28,19 @@
   --brand-text-muted: #d8c7a6;
 
   /* Mapear variables UI neutral a nuestras variables dinámicas --brand-*
-     Esto permite que los componentes de Nuxt UI respondan a cambios de tema */
-  --ui-color-neutral-50: var(--brand-bg);
-  --ui-color-neutral-100: var(--brand-bg);
-  --ui-color-neutral-200: var(--brand-surface);
-  --ui-color-neutral-300: var(--brand-border);
-  --ui-color-neutral-400: var(--brand-border);
-  --ui-color-neutral-500: var(--brand-primary-strong);
-  --ui-color-neutral-600: var(--brand-primary);
-  --ui-color-neutral-700: var(--brand-primary);
-  --ui-color-neutral-800: var(--brand-text-muted);
-  --ui-color-neutral-900: var(--brand-text);
-  --ui-color-neutral-950: var(--brand-text);
+     Esto permite que los componentes de Nuxt UI respondan a cambios de tema
+     IMPORTANTE: Nuxt UI usa neutral-50 para fondos oscuros y neutral-950 para texto claro en dark mode */
+  --ui-color-neutral-50: var(--brand-text);
+  --ui-color-neutral-100: var(--brand-text-muted);
+  --ui-color-neutral-200: var(--brand-primary);
+  --ui-color-neutral-300: var(--brand-primary);
+  --ui-color-neutral-400: var(--brand-primary-strong);
+  --ui-color-neutral-500: var(--brand-border);
+  --ui-color-neutral-600: var(--brand-border);
+  --ui-color-neutral-700: var(--brand-surface);
+  --ui-color-neutral-800: var(--brand-surface);
+  --ui-color-neutral-900: var(--brand-bg);
+  --ui-color-neutral-950: var(--brand-bg);
 }
 
 /* Critical: Prevent white flash on load */