EIS-002 — Implementar el sistema de diseño del ADN §8 como design tokens y estilos base

EIS-002 — Implementar el sistema de diseño como design tokens y estilos base

1. Contexto técnico

Traducir la identidad derivada de la portada real del libro (decisión Q-12; ADN §8 v0.2: fondo tinta espacial, cian luminoso como acento principal, oro en aristas/sellos, motivos diamante-EIS / cubo del sprint / chispa Designio; Fraunces + Inter + IBM Plex Mono) a CSS: custom properties, @layer, estilos base, utilidades de impresión y carga tipográfica. Referencia visual: docs/design/portada-libro-amazon.jpg.

2. Restricciones de arquitectura

• CSS nativo, sin frameworks (ADN §3); tokens en :root con los nombres del ADN §8.1.
• Fuentes variable woff2 self-hosted, subset latín, font-display: swap, total ≤120 KB.
• Todo par texto/fondo con contraste AA verificado (≥4,5:1; ≥3:1 texto grande).
• prefers-reduced-motion: reduce definido globalmente desde el día uno.
• Prohibido !important salvo capa de impresión documentada.

3. Criterios de aceptación (Test-Driven Intent)

criterios:
  - id: C1
    given: "página de muestra renderizada con los estilos base"
    when: "se mide el peso de las fuentes transferidas"
    then: "suma woff2 <= 120 KB y los textos usan Fraunces (títulos), Inter (texto), Plex Mono (artefactos)"
  - id: C2
    given: "los tokens de color definidos"
    when: "se auditan los pares de contraste usados (axe/Lighthouse)"
    then: "0 violaciones de contraste AA"
  - id: C3
    given: "un usuario con prefers-reduced-motion: reduce"
    when: "visita cualquier página con animaciones"
    then: "no se reproduce ninguna animación de movimiento; el contenido aparece en su estado final"

4. Definition of Done

• src/styles/tokens.css + base.css + print.css operativos y documentados.
• Página interna /styleguide (no enlazada) que muestra tokens y componentes base.
• Manifiesto de implementación con capturas.