@higinio/design-mcp 0.2.0 → 0.2.1

package/assets/salvia/tailwind.css

@@ -18,8 +18,7 @@
   --color-primary-300: #97b09e; /* decorativo — nunca texto sobre lino */
   --color-primary-400: #73907c;
   --color-primary-500: #4f6b58; /* acento salvia — botón primario, bordes, focus */
-  --color-primary-600: #435c4b; /* --link: texto de links y ghost (AA ~6:1) */
-  --color-primary-700: #384d3f;
+  --color-primary-600: #435c4b; /* --link: #435c4b;
   --color-primary-800: #304236;
   --color-primary-900: #2c3630; /* tinta de marca */
 
@@ -49,13 +48,13 @@
   --color-info-700: #3f5a70;
 
   /* == Tipografía → font-display, font-body, font-mono == */
-  --font-display: "Lora", Georgia, serif;              /* solo h1–h2 y cifras hero */
-  --font-body: "Nunito Sans", system-ui, sans-serif;
+  --font-display: "Lora", Georgia, serif;              /* marca, lectura y cifras destacadas */
+  --font-body: "Nunito Sans", system-ui, -apple-system, sans-serif;
   --font-mono: "Source Code Pro", ui-monospace, monospace;
 
   /* == Escala tipográfica (ratio 1.25) con line-heights emparejados == */
-  --text-xs: 0.75rem;      --text-xs--line-height: 1.5;
-  --text-sm: 0.875rem;     --text-sm--line-height: 1.5;
+  --text-xs: .75rem;      --text-xs--line-height: 1.5;
+  --text-sm: .875rem;     --text-sm--line-height: 1.5;
   --text-base: 1rem;       --text-base--line-height: 1.6;
   --text-lg: 1.125rem;     --text-lg--line-height: 1.55;
   --text-xl: 1.25rem;      --text-xl--line-height: 1.4;
@@ -119,3 +118,46 @@
   --color-danger: var(--danger-500);
   --color-info: var(--info-500);
 }
+
+/* CONTRATOS COMPARTIDOS GENERADOS */
+@theme inline {
+  --color-surface: var(--surface);
+  --color-surface-alt: var(--surface-alt);
+  --color-action-bg: var(--action-bg);
+  --color-action-hover: var(--action-hover);
+  --color-action-active: var(--action-active);
+  --color-text-on-action: var(--text-on-action);
+  --color-control-border: var(--control-border);
+  --color-focus-color: var(--focus-color);
+  --color-placeholder: var(--placeholder);
+  --color-selection-bg: var(--selection-bg);
+  --color-selection-text: var(--selection-text);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-chart-6: var(--chart-6);
+  --color-chart-7: var(--chart-7);
+  --spacing-1: var(--space-1);
+  --spacing-2: var(--space-2);
+  --spacing-3: var(--space-3);
+  --spacing-4: var(--space-4);
+  --spacing-5: var(--space-5);
+  --spacing-6: var(--space-6);
+  --spacing-8: var(--space-8);
+  --spacing-10: var(--space-10);
+  --spacing-12: var(--space-12);
+  --spacing-16: var(--space-16);
+  --spacing-20: var(--space-20);
+  --spacing-24: var(--space-24);
+  --spacing-field-gap: var(--field-gap);
+  --spacing-heading-gap: var(--heading-gap);
+  --spacing-content-gap: var(--content-gap);
+  --spacing-card-content-gap: var(--card-content-gap);
+  --spacing-card-group-gap: var(--card-group-gap);
+  --spacing-form-gap: var(--form-gap);
+  --spacing-section-gap: var(--section-gap);
+  --text-display: var(--text-display-fluid);
+  --text-title-ui: var(--text-ui-title);
+}

package/assets/salvia/tokens.css

@@ -95,6 +95,43 @@
   --stagger-step: 30ms;
 
   color-scheme: light;
+
+  --overlay: rgba(44, 54, 48, .5);
+  --tooltip-bg: var(--neutral-900);
+  --tooltip-text: var(--neutral-0);
+  --focus-color: var(--accent);
+  --text-on-danger: var(--neutral-0);
+  --border-hover: var(--neutral-500);
+  --ring-danger: 0 0 0 3px rgba(181,82,63,.22);
+
+  --action-bg: var(--accent);
+  --action-hover: var(--accent-hover);
+  --action-active: var(--accent-active);
+  --text-on-action: var(--text-on-primary);
+  --control-border: var(--border-strong);
+  --placeholder: var(--text-muted);
+  --selection-bg: var(--action-bg);
+  --selection-text: var(--text-on-action);
+  --font-ui-heading: var(--font-body);
+  --text-ui-title: 2rem;
+  --touch-target: 44px;
+  --text-display-fluid: clamp(2.5rem, 1.8rem + 2.4vw, 4.5rem);
+
+  /* Series categóricas: orden estable; acompañar con etiqueta o forma. */
+  --chart-1: #549864;
+  --chart-2: #8d4226;
+  --chart-3: #179a8e;
+  --chart-4: #81416d;
+  --chart-5: #8a8b39;
+  --chart-6: #195f91;
+  --chart-7: #996f18;
+  /* Ritmo de contenido y formularios. */
+  --field-gap: 6px;
+  --heading-gap: var(--space-2);
+  --content-gap: var(--space-4);
+  --card-content-gap: var(--space-4);
+  --card-group-gap: var(--space-8);
+
 }
 
 /* == Modo oscuro (variante) — alternar data-theme en <html> ==
@@ -130,14 +167,33 @@
   --shadow-lg: 0 8px 24px rgba(8,10,9,.3);
   --shadow-xl: 0 16px 32px rgba(8,10,9,.35);
   color-scheme: dark;
+
+  --overlay: rgba(0, 0, 0, .6);
+  --tooltip-bg: #e3e8e2;
+  --tooltip-text: #2c3630;
+  --focus-color: var(--accent);
+  --text-on-danger: #151a17;
+  --border-hover: #a6b0a8;
+  --ring-danger: 0 0 0 3px rgba(217,128,109,.25);
+
+  --selection-bg: var(--action-bg);
+  --selection-text: var(--text-on-action);
+
+  /* Series categóricas: orden estable; acompañar con etiqueta o forma. */
+  --chart-1: #60a46f;
+  --chart-2: #a85a3f;
+  --chart-3: #2da79b;
+  --chart-4: #9b5986;
+  --chart-5: #818230;
+  --chart-6: #3678ac;
+  --chart-7: #946b10;
 }
 
 /* == Accesibilidad del movimiento == */
+
 @media (prefers-reduced-motion: reduce) {
-  *, *::before, *::after {
-    animation-duration: 0.01ms !important;
-    animation-iteration-count: 1 !important;
-    transition-duration: 0.01ms !important;
-    scroll-behavior: auto !important;
+  :root {
+    --duration-instant: 0ms; --duration-fast: 0ms; --duration-base: 0ms;
+    --duration-slow: 0ms; --duration-page: 0ms; --stagger-step: 0ms;
   }
 }