/* Map statistics (character/mapstats) */

.fy-mapstats-top { display: grid; gap: var(--sp-5); align-items: end; margin-bottom: var(--sp-6); }
.fy-mapstats-intro { max-width: 60ch; margin: 0; color: var(--text-2); }
.fy-mapstats-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 420px; }
/* values on one line even when a label wraps onto two */
.fy-mapstats-stats .fy-stat { display: flex; flex-direction: column; justify-content: space-between; }
.fy-mapstats-stats dd { font-size: 1.6rem; }
@media (min-width: 760px) {
	.fy-mapstats-top { grid-template-columns: minmax(0, 1fr) auto; }
	.fy-mapstats-stats { min-width: 360px; }
}

.fy-mapstats-list { display: grid; gap: 0 var(--sp-8); margin: 0; padding: 0; list-style: none; }
@media (min-width: 900px) {
	.fy-mapstats-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.fy-mapstats-list li {
	display: grid;
	grid-template-columns: minmax(7rem, 11rem) minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--sp-4);
	margin: 0;
	padding: .75rem 0;
	border-top: 1px solid var(--line);
}
.fy-mapstats-list__name { color: var(--text); font-weight: 800; overflow-wrap: anywhere; }
.fy-mapstats-list__bar { height: 8px; overflow: hidden; border-radius: var(--r-pill); background: rgba(255, 255, 255, .06); }
.fy-mapstats-list__bar > span { display: block; height: 100%; border-radius: inherit; background: var(--grad-violet); }
.fy-mapstats-list li:first-child .fy-mapstats-list__bar > span { background: var(--grad-gold); }
.fy-mapstats-list__count { color: var(--text-3); font-size: .9rem; white-space: nowrap; }
.fy-mapstats-list__count strong { color: var(--text); }
@media (max-width: 479.98px) {
	.fy-mapstats-list li { grid-template-columns: minmax(0, 1fr) auto; row-gap: .45rem; }
	.fy-mapstats-list__bar { grid-column: 1 / -1; grid-row: 2; }
}