Lo que no se negocia

#Diseño

• Paper e Ink, mucho aire. El Signal aparece solo donde algo importa: fricción o atención. Si todo está en rosa, nada lo está.
• Una idea por sección, un visual por idea, el mínimo de texto. Cada vista tiene un protagonista y como mucho dos piezas de apoyo.
• Tableros planos. Sin brillos, desenfoques ni degradados en visualización de datos. El grano y el desenfoque son solo para piezas de presentación.
• Isométrico solo donde cuenta el sistema: capas, proceso e intros de casos. Nunca en tableros operativos. Se arma con objetos reconocibles del kit (components/demos/case/isoKit.tsx), nunca con cajas lisas, y las etiquetas van fuera de las caras.
• Mapas planos en tableros. El isométrico solo levanta el punto elegido.
• Las referencias son estilo, no plantillas. Se interpreta su lenguaje y se diseña una visualización nueva para el dominio. Cada caso tiene su propia forma.
• Fuente de verdad: activos maestros, después tokens, después el manual de identidad, después el sitio y las piezas.

#Controles

Nada de controles nativos del navegador para elegir. Ningún <select>, <option>, <datalist> ni <input type="date | time | datetime-local | month | week">.

• Teclado completo: ↑ ↓, Enter, Esc, Inicio y Fin, búsqueda por letra.
• Roles ARIA: listbox y option, o grid para calendarios.
• Se abren desde el control que los dispara y cierran por el mismo camino. El foco regresa al control al cerrar.
• Respetan el movimiento reducido.

#Movimiento

• Entradas largas y precisas, nunca rebotes. Las curvas son las de la casa: n.out y n.inOut.
• Todo movimiento tiene una razón: guiar la lectura, mostrar un cambio de estado o explicar el sistema. Si es adorno, sobra.
• Animaciones densas de celdas en Canvas, no en SVG con una animación por elemento. Se mide en Chrome real.
• Con prefers-reduced-motion, el contenido queda en su estado final, sin animar.
• Nada que el usuario dispare debe sentirse lento: respuesta inmediata, la animación acompaña.

#Copy

• Español claro y directo. Frases cortas.
• La narrativa es que las empresas crecen y sus procesos se quedan atrás. Nunca decimos que una empresa está “rota”.
• Sin punto y coma en textos de comunicación.
• Sin anglicismos en comunicación: tablero, no dashboard. Flujo de trabajo, no workflow. Los nombres técnicos del stack se quedan como son.
• El problema va primero. Nunca abras con “usamos FastAPI, Next.js e IA”. Abre con lo que cuesta hoy.
• Los datos de ejemplo están en la Ciudad de México, donde está la empresa.

#Código

• El código nuevo se lee igual que el de alrededor: mismos nombres, mismo nivel de comentarios, mismas formas.
• Los comentarios están en español y explican por qué, no qué. Si algo no es obvio (una medida, un orden, un caso raro), se deja escrito.
• Colores y medidas salen de los tokens. Un color suelto en un componente es una señal de que falta un token.
• La lógica de negocio vive separada de la interfaz (lib/demos/*.ts en el sitio, rules.py y service.py en el servidor).
• Antes de usar una API de Next.js, revisa la documentación instalada en node_modules/next/dist/docs/.
• Nada sale a producción sin aprobación explícita.