@eduardoalvarez/arrecife 0.5.1 → 0.7.0

package/dist/tokens/index.d.cts

@@ -1,31 +1,32 @@
 /**
- * Arrecife — fuente única de la identidad visual.
+ * Arrecife — the single source of the visual identity.
  *
- * LA RESTRICCIÓN QUE MANDA SOBRE TODO LO DEMÁS: este archivo no importa nada.
- * Ni React, ni componentes, ni CSS de terceros. Lo consumen los cinco proyectos,
- * un generador de OG con Satori y un sitio Astro que no monta React. Si un token
- * termina dependiendo de un componente, la librería dejó de ser portable.
- * `scripts/check-tokens-purity.mjs` lo verifica en cada build.
+ * THE CONSTRAINT THAT OUTRANKS EVERYTHING ELSE: this file imports nothing. Not
+ * React, not components, not third-party CSS. It is consumed by the five
+ * projects, by an OG generator running on Satori and by an Astro site that
+ * never mounts React. The moment a token depends on a component, the library
+ * has stopped being portable. `scripts/check-tokens-purity.mjs` verifies it on
+ * every build.
  *
- * Los contrastes están MEDIDOS, no estimados. No cambies un hex para que
- * «combine mejor»: #0F8F80 (3.57:1) y #B4632A (3.95:1) ya se corrigieron por no
- * pasar AA sobre papel. Si los ves en algún lado, están mal.
+ * Contrast ratios here are MEASURED, not estimated. Do not nudge a hex so it
+ * «looks better»: #0F8F80 (3.57:1) and #B4632A (3.95:1) were already corrected
+ * for failing AA on paper. If you see them anywhere, they are wrong.
  *
- * Segunda corrección, por la misma razón. El documento medía todo contra
- * `background`, pero `surfaceRaised` es el peor caso en los DOS modos: en claro
- * es más oscuro que el fondo de página, en oscuro es más claro. Es donde viven
- * menús y tabs activos, así que es donde de verdad hay que poder leer.
+ * A second correction, for the same reason. The identity document measured
+ * everything against `background`, but `surfaceRaised` is the worst case in
+ * BOTH modes: in light it is darker than the page, in dark it is lighter. It is
+ * where menus and active tabs live, so it is where reading has to work.
  *
- *   textMuted claro  #6B7480 → #626A75   4.24 → 4.90 sobre background
- *   warning   claro  #9A6A12 → #8D6111   4.23 → 4.88 sobre background
- *   error     oscuro #E05252 → #E15757   4.35 → 4.51 sobre surface
+ *   textMuted light  #6B7480 → #626A75   4.24 → 4.90 over background
+ *   warning   light  #9A6A12 → #8D6111   4.23 → 4.88 over background
+ *   error     dark   #E05252 → #E15757   4.35 → 4.51 over surface
  *
- * Los tres conservan tono y saturación exactos: solo baja o sube la luminosidad
- * entre 1 y 4 puntos. `accent` y `warm` claros se quedan como están: pasan sobre
- * background y sobre surface, y no son color de texto sobre surfaceRaised.
+ * All three keep their exact hue and saturation: only lightness moves, by one
+ * to four points. Light `accent` and `warm` stay as they are — they pass over
+ * background and over surface, and neither is a text color on surfaceRaised.
  */
 /**
- * Modo oscuro (primario). Contrastes medidos sobre `background` #091319.
+ * Dark mode (primary). Contrast measured against `background` #091319.
  */
 declare const dark: {
     readonly background: "#091319";
@@ -46,10 +47,25 @@ declare const dark: {
     readonly success: "#4FB477";
     readonly warning: "#E8A33D";
     readonly error: "#E15757";
+    /**
+     * The destructive fill. It is NOT `error`, and the difference is the role.
+     *
+     * `error` is a TEXT color: it has to read against a dark surface, so it sits
+     * mid-red. `danger` is a FILL: what has to read is the ink ON TOP of it, so it
+     * goes lighter. Same reasoning as `accent` and `accentOn` — one is measured
+     * against the page, the other against what it carries.
+     *
+     * Measured: ink 6.53:1 over the fill and 7.92:1 over the hover; the fill
+     * itself 6.71:1 over abyss, 5.94 over surface and 4.91 over surfaceRaised, so
+     * the outline variant reads as text on all three.
+     */
+    readonly danger: "#F4736B";
+    readonly dangerHover: "#F78D86";
+    readonly dangerOn: "#2B0A08";
 };
 /**
- * Modo claro. Contrastes medidos sobre `background` #F6F2EA.
- * `background` es blanco CÁLIDO: nunca #FFF como fondo de página.
+ * Light mode. Contrast measured against `background` #F6F2EA.
+ * `background` is WARM white: never #FFF as the page background.
  */
 declare const light: {
     readonly background: "#F6F2EA";
@@ -70,6 +86,20 @@ declare const light: {
     readonly success: "#0F6B52";
     readonly warning: "#8D6111";
     readonly error: "#C0392B";
+    /**
+     * In light mode `danger` and `error` land on the same hex, and that is not an
+     * oversight: over paper a red dark enough to carry white ink is also the red
+     * that reads as text. In dark they part company because the fill has to be
+     * lighter than the text color, not darker.
+     *
+     * Measured: ink 5.11:1 over the fill and 6.61:1 over the hover; the fill
+     * itself 4.87:1 over paper, 5.44 over surface and 4.50 over surfaceRaised —
+     * the last one is exactly on the AA line, which is where every light semantic
+     * in this palette sits.
+     */
+    readonly danger: "#C0392B";
+    readonly dangerHover: "#A32F22";
+    readonly dangerOn: "#FFF6F4";
 };
 declare const colors: {
     readonly dark: {
@@ -91,6 +121,21 @@ declare const colors: {
         readonly success: "#4FB477";
         readonly warning: "#E8A33D";
         readonly error: "#E15757";
+        /**
+         * The destructive fill. It is NOT `error`, and the difference is the role.
+         *
+         * `error` is a TEXT color: it has to read against a dark surface, so it sits
+         * mid-red. `danger` is a FILL: what has to read is the ink ON TOP of it, so it
+         * goes lighter. Same reasoning as `accent` and `accentOn` — one is measured
+         * against the page, the other against what it carries.
+         *
+         * Measured: ink 6.53:1 over the fill and 7.92:1 over the hover; the fill
+         * itself 6.71:1 over abyss, 5.94 over surface and 4.91 over surfaceRaised, so
+         * the outline variant reads as text on all three.
+         */
+        readonly danger: "#F4736B";
+        readonly dangerHover: "#F78D86";
+        readonly dangerOn: "#2B0A08";
     };
     readonly light: {
         readonly background: "#F6F2EA";
@@ -111,23 +156,37 @@ declare const colors: {
         readonly success: "#0F6B52";
         readonly warning: "#8D6111";
         readonly error: "#C0392B";
+        /**
+         * In light mode `danger` and `error` land on the same hex, and that is not an
+         * oversight: over paper a red dark enough to carry white ink is also the red
+         * that reads as text. In dark they part company because the fill has to be
+         * lighter than the text color, not darker.
+         *
+         * Measured: ink 5.11:1 over the fill and 6.61:1 over the hover; the fill
+         * itself 4.87:1 over paper, 5.44 over surface and 4.50 over surfaceRaised —
+         * the last one is exactly on the AA line, which is where every light semantic
+         * in this palette sits.
+         */
+        readonly danger: "#C0392B";
+        readonly dangerHover: "#A32F22";
+        readonly dangerOn: "#FFF6F4";
     };
 };
-/** Marca — iguales en los dos modos. */
+/** Brand — identical in both modes. */
 declare const brand: {
-    /** Cuerpo de la mascota. 4.22:1 → SOLO relleno, NUNCA texto. */
+    /** The mascot's body. 4.22:1 → FILL ONLY, NEVER text. */
     readonly body: "#3E7CB1";
-    /** Patrón de manchas. */
+    /** Spot pattern. */
     readonly spots: "#C2D7E7";
-    /** Casco · contorno y fondo de bloques de código. */
+    /** Hull · outline, and the background of code blocks. */
     readonly hull: "#0B1524";
 };
 declare const fonts: {
-    /** SOLO titulares y números grandes. Nunca cuerpo. */
+    /** Headlines and large numbers ONLY. Never body copy. */
     readonly display: "\"Bricolage Grotesque\", ui-sans-serif, system-ui, sans-serif";
-    /** Cuerpo e interfaz. */
+    /** Body and interface. */
     readonly sans: "\"Geist\", ui-sans-serif, system-ui, sans-serif";
-    /** Código, rutas, etiquetas, metadatos, firma CLI. */
+    /** Code, paths, labels, metadata, the CLI signature. */
     readonly mono: "\"JetBrains Mono\", ui-monospace, SFMono-Regular, Menlo, monospace";
 };
 declare const typeScale: {
@@ -138,7 +197,7 @@ declare const typeScale: {
         readonly weight: 800;
         readonly tracking: "-0.035em";
     };
-    /** Métricas grandes. Números, no prosa: interlineado 1 y sin descendentes. */
+    /** Large metrics. Numbers, not prose: line height 1 and no descenders. */
     readonly stat: {
         readonly family: "display";
         readonly size: 46;
@@ -174,12 +233,12 @@ declare const typeScale: {
         readonly weight: 400;
     };
     /**
-     * 17px. El botón grande y la bajada de las páginas internas.
+     * 17px. The large button, and the deck on interior pages.
      *
-     * Entra como escalón propio porque el documento lo usa DOS veces y en piezas
-     * distintas: «lg 15px 30px r12» con texto de 17, y «h1 44/700 · bajada 17px ·
-     * párrafo de contexto 15px». Un solo uso no habría justificado partir la
-     * distancia entre `ui` (15) y `body` (18); dos sí.
+     * It earns its own step because the identity document uses it TWICE, in two
+     * different pieces: «lg 15/30 r12» with 17px text, and «h1 44/700 · deck 17px
+     * · context paragraph 15px». One use would not have justified splitting the
+     * gap between `ui` (15) and `body` (18); two did.
      */
     readonly lead: {
         readonly family: "sans";
@@ -200,11 +259,11 @@ declare const typeScale: {
         readonly weight: 500;
     };
     /**
-     * La escala de las etiquetas de estado: sans 12.5/500, cuadrada.
+     * The status-badge scale: sans 12.5/500, squared off.
      *
-     * Es medio píxel por debajo de `label`, y esta vez el medio píxel sí importa:
-     * una etiqueta de estado va dentro de una tabla o al lado de un título, y a 13
-     * competía con el texto que acompaña. El documento la da en 12.5 y se ve.
+     * That is half a pixel below `label`, and this time the half pixel matters: a
+     * status badge sits inside a table or next to a title, and at 13 it competed
+     * with the text it accompanies. The document specifies 12.5 and it shows.
      */
     readonly tag: {
         readonly family: "sans";
@@ -213,15 +272,15 @@ declare const typeScale: {
         readonly weight: 500;
     };
     /**
-     * La escala de categoría y métrica: mono 11.5.
+     * The category and metric scale: mono 11.5.
      *
-     * Rompe el suelo de `limits.minScreenPx`, y es a propósito. Ese suelo protege
-     * al TEXTO —lo que se lee en una frase—, y una píldora de una palabra no es
-     * texto corrido: es una marca. El contraste sigue medido y pasa AA (plancton
-     * 5.57:1 sobre abismo), que es la parte que no se negocia.
+     * It breaks the floor set by `limits.minScreenPx`, deliberately. That floor
+     * protects TEXT — what you read in a sentence — and a one-word pill is not
+     * running text: it is a mark. Contrast is still measured and still passes AA
+     * (plankton 5.57:1 over abyss), which is the part that is not negotiable.
      *
-     * A 13 las tres familias de etiqueta salían del tamaño de un botón pequeño y
-     * pesaban más que el título que acompañan. Ver `docs/decisiones.md`.
+     * At 13 the three badge families grew past the size of a small button and
+     * outweighed the title they accompany. See `docs/decisions.md`.
      */
     readonly chip: {
         readonly family: "mono";
@@ -230,18 +289,18 @@ declare const typeScale: {
         readonly weight: 400;
     };
     /**
-     * Mono SIN transformar: fechas, rutas, versiones, nombres de archivo, la firma
-     * del footer y las métricas de etiqueta. Es la mayoría del mono del sistema.
+     * Mono with NO transform: dates, paths, versions, file names, the footer
+     * signature and metric labels. It is most of the mono in the system.
      *
-     * Existe porque `eyebrow` lleva `uppercase` de fábrica y no es una preferencia
-     * que se pueda apagar: es la escala del eyebrow. Un `18 ago 2026` en versalitas
-     * o un `pose-laptop-coffee.png` en mayúsculas están mal, y sin este escalón la
-     * única salida era un `normal-case` en cada sitio de uso.
+     * It exists because `eyebrow` ships `uppercase` and that is not a preference
+     * you can switch off: it IS the eyebrow scale. An `18 Aug 2026` in small caps
+     * or a `pose-laptop-coffee.png` in all caps are wrong, and without this step
+     * the only way out was a `normal-case` at every call site.
      *
-     * El documento dice 12.5. Son 13 por la misma razón por la que `textMuted` se
-     * corrigió: `limits.minScreenPx` es 13 y plancton «nunca bajo 13px». Esta
-     * escala es justo donde se escriben las metas en muted, así que ponerla en
-     * 12.5 habría dejado ilegible su uso más común por medio píxel.
+     * The document says 12.5. This is 13 for the same reason `textMuted` was
+     * corrected: `limits.minScreenPx` is 13 and plankton is «never under 13px».
+     * This scale is exactly where muted metadata gets written, so putting it at
+     * 12.5 would have made its most common use illegible by half a pixel.
      */
     readonly meta: {
         readonly family: "mono";
@@ -256,13 +315,13 @@ declare const typeScale: {
         readonly transform: "uppercase";
     };
 };
-/** Límites duros de legibilidad. */
+/** Hard legibility limits. */
 declare const limits: {
-    /** Mínimo absoluto en pantalla. */
+    /** Absolute minimum on screen. */
     readonly minScreenPx: 13;
-    /** Mínimo absoluto impreso. */
+    /** Absolute minimum in print. */
     readonly minPrintPt: 12;
-    /** Medida máxima de cuerpo. */
+    /** Maximum body measure. */
     readonly measure: "68ch";
 };
 declare const radius: {
@@ -273,43 +332,59 @@ declare const radius: {
     readonly pill: 999;
 };
 /**
- * Controles, del documento: `sm 8/14 · md 12/22 · lg 15/30 · icono 42×42`.
+ * Controls, from the document: `sm 8/14 · md 12/22 · lg 15/30 · icon 42×42`.
  *
- * Solo el padding horizontal y el cuadrado del botón de icono. El alto sale de
- * la escala tipográfica, y el radio es uno solo para los tres tamaños: ver
- * `docs/decisiones.md`.
+ * Only the horizontal padding and the icon button's square. Height comes from
+ * the type scale, and there is a single radius for all three sizes: see
+ * `docs/decisions.md`.
  *
- * No están en `spacing` porque no son ritmo de página: 14, 22 y 30 no componen
- * con 8/12/16/26/40 y no deben ofrecerse como márgenes.
+ * They are not in `spacing` because they are not page rhythm: 14, 22 and 30 do
+ * not compose with 8/12/16/26/40 and must not be offered as margins.
  */
 declare const control: {
     readonly sm: 14;
     readonly md: 22;
     readonly lg: 30;
-    /** Botón de icono: cuadrado, sin texto. */
+    /** Icon button: square, no text. */
     readonly icon: 42;
+    /**
+     * The dense icon button, 32×32.
+     *
+     * 42 is the right measure for a control you hit with a thumb, and the four
+     * reading sites are where that fits. `cursos` is the odd one out: it is the
+     * only admin app of the set, with three actions per table row, and at 42 the
+     * row grows with them — the original used 24 and 28.
+     *
+     * It is 32 and not 28 because 32 is `sm`'s height. A dense icon button lines
+     * up with a small text button, so a toolbar mixing the two stays on one
+     * baseline; 28 would have been a fifth height that matches nothing.
+     *
+     * It does not replace `icon`. A page's primary action stays at 42; this is for
+     * a row of a table. See `docs/decisions.md` § 22.
+     */
+    readonly iconSm: 32;
 };
 /**
- * El ritmo de página. Los cinco escalones llevan `step` en el nombre, y no es
- * decoración: es la corrección de un bug que no dio la cara en ningún sitio.
+ * Page rhythm. All five steps carry `step` in the name, and that is not
+ * decoration: it is the fix for a bug that never surfaced anywhere.
  *
- * En Tailwind v4, `--spacing-*` no alimenta solo `p-*`, `m-*` y `gap-*`:
- * también resuelve `w-*`, `h-*`, `max-w-*`, `min-w-*`, `basis-*` y `size-*`, y
- * ahí GANA a la escala `--container-*`. Los escalones se llamaban `xs, sm, md,
- * lg, xl`, que son exactamente los nombres de esa escala, así que cualquier
- * proyecto que importara `theme.css` se quedaba con `max-w-sm` valiendo 12px en
- * vez de 384px. Nada avisaba: ni el build, ni los tipos, ni Storybook, ni la
- * suite —la librería no usa esas utilidades por dentro—. Se descubrió en
- * producción, con el párrafo de un hero a una palabra por línea.
+ * In Tailwind v4, `--spacing-*` does not only feed `p-*`, `m-*` and `gap-*`: it
+ * also resolves `w-*`, `h-*`, `max-w-*`, `min-w-*`, `basis-*` and `size-*`, and
+ * there it BEATS the `--container-*` scale. The steps used to be named `xs, sm,
+ * md, lg, xl`, which are exactly the names of that scale, so any project that
+ * imported `theme.css` ended up with `max-w-sm` worth 12px instead of 384px.
+ * Nothing warned: not the build, not the types, not Storybook, not the suite —
+ * the library does not use those utilities internally. It was found in
+ * production, with a hero paragraph running one word per line.
  *
- * Redeclarar `--container-sm` NO lo arregla: `--spacing-*` gana la resolución.
- * La única salida es que la librería no use esos nombres.
+ * Redeclaring `--container-sm` does NOT fix it: `--spacing-*` wins resolution.
+ * The only way out is for the library not to use those names.
  *
- * El prefijo sigue el patrón que ya tenía `control`: un grupo con nombre propio
- * dentro del espacio `--spacing-*`. `scripts/check-tokens-namespace.mjs` impide
- * la recaída.
+ * The prefix follows the pattern `control` already had: a named group inside
+ * the `--spacing-*` namespace. `scripts/check-tokens-namespace.mjs` prevents
+ * the relapse.
  *
- * `section` no lleva prefijo porque no choca con nada de Tailwind.
+ * `section` carries no prefix because it collides with nothing in Tailwind.
  */
 declare const spacing: {
     readonly stepXs: 8;
@@ -320,74 +395,100 @@ declare const spacing: {
     readonly section: 96;
 };
 declare const size: {
-    /** Alto de la barra de navegación. */
+    /** Navigation bar height. */
     readonly nav: 64;
-    /** Ancho de columna de lectura. */
+    /**
+     * The bar when it shares the screen with a sidebar.
+     *
+     * It is not «a smaller bar because it looks better». At 64 the header of an
+     * app shell competes with the rail beside it for the same corner, and the two
+     * together eat the top of the content area. 56 is what `cursos` had arrived at
+     * on its own, and it is the same reasoning as `control.iconSm`: the one admin
+     * app of the five is denser than the four reading sites. See
+     * `docs/decisions.md` § 30.
+     */
+    readonly navCompact: 56;
+    /**
+     * The admin sidebar, and the rail it collapses to.
+     *
+     * They are tokens and not the consumer's `w-*` because a collapsible sidebar
+     * has to know BOTH: the layout beside it reserves one of the two, and two
+     * numbers written by hand in two files drift the first time one of them moves.
+     * A sidebar that never collapses is still just a box the layout sizes.
+     *
+     * 56 is the rail: `navCompact`'s height, so a panel's bar and its rail meet in
+     * a square corner instead of a step.
+     */
+    readonly sidebar: 256;
+    readonly sidebarRail: 56;
+    /** Reading column width. */
     readonly content: 760;
-    /** Ancho máximo de página. */
+    /** Maximum page width. */
     readonly wide: 1180;
 };
 /**
- * La paleta del resaltado de sintaxis.
+ * The syntax highlighting palette.
  *
- * Del documento, literal: «keywords arena, strings bioluz, comments plancton,
- * identifiers espuma», sobre casco. CUATRO colores a propósito — el sistema se
- * comunica con color y borde, no con ruido cromático, así que funciones,
- * variables y tipos caen todos en espuma.
+ * Straight from the document: «keywords sand, strings biolume, comments
+ * plankton, identifiers foam», over hull. FOUR colors on purpose — the system
+ * communicates with color and border, not with chromatic noise, so functions,
+ * variables and types all land on foam.
  *
- * El bloque de código es una isla de tema oscuro en los dos modos (ver
- * `CodeBlock`), así que esta paleta NO tiene par claro: siempre va sobre casco.
+ * The code block is an island of dark theme in both modes (see `CodeBlock`), so
+ * this palette has NO light counterpart: it always sits on hull.
  *
- * Contrastes MEDIDOS sobre `brand.hull` #0B1524, todos AA:
+ * Contrast MEASURED over `brand.hull` #0B1524, all AA:
  *
- *   identificador  espuma    16.42:1
- *   literal        bioluz    10.05:1
- *   palabraClave   arena      9.05:1
- *   comentario     plancton   5.43:1
- *   invalido       error      4.97:1
+ *   identifier  foam      16.42:1
+ *   literal     biolume   10.05:1
+ *   keyword     sand       9.05:1
+ *   comment     plankton   5.43:1
+ *   invalid     error      4.97:1
  *
- * `brand.body` (#3E7CB1) NO entra: el sistema lo restringe a relleno, nunca a
- * texto, y aquí mide 4.2:1.
+ * `brand.body` (#3E7CB1) is NOT here: the system restricts it to fill, never
+ * text, and it measures 4.2:1 in this context.
  *
- * Los literales numéricos y booleanos van con las cadenas en bioluz. El
- * documento no los asigna, y agruparlos con las cadenas —los tres son
- * literales— es más coherente que estrenar un quinto color fuera de la paleta.
+ * Numeric and boolean literals ride with strings in biolume. The document does
+ * not assign them, and grouping them with strings — all three are literals — is
+ * more coherent than introducing a fifth color outside the palette.
  */
-declare const sintaxis: {
-    /** El casco. Es el fondo del bloque en los dos modos. */
-    readonly fondo: "#0B1524";
-    /** Identificadores, funciones, tipos, variables. */
-    readonly identificador: "#EDF4F3";
-    /** Cadenas, números, booleanos, null. */
+declare const syntax: {
+    /** The hull. It is the block background in both modes. */
+    readonly background: "#0B1524";
+    /** Identifiers, functions, types, variables. */
+    readonly identifier: "#EDF4F3";
+    /** Strings, numbers, booleans, null. */
     readonly literal: "#35D6C0";
-    /** Palabras clave, control de flujo, `import`, `this`. */
-    readonly palabraClave: "#F2A65A";
-    /** Comentarios y puntuación. */
-    readonly comentario: "#71919C";
+    /** Keywords, control flow, `import`, `this`. */
+    readonly keyword: "#F2A65A";
+    /** Comments and punctuation. */
+    readonly comment: "#71919C";
     /** `markup.deleted`, `invalid`. */
-    readonly invalido: "#E15757";
+    readonly invalid: "#E15757";
 };
 /**
- * La paleta de series de las gráficas. CUATRO, por el mismo motivo que la de
- * sintaxis: el sistema se comunica con color y borde, no con ruido cromático.
+ * The chart series palette. FOUR, for the same reason as the syntax palette:
+ * the system communicates with color and border, not with chromatic noise.
  *
- * Ninguno es un color nuevo. Son cuatro que ya están en la identidad y que se
- * distinguen por TONO, no por luminosidad —turquesa, naranja, azul y gris—,
- * que es la única forma de que sigan siendo cuatro series para quien no
- * distingue rojo y verde. Elegir bioluz y `success` habría dado dos verdes
- * casi idénticos en modo claro.
+ * None of them is a new color. They are four that already exist in the identity
+ * and that are told apart by HUE, not by lightness — teal, orange, blue and
+ * grey — which is the only way they stay four distinct series for someone who
+ * cannot tell socialLink from green. Picking biolume and `success` would have produced
+ * two nearly identical greens in light mode.
  *
- * `brand.body` entra aquí y no en el resaltado por la misma regla vista al
- * derecho: el sistema lo restringe a RELLENO y nunca a texto, y una serie de
- * gráfica es relleno. Es igual en los dos modos porque es color de marca.
+ * `brand.body` belongs here and not in syntax highlighting by the same rule
+ * read the right way round: the system restricts it to FILL and never to text,
+ * and a chart series is fill. It is identical in both modes because it is a
+ * brand color.
  *
- * El umbral que aplica es el de objeto gráfico, 3:1 contra el fondo, no el de
- * texto. Medidos contra `background`, los cuatro lo pasan en los dos modos con
- * margen: el peor es `brand.body` sobre papel, con 3.9:1.
+ * The threshold that applies is the graphical-object one, 3:1 against the
+ * background, not the text one. Measured against `background`, all four clear
+ * it in both modes with room to spare: the worst is `brand.body` over paper, at
+ * 3.9:1.
  *
- * Una quinta serie no se añade inventando un tono. Si una gráfica necesita
- * cinco categorías, o sobran categorías o hace falta agrupar en «otros»: ver
- * `docs/decisiones.md`.
+ * A fifth series is not added by inventing a hue. If a chart needs five
+ * categories, either there are too many categories or they need an «other»
+ * bucket: see `docs/decisions.md`.
  */
 declare const series: {
     readonly dark: readonly ["#35D6C0", "#F2A65A", "#3E7CB1", "#71919C"];
@@ -396,24 +497,24 @@ declare const series: {
 declare const gradient: {
     readonly dark: {
         readonly hero: "linear-gradient(160deg, #091319 60%, #0D2129 100%)";
-        readonly seccion: "linear-gradient(150deg, #10202B 0%, #0D2129 100%)";
-        /** El de la plantilla OG de artículo. 145°, del documento. */
+        readonly section: "linear-gradient(150deg, #10202B 0%, #0D2129 100%)";
+        /** The one used by the article OG template. 145°, from the document. */
         readonly og: "linear-gradient(145deg, #091319 55%, #0D2129 100%)";
     };
     readonly light: {
-        readonly hero: "linear-gradient(160deg, #F6F2EA 60%, #EFE9DE 100%)";
-        readonly seccion: "linear-gradient(150deg, #FFFFFF 0%, #EFE9DE 100%)";
-        readonly og: "linear-gradient(145deg, #F6F2EA 55%, #EFE9DE 100%)";
+        readonly hero: "linear-gradient(160deg, #F6F2EA 60%, #FFFFFF 100%)";
+        readonly section: "linear-gradient(150deg, #FFFFFF 0%, #F6F2EA 100%)";
+        readonly og: "linear-gradient(145deg, #F6F2EA 55%, #FFFFFF 100%)";
     };
 };
-/** Un solo nivel. No hay escala de elevación. */
+/** A single level. There is no elevation scale. */
 declare const shadow: {
     readonly standard: "0 1px 2px rgba(0, 0, 0, 0.35)";
 };
 /**
- * 150ms ease-out — solo color y borde.
- * El sistema no anima posición ni escala: los estados se comunican con borde
- * y color, no con movimiento.
+ * 150ms ease-out — color and border only.
+ * The system animates neither position nor scale: states are communicated with
+ * border and color, not with movement.
  */
 declare const motion: {
     readonly duration: "150ms";
@@ -422,20 +523,20 @@ declare const motion: {
 };
 declare const tagline: {
     /** Hero. */
-    readonly largo: "Ayudo a equipos de ingeniería a escalar con criterio";
-    /** Header, una línea. */
-    readonly corto: "Ayudo a equipos a escalar con criterio";
+    readonly long: "Ayudo a equipos de ingeniería a escalar con criterio";
+    /** Header, one line. */
+    readonly short: "Ayudo a equipos a escalar con criterio";
     /** LinkedIn. */
     readonly en: "Helping engineering teams scale with judgment";
 };
 /**
- * El wordmark siempre dice «Eduardo Álvarez». La mascota se llama Tiburoncín
- * y nunca aparece escrita dentro del logo.
+ * The wordmark always reads «Eduardo Álvarez». The mascot is called Tiburoncín
+ * and its name never appears inside the logo.
  */
 declare const naming: {
     readonly wordmark: "Eduardo Álvarez";
     readonly mascot: "Tiburoncín";
-    /** El dominio, para la firma CLI del footer: `$ cd ~/eduardoalvarez.dev/2026`. */
+    /** The domain, for the footer CLI signature: `$ cd ~/eduardoalvarez.dev/2026`. */
     readonly domain: "eduardoalvarez.dev";
 };
 type ColorMode = keyof typeof colors;
@@ -446,20 +547,21 @@ type TypeScaleToken = keyof typeof typeScale;
 type RadiusToken = keyof typeof radius;
 type ControlToken = keyof typeof control;
 type GradientToken = keyof typeof gradient.dark;
-type SintaxisToken = keyof typeof sintaxis;
+type SyntaxToken = keyof typeof syntax;
 type SpacingToken = keyof typeof spacing;
 type SizeToken = keyof typeof size;
-/** El índice de una serie de gráfica: 0, 1, 2 o 3. */
+/** The index of a chart series: 0, 1, 2 or 3. */
 type SeriesToken = 0 | 1 | 2 | 3;
 
 /**
- * Punto de entrada de `@eduardoalvarez/arrecife/tokens`.
+ * The entry point of `@eduardoalvarez/arrecife/tokens`.
  *
- * Igual que `tokens.ts`: no importa nada fuera de este directorio. Es el único
- * subpaquete que pueden consumir los cinco proyectos, Satori y Astro sin React.
+ * Same as `tokens.ts`: it imports nothing from outside this directory. It is the
+ * only subpackage the five projects, Satori and React-less Astro can all
+ * consume.
  */
 
-/** Todos los tokens en un solo objeto, para plantillas Satori y generadores. */
+/** Every token in a single object, for Satori templates and generators. */
 declare const tokens: {
     readonly colors: {
         readonly dark: {
@@ -481,6 +583,9 @@ declare const tokens: {
             readonly success: "#4FB477";
             readonly warning: "#E8A33D";
             readonly error: "#E15757";
+            readonly danger: "#F4736B";
+            readonly dangerHover: "#F78D86";
+            readonly dangerOn: "#2B0A08";
         };
         readonly light: {
             readonly background: "#F6F2EA";
@@ -501,6 +606,9 @@ declare const tokens: {
             readonly success: "#0F6B52";
             readonly warning: "#8D6111";
             readonly error: "#C0392B";
+            readonly danger: "#C0392B";
+            readonly dangerHover: "#A32F22";
+            readonly dangerOn: "#FFF6F4";
         };
     };
     readonly brand: {
@@ -615,6 +723,7 @@ declare const tokens: {
         readonly md: 22;
         readonly lg: 30;
         readonly icon: 42;
+        readonly iconSm: 32;
     };
     readonly spacing: {
         readonly stepXs: 8;
@@ -626,28 +735,31 @@ declare const tokens: {
     };
     readonly size: {
         readonly nav: 64;
+        readonly navCompact: 56;
+        readonly sidebar: 256;
+        readonly sidebarRail: 56;
         readonly content: 760;
         readonly wide: 1180;
     };
     readonly gradient: {
         readonly dark: {
             readonly hero: "linear-gradient(160deg, #091319 60%, #0D2129 100%)";
-            readonly seccion: "linear-gradient(150deg, #10202B 0%, #0D2129 100%)";
+            readonly section: "linear-gradient(150deg, #10202B 0%, #0D2129 100%)";
             readonly og: "linear-gradient(145deg, #091319 55%, #0D2129 100%)";
         };
         readonly light: {
-            readonly hero: "linear-gradient(160deg, #F6F2EA 60%, #EFE9DE 100%)";
-            readonly seccion: "linear-gradient(150deg, #FFFFFF 0%, #EFE9DE 100%)";
-            readonly og: "linear-gradient(145deg, #F6F2EA 55%, #EFE9DE 100%)";
+            readonly hero: "linear-gradient(160deg, #F6F2EA 60%, #FFFFFF 100%)";
+            readonly section: "linear-gradient(150deg, #FFFFFF 0%, #F6F2EA 100%)";
+            readonly og: "linear-gradient(145deg, #F6F2EA 55%, #FFFFFF 100%)";
         };
     };
-    readonly sintaxis: {
-        readonly fondo: "#0B1524";
-        readonly identificador: "#EDF4F3";
+    readonly syntax: {
+        readonly background: "#0B1524";
+        readonly identifier: "#EDF4F3";
         readonly literal: "#35D6C0";
-        readonly palabraClave: "#F2A65A";
-        readonly comentario: "#71919C";
-        readonly invalido: "#E15757";
+        readonly keyword: "#F2A65A";
+        readonly comment: "#71919C";
+        readonly invalid: "#E15757";
     };
     readonly series: {
         readonly dark: readonly ["#35D6C0", "#F2A65A", "#3E7CB1", "#71919C"];
@@ -662,8 +774,8 @@ declare const tokens: {
         readonly properties: "color, background-color, border-color, fill, stroke";
     };
     readonly tagline: {
-        readonly largo: "Ayudo a equipos de ingeniería a escalar con criterio";
-        readonly corto: "Ayudo a equipos a escalar con criterio";
+        readonly long: "Ayudo a equipos de ingeniería a escalar con criterio";
+        readonly short: "Ayudo a equipos a escalar con criterio";
         readonly en: "Helping engineering teams scale with judgment";
     };
     readonly naming: {
@@ -674,4 +786,4 @@ declare const tokens: {
 };
 type Tokens = typeof tokens;
 
-export { type BrandToken, type ColorMode, type ColorToken, type ControlToken, type FontToken, type GradientToken, type RadiusToken, type SeriesToken, type SintaxisToken, type SizeToken, type SpacingToken, type Tokens, type TypeScaleToken, brand, colors, control, dark, fonts, gradient, light, limits, motion, naming, radius, series, shadow, sintaxis, size, spacing, tagline, tokens, typeScale };
+export { type BrandToken, type ColorMode, type ColorToken, type ControlToken, type FontToken, type GradientToken, type RadiusToken, type SeriesToken, type SizeToken, type SpacingToken, type SyntaxToken, type Tokens, type TypeScaleToken, brand, colors, control, dark, fonts, gradient, light, limits, motion, naming, radius, series, shadow, size, spacing, syntax, tagline, tokens, typeScale };