@netzi/tokens 0.1.0-beta.10

package/CHANGELOG.md

@@ -0,0 +1,965 @@
+# @netzi/tokens
+
+## 0.1.0-beta.10
+
+### Minor Changes
+
+- 2e5ff29: **Contraste del sistema y colores forzados (#150, criterio A.9).**
+  - **`prefers-contrast: more` activa el contraste alto sin que la app haga nada.** Sin
+    `data-contrast` en la página, los tokens toman los valores de `[data-contrast='high']` cuando
+    el sistema pide más contraste, también en las secciones oscuras. El atributo, con cualquier
+    valor, manda: `data-contrast="normal"` fija el normal aunque el sistema pida más. El eje de
+    contraste de la fuente DTCG declara la preferencia (`axis.system`) y el build emite cada bloque
+    de contraste alto también dentro de `@media (prefers-contrast: more)`, con la misma
+    especificidad que el original para que la cascada con el cristal no cambie.
+  - **`NetziThemeService` sigue el contraste del sistema.** Campo nuevo
+    `NetziThemeConfig.systemContrast` (por defecto `true`) y señal `resolvedContrast()`
+    (`NetziResolvedThemeContrast`: `'normal' | 'high'`). `setContrast()` fija la elección manual
+    (con `false` escribe `data-contrast="normal"`) y `reset()` vuelve a seguir al sistema. Una
+    configuración guardada antes sigue al sistema, salvo si eligió el alto. El interruptor de
+    `netzi-settings` sale encendido cuando lo pide el sistema.
+  - **Colores forzados en cada componente.** Con `forced-colors: active` (el tema de contraste de
+    Windows) cada control conserva su borde, su foco, lo elegido y lo deshabilitado con los colores
+    del sistema: lo elegido con `Highlight`/`HighlightText` (casilla, interruptor, radio,
+    segmentado, pestañas, día y hora elegidos, opción de select, phone y comandos, página actual
+    del menú y de la paginación…), lo deshabilitado con `GrayText` y el foco que era solo un halo
+    de sombra o un color de borde con un contorno. Los SVG del reloj, la gráfica y la valoración
+    se repintan con colores del sistema, porque el navegador no ajusta su `fill` ni su `stroke`;
+    las muestras de color se quedan sin ajustar, con borde del sistema.
+
+  Lo vigilan un guardián de las hojas (`colores-forzados.spec.ts`), specs de navegador con la
+  emulación de Playwright y una auditoría con colores forzados en cada ruta del playground.
+
+- 4a9cfaa: **Con el dedo, 8 px entre objetivos táctiles vecinos (#210, criterio A.5).** Nuevo token
+  público `--netzi-touch-gap` (8 px): la separación mínima entre las zonas de toque de dos
+  objetivos con puntero táctil, que los componentes usan en su `@media (pointer: coarse)`.
+  Con ratón el aspecto no cambia.
+
+  Lo respetan la paginación (antes 4 px), las estrellas de `netzi-rating` (sus zonas se
+  tocaban), el selector de iconos, las muestras de `netzi-color`, la barra, el menú de tabla y
+  la cuadrícula de `netzi-richtext`, los chips y rejillas de `netzi-cron-picker`, las
+  pestañas, los botones de `netzi-copy` (que además miden ya 44 px), las filas de
+  `netzi-radio-group`, las columnas de hora, los chips de `netzi-tags`, el rango de fecha y
+  hora en dos líneas, las cabeceras de `netzi-accordion`, los eventos pulsables de
+  `netzi-timeline`, los pasos de `netzi-stepper` (que ya no encogen por debajo de su
+  contenido) y las cabeceras ordenables de `netzi-data-table` frente a su asa de
+  redimensionar.
+
+  Con los paneles abiertos, también los días del calendario de `netzi-date` (el panel ocupa
+  casi todo el ancho de un móvil de 360 px; más estrecho, encogen los días, no la
+  separación), su encabezado y su menú de atajos, el inicio y el fin del rango de
+  `netzi-clock`, los ítems de `netzi-menu` (que además miden 44 px), y las opciones de
+  `netzi-combobox` frente al borde de su panel, sus chips en el campo y las filas del «+n»,
+  y el buscador y «Todos/Ninguno» de `netzi-select` y el buscador de `netzi-phone`.
+  Las celdas de `netzi-otp` se separan y, si no caben en una fila, bajan a dos (3 + 3) sin
+  encoger. Con el dedo, los paneles de select, combobox, teléfono, fecha, hora y cron abren a
+  8 px de su control (6 con ratón), y uno más ancho que la pantalla menos sus márgenes (el
+  calendario a 360 px) toma el margen que le quepa en vez de salirse por un lado.
+
+  Las piezas de un control segmentado siguen tocándose, como pide la política.
+
+- 4a9cfaa: **Una pantalla se imprime limpia** (#176, criterio B.13): sin el marco de navegación ni las capas flotantes, en claro y sin vidrio, y sin partir filas.
+  - **`@netzi/tokens`**: eje de entorno nuevo, `print` (`tokens/themes/print.tokens.json`). Reinicia el modo, el cristal y el fondo ambiental (`resets`): en `tokens.css` cada bloque que fija `data-theme`, `data-glass` o `data-ambient` va ahora dentro de `@media not print`, así que al imprimir sale el claro y opaco de siempre con el preset, el contraste y la densidad intactos, sin repetir ningún valor. En `@media print`, la raíz pierde las sombras y el desenfoque del velo, y cada duración baja a `0.01ms`. `base.css` imprime el papel en blanco, sin animaciones ni transiciones a medio camino, y con el atributo opcional `data-print-urls` (en un enlace o en un contenedor) cada enlace externo imprime su dirección detrás. Los enlaces se imprimen subrayados. La resolución DTCG (`effectiveAxes`) aplica la misma regla con el medio `print`, y el contrato de contraste se comprueba también en papel.
+  - **`@netzi/ui`**: `netzi-layout` imprime solo el contenido, a todo el ancho y con su alto natural (sin menú lateral, topbar, barra de anuncio, pestañas, barra de acciones ni enlace de saltar al contenido). No se imprimen `netzi-toaster`, `netzi-command`, el aviso de `netzi-connection-guard` ni los paneles de `netzi-popover`, `netzi-select`, `netzi-combobox`, `netzi-date`, `netzi-time`, `netzi-phone` y `netzi-cron-picker` (salvo el modo en línea); `netziTooltip` se cierra con `beforeprint`. `netzi-data-table` sale entera aunque tenga altura fija, repite el encabezado en cada página, no parte ninguna fila y deja fuera los botones de su barra, la franja de carga y el relleno de la ventana virtual (que solo imprime las filas pintadas). `netzi-descriptions` no parte un par etiqueta-valor. Un `netzi-modal` o un `netzi-drawer` abierto se imprime una vez, sin el velo y en el flujo donde está el componente, sin tapar la página (fijo se repetiría en cada hoja). Sin sombra en el botón primario ni en los pulgares de `netzi-range-slider`, y sin el menú de tablas de `netzi-richtext`. La hoja de la marca propia lleva su regla oscura en `@media not print`.
+
+  Página nueva en el playground: «Impresión» (`/impresion`).
+
+- eb2dbaa: **Marca propia con contraste (#174).** El contrato de contraste solo se comprobaba al construir
+  los tokens y para los seis presets propios, y el README enseñaba a cambiar `--netzi-blue` a un
+  morado sin aviso: la tinta encima se quedaba en 3,35:1.
+
+  `@netzi/tokens`:
+  - Nueva entrada `@netzi/tokens/brand`, en JavaScript sin dependencias (vale en cualquier
+    framework): `deriveBrand(color)` deriva de un color los siete tokens del primario que se
+    redefinen juntos (`primary`, `primary-hover`, `primary-dark`, `primary-text`,
+    `primary-graphic`, `on-primary`, `on-primary-dark`) con texto a 4,5:1 y gráfico a 3:1 sobre
+    cada superficie y sobre el tinte, en claro y en oscuro. Si ninguna tinta llega a 4,5:1 sobre
+    el color, el relleno pasa al tono más cercano que sí (`adjusted`).
+  - `validateBrand({ light, dark })` mide una marca hecha a mano contra ese contrato y dice cada
+    par que falla (modo, tinta, fondo, ratio y mínimo; `TypeError` si falta un modo); `brandVariables` y `parseBrandColor`
+    completan la API. La fórmula del contraste es la misma del build, que ahora la importa de ahí.
+  - El README documenta el contrato y su ejemplo cumple; un test lo lee y mete lo derivado en la
+    fuente DTCG para pasarle el contrato del build.
+
+  `@netzi/ui`:
+  - `provideNetziBrand(color)` y `NetziThemeService.setBrand(color | null)` escriben la marca en
+    una hoja propia (`<style id="netzi-brand">`, con el nonce de `CSP_NONCE` si la app lo da) por
+    encima del preset: la regla clara en la raíz y la oscura en todo `[data-theme='dark']`, también
+    en las secciones oscuras anidadas. `theme.brand()` da los tokens derivados. La derivación se
+    carga con `import()` solo cuando hay marca, fuera del bloque principal. La marca es de la app:
+    no se guarda con las preferencias del usuario ni la borra `reset()`.
+  - En desarrollo (`isDevMode()`), avisa en la consola, una vez por color, si el color no es válido
+    o no puede ser el relleno tal cual, con los pares que fallaban y el tono que se aplica.
+
+- 4a9cfaa: **Token de medida legible: `--netzi-measure` (#213).** El ancho máximo del texto corrido (un
+  párrafo, una descripción, un aviso) para que cada línea se quede en unos 40 a 75 caracteres (64
+  de mediana) en cualquier ancho de ventana (criterio C.9). Vale `33em`. Va en `em` y no en `ch`,
+  que sería lo habitual: el `ch` es el ancho del cero de la fuente que pinta en ese momento, el de
+  la fuente de respaldo mide un 21 % menos que el de Plus Jakarta Sans, y al llegar la fuente de
+  marca cada párrafo acotado cambiaba de ancho y rehacía sus líneas (criterio C.12). Se aplica al
+  texto con `max-inline-size`, nunca a la página: el hueco junto al texto lo llenan el contenido
+  auxiliar, las acciones, otro panel, la rejilla o la prosa en columnas entre párrafos; un párrafo
+  no se parte en columnas, y una descripción corta puede dejar hueco. Solo CSS: el formato DTCG no admite `em`.
+- 4a9cfaa: **Cada duración y cada curva del kit sale de un token (#214).** Los bucles (giradores,
+  latidos, barras indeterminadas, el brillo del skeleton), el destello de error del menú y el
+  rebote de la aguja del reloj seguían escritos a mano en diez hojas.
+
+  `@netzi/tokens`:
+  - Bucles, con la duración de una vuelta: `--netzi-duration-loop-spin` (700ms, el giro de un
+    indicador de carga), `-loop-orbit` (1100ms, el anillo que recorre un ítem o una pestaña),
+    `-loop-pulse` (1200ms, el latido que sustituye al giro con movimiento reducido),
+    `-loop-sweep` (1200ms, la barra indeterminada) y `-loop-shine` (1300ms, el brillo del
+    skeleton). No cambian con `prefers-reduced-motion`: cada componente quita o sustituye su
+    bucle en su propia regla.
+  - `--netzi-duration-flash` (1400ms): un aviso que se enciende, se deja ver y se apaga solo.
+  - Curvas `--netzi-ease-swing` (la de `ease-in-out`), `--netzi-ease-spin` (la de `linear`) y
+    `--netzi-ease-settle` (`cubic-bezier(0.34, 1.45, 0.5, 1)`, un rebote sutil al asentar).
+  - Al imprimir, las nuevas duraciones bajan a `0.01ms` como las demás.
+
+  `@netzi/ui`:
+  - Las hojas usan esos tokens con el mismo valor que tenían, salvo dos redondeos al token de su
+    intención: el giro del spinner del botón pasa de 600 a 700 ms, como el resto de los
+    spinners, y la barra de progreso de la navegación de `netzi-layout`, de 1100 a 1200 ms,
+    como la de `netzi-progress`.
+  - El guardián de movimiento ya no exime los bucles ni tiene lista de excepciones: solo pasan
+    `0s` y el `0.01ms` de la regla reducida.
+  - `netzi-data-table` en scroll continuo mueve el área con el teclado en píxeles enteros: con
+    una cabecera o unas filas de alto con decimales, bajar y volver a subir lo mismo (Av Pág, ↓,
+    Re Pág, ↑) dejaba el área a un píxel de arriba.
+  - En una pantalla de hasta 640 px, el menú del engranaje de `netzi-data-table` cuenta su
+    relleno en el tope de alto: cuando no cabía entero, el panel se salía 8 px por abajo, con
+    su último apartado bajo el borde. El menú pasa a medir 300 px con su relleno (antes, 308).
+
+- b4f64fe: **Con el dedo, los campos de formulario no bajan de 44 px** (#100, WCAG 2.5.5). Con puntero táctil (`pointer: coarse`), incluidos sus paneles abiertos (el editor de texto va aparte, en #108):
+  - Nuevo token `--netzi-touch-target` (44 px). Los controles de tamaño `sm` y `md` suben a 46 px (el borde de 1 px no le quita al input que se toca), cada densidad desde su propia base; `lg` no baja de ahí.
+  - Crecen a 44 px: casillas, radios e interruptores (la fila, o la caja si no hay texto), opciones, buscadores y «Todos/Ninguno» de `netzi-select`, opciones, chips y el «+n» de `netzi-combobox`, el buscador y las opciones de `netzi-phone`, días, flechas, título, atajos y su menú de `netzi-date` (el panel ocupa el ancho del móvil y a 320 px las columnas encogen en vez de recortarse), celdas de `netzi-time`, segmentos de `netzi-segmented`, chips y enlaces de `netzi-cron-picker`, muestras de `netzi-color`, estrellas de `netzi-rating`, la franja de los sliders, celdas de `netzi-otp`, botones −/+ e input de `netzi-number`, AM/PM, unidades y extremos de `netzi-clock`, el ojo de `netzi-password` y el campo de `netzi-tags`.
+  - Amplían la zona de toque sin mover el dibujo: las × de chips, tags y archivos, «Limpiar» de la búsqueda y del combobox, el chevrón del combobox, las ayudas (i) del cron y la barra de valor del selector de color.
+  - Para que esas zonas no se pisen: en `netzi-combobox` múltiple, «Limpiar» se aparta del chevrón algo más de un objetivo y el campo reserva a la derecha sitio para los dos (chips e input no quedan debajo); las filas de chips de `netzi-tags` se separan 10 px; la cabecera de cada campo de `netzi-cron-picker` deja sitio a la zona de su (i).
+  - `netzi-range-slider` con `showValue` reserva sitio encima para las burbujas, que tapaban la etiqueta del field (también con ratón).
+  - En pantallas táctiles estrechas, el panel de `netzi-date` con reloj apila calendario y hora (hasta 680 px), la rejilla de meses y horas del cron pasa a 4 columnas (hasta 400 px) y `netzi-color-picker` encoge hasta el ancho disponible, también dentro del popover de `netzi-color`, que a 320 px se salía 12 px por la derecha (esto último también con ratón).
+
+  **Los paneles anclados que no caben debajo abren encima** (también con ratón). Hasta ahora `netzi-time`, `netzi-date`, `netzi-select`, `netzi-combobox`, `netzi-phone` y `netzi-cron-picker` elegían el lado antes de montar el panel, sin saber cuánto mide: abrían debajo salvo que abajo quedaran menos de 160 px. El de la hora con reloj (~355 px) se salía entonces por abajo de un móvil y el dial y AM/PM no se podían tocar. Ahora, ya montado, se mide su alto entero (sin acotar): si cabe debajo, no cambia; si no cabe debajo y encima sí, abre encima; si no cabe en ningún lado, va al que tiene más sitio y se acota a él, y se desplaza por dentro. Vale para los seis: el alto máximo acota el panel entero, con su buscador y su relleno (en `netzi-phone` y `netzi-combobox` solo acotaba la lista, y a media pantalla de un móvil bajo el buscador de países quedaba por encima del borde). Por eso un select, una fecha o un cron que no caben enteros debajo (antes se encogían ahí) ahora abren encima si allí caben o hay más sitio. Con el dedo, si el buscador y «Todos/Ninguno» de `netzi-select` no dejan sitio a la lista, se desplaza el panel entero en vez de aplastarla.
+
+  Con ratón y teclado nada más cambia de tamaño. El job de accesibilidad de CI lo vigila: mide la zona de toque real de cada control de las páginas de formularios, también con los paneles abiertos y con valor (texto escrito, un archivo, chips en el campo y en el «+n»), y que ningún otro control le pise parte de ella (44 px a 360, 375, 768 y 1024 de ancho; a 320, nada recortado y 24 px), y que los paneles abiertos quepan enteros en la pantalla, también en pantallas bajas (360×640 y 740×360 con el disparador a media pantalla). Mide además con una fuente de otras métricas, para que un alto que salga del texto (y no de un mínimo explícito) no dé 44 en un sistema y menos en otro.
+
+  `netzi-date` y `netzi-time` encogen con su campo dentro de una fila flex: la hora del panel de fecha, a 320 px, empujaba el botón del reloj fuera de su caja.
+
+- e9ac2d9: **`netzi-data-table`: barras de desplazamiento nativas y finas, y sombras de lo oculto (#117).**
+  - **Barras nativas finas** con el color de un token nuevo, `--netzi-scrollbar-thumb`
+    (`--netzi-text-2`), con su contrato de 3:1 sobre cada superficie y también sobre una fila
+    marcada (el tinte del primario, donde se pintan las barras superpuestas), en claro, en
+    oscuro, con alto contraste y en cada preset. El pulgar no baja de 24 px y con el dedo
+    (`pointer: coarse`) vuelve la barra del sistema. Van por `scrollbar-width`/`scrollbar-color` y,
+    en los motores que solo entienden la vía con prefijo, por `::-webkit-scrollbar`. No se
+    dibuja ninguna barra a mano: se arrastran, se tocan y se manejan con el teclado como
+    cualquier barra del sistema, no tapan clics en el borde y no añaden nada al árbol de
+    accesibilidad.
+  - **Sombras en los bordes solo con contenido oculto** a ese lado (inicio, final y abajo),
+    sin depender del puntero: aparecen y se van con la posición del scroll, también al
+    desplazar con el teclado. Se pintan en una capa sin puntero que termina donde empiezan las
+    barras. En RTL se invierten.
+  - **Columnas fijadas**: la sombra de su borde sale solo cuando hay contenido pasando por
+    detrás (antes estaba siempre). Con columnas fijadas a un lado, la sombra de ese lado la
+    lleva el borde fijado y no el del área.
+  - **La barra horizontal queda a la vista con una tabla alta.** Sin `maxHeight`, `fill` ni
+    `autoPageSize`, si la tabla no cabe a lo ancho su área no pasa del alto que se ve del
+    contenedor que desplaza la página (el área de contenido de `netzi-layout`, el cuerpo de
+    un modal) o, si desplaza el documento, del de la ventana. El encabezado va en el mismo
+    contenedor que el cuerpo: se desplaza a lo ancho con él y, al bajar, se queda arriba
+    (ahora el encabezado es fijo en todos los modos, no solo con altura fija o `fill`). Una
+    tabla que cabe a lo ancho conserva su alto natural.
+  - El área sigue siendo una región con nombre y una parada de Tab, y se desplaza con las
+    flechas, Re Pág, Av Pág, Inicio y Fin (nativo del navegador, ahora con test). Su anillo
+    de foco pasa a ser el del token (`--netzi-focus-ring`), por fuera del borde.
+  - **Lo que se enfoca no queda debajo del encabezado fijo** (WCAG 2.4.11): el área reserva
+    con `scroll-padding` su alto (medido), así que Tab, Re Pág y Av Pág dejan lo enfocado a la
+    vista; el propio encabezado lo anula con un margen negativo y enfocarlo no desplaza nada.
+    Que tampoco quede detrás de las columnas fijadas, sin que enfocar lo fijado desplace el
+    área, lo resuelve #135 (con su propio changeset).
+  - **Capas:** la de sombras va con `z-index: 4` y el encabezado con 2–3, sin contexto de
+    apilado propio (para que los menús de las celdas pasen por encima del pie): una barra fija
+    de la app que deba quedar encima de la tabla necesita un `z-index` mayor que 4.
+  - Un contenedor con scroll solo horizontal y alto según su contenido no cuenta como el que
+    desplaza la página (crecería con la tabla); el tope nunca pasa del alto de la ventana.
+
+  Lo oculto se detecta con el evento `scroll` (pasivo) y con `ResizeObserver` del área y de la
+  tabla, una medida por frame; sin bucles de `requestAnimationFrame`.
+
+- 29f7661: **Tamaños de ventana con nombre (#157, ADR 0016).** Tokens nuevos con los cortes de ancho en
+  los que cambia el diseño, siempre los mismos: `--netzi-window-medium` (600px),
+  `--netzi-window-expanded` (840px), `--netzi-window-large` (1200px) y
+  `--netzi-window-extra-large` (1600px), el ancho en el que empieza cada tamaño (compacto empieza
+  en 0). `--netzi-window-reflow` (375px) es el corte de reflujo dentro de compacto: por debajo,
+  lo que va en fila dentro de un panel flotante se apila.
+
+  Una `var()` no vale dentro de `@media`, así que en una hoja se escribe el número del token, en
+  forma de rango: `@media (width < 600px)` o `@media (width >= 840px)`. La salida DTCG los
+  publica como `dimension` en px, y el README trae la tabla de tamaños y paneles.
+
+- b737fae: **Tokens de movimiento con el movimiento reducido dentro (#151).** Las duraciones y las curvas
+  iban escritas a mano en cada componente (quince duraciones distintas entre 80 y 340 ms), y por eso
+  la respuesta a `prefers-reduced-motion` también se repetía componente a componente.
+
+  `@netzi/tokens`:
+  - Duraciones con nombre de intención: `--netzi-duration-instant` (100ms), `-fast` (150ms),
+    `-base` (200ms) y `-slow` (280ms); curvas `--netzi-ease-standard` (la de `ease`), `-enter` y
+    `-exit`. Salen de la fuente DTCG con los tipos `duration` y `cubicBezier`, también en la salida
+    DTCG resuelta.
+  - Las duraciones del desplazamiento, `--netzi-duration-move-{fast,base,slow}`, valen lo mismo
+    que su fundido y con `prefers-reduced-motion: reduce` pasan a `0.01ms` en un solo bloque de
+    `tokens.css` (`themes/motion.tokens.json`). Lo que se desplaza, gira o escala con ellas salta
+    sin regla propia; los fundidos de color y opacidad conservan su duración. A `0.01ms` y no a
+    cero para que `transitionend` y `animationend` sigan llegando.
+
+  `@netzi/ui`:
+  - Las hojas del kit usan los tokens en vez de duraciones y curvas literales (también la
+    transición en línea del tooltip). Cada valor va al paso más cercano de la escala: 30 ms
+    de diferencia como mucho (60 ms en el giro de la aguja del reloj); `ease-out` pasa a `--netzi-ease-enter` y
+    `ease-in` a `--netzi-ease-exit`. Los bucles (giradores, latidos, el brillo del skeleton)
+    conservan su ciclo.
+  - El toast y las muestras de color de los ajustes ya no necesitan su regla de movimiento
+    reducido: el desplazamiento va con un token `move`.
+  - Si tu app redefine un token de duración, el kit entero sigue el nuevo ritmo; para quitar el
+    movimiento en un ámbito, redefine allí los tres `--netzi-duration-move-*` a `0.01ms`.
+
+- 4a9cfaa: **Escala de capas con nombre (`--netzi-layer-*`, #215).** El `z-index` ya no es un número
+  suelto en cada hoja: sale de once capas con nombre de intención, de abajo arriba,
+  `content` (0), `sticky` (2), `bar` (20), `flyout` (50), `scrim` (80), `modal` (100),
+  `dropdown` (120), `toast` (200), `tooltip` (300), `blocking` (1000) y `top` (10000). El
+  README las documenta en ese orden, con sus reglas: dentro de su capa, un componente ordena
+  con `-1`, `0` o `1`, y lo que va justo encima de otra pieza de su capa sube un escalón con
+  `calc(var(--netzi-layer-…) + 1)`.
+
+  Una barra fija de la app que deba pasar por encima de los encabezados fijos de la tabla va en
+  `var(--netzi-layer-bar)`.
+
+  En `@netzi/ui`, las hojas de drawer, modal, layout, toaster, fecha, hora, combobox, popover,
+  select, teléfono, paleta de comandos, editor, cron, conexión y tabla de datos, y el tooltip,
+  usan la escala. El apilado no cambia, con una excepción: el panel del selector de cron
+  estaba en 1200, por encima del aviso, del tooltip y de la pantalla de sin conexión, y pasa a
+  la capa de desplegables como el resto de paneles. Un guardián (`tokens-capas.spec.ts`) falla
+  con cualquier `z-index` numérico distinto de `-1`, `0` o `1` en las hojas y los estilos en
+  línea del kit.
+
+- 021a5bb: **Estados de interacción como un solo sistema, con presionado (#156, criterio B.7).** Nuevo
+  grupo `state` en la fuente DTCG: una capa translúcida por estado, del color del texto y con su
+  opacidad (`--netzi-state-hover` 8 %, `--netzi-state-focus` 12 %, `--netzi-state-pressed` 12 %,
+  `--netzi-state-dragged` 16 %, y cada una con su `--netzi-state-*-opacity` para la plataforma que
+  pinte la capa con su propio color), el seleccionado (`--netzi-state-selected`, el tinte del
+  primario de siempre) y una sola opacidad para lo deshabilitado
+  (`--netzi-state-disabled-opacity`, 0.6). Las capas se redeclaran en cada sección con tema o
+  contraste propios, como el anillo de foco.
+
+  El relleno de marca tiene su presionado propio, `--netzi-primary-pressed`: el hover con la capa
+  de presionado del extremo contrario a su tinta, calibrado en cada preset. `deriveBrand` lo
+  deriva igual para una marca propia (`primaryPressed`, el octavo token del contrato), y
+  `validateBrand` mide `--netzi-on-primary` también sobre él.
+
+  El contrato de contraste del build cubre el sistema: `--netzi-text` llega a 4.5:1 sobre cada
+  superficie con cualquier capa encima, el anillo de foco a 3:1 sobre las de hover, foco y
+  presionado, la tinta del primario sobre su presionado, y el texto de lo deshabilitado se queda a
+  3:1 (nuevo: un contrato sobre una opacidad nombra su tinta con `ink`).
+
+- a4662c0: **Nuevos tokens `--netzi-*-graphic` y `--netzi-*-veil` para lo no textual de un estado (#189,
+  WCAG 1.4.11).** La estrella marcada, el punto de presencia, el borde de un campo inválido o el
+  icono de un resultado necesitan 3:1 frente a lo que tienen al lado, y el crudo del estado no
+  llega en claro: azul 2,08:1 en el peor fondo, verde 1,33, amarillo 1,41 y rojo 2,15.
+  - `--netzi-info-graphic` (`#0e84cd`), `--netzi-success-graphic` (`#069047`),
+    `--netzi-warning-graphic` (`#9d7a0c`) y `--netzi-danger-graphic` (`#df464b`) en claro; en
+    oscuro, el crudo de siempre. Son alias de `--netzi-blue-graphic`, `--netzi-green-graphic`,
+    `--netzi-yellow-graphic` y `--netzi-red-graphic`, como los `-text`.
+  - `--netzi-info-veil`, `--netzi-success-veil`, `--netzi-warning-veil` y `--netzi-danger-veil`:
+    el gráfico al 14 %, el fondo redondo de un icono de estado.
+  - El contrato `non-text` de cada gráfico pide 3:1 sobre cada superficie y sobre su velo
+    compuesto sobre cada una; el build lo comprueba en las 24 combinaciones de modo, contraste y
+    preset.
+
+- 4a9cfaa: **Paleta categórica para gráficas: `--netzi-chart-1` … `--netzi-chart-8`** (#175). Ocho colores
+  para ocho series, sin repetirse, en el orden en que se asignan: azul, naranja quemado, verde
+  azulado, vino, oliva, índigo, rosa rojizo y pizarra, con su versión aclarada en oscuro.
+  - Cada uno declara su contrato `non-text` (3:1, WCAG 1.4.11) sobre todas las superficies y el
+    build lo comprueba en las 24 combinaciones de modo, contraste y preset. El peor par mide
+    3.16:1 en claro y 3.75:1 en oscuro.
+  - Elegida para que las series se distingan también con protanopia, deuteranopia y tritanopia
+    (simulación de Machado 2009): la distancia mínima entre dos series, en OKLab, es 10.0 sin
+    daltonismo y 7.1 con él en claro, y 8.9 y 6.2 en oscuro. Lo fija `test/chart.spec.ts`.
+  - Es fija, no sigue al preset: con el primario como serie 1, el preset verde o el rojo chocaba
+    con la serie del mismo tono.
+
+- 11d7658: **Espaciado, radio y texto por papel; las escalas primitivas pasan a desuso para las apps
+  (#228).** La política de diseño reserva las primitivas a la fuente, pero el README enseñaba
+  `--netzi-space-*`, `--netzi-radius-sm/lg`, `--netzi-font-size-*`, `--netzi-font-weight-*` y
+  `--netzi-line-height-*`. Ahora cada uso tiene su papel en la capa semántica, con el mismo
+  valor en cada tema y densidad:
+  - **Espaciado**, de lo más cercano a lo más lejano: `--netzi-space-related` (4px),
+    `--netzi-space-group` (8), `--netzi-space-stack` (12), `--netzi-space-inset-sm` (12),
+    `--netzi-space-inset` (16), `--netzi-space-inset-lg` (24), `--netzi-space-section` (32) y
+    `--netzi-space-page` (48). La densidad compacta los reduce igual que antes, también en una
+    sección con su propia densidad.
+  - **Radios**: `--netzi-radius-control` (6px), `--netzi-radius-surface-sm` (8),
+    `--netzi-radius-surface` (10) y `--netzi-radius-pill`.
+  - **Texto**: los estilos `--netzi-typography-*`, que ya existían.
+
+  Las escalas se deprecan en `@netzi/tokens` `0.1.0-beta.10` y **pasan a internas como pronto en
+  `@netzi/tokens` `0.1.0-beta.11`**: siguen en `tokens.css` con su valor (los papeles se apoyan
+  en ellas), pero salen de `public-tokens.json` y pueden cambiar sin aviso. Se avisa como con los
+  sinónimos: `$deprecated` en la fuente y en la salida DTCG, el comentario `/* deprecated: … */`
+  en `tokens.css`, la lista del build y la tabla «Escalas que pasan a internas» del README.
+  `--netzi-radius-full`, que no llegó a publicarse, es interno desde ya: usa
+  `--netzi-radius-pill`. `--netzi-radius-md`, en desuso desde #216, apunta ahora a
+  `--netzi-radius-surface-sm`.
+
+  Duraciones, curvas, familias y la escala de letra (`--netzi-duration-*`, `--netzi-ease-*`,
+  `--netzi-font-sans`, `--netzi-font-mono`, `--netzi-font-scale`) ya tenían nombre de intención:
+  pasan a la capa semántica **sin cambiar de nombre**.
+
+  **Migración**, en tus hojas:
+
+  | Antes                                                    | Después                                                        |
+  | -------------------------------------------------------- | -------------------------------------------------------------- |
+  | `var(--netzi-space-2)`                                   | `var(--netzi-space-related)`                                   |
+  | `var(--netzi-space-3)`                                   | `var(--netzi-space-group)`                                     |
+  | `var(--netzi-space-4)`                                   | `var(--netzi-space-stack)` o `var(--netzi-space-inset-sm)`     |
+  | `var(--netzi-space-5)`                                   | `var(--netzi-space-inset)`                                     |
+  | `var(--netzi-space-6)`                                   | `var(--netzi-space-inset-lg)`                                  |
+  | `var(--netzi-space-7)`                                   | `var(--netzi-space-section)`                                   |
+  | `var(--netzi-space-8)`                                   | `var(--netzi-space-page)`                                      |
+  | `var(--netzi-radius-sm)`                                 | `var(--netzi-radius-control)`                                  |
+  | `var(--netzi-radius)`                                    | `var(--netzi-radius-surface-sm)`                               |
+  | `var(--netzi-radius-lg)`                                 | `var(--netzi-radius-surface)`                                  |
+  | `font-size` + `font-weight` + `line-height` de la escala | `font: var(--netzi-typography-<papel>)` y su `-letter-spacing` |
+
+- 79e0661: **Nuevo token `--netzi-primary-graphic`: el primario para lo no textual que tiene que verse (#140,
+  WCAG 1.4.11).** El relleno de una barra de progreso, un anillo de carga o una barra de
+  navegación necesitan 3:1 frente a lo que tienen al lado, y `--netzi-primary` no llega en claro
+  con azul (2,15:1 en el peor fondo), verde (1,36), naranja (1,78), rojo (2,51) ni cian (1,92).
+  - Es el tono más cercano al primario que llega a 3:1 sobre `bg`, `surface`, `surface-2`,
+    `surface-3` y el tinte del primario, calibrado por preset y por tema. En oscuro coincide con
+    el primario salvo en morado, que se aclara un punto para cumplir sobre el tinte.
+  - Su contrato `non-text` lo comprueba el build en las 24 combinaciones de modo, contraste y
+    preset: si se rebaja, el CSS no se escribe.
+  - `--netzi-primary-text` también cumple, pero se aleja más del color de marca. Sigue siendo el
+    que va con lo que late en opacidad: en el valle del latido, el no textual baja de 3:1.
+
+- 4a9cfaa: **Qué tokens son para tu app: `public-tokens.json` (#217).** Cada token de la fuente declara
+  si es **público** (el contrato: se puede usar y redefinir, y no cambia sin pasar por desuso) o
+  **interno** (puede cambiar en cualquier versión). La capa semántica es pública; de las
+  primitivas lo son las escalas (espacio, radios, tipografía, interlineado, duraciones y
+  curvas); de las de componente, las capas flotantes, el velo, los controles, el objetivo
+  táctil, el anillo de foco, la paleta de gráficas, el fondo ambiental y la lente del cristal.
+
+  Quedan **internos** los colores de marca crudos (`--netzi-blue`, `--netzi-blue-dark`,
+  `--netzi-green`, `--netzi-yellow`, `--netzi-red`, `--netzi-purple`) y los pulgares del kit
+  (`--netzi-thumb`, `--netzi-scrollbar-thumb`). Siguen saliendo en `tokens.css` igual que antes:
+  nada cambia de valor. Si tu app los usa, pasa al primario y a los estados, que siguen al
+  preset de marca y al contraste alto (`--netzi-primary`, `--netzi-info`, `--netzi-success`…).
+
+  El paquete publica la lista en `@netzi/tokens/public-tokens.json` (nombre, ruta canónica, capa
+  y aviso de desuso), y la salida DTCG resuelta lo marca en `$extensions["tech.netzi"].visibility`.
+  El README tiene la sección «Públicos e internos» y su catálogo ya solo enseña tokens públicos.
+
+- 4a9cfaa: **`radius-full`, elevación con nombre y estilos de texto compuestos (#220).**
+  - `--netzi-radius-full` para lo del todo redondeado (píldoras, puntos, avatares,
+    interruptores). En `@netzi/ui` sustituye a los 77 `999px`, `100px` y `50%` de las hojas, todos
+    en piezas cuadradas o en píldoras: el dibujo no cambia. Un guardián lo vigila.
+  - Elevación con nombre de intención: `--netzi-elevation-base` (sin sombra), `-raised`,
+    `-floating` y `-modal`, con los valores de siempre en cada tema. `@netzi/ui` y el playground
+    pasan a usarlos.
+  - Un estilo compuesto por paso de la escala (`typography` en DTCG): `--netzi-typography-display`,
+    `-headline`, `-title`, `-title-sm`, `-body`, `-body-sm` y `-caption`, como atajo `font`, y su
+    espaciado en `--netzi-typography-<estilo>-letter-spacing`.
+
+  **En desuso**, se deprecan en `@netzi/tokens` `0.1.0-beta.10` y se retiran como pronto en `@netzi/tokens` `0.1.0-beta.11` (ADR 0012): `--netzi-shadow-sm`,
+  `--netzi-shadow` y `--netzi-shadow-lg`. Siguen valiendo lo mismo en cada tema y en cada sección
+  con su propio tema o contraste. Migración, buscar y sustituir:
+
+  | Antes                    | Después                           |
+  | ------------------------ | --------------------------------- |
+  | `var(--netzi-shadow-sm)` | `var(--netzi-elevation-raised)`   |
+  | `var(--netzi-shadow)`    | `var(--netzi-elevation-floating)` |
+  | `var(--netzi-shadow-lg)` | `var(--netzi-elevation-modal)`    |
+
+  Si tu app redefinía una sombra, redefine su nivel. De paso, `--netzi-surface-1`,
+  `--netzi-text-1` y `--netzi-radius-md` (en desuso desde #216) se redeclaran también en cada
+  sección con su propio tema o densidad, así que siguen al tema como sus canónicos.
+
+- 4a9cfaa: **Un solo nombre por papel: `surface-1`, `text-1` y `radius-md` pasan a desuso (#216).** Eran
+  sinónimos de `--netzi-surface`, `--netzi-text` y `--netzi-radius`, que son los canónicos (la
+  raíz de cada grupo de la fuente, nota en el ADR 0009). Siguen publicándose con el mismo valor,
+  porque apuntan al canónico; se deprecan en `@netzi/tokens` `0.1.0-beta.10` y se retiran **como pronto en `@netzi/tokens` `0.1.0-beta.11`**, en un cambio
+  incompatible propio (ADR 0012).
+
+  Cómo se avisa: `$deprecated` en la fuente DTCG y en la salida resuelta, un comentario
+  `/* deprecated: … */` encima de cada uno en `tokens.css`, la lista que imprime el build y la
+  tabla «En desuso» del README.
+
+  **Migración**, buscar y sustituir en tus hojas:
+
+  | Antes                    | Después                |
+  | ------------------------ | ---------------------- |
+  | `var(--netzi-surface-1)` | `var(--netzi-surface)` |
+  | `var(--netzi-text-1)`    | `var(--netzi-text)`    |
+  | `var(--netzi-radius-md)` | `var(--netzi-radius)`  |
+
+  Si tu app **redefine** uno de los sinónimos (`--netzi-surface-1: …`), redefine el canónico:
+  el sinónimo lo sigue. `@netzi/ui` y el playground ya solo usaban los canónicos; ahora un
+  guardián lo vigila.
+
+- cf23e6b: **Cambio incompatible para las apps que redefinen tokens del tema claro: una sección clara dentro
+  de una página oscura pinta el tema claro (#237).** El claro no tenía bloque propio (son los
+  valores de las capas, en `:root`), así que una sección con `data-theme="light"` heredaba todos los
+  valores oscuros de la página. Ahora `[data-theme='light']` vuelve a declarar, con el valor de las
+  capas, cada token que cambia el tema oscuro, y cada contexto de la página (preset, alto contraste,
+  también el que pide el sistema, cristal y fondo ambiental) le devuelve a la sección lo suyo, así
+  que pinta lo mismo que una página clara con ellos. Con los tokens de fábrica nada cambia en la raíz,
+  tampoco con `data-theme="light"` puesto en `<html>`, ni al imprimir.
+
+  **Por qué es incompatible.** El bloque claro pesa lo que un atributo. Una app que pone
+  `data-theme="light"` en `<html>` (como hacen las plantillas de Netzi) y redefine el claro con un
+  selector que pesa menos (`html { … }`) o con un `:root` cargado antes de `@netzi/tokens` ve que el
+  bloque pisa su valor; y una sección clara dentro de una página oscura toma el claro de fábrica en
+  vez del suyo.
+
+  **Migración.** Declara tus tokens del claro también en `[data-theme='light']`, como ya hacías en
+  `[data-theme='dark']` para el oscuro, y carga tu hoja después de `@netzi/tokens`:
+  - Antes: `:root { --netzi-surface: #fdfcfa; }`
+  - Después: `:root, [data-theme='light'] { --netzi-surface: #fdfcfa; }`
+
+- 54f5fdf: **El texto corrido mide 16 px y cada estilo de texto publica su tamaño suelto (#219, #155,
+  ADR 0015).** La política de diseño fija el texto corriente en 16 px; en los tokens medía 14.
+  - `--netzi-typography-body` pasa a 16 px (`font.size.lg`): párrafos, descripciones y prosa.
+  - Nuevo `--netzi-typography-body-ui`, a 14 px: el texto de interfaz (opciones, pestañas,
+    celdas, mensajes breves). `body-sm` (12.5 px) queda para lo secundario.
+  - Cada estilo publica también `--netzi-typography-<papel>-font-size`, el tamaño solo, para la
+    hoja que pone el peso y el interlineado por su cuenta y no quiere que el atajo `font` se los
+    pise. Como el tamaño del estilo, multiplica `--netzi-font-scale`.
+  - Los avisos de desuso de `--netzi-font-size-*` proponen ahora ese tamaño del papel
+    (`md` → `--netzi-typography-body-ui-font-size`, `lg` → `--netzi-typography-body-font-size`).
+
+  No rompe nada publicado: los estilos de texto (#220) se estrenan en esta misma versión, así
+  que ninguna app los usa todavía. `md` sigue valiendo 14 px y sigue siendo el 100 % del ajuste
+  de tamaño de letra.
+
+### Patch Changes
+
+- 0f16d1c: **Colores forzados: el texto resaltado se lee y los anillos se ven sobre el resaltado (#150).**
+  - Con colores forzados, Chromium pinta detrás del texto una placa del color del lienzo. Lo
+    elegido con `Highlight`/`HighlightText` (segmentado, paginación, menú lateral, días y horas,
+    opciones de select, combobox y phone, chips, ajustes, idiomas, comandos, menús de la tabla,
+    editor, cron, pestañas de trabajo, contadores de pestañas, paso actual…) quedaba blanco sobre
+    blanco. Esas reglas llevan ahora `forced-color-adjust: none`, y lo que llevan dentro hereda el
+    texto del resaltado sin fondos propios.
+  - El foco o la opción activa encima de lo elegido llevan su contorno con el texto del resaltado
+    por dentro (`HighlightText`) o con el del lienzo por fuera: el ítem actual del menú lateral con
+    el foco, la opción activa y elegida del combobox, del select y del phone, y la casilla marcada
+    con el foco.
+  - **Contraste alto:** `--netzi-border-2` sube a 3:1 sobre cada superficie, en claro (`#828b94`)
+    y en oscuro (`#68717b`), y el contrato de contraste de los tokens lo comprueba.
+
+- 4a9cfaa: **El ejemplo de uso del README pinta con tokens semánticos (#218).** El botón de ejemplo
+  usaba `background: var(--netzi-blue)`, una primitiva: quien lo copiaba se saltaba el preset
+  de marca y el contraste alto, justo lo que el propio README desaconseja más abajo. Ahora
+  usa `--netzi-primary` de relleno y `--netzi-on-primary` de tinta, que es el par que cada
+  preset redefine y cuyo contraste comprueba el build.
+
+  También se corrigen las cifras del aviso «relleno o texto»: `--netzi-blue` da 2.54:1 sobre
+  el fondo claro y 2.68:1 sobre blanco (no 2.9:1), y `--netzi-primary-dark` baja a 4.23:1 en
+  `surface-3`.
+
+- 6be96b3: **Lo marcado y los tonos llegan a 3:1 frente a cualquier superficie (#147, WCAG 1.4.11).**
+  - `--netzi-primary-dark`, el relleno de checkbox, radio y toggle marcados, se mide ahora frente a todas las superficies y no solo al fondo de la página. Para cumplirlo se oscurecen el verde (`#079b4e`) y el naranja (`#bf780a`) en claro y se aclara el morado en oscuro (`#824ff3`). El blanco encima sigue por encima de 3:1.
+  - Los puntos de `netzi-timeline` con tono (info, success, warning, danger) y los tramos del medidor de `netzi-password` pintan con el tono de texto de su color (`--netzi-*-text`) en vez del crudo, que en claro se quedaba por debajo.
+
+- 4a9cfaa: **Nada salta al cargar: imágenes del editor y fuentes de marca (#178).**
+  - `@netzi/tokens/fonts.css` añade `'Plus Jakarta Sans Fallback'` y `'Fira Code Fallback'`:
+    Arial y Courier New (Liberation Sans y Liberation Mono en Linux) con `size-adjust`,
+    `ascent-override`, `descent-override` y `line-gap-override` calculados con las métricas
+    de las fuentes del kit. Mientras llega la de marca, el texto ocupa casi lo mismo y la
+    página no salta al cambiar. `--netzi-font-sans` y `--netzi-font-mono` (y la fuente por
+    defecto de `NetziThemeService`) los nombran justo detrás de la de marca; quien tenía
+    guardada la fuente por defecto anterior pasa a la nueva sola. **Aviso:** si la lista de
+    `fonts` que pasas a `netzi-settings` usaba como valor la fuente por defecto anterior
+    (`'Plus Jakarta Sans', -apple-system, system-ui, sans-serif`), cámbiala por
+    `NETZI_THEME_DEFAULTS.font`; si no, ninguna opción saldrá marcada.
+  - `netzi-richtext`: cada imagen guarda su tamaño propio y lo emite como `width` y `height`
+    con `height:auto`, así que reserva su hueco antes de descargarse sin deformarse. Si al
+    insertarla no se conoce, el editor lo lee cuando la imagen carga (fuera del historial
+    de deshacer). Un `<img>` con `width` y `height` a la vez se lee como tamaño propio; un
+    `width` suelto sigue siendo el ancho elegido.
+  - `netzi-richtext`: mientras carga el motor, la barra ya ocupa su sitio (inerte) y el
+    documento reserva su alto (el mínimo si está vacío, el máximo si tiene contenido), así
+    que al montarse no empuja lo que hay debajo.
+
+- 4a9cfaa: **El texto cortado con puntos suspensivos se puede leer entero (#167, A.13).** Había 16
+  textos que se cortaban con `text-overflow: ellipsis` y solo la barra de pestañas ofrecía el
+  completo, con un `title` que solo veía el puntero. Ahora:
+  - **Directiva nueva `netziTruncated`.** Enseña el texto entero en un tooltip del kit, solo
+    mientras el elemento no cabe, con el puntero (sobre el texto o sobre el control que lo
+    contiene) y con el foco del teclado. Es el mismo tooltip de `netziTooltip`, con todo lo
+    suyo (WCAG 1.4.13): se puede recorrer con el puntero, persiste con el foco, se descarta
+    con Escape sin mover el foco y se cierra al imprimir; solo funde la opacidad, sin
+    desplazarse. No toca `aria-describedby`: el texto ya está entero en el DOM y el lector lo
+    lee igual. Un texto suelto cortado (el nombre de un archivo, una celda) se vuelve una
+    parada de Tab mientras no cabe, con el anillo de foco del kit (`base.css` de
+    `@netzi/tokens` lo pinta en `[data-netzi-truncated-stop]`). Entradas: `netziTruncated` (texto propio; vacío, el del
+    elemento), `netziTruncatedPlacement` y `netziTruncatedActive` (foco virtual, para listas
+    con `aria-activedescendant`).
+  - **Aplicada en cada texto que se corta:** chip, nombre del archivo en
+    dropzone, país en phone, copy, valor del select, página actual de las migas, adjunto de notifications, celdas y
+    cabeceras de `netzi-data-table` y las etiquetas de sus submenús de fijar y de anchos, el
+    título de las pestañas de `netzi-workspace-bar` (sustituye a su `title`) y la zona
+    horaria de `netzi-date` y `netzi-time` (la zona IANA entera, también con el foco en el
+    campo).
+  - **La etiqueta de un paso de `netzi-stepper` ya no se corta:** pasa a otra línea. Con los
+    pasos desactivados no se llega a ella con el teclado, y un tooltip no bastaría.
+  - **Un solo oyente de teclado y de impresión para todos los tooltips** (`netziTooltip` y
+    `netziTruncated`), y solo mientras alguno espera su retardo o está a la vista. Antes cada
+    instancia escuchaba el documento, y con mil celdas cada tecla recorría mil oyentes.
+  - En la tabla, solo llevan la directiva las celdas de ancho estricto (redimensionando o en
+    una columna fijada): con el ancho libre crecen con su texto. Una cabecera sin orden también acaba en puntos suspensivos (antes se
+    recortaba en seco), y la cabecera con orden se enseña al pasar por toda la celda.
+
+  Un guardián de hojas falla si un `text-overflow: ellipsis` del kit no lleva la directiva.
+
+- 38a1913: **`tokens.css` se genera desde una fuente única en JSON DTCG** (#127). Los valores no
+  cambian: cada `--netzi-*` vale lo mismo en cada tema, preset, contraste, cristal, densidad y
+  entorno que en la versión anterior, y las rutas de importación son las mismas.
+  - La fuente sigue el formato del W3C Design Tokens Community Group (2025.10), en tres capas
+    (primitivos, semánticos y de componente) y un archivo por eje de tema, y Style Dictionary
+    genera el CSS. Es la base para publicar los mismos tokens a plataformas que no leen CSS.
+  - Cada token que se pinta sobre algo declara su contrato de contraste (texto 4.5:1, no
+    textual 3:1) y el build lo comprueba en las 24 combinaciones de modo, contraste y preset:
+    si un par no llega, el paquete no se construye.
+  - Los comentarios de `tokens.css` salen ahora de las descripciones de la fuente; el orden de
+    algunos bloques cambia sin efecto en la cascada.
+
+- a2f75a9: **El tinte del tema oscuro y las manchas del fondo ambiental siguen al preset de cada sección
+  (#232).** Dentro de una sección con su propio `data-preset` en una página oscura,
+  `--netzi-primary-tint` y `--netzi-primary-tint-strong` tomaban el alfa del tema claro; y con
+  `data-ambient="on"`, `--netzi-ambient` pintaba las manchas con el primario de la página. Ahora se
+  vuelven a declarar en cada sección con preset dentro de una página donde aplica el tema oscuro o el
+  fondo ambiental, y el alto contraste las sigue apagando también ahí. La fuente exige la
+  redeclaración a cada referencia del valor, también la que va dentro de un degradado o de un estilo
+  de texto, y a los tokens que declara cada contexto.
+- 7e4b2f0: **Los estados, los tintes y el pulgar de la barra se redeclaran en cada sección con tema,
+  preset o contraste propios (#232).** Una variable que usa otra se resuelve donde se declara: dentro
+  de una sección con su propio `data-theme`, `--netzi-info-text` (y el resto de `-text`, `-graphic`
+  y `-veil` de los estados), `--netzi-primary-tint`, `--netzi-tint` y el pulgar de la barra de
+  desplazamiento heredaban el valor de la raíz, el del tema de la página. Ahora se vuelven a declarar
+  en cada eje que cambia lo que referencian, como ya hacían el anillo de foco y los papeles de
+  espaciado. La fuente lo exige a cualquier referencia, así que un token nuevo no puede olvidarlo.
+
+## 0.1.0-beta.9
+
+### Patch Changes
+
+- 9819de5: **El indicador de foco llega a 3:1 en todos los presets y temas** (#76). Se pintaba con
+  `--netzi-primary`, que en claro se quedaba en 2.7:1 con azul, 1.6 con verde, 2.2 con
+  naranja y 2.4 con cian, por debajo de WCAG 1.4.11; y varios controles solo tenían un
+  halo del tinte, de 1.1:1.
+  - Nuevo token `--netzi-focus-ring`, apoyado en `--netzi-primary-text` y declarado en la
+    raíz y en cada elemento con `data-theme` o `data-preset`.
+  - Lo usan los contornos y bordes de foco de todo el kit (chip, cron-picker, icon-picker,
+    el enlace «ir al contenido», timeline y los campos de formulario) y la imagen
+    seleccionada del editor.
+  - Checkbox, radio, toggle, rating y segmented pasan del halo o del borde a un contorno de
+    2px, que se distingue igual marcado que sin marcar; el pulgar de los sliders, a un
+    doble anillo; y el editor de texto enriquecido marca el foco en su recuadro.
+
+- 749ad6b: **El hover del botón primario cumple 4.5:1** (#68). Pintaba `--netzi-primary-dark`
+  debajo de la tinta oscura `--netzi-on-primary`: 3.93:1 en azul y 4.0:1 en rojo, por
+  debajo de WCAG 2.1 AA para un texto de 15px. Nuevo token `--netzi-primary-hover`,
+  calibrado por preset y tema (el peor queda en 4.98:1, en rojo), que usan
+  `netzi-button` primario y el botón de reintentar de `netzi-connection-guard`.
+  `--netzi-primary-dark` sigue siendo el fondo de lo que lleva blanco encima.
+- 03e4440: **La instalación ya no fija el canal `@beta`**: `pnpm add @netzi/ui @netzi/tokens`.
+  Mientras un paquete solo tenga versiones beta en npm, cada versión nueva se publica en
+  `latest`, que es lo que se instala por defecto. El dist-tag `beta` deja de mantenerse.
+
+## 0.1.0-beta.8
+
+### Patch Changes
+
+- c57b4f0: **Publicación en el npm público con licencia propietaria de uso libre** (ADR 0005).
+  Los paquetes pasan a `registry.npmjs.org` con `access: public`, `homepage`
+  (<https://ui.netzi.tech>), `bugs` (netzi.tech@gmail.com) y `LICENSE.md` dentro:
+  instalar y usar es libre en cualquier aplicación; redistribuir o derivar, no. El
+  tarball deja de llevar sourcemaps (exponían el TypeScript original) y `files` deja
+  fuera todo lo que no sea el compilado, los tipos, las hojas y la documentación.
+
+## 0.1.0-beta.7
+
+### Minor Changes
+
+- effd0cd: **Fuentes de marca autoalojadas** (#59). `fonts.css` importaba Plus Jakarta Sans
+  y Fira Code desde Google Fonts: toda app que lo usara mandaba la IP de cada
+  visitante a Google antes de ningún consentimiento (políticas 14 y 08b). Ahora las
+  dos familias viajan **dentro del paquete** como fuentes variables woff2
+  (`styles/fonts/`, ~95 KB) en dos subconjuntos, `latin` y `latin-ext` (ç, ñ, ß, ã,
+  l·l), con `font-display: swap` y sus licencias OFL-1.1 al lado. La importación
+  no cambia (`@import '@netzi/tokens/fonts.css'`); Vite y el CLI de Angular
+  reescriben las rutas y copian los archivos al build. Un guardián impide que
+  ninguna hoja publicada vuelva a cargar algo de fuera.
+
+### Patch Changes
+
+- 0ff1e00: **Contraste (WCAG 1.4.3) en botón `soft`, anuncios y página de estado** (#56).
+  axe sobre las 58 páginas del playground, en claro y oscuro:
+  - `netzi-button variant="soft"` escribía con `--netzi-primary-dark` (4.34:1 en
+    claro, **2.85:1** en oscuro) y su hover era un azul literal que ignoraba el
+    preset. Ahora escribe con `--netzi-primary-text` (garantizado a 4.5:1 sobre el
+    tinte en los seis presets y los dos temas) y el hover usa
+    `--netzi-primary-tint-strong`. El hover y la sombra del botón primario también
+    dejan de ser azul fijo: siguen al preset.
+  - `netzi-announcement` de éxito (**2.7:1**) y peligro (4.2:1) mezclaban el acento
+    demasiado claro para el texto blanco; las mezclas bajan al 50 % y 65 % y las
+    tintas pasan a tokens (`--netzi-on-primary-dark`, `--netzi-on-accent`). Un
+    guardián mide cada mezcla como la calcula el navegador.
+  - El código gigante de `netzi-status-page` (ilustración al 12 %) pasa a ser
+    decoración de verdad: `aria-hidden` y el número pintado por CSS desde
+    `data-code`. El estado lo dan el título y la descripción de `netzi-result`.
+  - README de tokens: `--netzi-primary` / `--netzi-blue` y compañía son relleno;
+    para texto van sus `-text`.
+
+  Los placeholders de `netzi-input` / `netzi-number` que citaba la incidencia no
+  se reproducen: usan `--netzi-text-2` (5.5:1 sobre blanco) y axe no los marca en
+  ninguna página.
+
+## 0.1.0-beta.6
+
+### Minor Changes
+
+- 0adae8d: **Escala tipográfica** (#51). El kit publicaba tamaños solo para sus controles
+  (`--netzi-control-fs-*`); el texto que no es un control —líneas secundarias,
+  pies, metadatos, títulos— no tenía token, cada app se inventaba el suyo y
+  `var(--netzi-font-size-xs)`, que parece existir, se descartaba en silencio.
+  Llegan `--netzi-font-size-xs/sm/md/lg/xl/2xl/3xl` (11 · 12.5 · 14 · 16 · 18 ·
+  22 · 28 px, sacados de lo que el kit ya usa; `md` = 14px es el 100 % de
+  `--netzi-font-scale`, con el que todos escalan), `--netzi-line-height-none/
+tight/normal/relaxed` (1 / 1.25 / 1.5 / 1.65) y
+  `--netzi-font-weight-regular…extrabold` (400–800, los cortes que carga
+  `fonts.css`). La densidad compacta no los cambia. Documentados en el README de
+  tokens y en el showcase («Tipografía»); un guardián fija la escala, el anclaje
+  en 14 y que todo tamaño multiplique la escala de accesibilidad.
+
+## 0.1.0-beta.5
+
+### Minor Changes
+
+- ba4ed7a: **Interruptor, checkbox y radio: primario oscuro con la marca blanca; y las
+  muestras de preset, redondas y del color puro.**
+  - El interruptor encendido llevaba el pulgar casi negro (`--netzi-on-primary`)
+    sobre el azul claro, porque sobre ese azul el blanco no llega a 3:1. Negro
+    sobre azul se veía raro (queja literal). Los tres controles de selección pasan
+    a pintar el estado activo con `--netzi-primary-dark` y encima el nuevo
+    `--netzi-on-primary-dark`, blanco en todos los presets: pasa de 3:1 en cada uno
+    y en los dos temas, y la pista encendida se distingue del fondo (el morado
+    oscuro sube un punto en tema oscuro para eso). Lo fija el guardián.
+  - Las muestras de preset del panel de ajustes eran cuadrados con un tinte del
+    color al 18 % y el color dentro; en oscuro salían marrón, oliva, granate…
+    seis manchas turbias. Ahora son círculos del color puro y el activo lleva un
+    anillo con hueco (`outline` con offset, que funciona igual sobre cristal).
+  - El pulgar del interruptor y el del deslizador pasan a `--netzi-thumb`, opaco;
+    iban con `--netzi-surface`, que dentro de un panel de cristal es un tinte
+    translúcido, y salían como un agujero oscuro con un aro.
+
+- f34e282: **El cristal se ve igual en todas las capas, y con grosor.** Venía de una queja
+  con razón: «casi todas las ventanas que lo soportan tienen colores o
+  transparencia diferente». Lo era, y era medible.
+  - **Un solo velo.** El fondo que apaga la app detrás de una capa modal estaba
+    escrito a mano en cada componente y no coincidía: `modal`, `drawer` y la paleta
+    ⌘K usaban `rgba(8,12,20,.55)` con `blur(2px)`, `connection-guard` iba a `.62`
+    con `blur(3px)`, y el menú lateral en móvil a `.5` **sin desenfoque**. Ahora
+    todos salen de **`--netzi-scrim`** y **`--netzi-scrim-filter`**, que además se
+    hunden un punto en tema oscuro (el mismo alfa sobre un fondo ya oscuro apenas
+    separaba la capa del contenido).
+  - **El canto tiene grosor.** `--netzi-float-glow` pasa de una sola línea de luz
+    arriba a **luz arriba + sombra dentro del borde de abajo**. Un filo solo se lee
+    como un velo iluminado; los dos juntos, como el canto de una pieza de vidrio.
+  - **El velo deja la app viva.** Bajó de `0.55` a `0.28` en claro (y de `.62` a
+    `.45` en oscuro), con un desenfoque casi nulo: con el valor anterior, abrir un
+    panel dejaba todo el contenido de detrás en un gris muerto. Lo que se difumina
+    es lo que hay **bajo el panel**, que es de lo que va el cristal.
+  - **La lámina se lee como lámina.** El realce sube a `saturate(200%)` y el brillo
+    del filtro a `1.45` en claro, para que el panel salga blanco esmerilado en vez
+    de gris sucio. Y el vidrio se abre de verdad, en los dos temas: alfa `0.44` y
+    brillo `1.25` en claro (antes `0.70` / `1.2`), alfa `0.12` y brillo `0.56` en
+    oscuro (antes `0.62` / `0.68`), y solo 10 px de desenfoque (antes 28), para
+    que se vea lo que hay debajo. El punto lo eligió el usuario probando cinco
+    niveles del más denso al más abierto, y se quedó el más abierto; con lo de
+    antes, un panel se leía como una placa gris opaca. Lo que cede es el caso
+    extremo de un plano del color contrario debajo (blanco puro en oscuro, negro
+    puro en claro): ahí el texto secundario —dos niveles reforzado, `#d8dee6` en
+    oscuro y `#2a333c` en claro— se queda en 4.1-4.2:1, y el primario no baja de
+    4.5:1 en ningún caso. Contra el fondo del kit, la tinta y un gris medio (una
+    tarjeta o una foto, ya promediadas por el desenfoque) todo pasa de 5:1;
+    `tokens-contrast.spec.ts` fija los suelos.
+  - **Lo que va dentro de un panel de cristal también es cristal.** Las tarjetas
+    del panel de ajustes, la burbuja de un comentario en las notificaciones o el
+    hover de un botón pintaban `--netzi-surface*` opaco dentro de una capa
+    translúcida. Llegan `--netzi-float-surface`, `-2` y `-3` —tintes translúcidos
+    con cristal, las superficies de siempre sin él— y cada capa flotante re-escopa
+    las tres superficies a ellos, con lo que todo lo anidado los hereda sin que
+    ningún componente tenga que saberlo. Son tintes oscuros en los dos temas
+    (una tarjeta es más gris que la lámina); en claro el texto secundario baja un
+    punto más para compensar, y el guardián verifica los suelos sobre cada tinte.
+  - **La burbuja del valor del slider ya no tapa lo que tiene encima.** Flotaba
+    fuera de su caja y se montaba sobre el rótulo: en el panel de ajustes, «TAMAÑO
+    DE LETRA» se leía «TAMAÑO DE LET». Ahora el control reserva su hueco cuando
+    lleva burbuja.
+  - **Al `netzi-cron-picker` le faltaba el filo** (era la única de las quince capas
+    sin él) y ya lo lleva.
+
+  Va con un guardián en la suite que compara **todas** las capas entre sí y falla si
+  alguien vuelve a escribir un velo o un desenfoque a mano, o deja una capa sin
+  filo. Es lo único que caza esto: leyendo un componente suelto no se ve.
+
+- 62a66c3: **Fondo ambiental (`ambient`), y el shell ya no cambia de tono al abrir una capa.**
+  - **Fondo ambiental.** Nuevo eje del tema (`NetziThemeService.setAmbient`,
+    interruptor «Fondo ambiental» en `netzi-settings`, `data-ambient="on"` en la
+    raíz): manchas de color suaves —primario del preset, morado y verde— debajo del
+    contenido, que el layout pinta bajo `--netzi-bg` y que se ven a través del
+    topbar y del sidebar de cristal. Salió de comparar el kit con una referencia:
+    el mismo cristal, sobre un fondo liso, se ve como una placa gris; sobre esto,
+    como vidrio. Los porcentajes son bajos y el texto se sigue leyendo encima
+    (`--netzi-text-3` sobre la mancha más fuerte: 4.4:1 en claro, 4.6:1 en
+    oscuro). Se apaga solo en alto contraste. Token: `--netzi-ambient`.
+  - **El shell ya no apaga su filtro bajo una capa modal.** Se hacía por frames
+    (30 → 51 medidos) con la premisa de que el velo lo tapaba, y era falsa: el velo
+    es translúcido y el topbar daba un salto de tono, sin transición, justo al
+    abrir un modal o un drawer. Fuera. `NetziOverlayService` y su marca
+    `data-netzi-overlay` se quedan, para que la app reaccione a «hay algo encima».
+
+- f2c3dbf: **Llega la lente del canto (opt-in) y `NetziOverlayService`, la cuenta de capas
+  modales abiertas.**
+
+  Salió de intentar la refracción del cristal de Apple. **No se puede hacer hoy**, y
+  queda comprobado: Chromium acepta `backdrop-filter: url(#filtro-svg)` y luego lo
+  **ignora** —el mismo filtro aplicado como `filter` normal sí deforma el
+  contenido—, y Safari ni lo acepta. Así que el fondo no se puede curvar.
+
+  Lo que sí se puede, y lo que salió midiendo:
+  - **`NetziOverlayService`** lleva la cuenta de las capas modales abiertas
+    (modal, drawer, ⌘K, aviso de conexión) y marca el documento con
+    `data-netzi-overlay="open"`, para que la app pueda reaccionar (pausar una
+    animación cara, un vídeo de fondo). Se cuenta en vez de marcar un booleano
+    porque las capas se apilan (un drawer que abre un modal de confirmación).
+    Con esa marca el kit apagaba el filtro del topbar y del sidebar bajo el velo
+    (30 → 51 fps medidos) y **se descartó**: el velo es translúcido y el salto de
+    tono del shell se veía al abrir. Antes coherencia que frames.
+  - **La lente del canto** (`data-glass-lens="on"`): el borde de modal, drawer y ⌘K
+    lleva su propio desenfoque, más fuerte que el del interior, y eso da la
+    sensación de espesor. Es **opt-in** porque es una segunda capa de
+    `backdrop-filter`: con una sola capa en pantalla sale **gratis** (60 fps), pero
+    apilada con el shell cae a **26**.
+
+  De paso, `netzi-command` pasa a pintar su cristal en una capa aparte como el
+  modal y el drawer: tenerlo en el propio elemento habría hecho que el anillo
+  filtrara sobre un fondo ya filtrado.
+
+## 0.1.0-beta.4
+
+### Minor Changes
+
+- 38da044: **Contraste del texto: los tres niveles pasan WCAG AA en los cuatro escenarios.**
+  `--netzi-text-3` era el token de **todos** los rótulos secundarios del kit —etiquetas,
+  ayudas, pies, metadatos, placeholders— y no llegaba al mínimo en ningún tema (2.73 y 2.52
+  en claro, 3.77 y 4.12 en oscuro, con 4.5:1 exigido). El modo `[data-contrast='high']`, que
+  existe justo para esto, subía `border`, `border-2` y `text-2` pero **no lo tocaba**.
+
+  Cada nivel pasa a tener un papel, y no son tres grados de gris intercambiables:
+  - **`--netzi-text-2` es todo el texto secundario** (`#637381` → `#5c6b78` en claro). Sube
+    porque el valor anterior tampoco llegaba sobre `--netzi-surface-3` (4.31:1), la
+    superficie que la auditoría original no miró y que usan chips, badges, kbd y pestañas.
+  - **`--netzi-text-3` queda reservado a lo NO textual** —iconos decorativos, chevrons,
+    separadores, líneas, la barra de redimensionar y los estados deshabilitados— y sube a
+    `#7a8996` para cumplir el 3:1 de SC 1.4.11. Ya no es una trampa esperando a que alguien
+    lo use para un rótulo.
+  - **`[data-contrast='high']` redefine también `text-3`**: cada nivel toma el valor del de
+    encima, así que el modo cumple 4.5:1 incluso donde se haya usado `text-3` para texto.
+
+  En el kit se han migrado a `--netzi-text-2` las **67 declaraciones que sí pintan texto** en
+  34 componentes (data-table, command, clock, date, time, combobox, select, notifications,
+  layout, richtext, table, stat, stepper, contacts, dropzone, chart…), y se han quitado dos
+  `opacity` que anulaban el token por debajo: los días del mes contiguo del calendario
+  quedaban en 2.25:1 efectivo y la guía del pie de imagen del editor en 3:1. Las 43
+  declaraciones restantes siguen en `text-3` a propósito, porque no son texto.
+
+  Además, **el path de `netzi-page-header` marca la página actual reforzándola**
+  (`--netzi-text` + peso 600) en vez de atenuarla, igual que ya hacía `netzi-breadcrumb`.
+
+  Los ratios están medidos sobre el propio `tokens.css` y verificados por
+  `tokens-contrast.spec.ts`: si un valor deja de cumplir, la suite se pone roja.
+
+- 059475f: **Los colores semánticos y el primario cumplen contraste como texto.** Tenían dos
+  papeles y no valían para los dos: el saturado es de **relleno** (un fondo, un punto
+  de estado, una barra de gráfica), y como **texto** sobre superficie clara no llegaba
+  ni de lejos. Medido: los badges daban 1.46-2.36:1, el semántico suelto 1.63-2.78:1
+  y el blanco sobre el primario azul —el preset por defecto— **2.68:1** en los dos
+  temas.
+
+  **Tokens nuevos, uno por color**: `--netzi-blue-text`, `--netzi-green-text`,
+  `--netzi-yellow-text`, `--netzi-red-text`, `--netzi-purple-text` y
+  `--netzi-primary-text`, este último redefinido **por preset** (el primario es
+  themeable, así que su versión legible también). Oscurecidos en claro; en oscuro casi
+  todos sirven crudos y solo el rojo y el morado piden un punto de luz. Cada uno
+  cumple 4.5:1 sobre las cuatro superficies **y sobre su propio tinte**, que es el
+  fondo del badge y el caso peor.
+
+  Migradas las **69 declaraciones `color:`** de 41 archivos. Los rellenos
+  (`background`, `border-color`, el `fill` de una barra) **no se tocan**: ahí el
+  saturado es el correcto.
+
+  **La tinta sobre un relleno sólido pasa a ser la que cumple sobre ESE color**, no
+  una fija. `--netzi-on-primary` y `--netzi-on-accent` pasan a tinta oscura: es lo que
+  el kit ya hacía con los presets verde, naranja y cyan, así que unifica en vez de
+  inventar y no cambia ningún color de marca. El morado es el único que se queda en
+  blanco, porque es el único donde la oscura no cumple (4.13 frente a 4.57).
+
+  **Tres `color: #fff` en duro** que ninguna migración de tokens podía alcanzar y que
+  ningún tema tocaba: el contador de notificaciones (2.78:1 sobre el rojo), el número
+  del paso con error del stepper y la marca del checkbox del select. Más la marca del
+  sidebar, que fijaba su tinta en duro sobre el degradado.
+
+  **Y un guardián nuevo** para que no vuelva a colarse: el spec falla si aparece un
+  `color:` con un literal en vez de un token, nombrando archivo y declaración.
+
+  De paso se simplifica el cristal: el refuerzo del texto pasa a declararse en el
+  propio eje `[data-glass='on']` con literales, en vez de redefinir `--netzi-text-2`
+  en cada una de las 15 capas apuntando a un token intermedio. Menos indirección y una
+  declaración por tema en lugar de treinta.
+
+- 959d2fc: **Superficies de cristal para las capas flotantes.** Nuevo eje de tema
+  `data-glass="on"` (`NetziThemeService.setGlass()`, con su interruptor en
+  `netzi-settings`): las capas que se pintan **encima** del contenido —topbar,
+  sidebar, paneles de select/combobox/date/time/cron/teléfono, popover y todo lo que
+  lo usa (menú, notificaciones, contactos, cuenta, idioma, menús de la tabla), modal,
+  drawer, paleta ⌘K, toasts, menú de tabla del editor y el aviso de conexión— pasan a
+  ser translúcidas con el fondo desenfocado y saturado. Las superficies de
+  **contenido** (tarjetas, secciones, tablas) siguen opacas a propósito.
+
+  Los componentes no saben nada del cristal: consumen tokens nuevos
+  (`--netzi-float-bg`, `--netzi-float-border`, `--netzi-float-border-2`,
+  `--netzi-float-filter`, `--netzi-float-text-2`, `--netzi-float-text-3`) que con el
+  eje apagado valen exactamente lo mismo que los de siempre.
+
+  **El suelo de contraste no lo pone solo el alfa.** Sobre cristal el texto se lee
+  contra lo que haya debajo, que cambia al scrollear, así que el caso a cumplir es el
+  fondo más contrario posible. Taparlo con opacidad exige alfa 0.82, y a 0.82 esto ya
+  no parece cristal; en su lugar el propio `backdrop-filter` **acota el fondo** antes
+  de componerlo —`contrast(0.6)` comprime su rango y `brightness()` lo empuja al tono
+  de la capa (`1.2` en claro, `0.66` en oscuro)—, y con eso bastan **0.70** de alfa en
+  claro y **0.62** en oscuro: se ve lo de detrás y el peor caso sigue dando **4.64:1**
+  (negro puro debajo) y **4.66:1** (blanco puro debajo), con el texto de la capa subido
+  un nivel. `tokens-contrast.spec.ts` modela la cadena entera, no solo el alfa. Las
+  capas llevan además un filo especular (`--netzi-float-glow`), que es lo que hace que
+  una superficie translúcida se lea como cristal y no como un velo.
+
+  **El desenfoque no va en las capas que hospedan controles anclados.** Un
+  `backdrop-filter` distinto de `none` convierte al elemento en bloque contenedor de
+  sus descendientes `position: fixed`: medido, un hijo fijo saltaba de (0,0) al origen
+  del contenedor. Como el topbar, el sidebar, el popover, el modal, el drawer y el
+  panel de fecha hospedan controles que se anclan al viewport, en esos el filtro va en
+  una capa `::before` aparte. El panel de `netzi-date` además pasa a scrollear en un
+  envoltorio interior, para que su capa de cristal no se desplace con el contenido.
+
+  **`netzi-tooltip` se queda opaco a propósito.** Es tinta invertida
+  (`--netzi-text` de fondo) sobre un texto diminuto y efímero, que es justo donde la
+  translucidez más estorba y menos aporta; el cristal ahí sería un peaje de
+  legibilidad sin ganancia visual.
+
+  Degradación automática, sin JS: con `prefers-reduced-transparency: reduce` y donde
+  no haya `backdrop-filter`, la superficie opaca de siempre.
+
+- af3207d: **Alias semánticos de estado, alias por simetría y un tinte marcado.** Toda app
+  da por hechos `--netzi-success` / `--netzi-warning` / `--netzi-danger` /
+  `--netzi-info`, y hasta ahora solo existían los colores crudos
+  (`--netzi-green`…). El problema no es el nombre: un token que no existe **no
+  falla**. La declaración entera se descarta y el elemento se queda sin fondo, sin
+  color o sin radio, sin un aviso en build ni en consola. El propio kit lo tenía:
+  `netzi-cron-picker` pintaba el borde y la nota del campo con error con
+  `var(--netzi-danger)` y llevaba desde el primer día marcándolos en gris.
+  - Los cuatro estados, en crudo y como texto (`--netzi-danger-text`…), declarados
+    como **referencia** al color de marca, no como copia.
+  - Alias por simetría: `--netzi-surface-1`, `--netzi-text-1` y
+    `--netzi-radius-md`, que son los nombres que se escriben al ver el `-2`.
+  - **`--netzi-primary-tint-strong`** (22 % en claro, 28 % en oscuro): el tinte del
+    10 % está calibrado para superficies grandes y en una pieza pequeña se pierde
+    contra el panel (1.13:1). Este llega a 1.32:1. Su tinta es `--netzi-text`; el
+    suave no se puede subir porque es el techo de `--netzi-primary-text`.
+  - Un **guardián en la suite** (`tokens-declarados.spec.ts`) recorre todo el CSS
+    del kit y falla si un `var(--netzi-*)` apunta a un token que nadie declara, que
+    es como se destapó lo del cron.
+
+### Patch Changes
+
+- 1175b77: Alturas de control estandarizadas: todos los inputs de valor (input, select,
+  número, password, teléfono, combobox, moneda, color, búsqueda, fecha, hora) y el
+  botón comparten una **altura fija por tamaño** (sm 36 / md 44 / lg 52 px;
+  compacta 32/40/46) vía tokens `--netzi-control-h-{sm,md,lg}`, así alinean exacto
+  al ponerlos en fila. Los inputs de valor ganan un input `size` (sm/md/lg). Las
+  alturas escalan con `--netzi-font-scale`. Se corrige el botón `lg` (antes medía
+  igual que `md`). Multilínea (textarea, tags) quedan como excepción con
+  `min-height`.
+- 1175b77: **Los README de los paquetes ya dicen qué registry usar, y por qué el otro es
+  peligroso.** Ninguno documentaba la configuración del scope `@netzi`: el de `ui` solo
+  decía `pnpm add …` y el de `tokens` remitía al `.npmrc` "del repo", que un consumidor
+  externo no tiene. Como el README **viaja dentro del paquete**, es el sitio por el que se
+  enteran los de fuera.
+
+  Ahora los dos traen la línea del endpoint del **proyecto** y el aviso de que el endpoint
+  de **grupo** reenvía al npm público cualquier `@netzi/*` que no encuentre
+  (`302 → registry.npmjs.org`), que el scope `@netzi` **no está reclamado** en npmjs.org y
+  que apagar el reenvío en los ajustes del grupo **no lo evita** (issue #16).
+
+- 1175b77: El **`CHANGELOG.md` ahora se incluye en el paquete publicado**. Antes solo se
+  empaquetaba el `README.md` (ng-packagr lo copia solo; el CHANGELOG no estaba en los
+  `assets` de `@netzi/ui` ni en el `files` de `@netzi/tokens`), así que quien instalaba
+  el paquete no veía el historial de cambios. Se añade `./CHANGELOG.md` a los assets de
+  `@netzi/ui` y a `files` de `@netzi/tokens`. Aplica desde la próxima publicación.
+
+## 0.1.0-beta.3
+
+### Minor Changes
+
+- 13ebbcd: Nueva **escala de espaciado** `--netzi-space-0..8` (base 4px: 0/2/4/8/12/16/24/32/48).
+  Da a las apps tokens de gaps/paddings coherentes con el sistema, en vez de píxeles/rem
+  sueltos. Bajo `[data-density='compact']` los pasos medios/grandes se reducen (4→10, 5→12,
+  6→20, 7→28, 8→40), coherente con la densidad de los controles; los pasos finos no cambian.
+  Documentada en el README de tokens, en el showcase de tokens (sección "Espaciado") y en
+  Storybook (Fundamentos/Espaciado). Cierra #34.
+
+## 0.1.0-beta.2
+
+### Patch Changes
+
+- 1e27de5: El **`CHANGELOG.md` ahora se incluye en el paquete publicado**. Antes solo se
+  empaquetaba el `README.md` (ng-packagr lo copia solo; el CHANGELOG no estaba en los
+  `assets` de `@netzi/ui` ni en el `files` de `@netzi/tokens`), así que quien instalaba
+  el paquete no veía el historial de cambios. Se añade `./CHANGELOG.md` a los assets de
+  `@netzi/ui` y a `files` de `@netzi/tokens`. Aplica desde la próxima publicación.
+
+## 0.1.0-beta.1
+
+### Patch Changes
+
+- 145ff48: Alturas de control estandarizadas: todos los inputs de valor (input, select,
+  número, password, teléfono, combobox, moneda, color, búsqueda, fecha, hora) y el
+  botón comparten una **altura fija por tamaño** (sm 36 / md 44 / lg 52 px;
+  compacta 32/40/46) vía tokens `--netzi-control-h-{sm,md,lg}`, así alinean exacto
+  al ponerlos en fila. Los inputs de valor ganan un input `size` (sm/md/lg). Las
+  alturas escalan con `--netzi-font-scale`. Se corrige el botón `lg` (antes medía
+  igual que `md`). Multilínea (textarea, tags) quedan como excepción con
+  `min-height`.
+
+## 0.1.0-beta.0
+
+Primera beta pública de los tokens (reinicio de numeración: el canal beta
+arranca aquí; el desarrollo previo vive en la historia de git).
+
+Incluye: superficies y texto para tema claro/oscuro, color primario con
+presets (`[data-preset]`) y tinte derivado, tonos semánticos, contraste alto,
+densidad compacta, radios (`--netzi-radius-sm/-/lg`), sombras, tipografía con
+familia configurable y **escala global de tamaño de letra**
+(`--netzi-font-scale`), y base CSS con herencia correcta de color en
+controles. Override por CSS para white-label.