---

name: identidad-argentum description: Los tokens y reglas vigentes de la identidad visual Argentum — paleta (v1 + v2 fusionadas), tipografía, contraste verificado y reglas de uso. Usala al escribir o revisar código de interfaz, para no tener que convocar al brand-specialist por un lookup. Es la fuente citable de la marca; el que decide es el brand-specialist. argument-hint: <archivo-o-token> allowed-tools: Read Glob Grep

Identidad Argentum — tokens y reglas vigentes

Esto es un lookup, no un criterio: cada valor ya está derivado y medido, se cita y no se reinterpreta. Describe el estado vigente; el porqué de cada valor está en los documentos de marca, en los ADR y en el historial de git.

Fuentes y precedencia. El valor de cada token vive en src/app/globals.css. Las reglas viven en sistema-de-diseno.md (v1.0), sistema-de-diseno-v2.md (v2) y los ADR 0008, 0015 y 0028 (que supersede parcialmente al 0015: dorado brillante, .shiny y duración del brillo; donde docs/marca/ dice otra cosa, gana el 0028). Si esta skill no coincide con alguno de ellos, ganan ellos y se corrige la skill. Dueño: brand-specialist.

Nombres: en globals.css los colores llevan el prefijo --color-* de Tailwind v4 (--celeste-400 → --color-celeste-400 → bg-celeste-400). Las tablas usan el nombre de marca.

