/*
 * Ranking y estadísticas. Colores del diseño aprobado; diseño final en el paso 7.
 */
.admire-ranking,
.admire-stats {
	--admire-accent: #C5A059;
	--admire-bg: #080C14;
	--admire-surface: #1B2838;
	--admire-text: #E8F0F8;
	--admire-muted: #8FAFC4;
	color: var(--admire-text);
	font: inherit;
}

.admire-widget__empty { color: var(--admire-muted); }

/* ---------- Ranking ---------- */
.admire-ranking__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.6em;
}

.admire-ranking__link {
	display: grid;
	grid-template-columns: 2.4em 1fr auto;
	align-items: center;
	gap: 1em;
	padding: 0.9em 1.1em;
	background: var(--admire-surface);
	border: 1px solid rgba(197, 160, 89, 0.25);
	border-radius: 6px;
	color: inherit;
	text-decoration: none;
	transition: border-color 0.15s ease, transform 0.15s ease;
}
a.admire-ranking__link:hover,
a.admire-ranking__link:focus-visible {
	border-color: var(--admire-accent);
	transform: translateX(3px);
	outline: none;
}

.admire-ranking__pos {
	font-size: 1.6em;
	font-weight: 700;
	color: var(--admire-accent);
	text-align: center;
	line-height: 1;
}
.admire-ranking__item:nth-child(-n+3) .admire-ranking__pos { font-size: 2em; }

.admire-ranking__body { display: flex; flex-direction: column; gap: 0.25em; min-width: 0; }

.admire-ranking__title {
	color: var(--admire-accent);
	font-size: 0.75em;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.admire-ranking__text { font-size: 0.95em; line-height: 1.45; }

.admire-ranking__place { font-size: 0.8em; color: var(--admire-muted); }

.admire-ranking__likes {
	white-space: nowrap;
	font-weight: 700;
	color: var(--admire-accent);
}

/* ---------- Estadísticas ---------- */
.admire-stats__hero { text-align: center; margin-bottom: 2em; }

.admire-stats__big { margin: 0; line-height: 1; }
.admire-stats__num { font-size: 3.5em; font-weight: 700; color: var(--admire-accent); }
.admire-stats__of  { font-size: 1.6em; color: var(--admire-muted); }

.admire-stats__caption { margin: 0.4em 0 1em; }
.admire-stats__sub { margin: 0.8em 0 0; color: var(--admire-muted); font-size: 0.9em; }

.admire-stats__progress,
.admire-stats__bar {
	display: block;
	height: 8px;
	background: rgba(143, 175, 196, 0.2);
	border-radius: 4px;
	overflow: hidden;
}
.admire-stats__progress { max-width: 420px; margin: 0 auto; }
.admire-stats__progress span,
.admire-stats__bar span {
	display: block;
	height: 100%;
	background: var(--admire-accent);
	border-radius: 4px;
}

.admire-stats__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 2em;
}

.admire-stats__heading {
	margin: 0 0 0.8em;
	font-size: 0.8em;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--admire-accent);
}

.admire-stats__bars { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6em; }

.admire-stats__row {
	display: grid;
	grid-template-columns: minmax(7em, 40%) 1fr 2.5em;
	align-items: center;
	gap: 0.8em;
	font-size: 0.9em;
}
.admire-stats__row.is-zero { opacity: 0.45; }
.admire-stats__value { text-align: right; font-weight: 700; }
