@higinio/design-mcp 0.1.0 → 0.2.0

package/assets/nocturna/tailwind.css

@@ -17,8 +17,9 @@
   --color-accent-300: #7dccf1;
   --color-accent-400: #52baed; /* acento principal — un CTA por pantalla */
   --color-accent-500: #2fa3dd;
-  --color-accent-600: #1f87bb;
-  --color-accent-700: #186a94;
+  --color-accent-600: #1f87bb; /* UI sobre claro (4.01:1) — nunca texto */
+  --color-accent-700: #186a94; /* texto de acción sobre claro (5.95:1) */
+  --color-accent-800: #12506f; /* hover del texto de acción en light (8.74:1) */
 
   --color-indigo-300: #7a83c4;
   --color-indigo-400: #565fa3;
@@ -33,6 +34,7 @@
   --color-night-700: #1e222d;
   --color-night-600: #2a2f3d;
   --color-night-500: #3d4354;
+  --color-night-450: #5f6575; /* texto atenuado en light */
   --color-night-400: #6b7183;
   --color-night-300: #9aa0b0;
   --color-night-200: #c5c9d4;
@@ -112,4 +114,8 @@
   --color-accent-brand: var(--accent-400);
   --color-on-accent: var(--text-on-accent);
   --color-link: var(--link);
+  --color-success: var(--success);
+  --color-warning: var(--warning);
+  --color-danger: var(--danger);
+  --color-info: var(--info);
 }

package/assets/nocturna/tokens.css

@@ -9,9 +9,12 @@
 @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Manrope:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');
 
 :root {
-  /* == Primitivos: acento (Celeste Eléctrico) == */
+  /* == Primitivos: acento (Celeste Eléctrico) ==
+     accent-600 sobre blanco da 4.01:1 — vale como UI (≥3) pero NO como texto (<4.5).
+     Para texto sobre claro se usa accent-700 (5.95:1) y accent-800 (8.74:1). */
   --accent-100: #d9f0fb; --accent-200: #a8ddf6; --accent-300: #7dccf1;
   --accent-400: #52baed; --accent-500: #2fa3dd; --accent-600: #1f87bb; --accent-700: #186a94;
+  --accent-800: #12506f;
 
   /* == Primitivos: índigo (Índigo Profundo) — nunca texto sobre negro == */
   --indigo-300: #7a83c4; --indigo-400: #565fa3; --indigo-500: #353d7c;
@@ -20,6 +23,7 @@
   /* == Primitivos: escala nocturna == */
   --night-950: #010203; --night-900: #0b0d12; --night-800: #14171f;
   --night-700: #1e222d; --night-600: #2a2f3d; --night-500: #3d4354;
+  --night-450: #5f6575; /* texto atenuado en light: night-400 caía a 4.27:1 sobre --surface-3 */
   --night-400: #6b7183; --night-300: #9aa0b0; --night-200: #c5c9d4;
   --night-100: #e8eaef; --night-50: #f6f7f9;
 
@@ -35,7 +39,10 @@
   --surface-2: var(--night-800);
   --surface-3: var(--night-700);
   --border: var(--night-500);
-  --border-strong: var(--night-600);
+  /* night-400, no night-600: en dark, oscurecer un borde lo DEBILITA (principio 2:
+     la elevación se comunica aclarando). n600 daba 1.46:1 vs los 1.97:1 del borde
+     normal — el énfasis se veía más flojo. n400 = 3.99:1 sobre surface-1. */
+  --border-strong: var(--night-400);
   --text-primary: var(--night-100);
   --text-secondary: var(--night-200);
   --text-muted: var(--night-300);
@@ -76,7 +83,7 @@
   --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px;
   --radius-xl: 24px; --radius-full: 9999px;
   --border-default: 1px solid var(--night-500);
-  --border-emphasis: 1px solid var(--night-600);
+  --border-emphasis: 1px solid var(--night-400); /* ver --border-strong */
   --focus-ring: 2px solid var(--accent-400);
   --focus-ring-offset: 2px;
 
@@ -107,19 +114,23 @@
   --surface-2: #ffffff;
   --surface-3: #eaf1f7;
   --border: #d8dfe8;
-  --border-strong: #b9c3d1;
+  /* border-strong NO se redefine en claro: night-400 (:root) cumple 1.4.11 en
+     AMBOS temas (3.26-3.99:1 en dark, 4.27-4.87:1 en light). #b9c3d1 daba
+     1.53-1.78:1, bajo el mínimo de 3:1 para UI. */
   --text-primary: #14171f;
   --text-secondary: #3d4354;
-  --text-muted: #6b7183;
+  --text-muted: var(--night-450); /* no night-400: ese caía a 4.27:1 sobre --surface-3 */
   --text-disabled: #9aa0b0;
   --text-heading: #14171f;
-  --link: #1f87bb;
-  --link-hover: #186a94;
+  --link: #186a94; /* accent-700 · 5.95:1 sobre blanco — accent-600 solo daba 4.01:1 */
+  --link-hover: #12506f; /* accent-800 · en light el hover OSCURECE (en dark aclara) */
   --text-on-accent: #010203; /* CTA no cambia entre modos */
-  --success: #15803d;
-  --warning: #a16207;
-  --danger: #c03535;
-  --info: #1f87bb;
+  /* Semánticos de light: son a la vez relleno y TEXTO sobre su propio --*-bg tintado,
+     así que se calibran contra ese fondo, no contra blanco. */
+  --success: #166534;
+  --warning: #854d0e;
+  --danger: #b02c2c;
+  --info: #186a94;
   --success-bg: #e3f5ea; --warning-bg: #fbf3dd;
   --danger-bg: #fbe7e7;  --info-bg: #e3f2fb;
   --accent-ghost-hover: rgba(31,135,187,.08);

package/assets/nocturna/tokens.json

@@ -79,7 +79,20 @@
             0.5804
           ],
           "hex": "#186a94"
-        }
+        },
+        "$description": "Texto de acción sobre fondos claros (5.95:1 sobre blanco)"
+      },
+      "800": {
+        "$value": {
+          "colorSpace": "srgb",
+          "components": [
+            0.0706,
+            0.3137,
+            0.4353
+          ],
+          "hex": "#12506f"
+        },
+        "$description": "Hover del texto de acción en modo claro (8.74:1 sobre blanco)"
       }
     },
     "indigo": {
@@ -208,6 +221,18 @@
           "hex": "#6b7183"
         }
       },
+      "450": {
+        "$value": {
+          "colorSpace": "srgb",
+          "components": [
+            0.3725,
+            0.3961,
+            0.4588
+          ],
+          "hex": "#5f6575"
+        },
+        "$description": "Texto atenuado en modo claro (5.11:1 sobre --surface-3; night-400 solo daba 4.27:1)"
+      },
       "500": {
         "$value": {
           "colorSpace": "srgb",