@layer layout {
	html,
	body {
		margin: 0;
		padding: 0;
	}

	html {
		background: white;
		color: black;
	}

	body {
		font-size: clamp(1.1em, calc(0.5em + 1vw), 3em);
		line-height: 1.42;
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
	}

	main {
		font-weight: 300;
		width: 90vw;
		max-width: 40em;
		margin: 0 auto;
		padding: 4rem 0;
	}

	main img {
		width: 100%;
		height: auto;
	}

	main :is(h1, h2, h3) {
		font-family: Georgia, 'Times New Roman', Times, serif;
	}

	main h1 {
		font-size: 3em;
	}

	main h2 {
		font-size: 2em;
		margin-top: 5rem;
		border-bottom: 1px solid #ccc;
	}

	a, a:visited {
		color: blue;
	}

	figcaption {
		text-align: center;
		font-style: italic;
		font-size: 75%;
	}
}