.pill {
	font-size: var(--font-2xs);
	font-weight: var(--weight-bold);
	border-radius: var(--radius-selector);
	padding: 0 var(--s-1-5);
	height: var(--selector-size-sm);
	display: grid;
	place-items: center;
	min-width: 33px;
	text-align: center;
}

.tierX {
	background-color: hsl(45, 100%, 30%);
	color: hsl(45, 100%, 90%);
}

.tierSPlus {
	background-color: hsl(280, 60%, 35%);
	color: hsl(280, 80%, 90%);
}

.tierS {
	background-color: hsl(280, 50%, 40%);
	color: hsl(280, 70%, 92%);
}

.tierAPlus {
	background-color: hsl(210, 60%, 35%);
	color: hsl(210, 80%, 90%);
}

.tierA {
	background-color: hsl(210, 50%, 40%);
	color: hsl(210, 70%, 92%);
}

.tierBPlus {
	background-color: hsl(140, 45%, 32%);
	color: hsl(140, 60%, 90%);
}

.tierB {
	background-color: hsl(140, 35%, 38%);
	color: hsl(140, 50%, 92%);
}

.tierCPlus {
	background-color: hsl(0, 0%, 35%);
	color: hsl(0, 0%, 90%);
}

.tierC {
	background-color: hsl(0, 0%, 40%);
	color: hsl(0, 0%, 92%);
}