.wiki {

	.nav {
		& {padding: 0 var(--site-padding); border: 0 solid var(--c-bg-light); border-width: 1px 0; margin-top: -3px; display: none;}
		svg {font-size: 19px;}
		.menu {padding: 10px; margin: 0 -10px; box-sizing: content-box; display: flex; align-items: center; gap: 10px; text-transform: uppercase; font-size: 14px; font-weight: 700; cursor: pointer;}
	}

	& {padding-top: var(--nav-height) !important;}

	.section-title {margin: 10px 0; text-transform: uppercase; font-size: .75em; color: var(--c-title); font-weight: 700;}

	#wiki-menu-toggle {display: none;}

	.sidebar {

		& {overflow-y: auto;}
		.section {margin: 30px 0;}
		.section a {text-decoration: none; display: block; display: flex; gap: 10px; color: var(--c-text); margin: 5px 0;}
		.section a.active .title {font-weight: 700;}

	}

	.content {grid-area: content; text-align: justify;}
	.content :is(h1, h2, h3, h4) {margin: 15px 0; margin-top: 30px;}
	.content h1 {font-size: 1.8em;}
	.content h2 {font-size: 1.5em;}
	.content h3 {font-size: 1.2em;}
	.content h4 {font-size: 1em;}

	p, ul {margin: 10px 0;}

	code {background: #0005; padding: 0 5px; border-radius: 5px; border: 2px solid #fff1;}

	:is(.wiki-head, .markdown) img, video {max-width: 100%; border-radius: 15px; border: 1px solid var(--c-bg-light); margin: 15px 0;}

	.wiki-head {
		& {margin: 30px 0;}
		img {width: 100%; display: block; margin: 30px 0; max-height: 250px; object-fit: cover;}
		h1 {display: flex; gap: 13px; margin: 13px 0;}
		p {font-weight: 700; font-size: 1.1em;}
		.section-title {color: var(--c-text);}
	}

	.wiki-footer {
		& {margin-top: 35px;}
		.navigation {
			& {display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 20px;}
			a {display: grid; align-items: center; border: 1px solid var(--c-bg-light); border-radius: 15px; padding: 12px 20px; text-decoration: none;}
			.prev {text-align: right; grid-template-columns: 1fr max-content; padding-left: 10px;}
			.next {grid-template-columns: 1fr max-content; padding-right: 10px;}
			svg {width: 40px; height: 40px;}
			small {color: var(--c-text);}
		}
		.authors {
			& {display: inline-flex; flex-direction: row-reverse; align-items: center; gap: 12px; margin-bottom: 10px;}
			img {border-radius: 50%; max-width: 40px; border: 3px solid var(--c-bg-light);}
			a:not(:first-child) {display: flex;}
			a:not(:last-child) {margin-left: -25px;}
		}
		.last-updated {font-size: .8em;}
	}

	@media screen and (min-width: 900px) {
		.sidebar {position: sticky; top: var(--nav-height); max-height: calc(100vh - var(--nav-height)); bottom: 0;}
		.inner {margin-top: 0; display: grid; align-items: start; grid-template-columns: 250px 1fr; gap: 60px; grid-template-areas: "sidebar content";}
	}

	@media screen and (max-width: 899px) {
		.inner {margin-top: -10px;}
		.sidebar {position: fixed; top: 0; left: -300px; z-index: 100; background: var(--c-bg); width: 100%; max-width: 300px; height: 100%; padding: 0 30px; opacity: 0; transition: opacity .3s, left .3s; pointer-events: none;}
		.sidebar label {transition: left .3s; position: fixed; top: 0; left: 0; right: 0px; height: 100%; z-index: -1; background: #0005;}
		#wiki-menu-toggle:checked + .sidebar {left: 0; opacity: 1; pointer-events: all;}
		#wiki-menu-toggle:checked + .sidebar label {left: 300px;}
		.nav {display: block;}
		.wiki-head > :nth-child(1) {margin-top: 35px;}
		.wiki-head > h1:nth-child(1) {margin-top: 40px;}
	}

	@media screen and (max-width: 600px) {
		.wiki-footer .navigation {grid-template-columns: 1fr;}
	}

}