body {
	display: flex;
	flex-direction: column;

	overflow-wrap: break-word;

	min-height: 100vh;

	/* Common properties */
	& > header,
	& > aside > p {
		border-color: var(--accent-color);
		border-width: 5px;
		background-color: var(--primary-bg-color);
	}

	& > header {
		display: flex;
		flex-direction: column;
		align-items: center;
		row-gap: 1rem;

		padding: 0.9rem;

		border-bottom-style: solid;

		@media (min-width: 60em) {
			flex-direction: row;
			justify-content: space-between;

			padding-inline-end: 1.2rem;
		}

		& > a > img { display: block; }

		& > nav > menu {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			row-gap: 0.5rem;
			column-gap: 1rem;

			font-size: 1.1rem;
		}
	}

	& > aside {
		display: flex;
		flex-direction: column;
		column-gap: 2rem;

		@media (min-width: 60em) {
			flex-direction: row-reverse;

			padding-inline: 1rem;
		}

		& > p {
			padding: var(--prefix-gap);
			font-size: 0.9rem;

			border-style: none;
			border-bottom-style: solid;

			@media (min-width: 60em) {
				border-left-style: solid;
				border-right-style: solid;
			}
		}
	}

	& > main {
		flex: 1;

		padding: 2rem;

		background-color: var(--main-bg-color);

		@media (min-width: 60em) {
			margin-block: 2.5rem;
			margin-inline: auto;

			min-width: 25rem;
			max-width: 40rem;

			border-radius: 25px;
			box-shadow: 3px 3px 8px var(--contrast-bg-color);
		}
	}

	& > footer {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 1rem;

		padding: 0.6rem;
		font-size: 0.9rem;

		background: var(--contrast-bg-color);
		color: var(--primary-bg-color);
		text-shadow: 0px 3px 3px #000;

		& > p[rel=license] { font-size: 105%; }

		& > p a {
			color: inherit;
			text-decoration: revert;
		}
	}
}