root {
	width: 420px;
	height: 180px;
	align-items: center;
	justify-content: center;
}

.health-wrap {
	width: 420px;
	height: 180px;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.name {
	color: white;
	font-size: 42px;
	font-weight: 700;
	text-shadow: 2px 2px 4px black;
	margin-bottom: 12px;
}

.health-box {
	width: 340px;
	height: 36px;
	background-color: rgba(20, 20, 20, 0.95);
	border: 3px solid white;
	border-radius: 6px;
	overflow: hidden;
}

.health-fill {
	height: 100%;
	background-color: limegreen;
}

.health-fill.mid {
	background-color: orange;
}

.health-fill.low {
	background-color: red;
}

.label {
	color: white;
	font-size: 30px;
	font-weight: 700;
	text-shadow: 2px 2px 4px black;
	margin-top: 12px;
}