{
  "_comment": "Kit de pantallas de NUEVAUNO OS. Fuente legible por máquina: usa SÓLO patrones con status.state = approved; lo nuevo se propone como proposed. Guía humana: https://branding.nuevauno.com/kit/ y /UI.md.",
  "version": "0.1.0",
  "updated": "2026-10-02",
  "css": "https://branding.nuevauno.com/kit/nuevauno-ui.css",
  "js": "https://branding.nuevauno.com/kit/nuevauno-ui.js",
  "tokens": "https://branding.nuevauno.com/ui-tokens.json",
  "guide": "https://branding.nuevauno.com/UI.md",
  "brand": "https://branding.nuevauno.com/brand-spec.json",
  "icons": "https://branding.nuevauno.com/icons/manifest.json",
  "howToUse": [
    "Importa nuevauno-ui.css con un <link> y pon class=\"nu-ui\" en la raíz de la app.",
    "Copia el HTML del snippet del patrón; reemplaza los datos de ejemplo por datos reales (o quita la pieza si el dato no existe).",
    "Iconos: <span class=\"nu-icono\" data-icono=\"<nombre del manifest>\"></span> con nuevauno-ui.js, o tu componente que pegue el SVG del kit en línea.",
    "Logo: siempre el archivo del kit; nunca armado.",
    "Antes de entregar: probar en 390×844, 820×1180 y 1440×900 sin scroll horizontal."
  ],
  "statusValues": [
    "proposed",
    "approved",
    "rejected"
  ],
  "groups": {
    "marco": "Marco del sistema",
    "kodo": "Kōdo",
    "inicio": "Inicio",
    "pantalla": "Pantallas completas",
    "registros": "Registros",
    "controles": "Controles",
    "datos": "Datos"
  },
  "patterns": [
    {
      "id": "shell",
      "name": "Shell completo",
      "group": "marco",
      "when": "La estructura de TODA pantalla de NUEVAUNO OS. Una app nueva sólo llena el contenido central; el resto lo pone el shell.",
      "anatomy": [
        "Riel izquierdo (56 px, opcional en escritorio)",
        "Menú lateral blanco (256 px)",
        "Cabecera blanca con miga y acciones",
        "Pestañas del registro o sección (opcional)",
        "Contenido sobre el fondo de puntos",
        "Panel derecho de Kōdo (400 px, plegable)",
        "Barra inferior de estado (28 px)"
      ],
      "rules": {
        "do": [
          "Mantén cabecera y menú blancos, contenido sobre puntos",
          "Kōdo siempre a un clic (botón en la cabecera y Ctrl+J)",
          "En teléfono: menú como panel deslizable y sin barra inferior"
        ],
        "dont": [
          "No abras otra pestaña del navegador para una app del sistema",
          "No pongas un segundo menú dentro del contenido (doble marco)"
        ]
      },
      "classes": [
        "nu-shell",
        "nu-shell__centro",
        "nu-shell__contenido",
        "nu-riel",
        "nu-barra"
      ],
      "page": "https://branding.nuevauno.com/kit/shell/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/shell.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 760,
        "fullBleed": true
      }
    },
    {
      "id": "sidebar",
      "name": "Menú lateral",
      "group": "marco",
      "when": "Navegación principal de la empresa: Principal (Inicio, Kōdo, Contactos), Tu negocio (apps instaladas) y abajo Ajustes y la persona.",
      "anatomy": [
        "Logo animado del kit (icono de 30 px de alto)",
        "Botón para recoger",
        "Buscador con Ctrl K",
        "Secciones con etiqueta de sistema",
        "Ítem activo con fondo naranja suave y línea de 2 px",
        "Árbol de submenús con líneas finas",
        "Ajustes y tarjeta de la persona al pie"
      ],
      "rules": {
        "do": [
          "Abierto 256 px, recogido 72 px y se recuerda por persona",
          "Iconos sólo del kit"
        ],
        "dont": [
          "No armes el logo con texto: es un archivo",
          "No uses negrita para el ítem activo"
        ]
      },
      "classes": [
        "nu-lateral",
        "nu-menu__grupo",
        "nu-menu__seccion",
        "nu-menu__item",
        "nu-menu__arbol",
        "nu-menu__sub",
        "nu-perfil",
        "nu-persona"
      ],
      "page": "https://branding.nuevauno.com/kit/sidebar/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/sidebar.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 720
      }
    },
    {
      "id": "header",
      "name": "Cabecera",
      "group": "marco",
      "when": "Arriba de todo el contenido: dice dónde estás y deja a mano a Kōdo.",
      "anatomy": [
        "Botón de menú (sólo teléfono)",
        "Miga: Empresa / icono + Sección",
        "Acciones a la derecha: botón de Kōdo"
      ],
      "rules": {
        "do": [
          "Blanca, 56 px, borde inferior de 1 px",
          "La empresa va SIEMPRE primero en la miga"
        ],
        "dont": [
          "No la pintes gris ni con el color del fondo",
          "No pongas el título de la página aparte: la sección de la miga es el título"
        ]
      },
      "classes": [
        "nu-cabecera",
        "nu-cabecera__acciones",
        "nu-miga",
        "nu-miga__seccion",
        "nu-boton-kodo"
      ],
      "page": "https://branding.nuevauno.com/kit/header/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/header.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder con capturas de la plataforma 20 (2026-10-02)."
      },
      "preview": {
        "height": 200
      }
    },
    {
      "id": "company-selector",
      "name": "Selector de empresa",
      "group": "marco",
      "when": "El nombre de la empresa en la miga es a la vez el selector: abre la lista de empresas de la persona y cambiar recarga el sistema en la elegida.",
      "anatomy": [
        "Nombre de la empresa activa (gris, 15 px)",
        "Menú flotante con el nombre de la organización en etiqueta de sistema",
        "Opciones; la activa en naranja con un cuadrado"
      ],
      "rules": {
        "do": [
          "Sólo empresas reales de la persona",
          "Pinta la última empresa vista mientras llega la lista (sin parpadeo)"
        ],
        "dont": [
          "No muestres ids técnicos (org_…, cmp_…)",
          "No lo escondas en el perfil: va en la miga"
        ]
      },
      "classes": [
        "nu-miga__empresa",
        "nu-miga__org",
        "nu-miga__menu",
        "nu-miga__opcion",
        "nu-miga__opcion-actual"
      ],
      "page": "https://branding.nuevauno.com/kit/company-selector/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/company-selector.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder con capturas de la plataforma 20 (2026-10-02)."
      },
      "preview": {
        "height": 260
      }
    },
    {
      "id": "dotted-background",
      "name": "Fondo de puntos",
      "group": "marco",
      "when": "El fondo de toda el área de contenido. Las superficies blancas van encima.",
      "anatomy": [
        "#f8f9fa con puntos #e1e5e8 de 1 px cada 18 px",
        "En oscuro: #0e1226 con puntos blancos al 7 %"
      ],
      "rules": {
        "do": [
          "Úsalo en el contenido de toda pantalla del sistema"
        ],
        "dont": [
          "No lo pongas en la cabecera ni en el menú (son blancos)",
          "No uses el gris cálido #f4f4f1 en el contenido (quedó para fondos de marca e imágenes de relleno)"
        ]
      },
      "classes": [
        "nu-fondo"
      ],
      "page": "https://branding.nuevauno.com/kit/dotted-background/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/dotted-background.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 280
      }
    },
    {
      "id": "rail",
      "name": "Riel izquierdo",
      "group": "marco",
      "when": "Accesos globales que no dependen de la empresa (buscar, avisos, aprobaciones, ajustes, persona). Sólo escritorio ancho.",
      "anatomy": [
        "Columna de 56 px blanca",
        "Botones de 40 px con icono del kit",
        "Activo con línea naranja",
        "Persona al pie"
      ],
      "rules": {
        "do": [
          "Máximo 6 accesos",
          "Se oculta bajo 1280 px"
        ],
        "dont": [
          "No dupliques lo que ya está en el menú lateral"
        ]
      },
      "classes": [
        "nu-riel",
        "nu-riel__item",
        "nu-riel__pie"
      ],
      "page": "https://branding.nuevauno.com/kit/rail/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/rail.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 420
      }
    },
    {
      "id": "tabs",
      "name": "Pestañas",
      "group": "marco",
      "when": "Bajo la cabecera, para las partes de un registro (Ficha, Guías, Facturas, Actividad) o de una sección.",
      "anatomy": [
        "Franja blanca con borde inferior",
        "Pestaña activa en navy con línea naranja de 2 px",
        "Contador opcional en etiqueta de sistema"
      ],
      "rules": {
        "do": [
          "Rutas en inglés por pestaña (/contacts/123/dispatch)",
          "Desplazable en teléfono"
        ],
        "dont": [
          "No más de 6 pestañas",
          "No las uses para filtros: eso va en la barra de la lista"
        ]
      },
      "classes": [
        "nu-pestanas",
        "nu-pestana",
        "nu-pestana__cuenta"
      ],
      "page": "https://branding.nuevauno.com/kit/tabs/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/tabs.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 120
      }
    },
    {
      "id": "bottom-bar",
      "name": "Barra inferior",
      "group": "marco",
      "when": "Estado del sistema en una línea: conexión, empresa, Kōdo y versión.",
      "anatomy": [
        "28 px blanca, etiquetas de sistema",
        "Estado con cuadrado de color"
      ],
      "rules": {
        "do": [
          "Datos reales o nada"
        ],
        "dont": [
          "No la uses para acciones",
          "Se oculta en teléfono"
        ]
      },
      "classes": [
        "nu-barra",
        "nu-barra__derecha"
      ],
      "page": "https://branding.nuevauno.com/kit/bottom-bar/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/bottom-bar.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 80
      }
    },
    {
      "id": "kodo-panel",
      "name": "Panel de Kōdo con contexto",
      "group": "kodo",
      "when": "Kōdo vive en cada empresa y se abre en cualquier pantalla. Sabe lo que estás viendo (la ficha 'Viendo') y lo usa sin que lo repitas.",
      "anatomy": [
        "Cabecera con la marca de Kōdo, nombre y empresa",
        "Conversación",
        "Herramientas usadas en etiqueta de sistema",
        "Tarjeta de aprobación cuando importa",
        "Ficha 'Viendo: App · Registro'",
        "Redactor con Enviar"
      ],
      "rules": {
        "do": [
          "La misma conversación que /kodo (no otra)",
          "La ficha de contexto viaja con cada mensaje como dato, no pegada en el texto",
          "Aprobación sólo para emitir, publicar, borrar en masa o dinero"
        ],
        "dont": [
          "No pidas al cliente elegir modelo",
          "No abras Kōdo en una pestaña nueva"
        ]
      },
      "classes": [
        "nu-panel-kodo",
        "nu-chat--panel",
        "nu-chat__viendo",
        "nu-chat__redactor",
        "nu-boton-kodo"
      ],
      "page": "https://branding.nuevauno.com/kit/kodo-panel/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/kodo-panel.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 640
      }
    },
    {
      "id": "approval-card",
      "name": "Tarjeta de aprobación",
      "group": "kodo",
      "when": "Cuando Kōdo va a hacer algo que importa (emitir, publicar, borrar en masa, dinero) y necesita el sí de una persona.",
      "anatomy": [
        "Qué quiere hacer, en lenguaje de persona",
        "Datos clave en etiqueta + valor",
        "Aprobar (naranja) y Rechazar"
      ],
      "rules": {
        "do": [
          "Línea naranja de 2 px a la izquierda",
          "Los datos son los reales que se van a usar"
        ],
        "dont": [
          "No pidas aprobación para notas o cosas reversibles"
        ]
      },
      "classes": [
        "nu-aprobacion",
        "nu-aprobacion__datos",
        "nu-aprobacion__aprobar",
        "nu-aprobacion__rechazar"
      ],
      "page": "https://branding.nuevauno.com/kit/approval-card/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/approval-card.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 280
      }
    },
    {
      "id": "ask-kodo",
      "name": "Pídele algo a Kōdo",
      "group": "inicio",
      "when": "La caja grande del Inicio, justo después del saludo.",
      "anatomy": [
        "Marca de Kōdo + etiqueta 'Pídele algo a Kōdo'",
        "Campo de 20 px sobre línea navy, con cursor naranja si está vacío",
        "Enviar naranja lleno",
        "3–4 sugerencias según las apps instaladas"
      ],
      "rules": {
        "do": [
          "Al enviar abre la conversación sin pasos intermedios"
        ],
        "dont": [
          "No ofrezcas sugerencias de apps que la empresa no tiene"
        ]
      },
      "classes": [
        "nu-kodo",
        "nu-kodo__fila",
        "nu-kodo__texto",
        "nu-kodo__enviar",
        "nu-fichas",
        "nu-ficha"
      ],
      "page": "https://branding.nuevauno.com/kit/ask-kodo/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/ask-kodo.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 280
      }
    },
    {
      "id": "stat-cards",
      "name": "Tarjetas de datos",
      "group": "inicio",
      "when": "La franja de números del Inicio y de una ficha: número grande + etiqueta chica.",
      "anatomy": [
        "Etiqueta de sistema",
        "Número de 30 px navy con su unidad gris",
        "Barra de puntos opcional (20 pasos)",
        "Enlace naranja opcional"
      ],
      "rules": {
        "do": [
          "Pegadas con borde de 1 px",
          "Datos reales o la tarjeta no aparece"
        ],
        "dont": [
          "No inventes cifras ni pongas ceros de relleno",
          "No uses gráficos de torta ni colores extra"
        ]
      },
      "classes": [
        "nu-franja",
        "nu-dato",
        "nu-dato__etiqueta",
        "nu-dato__numero",
        "nu-dato__unidad",
        "nu-puntos",
        "nu-punto"
      ],
      "page": "https://branding.nuevauno.com/kit/stat-cards/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/stat-cards.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 200
      }
    },
    {
      "id": "home-apps",
      "name": "Tus apps",
      "group": "inicio",
      "when": "La grilla de apps instaladas del Inicio.",
      "anatomy": [
        "Etiqueta 'Tus apps · N' y buscador",
        "Grilla pegada: icono del kit + nombre en una fila de 56 px"
      ],
      "rules": {
        "do": [
          "6 por fila en escritorio, 4 en tablet, 3 o 2 en teléfono",
          "Sólo apps instaladas en la empresa"
        ],
        "dont": [
          "No muestres apps no instaladas aquí (eso va en Módulos instalados)"
        ]
      },
      "classes": [
        "nu-bloque",
        "nu-bloque__cabeza",
        "nu-buscar-apps",
        "nu-apps",
        "nu-app"
      ],
      "page": "https://branding.nuevauno.com/kit/home-apps/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/home-apps.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 260
      }
    },
    {
      "id": "live-activity",
      "name": "Actividad en vivo",
      "group": "inicio",
      "when": "Lo que pasa en la empresa, estilo terminal, actualizándose solo sin recargar la página.",
      "anatomy": [
        "Etiqueta 'Actividad' y 'EN VIVO' con cuadrado que parpadea",
        "Línea por evento: hora en Ubuntu Mono, qué pasó, área",
        "El evento nuevo entra arriba, con la hora en naranja y el texto que se escribe"
      ],
      "rules": {
        "do": [
          "Eventos reales (empuje o sondeo con pausa si la pestaña está oculta)",
          "Lenguaje de persona",
          "6 líneas y 'Ver toda la actividad'"
        ],
        "dont": [
          "No muestres eventos técnicos ni ids",
          "No recargues la página para actualizar"
        ]
      },
      "classes": [
        "nu-actividad",
        "nu-actividad--vivo",
        "nu-vivo",
        "nu-suceso",
        "nu-suceso--nuevo"
      ],
      "page": "https://branding.nuevauno.com/kit/live-activity/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/live-activity.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 340
      }
    },
    {
      "id": "home",
      "name": "Inicio",
      "group": "pantalla",
      "when": "Lo primero que ve el cliente.",
      "anatomy": [
        "Fecha + saludo con nombre real + empresa activa",
        "Pídele algo a Kōdo",
        "Tarjetas de datos",
        "Tus apps",
        "Actividad en vivo"
      ],
      "rules": {
        "do": [
          "Ancho de contenido ~1120 px",
          "Todo dato real o se oculta"
        ],
        "dont": [
          "No agregues banners ni bienvenidas de cuenta nueva a clientes importados"
        ]
      },
      "classes": [
        "nu-pagina",
        "nu-saludo"
      ],
      "page": "https://branding.nuevauno.com/kit/home/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/home.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 900
      }
    },
    {
      "id": "record-list",
      "name": "Lista de registros",
      "group": "registros",
      "when": "Contactos, guías, facturas: cualquier lista de una app.",
      "anatomy": [
        "Barra: buscador, filtrar, acción principal, cuenta en etiqueta de sistema",
        "Tabla: encabezados en etiqueta de sistema, filas de 52 px",
        "Paginación '1–8 de 124'"
      ],
      "rules": {
        "do": [
          "Toda la fila abre la ficha",
          "En teléfono la tabla pasa a filas apiladas con la etiqueta de cada celda",
          "Números alineados a la derecha con cifras tabulares"
        ],
        "dont": [
          "No uses cebra ni colores por fila",
          "No más de una acción principal"
        ]
      },
      "classes": [
        "nu-lista",
        "nu-lista__barra",
        "nu-lista__buscar",
        "nu-tabla",
        "nu-paginas"
      ],
      "page": "https://branding.nuevauno.com/kit/record-list/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/record-list.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 380
      }
    },
    {
      "id": "record-detail",
      "name": "Ficha de un registro",
      "group": "registros",
      "when": "Un contacto, una guía, una factura. Kōdo está a un clic y sabe que estás aquí.",
      "anatomy": [
        "Cabecera: avatar cuadrado, nombre grande, chips, estado y acciones",
        "Tarjeta de datos (etiqueta arriba, valor abajo)",
        "Tarjetas de datos del registro",
        "Caja de Kōdo con sugerencias de este registro"
      ],
      "rules": {
        "do": [
          "Los tres nombres del cliente separados: persona de contacto, razón social, nombre de fantasía",
          "Campo vacío = 'Sin dato' gris"
        ],
        "dont": [
          "No edites en línea sin un botón Editar",
          "No pongas acciones peligrosas sueltas: van en el menú Más"
        ]
      },
      "classes": [
        "nu-registro",
        "nu-registro__cabeza",
        "nu-tarjeta",
        "nu-campos",
        "nu-pedir-kodo"
      ],
      "page": "https://branding.nuevauno.com/kit/record-detail/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/record-detail.html",
      "status": {
        "state": "proposed",
        "date": "2026-10-02",
        "note": "Propuesto por el kit; falta la revisión del founder."
      },
      "preview": {
        "height": 620
      }
    },
    {
      "id": "empty-state",
      "name": "Estado vacío",
      "group": "registros",
      "when": "Cuando una lista o sección aún no tiene nada.",
      "anatomy": [
        "Icono del kit de 32 px",
        "Título de 22 px",
        "Texto corto que dice qué aparecerá",
        "Acción principal y la opción de pedírselo a Kōdo"
      ],
      "rules": {
        "do": [
          "Explica qué hacer, en tú"
        ],
        "dont": [
          "No muestres tablas vacías ni ceros"
        ]
      },
      "classes": [
        "nu-vacio-bloque"
      ],
      "page": "https://branding.nuevauno.com/kit/empty-state/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/empty-state.html",
      "status": {
        "state": "proposed",
        "date": "2026-10-02",
        "note": "Propuesto por el kit; falta la revisión del founder."
      },
      "preview": {
        "height": 300
      }
    },
    {
      "id": "dropdown",
      "name": "Menú desplegable",
      "group": "controles",
      "when": "Acciones secundarias de un registro o una lista.",
      "anatomy": [
        "Botón con aria-haspopup",
        "Menú flotante blanco con sombra suave",
        "Título opcional en etiqueta de sistema",
        "Separador y acción peligrosa en naranja al final"
      ],
      "rules": {
        "do": [
          "Escape y clic afuera lo cierran"
        ],
        "dont": [
          "No anides menús"
        ]
      },
      "classes": [
        "nu-desplegable",
        "nu-desplegable__menu",
        "nu-desplegable__opcion",
        "nu-desplegable__separador"
      ],
      "page": "https://branding.nuevauno.com/kit/dropdown/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/dropdown.html",
      "status": {
        "state": "proposed",
        "date": "2026-10-02",
        "note": "Propuesto por el kit; falta la revisión del founder."
      },
      "preview": {
        "height": 320
      }
    },
    {
      "id": "buttons",
      "name": "Botones",
      "group": "controles",
      "when": "Acciones.",
      "anatomy": [
        "Principal: naranja lleno con texto blanco, sobre superficie blanca; con flecha si lleva a otro paso",
        "Secundario: borde de 1 px",
        "Texto: naranja sin borde",
        "Chico 32 px, normal 44 px, grande 56 px"
      ],
      "rules": {
        "do": [
          "Un solo principal por vista",
          "Texto regular (400)"
        ],
        "dont": [
          "No dos principales juntos",
          "No esquinas redondeadas ni negrita"
        ]
      },
      "classes": [
        "nu-boton",
        "nu-boton--principal",
        "nu-boton--texto",
        "nu-boton--chico",
        "nu-boton--grande",
        "nu-botones"
      ],
      "page": "https://branding.nuevauno.com/kit/buttons/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/buttons.html",
      "status": {
        "state": "proposed",
        "date": "2026-10-02",
        "note": "Rechazado por el founder («naranjo con fondo negro»: la revisión se mostró en modo oscuro). Vuelve a revisión sobre superficie blanca, el modo del sistema."
      },
      "preview": {
        "height": 200
      }
    },
    {
      "id": "fields",
      "name": "Campos",
      "group": "controles",
      "when": "Formularios.",
      "anatomy": [
        "Etiqueta de sistema arriba",
        "Control blanco con borde de 1 px, 44 px",
        "Ayuda o error abajo (el error en naranja)"
      ],
      "rules": {
        "do": [
          "Valida en el momento (RUT, correo)",
          "Variante de línea para el asistente"
        ],
        "dont": [
          "No pongas la etiqueta dentro del campo como único texto"
        ]
      },
      "classes": [
        "nu-campo",
        "nu-campo__etiqueta",
        "nu-campo__control",
        "nu-campo__ayuda",
        "nu-campo--linea"
      ],
      "page": "https://branding.nuevauno.com/kit/fields/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/fields.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 460
      }
    },
    {
      "id": "chips-and-states",
      "name": "Etiquetas, chips y estados",
      "group": "controles",
      "when": "Marcar tipo, estado o contadores.",
      "anatomy": [
        "Etiqueta de sistema (Ubuntu Mono mayúsculas)",
        "Chip con borde",
        "Estado: cuadrado de 8 px + etiqueta",
        "'EN VIVO'"
      ],
      "rules": {
        "do": [
          "Naranja = activo o alerta, verde = en línea, gris = inactivo"
        ],
        "dont": [
          "No uses píldoras redondeadas ni otros colores"
        ]
      },
      "classes": [
        "nu-etiqueta",
        "nu-chip",
        "nu-chip--acento",
        "nu-estado",
        "nu-vivo"
      ],
      "page": "https://branding.nuevauno.com/kit/chips-and-states/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/chips-and-states.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 200
      }
    },
    {
      "id": "dot-bars",
      "name": "Barras de puntos",
      "group": "datos",
      "when": "Uso de cuota, avance, consumo: reemplazan barras de progreso y medidores.",
      "anatomy": [
        "20 cuadrados de 6 px",
        "Llenos en naranja según el porcentaje, vacíos en gris"
      ],
      "rules": {
        "do": [
          "Acompáñala del número y su unidad"
        ],
        "dont": [
          "No uses barras redondeadas ni degradados"
        ]
      },
      "classes": [
        "nu-puntos",
        "nu-punto"
      ],
      "page": "https://branding.nuevauno.com/kit/dot-bars/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/dot-bars.html",
      "status": {
        "state": "approved",
        "date": "2026-10-02",
        "note": "Aprobado por el founder en la revisión visual."
      },
      "preview": {
        "height": 180
      }
    },
    {
      "id": "wizard",
      "name": "Asistente / instalación",
      "group": "pantalla",
      "when": "Onboarding o procesos largos a pantalla completa. Sigue el modo de la interfaz (claro en claro, oscuro en oscuro) y se ve como una terminal.",
      "anatomy": [
        "Logo del modo actual y contador '02 / 03'",
        "Título enorme (el cursor naranja va en la terminal: uno solo visible)",
        "Terminal: barra de título y registro en Ubuntu Mono con '$', 'ok' en verde y cursor naranja en el paso actual",
        "Línea de progreso naranja al pie de la terminal",
        "Algo útil que hacer mientras tanto"
      ],
      "rules": {
        "do": [
          "Cada paso es un evento real",
          "Una pregunta por pantalla",
          "Mismo modo que el resto del sistema"
        ],
        "dont": [
          "No porcentajes inventados",
          "No un fondo navy en modo claro"
        ]
      },
      "classes": [
        "nu-asistente",
        "nu-asistente__titulo",
        "nu-terminal",
        "nu-terminal__barra",
        "nu-asistente__registro",
        "nu-asistente__progreso",
        "nu-solo-claro",
        "nu-solo-oscuro",
        "nu-campo--linea"
      ],
      "page": "https://branding.nuevauno.com/kit/wizard/",
      "snippet": "https://branding.nuevauno.com/kit/snippets/wizard.html",
      "status": {
        "state": "proposed",
        "date": "2026-10-02",
        "note": "Rechazado por el founder: debe seguir el modo (claro en claro, oscuro en oscuro) y verse como terminal. Rediseñado así; vuelve a revisión."
      },
      "preview": {
        "height": 460
      }
    }
  ]
}