* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-family: Poppins, sans-serif;
	font-size: 16px;
}

body {
	background-color: hsl(0deg 0% 0%);
	display: flex;
	display: grid;
	flex-direction: column;
	grid-template-rows: auto 1fr;
	height: 100dvh;
	max-width: 100%;
	overflow: hidden;
}

body > h2 {
	background-color: hsl(0deg 0% 100% / 5%);
	padding: 1rem;
	color: hsl(0deg 0% 100%);
	border-bottom: 1px solid hsl(0deg 0% 100% / 10%);
}

body > pre {
	background-color: hsl(0deg 0% 0%);
	border: none;
	color: hsl(0deg 0% 100% / 90%);
	height: 100%;
	overflow: auto;
	padding: 1rem;
	width: 100%;
}

pre code.typescript {
	.ReservedWord {
		color: rgb(199, 106, 253);
	}

	.Punctuator {
		color: rgb(255, 227, 68);
	}

	.Identifier {
		color: rgb(102, 212, 255);
	}

	.Literal {
		color: hsl(24, 100%, 67%);
	}
}
