/* ==========================================================================
   FutLite – main.css (mobile-first). Se sirve inline y minificado.
   1. Tokens   2. Base   3. Cabecera   4. Feed y tarjetas   5. Partidos
   6. Artículo   7. Anuncios (anti-CLS)   8. Navegación inferior   9. Pie
   10. Escritorio
   ========================================================================== */

/* 1. Tokens ---------------------------------------------------------------- */
:root {
	--bg: #f4f5f7;
	--surface: #ffffff;
	--surface-2: #eceef2;
	--text: #14161a;
	--muted: #5d6573;
	--border: #e1e4ea;
	--accent: #00a651;
	--accent-ink: #ffffff;
	--live: #e5243b;
	--ingame: #00a85a;
	--ingame-ink: #ffffff;
	--shadow: 0 1px 2px rgb(0 0 0 / .06);

	--radius: 14px;
	--radius-sm: 8px;
	--gap: 12px;
	--header-h: 56px;
	--nav-h: 64px;
	--rail-w: 88px;
	--max-w: 720px;
	--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	color-scheme: light;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		--bg: #0f1115;
		--surface: #1a1d23;
		--surface-2: #23272f;
		--text: #eef0f3;
		--muted: #9aa3b2;
		--border: #2a2f38;
		--accent: #2bd47d;
		--accent-ink: #06210f;
		--ingame: #2bd47d;
		--ingame-ink: #06210f;
		--shadow: none;
		color-scheme: dark;
	}
}

:root[data-theme="dark"] {
	--bg: #0f1115;
	--surface: #1a1d23;
	--surface-2: #23272f;
	--text: #eef0f3;
	--muted: #9aa3b2;
	--border: #2a2f38;
	--accent: #2bd47d;
	--accent-ink: #06210f;
	--ingame: #2bd47d;
	--ingame-ink: #06210f;
	--shadow: none;
	color-scheme: dark;
}

/* 2. Base ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
	margin: 0;
	min-height: 100vh;
	background: var(--bg);
	color: var(--text);
	font: 400 16px/1.55 var(--font);
	/* Espacio para la barra inferior fija + safe-area de iOS. */
	padding-bottom: calc(var(--nav-h) + env(safe-area-inset-bottom));
	-webkit-font-smoothing: antialiased;
}

img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }

a { color: inherit; text-decoration: none; }
.entry__content a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }

h1, h2, h3 { line-height: 1.25; margin: 0 0 .5em; }

button { font: inherit; color: inherit; }

:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 4px; }

.container { width: 100%; max-width: var(--max-w); margin-inline: auto; padding-inline: 16px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
	position: absolute; left: 8px; top: -48px; z-index: 100;
	padding: 8px 12px; background: var(--accent); color: var(--accent-ink); border-radius: var(--radius-sm);
}
.skip-link:focus { top: 8px; }

.icon { width: 22px; height: 22px; flex: none; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* 3. Cabecera -------------------------------------------------------------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: var(--surface);
	border-bottom: 1px solid var(--border);
}

.site-header__bar {
	display: flex; align-items: center; justify-content: space-between;
	height: var(--header-h);
}

.site-title { font-weight: 800; font-size: 1.25rem; letter-spacing: -.02em; }
.site-title::first-letter { color: var(--accent); }
.custom-logo { width: auto; max-height: 32px; }

.site-header__actions { display: flex; gap: 4px; }

.icon-btn {
	display: grid; place-items: center;
	width: 40px; height: 40px;
	border: 0; border-radius: 50%;
	background: transparent; cursor: pointer;
}
.icon-btn:hover { background: var(--surface-2); }

/* Conmutador: luna en claro, sol en oscuro. */
.theme-toggle__sun { display: none; }
:root[data-theme="dark"] .theme-toggle__sun { display: block; }
:root[data-theme="dark"] .theme-toggle__moon { display: none; }
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .theme-toggle__sun { display: block; }
	:root:not([data-theme="light"]) .theme-toggle__moon { display: none; }
}

.site-search { padding-bottom: 12px; }
.site-search input {
	width: 100%; height: 44px; padding: 0 14px 0 42px;
	border: 1px solid var(--border); border-radius: 999px;
	background: var(--surface-2); color: var(--text); font-size: 16px; /* 16px evita el zoom en iOS */
}

/* Chips de ligas con scroll horizontal (altura fija → sin CLS). */
.chips { height: 48px; overflow: hidden; }
.chips__list {
	display: flex; gap: 8px; align-items: center;
	height: 100%; margin: 0; padding: 0 0 2px; list-style: none;
	overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity;
}
.chips__list::-webkit-scrollbar { display: none; }
.chips__list a {
	display: block; white-space: nowrap; scroll-snap-align: start;
	padding: 6px 14px; border-radius: 999px;
	background: var(--surface-2); font-size: .875rem; font-weight: 600;
}
.chips__list .current-menu-item a { background: var(--accent); color: var(--accent-ink); }

/* 4. Feed y tarjetas ------------------------------------------------------- */
.site-main { padding-top: 16px; padding-bottom: 24px; }

.page-head__title { font-size: 1.375rem; font-weight: 800; margin-bottom: 12px; }

.feed {
	display: grid; gap: 1px;
	background: var(--border);
	border: 1px solid var(--border); border-radius: var(--radius);
	overflow: hidden; box-shadow: var(--shadow);
}
.feed > * { background: var(--surface); }

.card__link { display: grid; gap: var(--gap); padding: 12px; }
.card__link:hover .card__title { color: var(--accent); }

.card__media { overflow: hidden; border-radius: var(--radius-sm); background: var(--surface-2); }
.card__media img { width: 100%; height: 100%; object-fit: cover; }

.card__kicker {
	display: block; margin-bottom: 4px;
	color: var(--accent); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
}
.card__title { font-size: 1rem; font-weight: 700; margin: 0 0 6px; transition: color .15s; }
.card__excerpt { margin: 0 0 8px; color: var(--muted); font-size: .9375rem; }
.card__meta { color: var(--muted); font-size: .8125rem; }

