#main {
	max-width: 54em;
}
.gtd_unit, .mission_unit {
	background-size: 100% 100%;
	background-position: center center;
	background-repeat: no-repeat;
	margin: 0.1em;
	height: 3.5em;
	width: 3.5em;
	position: relative;
}
	.gtd_unit span, .mission_unit span {
		position: absolute;
		bottom: -0.1em;
		right: 0.1em;
		font-size: 1.2em;
		font-weight: bold;
		text-shadow: 0px 0px 5px rgba(0, 0, 0, 1), 0px 0px 10px rgba(0, 0, 0, 1);
	}
	[data-unit="marine"] { background-image: url('/starcraft/img/gtd/marine.jpg'); }
	[data-unit="medic"] { background-image: url('/starcraft/img/gtd/medic.jpg'); }
	[data-unit="dark_templar"] { background-image: url('/starcraft/img/gtd/dark_templar.jpg'); }
	[data-unit="zealot"] { background-image: url('/starcraft/img/gtd/zealot.jpg'); }
	[data-unit="hydra"] { background-image: url('/starcraft/img/gtd/hydra.jpg'); }
	[data-unit="zergling"] { background-image: url('/starcraft/img/gtd/zergling.jpg'); }
	[data-unit="bengal"] { background-image: url('/starcraft/img/gtd/bengal.jpg'); }
	[data-unit="firebat"] { background-image: url('/starcraft/img/gtd/firebat.jpg'); }
	[data-unit="ghost"] { background-image: url('/starcraft/img/gtd/ghost.jpg'); }
	[data-unit="dragoon"] { background-image: url('/starcraft/img/gtd/dragoon.jpg'); }
	[data-unit="high_templar"] { background-image: url('/starcraft/img/gtd/high_templar.jpg'); }
	[data-unit="defiler"] { background-image: url('/starcraft/img/gtd/defiler.jpg'); }
	[data-unit="ultralisk"] { background-image: url('/starcraft/img/gtd/ultralisk.jpg'); }
	[data-unit="ursadon"] { background-image: url('/starcraft/img/gtd/ursadon.jpg'); }
	[data-unit="goliath"] { background-image: url('/starcraft/img/gtd/goliath.jpg'); }
	[data-unit="tank"] { background-image: url('/starcraft/img/gtd/tank.jpg'); }
	[data-unit="archon"] { background-image: url('/starcraft/img/gtd/archon.jpg'); }
	[data-unit="dark_archon"] { background-image: url('/starcraft/img/gtd/dark_archon.jpg'); }
	[data-unit="mutalisk"] { background-image: url('/starcraft/img/gtd/mutalisk.jpg'); }
	[data-unit="guardian"] { background-image: url('/starcraft/img/gtd/guardian.jpg'); }
	[data-unit="rhynadon"] { background-image: url('/starcraft/img/gtd/rhynadon.jpg'); }
	[data-unit="battlecruiser"] { background-image: url('/starcraft/img/gtd/battlecruiser.jpg'); }
	[data-unit="wraith"] { background-image: url('/starcraft/img/gtd/wraith.jpg'); }
	[data-unit="carrier"] { background-image: url('/starcraft/img/gtd/carrier.jpg'); }
	[data-unit="corsair"] { background-image: url('/starcraft/img/gtd/corsair.jpg'); }
	[data-unit="devourer"] { background-image: url('/starcraft/img/gtd/devourer.jpg'); }
	[data-unit="kerrigan"] { background-image: url('/starcraft/img/gtd/kerrigan.jpg'); }
	[data-unit="kakaru"] { background-image: url('/starcraft/img/gtd/kakaru.jpg'); }

.title_wrapper {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	padding: 0 0.3em;
}
	h1 {
		margin-bottom: 0.4em;
		text-align: center;
	}
	.title_box {
		
	}
		.title_box h2 {
			font-size: 1.7em;
		}
		.title_box .italic {
			margin: 0.1em 0 0.3em 0;
		}
	.filter_box {
		display: flex;
		gap: 0.5em;
	}
		.mission_filter {
			margin-bottom: 0.3em;
		}
			#reset_missions {
				padding: 0 1em;
				font-family: 'Play', sans-serif;
				border: 1px solid rgb(65 65 67 / 58%);
				background-color: #0e1327;
				color: rgb(245, 236, 228);
				border-radius: 0.5em;
				font-size: 1em;
				height: 2.5em;
				cursor: pointer;
				width: 100%;
			}
				#reset_missions:hover {
					background-color: #171f3f;
				}
			input[type="checkbox"] {
				display: none;
			}
			.modern-toggle {
				display: flex;
				align-items: center;
				justify-content: space-between;
				cursor: pointer;
				user-select: none;
				height: 2.5em;
				border-radius: 8px;
				transition: background 0.2s ease;
				border: 1px solid rgb(65 65 67 / 58%);
				background-color: #0e1327;
				padding: 0 0.5em;
			}
				.modern-toggle:hover {
					background-color: #171f3f;
				}
			.label-text {
				margin-left: 0.5em;
			}

			input[type="checkbox"]:checked + .modern-toggle .toggle-switch {
				background: #349335;
			}
			.modern-toggle .toggle-switch {
				position: relative;
				width: 2.8em;
				height: 1.5em;
				background: #ba1401;
				border-radius: 0.7em;
				transition: all 0.3s ease;
			}
			input[type="checkbox"]:checked + .modern-toggle .toggle-switch::after {
				left: 1.4em;
			}
			.modern-toggle .toggle-switch::after {
				content: '';
				position: absolute;
				top: 0.1em;
				left: 0.1em;
				width: 1.3em;
				height: 1.3em;
				background: white;
				border-radius: 50%;
				transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
				box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
			}

#unit_list {
	margin: 0 auto 1em auto;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
}
	.units_tier {
		background-color: #0e1327;
		border: 1px solid rgb(65 65 67 / 58%);
		padding: 0.3em;
		display: flex;
		border-radius: 0.5em;
	}
	.units_tier:hover {
	}
		.class_title, .tier_title, .gtd_unit {
		}
		.class_title, .tier_title {
			font-size: 2em;
			text-align: center;
			
		}
	.gtd_unit {
		border-radius: 0.5em;
		padding: 0.3em;
		border: 1px solid transparent;
	}
		.gtd_unit:hover {
			cursor: pointer;
			border: 1px solid rgb(65 65 67 / 75%);
		}
		.gtd_unit.selected {
			border: 1px solid #fff;
		}
		.gtd_unit.completed {
			opacity: 0.25;
			order: 1;
		}
#mission_list {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	justify-content: space-evenly;
}
	.mission {
		padding: 0.3em;
		display: flex;
		border: 1px solid rgb(65 65 67 / 58%);
		border-radius: 0.5em;
		background-color: #0e1327;
	}
	.mission:hover {
		background-color: #171f3f;
		cursor: pointer;
	}
	.mission.selected {
		border: 1px solid #fff;
		background-color: #171f3f;
		
	}
		.mission.selected .mission_unit {
		}
	.mission.completed {
		opacity: 0.25;
		order: 1;
	}
		.mission_unit {
			border: 1px solid transparent;
			border-radius: 0.5em;
		}
		
@media (max-width:700px) {
	#mission_list {
		grid-template-columns: 1fr 1fr;
	}
	#right_missions .mission {
		flex-wrap: wrap;
		justify-content: center;
	}
}