/* The site's menu strip, for the hosts whose pages this site does not generate:
   the documentation (htmldoc.php) and the blog (a Jekyll include). Only the nav, so
   that doc.css and the blog's own theme keep owning everything else.

   Every var() carries a literal fallback, which is what makes one file serve
   both: the documentation defines these tokens, dark mode included, and the
   blog defines none of them and gets the light palette. An undefined var() with
   no fallback would resolve to the property's initial value, not to the literal
   declaration above it. */

.sitenav {
	max-width: 68rem;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 1px;
	background: #000;
	background: var(--hairline, #000);
}

/* Tabs are blocks first: a browser without flexbox stacks them, still legible. */
.sitenav a, .sitenav .current {
	flex: 1 1 8rem;
	display: block;
	line-height: 1.2;
	padding: .3rem .5rem;
	text-align: center;
	font-family: "League Spartan", system-ui, -apple-system, "Segoe UI", Roboto, "Trebuchet MS", sans-serif;
	font-weight: 700;
	font-size: 1rem;
	text-decoration: none;
	background: #99c;
	background: var(--accent, #99c);
	color: #111;
	color: var(--ink, #111);
}

.sitenav a:hover { background: var(--chip, #dde); color: var(--ink, #111); }
.sitenav .current { background: #ccd; background: var(--panel, #ccd); }

/* The manual's own strip stacks flush under the site menu and reads as
   subordinate to it, as the Information strip does on www. */
.sitenav + .sitenav { border-top: 1px solid #000; border-top-color: var(--hairline, #000); }
.sitenav.sub a, .sitenav.sub .current { font-weight: normal; font-size: .92em; }

@media (prefers-color-scheme: dark) {
	/* Only for a host that has no palette of its own; where one exists its own
	   dark values come through the var()s above. */
	.sitenav { background: var(--hairline, #171a2b); }
	.sitenav + .sitenav { border-top-color: var(--hairline, #171a2b); }
}

/* site.css drops the strip on paper; the hosts that get it injected never had
   the rule, and doc.css's own print block cannot see a nav it does not ship. */
@media print {
	.sitenav { display: none; }
}