@netzi/tokens 0.1.0-beta.10 → 0.1.0-beta.9

package/CHANGELOG.md

@@ -1,554 +1,5 @@
 # @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