@higinio/design-mcp 0.1.0

package/dist/preflight.js

@@ -0,0 +1,181 @@
+/** Verifica estáticamente la estructura de un documento HTML/CSS antes de producción (SEO, a11y, perf estático). */
+export function checkPreflight(code, lang) {
+    const out = [];
+    const isFullDoc = /<!doctype|<html|<head/i.test(code);
+    if (lang === "html") {
+        const h1count = (code.match(/<h1\b/gi) ?? []).length;
+        if (isFullDoc) {
+            if (/<html\b/i.test(code) && !/<html\b[^>]*\blang\s*=/i.test(code)) {
+                out.push({ level: "warn", rule: "falta-lang", line: 0,
+                    message: "El <html> no declara idioma (lang).",
+                    fix: 'Añade lang al <html> (ej. <html lang="es">).' });
+            }
+            if (/<head\b/i.test(code) && !/<title\b/i.test(code)) {
+                out.push({ level: "warn", rule: "falta-title", line: 0,
+                    message: "El documento no tiene <title>.",
+                    fix: "Añade un <title> descriptivo (50–60 caracteres)." });
+            }
+            if (!/<meta\b[^>]*charset/i.test(code)) {
+                out.push({ level: "info", rule: "falta-charset", line: 0,
+                    message: "No hay <meta charset>.",
+                    fix: 'Añade <meta charset="utf-8"> como primer elemento del <head>.' });
+            }
+            if (!/<meta\b[^>]*name\s*=\s*["']viewport["']/i.test(code)) {
+                out.push({ level: "warn", rule: "falta-viewport", line: 0,
+                    message: 'No hay <meta name="viewport">.',
+                    fix: "Añade el viewport responsive." });
+            }
+            if (!/<meta\b[^>]*name\s*=\s*["']description["']/i.test(code)) {
+                out.push({ level: "info", rule: "falta-meta-description", line: 0,
+                    message: 'No hay <meta name="description">.',
+                    fix: "Añade una meta description (150–160 caracteres)." });
+            }
+            if (!/<link\b[^>]*rel\s*=\s*["']canonical["']/i.test(code)) {
+                out.push({ level: "info", rule: "falta-canonical", line: 0,
+                    message: 'No hay <link rel="canonical">.',
+                    fix: "Añade el canonical auto-referente." });
+            }
+            if (h1count === 0) {
+                out.push({ level: "info", rule: "h1-ausente", line: 0,
+                    message: "La página no tiene <h1>.",
+                    fix: "Añade un <h1> que describa la página." });
+            }
+            if (!/<meta\b[^>]*name\s*=\s*["']theme-color["']/i.test(code)) {
+                out.push({ level: "info", rule: "sin-theme-color", line: 0,
+                    message: 'No hay <meta name="theme-color">.',
+                    fix: "Añade theme-color con el fondo de la marca (Nocturna #010203, Celeste #f7f8fa); sin él la barra del navegador queda clara sobre una app oscura." });
+            }
+            for (const meta of code.match(/<meta\b[^>]*>/gi) ?? []) {
+                if (/name\s*=\s*["']robots["']/i.test(meta) && /noindex/i.test(meta)) {
+                    out.push({ level: "warn", rule: "noindex-accidental", line: 0,
+                        message: '<meta name="robots"> contiene noindex.',
+                        fix: "Quítalo si la página debe indexarse; noindex la saca de los buscadores." });
+                    break;
+                }
+            }
+            const bodyM = code.match(/<body\b[^>]*>/i);
+            if (/<nav\b/i.test(code) && bodyM) {
+                const inicio = code.slice(code.indexOf(bodyM[0]) + bodyM[0].length).slice(0, 1500);
+                if (!/<a\b[^>]*href\s*=\s*["']#/i.test(inicio)) {
+                    out.push({ level: "info", rule: "sin-skip-link", line: 0,
+                        message: "Hay <nav> pero ningún enlace interno al inicio del <body> (skip link).",
+                        fix: "Añade un skip link como primer elemento enfocable («Saltar al contenido», href=#main)." });
+                }
+            }
+        }
+        const titleM = code.match(/<title\b[^>]*>([^<]*)<\/title>/i);
+        if (titleM) {
+            const len = titleM[1].trim().length;
+            if (len > 0 && (len < 30 || len > 60)) {
+                out.push({ level: "info", rule: "title-longitud", line: 0,
+                    message: `El <title> tiene ${len} caracteres.`,
+                    fix: "Apunta a 50–60 caracteres." });
+            }
+        }
+        for (const meta of code.match(/<meta\b[^>]*>/gi) ?? []) {
+            if (!/name\s*=\s*["']description["']/i.test(meta))
+                continue;
+            const cM = meta.match(/content\s*=\s*["']([^"']*)["']/i);
+            if (cM) {
+                const len = cM[1].trim().length;
+                if (len > 0 && (len < 70 || len > 160)) {
+                    out.push({ level: "info", rule: "meta-description-longitud", line: 0,
+                        message: `La meta description tiene ${len} caracteres.`,
+                        fix: "Apunta a 150–160 caracteres." });
+                }
+            }
+            break;
+        }
+        if (h1count > 1) {
+            out.push({ level: "info", rule: "h1-multiple", line: 0,
+                message: `Hay ${h1count} <h1>; debe haber uno por página.`,
+                fix: "Deja un solo <h1>; el resto, <h2>–<h6>." });
+        }
+        let prevHeading = 0;
+        for (const h of code.matchAll(/<h([1-6])\b/gi)) {
+            const lvl = parseInt(h[1], 10);
+            if (prevHeading > 0 && lvl > prevHeading + 1) {
+                out.push({ level: "warn", rule: "salto-de-heading", line: 0,
+                    message: `La jerarquía de headings salta de h${prevHeading} a h${lvl}.`,
+                    fix: "No saltes niveles de heading; usa el siguiente y ajusta el tamaño con CSS si hace falta." });
+            }
+            prevHeading = lvl;
+        }
+        for (const img of code.match(/<img\b[^>]*>/gi) ?? []) {
+            if (!/\balt\s*=/i.test(img)) {
+                out.push({ level: "warn", rule: "img-sin-alt", line: 0,
+                    message: "Una <img> no tiene alt.",
+                    fix: 'Añade alt (cadena vacía alt="" si es decorativa).' });
+            }
+            if (!/\bwidth\s*=/i.test(img) || !/\bheight\s*=/i.test(img)) {
+                out.push({ level: "info", rule: "img-sin-dimensiones", line: 0,
+                    message: "Una <img> no declara width y height.",
+                    fix: "Añade width y height para evitar CLS." });
+            }
+            if (!/\bsrc\s*=/i.test(img) || /\bsrc\s*=\s*(["'])\s*\1/i.test(img)) {
+                out.push({ level: "error", rule: "img-src-vacio", line: 0,
+                    message: "Una <img> tiene src vacío o no declara src.",
+                    fix: "Pon una URL válida en src (un src vacío vuelve a solicitar la página actual)." });
+            }
+        }
+        for (const btn of code.match(/<button\b[^>]*>([\s\S]*?)<\/button>/gi) ?? []) {
+            const inner = btn.replace(/<button\b[^>]*>|<\/button>/gi, "");
+            const hasIcon = /<svg\b|<i\b/i.test(inner);
+            const textContent = inner.replace(/<[^>]*>/g, "").trim();
+            const hasLabel = /\baria-label\s*=|\baria-labelledby\s*=|\btitle\s*=/i.test(btn);
+            if (hasIcon && !textContent && !hasLabel) {
+                out.push({ level: "warn", rule: "boton-icono-sin-label", line: 0,
+                    message: "Un <button> solo con icono no tiene texto ni aria-label.",
+                    fix: "Añade aria-label describiendo la acción." });
+            }
+        }
+        for (const meta of code.match(/<meta\b[^>]*>/gi) ?? []) {
+            if (/name\s*=\s*["']viewport["']/i.test(meta) && /(user-scalable\s*=\s*no|maximum-scale\s*=\s*1\b)/i.test(meta)) {
+                out.push({ level: "warn", rule: "zoom-bloqueado", line: 0,
+                    message: "El viewport bloquea el zoom (user-scalable=no / maximum-scale=1).",
+                    fix: "No bloquees el zoom; es un problema de accesibilidad." });
+                break;
+            }
+        }
+        for (const input of code.match(/<input\b[^>]*>/gi) ?? []) {
+            const personal = /type\s*=\s*["'](email|tel|password)["']/i.test(input);
+            if (personal && !/\bautocomplete\s*=/i.test(input)) {
+                out.push({ level: "info", rule: "input-sin-autocomplete", line: 0,
+                    message: "Un <input> de dato personal no declara autocomplete.",
+                    fix: "Añade autocomplete apropiado (email, tel, current-password…)." });
+            }
+        }
+        if (/onpaste\s*=\s*["'][^"']*(?:preventDefault|return\s+false)/i.test(code)
+            || /["']paste["'][\s\S]{0,160}?preventDefault/i.test(code)) {
+            out.push({ level: "warn", rule: "paste-bloqueado", line: 0,
+                message: "Se bloquea el pegado (onpaste con preventDefault / return false).",
+                fix: "Nunca bloquees pegar: rompe gestores de contraseñas y códigos de verificación." });
+        }
+        const genericos = new Set(["click aquí", "haz clic aquí", "aquí", "click here", "read more", "leer más"]);
+        for (const a of code.matchAll(/<a\b[^>]*>([\s\S]*?)<\/a>/gi)) {
+            const texto = a[1].replace(/<[^>]*>/g, "").replace(/\s+/g, " ").trim().toLowerCase();
+            if (genericos.has(texto)) {
+                out.push({ level: "info", rule: "enlace-generico", line: 0,
+                    message: `Enlace con texto genérico «${texto}».`,
+                    fix: "Usa texto que describa el destino («Ver la guía de tokens», no «aquí»)." });
+            }
+        }
+        for (const s of code.match(/<script\b[^>]*\bsrc\s*=\s*["']https?:\/\/[^"']*["'][^>]*>/gi) ?? []) {
+            if (!/\bintegrity\s*=/i.test(s)) {
+                out.push({ level: "info", rule: "script-externo-sin-sri", line: 0,
+                    message: "Un <script> externo no tiene integrity (SRI).",
+                    fix: "Añade integrity (sha384) y crossorigin." });
+            }
+        }
+    }
+    if (lang === "css") {
+        for (const face of code.match(/@font-face\s*\{[^}]*\}/gi) ?? []) {
+            if (!/font-display\s*:/i.test(face)) {
+                out.push({ level: "info", rule: "font-display-faltante", line: 0,
+                    message: "Un @font-face no declara font-display.",
+                    fix: "Añade font-display: swap (u optional)." });
+            }
+        }
+    }
+    return out;
+}

package/dist/server.js

@@ -0,0 +1,219 @@
+import { McpServer, ResourceTemplate } from "@modelcontextprotocol/sdk/server/mcp.js";
+import { z } from "zod";
+import { SYSTEM_IDS } from "./systems.js";
+import { resolveToken, searchTokens } from "./tokens.js";
+import { listComponents, getComponentSpec } from "./doc.js";
+import { validateCode } from "./validate.js";
+import { generateSnippet } from "./snippet.js";
+import { auditMotion } from "./motion.js";
+import { checkSlop } from "./slop.js";
+import { checkPreflight } from "./preflight.js";
+const systemEnum = z.enum(["celeste", "nocturna"]);
+function text(payload) {
+    const body = typeof payload === "string" ? payload : JSON.stringify(payload, null, 2);
+    return { content: [{ type: "text", text: body }] };
+}
+export function buildServer(store) {
+    const server = new McpServer({ name: "design-mcp", version: "0.1.0" });
+    server.registerTool("list_design_systems", {
+        description: "Lista los sistemas de diseño disponibles con su metadata (filosofía, paleta, fuentes).",
+        inputSchema: {},
+    }, async () => text(SYSTEM_IDS.map((id) => {
+        const m = store[id].meta;
+        return { id, name: m.name, mode: m.mode, philosophy: m.philosophy, palette: m.palette, fonts: m.fonts };
+    })));
+    server.registerTool("get_token", {
+        description: "Resuelve un alias semántico (p. ej. --accent) o un token DTCG por path (p. ej. color.primary.500) a su valor.",
+        inputSchema: { system: systemEnum, name: z.string() },
+    }, async ({ system, name }) => {
+        const s = store[system];
+        const r = resolveToken(s.aliases, s.tokenIndex, name);
+        return r ? text(r) : text(`No se encontró el token "${name}" en ${system}.`);
+    });
+    server.registerTool("search_tokens", {
+        description: "Busca tokens por substring en su path o valor.",
+        inputSchema: { system: systemEnum, query: z.string() },
+    }, async ({ system, query }) => text(searchTokens(store[system].tokens, query)));
+    server.registerTool("list_components", { description: "Lista los componentes documentados del sistema.", inputSchema: { system: systemEnum } }, async ({ system }) => text(listComponents(store[system].sections)));
+    server.registerTool("get_component_spec", {
+        description: "Devuelve la especificación (estados, medidas, variantes) de un componente del DESIGN.md.",
+        inputSchema: { system: systemEnum, name: z.string() },
+    }, async ({ system, name }) => {
+        const spec = getComponentSpec(store[system].sections, name);
+        return spec ? text(`## ${spec.heading}\n\n${spec.body}`) : text(`No se encontró el componente "${name}".`);
+    });
+    server.registerTool("get_rules", {
+        description: "Reglas duras del sistema y referencia rápida (paleta, fuentes, filosofía).",
+        inputSchema: { system: systemEnum },
+    }, async ({ system }) => {
+        const m = store[system].meta;
+        const rules = getComponentSpec(store[system].sections, "reglas");
+        return text(`# ${m.name}\n\n${m.philosophy}\n\nPaleta: ${m.palette.join(" · ")}\n` +
+            `Fuentes: ${m.fonts.display} / ${m.fonts.body} / ${m.fonts.mono}\n\n` +
+            (rules ? `## ${rules.heading}\n\n${rules.body}` : ""));
+    });
+    const FILE_MIME = {
+        "tokens.json": "application/json",
+        "tokens.css": "text/css",
+        "tailwind.css": "text/css",
+        "framework.css": "text/css",
+        "design-doc.md": "text/markdown",
+        "styleguide.html": "text/html",
+    };
+    server.registerResource("systems-index", "design://systems", { title: "Índice de sistemas", description: "Los sistemas disponibles y su metadata.", mimeType: "application/json" }, async (uri) => ({
+        contents: [
+            {
+                uri: uri.href,
+                mimeType: "application/json",
+                text: JSON.stringify(SYSTEM_IDS.map((id) => store[id].meta), null, 2),
+            },
+        ],
+    }));
+    server.registerResource("system-file", new ResourceTemplate("design://{system}/{file}", { list: undefined }), { title: "Archivo de un sistema", description: "tokens.json, tokens.css, tailwind.css, framework.css, design-doc.md o styleguide.html." }, async (uri, { system, file }) => {
+        const s = store[system];
+        const content = s?.files[file];
+        if (!content)
+            throw new Error(`Recurso no encontrado: ${uri.href}`);
+        return {
+            contents: [{ uri: uri.href, mimeType: FILE_MIME[file] ?? "text/plain", text: content }],
+        };
+    });
+    server.registerTool("validate_code", {
+        description: "Valida CSS o HTML contra las reglas duras del sistema (hex directos, primary-300 como texto, doble primario, contraste AA, drift de border-radius y font-size fuera de las escalas del sistema, tracking negativo extremo).",
+        inputSchema: { system: systemEnum, code: z.string(), lang: z.enum(["css", "html"]) },
+    }, async ({ system, code, lang }) => {
+        const violations = validateCode(store[system], code, lang);
+        return text(violations.length ? violations : "Sin violaciones detectadas.");
+    });
+    server.registerTool("validate_motion", {
+        description: "Audita CSS/HTML/JS contra las reglas de motion del sistema: transition:all, ease-in en entradas, animar propiedades de layout, blur, duración > el techo del sistema (--duration-page), scale(0), rebote en utilitarios, overshoot excesivo, blur/hover-scale/stagger repetidos, pulsing, hover con transform sin gating @media (hover: hover) y falta de prefers-reduced-motion.",
+        inputSchema: { system: systemEnum, code: z.string(), lang: z.enum(["css", "html", "js"]) },
+    }, async ({ system, code, lang }) => {
+        const s = store[system];
+        const page = resolveToken(s.aliases, s.tokenIndex, "--duration-page");
+        const maxMs = page ? (parseInt(page.value, 10) || 320) : 320;
+        const violations = auditMotion(code, lang, maxMs);
+        return text(violations.length ? violations : "Sin violaciones de motion detectadas.");
+    });
+    server.registerTool("check_slop", {
+        description: "Detecta clichés de diseño generado por IA en CSS/HTML: gradientes, glassmorphism, sombras de negro puro, fuentes genéricas (Inter/Roboto…), texto diminuto, interlineado apretado, texto justificado, mayúsculas/tracking en cuerpo, paletas IA, y copy (exclamaciones, emoji, jerga de marketing, Title Case, abuso de em-dash).",
+        inputSchema: { system: systemEnum, code: z.string(), lang: z.enum(["css", "html"]) },
+    }, async ({ system, code, lang }) => {
+        const violations = checkSlop(code, lang, store[system].meta.mode);
+        return text(violations.length ? violations : "Sin indicios de slop detectados.");
+    });
+    server.registerTool("checklist_preflight", {
+        description: "Checklist estático de pre-producción sobre HTML/CSS: lang, title, meta charset/viewport/description, canonical, un solo h1, theme-color, noindex accidental, skip link, saltos de heading, img sin alt/dimensiones/src, botón-icono sin aria-label, zoom bloqueado, inputs sin autocomplete, paste bloqueado, enlaces con texto genérico, SRI en scripts externos y font-display. Los umbrales de runtime (Core Web Vitals, Lighthouse, cabeceras HTTP) se miden con Lighthouse/PageSpeed, no aquí. `system` se acepta por simetría con validate_code/validate_motion/check_slop (para invocarlas en secuencia con los mismos argumentos), pero este checklist es agnóstico de marca y no lo usa.",
+        inputSchema: { system: systemEnum, code: z.string(), lang: z.enum(["css", "html"]) },
+    }, async ({ code, lang }) => {
+        const violations = checkPreflight(code, lang);
+        return text(violations.length ? violations : "Sin problemas de pre-producción detectados.");
+    });
+    server.registerTool("generate_snippet", {
+        description: "Genera un snippet de un componente usando solo aliases semánticos. React devuelve una plantilla basada en aliases, no un componente de producción.",
+        inputSchema: { system: systemEnum, component: z.string(), stack: z.enum(["css", "tailwind", "react"]) },
+    }, async ({ system, component, stack }) => text(generateSnippet(store[system], component, stack)));
+    server.registerPrompt("build_ui", {
+        title: "Construir UI con el sistema",
+        description: "Instrucciones para construir UI respetando el sistema de diseño.",
+        argsSchema: { system: systemEnum },
+    }, ({ system }) => {
+        const m = store[system].meta;
+        return {
+            messages: [
+                {
+                    role: "user",
+                    content: {
+                        type: "text",
+                        text: `Construye UI siguiendo el sistema "${m.name}" (${m.mode}-first). ${m.philosophy}\n` +
+                            `Paleta: ${m.palette.join(" · ")}. Fuentes: ${m.fonts.display}/${m.fonts.body}/${m.fonts.mono}.\n` +
+                            `Consume solo aliases semánticos (usa la tool get_token). Antes de entregar, pasa el código por validate_code(system="${system}").`,
+                    },
+                },
+            ],
+        };
+    });
+    server.registerPrompt("audit_ui", {
+        title: "Auditar UI contra el sistema",
+        description: "Instrucciones para auditar código/una pantalla contra el sistema.",
+        argsSchema: { system: systemEnum },
+    }, ({ system }) => ({
+        messages: [
+            {
+                role: "user",
+                content: {
+                    type: "text",
+                    text: `Audita el siguiente código contra el sistema "${store[system].meta.name}". ` +
+                        `Usa validate_code(system="${system}"), validate_motion(system="${system}"), check_slop(system="${system}") y checklist_preflight(system="${system}") y explica cada violación con su arreglo. ` +
+                        `Verifica además jerarquía tipográfica, uso de acento (≤10%), contraste AA y los anti-patrones de motion (§11.6).`,
+                },
+            },
+        ],
+    }));
+    server.registerPrompt("audit_diseno", {
+        title: "Auditar el diseño con la rúbrica",
+        description: "Instrucciones para auditar una interfaz con la rúbrica de 14 dimensiones, Nielsen, carga cognitiva y 5 personas.",
+        argsSchema: { system: systemEnum },
+    }, ({ system }) => {
+        const m = store[system].meta;
+        return {
+            messages: [
+                {
+                    role: "user",
+                    content: {
+                        type: "text",
+                        text: `Audita la interfaz contra el sistema "${m.name}" (${m.mode}-first) recorriendo las 14 dimensiones ` +
+                            `(jerarquía, espaciado, tipografía, color/contraste, grid, componentes y sus estados, iconografía, motion, ` +
+                            `estados empty/loading/error, dark mode, densidad, responsividad, accesibilidad, consistencia). ` +
+                            `Puntúa con Nielsen /40; evalúa la carga cognitiva (Miller ≤4, nav ≤5, jerarquías ≤3) y las 5 personas ` +
+                            `(power-user, first-timer, accesibilidad, estrés, móvil). Usa validate_code(system="${system}"), ` +
+                            `validate_motion(system="${system}") y check_slop(system="${system}") para lo verificable. ` +
+                            `Presenta 2-3 alternativas con trade-offs para las decisiones abiertas y entrega la salida por fases ` +
+                            `(Crítico → Refinamiento → Pulido), cada hallazgo con archivo:línea y el arreglo referenciando tokens.`,
+                    },
+                },
+            ],
+        };
+    });
+    server.registerPrompt("recomendar_direccion", {
+        title: "Recomendar dirección de diseño desde un brief",
+        description: "Dado un brief de producto, recomienda el sistema (Celeste vs Nocturna), los valores de dial (variación/motion/densidad) y una dirección de diseño sobria.",
+        argsSchema: { brief: z.string() },
+    }, ({ brief }) => ({
+        messages: [
+            {
+                role: "user",
+                content: {
+                    type: "text",
+                    text: `Brief: "${brief}".\n\n` +
+                        `Recomienda una dirección de diseño para uno de los dos sistemas de Higinio y justifícalo:\n` +
+                        `- Elige "Celeste Clásica" (light-first, sereno, profesional) o "Nocturna Eléctrica" (dark-first, técnico, alto contraste), en una línea con el porqué.\n` +
+                        `- Propón valores de dial acotados a la sobriedad de la marca: VARIANCE 1-6 (1=simétrico, 6=asimetría contenida), MOTION 1-5 (1=estático, 5=reveals sobrios), DENSITY por superficie (aireada en landings, densa en dashboards).\n` +
+                        `- Da 2-3 decisiones clave (tipografía, uso del acento ≤10%, layout), dentro de las reglas duras del sistema elegido.\n\n` +
+                        `Ancla la recomendación con list_design_systems y get_rules. No propongas gradientes, glassmorphism ni fuentes genéricas (Inter/Roboto).`,
+                },
+            },
+        ],
+    }));
+    server.registerPrompt("recomendar_grafica", {
+        title: "Recomendar gráfica y paleta desde una descripción de datos",
+        description: "Dada una descripción de datos, recomienda el tipo de gráfica, la paleta (categórica/secuencial/divergente/estado) y el fallback de accesibilidad.",
+        argsSchema: { datos: z.string() },
+    }, ({ datos }) => ({
+        messages: [
+            {
+                role: "user",
+                content: {
+                    type: "text",
+                    text: `Datos: "${datos}".\n\n` +
+                        `Recomienda cómo visualizarlos con la skill dataviz-marca de Higinio:\n` +
+                        `- El tipo de gráfica según la función del dato (magnitud → barras; tiempo → línea/área; parte de un todo → barra apilada; relación → scatter; un solo número → stat tile). Si no es una gráfica, dilo. Para tareas más específicas (waterfall, funnel, heatmap, treemap, box plot, bullet en vez de gauge, waffle, banda de confianza, anomalías) la tabla ampliada —con umbral de volumen, grado de accesibilidad y fallback por tipo— vive en la skill dataviz-marca (references/paletas-graficas.md); no la repitas aquí.\n` +
+                        `- Qué paleta del sistema activo usar: categórica (identidad), secuencial (magnitud, una hue claro→oscuro), divergente (polaridad, dos hues + gris al centro) o estado (con icono + etiqueta). Usa la paleta del sistema (Celeste o Nocturna); no inventes hex.\n` +
+                        `- El fallback de accesibilidad: leyenda + etiquetas directas, vista de tabla, y patrón/textura para daltonismo. La identidad nunca es solo por color.\n\n` +
+                        `Nunca dual-axis, ni arcoíris, ni 3D. El texto lleva tokens de ink, no el color de la serie.`,
+                },
+            },
+        ],
+    }));
+    return server;
+}