*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;margin:0}

@view-transition {
	navigation: auto;
}

:root {
  --shadow-color: 0deg 0% 0%;
  --shadow-elevation-low:
	0px 0.3px 0.4px hsl(var(--shadow-color) / 0.04),
	0px 0.5px 0.7px -0.6px hsl(var(--shadow-color) / 0.06),
	0px 1.1px 1.4px -1.2px hsl(var(--shadow-color) / 0.09);
  --shadow-elevation-medium:
	0px 0.3px 0.4px hsl(var(--shadow-color) / 0.04),
	0px 1.2px 1.6px -0.4px hsl(var(--shadow-color) / 0.06),
	0px 2.6px 3.4px -0.8px hsl(var(--shadow-color) / 0.08),
	0px 5.7px 7.5px -1.2px hsl(var(--shadow-color) / 0.1);
  --shadow-elevation-high:
	0px 0.3px 0.4px hsl(var(--shadow-color) / 0.04),
	0px 2.3px 3px -0.2px hsl(var(--shadow-color) / 0.05),
	0px 4.2px 5.5px -0.4px hsl(var(--shadow-color) / 0.07),
	0px 6.7px 8.8px -0.6px hsl(var(--shadow-color) / 0.08),
	-0.1px 10.4px 13.7px -0.8px hsl(var(--shadow-color) / 0.09),
	-0.1px 16px 21px -1px hsl(var(--shadow-color) / 0.1),
	-0.1px 24.3px 31.9px -1.2px hsl(var(--shadow-color) / 0.12);
}

html, body {
	width: 100%;
	min-height:100vh;
	margin: 0;
	padding: 0;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-moz-font-feature-settings: "liga", "kern";
}
html {
	font-size: 100%;
	scroll-behavior: smooth;
}
body {
	-webkit-overflow-scrolling: touch;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Helvetica", "Myriad Set Pro", "Lucida Grande", "Lucida Sans Unicode", "Arial", "Verdana", "sans-serif";
	background: #fff;
	height: 100%;

	color: #202020;
	line-height: 1.7857;
	font-weight: 200;
	font-style: normal;
	font-size: 100%;
    letter-spacing: .1ch;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	margin: 0 auto;
	min-width: 320px;
	position: relative;

    display: grid;
    grid-template-columns: minmax(1em, auto) minmax(320px, 1fr);
    grid-template-rows: min-content 1fr min-content;
	gap: 0;
	padding: 0;
}

#wrapper,
#header,
#footer {
	grid-column: -1/1;
	grid-row: auto;
}
#header {
	padding: 0 3rem
}
#main section,
#footer {
	padding: 0 4rem
}


/*
 * ANCHORS
 */

a, a:active, a:hover, a:visited {
	color: inherit;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a.disabled {
	color: lightgrey;
	cursor: not-allowed;
	/* pointer-events: none; */
}

::selection {
  background: rgba(209, 123, 102, .5);
}
::-moz-selection {
  background: rgba(209, 123, 102, .5);
}

strong {
	font-weight: 500;
}
em {
	font-style: italic;
	font-weight: inherit;
}

/*
 * UTILS
 */

.sad {
	color: #c7c7c7;
	font-style: italic;
}

/*
 * ACCESSIBILITY: skip-link
 */

.skip-link {
	background: white;
	color: #000;
	font-weight: 700;
	left: 50%;
	padding: .5em 1em;
	position: fixed;
	transform: translateX(-50%) translateY(-100%);
	transition: transform .25s, opacity .3s;
	z-index: 99999999999;
	border: 1px solid grey;
	border-radius: 10%/50%;
	margin: 1em 0 0;
	opacity: 0;
}
.skip-link:focus-within {
	transform: translateX(-50%) translateY(0%);
	opacity: 1;
}
.skip-link:focus-within ~ #header::before {
	content: "";
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(0,0,0,.5);
	z-index: 999999;
}
.skip-link a:focus {
	outline: auto;
	text-decoration: underline;
}

@media (max-width: 900px) {
	.hideable {
		display: none;
	}
}
/*
 * WRAPPER
 */

#wrapper {
	font-size: 1em;
	line-height: 1.4857;
	height: auto;
	clear: both;
	margin: 0 auto;
	width: 100%;
}

/*
 * ACTION
 */