/* Fila compacta: miniatura 120×68 fija (16:9). */
.card--row .card__link { grid-template-columns: 1fr 120px; align-items: start; }
.card--row .card__media { order: 2; aspect-ratio: 16 / 9; }
.card--row .card__title {
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}

/* Destacada: imagen 16:9 a todo ancho. */
.card--hero .card__media { aspect-ratio: 16 / 9; }
.card--hero .card__title { font-size: 1.25rem; }

.empty { padding: 32px 16px; text-align: center; color: var(--muted); }

.pagination .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 20px; }
.pagination .page-numbers {
	min-width: 40px; height: 40px; padding: 0 12px;
	display: grid; place-items: center;
	border-radius: 999px; background: var(--surface); border: 1px solid var(--border); font-weight: 600;
}
.pagination .current { background: var(--accent); color: var(--accent-ink); border-color: transparent; }

/* 5. Partidos (Match Card estilo FotMob) ---------------------------------- */
.crest {
	width: var(--crest, 24px); height: var(--crest, 24px);
	flex: none; object-fit: contain;
}
.crest--fallback {
	display: inline-grid; place-items: center; border-radius: 50%;
	background: hsl(var(--hue, 200) 45% 45%); color: #fff;
	font-size: calc(var(--crest, 24px) * .38); font-weight: 800; letter-spacing: -.02em; line-height: 1;
}

.mc { position: relative; background: var(--surface); }
.mc + .mc { border-top: 1px solid var(--border); }

.mc__link {
	display: grid; grid-template-columns: 1fr 76px 1fr; align-items: center; gap: 8px;
	min-height: 60px; padding: 8px 12px;
	-webkit-tap-highlight-color: transparent;
}
a.mc__link:hover { background: var(--surface-2); }

.mc__team { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mc__team--home { flex-direction: row-reverse; text-align: right; }
.mc__name { font-size: .9375rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Centro de ancho y alto fijos: cambiar de hora a marcador no mueve nada. */
.mc__center { display: grid; grid-template-rows: 26px 14px; justify-items: center; align-items: center; }
.mc__score, .mc__time { font-variant-numeric: tabular-nums; font-weight: 800; font-size: 1.0625rem; line-height: 1; }
.mc__score { display: flex; gap: 4px; }
.mc__time { display: none; font-weight: 600; color: var(--muted); }
.mc__status {
	display: inline-flex; align-items: center; gap: 4px;
	font-size: .6875rem; font-weight: 700; color: var(--muted); line-height: 1; white-space: nowrap;
}

/* Programado / aplazado / cancelado → hora en lugar de marcador. */
.mc--scheduled .mc__score, .mc--postponed .mc__score, .mc--cancelled .mc__score { display: none; }
.mc--scheduled .mc__time, .mc--postponed .mc__time, .mc--cancelled .mc__time { display: block; }
.mc--postponed .mc__time, .mc--cancelled .mc__time { text-decoration: line-through; opacity: .6; }
.mc--postponed .mc__status, .mc--cancelled .mc__status, .mc--suspended .mc__status { color: var(--live); }

/* En juego: verde con punto que parpadea. */
.mc--live .mc__score, .mc--halftime .mc__score { color: var(--ingame); }
.mc--live .mc__status, .mc--halftime .mc__status { color: var(--ingame); }
.mc--live .mc__status::before {
	content: ""; width: 6px; height: 6px; border-radius: 50%;
	background: var(--ingame); animation: mc-blink 1.2s ease-in-out infinite;
}
@keyframes mc-blink { 0%, 100% { opacity: 1; } 50% { opacity: .15; } }

/* Gol: destello del marcador (live.js añade .is-goal unos segundos). */
.mc.is-goal .mc__score { animation: mc-goal .9s ease-in-out 3; border-radius: 6px; }
@keyframes mc-goal { 50% { background: var(--ingame); color: var(--ingame-ink); box-shadow: 0 0 0 4px var(--ingame); } }

/* Variante hero (página del partido). */
.mc--hero {
	margin-bottom: 20px; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden;
}
.mc--hero .mc__link { grid-template-columns: 1fr 120px 1fr; padding: 20px 12px 12px; align-items: start; }
.mc--hero .mc__team, .mc--hero .mc__team--home { flex-direction: column; text-align: center; gap: 8px; }
.mc--hero .mc__name { white-space: normal; font-size: 1rem; font-weight: 700; }
.mc--hero .mc__center { grid-template-rows: 64px 18px; }
.mc--hero .mc__score, .mc--hero .mc__time { font-size: 2.25rem; }
.mc--hero .mc__status { font-size: .8125rem; }
.mc__meta {
	display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px;
	padding: 10px 12px; border-top: 1px solid var(--border);
	color: var(--muted); font-size: .8125rem;
}
.mc__meta a { color: var(--text); font-weight: 600; }

/* Archivo: cabecera, tira de fechas y grupos por competición. */
.page-head--matches { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.page-head--matches .page-head__title { margin: 0; }
.live-filter {
	display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px;
	border: 1px solid var(--border); border-radius: 999px; background: var(--surface);
	font-size: .8125rem; font-weight: 700; cursor: pointer;
}
.live-filter__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ingame); }
.live-filter__count:not(:empty) {
	min-width: 18px; padding: 0 5px; border-radius: 999px; line-height: 18px;
	background: var(--ingame); color: var(--ingame-ink); font-size: .6875rem;
}
.live-filter[aria-pressed="true"] { background: var(--ingame); border-color: transparent; color: var(--ingame-ink); }
.live-filter[aria-pressed="true"] .live-filter__dot { background: currentColor; }

.datebar { height: 52px; margin: 12px 0; }
.datebar__list {
	display: flex; gap: 6px; height: 100%; margin: 0; padding: 0; list-style: none;
	overflow-x: auto; scrollbar-width: none;
}
.datebar__list::-webkit-scrollbar { display: none; }
.datebar__list li { flex: 1 0 auto; }
.datebar__list a {
	display: grid; place-items: center; height: 40px; padding: 0 14px;
	border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--border);
	font-size: .8125rem; font-weight: 600; white-space: nowrap; text-transform: capitalize;
}
.datebar__list a[aria-current] { background: var(--text); color: var(--bg); border-color: transparent; }

