kit v9 · f417275 · brands/ + ESTRUCTURA §2 a §4
Marcas del grupo
Tres sociedades, un solo kit. Esta página documenta lo que ninguna otra del hub cubre: los tres logos canónicos y sus prohibiciones, el acento de cada marca tal como lo declara su hoja brands/<marca>/tokens.css, la escalera de herencia de cinco niveles, el registro de qué marca tiene qué productos, y las reglas que deciden quién lleva hoja propia y quién no.
La fuente normativa es core-style/ESTRUCTURA.md (Martín, 2026-08-09) y brands/LOGOS-CANONICOS.md. Si esta página y esos archivos difieren, mandan los archivos.
Las tres sociedades
El grupo tiene tres RUT. Propiedad y operación no coinciden y por eso hay dos árboles, no uno: Círculo de Santiago es dueña de la Compañía de Innovación de Santiago, pero es la Compañía de Innovación la única que opera, con gente y servidores, los sitios de las tres. De ahí sale la consecuencia contable que manda sobre el resto: CIS presta servicios a sus dos relacionadas.
| Sociedad | RUT | Rol | Hoja de sociedad |
|---|---|---|---|
| Círculo de Santiago SpA | 78.372.913-K | Matriz. Dueña de CIS. No opera. | brands/cds/tokens.css |
| Compañía de Innovación de Santiago SpA | 78.384.591-1 | Operadora de las tres. | brands/cis/tokens.css |
| Compañía Chilena de Inteligencia de Datos SpA | 78.374.391-4 | Datos. Sociedad propia, operada por CIS. | brands/cochid/tokens.css |
sociedad propia · no cuelga de la matriz
la única con gente y servidores
Logos canónicos
Los tres marks oficiales están extraídos del DOM en producción (2026-06-15) y viven en brands/LOGOS-CANONICOS.md. No hay más. No inventes variantes, no regeneres, no agregues letras, brújulas ni rellenos: si un logo que encuentras en un directorio no coincide con estos tres, el equivocado es ese archivo.
CIS · dos anillos concéntricos
Anillo exterior fino más anillo interior grueso, siempre stroke="currentColor" y nunca fill: el mark toma el color de la tinta del contexto. En la nav va a 32px y en el brand del footer a 34px. El wordmark son tres líneas en mayúsculas peso 800.
<svg viewBox="0 0 200 200" fill="none" stroke="currentColor">
<circle cx="100" cy="100" r="92" stroke-width="4"/>
<circle cx="100" cy="100" r="56" stroke-width="18"/>
</svg>CDS · un anillo de contorno
UN círculo de contorno con stroke-width="2". No es un disco relleno y no es concéntrico: eso lo distingue del mark de CIS. También va en currentColor.
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
<circle cx="12" cy="12" r="10"/>
</svg>Compañía Chilena de Inteligencia de Datos · cuadrado azul
Un rect relleno en el azul de la marca (#1d4ed8 como texto de referencia; nunca como hex a mano en un sitio), acompañado del stack de tres líneas «COMPAÑÍA CHILENA / DE INTELIGENCIA / DE DATOS». La muestra de abajo se renderiza dentro de un marco que carga brands/cochid/tokens.css: el azul que ves es var(--accent) de esa hoja, no un hex de esta página.
<!-- brands/cochid/mark-square.svg, tal cual está en el repo -->
<svg viewBox="0 0 24 24" width="24" height="24" role="img"
aria-label="Compañía Chilena de Inteligencia de Datos">
<title>cochid</title>
<rect x="2" y="2" width="20" height="20" rx="1" fill="#1d4ed8"/>
</svg>El acento de cada marca
La sexta hoja del kit es la de marca: brands/<marca>/tokens.css. Es la única línea del head que cambia entre sitios y lo único que hace es re-teñir --accent y --accent-soft sobre la base común (las hojas de sociedad además matizan su papel). Cada par de muestras de abajo es un marco vivo que carga la hoja real de esa marca desde el CDN, una vez en tema claro y otra en oscuro: si una hoja cambia, esta página cambia sola.
<!-- La única línea del head que cambia entre sitios: -->
<link rel=stylesheet href=".../v9/<digest>/brands/usaia/tokens.css">
<!-- Cada muestra de arriba es un iframe con documento propio que
carga SOLO la hoja de esa marca y pinta su acento: -->
<iframe title="Acento usaia · claro" loading="lazy"
srcdoc='<!doctype html><html data-theme=light>
<link rel="stylesheet" href=".../v9/<digest>/brands/usaia/tokens.css">
<style>html{height:100%;background:var(--accent)}</style>'>
</iframe>Los valores vigentes, leídos de las hojas reales del CDN v9. Son referencia para tablas y auditorías: en código siempre va var(--accent), nunca el hex.
| Marca | Nivel | Hoja | Acento claro | Acento oscuro |
|---|---|---|---|---|
| Compañía de Innovación de Santiago | sociedad | brands/cis/tokens.css | #1e3a5f | #7fc598 |
| Círculo de Santiago | sociedad | brands/cds/tokens.css | #1a1a2e | #c8c8e4 |
| Compañía Chilena de Inteligencia de Datos | sociedad tratada como marca | brands/cochid/tokens.css | #1d4ed8 | #60a5fa |
| usaia | marca | brands/usaia/tokens.css | #6d28d9 | #c4b5fd |
| situación | marca | brands/situacion/tokens.css | #b45309 | #fbbf24 |
| indieweb | marca | brands/indieweb/tokens.css | #be185d | #f9a8d4 |
| Periodismo2 | marca | brands/periodismo2/tokens.css | #b91c1c | #f87171 |
| comentario | marca | hoja pendiente en v9 | · | · |
| Editorial Sebastián | marca | hoja pendiente en v9 | · | · |
La escalera de herencia
Cinco niveles (ESTRUCTURA §4). Cada sitio del grupo pertenece a exactamente uno y hereda de todos los de arriba. La base la cargan todos sin excepción; hacia abajo solo se agrega, nunca se reemplaza el kit.
Lo que una hoja de marca puede y no puede tocar: puede redefinir acento, tipografía de titular y densidad; no puede redefinir papel, tinta, ni las clases gr-* del chrome. Así se ve el nivel 3 en la práctica: la hoja completa de usaia son ocho líneas.
/* brands/usaia/tokens.css · contenido íntegro en v9 */
:root {
--accent: #6d28d9;
--accent-soft: #ede9fe;
}
:root[data-theme="dark"] {
--accent: #c4b5fd;
--accent-soft: #2e1065;
}El registro: marcas y productos
Qué marca existe, bajo qué sociedad, y qué productos cuelgan de cada una. Este registro es la fuente para el estilo (qué hoja hereda cada sitio) y para la contabilidad (a qué centro de resultado se imputa cada gasto): solo una marca tiene contabilidad propia.
Marcas de la Compañía de Innovación de Santiago
| Marca | Dominio | Namebrand de CIS al lado |
|---|---|---|
| Compañía de Innovación de Santiago | innovacionsantiago.cl | es la propia |
| usaia | usaia.cl | sí |
| situación | situacion.cl | sí |
| indieweb | indieweb.cl | sí |
| comentario | comentario.cl | sí · dominio registrado, sin montar |
| Periodismo2 | periodismo2.cl | no |
| Compañía Chilena de Inteligencia de Datos | cochid.cl | no · es sociedad propia tratada como marca |
Marcas de Círculo de Santiago
| Marca | Dominio | Namebrand |
|---|---|---|
| Círculo de Santiago | circulodesantiago.cl | es la propia |
| Editorial Sebastián | (bajo circulodesantiago.cl) | acompañado por CDS |
Productos por marca
| Marca | Productos |
|---|---|
| Compañía de Innovación de Santiago | Firmas y Documentos · Collage · Atlas · Winterbreak · VPN |
| indieweb | apps |
| Editorial Sebastián | Enciclopedia |
| Compañía Chilena de Inteligencia de Datos | datos · mapas · bici · thesis · economía · lex · congreso · elecciones · scribe · transporte |
| usaia · situación · Periodismo2 | la marca es el producto |
Vistas y niveles sin personalidad
ciudad, cables y trenes son vistas de mapas, no productos: heredan del producto y no tienen línea propia. Los sitios auxiliares (catálogo, isométrico, portal, docs, auth, status, style y compañía), los servicios internos (admin, wiki, mando, mcp y el resto) y la infraestructura (api, core, broker, mail, errors, núcleo) van al nivel 5: kit puro, sin hoja de marca.
Las reglas
Las que se citan más, con su fuente. Cada clase tiene una prueba que la decide; una clase sin prueba es una opinión.
| # | Regla | Fuente |
|---|---|---|
| 1 | Un producto nunca lleva hoja propia. Hereda la hoja de su marca. Un producto que necesita CSS propio es señal de que en realidad es una marca: se reclasifica, no se le da la hoja. | ESTRUCTURA §4 |
| 2 | Solo una marca tiene contabilidad propia. Un producto no es línea de negocio: sus ingresos y costos aportan a la de su marca. | ESTRUCTURA §2 |
| 3 | Un sitio auxiliar nunca es producto. Si empieza a tener KPIs propios, se reclasifica; no se le estira la definición. | ESTRUCTURA §2 |
| 4 | Una vista no sube a producto por crecer. Sube si le nace un público que no venía por el producto padre. | ESTRUCTURA §2 |
| 5 | Infraestructura no lleva marca ni namebrand. Su portada, si existe, es un diagnóstico. | ESTRUCTURA §2 |
| 6 | Namebrand: cuándo sí. Las marcas jóvenes de CIS (usaia, situación, indieweb, comentario) llevan el namebrand de CIS al lado. Periodismo2 no. La Compañía Chilena de Inteligencia de Datos no, porque es sociedad propia. Editorial Sebastián va acompañado por CDS. Y una sociedad nunca dice «una empresa de» sobre sí misma. | ESTRUCTURA §3 · chrome.css |
| 7 | Cada marca necesita su style.<dominio>. Hoy faltan el de Periodismo2 y el de las marcas que no lo tienen. | ESTRUCTURA §4 |
La vinculación societaria en el footer usa el patrón de línea única del chrome: «Operado por» más la legal, y «una empresa de» con el mark de CDS inline. El mark va con la clase gr-footer__attrib-mark y es el anillo canónico, nunca otro.
<div class="gr-footer__attrib">
<div class="gr-footer__attrib-inner gr-footer__attrib-inner--line">
<span class="gr-footer__attrib-name">Operado por Compañía de Innovación de Santiago SpA</span>
<span class="gr-footer__attrib-sep">·</span>
<a class="gr-footer__attrib-link" href="https://circulodesantiago.cl">una empresa de
<svg class="gr-footer__attrib-mark" width="14" height="14" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/></svg>
Círculo de Santiago</a>
</div>
</div>/srv/projects/cis/cis-style/brands/LOGOS-CANONICOS.md (extraídos del DOM en producción, 2026-06-15) y /srv/projects/CANON.md sección «Logos». Sociedades, clases, registro de marcas y productos, vistas y escalera de cinco niveles: /srv/projects/core/core-style/ESTRUCTURA.md §1 a §4 (Martín, 2026-08-09; §4 nombra v7/base como nivel 1, cuya versión vigente publicada es v9). Valores de acento: hojas reales del CDN v9/f417275.../brands/{cis,cds,cochid,usaia,situacion,indieweb,periodismo2}/tokens.css (leídas 2026-08-20; comentario y Editorial Sebastián responden 404 y figuran como hoja pendiente). Patrón de vinculación societaria: comentario normativo y clases gr-footer__attrib* en base/chrome.css del mismo digest. El mark cuadrado: /srv/projects/cis/cis-style/brands/cochid/mark-square.svg.