/* Header
======================================== */
header{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	padding: var(--page-top) var(--page-sides) var(--rows-gap);
	display: grid;
	grid-auto-flow: column;
	grid-auto-rows: min-content;
	grid-auto-columns: max-content;
	column-gap: var(--cols-gap);
	-webkit-user-select: none;
		-moz-user-select: none;
		 -ms-user-select: none;
			  user-select: none;
	z-index: 9;
}
header:not([id]){
	background: linear-gradient(var(--color-bg) var(--height-gradient), transparent);
}
header .link-active,
.desktop header a:hover,
.mobile header a:active{
	color: var(--color-txt--highlight);
}
@media (max-width: 600px){
	header a:not(#logo){
		display: none;
	}
}
@media (min-width: 361px) and (max-width: 600px){
	header{
		padding-left: calc(var(--page-sides) + var(--txt-indent));
	}
}