.comp {
	margin-bottom: 12px; background: var(--surface);
	border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow);
}
.comp__head { border-bottom: 1px solid var(--border); }
.comp__head a, .comp__head > .comp__name { display: flex; align-items: center; gap: 10px; height: 44px; padding: 0 12px; }
.comp__head a:hover { background: var(--surface-2); }
.comp__name { margin: 0; flex: 1; font-size: .875rem; font-weight: 700; line-height: 1.3; color: var(--text); }
/* Antes eran <h2>: ahora <span class="league-title-bar"> con el mismo aspecto (menos encabezados para Seobility). */
.league-title-bar { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.comp__country { color: var(--muted); font-weight: 600; }
.comp__chev { width: 16px; height: 16px; color: var(--muted); }

/* Filtro "En directo": oculta lo que no está en juego (y los grupos vacíos). */
.matches__empty-live { display: none; padding: 32px 16px; text-align: center; color: var(--muted); }
.is-live-only .mc:not(.mc--live, .mc--halftime) { display: none; }
.is-live-only .comp:not(:has(.mc--live, .mc--halftime)) { display: none; }
.is-live-only:not(:has(.mc--live, .mc--halftime)) .matches__empty-live { display: block; }
.is-live-only > .ad-slot { display: none; }

/* Partidos dentro de un feed mixto (index.php). */
.feed > .mc + .mc, .feed > * + .mc { border-top: 0; }

/* 6. Artículo -------------------------------------------------------------- */
.entry__header { margin-bottom: 16px; }
.entry__title { font-size: 1.625rem; font-weight: 800; letter-spacing: -.01em; }
.entry__meta { margin: 0; color: var(--muted); font-size: .875rem; }
.entry__meta a { font-weight: 600; color: var(--text); }

.entry__media { margin: 0 -16px 20px; }
.entry__media img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.entry__media figcaption { padding: 6px 16px 0; color: var(--muted); font-size: .8125rem; }

.entry__content { font-size: 1.0625rem; line-height: 1.7; overflow-wrap: break-word; }
.entry__content > * { margin-block: 0 1.1em; }
.entry__content h2 { font-size: 1.3rem; margin-top: 1.6em; }
.entry__content h3 { font-size: 1.125rem; margin-top: 1.4em; }
.entry__content img { border-radius: var(--radius-sm); }
.entry__content blockquote { margin-inline: 0; padding-left: 14px; border-left: 4px solid var(--accent); color: var(--muted); }
.entry__content table { width: 100%; border-collapse: collapse; font-size: .9375rem; display: block; overflow-x: auto; }
.entry__content th, .entry__content td { padding: 8px; border-bottom: 1px solid var(--border); text-align: left; }
.entry__content .wp-block-embed__wrapper { aspect-ratio: 16 / 9; }
.entry__content iframe { width: 100%; height: 100%; }

.tags { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.tags a { display: block; padding: 4px 12px; border-radius: 999px; background: var(--surface-2); font-size: .8125rem; }

/* 7. Anuncios (anti-CLS) --------------------------------------------------- *
 * El hueco reserva su altura ANTES de que cargue AdSense. --ad-h/--ad-h-lg
 * llegan desde PHP (inline style) según el tipo de hueco.                   */
.ad-slot {
	--ad-h: 280px;
	--ad-h-lg: 250px;
	position: relative;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	min-height: calc(var(--ad-h) + 18px); /* + etiqueta "Publicidad" */
	margin: 16px auto;
	max-width: var(--max-w);
	contain: layout style;
	overflow: hidden;
	text-align: center;
}
.feed > .ad-slot { margin: 0; padding: 12px 0; max-width: none; }
.ad-slot__label {
	display: block; height: 18px; line-height: 18px;
	font-size: .625rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted);
}
.ad-slot .adsbygoogle { width: 100%; min-height: var(--ad-h); }
.ad-slot__dev {
	display: grid; place-items: center; width: calc(100% - 32px); min-height: var(--ad-h);
	border: 2px dashed var(--border); border-radius: var(--radius-sm);
	color: var(--muted); font-size: .8125rem; padding: 8px;
}
.ad-slot--header { margin-top: 8px; margin-bottom: 0; }
/* Anuncio sin relleno (unfilled): AdSense lo marca y colapsamos fuera de pantalla. */
.ad-slot:has(ins[data-ad-status="unfilled"]) { display: none; }

/* 8. Navegación inferior --------------------------------------------------- */
.bottom-nav {
	position: fixed; inset: auto 0 0 0; z-index: 60;
	height: calc(var(--nav-h) + env(safe-area-inset-bottom));
	padding-bottom: env(safe-area-inset-bottom);
	background: var(--surface);
	border-top: 1px solid var(--border);
}
@supports (backdrop-filter: blur(1px)) {
	.bottom-nav { background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: saturate(180%) blur(14px); }
}
.bottom-nav ul {
	display: grid; grid-template-columns: repeat(4, 1fr);
	height: var(--nav-h); margin: 0 auto; padding: 0; max-width: var(--max-w); list-style: none;
}
.bottom-nav a {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
	height: 100%; color: var(--muted); font-size: .6875rem; font-weight: 600;
	-webkit-tap-highlight-color: transparent;
}
.bottom-nav a[aria-current="page"] { color: var(--accent); }
.bottom-nav a[aria-current="page"] .icon { stroke-width: 2.4; }

/* 9. Pie ------------------------------------------------------------------- */
.site-footer { padding: 24px 0 16px; color: var(--muted); font-size: .8125rem; text-align: center; }
.footer-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; margin: 0 0 8px; padding: 0; list-style: none; }
.site-footer__copy { margin: 0; }
.social-follow { margin: 4px 0 16px; }
.social-follow__title { margin: 0 0 10px; color: var(--text); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.social-follow__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.social-follow__btn {
	display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	border: 1px solid var(--border); background: var(--surface); color: var(--text);
	transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}
.social-follow__btn:hover, .social-follow__btn:focus-visible { background: #16a34a; border-color: #16a34a; color: #fff; transform: translateY(-2px); }
.social-follow__note { margin: 8px 0 0; font-size: .75rem; font-style: italic; }
@media (prefers-reduced-motion: reduce) { .social-follow__btn { transition: none; } .social-follow__btn:hover { transform: none; } }

/* 10. Escritorio ----------------------------------------------------------- */
@media (min-width: 768px) {
	.ad-slot { min-height: calc(var(--ad-h-lg) + 18px); }
	.ad-slot .adsbygoogle, .ad-slot__dev { min-height: var(--ad-h-lg); }
	.card--row .card__link { grid-template-columns: 1fr 180px; padding: 16px; }
	.entry__media { margin-inline: 0; }
	.entry__media img { border-radius: var(--radius); }
	.entry__title { font-size: 2rem; }
}

/* ≥1024px la barra inferior pasa a ser un rail lateral izquierdo (estilo app). */
@media (min-width: 1024px) {
	body { padding-bottom: 0; padding-left: var(--rail-w); }
	.bottom-nav {
		inset: 0 auto 0 0; width: var(--rail-w); height: 100vh;
		padding: calc(var(--header-h) + 16px) 0 0;
		border-top: 0; border-right: 1px solid var(--border);
		background: var(--surface); backdrop-filter: none;
	}
	.bottom-nav ul { grid-template-columns: 1fr; grid-auto-rows: 72px; height: auto; }
	.bottom-nav a { font-size: .75rem; border-radius: var(--radius); margin: 0 8px; }
	.bottom-nav a:hover { background: var(--surface-2); color: var(--text); }
}

/* 11. Portada, ligas, clasificación y páginas legales ----------------------- */
.bottom-nav a.active { color: var(--accent); }
.bottom-nav a.active .icon { stroke-width: 2.4; }

.page-head__sub { margin: 2px 0 0; color: var(--muted); font-size: .875rem; }
.page-head--matches > div { min-width: 0; }
.live-filter { white-space: nowrap; flex: none; }
.page-head--league { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.page-head--league .page-head__title { margin: 0; }
.page-head__logo { width: 40px; height: 40px; object-fit: contain; flex: none; }

.matches__updated { margin: 8px 0 0; text-align: center; color: var(--muted); font-size: .75rem; }
.matches__more { text-align: center; margin: 16px 0; }
.btn {
	display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 0 18px;
	border: 1px solid var(--border); border-radius: 999px; background: var(--surface);
	font: inherit; font-size: .875rem; font-weight: 700; color: var(--text); cursor: pointer;
}
.btn--primary { background: var(--accent); border-color: transparent; color: var(--accent-ink); }
img.crest { border-radius: 0; }

.admin-note {
	margin: 0 0 12px; padding: 10px 12px; border-radius: var(--radius-sm);
	background: #fff4d6; color: #5c4400; border: 1px solid #f0d58a; font-size: .8125rem;
}
:root[data-theme="dark"] .admin-note { background: #3a3014; color: #f5dd9a; border-color: #5c4a1c; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .admin-note { background: #3a3014; color: #f5dd9a; border-color: #5c4a1c; } }

/* Pestañas (Clasificación) */
.tabs { height: 48px; margin-bottom: 12px; }
.tabs__list { display: flex; gap: 8px; height: 100%; align-items: center; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.tabs__list::-webkit-scrollbar { display: none; }
.tabs__list a {
	display: block; white-space: nowrap; padding: 7px 14px; border-radius: 999px;
	background: var(--surface); border: 1px solid var(--border); font-size: .8125rem; font-weight: 600;
}
.tabs__list a[aria-current] { background: var(--accent); color: var(--accent-ink); border-color: transparent; }

/* Rejilla de ligas */
.league-block + .league-block { margin-top: 8px; }
.league-block__title { margin: 16px 0 10px; font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.league-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 0 0 16px; padding: 0; list-style: none; }
.league-card {
	display: grid; justify-items: center; gap: 6px; padding: 18px 10px 14px; height: 100%;
	background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
	text-align: center; box-shadow: var(--shadow); transition: transform .15s, border-color .15s;
}
.league-card:hover { border-color: var(--accent); transform: translateY(-2px); }
.league-card__logo { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: #fff; }
.league-card__logo img { width: 44px; height: 44px; object-fit: contain; }
.league-card__name { font-weight: 700; font-size: .9375rem; line-height: 1.25; }
.league-card__country { color: var(--muted); font-size: .75rem; }

/* Clasificación */
.standings { margin-bottom: 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.standings__group { margin: 0; padding: 10px 12px; font-size: .875rem; border-bottom: 1px solid var(--border); }
.standings__scroll { overflow-x: auto; }
.standings__table { width: 100%; border-collapse: collapse; font-size: .8125rem; font-variant-numeric: tabular-nums; }
.standings__table th, .standings__table td { padding: 8px 4px; text-align: center; border-bottom: 1px solid var(--border); white-space: nowrap; }
.standings__table thead th { color: var(--muted); font-weight: 600; font-size: .75rem; }
.standings__table abbr { text-decoration: none; }
.standings__table tbody tr:last-child > * { border-bottom: 0; }
.standings__table .c-pos { width: 34px; padding-left: 8px; }
.standings__table .c-pos span { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; font-weight: 700; }
.standings__table .c-team { text-align: left; font-weight: 600; max-width: 150px; }
.team-cell { display: flex; align-items: center; gap: 8px; min-width: 0; }
.team-cell__name { overflow: hidden; text-overflow: ellipsis; }
.standings__table .c-pts { font-weight: 800; padding-right: 10px; }
.zone--ucl { --zone: #2563eb; }
.zone--uel { --zone: #f97316; }
.zone--uecl { --zone: #14b8a6; }
.zone--promo { --zone: #16a34a; }
.zone--playoff { --zone: #eab308; }
.zone--releg { --zone: #dc2626; }
.zone .c-pos span { background: var(--zone); color: #fff; }
.standings__legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 16px; padding: 0 4px; list-style: none; font-size: .75rem; color: var(--muted); }
.standings__legend li::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 6px; border-radius: 3px; background: var(--zone); vertical-align: -1px; }
.round__day { margin: 0; padding: 8px 12px; background: var(--surface-2); color: var(--muted); font-size: .75rem; font-weight: 700; }

/* Páginas legales y formulario */
.legal-id { padding-left: 1.1em; }
.contact-form { display: grid; gap: 4px; max-width: 560px; }
.contact-form p { margin: 0 0 10px; }
.contact-form label { display: block; margin-bottom: 4px; font-weight: 600; font-size: .9375rem; }
.contact-form input[type="text"], .contact-form input[type="email"], .contact-form select, .contact-form textarea {
	width: 100%; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm);
	background: var(--surface); color: var(--text); font: inherit; font-size: 16px;
}
.contact-form__check { display: flex; gap: 10px; align-items: flex-start; }
.contact-form__check input { margin-top: 5px; flex: none; }
.contact-form__check label { font-weight: 400; font-size: .875rem; }
.contact-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.entry__content .btn { text-decoration: none; }
.form-msg { padding: 10px 12px; border-radius: var(--radius-sm); font-weight: 600; }
.form-msg--success { background: color-mix(in srgb, var(--accent) 15%, transparent); }
.form-msg--error { background: color-mix(in srgb, var(--live) 15%, transparent); }

/* Pie: enlaces legales */
.legal-links ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 16px; margin: 0 0 10px; padding: 0; list-style: none; }
.legal-links a { color: var(--muted); text-decoration: underline; text-underline-offset: 2px; }
.legal-links a:hover { color: var(--text); }

@media (min-width: 640px) {
	.league-grid { grid-template-columns: repeat(3, 1fr); }
	.standings__table { font-size: .875rem; }
	.standings__table .c-team { max-width: none; }
}

/* 12. Logo Equipo Mundial (SVG inline, modo claro/oscuro) ------------------- */
.site-logo { display: inline-flex; align-items: center; line-height: 0; }
.site-logo .logo-svg { display: block; width: auto; height: 44px; }

/* Modo claro (por defecto): azul marino */
.logo-dynamic-color { fill: #0d2644; stroke: #0d2644; transition: fill .2s, stroke .2s; }
.logo-green { fill: #15803d; stroke: #15803d; }

/* Trazos del balón/globo: solo línea, sin relleno. Textos y arcos: solo relleno. */
.logo-svg .logo-line { fill: none !important; stroke-width: 10; stroke-linecap: round; stroke-linejoin: round; }
.logo-svg .logo-ring { stroke-width: 13; }
.logo-svg .logo-text,
.logo-svg .logo-fill { stroke: none !important; }

/* Modo oscuro: blanco puro (cualquiera de los tres sistemas de modo oscuro) */
body.dark-mode .logo-dynamic-color,
[data-theme="dark"] .logo-dynamic-color,
.dark .logo-dynamic-color { fill: #ffffff; stroke: #ffffff; }
body.dark-mode .logo-green,
[data-theme="dark"] .logo-green,
.dark .logo-green { fill: #16a34a; stroke: #16a34a; }

/* Modo oscuro automático del sistema (si el usuario no ha forzado el claro) */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .logo-dynamic-color { fill: #ffffff; stroke: #ffffff; }
	:root:not([data-theme="light"]) .logo-green { fill: #16a34a; stroke: #16a34a; }
}

/* 13. Portada: cabecera con H1 SEO y bloque editorial ------------------------ */
.page-head--home { margin-bottom: 4px; }
.page-head--home .page-head__title { margin: 0 0 6px; font-size: 1.25rem; line-height: 1.25; }
.page-head__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.page-head__row .page-head__sub { margin: 0; }
.page-head__brand { display: block; margin-bottom: 2px; color: var(--accent); font-size: .8125rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.seo-editorial-home {
	margin: 24px 0 8px; padding: 18px 16px;
	background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
	box-shadow: var(--shadow); color: var(--muted); font-size: .9375rem; line-height: 1.65;
}
.seo-editorial-home h2 { margin: 0 0 12px; color: var(--text); font-size: 1.125rem; line-height: 1.3; }
.seo-editorial-home h3 { margin: 16px 0 6px; color: var(--text); font-size: 1rem; line-height: 1.35; }
.seo-editorial-home p { margin: 0 0 12px; }
.seo-editorial-home p:last-child { margin-bottom: 0; }
.seo-editorial-home a { color: var(--accent); text-decoration: underline; text-underline-offset: 2px; }
@media (min-width: 768px) { .page-head--home .page-head__title { font-size: 1.5rem; } }

/* 14. Botones para compartir ------------------------------------------------ */
.share { margin: 20px 0 8px; }
.share__title { margin: 0 0 8px; color: var(--muted); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.share__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.share__btn {
	display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 8px;
	border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface);
	color: var(--text); font-size: .8125rem; font-weight: 600; text-decoration: none;
	transition: background .15s, color .15s, border-color .15s;
}
.share__btn svg { flex: none; }
.share__btn:hover, .share__btn:focus-visible { color: #fff; border-color: transparent; }
.share__btn--facebook:hover, .share__btn--facebook:focus-visible { background: #1877f2; }
.share__btn--x:hover, .share__btn--x:focus-visible { background: #000; }
.share__btn--whatsapp:hover, .share__btn--whatsapp:focus-visible { background: #128c4a; }
.share__btn--telegram:hover, .share__btn--telegram:focus-visible { background: #229ed9; }
.entry__content + .share, .entry .share { margin-top: 24px; }
/* Móvil: solo iconos (el nombre sigue disponible para lectores de pantalla). */
@media (max-width: 479px) {
	.share__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.share__btn { min-height: 48px; }
	.share__btn svg { width: 22px; height: 22px; }
}

/* 15. Pie: enlaces a organismos oficiales ------------------------------------ */
.official-links { margin: 0 0 10px; color: var(--muted); font-size: .8125rem; }
.official-links a { color: var(--text); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }

/* 11. Noticias estilo FotMob (inc/news-hub.php) ---------------------------- */
body.is-news {
	--nh-bg: #ffffff; --nh-text: #0f172a; --nh-muted: #8e8e93; --nh-chip: #f2f2f7; --nh-line: #e5e5ea;
	background: var(--nh-bg);
}
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) body.is-news { --nh-bg: #000000; --nh-text: #ffffff; --nh-chip: #1c1c1e; --nh-line: #1f1f22; }
}
:root[data-theme="dark"] body.is-news { --nh-bg: #000000; --nh-text: #ffffff; --nh-chip: #1c1c1e; --nh-line: #1f1f22; }
body.is-news .site-main { padding-top: 8px; }

.nh { color: var(--nh-text); }

/* Cabecera: título + botón de filtros */
.nh-head__row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nh-head__title { margin: 0; font-size: 1.75rem; font-weight: 800; line-height: 1.2; letter-spacing: -.01em; color: var(--nh-text); }

.nh-filter { position: relative; }
.nh-filter__btn {
	display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	background: var(--nh-chip); color: var(--nh-text); cursor: pointer; list-style: none;
}
.nh-filter__btn::-webkit-details-marker { display: none; }
.nh-filter__btn::marker { content: ""; }
.nh-filter__panel {
	position: absolute; right: 0; top: 48px; z-index: 30;
	width: min(300px, calc(100vw - 32px)); max-height: 60vh; overflow-y: auto;
	padding: 8px; border-radius: 16px; background: var(--nh-bg);
	border: 1px solid var(--nh-line); box-shadow: 0 12px 32px rgb(0 0 0 / .25);
}
.nh-filter__label { margin: 4px 8px 6px; color: var(--nh-muted); font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; }
.nh-filter__panel ul { margin: 0; padding: 0; list-style: none; }
.nh-filter__panel a { display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 10px; font-weight: 600; color: var(--nh-text); }
.nh-filter__panel a:hover, .nh-filter__panel a[aria-current] { background: var(--nh-chip); }
.nh-filter__panel small { margin-left: auto; color: var(--nh-muted); font-weight: 500; }

/* Pestañas deslizables con tus categorías */
.nh-tabs {
	display: flex; gap: 22px; margin: 10px -16px 0; padding: 4px 16px 10px;
	overflow-x: auto; white-space: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch;
	scroll-snap-type: x proximity;
}
.nh-tabs::-webkit-scrollbar { display: none; }
.nh-tab { flex: none; scroll-snap-align: start; padding: 6px 0; font-size: 1rem; font-weight: 600; color: #8e8e93; transition: color .15s; }
.nh-tab:hover { color: var(--nh-text); }
.nh-tab.is-active { color: var(--nh-text); font-weight: 800; }

/* Iconos circulares */
.nh-ico {
	--s: 24px; flex: none; display: inline-grid; place-items: center;
	width: var(--s); height: var(--s); border-radius: 50%; overflow: hidden;
}
.nh-ico--logo { background: #fff; }
.nh-ico--logo img { width: 78%; height: 78%; object-fit: contain; }
.nh-ico--svg { background: var(--nh-chip); color: var(--nh-text); }
.nh-ico--trend, .nh-ico--pulse { background: #22c55e; color: #fff; }

/* Bloques por sección */
.nh-block { margin-top: 32px; }
.nh-block:first-of-type { margin-top: 20px; }
.nh-block__head { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.nh-block__title { margin: 0; font-size: 1.3rem; font-weight: 800; line-height: 1.2; color: var(--nh-text); }
.nh-more {
	margin-left: auto; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
	color: var(--nh-text); background: transparent; transition: background .15s;
}
.nh-more:hover { background: var(--nh-chip); }

/* Artículo hero 16:9 */
.nh-hero__link { display: block; color: inherit; }
.nh-hero__media {
	position: relative; display: block; width: 100%; aspect-ratio: 16 / 9;
	border-radius: 14px; overflow: hidden; background: var(--nh-chip);
}
.nh-hero__img, .nh-row__img, .nh-noimg {
	position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover;
}
.nh-hero__title { margin: 12px 0 6px; font-size: 1.15rem; font-weight: 700; line-height: 1.3; color: var(--nh-text); }

/* Filas compactas: miniatura 120×80 a la izquierda */
.nh-row { margin-top: 18px; }
.nh-row__link { display: flex; gap: 14px; align-items: flex-start; color: inherit; }
.nh-row__media {
	position: relative; display: block; width: 120px; height: 80px; flex-shrink: 0;
	border-radius: 10px; overflow: hidden; background: var(--nh-chip);
}
.nh-row__body { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.nh-row__title {
	margin: 0; font-size: 1rem; font-weight: 700; line-height: 1.3; color: var(--nh-text);
	display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.nh-hero__link:hover .nh-hero__title, .nh-row__link:hover .nh-row__title { text-decoration: underline; text-underline-offset: 3px; }
.nh-noimg { background: linear-gradient(135deg, #14532d, #0a0a0a); }

/* Meta: mini-badge + "Equipo Mundial - Hace X" */
.nh-meta { display: flex; align-items: center; gap: 6px; color: #8e8e93; font-size: .8rem; line-height: 1.2; }
.nh-badge {
	flex: none; display: grid; place-items: center; width: 16px; height: 16px; border-radius: 4px;
	background: #16a34a; color: #fff; font-size: 7px; font-weight: 800; letter-spacing: -.02em;
}

/* Archivo de categoría */
.nh-arch { display: flex; align-items: center; gap: 12px; margin-top: 20px; }
.nh-arch__title { margin: 0; font-size: 1.5rem; font-weight: 800; color: var(--nh-text); }
.nh-arch__desc { margin-top: 8px; color: #8e8e93; font-size: .9375rem; }
.nh-arch__desc p { margin: 0; }
.nh-list { margin-top: 18px; }
.nh-list > .nh-hero + .nh-row { margin-top: 22px; }
.nh-list > .mc { margin-top: 18px; border-radius: 12px; }
.nh .ad-slot { margin: 32px 0 0; }

/* Ver más */
.nh-all { margin: 36px 0 8px; text-align: center; }
.nh-all__btn {
	display: inline-block; padding: 12px 22px; border-radius: 999px;
	background: var(--nh-chip); color: var(--nh-text); font-weight: 700;
}
body.is-news .pagination .page-numbers { background: var(--nh-chip); border-color: transparent; color: var(--nh-text); }

@media (min-width: 768px) {
	.nh-head__title { font-size: 2rem; }
	.nh-row__media { width: 160px; height: 100px; }
	.nh-hero__title { font-size: 1.35rem; }
}

/* 12. Mis Equipos (⭐) y app instalable ------------------------------------ */
.em-fav-btn {
	display: inline-grid; place-items: center; width: 28px; height: 28px; flex: none;
	padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer;
	color: var(--muted); font-size: 18px; line-height: 1; -webkit-tap-highlight-color: transparent;
	transition: color .15s, transform .15s;
}
.em-fav-btn:hover { color: #f5b301; }
.em-fav-btn.is-on { color: #f5b301; }
.em-fav-btn:active { transform: scale(.85); }
.em-fav-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

/* En las filas de partido: una estrella en cada extremo (fuera de la zona aria-hidden). */
.mc--fav .mc__link { padding-inline: 36px; }
.mc--fav .em-fav-btn { position: absolute; top: 50%; margin-top: -14px; z-index: 1; }
.mc--fav .em-fav-btn--home { left: 6px; }
.mc--fav .em-fav-btn--away { right: 6px; }

/* Clasificación */
.team-cell .em-fav-btn { width: 24px; height: 24px; font-size: 16px; margin-left: auto; }

/* Bloque superior "⭐ Mis Equipos" */
.em-fav-container { border-color: rgb(22 163 74 / .45); }
.em-fav-container .comp__head { background: rgb(22 163 74 / .08); }
.em-fav-container__title { display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 12px; }
.mc.is-fav-match { box-shadow: inset 3px 0 0 #16a34a; }

/* Noticias de tus equipos */
.is-fav-news .nh-hero__media, .is-fav-news .nh-row__media, .card.is-fav-news .card__media { box-shadow: 0 0 0 2px #16a34a; }
.em-fav-badge {
	display: inline-flex; align-items: center; gap: 3px; margin-left: 6px; padding: 1px 7px;
	border-radius: 999px; background: rgb(22 163 74 / .14); color: #16a34a; font-size: .72rem; font-weight: 700; white-space: nowrap;
}

/* Banner "📲 Instalar App" (fijo sobre la barra inferior: no mueve el contenido) */
.em-install {
	position: fixed; left: 12px; right: 12px; z-index: 60;
	bottom: calc(var(--nav-h) + env(safe-area-inset-bottom) + 10px);
	display: grid; grid-template-columns: 40px 1fr auto auto; align-items: center; gap: 10px;
	padding: 10px 10px 10px 12px; border-radius: 16px;
	background: #111827; color: #fff; box-shadow: 0 10px 30px rgb(0 0 0 / .35);
	opacity: 0; transform: translateY(16px); transition: opacity .25s, transform .25s;
}
.em-install[hidden] { display: none; }
.em-install.is-in { opacity: 1; transform: none; }
.em-install__icon {
	display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px;
	background: #16a34a; font-weight: 800; font-size: .9rem; letter-spacing: -.02em;
}
.em-install__text { min-width: 0; }
.em-install__text p { margin: 0; }
.em-install__title { font-weight: 800; font-size: .95rem; }
.em-install__sub { color: #9ca3af; font-size: .78rem; line-height: 1.3; }
.em-install__btn { border: 0; border-radius: 999px; padding: 8px 14px; background: #16a34a; color: #fff; font-weight: 700; font-size: .875rem; cursor: pointer; }
.em-install__close { border: 0; background: transparent; color: #9ca3af; font-size: 22px; line-height: 1; width: 32px; height: 32px; cursor: pointer; }
.em-install__ios {
	grid-column: 1 / -1; margin: 2px 0 0; padding: 8px 10px; border-radius: 10px;
	background: #1f2937; color: #e5e7eb; font-size: .82rem; line-height: 1.4;
}
.em-install__ios svg { display: inline-block; vertical-align: -3px; color: #60a5fa; }
@media (min-width: 821px) { .em-install { display: none !important; } }

/* 13. Encuesta 1-X-2, cinta "Partidos de hoy" y buscador instantáneo ------- */

/* Buscador: panel flotante bajo la cabecera */
.site-search {
	position: absolute; left: 0; right: 0; top: 100%; z-index: 50; padding: 0;
	background: var(--surface); border-bottom: 1px solid var(--border); box-shadow: 0 16px 32px rgb(0 0 0 / .18);
}
.site-search__panel { padding-top: 10px; padding-bottom: 12px; }
.site-search form { position: relative; }
.site-search__icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--muted); display: flex; }
.site-search__icon svg { width: 18px; height: 18px; }
.em-sr { max-height: min(70vh, 520px); overflow-y: auto; margin-top: 8px; overscroll-behavior: contain; }
.em-sr ul { list-style: none; margin: 0; padding: 0; }
.em-sr__h { margin: 10px 4px 4px; color: var(--muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.em-sr a { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 10px; color: var(--text); }
.em-sr a:hover, .em-sr a:focus-visible { background: var(--surface-2); }
.em-sr a > span { display: flex; flex-direction: column; min-width: 0; }
.em-sr strong { font-weight: 700; font-size: .92rem; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.em-sr small { color: var(--muted); font-size: .78rem; }
.em-sr__posts img, .em-sr__ph { width: 50px; height: 50px; border-radius: 8px; object-fit: cover; flex: none; background: var(--surface-2); }
.em-sr__terms img { width: 24px; height: 24px; object-fit: contain; flex: none; }
.em-sr__dot { width: 24px; height: 24px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--surface-2); color: var(--accent); font-weight: 800; }
.em-sr__empty { margin: 12px 4px; color: var(--muted); font-size: .9rem; }
.em-sr__all { justify-content: center; margin-top: 4px; font-weight: 700; color: var(--accent) !important; }

/* Cinta "En juego / Partidos de hoy" (alto fijo: sin saltos de diseño) */
.em-ticker { background: var(--surface); border-bottom: 1px solid var(--border); }
.em-ticker__track {
	display: flex; align-items: center; gap: 8px; height: 46px;
	overflow-x: auto; white-space: nowrap; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.em-ticker__track::-webkit-scrollbar { display: none; }
.em-ticker__label { flex: none; font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); padding-right: 2px; }
.em-tk {
	flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 10px;
	border-radius: 999px; background: var(--surface-2); color: var(--text); font-size: .8rem; font-weight: 700;
}
.em-tk:hover { filter: brightness(.96); }
.em-tk__crest { width: 20px; height: 20px; object-fit: contain; }
.em-tk__abbr { font-size: .68rem; color: var(--muted); }
.em-tk__sc { font-variant-numeric: tabular-nums; min-width: 30px; text-align: center; }
.em-tk__st { color: var(--muted); font-size: .72rem; font-weight: 700; }
.em-tk__live { display: inline-flex; align-items: center; gap: 4px; color: #16a34a; font-size: .72rem; font-weight: 800; }
.em-tk__dot { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; animation: em-blink 1.2s ease-in-out infinite; }
.em-tk--live { box-shadow: inset 0 0 0 1px rgb(34 197 94 / .45); }
@keyframes em-blink { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .em-tk__dot { animation: none; } }

/* Encuesta "¿Quién ganará?" */
.em-poll { margin: 24px 0; padding: 14px; border-radius: 14px; background: var(--surface); border: 1px solid var(--border); }
.em-poll__title { margin: 0 0 12px; font-weight: 800; font-size: 1.02rem; }
.em-poll__opts { display: grid; grid-template-columns: 1fr 0.8fr 1fr; gap: 8px; }
.em-poll__opt {
	position: relative; display: flex; flex-direction: column; justify-content: center; gap: 6px; min-height: 64px; padding: 10px 8px;
	border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); color: var(--text);
	font: inherit; text-align: center; cursor: pointer; transition: border-color .15s, transform .1s;
}
.em-poll__opt:not(:disabled):hover { border-color: #16a34a; }
.em-poll__opt:not(:disabled):active { transform: scale(.97); }
.em-poll__opt:disabled { cursor: default; }
.em-poll__head { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.em-poll__key { font-size: .7rem; font-weight: 800; color: var(--muted); }
.em-poll__crest { width: 22px; height: 22px; object-fit: contain; }
.em-poll__name { font-size: .82rem; font-weight: 700; line-height: 1.2; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.em-poll__bar { display: none; height: 6px; border-radius: 999px; background: rgb(127 127 127 / .22); overflow: hidden; }
.em-poll__fill { display: block; height: 100%; width: 0; border-radius: inherit; background: #9ca3af; transition: width .6s ease; }
.em-poll__pct { display: none; font-weight: 800; font-size: .95rem; font-variant-numeric: tabular-nums; }
.em-poll.is-voted .em-poll__bar, .em-poll.is-voted .em-poll__pct { display: block; }
.em-poll.is-voted .em-poll__opt.is-mine { border-color: #16a34a; box-shadow: inset 0 0 0 1px #16a34a; }
.em-poll.is-voted .em-poll__opt.is-mine .em-poll__fill { background: #16a34a; }
.em-poll.is-voted .em-poll__opt.is-mine .em-poll__pct { color: #16a34a; }
.em-poll__foot { margin: 10px 0 0; color: var(--muted); font-size: .8rem; }
.mc--hero + .em-poll { margin-top: 12px; }

/* 14. 💰 Huecos de anuncio (CLS 0) y caja E-E-A-T --------------------------- */
.em-ad-container {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	width: 100%; min-height: calc(var(--em-ad-h, 250px) + 22px); margin: 24px auto;
	overflow: hidden; contain: layout;
}
.em-ad-label { display: block; margin-bottom: 6px; font-size: 10px; line-height: 12px; color: #64748b; letter-spacing: 1px; text-transform: uppercase; }
.em-ad-inner { display: flex; justify-content: center; align-items: center; width: 100%; min-height: var(--em-ad-h, 250px); }
.em-ad-inner > * { max-width: 100%; }
.em-ad-inner .adsbygoogle { width: 100%; min-height: var(--em-ad-h, 250px); }
.em-ad-container--header { margin: 8px auto 0; padding-inline: 16px; max-width: var(--max-w); }
.comp + .em-ad-container, .em-ad-container + .comp { margin-top: 12px; }
.nh .em-ad-container { margin-top: 32px; }

.em-author { margin: 28px 0 20px; padding: 16px; border-radius: 14px; background: var(--surface); border: 1px solid var(--border); }
.em-author p { margin: 0; }
.em-author__top { display: flex; align-items: center; gap: 12px; }
.em-author__avatar { position: relative; flex: none; width: 52px; height: 52px; }
.em-author__avatar img { width: 52px; height: 52px; border-radius: 50%; background: #090d16; padding: 6px; object-fit: contain; }
.em-author__check { position: absolute; right: -2px; bottom: -2px; display: grid; border-radius: 50%; background: var(--surface); padding: 1px; }
.em-author__check svg { display: block; }
.em-author__name { font-weight: 800; font-size: 1.02rem; }
.em-author__role { color: #16a34a; font-size: .8rem; font-weight: 700; }
.em-author__bio { margin-top: 10px !important; color: var(--muted); font-size: .9rem; line-height: 1.5; }
.em-author__links { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.em-author__link { padding: 6px 12px; border-radius: 999px; background: var(--surface-2); color: var(--text); font-size: .8rem; font-weight: 700; }
.em-author__link:hover { color: #16a34a; }
.em-author__social { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--surface-2); color: var(--text); }
.em-author__social:hover { color: #16a34a; }
.em-author__social svg { display: block; }