LeaderboardHud {
	position: absolute;
	top: 3vh;
	right: 0.5vw;
	width: 20vw;
	height: 100%;
	font-size: 2vh;
	flex-direction: column;
	font-family: Tannenberg Fett;

	> div {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	> .leaderboard {
		color: white;
		text-stroke: 6px black;
		letter-spacing: 2px;
		transition: all 0.4s ease;

		&.hide {
			transform: translate(50%, 0%) scale(0);
		}

		h1 {
			font-size: 4vh;
		}

		p {
			top: 0.5vh;
			text-stroke: 4px black;
			font-size: 1.5vh;
		}

		> .entries {
			flex-direction: column;
			align-items: center;
			width: 85%;

			.entry {
				text-stroke: 5px black;
				justify-content: space-between;
				gap: 8px;
				width: 100%;
				padding: 4px 8px;

				.rank {
					justify-content: flex-end;
				}

				.name {
					flex-grow: 1;
					gap: 8px;

					image {
						width: 32px;
						height: 32px;
					}

					label {
						white-space: nowrap;
						text-overflow: ellipsis;
						max-width: 200px;
					}
				}

				&.me {
					background-color: rgba( white, 0.5 );
					backdrop-filter: blur(1px);
				}
			}
		}
	}
}