.tier-list {
	margin-bottom: 2rem;
	clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 10px) 100%, 0 100%, 0 14px);
}
.tier {
	display: grid;
	grid-template-columns: 35px 1fr;
	align-items: center;
	background-color: #282477;
}
.tier + .tier {
	margin-top: 1px;
	border-radius: 0;
}
.rank {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	font-weight: 600;
	font-size: 1.25rem;
	color: var(--bg-color);
}
.s-plus-rank .rank { background-color: #ff5555; }
.s-rank .rank { background-color: #ff7673; }
.a-plus-rank .rank { background-color: #ff9073; }
.a-rank .rank { background-color: #ffa56b; }
.b-rank .rank { background-color: #ffdf77; }
.c-rank .rank { background-color: #bde772; }
.d-rank .rank { background-color: #79e57a; }
.f-rank .rank { background-color: #76efc0; }

.tier .profiles-list {
	margin: 0.675rem;
	gap: 0.625rem;
	grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));
}
/* .tier .cards-list a {
    position: relative;
	padding: 2px;
	border: none;
	border-radius: 0;
    clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
    background: color-mix(in oklab, var(--card-bg-color), #000 5%);
}
.tier .cards-list a > div {
	display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    cursor: pointer;
	transition: inherit;
    background-color: var(--card-bg-color);
    background: linear-gradient(110deg,
		color-mix(in oklab, var(--card-bg-color), #000 5%) 18%, var(--card-bg-color) 18%, var(--card-bg-color) 62%,
		color-mix(in oklab, var(--card-bg-color), #000 5%) 62%,
		color-mix(in oklab, var(--card-bg-color), #000 5%) 68%, var(--card-bg-color) 68%, var(--card-bg-color) 85%,
		color-mix(in oklab, var(--card-bg-color), #000 5%) 85%);
    clip-path: polygon(10% 0%, 100% 0%, 90% 100%, 0% 100%);
}
.tier .cards-list img {
	aspect-ratio: 5 / 4;
}
.tier .cards-list a span {
	width: 94%;
	font-size: 0.625rem;
} */
@media (min-width: 640px) {
	.tier {
		grid-template-columns: 70px 1fr;
	}
	.tier .profiles-list {
		margin: 0.75rem;
    	gap: 0.75rem;
		grid-template-columns: repeat(auto-fill, minmax(64px, 1fr));
	}
}

main section {
    margin-bottom: 2.5rem;
}
main section p {
    margin: 0.75rem 0 1rem;
}
main section ul {
    margin-left: 1.125rem;
}
main section ul li {
    margin-top: 0.75rem;
}