.action, .action:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: .5em 1em;
	border-radius: .75em;
	background: #575656;
	color: #fff;
	font-weight: 600;
	font-size: 1em;
	box-shadow: 0 0 4px rgba(0, 0, 0, .1);
	cursor: pointer;
	user-select: none;
	transition: all .1s ease-in;
	white-space: nowrap;
}
.action:hover {
	text-decoration: none;
	color: #e9e9e9;
	background: #000;
	box-shadow: 0 0 0 .25em #000;
	transform: scale(1.05);
 }
.action:active {
	background: #444;
	transform: scale(1);
}

#main .action {
	align-self: center;
}
/*
* MAIN
*/

#main {
    /* margin-top: 8rem; */
    margin-bottom: 4rem;
    gap: 8rem .5em;
    display: flex;
    flex-direction: column;
}

#main section {
    padding: 0 4rem;
    gap: 1em 0;
}
#main section > h1:first-child {
    left: 0;
    font-size: 2.5em;
    font-weight: 600;
    color: #3b3936;
}
#header {
	padding-top: 1rem;
	padding-bottom: 1rem;
	/* background: rgba(242, 242, 246, .8); */
	background: rgba(233, 233, 233, .8);
	position: sticky;
	top: 0;
	z-index: 99999;
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
}

#menu-checkbox {
	display: none;
}

#header > div,
#header nav ul {
	display: flex;
}
#header nav {
	flex: 1 0 auto;
}
#header > div {
	justify-content: space-between;
}
#header nav ul {
	justify-content: end;
	gap: 0 3em;
}
#header a {
	color: #3b3936;
}

#header label[for=menu-checkbox] {
	display: none;
}

#header a {
	font-weight: 600;
	text-decoration: none;
	padding: .5em 1em;
	border-radius: .75em;
	white-space: nowrap;
	cursor: pointer;
}
#header a:hover {
	background: rgba(211, 211, 211, .75);
}
#header li.active a {
	font-weight: 900;
}
/*
 * BREADCRUMB
 */

#breadcrumb {
    text-align: center;
    /* height: 92vh; */

    font-size: 4em;
    text-align: center;
    padding: 1em 0;

    background: #ededed;
    background: linear-gradient(180deg, rgba(237, 237, 237, 1) 0rem, rgba(237, 237, 237, 1) 2rem, rgba(237, 237, 237, 0) 100%);
}

#breadcrumb h2 {
    line-height: 1;
    font-size: .7em;
    font-weight: 200;
    font-style: italic;
}
nav.pagination {
	text-align: center;
	font-size: 1.2em;
	line-height: 1;
    margin: 1rem auto;
    width: 100%;
}
nav.pagination:first-child {
    margin-top: 0;
}

.pagination ul {
	display: flex;
	gap: 1em;
	justify-content: center;
	flex-wrap: wrap;
}
.pagination a {
	display: inline-block;
	border: 1px solid transparent;
	border-radius: 1em;
	padding: 1em;

	z-index: 1000;
	text-align: center;
	font-size: 1em;
	line-height: 1;
	transition: border-color .5s;
}
.pagination a:hover {
	border-color: var(--color-border);
}
.pagination a {
	cursor: pointer;
}
.pagination li.active a {
	background: #ffba84;
	font-weight: 600;
}
.pagination li.inactive a {
	line-height: 1;
	border-color: transparent;
}

.pagination a,
.pagination a:active,
.pagination a:visited {
	color: var(--color-text);
	text-decoration: none;
}
.pagination a:hover,
.pagination a:focus {
	color: var(--color-text-muted);
}
.pagination li.active a, .pagination li.inactive a {
	pointer-events: none;
	cursor: auto;
	color: color-mix(in srgb, var(--color-text) 80%, var(--color-warning) 20%);
}
.pagination li.active a {
	color: var(--color-text-strong);
}

.pagination li:first-child a::before,
.pagination li:last-child a::before {
	content: '<';
	color: var(--color-text-soft);
	position: relative;
	top: -.1em;
}
.pagination li:last-child a::before {
	content: '>';
}

.pagination li.spacer {
	background: none;
	border: none;
	margin: 0;
	vertical-align: top;
	color: var(--color-text-soft);
}

.pagination span {
	display: none;
}
/*
 * FOOTER
 */

#footer {
	clear: both;
	position: relative;
	color: var(--color-text-soft);
	font-size: 1em;
	line-height: 2;
	font-weight: 400;

	z-index: 0;
	margin: 0 auto;
	padding: 0 1rem;
	width: 100%;

	grid-row: 3/3;
	grid-column: 2/3;

	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 2ch;
}
#footer > * {
	flex: 1 0 auto;
}

