a:hover {
	background: #50f4;
	color: #000;
	text-decoration: none;
}
abbr:hover { cursor: help; }

nav * { line-height: 1.6; }
nav > ul {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
}
nav li { margin: .5rem; }
nav > ul :first-child { margin-left: 0; }
nav >:first-child a {
	color: #000;
	font-family: var(--serif);
	font-weight: 700;
	letter-spacing: .05rem;
	text-decoration: none;
}
.cover > img { 
	max-width: 200px;
	padding: 2rem 0;
}

.feed-header,
.feed-subheader {
	display: flex;
	align-items: baseline;
}
.feed-header > span,
.feed-subheader > span { margin-right: 1rem; }
.feed-subheader > span { margin-left: 1rem; }
.feed-header-sep {
	border-bottom: 1px solid #000;
	width: 100%;
}
.feed-subheader >:first-child { width: 2rem; }
.feed {
	list-style: none;
	padding: 0;
}

.masonry {
	margin: 1rem 0;
	text-align: center;
}
.masonry a {
	color: #000;
	margin: .5rem .5rem .5rem 0;
	text-decoration: none;
	/*white-space: pre;*/
}

article img,
p > img { max-width: 100%; }

@media (min-width: 550px) {
	nav {
		display: flex;
		align-items: center;
	}
	nav ul { align-items: center; }
	nav > div,
	nav .li {
		align-self: center;
		border: 1px solid #ccc;
		border-left-width: 0;
		border-right-width: 0;
		border-top-width: 0;
		border-bottom-width: 1px;
		padding: .5rem .75rem;
	}
	nav > ul li {
		line-height: 1.75;
		margin: 0;
	}

	nav > div {
		height: 100%;
		width: 100%;
		align-self: flex-end;
	}
	nav .active {
		border-width: 1px;
		border-bottom-width: 0;
	}
	nav .active:hover {
		background: unset;
		color: inherit;
	}

	.sxs {
		display: flex;
		flex-flow: row;
	}
}

@media(prefers-color-scheme: dark) {
	nav >:first-child a { color: #fff; }
	a:hover {
		background: #99f9;
		color: #fff;
	}
	.masonry a { color: #fff; }
	.feed-header-sep { border-color: #ccc; }
}