@charset "UTF-8";

:root {
	font-size: 13pt;
	
	--main-font: "Noto Serif", serif;
}

main {
	max-width: 1600px;
	margin-inline: auto;
}

.row {
	margin-block: 1.5em;
	
	&:has(> div) {
		display: flex;
		flex-flow: row wrap;
	}
}

textarea {
	border: 1px solid var(--text);
	padding: 0.4em;
}

#input-text {
	font-family: "Noto Sans Mono", "Noto Mono", monospace;
}

#output-text {
	font-family: "Noto Sans Math", "Noto Sans Symbols", "Noto Sans Symbols 2", "Noto Sans Symbols2", "Noto Sans", sans-serif, serif;
	font-variant-emoji: text;
	font-size: 1.3em;
}

label {
	font-weight: bold;
	
	&:has(+ textarea) {
		display: block;
		margin-block: 0.5em;
	}
}

select {
	margin-block: 0.2em;
	margin-inline: 0 2em;
	padding-inline: 0.4em;
	padding-block: 0.3em;
	border: 1px solid var(--text);
}

footer {
	border-block-start: 2px solid var(--text);
	margin-block: 3em;
	padding-inline: 1em;
}

p {
	margin-block: 1em;
	line-height: 1.4;
}

noscript {
	color: var(--brand-red);
	font-weight: 900;
}