/* Sección Juegos: estantería, semáforo, calendario, noticias y página de cada juego. Usa los tokens del tema. */

.mv-est,
.mv-lz,
.mv-jportada {
	--ink: var(--mv-ink, #121214);
	--paper: var(--mv-paper, #ffffff);
	--paper-2: var(--mv-paper-2, #f2f2ef);
	--hair: var(--mv-hair, #d6d6d9);
	--ink-2: var(--mv-ink-2, #4b4b52);
	--print: var(--mv-print-ink, #121214);
	--display: var(--mv-display, "Arial Narrow", sans-serif);
	--sec: var(--mv-violet, #662483);
	color: var(--ink);
}

.mv-est *,
.mv-lz *,
.mv-jportada * {
	box-sizing: border-box;
}

.mv-est,
.mv-jportada {
	grid-column: 1 / -1;
}

.mv-est,
.mv-lz {
	margin: 0 0 clamp(44px, 6vw, 72px);
}

/* Tintas de los lomos */
.mv-lomo--nintendo { --lomo: var(--mv-red, #e30613);    --lomo-ink: #ffffff;      --banda: #ffffff;      --banda-ink: var(--mv-red, #e30613); }
.mv-lomo--pc       { --lomo: var(--mv-cyan, #00a0e3);   --lomo-ink: var(--print); --banda: var(--print); --banda-ink: var(--mv-cyan, #00a0e3); }
.mv-lomo--retro    { --lomo: var(--mv-yellow, #ffe500); --lomo-ink: var(--print); --banda: var(--print); --banda-ink: var(--mv-yellow, #ffe500); }
.mv-lomo--varias   { --lomo: #121214;                   --lomo-ink: #ffffff;      --banda: var(--mv-yellow, #ffe500); --banda-ink: var(--print); }

.mv-est__kicker {
	display: inline-block;
	margin: 0 0 0.5em;
	padding: 0.18em 1em 0.12em;
	background: var(--sec);
	color: #ffffff;
	clip-path: polygon(0.45em 0, 100% 0, calc(100% - 0.45em) 100%, 0 100%);
	font-family: var(--display);
	font-weight: 800;
	font-style: italic;
	font-size: 0.95rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.mv-est__title {
	margin: 0 0 0.25em;
	font-family: var(--display, var(--mv-display));
	font-weight: 900;
	font-size: clamp(2rem, 1.4rem + 2vw, 3rem);
	line-height: 1;
	text-transform: uppercase;
}

h1.mv-est__title {
	font-style: italic;
	font-size: clamp(2.6rem, 1.6rem + 4vw, 4.6rem);
	line-height: 0.92;
}

.mv-est__articulos {
	grid-column: 1 / -1;
	margin: 0;
	padding-top: 0.35em;
	border-top: 4px solid var(--mv-ink, #121214);
}

.mv-est__hint {
	margin: 0;
	max-width: 46rem;
	font-size: 1.02rem;
	color: var(--ink-2);
}

.mv-est__yo {
	padding: 0;
	border: 0;
	background: none;
	color: var(--ink);
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: var(--mv-spot, #d4006f);
	text-decoration-thickness: 0.12em;
	cursor: pointer;
}

.mv-est__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px 24px;
}

.mv-est__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.mv-est__chip {
	min-height: 40px;
	padding: 0.35em 0.9em 0.3em;
	border: 2px solid var(--ink);
	background: var(--paper);
	color: var(--ink);
	font-family: var(--display);
	font-weight: 700;
	font-size: 1rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	cursor: pointer;
}

.mv-est__chip[aria-pressed="true"] {
	background: var(--ink);
	color: var(--paper);
}

.mv-est__chip[hidden],
.mv-lz [hidden],
.mv-est [hidden] {
	display: none !important;
}

/* ---------- La estantería: varias baldas, la ficha fija al lado en pantallas anchas ---------- */
.mv-est__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
	align-items: start;
	gap: 32px;
	margin-top: 24px;
}

.mv-est__balda {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	row-gap: 34px;
	margin: 0;
	padding: 24px 12px 0;
	list-style: none;
	background-color: var(--paper-2);
}

/* Cada lomo trae su trozo de tablón: juntos forman la balda de cada fila */
.mv-est__balda li {
	display: flex;
	align-items: flex-end;
	padding: 0 3px;
	border-bottom: 12px solid var(--mv-ink, #121214);
}

.mv-lomo {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 54px;
	height: var(--alto, 230px);
	padding-bottom: 10px;
	border: 2.5px solid var(--print);
	border-bottom: 0;
	background: var(--lomo);
	color: var(--lomo-ink);
	text-decoration: none;
	transition: transform 0.15s ease, opacity 0.15s ease;
}

.mv-lomo--largo {
	width: 62px;
}

.mv-lomo:hover,
.mv-lomo:focus-visible {
	color: var(--lomo-ink);
	transform: translateY(-8px);
}

.mv-lomo.is-fuera {
	transform: translateY(-14px);
	outline: 4px solid var(--mv-spot, #d4006f);
	outline-offset: 2px;
}

.mv-lomo__banda {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 28px;
	border-bottom: 2.5px solid var(--print);
	background: var(--banda);
	color: var(--banda-ink);
	font-family: var(--display);
	font-weight: 900;
	font-size: 0.72rem;
	letter-spacing: 0.03em;
	white-space: nowrap;
}

.mv-lomo__titulo {
	margin-top: 10px;
	max-height: calc(var(--alto, 230px) - 50px);
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	font-family: var(--display);
	font-weight: 900;
	font-style: italic;
	font-size: 1.18rem;
	line-height: 1.05;
	text-transform: uppercase;
	text-align: center;
	overflow-wrap: anywhere;
}

/* Lo que no está en la consola del lector, apagado */
html[data-consola="switch2"] .mv-lomo[data-no~="switch2"],
html[data-consola="switch"] .mv-lomo[data-no~="switch"],
html[data-consola="deck"] .mv-lomo[data-no~="deck"],
html[data-consola="ally"] .mv-lomo[data-no~="pcwin"],
html[data-consola="legion"] .mv-lomo[data-no~="pcwin"],
html[data-consola="retro"] .mv-lomo[data-no~="retro"] {
	opacity: 0.3;
}

.mv-est__balda li:has(.mv-lomo.is-filtrado) {
	display: none;
}

.mv-est__leyenda {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 12px 0 0;
	font-family: var(--display);
	font-weight: 700;
	font-size: 0.92rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ink-2);
}

.mv-est__leyenda i {
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-right: 6px;
	vertical-align: -1px;
	background: var(--lomo);
	border: 2px solid var(--print);
}

.mv-est__fichas {
	position: sticky;
	top: calc(var(--mv-cabecera, 67px) + var(--mv-subbarra-h, 0px) + 20px + var(--wp-admin--admin-bar--height, 0px));
	min-width: 0;
}

/* ---------- Ficha de juego ---------- */
.mv-juego {
	border: 3px solid var(--ink);
	background: var(--paper);
	box-shadow: 8px 8px 0 var(--sec);
}

.mv-juego[hidden] {
	display: none;
}

/* Sin JavaScript, el enlace del lomo enseña su ficha */
.mv-est:not(.is-js) .mv-juego[hidden]:target {
	display: block;
}

.mv-juego__head {
	padding: 14px 18px;
	background: var(--lomo);
	color: var(--lomo-ink);
	border-bottom: 3px solid var(--ink);
}

.mv-juego__tipo {
	margin: 0;
	font-family: var(--display);
	font-weight: 800;
	font-style: italic;
	font-size: 0.95rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.mv-juego__nombre {
	margin: 2px 0 0;
	color: inherit;
	font-family: var(--display);
	font-weight: 900;
	font-style: italic;
	font-size: clamp(1.7rem, 1.3rem + 1.2vw, 2.2rem);
	line-height: 0.95;
	text-transform: uppercase;
	letter-spacing: 0;
}

.mv-juego__datos {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 6px 16px;
	margin: 0;
	padding: 14px 18px 4px;
	font-size: 1rem;
}

.mv-juego__datos dt {
	font-family: var(--display);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ink-2);
}

.mv-juego__datos dd {
	margin: 0;
	font-weight: 600;
}

.mv-juego__semaforo {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin: 0;
	padding: 12px 18px 16px;
	list-style: none;
}

.mv-juego__semaforo li {
	padding: 7px 10px;
	border: 2px solid var(--ink);
}

.mv-juego__consola {
	display: block;
	margin-bottom: 3px;
	font-family: var(--display);
	font-weight: 700;
	font-size: 0.82rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--ink-2);
}

.mv-juego__acciones {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0;
	padding: 0 18px 16px;
}

.mv-juego__btn,
.mv-juego__aff {
	display: inline-block;
	padding: 0.5em 1em 0.4em;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--display);
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: 4px 4px 0 var(--mv-spot, #d4006f);
}

.mv-juego__btn--claro {
	background: var(--paper);
	color: var(--ink);
	border: 2px solid var(--ink);
	box-shadow: none;
}

.mv-juego__btn:hover,
.mv-juego__aff:hover {
	color: var(--paper);
}

.mv-juego__btn--claro:hover {
	color: var(--print);
	background: var(--mv-yellow, #ffe500);
}

.mv-juego__fuentes {
	padding: 0 18px 14px;
	font-size: 0.85rem;
	color: var(--ink-2);
}

.mv-juego__fuentes summary {
	cursor: pointer;
	font-family: var(--display);
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.mv-juego__fuentes p {
	margin: 0.5em 0 0;
	line-height: 1.45;
}

/* ---------- Luces del semáforo: forma y color ---------- */
.mv-led {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-family: var(--display);
	font-weight: 700;
	font-size: 0.95rem;
	line-height: 1.15;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.mv-led i {
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	border: 2px solid var(--print);
	border-radius: 50%;
	background: var(--paper);
}

.mv-led--g i { background: var(--mv-green, #00a651); }
.mv-led--j i { background: linear-gradient(90deg, var(--mv-orange, #f39200) 50%, #ffffff 50%); }
.mv-led--d i { border-style: dashed; background: none; }
.mv-led--n { color: var(--ink-2); }
.mv-led--n i { border-radius: 2px; background: none; }

/* La columna de la consola del lector, resaltada */
html[data-consola="switch2"] [data-col="switch2"],
html[data-consola="switch"] [data-col="switch"],
html[data-consola="deck"] [data-col="deck"],
html[data-consola="ally"] [data-col="pcwin"],
html[data-consola="legion"] [data-col="pcwin"],
html[data-consola="retro"] [data-col="retro"] {
	background: color-mix(in oklab, var(--mv-yellow, #ffe500) 38%, var(--paper));
}

html[data-consola="switch2"] th[data-col="switch2"],
html[data-consola="switch"] th[data-col="switch"],
html[data-consola="deck"] th[data-col="deck"],
html[data-consola="ally"] th[data-col="pcwin"],
html[data-consola="legion"] th[data-col="pcwin"],
html[data-consola="retro"] th[data-col="retro"] {
	background: var(--mv-yellow, #ffe500);
	color: var(--print);
}

/* ---------- Calendario de lanzamientos ---------- */
.mv-lz__kicker {
	background: var(--mv-cyan, #00a0e3);
	color: var(--print);
}

.mv-lz__chips {
	margin: 18px 0 8px;
}

.mv-lz__mes {
	margin-top: 28px;
}

.mv-lz__mes-titulo {
	margin: 0 0 10px;
	padding: 0.2em 0 0.1em;
	border-bottom: 4px solid var(--ink);
	font-family: var(--display);
	font-weight: 900;
	font-style: italic;
	font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem);
	text-transform: uppercase;
}

.mv-lz__mes--recien .mv-lz__mes-titulo {
	color: var(--ink-2);
	border-bottom-color: var(--hair);
}

.mv-lz__lista,
.mv-lz__tira {
	margin: 0;
	padding: 0;
	list-style: none;
}

.mv-lz__item {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 2px solid var(--hair);
}

.mv-lz__dia {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 64px;
	padding: 6px 0 4px;
	border: 2.5px solid var(--ink);
	background: var(--paper);
	text-align: center;
	line-height: 1;
}

.mv-lz__dia b {
	font-family: var(--display);
	font-weight: 900;
	font-size: 1.9rem;
}

.mv-lz__dia span {
	margin-top: 3px;
	font-family: var(--display);
	font-weight: 700;
	font-size: 0.8rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ink-2);
}

.mv-lz__dia--sin b {
	color: var(--ink-2);
}

.mv-lz__info {
	min-width: 0;
}

.mv-lz__nombre {
	margin: 0;
	font-weight: 700;
	font-size: 1.1rem;
	line-height: 1.25;
}

.mv-lz__nombre a {
	text-decoration-thickness: 0.08em;
}

.mv-lz__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	margin: 5px 0 0;
	font-size: 0.88rem;
	color: var(--ink-2);
}

.mv-lz__plat {
	padding: 0.15em 0.55em 0.08em;
	background: var(--plat);
	color: var(--plat-ink);
	border: 2px solid var(--print);
	font-family: var(--display);
	font-weight: 800;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

/* Switch (la primera): mismo rojo, pero en hueco, para no confundirla con Switch 2 */
.mv-lz__plat--switch {
	background: var(--paper);
	color: var(--mv-red, #e30613);
	border-color: var(--mv-red, #e30613);
}

.mv-lz__fuente {
	color: var(--ink-2);
}

.mv-lz__tuya {
	display: none;
	margin-left: 0.6em;
	padding: 0.05em 0.45em;
	background: var(--mv-yellow, #ffe500);
	color: var(--print);
	font-family: var(--display);
	font-weight: 800;
	font-size: 0.8rem;
	text-transform: uppercase;
	vertical-align: 0.15em;
}

html[data-consola="switch2"] .mv-lz__item[data-plat~="switch2"] .mv-lz__tuya,
html[data-consola="switch"] .mv-lz__item[data-plat~="switch"] .mv-lz__tuya,
html[data-consola="deck"] .mv-lz__item[data-plat~="pc"] .mv-lz__tuya,
html[data-consola="ally"] .mv-lz__item[data-plat~="pc"] .mv-lz__tuya,
html[data-consola="legion"] .mv-lz__item[data-plat~="pc"] .mv-lz__tuya {
	display: inline-block;
}

.mv-lz__item.is-filtrado {
	display: none;
}

.mv-lz__todo {
	margin: 14px 0 0;
	font-family: var(--display);
	font-weight: 800;
	font-size: 1.1rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

.mv-lz__todo a {
	text-decoration: none;
	border-bottom: 3px solid var(--mv-spot, #d4006f);
}

.mv-lz__vacio {
	margin-top: 20px;
	color: var(--ink-2);
}

/* Versión corta: los siguientes, en columnas */
.mv-lz--corto .mv-lz__tira {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr));
	gap: 0;
	margin-top: 14px;
	border: 3px solid var(--ink);
}

.mv-lz--corto .mv-lz__item {
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 14px;
	border-bottom: 0;
	border-right: 2px solid var(--hair);
}

/* ---------- Portada de Juegos ---------- */
.mv-jportada {
	display: grid;
	gap: clamp(40px, 5vw, 64px);
	margin-bottom: clamp(44px, 6vw, 72px);
}

.mv-noti__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: clamp(20px, 3vw, 40px);
	margin-top: 14px;
}

.mv-noti__foto img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border: 3px solid var(--ink);
	box-shadow: 6px 6px 0 var(--sec);
	margin-bottom: 12px;
}

.mv-noti__fecha {
	margin: 0 0 4px;
	font-family: var(--display);
	font-weight: 700;
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sec);
}

.mv-noti__titulo {
	margin: 0 0 8px;
	font-family: var(--display);
	font-weight: 900;
	font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.8rem);
	line-height: 0.95;
	text-transform: uppercase;
}

.mv-noti__titulo a {
	color: var(--ink);
	text-decoration: none;
}

.mv-noti__titulo a:hover {
	color: var(--sec);
}

.mv-noti__dek {
	margin: 0 0 10px;
	font-weight: 600;
	color: var(--ink-2);
}

.mv-noti__lista {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 4px solid var(--ink);
}

.mv-noti__lista li {
	padding: 12px 0;
	border-bottom: 2px solid var(--hair);
}

.mv-noti__item {
	font-weight: 700;
	font-size: 1.08rem;
	line-height: 1.3;
	text-decoration: none;
}

.mv-noti__item:hover {
	color: var(--sec);
}

.mv-jband {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 20px;
	padding: 18px 22px;
	background: var(--sec);
	color: #ffffff;
	text-decoration: none;
	box-shadow: 8px 8px 0 var(--mv-ink, #121214);
}

.mv-jband:hover {
	color: #ffffff;
}

.mv-jband__label {
	font-family: var(--display);
	font-weight: 900;
	font-style: italic;
	font-size: 1.6rem;
	text-transform: uppercase;
	color: var(--mv-yellow, #ffe500);
}

.mv-jband__text {
	flex: 1 1 18rem;
	font-weight: 600;
}

.mv-jband__arrow {
	font-size: 1.8rem;
	font-weight: 900;
}

@media (max-width: 900px) {
	.mv-est__body,
	.mv-noti__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.mv-est__fichas {
		position: static;
	}
}

@media (max-width: 600px) {
	.mv-est__balda {
		padding: 18px 6px 0;
		row-gap: 26px;
	}

	.mv-est__balda li {
		padding: 0 2px;
	}

	.mv-lomo {
		width: 46px;
		height: calc(var(--alto, 230px) - 30px);
	}

	.mv-lomo--largo {
		width: 54px;
	}

	.mv-lomo__titulo {
		font-size: 1.02rem;
		max-height: calc(var(--alto, 230px) - 78px);
	}

	.mv-lz__dia {
		width: 54px;
	}
}

/* ---------- Portadas: en la ficha y como vista de la estantería ---------- */
.mv-juego__head--portada {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	align-items: end;
	gap: 14px;
}

.mv-juego__portada {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	border: 2.5px solid var(--print);
	background: var(--paper-2);
}

.mv-juego__credito {
	margin: 6px 0 0;
	font-size: 0.72rem;
	line-height: 1.3;
	opacity: 0.85;
}

/* Vista de portadas: las carátulas de pie en la balda */
.mv-est.is-portadas .mv-est__balda li {
	padding: 0 5px;
}

.mv-est.is-portadas .mv-lomo {
	width: 112px;
	height: 168px;
	padding: 0;
	border-bottom: 2.5px solid var(--print);
	overflow: hidden;
}

.mv-est.is-portadas .mv-lomo.tiene-portada .mv-lomo__banda,
.mv-est.is-portadas .mv-lomo.tiene-portada .mv-lomo__titulo {
	display: none;
}

.mv-est.is-portadas .mv-lomo__portada {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Sin portada: la tapa de color con el título en horizontal */
.mv-est.is-portadas .mv-lomo:not(.tiene-portada) {
	justify-content: flex-start;
}

.mv-est.is-portadas .mv-lomo:not(.tiene-portada) .mv-lomo__titulo {
	max-height: none;
	margin: 0;
	padding: 10px 8px;
	writing-mode: horizontal-tb;
	transform: none;
	text-align: left;
	font-size: 1.05rem;
	overflow-wrap: normal;
	hyphens: auto;
}

.mv-est.is-portadas .mv-lomo.is-fuera {
	outline-offset: 3px;
}

@media (max-width: 600px) {
	.mv-est.is-portadas .mv-est__balda li {
		padding: 0 3px;
	}

	.mv-est.is-portadas .mv-lomo {
		width: 82px;
		height: 123px;
	}

	.mv-est.is-portadas .mv-lomo:not(.tiene-portada) .mv-lomo__titulo {
		font-size: 0.9rem;
	}
}