{
  "sistema": {
    "id": "designloop",
    "nombre": "Designloop",
    "descripcion": "Sistema de diseño de Designloop: landing y portal de clientes. Partner de diseño para fundadores obsesionados y equipos ambiciosos.",
    "extiende": null,
    "produccion": {
      "web": "https://designloop.app",
      "codigo": "https://github.com/imandresochoa/designloop/blob/main/",
      "commit": "455e861"
    }
  },
  "estados": {
    "sin-iniciar": {
      "label": "Sin iniciar",
      "descripcion": "Esta plataforma aún no tiene implementación."
    },
    "exploracion": {
      "label": "Exploración",
      "descripcion": "En diseño. Puede cambiar o desaparecer. No se usa en producción."
    },
    "desarrollo": {
      "label": "En desarrollo",
      "descripcion": "Definido y construido en el sistema, pero aún no está en producción."
    },
    "produccion": {
      "label": "En producción",
      "descripcion": "Existe en producción y el sync lo verifica contra el código."
    },
    "obsoleto": {
      "label": "Obsoleto",
      "descripcion": "Sigue en producción, pero no se usa en trabajo nuevo."
    }
  },
  "fichas": [
    {
      "id": "fundamentos/color",
      "titulo": "Color",
      "resumen": "Superficies cálidas, tinta casi negra y un único acento azul para el foco y la selección.",
      "seccion": "fundamentos",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/fundamentos/color.md",
      "url": "/designloop/fundamentos/color",
      "tokens": [
        "paper",
        "paper-2",
        "card",
        "night",
        "ink",
        "ink-2",
        "muted",
        "faint",
        "line",
        "line-strong",
        "accent",
        "accent-soft"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "fundamentos/ilustracion",
      "titulo": "Ilustración",
      "resumen": "Ilustraciones de trazo animadas dentro de los mosaicos de la landing. Pendiente de documentar.",
      "seccion": "fundamentos",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/fundamentos/ilustracion.md",
      "url": "/designloop/fundamentos/ilustracion",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": null,
        "avisos": []
      }
    },
    {
      "id": "fundamentos/paleta-jerte",
      "titulo": "Paleta Jerte",
      "resumen": "Cinco colores sacados de los cerezos en flor del Valle del Jerte. Blancos neutros para las superficies; oliva, tierra y cielo solo para acentos. Es la paleta de la landing.",
      "seccion": "fundamentos",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/fundamentos/paleta-jerte.md",
      "url": "/designloop/fundamentos/paleta-jerte",
      "tokens": [
        "bg",
        "surface",
        "panel",
        "line",
        "line-2",
        "ink",
        "ink-2",
        "ink-3",
        "deep",
        "cta",
        "cta-hover",
        "accent",
        "signal",
        "focus"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "fundamentos/superficies",
      "titulo": "Superficies",
      "resumen": "Las dos partes del producto con código propio, la landing y el portal, y cómo se ven aquí.",
      "seccion": "fundamentos",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/fundamentos/superficies.md",
      "url": "/designloop/fundamentos/superficies",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": null,
        "avisos": []
      }
    },
    {
      "id": "fundamentos/tipografia",
      "titulo": "Tipografía",
      "resumen": "Titulares en serif ligera y ajustada; interfaz en sans; datos en mono.",
      "seccion": "fundamentos",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/fundamentos/tipografia.md",
      "url": "/designloop/fundamentos/tipografia",
      "tokens": [
        "serif",
        "sans",
        "mono",
        "display",
        "heading",
        "title",
        "text-md"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "fundamentos/voz-y-tono",
      "titulo": "Voz y tono",
      "resumen": "Directa, cercana y tranquila. Los textos aprobados no se reescriben sin petición expresa.",
      "seccion": "fundamentos",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/fundamentos/voz-y-tono.md",
      "url": "/designloop/fundamentos/voz-y-tono",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "docs",
              "fuente": "docs/VOICE_AND_TONE.md"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "tokens/color",
      "titulo": "Color",
      "resumen": "Valores de color de producción y el rol de cada uno.",
      "seccion": "tokens",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/tokens/color.md",
      "url": "/designloop/tokens/color",
      "tokens": [
        "paper",
        "paper-2",
        "paper-3",
        "card",
        "night",
        "ash",
        "ink",
        "ink-2",
        "muted",
        "faint",
        "line",
        "line-strong",
        "accent",
        "accent-soft",
        "danger",
        "danger-soft",
        "success",
        "success-soft",
        "warning",
        "warning-soft",
        "tile-sand",
        "tile-clay",
        "tile-sage",
        "tile-sky",
        "tile-lilac"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "tokens/maquetacion",
      "titulo": "Maquetación",
      "resumen": "Ancho máximo y margen lateral de la página.",
      "seccion": "tokens",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/tokens/maquetacion.md",
      "url": "/designloop/tokens/maquetacion",
      "tokens": [
        "max",
        "gutter"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "tokens/movimiento",
      "titulo": "Movimiento",
      "resumen": "Dos curvas y tres duraciones, de la microinteracción a la aparición de bloques.",
      "seccion": "tokens",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/tokens/movimiento.md",
      "url": "/designloop/tokens/movimiento",
      "tokens": [
        "ease-out",
        "ease-in-out",
        "dur-micro",
        "dur-ui",
        "dur-reveal"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "tokens/radios",
      "titulo": "Radios",
      "resumen": "Cuatro radios, de controles a contenedores grandes.",
      "seccion": "tokens",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/tokens/radios.md",
      "url": "/designloop/tokens/radios",
      "tokens": [
        "radius-sm",
        "radius-md",
        "radius-lg",
        "radius-xl"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "tokens/sombras",
      "titulo": "Sombras",
      "resumen": "Elevación mínima. Una sombra para tarjetas y otra para elementos flotantes.",
      "seccion": "tokens",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/tokens/sombras.md",
      "url": "/designloop/tokens/sombras",
      "tokens": [
        "shadow-card",
        "shadow-pop"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "tokens/tipografia",
      "titulo": "Tipografía",
      "resumen": "Familias y tamaños tipográficos de producción y el rol de cada uno.",
      "seccion": "tokens",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/tokens/tipografia.md",
      "url": "/designloop/tokens/tipografia",
      "tokens": [
        "serif",
        "sans",
        "mono",
        "text-xs",
        "text-sm",
        "text-md",
        "text-lg",
        "title",
        "heading",
        "display"
      ],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "componentes/aviso",
      "titulo": "Aviso",
      "resumen": "Mensaje en línea que informa del resultado de una acción o de una situación de la cuenta. Cuatro tonos.",
      "seccion": "componentes",
      "funcion": "feedback",
      "nivel": "atomo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/aviso.md",
      "url": "/designloop/componentes/aviso",
      "tokens": [
        "accent-soft",
        "ink",
        "success",
        "success-soft",
        "warning",
        "warning-soft",
        "danger",
        "danger-soft"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "portal",
              "fuente": "src/components/ui/alert.tsx"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "componentes/boton",
      "titulo": "Botón",
      "resumen": "Lanza una acción o lleva al siguiente paso. Un solo botón principal por grupo de acciones.",
      "seccion": "componentes",
      "funcion": "acciones",
      "nivel": "atomo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/boton.md",
      "url": "/designloop/componentes/boton",
      "tokens": [
        "ink",
        "ink-hover",
        "ink-2",
        "paper",
        "paper-2",
        "card",
        "line",
        "line-strong",
        "danger",
        "accent"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/button.css",
              "clases": [
                "button",
                "button-outline",
                "button-ghost",
                "button-subtle",
                "button-danger",
                "button-light",
                "button-small",
                "button-block"
              ]
            },
            {
              "id": "portal",
              "fuente": "src/components/ui/button.tsx"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "componentes/cabecera-de-pagina",
      "titulo": "Cabecera de página",
      "resumen": "Título de las pantallas de lista y de ajustes del portal en serif display, con antetítulo, descripción y acciones opcionales.",
      "seccion": "componentes",
      "funcion": "contenido",
      "nivel": "molecula",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/cabecera-de-pagina.md",
      "url": "/designloop/componentes/cabecera-de-pagina",
      "tokens": [
        "muted",
        "ink-2"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "portal",
              "fuente": "src/components/ui/page-header.tsx"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "componentes/cabecera",
      "titulo": "Cabecera",
      "resumen": "Barra fija con la marca, la navegación y las dos acciones de cuenta.",
      "seccion": "componentes",
      "funcion": "navegacion",
      "nivel": "organismo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/cabecera.md",
      "url": "/designloop/componentes/cabecera",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "site-header",
                "header-inner",
                "wordmark",
                "brand-mark",
                "desktop-nav",
                "nav-actions",
                "menu-toggle",
                "mobile-nav"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "componentes/enlace-de-texto",
      "titulo": "Enlace de texto",
      "resumen": "Enlace subrayado con flecha opcional, para acciones secundarias dentro de un bloque.",
      "seccion": "componentes",
      "funcion": "acciones",
      "nivel": "atomo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/enlace-de-texto.md",
      "url": "/designloop/componentes/enlace-de-texto",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "text-link"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "componentes/indicador-de-carga",
      "titulo": "Indicador de carga",
      "resumen": "Círculo que gira mientras una acción está en curso. Hereda el color y el tamaño del texto que acompaña.",
      "seccion": "componentes",
      "funcion": "feedback",
      "nivel": "atomo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/indicador-de-carga.md",
      "url": "/designloop/componentes/indicador-de-carga",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "portal",
              "fuente": "src/components/ui/spinner.tsx"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "componentes/insignia",
      "titulo": "Insignia",
      "resumen": "Etiqueta corta de estado, rol o categoría. Once tonos, de la marca y de estado.",
      "seccion": "componentes",
      "funcion": "feedback",
      "nivel": "atomo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/insignia.md",
      "url": "/designloop/componentes/insignia",
      "tokens": [
        "paper-3",
        "ink-2",
        "ink",
        "tile-sand",
        "tile-sky",
        "tile-clay",
        "tile-sage",
        "tile-lilac",
        "accent",
        "accent-soft",
        "danger",
        "danger-soft",
        "success",
        "success-soft",
        "warning",
        "warning-soft",
        "line-strong"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "portal",
              "fuente": "src/components/ui/badge.tsx"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "componentes/mosaico",
      "titulo": "Mosaico",
      "resumen": "Rectángulo de color de marca con una ilustración centrada. Acompaña a pasos y bloques de la landing.",
      "seccion": "componentes",
      "funcion": "contenido",
      "nivel": "atomo",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/mosaico.md",
      "url": "/designloop/componentes/mosaico",
      "tokens": [
        "radius-lg",
        "tile-sand",
        "tile-sky",
        "tile-sage",
        "tile-clay",
        "tile-lilac",
        "night"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "tile",
                "tile-sand",
                "tile-sky",
                "tile-sage",
                "tile-clay",
                "tile-lilac",
                "tile-night"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": [
          "Clases de los ejemplos que no existen: tile, tile-sand, tile-sky, tile-night, tile-sage, tile-clay, tile-lilac"
        ]
      }
    },
    {
      "id": "componentes/tarjeta",
      "titulo": "Tarjeta",
      "resumen": "Superficie blanca con borde y sombra suave que agrupa un bloque de contenido. Cabecera, título y cuerpo opcionales.",
      "seccion": "componentes",
      "funcion": "contenido",
      "nivel": "molecula",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/componentes/tarjeta.md",
      "url": "/designloop/componentes/tarjeta",
      "tokens": [
        "card",
        "line",
        "shadow-card"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "portal",
              "fuente": "src/components/ui/card.tsx"
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ok",
        "avisos": []
      }
    },
    {
      "id": "patrones/beneficios",
      "titulo": "Beneficios",
      "resumen": "Rejilla de seis bloques numerados con título y texto, bajo una cabecera centrada.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/beneficios.md",
      "url": "/designloop/patrones/beneficios",
      "tokens": [
        "text-xs",
        "faint",
        "muted"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "benefits",
                "benefit-grid",
                "num"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": [
          "Clases de los ejemplos que no existen: section, wrap, section-head, is-center, benefit-grid, num"
        ]
      }
    },
    {
      "id": "patrones/como-funciona",
      "titulo": "Cómo funciona",
      "resumen": "Tres pasos numerados con un mosaico ilustrado, título y texto. Explica el ciclo de la suscripción.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/como-funciona.md",
      "url": "/designloop/patrones/como-funciona",
      "tokens": [
        "text-xs",
        "faint",
        "muted"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "steps",
                "step",
                "step-num"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": [
          "Clases de los ejemplos que no existen: section, wrap, section-head, step, tile, tile-sand, step-num, tile-sky, tile-night"
        ]
      }
    },
    {
      "id": "patrones/estructura-de-seccion",
      "titulo": "Estructura de sección",
      "resumen": "El esqueleto común de las secciones de la landing. Espaciado vertical, ancho máximo y cabecera con título y entradilla.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/estructura-de-seccion.md",
      "url": "/designloop/patrones/estructura-de-seccion",
      "tokens": [
        "max",
        "gutter",
        "text-lg",
        "muted"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "section",
                "section-head",
                "wrap",
                "is-center"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": [
          "Clases de los ejemplos que no existen: section, wrap, section-head, is-center"
        ]
      }
    },
    {
      "id": "patrones/hero",
      "titulo": "Hero",
      "resumen": "Titular, entradilla y dos acciones centradas, seguidos del escenario animado.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/hero.md",
      "url": "/designloop/patrones/hero",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "hero",
                "hero-copy",
                "hero-lede",
                "hero-actions",
                "stage-wrap"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "patrones/pie",
      "titulo": "Pie",
      "resumen": "Pie oscuro con la marca y su lema, la navegación de la página, el contacto, el idioma y los enlaces legales.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/pie.md",
      "url": "/designloop/patrones/pie",
      "tokens": [
        "night",
        "paper",
        "text-sm",
        "dur-micro"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "site-footer",
                "footer-inner",
                "footer-brand",
                "footer-nav",
                "footer-contact",
                "footer-meta",
                "footer-legal"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": [
          "Clases de los ejemplos que no existen: site-footer, wrap, footer-inner, footer-brand, wordmark, footer-nav, footer-contact, footer-meta, footer-legal",
          "Colores que no existen en producción: #d8d6cf, #9c9a92, #c9c7bf, #8a8880"
        ]
      }
    },
    {
      "id": "patrones/precios",
      "titulo": "Precios",
      "resumen": "Tarjeta del plan con el precio, lo que incluye y la acción para empezar.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/precios.md",
      "url": "/designloop/patrones/precios",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "pricing",
                "plan"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": []
      }
    },
    {
      "id": "patrones/preguntas-frecuentes",
      "titulo": "Preguntas frecuentes",
      "resumen": "Introducción fija a la izquierda y lista de preguntas desplegables a la derecha, sobre fondo papel.",
      "seccion": "patrones",
      "funcion": null,
      "nivel": "seccion",
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/patrones/preguntas-frecuentes.md",
      "url": "/designloop/patrones/preguntas-frecuentes",
      "tokens": [
        "paper-2",
        "serif",
        "muted",
        "text-lg",
        "dur-ui",
        "ease-out",
        "ink"
      ],
      "plataformas": {
        "web": {
          "estado": "produccion",
          "superficies": [
            {
              "id": "landing",
              "fuente": "public/site/styles.css",
              "clases": [
                "faq",
                "faq-inner",
                "faq-intro",
                "faq-list",
                "faq-answer"
              ]
            }
          ]
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": "ausente",
        "avisos": [
          "Clases de los ejemplos que no existen: section, faq, wrap, faq-inner, faq-intro, text-link, faq-list, faq-answer"
        ]
      }
    },
    {
      "id": "iniciativas/boton-unificado",
      "titulo": "Botón unificado",
      "resumen": "Un solo botón para la landing y el portal, con una hoja de estilos compartida.",
      "seccion": "iniciativas",
      "funcion": null,
      "nivel": null,
      "estado": "produccion",
      "iniciativa": null,
      "md": "/designloop/iniciativas/boton-unificado.md",
      "url": "/designloop/iniciativas/boton-unificado",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": null,
        "avisos": []
      }
    },
    {
      "id": "iniciativas/sistema-agentic-first",
      "titulo": "Sistema de diseño agentic-first",
      "resumen": "Este mismo sistema. Estructura, enlace con producción y capa para agentes.",
      "seccion": "iniciativas",
      "funcion": null,
      "nivel": null,
      "estado": "desarrollo",
      "iniciativa": null,
      "md": "/designloop/iniciativas/sistema-agentic-first.md",
      "url": "/designloop/iniciativas/sistema-agentic-first",
      "tokens": [],
      "plataformas": {
        "web": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "ios": {
          "estado": "sin-iniciar",
          "superficies": []
        },
        "android": {
          "estado": "sin-iniciar",
          "superficies": []
        }
      },
      "sync": {
        "estado": null,
        "avisos": []
      }
    }
  ],
  "tokens": {
    "landing": {
      "bg": "#161912",
      "ink": "#f2f0e8",
      "ink-2": "#b9b6a8",
      "ink-3": "#6f6f63",
      "line": "#2a2e23",
      "line-2": "#3a3f31",
      "panel": "#1f231a",
      "surface": "#2a2f23",
      "deep": "#596b45",
      "deep-ink": "#f6f6f3",
      "deep-2": "#4f603d",
      "deep-line": "#6f805b",
      "deep-mute": "#dcdfcf",
      "accent": "#b1905c",
      "on-accent": "#1f2419",
      "signal": "#84aad7",
      "focus": "#84aad7",
      "ink-fixed": "#1f2419",
      "paper-fixed": "#f6f6f3",
      "cta": "#596b45",
      "cta-ink": "#f6f6f3",
      "cta-hover": "#4a5a39",
      "deep-cta-hover": "#e3e3df",
      "sans": "'Inter Tight', 'Helvetica Neue', Arial, system-ui, sans-serif",
      "mono": "'Roboto Mono', ui-monospace, 'SF Mono', Menlo, monospace",
      "gutter": "16px",
      "gap": "12px",
      "left": "clamp(300px, 30.5vw, 470px)",
      "radius": "14px",
      "top": "96px",
      "ease": "cubic-bezier(.16, 1, .3, 1)",
      "spring": "linear(0, .006, .025 2.8%, .101 6.1%, .539 18.9%, .721 25.3%, .849 31.5%, .937 38.1%, .968 41.8%, .991 45.7%, 1.006 50.1%, 1.015 55%, 1.017 63.9%, 1.001 85.9%, 1)"
    },
    "portal": {
      "paper": "#faf9f6",
      "paper-2": "#f3f1eb",
      "paper-3": "#ebe8e0",
      "card": "#ffffff",
      "night": "#1b1b19",
      "ink": "#171716",
      "ink-2": "#3b3b38",
      "ink-hover": "#2e2e2b",
      "muted": "#6d6c66",
      "faint": "#a19f97",
      "line": "#e5e2da",
      "line-strong": "#d4d0c5",
      "accent": "#3b5bdb",
      "accent-soft": "#e4e9fb",
      "danger": "#b42318",
      "danger-soft": "#fdecea",
      "success": "#2f6b4f",
      "success-soft": "#e3efe8",
      "warning": "#8a5a00",
      "warning-soft": "#fbf0d9",
      "tile-sand": "#e9dfcb",
      "tile-clay": "#e8c6b2",
      "tile-sage": "#c6d4cb",
      "tile-sky": "#c7d3ec",
      "tile-lilac": "#d4d1e3",
      "shadow-card": "0 1px 2px rgb(23 23 22 / 4%), 0 12px 32px -16px rgb(23 23 22 / 18%)",
      "shadow-pop": "0 2px 6px rgb(23 23 22 / 6%), 0 24px 48px -20px rgb(23 23 22 / 28%)",
      "ease-out": "cubic-bezier(.16, 1, .3, 1)"
    }
  }
}