#footer nav a::before,
#langSelector label::before {
	content: "";
	speak: none;
	display: inline-block;
	width: 1em;
	height: 1em;
	position: relative;
	padding-right: 2ch;
	background-repeat: no-repeat;
	top: .1em;
}
#footer nav {
	display: flex;
	justify-content: end;

	gap: 2ch;
}

#footer nav a span {
	padding-left: .4ch;
}
#footer nav a span {
	display: none;
}
#langSelector {
	flex: 0 1 auto;
}
#langSelector label span {
	display: none;
}
#langSelector label::before {
	background-image: url("data:image/svg+xml,%3Csvg clip-rule='evenodd' fill-rule='evenodd' viewBox='0 0 77 77' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23808080' fill-rule='nonzero' stroke='%23000' stroke-width='.5' transform='translate(-5.80516 73.5093)'%3E%3Cpath d='m44.061 1.971c20.551 0 37.228-16.674 37.228-37.225s-16.677-37.225-37.228-37.225c-20.548 0-37.225 16.674-37.225 37.225s16.677 37.225 37.225 37.225zm0-2.136c-19.369 0-35.086-15.72-35.086-35.089s15.717-35.089 35.086-35.089c19.368 0 35.088 15.72 35.088 35.089s-15.72 35.089-35.088 35.089z'/%3E%3Cpath d='m44.061 1.569c9.302 0 18.217-14.202 18.217-36.725 0-22.533-8.911-36.74-18.217-36.74-9.307 0-18.215 14.207-18.215 36.74 0 22.523 8.912 36.725 18.215 36.725zm0-1.735c-8.544 0-15.995-16.251-15.995-34.99 0-19.661 7.451-35.005 15.995-35.005 8.546 0 15.998 15.344 15.998 35.005 0 18.739-7.452 34.99-15.998 34.99z'/%3E%3Cpath d='m44.061 1.34c.563 0 1.061-.452 1.061-1.061v-71.039c0-.609-.498-1.061-1.061-1.061-.606 0-1.061.452-1.061 1.061v71.039c0 .609.455 1.061 1.061 1.061zm-24.985-11.27c5.661-4.008 14.091-6.25 24.985-6.25 10.896 0 19.323 2.242 24.988 6.25.539.431 1.155.305 1.506-.133.351-.439.267-1.106-.223-1.458-5.351-4.055-14.948-6.827-26.271-6.827-11.321 0-20.917 2.772-26.268 6.827-.491.352-.575 1.019-.269 1.458.396.438 1.009.564 1.552.133zm-10.512-24.263h71.016c.609 0 1.061-.452 1.061-1.061s-.452-1.061-1.061-1.061h-71.016c-.563 0-1.061.452-1.061 1.061s.498 1.061 1.061 1.061zm35.497-17.772c11.323 0 20.92-2.772 26.271-6.827.49-.351.574-1.019.223-1.457-.351-.439-.967-.565-1.506-.133-5.665 4.007-14.092 6.25-24.988 6.25-10.894 0-19.324-2.243-24.985-6.25-.543-.432-1.156-.306-1.552.133-.306.438-.222 1.106.269 1.457 5.351 4.055 14.947 6.827 26.268 6.827z'/%3E%3C/g%3E%3C/svg%3E");
}
#langSelector select {
	position: relative;
	top: -.3ch;
}

