/**
 * Thallo — Mythic+ leaderboard.
 *
 * Same trim as the progression section: stone hairline, venom accent, no gold.
 * Score colour is Raider.IO's own tier colour, printed inline per row, so the
 * palette here deliberately stays neutral and lets that hue carry the meaning.
 */

.thallo-mythic {
	--thm-edge: rgba(146, 186, 168, 0.16);
	--thm-rim: inset 0 1px 0 rgba(223, 239, 232, 0.06);
	--thm-accent: var(--th-venom, #21d6a3);
	--thm-muted: #93a89e;
	--thm-radius: 12px;

	margin: 3rem auto;
	max-width: 1180px;
	color: var(--th-bone, #eef5f0);
}

.thallo-mythic__title {
	margin: 0 0 1.25rem;
	letter-spacing: 0.01em;
}

.thallo-mythic__empty {
	padding: 1.25rem 1.4rem;
	border: 1px solid var(--thm-edge);
	border-radius: var(--thm-radius);
	box-shadow: var(--thm-rim);
	color: var(--thm-muted);
	background: rgba(18, 30, 25, 0.4);
}

/* Long table on a narrow phone scrolls itself rather than the page. */
.thallo-mythic__scroll {
	overflow-x: auto;
	border: 1px solid var(--thm-edge);
	border-radius: var(--thm-radius);
	box-shadow: var(--thm-rim);
	background: rgba(18, 30, 25, 0.4);
}

.thallo-mythic__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.95rem;
	min-width: 640px;
}

.thallo-mythic__table th {
	text-align: left;
	padding: 0.85rem 1rem;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--thm-muted);
	border-bottom: 1px solid var(--thm-edge);
	white-space: nowrap;
}

.thallo-mythic__table td {
	padding: 0.7rem 1rem;
	border-bottom: 1px solid rgba(146, 186, 168, 0.08);
	vertical-align: middle;
}

.thallo-mythic__row:last-child td {
	border-bottom: 0;
}

.thallo-mythic__row:hover {
	background: rgba(33, 214, 163, 0.05);
}

.thallo-mythic__place {
	width: 3rem;
	font-variant-numeric: tabular-nums;
	color: var(--thm-muted);
}

/* Top three read as the podium without needing a medal glyph. */
.thallo-mythic__row:nth-child(-n + 3) .thallo-mythic__place {
	color: var(--thm-accent);
	font-weight: 700;
}

.thallo-mythic__link {
	text-decoration: none;
}

.thallo-mythic__name {
	display: block;
	font-weight: 600;
}

.thallo-mythic__realm,
.thallo-mythic__spec {
	font-size: 0.82rem;
	color: var(--thm-muted);
}

.thallo-mythic__realm {
	display: block;
}

.thallo-mythic__role {
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--thm-muted);
	white-space: nowrap;
}

.thallo-mythic__score {
	width: 34%;
	min-width: 190px;
}

.thallo-mythic__figure {
	display: block;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	margin-bottom: 0.35rem;
}

.thallo-mythic__meter {
	display: block;
	height: 4px;
	border-radius: 999px;
	background: rgba(146, 186, 168, 0.14);
	overflow: hidden;
}

.thallo-mythic__meter > span {
	display: block;
	height: 100%;
	border-radius: inherit;
}

.thallo-mythic__foot {
	margin: 0.9rem 0 0;
	font-size: 0.82rem;
	color: var(--thm-muted);
}

.thallo-mythic__foot a {
	color: var(--thm-accent);
}

@media (max-width: 544px) {
	.thallo-mythic {
		margin: 2rem auto;
	}

	.thallo-mythic__table td,
	.thallo-mythic__table th {
		padding: 0.6rem 0.75rem;
	}
}