Alias del fondo de página. --crema, --color-crema y --color-bg son el mismo valor (#FBF7F0) con tres nombres. Solo --color-crema está declarado en globals.css (clase bg-crema): --crema es el nombre de marca de las tablas y --color-bg es el nombre de los documentos de v2, sin declarar. En código se escribe bg-crema; los comentarios que dicen --color-bg hablan de este mismo fondo.

Prefijo cat. En --color-cat-* (bg-cat-<c>-bg, text-cat-<c>-text), cat significa tipo de entidad, el término de CONTEXT.md. Es un nombre heredado de v1, que decía «categorías»; no se renombra (decisiones-menores.md §6) y un prefijo de token no es vocabulario del dominio. Lo mismo vale para el sufijo *-provisorio: se cae cuando cada token deje de serlo, no antes.

---

1. Tokens

Color

| Token | Valor | Rol / restricción | | --- | --- | --- | | --celeste-50 | #EAF4FE | Fondo de bandas y notas; hover de celda tabular | | --celeste-150 | #BFE0FC | Borde sobre fondo celeste; filetes decorativos | | --celeste-400 | #5DADE2 | Color de marca. Superficie, nunca fondo de texto | | --celeste-600 | #1E96F5 | Superficie/borde sin texto | | --celeste-700 | #0978D0 | Único fondo relleno con texto blanco (ADR 0008) | | --celeste-text | #0A5FA8 | Kicker, etiquetas, links | | --celeste-900 | #0A3D66 | Fondo de panel invertido y del dorso de la tarjeta de repaso | | --celeste-cinta | #4FA8DE | Exclusivo de la cinta bandera del header, decorativo | | --dorado-bg | #FFF8E8 | Fondo de tarjeta de liga (v1). Nunca sobre celeste | | --dorado-borde | #F0DFB8 | Borde de liga (v1) | | --dorado-filete | #F2D488 | Filete plano v1; respuesta del dorso de la tarjeta | | --dorado-text | #9A6900 | Texto dorado v1 (ADR 0008). Solo sobre --dorado-bg o --blanco | | --color-accent | #E0AC4C | Dorado institucional v2. Decorativo, nunca texto | | --color-accent-300 | #F7DE9B | Hover del botón primario; texto dorado en panel invertido | | --color-accent-400 | #EDC873 | Decorativo | | --color-accent-600 | #D99A26 | Decorativo/borde, nunca texto | | --color-accent-700 | #94691A | Tope de texto dorado; texto/borde de .btn-primary. Dorado de las cifras del hero (sólido, sin brillo): 4.89:1 sobre --blanco, su fondo real (§3) | | --color-accent-800 | #604411 | Texto chico; hover/activo del botón primario | | --laurel-bg · -borde · -text · -dark | #EAF0DF · #D6E2C2 · #4B6A2C · #33471F | Verde laurel (v1) | | --crema (= --color-crema = --color-bg, ver arriba) | #FBF7F0 | Fondo de página. Nunca blanco puro de página | | --blanco | #FFFFFF | Tarjetas y superficies elevadas | | --arena-borde · --arena-borde-suave | #EDE4D6 · #F5EFE4 | Bordes y divisores | | --borde-default · --borde-strong | #EDE4D6 · #D6CAB8 | border border-borde-default | | --texto-titulo | #1F3B4D | Títulos, valores destacados | | --texto-cuerpo | #4A4235 | Párrafos | | --texto-secundario | #6B5D4A | Subtítulos, descripciones | | --texto-terciario | #7E705D | Meta (ADR 0008). No sobre --celeste-50 | | --texto-sobre-celeste | #FFFFFF | Solo sobre --celeste-700 o --celeste-900 | | --ok · --ok-bg | #2E7C5A · #E9F5EF | Acierto. Nunca en panel invertido | | --error · --error-bg | #C23A3A · #FBE9E9 | Error, fondos claros | | --alerta · --alerta-bg | #9F5F00 · #FBF0DA | Alerta | | --error-invertido | #DE9191 | Error dentro de panel invertido (ADR 0015). Sin declarar todavía en globals.css: baja cuando una pantalla lo use | | --color-foco | = --color-accent-700 | Anillo de foco por defecto | | --color-foco-invertido | = --blanco | Anillo de foco en panel invertido | | --color-acento-repaso-100 · -700 | #EDE4F5 · #6B3FA0 | Acento de "dominio": stat "Dominio de esta ficha" y resultado del quiz. No es un tipo | | --color-tarjetas-dorado-provisorio | #8A5E12 | Solo /tarjetas: <h1> "Tarjeta N" y "Racha actual" | | --color-tarjetas-carta-provisorio | #F5FAFF | Solo /tarjetas: fondo del frente de la tarjeta |

Tipos de entidad (prefijo cat, ver arriba; v1, sin cambios). Fondo · borde · texto:

| Tipo | cat-*-bg | cat-*-borde | cat-*-text | | --- | --- | --- | --- | | Próceres (proceres) | #EAF0DF | #D6E2C2 | #4B6A2C | | Monumentos (monumentos) | #EAF4FE | #CFE4F8 | #0A5FA8 | | Comidas (comidas) | #FBECE4 | #F2D6C7 | #A8492A | | Fechas patrias (fechas) | #FBE9EF | #F2CFDC | #96324F | | Animales (animales) | #EFEAFB | #DDD2F4 | #5A45A0 | | Naturaleza (naturaleza) | #E4F4EF | #C2E2D6 | #1F7A5C |

"Eventos históricos" (un tipo) tiene ícono pero no paleta: se deriva cuando una pantalla la pida (brand-specialist).

Ligas (v1, nombres del ADR 0008 §6 y CONTEXT.md). Fondo · texto: Cobre 0–500 #FBEDE4·#8A4E1F — Plata 501–1500 #F1F3F5·#5B666F — Oro 1501–3000 #F0E2C4·#83590A — Litio 3001+ #EAF0DF·#4B6A2C.

Gradientes y efectos (:root y clases de globals.css)

Roles del dorado. Hay dos dorados y se elige por una pregunta: ¿el texto se lee? (ADR 0028).

| Rol | Qué usa | Contraste | | --- | --- | --- | | Ornamento: logotipo (.au, exento por WCAG 1.4.3); numerales que cumplen las dos condiciones (su información ya está en texto visible AA, y llevan aria-hidden); los dos filetes vigentes (header y divisor del hero, .filete-dorado) | --dorado-brillante-stops y --brillo-banda | Sin requisito | | Lo que se lee: toda cifra o texto que informa | Dorado AA sólido, sin banda de brillo. Cifras del hero: --color-accent-700 sobre --blanco | ≥ 4.5:1 contra el fondo real; si es gradiente, en el peor punto |

Los tres roles del ornamento son un techo, no una autorización: un uso nuevo además tiene que estar cubierto por v2 y por la regla 8. El umbral de 4.5:1 vale aunque el texto sea grande (las cifras del hero miden 38px, peso 400, Cormorant de trazo fino; ADR 0008, pantallas de bajo brillo). Nadie lo baja a 3:1. .shiny desaparece del sistema: las cifras ya no brillan.

Pasada única del brillo. El brillo animado dura una sola pasada (animation-iteration-count: 1), con retardo más duración menores a 5 s (hoy 3.4 s, sin retardo; WCAG 2.2.2). Todos los consumidores arrancan a la vez, sin secuencias ni escalonados; nada lo reinicia por script o temporizador; la banda termina fuera de cuadro a la derecha (100% de shinySweep) y el elemento queda en su gradiente estático, sin salto. Que se repita (cursor, temporizador) exige un ADR nuevo.

| Nombre | Valor | Uso | | --- | --- | --- | | --dorado-brillante-stops | #623F04 0%, #C98810 20%, #FFD250 50%, #C98810 80%, #623F04 100% | Única fuente del dorado brillante. Solo la lista de stops, sin linear-gradient() ni ángulo | | --gradiente-filete | linear-gradient(90deg, var(--dorado-brillante-stops)) | Base estática del filete del header | | --gradiente-au | linear-gradient(100deg, var(--dorado-brillante-stops)) | Base de .au | | --brillo-banda | linear-gradient(100deg, transparent 20%, rgba(255,255,255,0.75) 50%, transparent 80%) | Banda de brillo animada, compartida | | .au | --gradiente-au + --brillo-banda, blend-mode: normal, overlay, background-clip: text, fallback color: --color-accent-700, shinySweep 3.4s, una pasada | Logotipo del header y numerales de rol 2. No cifras que se leen. .shiny (su gemela) se retira por el ADR 0028 | | .filete-dorado | --gradiente-filete + --brillo-banda, misma animación, sin recorte a texto | Filete de 3px bajo la cinta del header y divisor del hero, aria-hidden; una pasada | | .au-dark | 7 stops de v2: #E8BE63 0% · #F2D488 18% · #F7DE9B 36% · #FFF3D0 50% · #F7DE9B 64% · #F2D488 82% · #E8BE63 100%, 100deg, fallback --color-accent-300. Estático | Texto dorado sobre panel invertido | | --gradiente-filete-invertido | linear-gradient(90deg, transparent, var(--color-accent-300), #fff3d0, var(--color-accent-300), transparent). Estático | Filete del dorso de la tarjeta, h-[2px] w-[70px], aria-hidden | | @keyframes shinySweep | Un solo keyframe y un solo bloque prefers-reduced-motion: reduce (animation: none, banda inmovilizada fuera de cuadro) para .au y .filete-dorado. Iteración: 1 | — |

Tipografía

| Rol | Familia y peso | | --- | --- | | Logotipo, display/h1/h2, cifras destacadas | Cormorant Garamond (font-titulo), 400 (ADR 0015) | | h3, kickers | Cormorant Garamond, 600 (h3: interpretación, v2 §8). Única excepción: el kicker del hero de home (hero.tsx) va en Lora 500, por decisión del usuario; no se replica | | Todo lo demás: cuerpo, labels, botones, chips, nav, meta, cifras de dashboard | Lora (font-cuerpo), 400/500/600 — reemplaza a Montserrat (ADR 0015) | | Carga | next/font/google en layout.tsx (--font-cormorant-garamond 400/600 + itálica, --font-lora 400/500/600). Nunca @import. Itálica de Cormorant: en uso real solo 400 (epíteto, pie de foto, pista, resumen del quiz); el 600 se emite porque next/font no elige peso por estilo, sin sumar descargas. Lora no se carga en itálica |

| Token | Tamaño / interlineado / peso | | --- | --- | | text-display · text-h1 · text-h2 · text-h3 | 36/1.1 · 30/1.15 · 24/1.2 · 18/1.3 | | text-body-lg | 16px / 1.75 / 400 — cuerpo de lectura (ficha, tarjeta, enunciado) | | text-body · text-caption | 14/1.7/400 · 13/1.6/400 — interfaz | | text-label · text-button | 13/1.4/600 · 13/1/600 | | text-chip | 11/1/600, tracking 0.06em, + uppercase en el componente | | text-meta | 12/1.5/500 | | text-kicker | 15/1/600, tracking 0.2em, + uppercase. Es el kicker de sección (salas-del-catalogo.tsx); el de 11px de v2 §6 no existe como token | | text-tile-title | 26/1.15/400 |

text-* no incluye familia: un título necesita además font-titulo.

Piso de tamaño: 11px. Ninguna fila de esta skill baja de 11px (text-chip; v1 y ADR 0015 §6, que subió el nav de 10 a 11). Texto más chico que un chip va en text-chip o más. El código tiene valores arbitrarios de 9–10px que violan este piso (§4); no son precedente.

Espaciado, radios, sombras

| Grupo | Tokens | | --- | --- | | Espaciado | xs 4 · sm 8 · md 12 · `lg