/* Letras Indie: colores del logo. Siempre fondo claro; acentos en rojo y negro. */
:root {
	--li-papel: #F3ECDD;
	--li-tinta: #17130F;
	--li-rojo: #E2412A;
	--li-tinta-suave: #5A524A;
	--li-linea: rgba(23, 19, 15, .18);
	--li-titular: "Anton", "Impact", "Arial Narrow", sans-serif;
}

/* ---------- Bloque "Letra traducida" ---------- */
.li-lyrics {
	margin: 2em 0;
	padding: 1.6em 1.8em;
	background: var(--li-papel);
	color: var(--li-tinta);
	border-left: 6px solid var(--li-rojo);
}
.li-lyrics__head { margin-bottom: 1.25em; }
.li-lyrics__title {
	margin: 0;
	font-family: var(--li-titular);
	font-size: 1.6em;
	line-height: 1.15;
	text-transform: uppercase;
	letter-spacing: .01em;
}
.li-lyrics__artist {
	display: inline-block;
	margin: .4em 0 0;
	padding: .15em .55em;
	background: var(--li-rojo);
	color: var(--li-papel);
	font-size: .8em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
}
.li-lyrics__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 2.5em;
	row-gap: .35em;
	line-height: 1.55;
}
.li-lyrics__label {
	font-size: .75em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--li-rojo);
	padding-bottom: .5em;
	margin-bottom: .4em;
	border-bottom: 2px solid var(--li-tinta);
}
.li-lyrics__line { margin: 0; }
.li-lyrics__line--or { color: var(--li-tinta); }
.li-lyrics__line--tr { color: var(--li-tinta-suave); font-style: italic; }
.li-lyrics__break { grid-column: 1 / -1; height: .9em; }

.li-lyrics__ref { font-size: .7em; line-height: 0; font-style: normal; }
.li-lyrics__ref a {
	color: var(--li-rojo);
	font-weight: 700;
	text-decoration: none;
	padding: 0 .15em;
}
.li-lyrics__ref a:hover, .li-lyrics__ref a:focus { text-decoration: underline; }

.li-lyrics__notes {
	margin-top: 1.8em;
	padding-top: 1em;
	border-top: 2px solid var(--li-tinta);
	font-size: .92em;
}
.li-lyrics__notes-title {
	margin: 0 0 .6em;
	font-family: var(--li-titular);
	font-size: 1.15em;
	text-transform: uppercase;
	color: var(--li-rojo);
}
.li-lyrics__notes ol { margin: 0; padding-left: 1.6em; }
.li-lyrics__notes li { margin-bottom: .6em; }
.li-lyrics__notes li::marker { color: var(--li-rojo); font-weight: 700; }
.li-lyrics__notes li:target { background: rgba(226, 65, 42, .12); }
.li-lyrics__frag { color: var(--li-tinta); }
.li-lyrics__frag::after { content: " —"; }
.li-lyrics__back { color: var(--li-rojo); text-decoration: none; margin-left: .3em; }

@media (max-width: 767px) {
	.li-lyrics { padding: 1.1em; border-left-width: 4px; }
	.li-lyrics__grid { grid-template-columns: 1fr; row-gap: 0; }
	.li-lyrics__label { display: none; }
	.li-lyrics__line--tr { margin-bottom: .55em; font-size: .95em; }
	.li-lyrics__break { height: .6em; }
}

/* ---------- Fichas de artista, álbum y canción ---------- */
.li-ficha { margin: 1em 0 1.5em; color: var(--li-tinta); }
.li-ficha a { color: var(--li-tinta); text-decoration-color: var(--li-rojo); text-underline-offset: .15em; }
.li-ficha a:hover { color: var(--li-rojo); }
.li-ficha__subtitle { margin: 0 0 .3em; font-style: italic; font-size: 1.15em; color: var(--li-tinta-suave); }
.li-ficha__meta { margin: 0 0 .8em; font-size: .95em; }
.li-ficha__h {
	font-family: var(--li-titular);
	text-transform: uppercase;
	font-size: 1.4em;
	margin: 1.4em 0 .5em;
	border-bottom: 3px solid var(--li-rojo);
	display: inline-block;
}
.li-ficha__links { display: flex; flex-wrap: wrap; gap: .5em; margin: 0; }
.li-btn {
	display: inline-block;
	padding: .45em .9em;
	font-size: .85em;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	text-decoration: none !important;
	border: 2px solid var(--li-tinta);
	color: var(--li-tinta) !important;
	background: transparent;
}
.li-btn--spotify { background: var(--li-tinta); color: var(--li-papel) !important; }
.li-btn:hover { background: var(--li-rojo); border-color: var(--li-rojo); color: var(--li-papel) !important; }

.li-tracklist li, .li-miembros li { margin-bottom: .3em; }
.li-tracklist li::marker { color: var(--li-rojo); font-weight: 700; }
.li-albumes { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 1em; }
.li-albumes img { display: block; width: 100%; height: auto; margin-bottom: .4em; border: 2px solid var(--li-tinta); }
.li-albumes span, .li-miembros span { color: var(--li-tinta-suave); }
.li-galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .6em; margin-top: 1em; }
.li-galeria img { width: 100%; height: auto; display: block; }
.li-credito { font-size: .8em; color: var(--li-tinta-suave); }
