.root {
	max-width: 27rem;
	margin: 0 auto;
}

section {
	max-width: var(--pwidth);
}

/* narrow */
@media (max-width: 44rem) {
	.root {
		max-width: 60vw;
		margin: 0 auto;
	}
}

.root>h1 {
	font-size: 1.25em;
	padding: 8px;
}

details.arrow:not([open])>summary::after {
	content: '→';
	color: var(--link);
	margin: 0 4px;
}

details.arrow[open]>summary::after {
	content: '–';
	color: var(--visited);
	margin: 0 4px;
}

details.more,
details.arrow {
	margin-top: 8px;
}

details.more>p,
details.arrow>p {
	display: inline;
}

details.more>summary,
details.arrow>summary {
	display: inline;
	list-style-type: none;
}

details.more>summary::-webkit-details-marker,
details.arrow>summary::-webkit-details-marker {
	display: none
}

details.more:not([open])>summary::before {
	content: '[+]';
	color: var(--link);
}

details.more[open]>summary::before {
	content: '[-]';
	margin: 0 2px;
	color: var(--visited);
}

#notes,
.notes {
	margin: 0.5rem 0;
}

.notes {
	font-size: 0.75rem;
}