:root {
	--white-neutral: #f4f4f9;
	--white-hover: #ececff;
	--black-neutral: #1a1a1c;
	--black-hover: #282833;
	--accent: #7a7a99;

	--primary: var(--black-neural);
	--background: var(--white-neutral);
	--hover-background: var(--white-hover);
}

body {
	color: var(--primary);
	background-color: var(--background);
	padding: 3ch;
	max-width: 80ch;
	margin: 0 auto;
	font-family: system-ui;
	line-height: 1.6;
}

ul {
	list-style-type: "-";
	padding-left: 1.5em;
}

li {
	padding-left: 0.25em;
}

h3 {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	line-height: 1.4;
	font-weight: normal;
	font-size: 1.2rem;
	margin: 1.2rem 0;
}

a {
	color: inherit;
	text-decoration: none;
}

a::after {
	/* copied from https://practicaltypography.com/how-to-use.html */
	position: relative;
	content: "\FEFF°";
	margin-left: 0.1em;
	font-size: 90%;
	top: -0.1em;
	color: var(--accent);
	font-feature-settings: "caps";
	font-variant-numeric: normal;
}

a:hover {
	background: var(--hover-background);
	transition-property: background;
	transition-duration: 0.2s;
}

h2 {
	border-bottom-width: 1px;
	border-bottom-color: var(--accent);
	border-bottom-style: solid;
	line-height: 1.2;
	font-size: 1.44rem;
	font-weight: normal;
	margin: 1.44rem 0;
}

h1 {
	line-height: 1.0;
	font-weight: normal;
	font-size: 1.73rem;
	margin: 1.73rem 0;
}

aside {
	margin-top: -0.6rem;
	text-transform: uppercase;
	opacity: 0.7;
	letter-spacing: 0.05em;
	line-height: 1;
}

section#publications span.journal,
section#conferences span.conference {
	font-style: italic;
}

@media (prefers-color-scheme: light) {
	:root {
		--primary: var(--black-neural);
		--background: var(--white-neutral);
		--hover-background: var(--white-hover);
	}
}

@media (prefers-color-scheme: dark) {
	:root {
		--primary: var(--white-neutral);
		--background: var(--black-neutral);
		--hover-background: var(--black-hover);
	}
}

@media print {
	:root {
		--primary: #000000;
		--background: #ffffff;
		--accent: #000000;
	}

	h2 {
		border-bottom-width: 0.5pt;
	}

	html,
	body {
		max-width: initial;
		font-size: 10pt;
		padding: 0;
	}

	aside {
		opacity: 1.0;
	}

	a::after {
		display: none;
	}

	a:hover {
		background: inherit;
	}

	@page {
		margin: 25mm;
		size: A4;
	}
}