@charset "UTF-8";
/* ==========================================================================
   CriticaBits — el índice de análisis
   --------------------------------------------------------------------------
   Una lista larga que hay que poder recorrer con la vista, no leer. Por eso
   la fecha y la nota van en una columna fija a la derecha: el ojo baja por esa
   vertical sin tropezar con titulares de longitudes distintas.

   Todas las medidas salen de las fichas de `criticabits-ui.css`.
   ========================================================================== */

.cb-archivo {
	--cb-arch-fila: 1px solid var(--cb-hairline, rgba(255, 255, 255, .09));
}

/* --- Cabecera con las secciones ------------------------------------------- */

.cb-archivo__nav {
	margin-bottom: clamp(2rem, 4vw, 3rem);
	padding-bottom: 1.5rem;
	border-bottom: var(--cb-arch-fila);
}

.cb-archivo__resumen {
	margin: 0 0 1.1rem;
	font-size: .9375rem;
	color: rgba(255, 255, 255, .62);
}

.cb-archivo__chapas {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cb-archivo__chapas li {
	margin: 0;
	padding: 0;
}

.cb-archivo__chapas li::before {
	content: none;
}

/* Cinco clases para ganar al subrayado de los enlaces del artículo sin
   recurrir a !important. */
.cb-article .entry-content .cb-archivo .cb-archivo__chapas a.cb-archivo__chapa {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	min-height: var(--cb-btn-alto-s, 2.125rem);
	padding: .35rem .75rem;
	border: 1px solid var(--cb-hairline-strong, rgba(255, 255, 255, .16));
	border-radius: var(--cb-radio-pastilla, 999px);
	font-size: .8125rem;
	color: rgba(255, 255, 255, .84);
	text-decoration: none;
	transition:
		border-color var(--cb-fast, 140ms) var(--cb-ease, ease),
		background-color var(--cb-fast, 140ms) var(--cb-ease, ease),
		color var(--cb-fast, 140ms) var(--cb-ease, ease);
}

.cb-article .entry-content .cb-archivo .cb-archivo__chapas a.cb-archivo__chapa:hover,
.cb-article .entry-content .cb-archivo .cb-archivo__chapas a.cb-archivo__chapa:focus-visible {
	border-color: var(--cb-neon-cyan, #00d4ff);
	background-color: rgba(0, 212, 255, .1);
	color: #fff;
}

.cb-archivo__cuenta {
	font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
	font-size: .72rem;
	color: rgba(255, 255, 255, .5);
}

/* --- Secciones ------------------------------------------------------------ */

.cb-archivo__seccion {
	margin-bottom: clamp(2.5rem, 5vw, 3.5rem);
	/* Al llegar desde una chapa, el titular no queda bajo la cabecera fija. */
	scroll-margin-top: 5.5rem;
}

.cb-article .entry-content .cb-archivo .cb-archivo__titular {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: .9rem;
	margin: 0 0 1rem;
	padding: 0;
	font-size: clamp(1.25rem, 1.1rem + .6vw, 1.5rem);
	line-height: 1.2;
}

/* Sin el filete ni la numeración de los apartados de las páginas: aquí las
   secciones son datos, no capítulos de un texto. */
.cb-article .entry-content .cb-archivo .cb-archivo__titular::before,
.cb-article .entry-content .cb-archivo .cb-archivo__titular::after {
	content: none;
}

.cb-article .entry-content .cb-archivo a.cb-archivo__todo {
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--cb-enlace, #7fd4ff);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, currentColor 35%, transparent);
}

.cb-archivo__desc {
	margin: 0 0 1rem;
	font-size: .875rem;
	color: rgba(255, 255, 255, .5);
}

/* --- Filas ---------------------------------------------------------------- */

.cb-article .entry-content .cb-archivo .cb-archivo__lista {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cb-article .entry-content .cb-archivo .cb-archivo__fila {
	margin: 0;
	padding: 0;
	border-top: var(--cb-arch-fila);
}

.cb-article .entry-content .cb-archivo .cb-archivo__fila::before {
	content: none;
}

.cb-article .entry-content .cb-archivo a.cb-archivo__enlace {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: baseline;
	gap: .3rem 1.25rem;
	padding: .8rem .6rem;
	border-radius: var(--cb-radio-s, 8px);
	color: rgba(255, 255, 255, .88);
	text-decoration: none;
	transition:
		background-color var(--cb-fast, 140ms) var(--cb-ease, ease),
		color var(--cb-fast, 140ms) var(--cb-ease, ease);
}

.cb-article .entry-content .cb-archivo a.cb-archivo__enlace:hover,
.cb-article .entry-content .cb-archivo a.cb-archivo__enlace:focus-visible {
	background-color: rgba(255, 255, 255, .05);
	color: #fff;
}

.cb-archivo__titulo {
	font-size: .9375rem;
	line-height: 1.45;
	text-wrap: pretty;
}

.cb-archivo__meta {
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: .8rem;
	white-space: nowrap;
	font-family: ui-monospace, "SFMono-Regular", Consolas, monospace;
	font-size: .72rem;
	color: rgba(255, 255, 255, .45);
}

/* La nota, cuando la hay. Es la columna por la que se recorre la lista. */
.cb-archivo__nota {
	min-width: 3.2rem;
	text-align: right;
	font-weight: 700;
	font-size: .82rem;
	color: var(--cb-neon-amber, #ffb14f);
	font-variant-numeric: tabular-nums;
}

.cb-archivo__sobre {
	font-size: .78em;
	color: rgba(255, 255, 255, .38);
}

@media (max-width: 560px) {

	/* En estrecho, el titular se lleva la fila entera y la ficha cae debajo:
	   con dos columnas, a 330 px al titular le quedaban 180 px. */
	.cb-article .entry-content .cb-archivo a.cb-archivo__enlace {
		grid-template-columns: 1fr;
	}

	.cb-archivo__meta {
		justify-content: flex-start;
	}
}