/* =====================================================================
   PREDICCIONES OFICIALES
   ===================================================================== */

.mbp {
	--mbp-tinta: #353535;
	--mbp-suave: #6a6a6a;
	--mbp-acento: #A03843;
	--mbp-linea: rgba(53, 53, 53, 0.12);
	box-sizing: border-box;

	/* El mismo ancho que la clasificacion y el resto de bloques */
	width: var(--mbw-ancho-bloque, min(1900px, calc(100vw - 2rem)));
	margin-left: 50%;
	transform: translateX(-50%);
	padding: clamp(1.5rem, 3vw, 2.5rem) 0 clamp(3rem, 6vw, 5rem);
	font-family: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
	color: var(--mbp-tinta);
}

.mbp *,
.mbp *::before,
.mbp *::after { box-sizing: border-box; }

/* Lo oculto se oculta de verdad (el display de cada bloque no lo pisa) */
.mbp [hidden] { display: none !important; }

/* --- Cabecera ------------------------------------------------------- */

.mbp__cabecera {
	margin-bottom: 1.6rem;
	padding: clamp(1.3rem, 3vw, 2.2rem);
	border-radius: 18px;
	background: linear-gradient(135deg, #353535, #4a2a2f 55%, #A03843);
	color: #fff;
}

.mbp .mbp__antetitulo {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 0.5rem;
	color: rgba(255, 255, 255, 0.78);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.mbp__punto { width: 8px; height: 8px; border-radius: 50%; background: #ff6b7a; }

.mbp .mbp__titulo {
	margin: 0 0 0.4rem;
	color: #fff;
	font-family: "Anton", "Poppins", sans-serif;
	font-size: clamp(1.8rem, 5vw, 3rem);
	font-weight: 400;
	letter-spacing: 0.01em;
	line-height: 1.05;
	text-transform: uppercase;
}

.mbp .mbp__bajada {
	margin: 0;
	max-width: 62ch;
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.9rem;
	line-height: 1.5;
}

/* --- Pasos ---------------------------------------------------------- */

.mbp__pasos { display: grid; gap: 1.2rem; }

.mbp__trampa { display: none !important; }

.mbp fieldset.mbp__paso {
	margin: 0;
	padding: clamp(1rem, 2.5vw, 1.6rem);
	border: 1px solid var(--mbp-linea);
	border-radius: 16px;
	background: #fff;
	min-width: 0;
	transition: opacity 0.3s ease;
}

.mbp fieldset.mbp__paso[disabled] { opacity: 0.45; }

.mbp fieldset.mbp__paso.is-hecho { border-color: rgba(26, 127, 55, 0.35); }

.mbp .mbp__paso-titulo {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0;
	font-size: 1.05rem;
	font-weight: 800;
}

.mbp .mbp__paso-titulo i {
	display: grid;
	place-items: center;
	width: 1.8rem;
	height: 1.8rem;
	border-radius: 50%;
	background: var(--mbp-acento);
	color: #fff;
	font-size: 0.85rem;
	font-style: normal;
}

.mbp fieldset.is-hecho .mbp__paso-titulo i { background: #1a7f37; }

.mbp .mbp__ayuda { margin: 0.4rem 0 1rem; color: var(--mbp-suave); font-size: 0.85rem; line-height: 1.5; }

.mbp .mbp__error { margin: 0.8rem 0 0; color: #b42318; font-size: 0.85rem; font-weight: 600; }

.mbp .mbp__aviso {
	padding: 1rem 1.2rem;
	border-radius: 12px;
	background: rgba(53, 53, 53, 0.05);
	color: var(--mbp-suave);
}

/* Las dos formas de participar: OG o invitado */
.mbp__modos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
	gap: 1rem;
	margin-top: 0.8rem;
}

.mbp__modo {
	padding: 1rem 1.1rem 1.1rem;
	border: 1px solid var(--mbp-linea);
	border-radius: 14px;
	background: rgba(53, 53, 53, 0.02);
	transition: opacity 0.25s ease, border-color 0.25s ease;
}

.mbp__modo--invitado { background: rgba(29, 66, 138, 0.04); }

.mbp__modo.is-elegido { border-color: var(--mbp-acento); background: rgba(160, 56, 67, 0.05); }

.mbp__modo.is-apagado { opacity: 0.4; }

.mbp .mbp__modo-titulo {
	margin: 0 0 0.2rem;
	font-family: "Anton", "Poppins", sans-serif;
	font-size: 1.25rem;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.mbp .mbp__modo .mbp__ayuda { margin-bottom: 0.8rem; }

.mbp button.mbp__boton.mbp__boton--claro { background: #1d428a; }

.mbp button.mbp__boton.mbp__boton--claro:hover { background: #163367; }

.mbp .mbp__corredor-fanaticada {
	display: grid;
	place-items: center;
	width: 2.6rem;
	height: 2.6rem;
	border-radius: 50%;
	background: linear-gradient(135deg, #1d428a, #A03843);
	color: #fff;
	font-size: 0.72rem;
	font-weight: 800;
}

/* Contrasena */
.mbp__fila-clave { display: flex; flex-wrap: wrap; gap: 0.6rem; max-width: 30rem; }

.mbp input.mbp__campo {
	flex: 1 1 12rem;
	padding: 0.7rem 0.9rem;
	border: 1px solid var(--mbp-linea);
	border-radius: 10px;
	font: inherit;
	/* 16 px justos: con menos, el movil se acerca al escribir y descuadra la vista */
	font-size: 16px;
}

.mbp input.mbp__campo:focus { outline: 2px solid var(--mbp-acento); outline-offset: 1px; }

.mbp button.mbp__boton {
	padding: 0.7rem 1.4rem;
	border: 0;
	border-radius: 999px;
	background: var(--mbp-acento);
	color: #fff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.15s ease;
}

.mbp button.mbp__boton:hover { background: #8a2f39; }

.mbp button.mbp__boton:active { transform: scale(0.97); }

.mbp button.mbp__boton[disabled] { opacity: 0.6; cursor: default; }

.mbp button.mbp__boton--grande { padding: 0.9rem 2rem; font-size: 1rem; }

/* --- Caras ---------------------------------------------------------- */

.mbp__caras {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));
	gap: 0.8rem;
}

.mbp label.mbp__cara {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
	padding: 0.5rem 0.3rem 0.6rem;
	border: 2px solid transparent;
	border-radius: 14px;
	cursor: pointer;
	text-align: center;
	transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease;
}

.mbp label.mbp__cara:hover { background: rgba(160, 56, 67, 0.05); }

.mbp label.mbp__cara input { position: absolute; opacity: 0; pointer-events: none; }

.mbp__cara-foto {
	display: block;
	width: 4.6rem;
	height: 4.6rem;
	overflow: hidden;
	border-radius: 50%;
	background: #eee;
}

.mbp .mbp__cara-foto img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }

.mbp__cara-nombre { font-size: 0.74rem; font-weight: 700; line-height: 1.2; }

.mbp__cara-ocupada { display: none; color: var(--mbp-suave); font-size: 0.66rem; font-weight: 600; }

.mbp label.mbp__cara.is-elegida {
	border-color: var(--mbp-acento);
	background: rgba(160, 56, 67, 0.07);
	transform: translateY(-2px);
}

.mbp label.mbp__cara :focus-visible ~ .mbp__cara-foto { outline: 3px solid var(--mbp-acento); outline-offset: 2px; }

/* Wild Card: para quien no sale en las caras */
.mbp .mbp__cara-foto--comodin {
	display: grid;
	place-items: center;
	border: 2px dashed rgba(160, 56, 67, 0.5);
	background: rgba(160, 56, 67, 0.06);
	color: var(--mbp-acento);
	font-family: "Anton", "Poppins", sans-serif;
	font-size: 2rem;
}

.mbp__cara-pista { color: var(--mbp-suave); font-size: 0.66rem; }

.mbp__comodin { max-width: 30rem; margin-top: 1rem; }

.mbp__comodin input.mbp__campo { width: 100%; }

.mbp .mbp__corredor-comodin {
	display: grid;
	place-items: center;
	width: 2.6rem;
	height: 2.6rem;
	border-radius: 50%;
	background: rgba(160, 56, 67, 0.1);
	color: var(--mbp-acento);
	font-weight: 800;
}

/* Ocupada: tachada y gris */
.mbp label.mbp__cara.es-ocupada { cursor: not-allowed; }

.mbp label.mbp__cara.es-ocupada .mbp__cara-foto { filter: grayscale(1); opacity: 0.45; }

.mbp label.mbp__cara.es-ocupada .mbp__cara-nombre { color: var(--mbp-suave); text-decoration: line-through; }

.mbp label.mbp__cara.es-ocupada .mbp__cara-ocupada { display: block; }

.mbp label.mbp__cara.es-ocupada::after {
	content: "";
	position: absolute;
	top: 2.8rem;
	left: 50%;
	width: 5.2rem;
	height: 3px;
	border-radius: 3px;
	background: var(--mbp-acento);
	transform: translateX(-50%) rotate(-35deg);
}

/* --- Listas para ordenar -------------------------------------------- */

.mbp__conferencias {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.4rem;
}

.mbp .mbp__conferencia-titulo {
	margin: 0 0 0.6rem;
	font-family: "Anton", "Poppins", sans-serif;
	font-size: 1.3rem;
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.mbp .mbp__conferencia-titulo--oeste { color: #A03843; }
.mbp .mbp__conferencia-titulo--este  { color: #1d428a; }

.mbp ol.mbp__lista { display: grid; gap: 0.35rem; margin: 0; padding: 0; list-style: none; }

.mbp li.mbp__equipo {
	display: grid;
	grid-template-columns: 1.6rem 2.2rem minmax(0, 1fr) auto;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.45rem 0.5rem;
	border: 1px solid var(--mbp-linea);
	border-left: 4px solid var(--mbp-equipo, var(--mbp-acento));
	border-radius: 10px;
	background: #fff;
	cursor: grab;
	user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	transition: box-shadow 0.2s ease, background 0.2s ease, transform 0.15s ease;
}

.mbp li.mbp__equipo:hover { border-color: rgba(160, 56, 67, 0.35); }

/* Mientras se ordena, el que se arrastra se levanta y el resto se aparta */
.mbp ol.mbp__lista.is-ordenando { cursor: grabbing; }

.mbp ol.mbp__lista.is-ordenando li.mbp__equipo:not(.is-arrastrando) { opacity: 0.85; }

.mbp li.mbp__equipo.is-arrastrando { transform: scale(1.02); cursor: grabbing; }

.mbp li.mbp__equipo.is-arrastrando {
	background: #fff8f8;
	box-shadow: 0 14px 28px -16px rgba(0, 0, 0, 0.55);
	position: relative;
	z-index: 2;
}

.mbp li.mbp__equipo.is-movido { animation: mbp-movido 0.4s ease; }

@keyframes mbp-movido { from { background: rgba(160, 56, 67, 0.12); } to { background: #fff; } }

.mbp__asa {
	display: grid;
	place-items: center;
	height: 2rem;
	color: #aaa;
	font-size: 0.9rem;
	letter-spacing: -2px;
	cursor: grab;
	touch-action: none;
}

.mbp li.is-arrastrando .mbp__asa { cursor: grabbing; color: var(--mbp-acento); }

.mbp__puesto { font-size: 0.95rem; font-weight: 800; font-variant-numeric: tabular-nums; }

.mbp__nombre { display: flex; flex-direction: column; min-width: 0; }

.mbp__nombre b { color: var(--mbp-equipo, var(--mbp-tinta)); font-size: 0.82rem; font-weight: 800; }

.mbp__nombre em {
	overflow: hidden;
	color: var(--mbp-suave);
	font-size: 0.72rem;
	font-style: normal;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mbp__flechas { display: flex; gap: 0.2rem; }

.mbp .mbp__flechas button {
	width: 2rem;
	height: 2rem;
	border: 1px solid var(--mbp-linea);
	border-radius: 8px;
	background: #fff;
	color: var(--mbp-tinta);
	font-size: 0.7rem;
	cursor: pointer;
}

.mbp .mbp__flechas button:hover:not([disabled]) { border-color: var(--mbp-acento); color: var(--mbp-acento); }

.mbp .mbp__flechas button[disabled] { opacity: 0.3; cursor: default; }

/* Enviar */
.mbp__enviar { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.4rem; }

.mbp .mbp__nota { margin: 0; color: var(--mbp-suave); font-size: 0.8rem; }

.mbp__hecho {
	padding: 2rem;
	border-radius: 16px;
	background: rgba(26, 127, 55, 0.08);
	text-align: center;
}

.mbp .mbp__hecho-titulo { margin: 0 0 0.4rem; color: #1a7f37; font-size: 1.2rem; font-weight: 800; }

/* --- La carrera ----------------------------------------------------- */

.mbp__carrera {
	margin-bottom: 1.8rem;
	padding: clamp(1rem, 2.5vw, 1.6rem);
	border: 1px solid var(--mbp-linea);
	border-radius: 16px;
	background: #fff;
}

.mbp .mbp__carrera-titulo {
	margin: 0;
	font-family: "Anton", "Poppins", sans-serif;
	font-size: 1.5rem;
	font-weight: 400;
	text-transform: uppercase;
}

.mbp ol.mbp__podio { display: grid; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }

.mbp li.mbp__corredor { margin: 0; border: 1px solid var(--mbp-linea); border-radius: 12px; overflow: hidden; }

.mbp li.mbp__corredor:nth-child(1) { border-color: rgba(214, 149, 0, 0.6); }

.mbp li.mbp__corredor summary {
	display: grid;
	grid-template-columns: 2rem 2.6rem minmax(0, 1fr) auto 3.5rem;
	align-items: center;
	gap: 0.7rem;
	padding: 0.55rem 0.8rem;
	cursor: pointer;
	list-style: none;
}

.mbp li.mbp__corredor summary::-webkit-details-marker { display: none; }

.mbp .mbp__corredor-puesto { font-size: 1.1rem; font-weight: 800; text-align: center; }

.mbp li.mbp__corredor summary img { width: 2.6rem; height: 2.6rem; border-radius: 50%; object-fit: cover; }

.mbp .mbp__corredor-nombre { font-weight: 700; }

.mbp .mbp__corredor-exactos { color: var(--mbp-suave); font-size: 0.75rem; }

.mbp .mbp__corredor-total { font-size: 1.3rem; font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }

.mbp__detalle {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
	padding: 0.4rem 0.8rem 1rem;
}

.mbp__detalle table { width: 100%; border-collapse: collapse; font-size: 0.8rem; }

.mbp__detalle caption { padding: 0.3rem 0; font-weight: 800; text-align: left; }

.mbp__detalle th,
.mbp__detalle td { padding: 0.25rem 0.4rem; border-bottom: 1px solid rgba(53, 53, 53, 0.07); text-align: center; }

.mbp__detalle td:first-child { border-left: 3px solid var(--mbp-equipo, #ccc); text-align: left; }

.mbp__detalle tr.es-clavado td { background: rgba(26, 127, 55, 0.08); }

/* --- Movil ---------------------------------------------------------- */

@media (max-width: 760px) {
	.mbp__conferencias,
	.mbp__detalle { grid-template-columns: minmax(0, 1fr); }

	.mbp li.mbp__corredor summary { grid-template-columns: 1.6rem 2.2rem minmax(0, 1fr) 3rem; }

	.mbp .mbp__corredor-exactos { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.mbp li.mbp__equipo.is-movido { animation: none; }
}

.mbp .mbp__corredor-votos { color: var(--mbp-suave); font-size: 0.75rem; font-style: normal; font-weight: 500; }

/* --- Wild Card de equipo: uno por conferencia --- */

.mbp .mbp__flechas button.mbp__wc {
	width: auto;
	padding: 0 0.45rem;
	margin-right: 0.15rem;
	color: var(--mbp-suave);
	font-size: 0.66rem;
	font-weight: 800;
	letter-spacing: 0.04em;
}

.mbp .mbp__flechas button.mbp__wc:hover { border-color: #c9a227; color: #8a6d00; }

.mbp li.mbp__equipo.is-wc {
	background: linear-gradient(90deg, rgba(232, 185, 35, 0.16), #fff 70%);
	border-color: rgba(201, 162, 39, 0.6);
	box-shadow: inset 0 0 0 1px rgba(201, 162, 39, 0.35);
}

.mbp .mbp__flechas button.mbp__wc[aria-pressed="true"] {
	border-color: #c9a227;
	background: #e8b923;
	color: #2b2200;
}

.mbp__wc-muestra {
	display: inline-block;
	padding: 0.05rem 0.35rem;
	border-radius: 5px;
	background: #e8b923;
	color: #2b2200;
	font-size: 0.62rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	vertical-align: 0.1em;
}

.mbp .mbp__ayuda--wc {
	padding: 0.7rem 0.9rem;
	border: 1px solid rgba(201, 162, 39, 0.45);
	border-radius: 10px;
	background: rgba(232, 185, 35, 0.1);
}

.mbp__detalle tr.es-wc td { background: rgba(232, 185, 35, 0.14); font-weight: 700; }

/* =====================================================================
   CERRADAS: aviso y bracket de La Fanaticada
   ===================================================================== */
.mbp__cierre {
	margin: 0 0 1.5rem;
	padding: 1.5rem;
	border: 1px solid var(--mbp-linea);
	border-radius: 16px;
	background: #fff;
	text-align: center;
}
.mbp p.mbp__cierre-sello {
	display: inline-block;
	margin: 0 0 0.6rem;
	padding: 0.3rem 0.9rem;
	border: 2px solid var(--mbp-acento);
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--mbp-acento);
}
.mbp p.mbp__cierre-texto { margin: 0 0 1.1rem; color: var(--mbp-suave); }
.mbp ul.mbp__cierre-cifras {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mbp ul.mbp__cierre-cifras li { margin: 0; padding: 0.8rem; border-radius: 12px; background: #f6f4f2; }
.mbp ul.mbp__cierre-cifras b { display: block; font-family: "Anton", "Poppins", sans-serif; font-size: 2.4rem; font-weight: 400; line-height: 1.1; color: var(--mbp-acento); }
.mbp ul.mbp__cierre-cifras span { font-size: 0.82rem; color: var(--mbp-suave); }

.mbp__bracket-caja {
	padding: 1.5rem;
	border: 1px solid var(--mbp-linea);
	border-radius: 16px;
	background: #fff;
}
.mbp .mbp__antetitulo--oscuro { color: var(--mbp-acento); }
.mbp h3.mbp__bracket-titulo { margin: 0.2rem 0 0.3rem; font-family: "Anton", "Poppins", sans-serif; font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 400; text-transform: uppercase; }

.mbp__bracket {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	gap: 1rem;
	align-items: center;
	margin-top: 1rem;
}
.mbp__lado--este .mbp__rondas { flex-direction: row-reverse; }
.mbp p.mbp__lado-titulo { margin: 0 0 0.5rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; }
.mbp__lado--este p.mbp__lado-titulo { text-align: right; }
.mbp__rondas { display: flex; gap: 0.6rem; align-items: stretch; }
.mbp__ronda { display: flex; flex: 1 1 0; min-width: 0; flex-direction: column; justify-content: space-around; gap: 0.5rem; }
.mbp__ronda:first-child { flex: 1.6 1 0; }
.mbp p.mbp__ronda-titulo { margin: 0 0 0.2rem; font-size: 0.66rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mbp-suave); text-align: center; }

.mbp__cruce {
	display: grid;
	gap: 2px;
	padding: 3px;
	border: 1px solid var(--mbp-linea);
	border-radius: 10px;
	background: #f6f4f2;
}
.mbp__cruce > span { display: flex; align-items: center; min-height: 2rem; padding: 0 0.5rem; border-radius: 7px; background: #fff; font-size: 0.85rem; color: #b0b0b0; }
.mbp__cruce--vacio > span { justify-content: center; font-weight: 700; }
.mbp__semilla { gap: 0.4rem; color: var(--mbp-tinta) !important; border-left: 4px solid var(--mbp-equipo, #999); }
.mbp__semilla i { min-width: 1.1rem; font-style: normal; font-size: 0.72rem; font-weight: 800; color: var(--mbp-suave); }
.mbp__semilla b { font-weight: 800; }
.mbp__semilla em { overflow: hidden; font-style: normal; font-size: 0.74rem; color: var(--mbp-suave); white-space: nowrap; text-overflow: ellipsis; }
.mbp__semilla .mbp__wc-muestra { margin-left: auto; }

.mbp__finales { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; width: 9rem; }
.mbp__trofeo { font-size: 2.6rem; line-height: 1; }
.mbp__finales .mbp__cruce { width: 100%; }

.mbp__playin { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.5rem; padding-top: 1.2rem; border-top: 1px solid var(--mbp-linea); }
.mbp__playin-conf { display: grid; gap: 0.5rem; align-content: start; }
.mbp p.mbp__fuera { display: flex; flex-wrap: wrap; gap: 0.35rem; align-items: center; margin: 0.2rem 0 0; font-size: 0.78rem; color: var(--mbp-suave); }
.mbp p.mbp__fuera b { padding: 0.15rem 0.45rem; border-left: 3px solid var(--mbp-equipo, #999); border-radius: 4px; background: #f6f4f2; font-weight: 700; color: var(--mbp-tinta); }

/* En pantallas estrechas: cada conferencia en vertical, ronda a ronda */
@media (max-width: 1000px) {
	.mbp__bracket { grid-template-columns: minmax(0, 1fr); }
	.mbp__rondas, .mbp__lado--este .mbp__rondas { flex-direction: column; }
	.mbp__lado--este p.mbp__lado-titulo { text-align: left; }
	.mbp__finales { order: 3; width: 100%; max-width: 20rem; margin: 0 auto; }
	.mbp__ronda { flex: none !important; }
	.mbp__playin { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
	.mbp__cierre, .mbp__bracket-caja { padding: 1rem; }
	.mbp ul.mbp__cierre-cifras { gap: 0.4rem; }
	.mbp ul.mbp__cierre-cifras li { padding: 0.6rem 0.3rem; }
	.mbp ul.mbp__cierre-cifras b { font-size: 1.8rem; }
}
/* Los titulos de ronda, todos arriba a la misma altura */
.mbp__ronda { position: relative; padding-top: 1.5rem; }
.mbp__ronda > p.mbp__ronda-titulo { position: absolute; top: 0; left: 0; right: 0; margin: 0; }
@media (max-width: 1000px) {
	.mbp__ronda { padding-top: 0; }
	.mbp__ronda > p.mbp__ronda-titulo { position: static; text-align: left; margin-top: 0.4rem; }
}
.mbp__cruce > span.mbp__semilla { overflow: hidden; } .mbp__semilla em { min-width: 0; flex: 1 1 auto; }
.mbp p.mbp__fuera b i { font-style: normal; color: var(--mbp-suave); }
@media (max-width: 600px) { .mbp__ronda:not(:first-child) { display: none; } }

/* --- Cerradas: la clasificacion de La Fanaticada con sus zonas --- */
.mbp {
	--mbp-playoffs: #1f7a4a;
	--mbp-playin: #c98a12;
	--mbp-descenso: #C8102E;
}
.mbp ul.mbp__zonas { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; margin: 0 0 1rem; padding: 0; list-style: none; font-size: 0.8rem; color: var(--mbp-suave); }
.mbp ul.mbp__zonas li { display: flex; align-items: center; gap: 0.4rem; margin: 0; }
.mbp__zona::before { content: ""; width: 0.8rem; height: 0.8rem; border-radius: 3px; }
.mbp__zona--playoffs::before { background: var(--mbp-playoffs); }
.mbp__zona--playin::before { background: var(--mbp-playin); }
.mbp__zona--descenso::before { background: var(--mbp-descenso); }

.mbp__clasif { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.mbp ol.mbp__clasif-lista { display: grid; gap: 3px; margin: 0.5rem 0 0; padding: 0; list-style: none; }
.mbp li.mbp__clasif-fila {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin: 0;
	padding: 0.45rem 0.7rem 0.45rem 0;
	border-radius: 8px;
	background: #f6f4f2;
	font-size: 0.9rem;
	box-shadow: inset 5px 0 0 var(--mbp-zona, transparent);
}
.mbp li.mbp__clasif-fila--playoffs { --mbp-zona: var(--mbp-playoffs); }
.mbp li.mbp__clasif-fila--playin { --mbp-zona: var(--mbp-playin); }
.mbp li.mbp__clasif-fila--descenso { --mbp-zona: var(--mbp-descenso); background: rgba(200, 16, 46, 0.07); }
.mbp li.mbp__clasif-fila--fuera { color: var(--mbp-suave); }
.mbp__clasif-fila i { width: 2rem; padding-left: 0.4rem; font-style: normal; font-weight: 800; text-align: center; color: var(--mbp-suave); }
.mbp__clasif-fila b { min-width: 2.6rem; padding-left: 0.45rem; border-left: 3px solid var(--mbp-equipo, #999); font-weight: 800; color: var(--mbp-tinta); }
.mbp__clasif-fila em { flex: 1 1 auto; min-width: 0; overflow: hidden; font-style: normal; white-space: nowrap; text-overflow: ellipsis; }
.mbp__clasif-fila small { min-width: 2.2rem; font-size: 0.75rem; text-align: right; font-variant-numeric: tabular-nums; color: var(--mbp-suave); }
.mbp__descenso-marca { padding: 0.1rem 0.4rem; border-radius: 4px; background: var(--mbp-descenso); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; }
.mbp li.mbp__clasif-corte { height: 0; margin: 0.25rem 0; border-top: 2px dashed var(--mbp-linea); }

@media (max-width: 800px) {
	.mbp__clasif { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 420px) {
	.mbp__clasif-fila em { display: none; }
}
.mbp__clasif-fila small { margin-left: auto; }


/* =====================================================================
   EL JUEGO: el diagrama y una tarjeta por participante
   ===================================================================== */
.mbp__juego { margin: 0 0 1.5rem; padding: 1.5rem; border: 1px solid var(--mbp-linea); border-radius: 16px; background: #fff; }
.mbp h3.mbp__juego-titulo { margin: 0.2rem 0 0.3rem; font-family: "Anton", "Poppins", sans-serif; font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 400; text-transform: uppercase; }
.mbp .mbp__juego-reglas { max-width: 80ch; }

/* --- El diagrama (escalera de puntos) --- */
.mbp__diagrama { margin: 1rem 0 1.6rem; padding: 1rem 1rem 1rem 0; border-left: 3px solid var(--mbp-acento); background: linear-gradient(90deg, rgba(160, 56, 67, 0.04), transparent 40%); }
.mbp__escalon { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); align-items: center; gap: 0.6rem; position: relative; }
.mbp__escalon::before { content: ""; position: absolute; left: 0; top: 50%; width: 0.7rem; height: 2px; background: var(--mbp-acento); }
.mbp__escalon-pts { padding-left: 1rem; font-size: 0.75rem; color: var(--mbp-suave); white-space: nowrap; }
.mbp__escalon-pts b { font-family: "Anton", "Poppins", sans-serif; font-size: 1.25rem; font-weight: 400; color: var(--mbp-tinta); }
.mbp__escalon-gente { display: flex; flex-wrap: wrap; gap: 0.35rem 0.5rem; }
.mbp a.mbp__persona { display: grid; justify-items: center; gap: 0.15rem; width: 4.4rem; color: var(--mbp-tinta); text-decoration: none; }
.mbp__persona-foto { width: 3rem; height: 3rem; border: 2px solid #fff; border-radius: 50% !important; object-fit: cover; box-shadow: 0 0 0 1px var(--mbp-linea), 0 2px 6px rgba(0, 0, 0, 0.12); transition: transform 0.15s; }
.mbp a.mbp__persona:hover .mbp__persona-foto { transform: scale(1.12); }
.mbp a.mbp__persona.is-lider .mbp__persona-foto { box-shadow: 0 0 0 3px #e2b84e, 0 2px 8px rgba(0, 0, 0, 0.2); }
.mbp__persona-nombre { max-width: 100%; overflow: hidden; font-size: 0.68rem; font-weight: 600; text-align: center; white-space: nowrap; text-overflow: ellipsis; }
.mbp__cara-lf, .mbp__cara-wc { display: grid; place-items: center; background: var(--mbp-acento); font-family: "Anton", "Poppins", sans-serif; color: #fff; }
.mbp__cara-wc { background: #6a6a6a; }

/* --- Las tarjetas, en 4 columnas --- */
.mbp__tarjetas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; }
.mbp__tarjeta { scroll-margin-top: calc(var(--mbn-alto, 4.5rem) + 1rem); padding: 0.7rem; border: 1px solid var(--mbp-linea); border-radius: 12px; background: #fff; }
.mbp__tarjeta:target { box-shadow: 0 0 0 3px var(--mbp-acento); }
.mbp__tarjeta-cab { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; align-items: center; gap: 0.45rem; margin-bottom: 0.5rem; }
.mbp__tarjeta-puesto { min-width: 1.5rem; font-family: "Anton", "Poppins", sans-serif; font-size: 1.3rem; font-weight: 400; text-align: center; color: var(--mbp-acento); }
.mbp__tarjeta-foto { width: 2.3rem; height: 2.3rem; border-radius: 50% !important; object-fit: cover; font-size: 0.8rem; }
.mbp__tarjeta-quien { min-width: 0; line-height: 1.2; }
.mbp__tarjeta-quien strong { display: block; overflow: hidden; font-size: 0.85rem; white-space: nowrap; text-overflow: ellipsis; }
.mbp__tarjeta-quien small { font-size: 0.68rem; color: var(--mbp-suave); }
.mbp__tarjeta-pts { text-align: right; font-size: 0.65rem; color: var(--mbp-suave); }
.mbp__tarjeta-pts b { display: block; font-family: "Anton", "Poppins", sans-serif; font-size: 1.35rem; font-weight: 400; line-height: 1; color: var(--mbp-tinta); }
.mbp__tarjeta-confs { display: grid; grid-template-columns: 1fr 1fr; gap: 0.4rem; }
.mbp table.mbp__mini { width: 100%; margin: 0; border-collapse: collapse; font-size: 0.68rem; font-variant-numeric: tabular-nums; }
.mbp table.mbp__mini caption { padding: 0 0 0.15rem; font-size: 0.66rem; font-weight: 800; text-align: left; text-transform: uppercase; letter-spacing: 0.06em; }
.mbp table.mbp__mini th { padding: 0.1rem 0.15rem; font-size: 0.6rem; font-weight: 700; color: var(--mbp-suave); text-align: center; border-bottom: 1px solid var(--mbp-linea); }
.mbp table.mbp__mini td { padding: 0.08rem 0.15rem; text-align: center; border-bottom: 1px solid rgba(53, 53, 53, 0.05); background: none; }
.mbp table.mbp__mini td:nth-child(2) { text-align: left; white-space: nowrap; box-shadow: inset 2px 0 0 var(--mbp-equipo, #999); padding-left: 0.3rem; }
.mbp table.mbp__mini td:nth-child(2) i { margin-left: 0.15rem; padding: 0 0.15rem; border-radius: 3px; background: #e2b84e; font-size: 0.5rem; font-style: normal; font-weight: 800; color: #353535; }
.mbp table.mbp__mini tr.es-clavado td { background: rgba(31, 122, 74, 0.1); }
.mbp table.mbp__mini td.is-mas { font-weight: 800; color: #1f7a4a; }
.mbp table.mbp__mini td.is-menos { color: #b0222f; }

@media (max-width: 1300px) { .mbp__tarjetas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 980px) { .mbp__tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) {
	.mbp__juego { padding: 1rem; }
	.mbp__tarjetas { grid-template-columns: minmax(0, 1fr); }
	.mbp__escalon { grid-template-columns: 4.2rem minmax(0, 1fr); gap: 0.3rem; }
	.mbp a.mbp__persona { width: 3.6rem; }
	.mbp__persona-foto { width: 2.5rem; height: 2.5rem; }
}

/* --- El diagrama: cada cara a la altura de sus puntos (lo coloca el JS) --- */
.mbp .mbp__diagrama { position: relative; display: flex; flex-wrap: wrap; gap: 0.4rem; min-height: 120px; padding: 0.5rem; border-left: 0; background: linear-gradient(180deg, rgba(31, 122, 74, 0.05), rgba(176, 34, 47, 0.05)); border-radius: 12px; }
.mbp .mbp__diagrama.is-js { display: block; padding: 0; }
.mbp .mbp__diagrama.is-js::before { content: ""; position: absolute; left: 52px; top: 10px; bottom: 10px; width: 2px; background: var(--mbp-acento); opacity: 0.35; }
.mbp__diagrama.is-js a.mbp__persona { position: absolute; transition: top 0.4s ease, left 0.4s ease; }
.mbp__persona-pts { font-size: 0.62rem; font-weight: 800; color: var(--mbp-acento); line-height: 1; }
.mbp__diagrama.is-js .mbp__persona-pts { display: none; }
.mbp .mbp__eje { position: absolute; left: 4px; width: 46px; transform: translateY(-50%); font-size: 0.6rem; line-height: 1.1; text-align: right; color: var(--mbp-suave); }
.mbp .mbp__eje b { display: block; font-family: "Anton", "Poppins", sans-serif; font-size: 1rem; font-weight: 400; color: var(--mbp-tinta); }
@media (max-width: 600px) {
	.mbp__diagrama.is-js a.mbp__persona { width: 3rem; }
	.mbp__diagrama.is-js .mbp__persona-foto { width: 2.35rem; height: 2.35rem; }
}

/* =====================================================================
   PODIO Y CARRERA DE BARRAS
   ===================================================================== */
.mbp__juego { padding: clamp(1rem, 2.5vw, 1.8rem); }
.mbp .mbp__cara-lf { background: #fff; object-fit: contain !important; }

/* --- El podio --- */
.mbp__podio-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: clamp(0.5rem, 2vw, 1.5rem); max-width: 760px; margin: 0 auto 2rem; }
.mbp a.mbp__escalon-p { display: grid; justify-items: center; gap: 0.3rem; color: var(--mbp-tinta); text-align: center; text-decoration: none; }
.mbp__podio-foto { width: clamp(4.5rem, 11vw, 7rem); height: clamp(4.5rem, 11vw, 7rem); border: 4px solid #fff; border-radius: 50% !important; object-fit: cover; box-shadow: 0 0 0 4px var(--mbp-podio, #ccc), 0 8px 22px rgba(0, 0, 0, 0.18); }
.mbp__escalon-p--1 .mbp__podio-foto { width: clamp(5.5rem, 14vw, 9rem); height: clamp(5.5rem, 14vw, 9rem); }
.mbp__escalon-p--1 { --mbp-podio: #e2b84e; }
.mbp__escalon-p--2 { --mbp-podio: #b9c0c8; }
.mbp__escalon-p--3 { --mbp-podio: #c98b5a; }
.mbp__medalla { display: grid; place-items: center; width: 2rem; height: 2rem; margin-bottom: -1.3rem; position: relative; z-index: 1; border-radius: 50%; background: var(--mbp-podio); font-family: "Anton", "Poppins", sans-serif; font-size: 1.1rem; color: #fff; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); order: 2; }
.mbp a.mbp__escalon-p .mbp__podio-foto { order: 1; }
.mbp a.mbp__escalon-p strong { order: 3; margin-top: 0.4rem; font-size: clamp(0.8rem, 1.6vw, 1rem); line-height: 1.2; }
.mbp__podio-pts { order: 4; font-size: 0.75rem; color: var(--mbp-suave); }
.mbp__podio-pts b { font-family: "Anton", "Poppins", sans-serif; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 400; color: var(--mbp-tinta); }
.mbp__peana { order: 5; width: 100%; height: 3.5rem; margin-top: 0.3rem; border-radius: 10px 10px 0 0; background: linear-gradient(180deg, var(--mbp-podio), rgba(0, 0, 0, 0.04)); opacity: 0.85; }
.mbp__escalon-p--1 .mbp__peana { height: 5.5rem; }
.mbp__escalon-p--3 .mbp__peana { height: 2.5rem; }

/* --- La carrera de barras --- */
.mbp ol.mbp__barras { display: grid; gap: 0.4rem; margin: 0 0 2rem; padding: 0; list-style: none; }
.mbp ol.mbp__barras li { margin: 0; }
.mbp li.mbp__barra a { display: grid; grid-template-columns: 2rem 2.6rem minmax(0, 1fr) 3.2rem; align-items: center; gap: 0.6rem; color: var(--mbp-tinta); text-decoration: none; }
.mbp__barra-pos { font-family: "Anton", "Poppins", sans-serif; font-size: 1.15rem; text-align: center; color: var(--mbp-suave); }
.mbp__barra-foto { width: 2.6rem; height: 2.6rem; border-radius: 50% !important; object-fit: cover; box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--mbp-linea); }
.mbp__barra-pista { position: relative; height: 2.3rem; border-radius: 999px; background: #f1eeeb; overflow: hidden; }
.mbp__barra-relleno { display: flex; align-items: center; height: 100%; min-width: 0; padding: 0 0.9rem; border-radius: 999px; background: linear-gradient(90deg, #7d2b35, var(--mbp-acento)); transition: width 0.8s ease; }
.mbp__barra-nombre { overflow: hidden; font-size: 0.85rem; font-weight: 700; color: #fff; white-space: nowrap; text-overflow: ellipsis; }
.mbp__barra-nombre small { font-weight: 400; opacity: 0.8; }
.mbp__barra-pts { font-family: "Anton", "Poppins", sans-serif; font-size: 1.3rem; font-weight: 400; text-align: right; }
.mbp li.mbp__barra a:hover .mbp__barra-relleno { filter: brightness(1.12); }
.mbp li.mbp__barra.is-podio-1 .mbp__barra-relleno { background: linear-gradient(90deg, #b8860b, #e2b84e); }
.mbp li.mbp__barra.is-podio-2 .mbp__barra-relleno { background: linear-gradient(90deg, #7f8790, #b9c0c8); }
.mbp li.mbp__barra.is-podio-3 .mbp__barra-relleno { background: linear-gradient(90deg, #8f5a33, #c98b5a); }
.mbp li.mbp__barra.is-podio .mbp__barra-pos { color: var(--mbp-tinta); }
.mbp li.mbp__barra.is-lf .mbp__barra-relleno { background: linear-gradient(90deg, #353535, #5a5a5a); }
@media (max-width: 600px) {
	.mbp li.mbp__barra a { grid-template-columns: 1.5rem 2.1rem minmax(0, 1fr) 2.6rem; gap: 0.4rem; }
	.mbp__barra-foto { width: 2.1rem; height: 2.1rem; }
	.mbp__barra-pista { height: 2rem; }
	.mbp__barra-nombre { font-size: 0.75rem; }
	.mbp__barra-pts { font-size: 1.1rem; }
}
.mbp__medalla { margin-bottom: 0; margin-top: -1.15rem; } .mbp a.mbp__escalon-p strong { margin-top: 0.1rem; }

/* La carrera de barras, en dos columnas (1-14 | 15-27) */
.mbp ol.mbp__barras { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(var(--mbp-filas, 14), auto); grid-auto-flow: column; column-gap: clamp(1rem, 3vw, 2.5rem); }
@media (max-width: 900px) {
	.mbp ol.mbp__barras { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-flow: row; }
}

/* El nombre, fuera de la barra: siempre se lee entero */
.mbp li.mbp__barra a { grid-template-columns: 2rem 2.6rem minmax(6rem, 10rem) minmax(0, 1fr) 3rem; }
.mbp .mbp__barra-nombre { overflow: hidden; font-size: 0.85rem; font-weight: 700; color: var(--mbp-tinta); white-space: nowrap; text-overflow: ellipsis; }
.mbp .mbp__barra-nombre small { font-weight: 400; color: var(--mbp-suave); opacity: 1; }
.mbp__barra-pista { height: 1.4rem; }
@media (max-width: 600px) {
	.mbp li.mbp__barra a { grid-template-columns: 1.5rem 2.1rem minmax(5rem, 7.5rem) minmax(0, 1fr) 2.4rem; }
	.mbp .mbp__barra-nombre { font-size: 0.75rem; }
	.mbp__barra-pista { height: 1.2rem; }
}

/* --- El buscador --- */
.mbp__buscar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 1rem; margin: 0 0 1rem; padding-top: 1.2rem; border-top: 1px solid var(--mbp-linea); }
.mbp .mbp__buscar-rotulo { margin: 0; font-family: "Anton", "Poppins", sans-serif; font-size: 1.4rem; text-transform: uppercase; color: var(--mbp-tinta); }
.mbp input.mbp__buscar-campo { flex: 1 1 260px; max-width: 420px; }
.mbp .mbp__buscar-nada { flex-basis: 100%; margin: 0; color: var(--mbp-suave); }
.mbp .mbp__tarjeta[hidden] { display: none; }

/* --- Lo que eligio y como va --- */
.mbp .mbp__tarjeta-leyenda { margin: 0 0 0.35rem; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--mbp-suave); }
.mbp table.mbp__mini th, .mbp table.mbp__mini td { padding-left: 0.1rem; padding-right: 0.1rem; }
.mbp table.mbp__mini td.mbp__mini-puso { font-weight: 800; color: var(--mbp-tinta); }
.mbp table.mbp__mini td.mbp__mini-dif span { font-size: 0.6rem; font-weight: 800; white-space: nowrap; }
.mbp table.mbp__mini td.mbp__mini-dif .is-ok { color: #1f7a4a; }
.mbp table.mbp__mini td.mbp__mini-dif .is-sube { color: #1f7a4a; }
.mbp table.mbp__mini td.mbp__mini-dif .is-baja { color: #b0222f; }

/* Con cinco columnas por conferencia: tres tarjetas por fila (dos y una en pantallas mas pequenas) */
.mbp__tarjetas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1200px) { .mbp__tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .mbp__tarjetas { grid-template-columns: minmax(0, 1fr); } }
.mbp__tarjeta-confs { gap: 0.6rem; }
.mbp table.mbp__mini { table-layout: fixed; font-size: 0.66rem; }
.mbp table.mbp__mini th:nth-child(1), .mbp table.mbp__mini td:nth-child(1) { width: 18%; }
.mbp table.mbp__mini th:nth-child(2), .mbp table.mbp__mini td:nth-child(2) { width: 30%; }
.mbp table.mbp__mini th:nth-child(3), .mbp table.mbp__mini td:nth-child(3) { width: 16%; }
.mbp table.mbp__mini th:nth-child(4), .mbp table.mbp__mini td:nth-child(4) { width: 18%; }
.mbp table.mbp__mini th:nth-child(5), .mbp table.mbp__mini td:nth-child(5) { width: 18%; }
.mbp table.mbp__mini td:nth-child(2) { overflow: hidden; }
/* Aire entre la clasificacion de La Fanaticada y sus notas */
.mbp .mbp__clasif + .mbp__nota { margin-top: 1.4rem; }

/* La explicacion breve, debajo del titulo */
.mbp .mbp__explica { max-width: 110ch; margin: 0.6rem 0 0; font-size: 0.95rem; line-height: 1.5; color: rgba(255, 255, 255, 0.85); }
.mbp .mbp__explica b { color: #fff; }