#footer a[href="help"]::before,
#footer a[href="https://telescope.studio.rd.inai.re/documentation"]::before {
	background-image: url("data:image/svg+xml,%3Csvg clip-rule='evenodd' fill-rule='evenodd' viewBox='0 0 77 77' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke-width='.5'%3E%3Cg fill='none'%3E%3Cpath d='m38.255 58.847c11.325 0 20.596-9.222 20.596-20.592 0-11.324-9.271-20.591-20.596-20.591-11.37 0-20.591 9.267-20.591 20.591 0 11.37 9.221 20.592 20.591 20.592z' stroke='%23000'/%3E%3Cpath d='m38.255 56.647c-10.129 0-18.392-8.259-18.392-18.392 0-10.132 8.263-18.392 18.392-18.392 10.133 0 18.396 8.26 18.396 18.392 0 10.133-8.263 18.392-18.396 18.392z' stroke='%23810000'/%3E%3Cpath d='m38.255 75.48c20.552 0 37.228-16.673 37.228-37.225 0-20.551-16.676-37.224-37.228-37.224-20.547 0-37.224 16.673-37.224 37.224 0 20.552 16.677 37.225 37.224 37.225z' stroke='%23810000'/%3E%3Cpath d='m38.255 73.235c-19.356 0-35.021-15.624-35.021-34.98s15.665-34.979 35.021-34.979 34.98 15.623 34.98 34.979-15.624 34.98-34.98 34.98z' stroke='%23000'/%3E%3C/g%3E%3Cpath d='m11.439 60.775c1.405 1.667 2.922 3.142 4.523 4.475l10.297-10.258c-1.779-1.339-3.33-2.823-4.568-4.504z' fill='%23810000' fill-opacity='.5' fill-rule='nonzero' stroke='%23810000'/%3E%3Cpath d='m11.366 15.823 10.318 10.228c1.308-1.749 2.8-3.274 4.542-4.496l-10.256-10.301c-1.633 1.348-3.171 2.866-4.604 4.569z' fill='%23810000' fill-opacity='.5' fill-rule='nonzero' stroke='%23810000'/%3E%3Cpath d='m65.26 15.991c-1.416-1.707-2.924-3.225-4.521-4.558l-10.27 10.27c1.796 1.317 3.272 2.844 4.49 4.544z' fill='%23810000' fill-opacity='.5' fill-rule='nonzero' stroke='%23810000'/%3E%3Cpath d='m65.226 60.562-10.272-10.272c-1.286 1.811-2.802 3.317-4.52 4.557l10.287 10.247c1.668-1.39 3.163-2.906 4.505-4.532z' fill='%23810000' fill-opacity='.5' fill-rule='nonzero' stroke='%23810000'/%3E%3C/g%3E%3C/svg%3E");
}
#footer a[href="legal"]::before {
	background-image: url("data:image/svg+xml,%3Csvg clip-rule='evenodd' fill-rule='evenodd' viewBox='0 0 62 77' xmlns='http://www.w3.org/2000/svg'%3E%3Cg stroke-width='.5'%3E%3Cpath d='m1.031 45.844c0 11.728 6.492 15.286 27.19 28.301.665.404 1.642.872 2.497.872s1.831-.468 2.497-.872c20.834-12.739 27.19-16.573 27.19-28.301v-28.759c0-4.231-1.087-5.633-5.159-7.179-7.043-2.708-14.668-5.787-21.756-8.289-.98-.342-1.831-.586-2.772-.586-.942 0-1.796.251-2.772.586-7.043 2.656-14.714 5.585-21.802 8.289-4.026 1.497-5.113 2.948-5.113 7.179z' fill='none' stroke='%23454545'/%3E%3Cpath d='m3.242 45.769v-8.793h27.476v-33.724c.527 0 1.375.276 2.363.653 3.885 1.446 18.554 7.106 22.407 8.618 2.147.838 2.702 1.959 2.702 4.972v19.481h-27.472v35.8c-.677 0-1.445-.465-1.991-.834-17.854-11.636-25.485-14.852-25.485-26.173z' fill='%239e9e9e' fill-rule='nonzero' stroke='%23000'/%3E%3C/g%3E%3C/svg%3E");
}

/*
 * DEBUG
 */
#debug {
	margin-top: 3rem;
	padding: 1rem;
}
#debug > summary {
	text-align: center;
	margin-top: -1.7em;
	cursor: pointer;
	color: var(--color-text-soft);
}
#debug[open] {
	border: 1px solid var(--color-border);
	border-radius: 1rem;
}
#debug[open] > summary {
	margin-top: 0;
	font-size: 1.5rem;
	font-weight: 200;
	color: var(--color-text-strong);
}
#debug dt {
	float: left;
	margin-right: 1em;
}
#debug dd {
	display: table;
	background: var(--color-surface-muted);
	color: var(--color-text);
	margin: .1em;
	padding: 0 .4em;
	border-radius: 5px;
}

@media print {
	#footer {
		color: var(--color-text);
		text-align: center;
		grid-column: -1/1;
	}
	#footer nav,
	#langSelector,
	#debug {
		display: none;
	}
}

@media (max-width: 1200px) {
	#footer {
		padding: 0;
	}
	#footer .copyright {
		display: none;
	}
	#footer nav {
		justify-content: start;
	}
}
