@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&family=Source+Serif+4:ital,opsz,wght@0,8..60,200..900;1,8..60,200..900&display=swap');

body {
	margin: auto;
	width: 80ch;
	box-sizing: border-box;
	font-family: 'Source Sans 3', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Source Serif 4', serif;
}

h1 {
	text-align: center;
}

#messages {
	width: 100%;

	> * {
		--bg: #F2F2F2;

		&:not(:first-of-type) {
			margin-block-start: 8px;
		}

		border: 2px var(--bg) solid;
		&:hover {
			border-color: blue;
			cursor: pointer;
		}

		background-color: var(--bg);
		border-radius: 4px;
		padding: 8px;

		> h3 {
			margin: 0;
			font-weight: 500;
		}
		> main {
			opacity: .7;
		}
	}
}