/*
-----------------------------------------------
	vars – css custom-properties

	NOTE
	- some vars change inside media-queries!
	- under normal conditions, there's no need to touch these
-----------------------------------------------
*/
:root {
	--nav-h:       6rem;
	--top-offset:  6rem;
	--sidebar-w:  30rem;
	--sidebar-mid-w: 36rem;
	--sidebar-large-w: 48rem;
	--main-width: 80rem;
	--side-nav:  3.2rem;
	--side-page:   var(--side-nav);

	/* easings */
	--out-back:    cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@media screen and (min-width: 768px) {
	:root {
		--side-page:  14vw;
		--top-offset: 10rem;
		--side-nav: 4.8rem;
	}
}

/*	theme vars */
.theme-default {
	--back:       	#ffffff;
	--back-light: 	#f6fafd;
	--back-api: 		#eff8ff;
	--prime:      	#ff3e00;
	--second:     	#676778;
	--flash:      	#40b3ff;
	--heading:	var(--second);
	--text:      		#444;
	--sidebar-text: rgba(255, 255, 255, .75);
	--border-w:  		.3rem; /* border-width  */
	--border-r:  		.4rem; /* border-radius */
}

/*	typo vars */
.typo-default {
	--code-fs: 1.3rem;
	--h6:      1.4rem;
	--h5:      1.6rem;
	--h4:      1.8rem; /* default font-size */
	--h3:      2.6rem;
	--h2:        3rem;
	--h1:      3.2rem;
	--linemax:   42em; /* max line-length */
	--lh:  		 	  1.5; /* base line-height */
}

body {
	--font: 'Overpass', sans-serif;
	--font-mono: 'Fira Mono', monospace;
}


/*	fonts ---------------------------------- */
/* overpass-300normal - latin */
@font-face {
	font-family: 'Overpass';
	font-style: normal;
	font-weight: 300;
	src:
		local('Overpass Light '),
		local('Overpass-Light'),
		url('/fonts/overpass/overpass-latin-300.woff2') format('woff2');
}

/* overpass-600normal - latin */
@font-face {
	font-family: 'Overpass';
	font-style: normal;
	font-weight: 600;
	src:
		local('Overpass Bold '),
		local('Overpass-Bold'),
		url('/fonts/overpass/overpass-latin-600.woff2') format('woff2');
}

/* fira-mono-400normal - latin */
@font-face {
	font-family: 'Fira Mono';
	font-style: normal;
	font-weight: 400;
	src:
		local('Fira Mono Regular '),
		local('Fira Mono-Regular'),
		url('/fonts/fira-mono/fira-mono-latin-400.woff2') format('woff2');
}

/*	base reset ----------------------------- */
html {
	font-size: 62.5%;
	-webkit-text-size-adjust: 100%;
	-ms-overflow-style: -ms-autohiding-scrollbar;
	box-sizing: border-box;
	border-collapse: collapse;
}

html,
body,
#sapper {
	width: 100%;
	height: 100%;
}

* {
	box-sizing: inherit;
	margin: 0;
	padding: 0;
}

/*	link reset ----------------------------- */
a {
	text-decoration: none;
	cursor: pointer;
	color: inherit;
}

a:hover, a:active { color: var(--flash) }
a:focus { outline: none }

/*
-----------------------------------------------
	global styles
-----------------------------------------------
*/

/*	typography ----------------------------- */
body {
	font: 300 var(--h4)/var(--lh) var(--font);
	background-color: var(--back);
	color: var(--text);

	/* default spacing of Overpass is a bit too airy */
	/* letter-spacing: -.013em; */
}

h1, h2, h3, h4, h5, h6, blockquote {
	position: relative;
	margin: 0;
	color: var(--heading);
}

/* h1, h2, h3, h4, h5, h6 { font-weight: 600 } */
h6 { font-size: var(--h6) }
h5 { font-size: var(--h5) }
h4 { font-size: var(--h4) }
h3 { font-size: var(--h3) }
h2 { font-size: var(--h2) }
h1 { font-size: var(--h1) }

h1, h2 {
	font-family: var(--font);
	line-height: 1.25;
}

h3 { font-weight: 300 }

p, ol, ul {
	margin: 0 0 1em 0;
}

.b, b, strong { font-weight: 600 }

tt, code, kbd, samp {
	font: 400 var(--code-fs)/1.7 var(--font-mono);
}

code {
	position: relative;
	border-radius: .3em;
	white-space: nowrap;
	color: #444;
	-webkit-font-smoothing: initial;
}

pre code {
	top: 0;
	white-space: inherit;
	background-color: none;
}

/* sync CodeMirror with prism  */
.CodeMirror {
	font-size: var(--code-fs) !important;
}

::selection {
	background: var(--flash);
	color: white;
}

/*	opinionated styles --------------------- */

li:not(.white) > h2 {
	color: var(--second)
}

blockquote {
	position: relative;
	margin: 1.6rem 0 2.4rem;
	padding: 2rem 2.4rem 1.8rem 2.4rem;
	border-radius: var(--border-r);
	font-family: var(--font);
	max-width: var(--linemax);
}

blockquote p {
	font-size: var(--h5);
}

blockquote :last-child {
	margin: 0;
}

/*  buttons -------------------------------- */
button {
	font-family: inherit;
	font-size: inherit;
	background-color: transparent;
	border: none;
	color: currentColor;
	cursor: pointer;
}

button:focus,
.btn:focus { outline: 0 }

button[disabled],
.btn[disabled],
.btn:hover[disabled] {
	opacity: .55;
	pointer-events: none;
}

button > svg,
.btn > svg {
	position: relative;
	top: -.1rem;
	width: 2rem !important;
	height: 2rem !important;
	stroke: currentColor !important;
}

/*  reset ------- */
.btn {
	--btn-h: 4rem;
	--btn-outline: .2rem;
	--btn-font: var(--font);
	--btn-calc-h: calc(var(--btn-h) - var(--btn-outline) * 2);
	--btn-hover: linear-gradient(to top, rgba(0,0,0,.07), rgba(0,0,0,.07));

	position: relative;
	margin: 0 .8rem .8rem 0;
	vertical-align: middle;
	white-space: nowrap;
	display: inline-block;
	zoom: 1;
	border: none transparent;
	font: var(--h4) var(--btn-font);
	border-radius: var(--border-r);
	color: currentColor;
	cursor: pointer;
}

/*  default */
.btn {
	line-height: var(--btn-h);
	height: var(--btn-h);
	padding: 0 1.6rem;
	transition: all .1s;
}

.btn:hover  {
	transform: scale(.98);
	mix-blend-mode: multiply;
	background-image: var(--btn-hover);
}

/*  optional */
.btn[outline] {
	line-height: var(--btn-calc-h);
	height: var(--btn-calc-h);
	border: var(--btn-outline) solid currentColor;
	background-color: white;
	color: currentColor;
}

/*  links ------------------------------------- */
a {
	position: relative;
	padding: 0 0 1px 0;
	border-bottom: 1px solid currentColor;
	user-select: none;
	color: var(--prime);
	transition: color .2s, border .2s, padding .2s;
}

a:hover  {
	color: var(--flash);
}

a:hover {
	padding: 0;
	border-bottom: 2px solid currentColor;
}

a.no-underline {
	border-bottom: none;
	padding: 0;
}

/* a:hover:not(.disabled) > .icon { stroke: var(--flash) } */

/*  lists ---------------------------------- */
.listify ol,
.listify ul {
	--list-padding: 2.9rem;

	list-style: none;
	color: currentColor;
	margin-left: var(--list-padding);
}

.listify ol > li,
.listify ul > li {
	max-width: calc(var(--linemax) - var(--list-padding));
	line-height: 1.5;
	margin: 0 0 0.4rem 0;
}

.listify ul > li:before {
	content: '';
	position: absolute;
	margin-top: 1.1rem;
	margin-left: -1.8rem;
	background-color: var(--second);
	width: .6rem;
	height: .6rem;
	border-radius: 2px;
	opacity: 0.7;
}

.listify ol { list-style: decimal }

/*  tables --------------------------------- */
table {
	width: 100%;
	font-size: var(--h5);
}

td, th {
	text-align: left;
	border-bottom: 1px solid #eee;
	padding: 0.4rem 0.8rem 0.4rem 0;
}

table code, table span {
	white-space: pre;
}

/*	grid ----------------------------------- */
.grid, .grid.half {
	display: grid;
	grid-gap: 2.4rem;
	grid-template-columns: 1fr;
	align-items: center;
}

.grid.stretch { align-items: stretch }

.grid > .cols-2,
.grid > .cols-3 { grid-column: span 1 }

@media screen and (min-width: 840px) {
	.grid.half,
	.grid { grid-template-columns: repeat(2, 1fr) }
	.grid > .cols-2,
	.grid > .cols-3 { grid-column: span 2 }
}

@media screen and (min-width: 1100px) {
	.grid { grid-template-columns: repeat(3, 1fr) }
	.grid > .cols-2 { grid-column: span 2 }
	.grid > .cols-3 { grid-column: span 3 }
}

/*	helper styles -------------------------- */
.flex-auto { flex: 1 0 auto }

.py0 {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

.legend, figcaption, .post aside {
	max-width: none;
	margin: 0 auto;
	padding: 1.6rem 0 0 .8rem;
	font: 1.2rem/1.6 var(--font-mono);
}

.filename {
	display: inline-block;
	padding: 1.6rem 0 0 1rem;
	font: var(--h6) var(--font-mono);
}

.box {
	padding: 2.4rem 3.2rem;
	border-radius: var(--border-r);
}

/*	theme colors --------------------------- */
.prime      { color: var(--prime) !important }
.second     { color: var(--second) !important }
.flash      { color: var(--flash) !important }
.black      { color: black !important }
.white      { color: white !important }

.back       { background-color: var(--back) !important }
.back-light { background-color: var(--back-light) !important }
.bg-prime   { background-color: var(--prime) !important }
.bg-second  { background-color: var(--second) !important }
.bg-flash   { background-color: var(--flash) !important }

/*	inputs --------------------------------- */
input[type="checkbox"] {
	/* display: block; */
	position: relative;
	height: 1em;
	width: calc(100% - 0.6em);
	max-width: 2em;
	top: -2px;
	border-radius: 0.5em;
	-webkit-appearance: none;
	outline: none;
	margin: 0 0.6em 0 0;
}

input[type="checkbox"]::before {
	content: "";
	position: absolute;
	display: block;
	height: 100%;
	width: 100%;
	padding: 2px;
	border-radius: 1em;
	top: 0;
	left: 0;
	background: var(--second);
	/* box-sizing: border-box; */
	box-sizing: content-box;
}

input[type="checkbox"]:checked::before {
	background: var(--prime);
}

input[type="checkbox"]::after {
	content: "";
	position: absolute;
	display: block;
	height: 1em;
	width: 1em;
	top: 2px;
	left: 2px;
	border-radius: 1em;
	background: white;
	box-shadow: 0 0px 1px rgba(0,0,0,.4), 0 4px 2px rgba(0,0,0,.1);
	-webkit-transition: background .2s ease-out, left .2s ease-out;
}

input[type="checkbox"]:checked::after {
	left: calc(100% - 9px);
}
.progress-container.svelte-2v07tr{position:absolute;top:0;left:0;width:100%;height:4px;z-index:999}.progress.svelte-2v07tr{position:absolute;left:0;top:0;height:100%;background-color:var(--prime);transition:width 0.4s}.fade.svelte-2v07tr{position:fixed;width:100%;height:100%;background-color:rgba(255,255,255,0.3);pointer-events:none;z-index:998;animation:svelte-2v07tr-fade 0.4s}@keyframes svelte-2v07tr-fade{from{opacity:0 }to{opacity:1 }}
html{--prime:rgb(60, 90, 253) !important}main.svelte-we1jc8{position:relative;margin:0 auto;padding:var(--nav-h) 0 0 0;overflow-x:hidden}
h1.svelte-8od9u6,p.svelte-8od9u6{margin:0 auto}h1.svelte-8od9u6{font-size:2.8em;font-weight:700;margin:0 0 0.5em 0}p.svelte-8od9u6{margin:1em auto}@media(min-width: 480px){h1.svelte-8od9u6{font-size:4em}}
section.svelte-1ojx4sy{position:relative;margin:10rem auto;padding:0 var(--side-nav);max-width:120rem}section.svelte-1ojx4sy h3{color:var(--text)}
.blurb.svelte-dwakau{display:grid;grid-row-gap:1em;grid-template-areas:"one"
			"two"
			"three"
			"what"
			"how"}.box.svelte-dwakau{padding:1em;display:flex;flex-direction:column;border-bottom:none}.box.svelte-dwakau a{color:white;padding:0;border:none}.box.svelte-dwakau h2{padding:0;margin:0 0 0.5em 0;font-size:var(--h2);color:white;text-align:left}.blurb.svelte-dwakau p{font-size:var(--h5)}.box.svelte-dwakau .learn-more{display:block;position:relative;text-align:right;margin-top:auto;padding:0 1.2em 0 0}.box.svelte-dwakau:hover .learn-more{color:white;text-decoration:underline}.box.svelte-dwakau .learn-more::after,.box.svelte-dwakau .cta a::after{content:'';position:absolute;display:block;right:0;top:0.35em;width:1em;height:1em;background:url(/icons/arrow-right.svg)}.how.svelte-dwakau{min-width:0}.how.svelte-dwakau .cta a{display:inline-block;text-align:right;background-color:var(--prime);padding:0.5em 1.8em 0.5em 1em;border-radius:var(--border-r);color:white;position:relative}.how.svelte-dwakau .cta a::after{right:0.5em;top:0.75em}.what.svelte-dwakau{margin:2em 0 0 0}.how.svelte-dwakau .cta{margin:0}@media(min-width: 900px){.blurb.svelte-dwakau{grid-column-gap:1em;grid-row-gap:1em;grid-template-columns:repeat(2, 1fr);grid-template-areas:"one two"
				"three how"
				"what what"}.box.svelte-dwakau{padding:2em}.box.svelte-dwakau .cta{text-align:right}}@media(min-width: 1200px){.blurb.svelte-dwakau{grid-column-gap:1em;grid-row-gap:5em;grid-template-columns:repeat(6, 1fr);grid-template-areas:"one one two two three three"
				"what what what how how how"}.what.svelte-dwakau{margin:0}.box.svelte-dwakau .cta{text-align:left}}
.icon.svelte-5yec89{position:relative;overflow:hidden;vertical-align:middle;-o-object-fit:contain;object-fit:contain;-webkit-transform-origin:center center;transform-origin:center center;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}
.reference-toc.svelte-mm3tjv li.svelte-mm3tjv{display:block;line-height:1.2;margin:0 0 4rem 0}a.svelte-mm3tjv{position:relative;transition:color 0.2s;border-bottom:none;padding:0;color:var(--second)}.section.svelte-mm3tjv{display:block;padding:0 0 .8rem 0;font-size:var(--h6);text-transform:uppercase;letter-spacing:0.1em;font-weight:600}.subsection.svelte-mm3tjv{display:block;font-size:1.6rem;font-family:var(--font);padding:0 0 0.6em 0}.section.svelte-mm3tjv:hover,.subsection.svelte-mm3tjv:hover,.active.svelte-mm3tjv{color:var(--flash)}.subsection[data-level="4"].svelte-mm3tjv{padding-left:1.2rem}.icon-container.svelte-mm3tjv{position:absolute;top:-.2rem;right:2.4rem}@media(min-width: 832px){a.svelte-mm3tjv{color:var(--sidebar-text)}a.svelte-mm3tjv:hover,.section.svelte-mm3tjv:hover,.subsection.svelte-mm3tjv:hover,.active.svelte-mm3tjv{color:white
		}}
aside.svelte-a3bmb2{position:fixed;background-color:white;left:0.8rem;bottom:0.8rem;width:2em;height:2em;overflow:hidden;border:1px solid #eee;box-shadow:1px 1px 6px rgba(0,0,0,0.1);transition:width 0.2s, height 0.2s}aside.svelte-a3bmb2 button.svelte-a3bmb2{position:absolute;bottom:0;left:0;width:3.4rem;height:3.4rem}aside.open.svelte-a3bmb2{width:calc(100vw - 3rem);height:calc(100vh - var(--nav-h))}aside.open.svelte-a3bmb2::before{content:'';position:absolute;top:0;left:0;width:calc(100% - 2rem);height:2em;background:linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,1) 100%);pointer-events:none;z-index:2}aside.svelte-a3bmb2::after{content:'';position:absolute;left:0;bottom:1.9em;width:calc(100% - 2rem);height:2em;background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,1) 100%);pointer-events:none}.sidebar.svelte-a3bmb2{position:absolute;font-family:var(--font);overflow-y:auto;width:100%;height:100%;padding:4em 1.6rem 2em 3.2rem;bottom:2em}.content.svelte-a3bmb2{width:100%;margin:0;padding:var(--top-offset) var(--side-nav);tab-size:2;-moz-tab-size:2}@media(min-width: 832px){aside.svelte-a3bmb2{display:block;width:var(--sidebar-w);height:100vh;top:0;left:0;overflow:hidden;box-shadow:none;border:none;overflow:hidden;background-color:var(--second);color:white}aside.open.svelte-a3bmb2::before{display:none}aside.svelte-a3bmb2::after{content:'';bottom:0;height:var(--top-offset);background:linear-gradient(to bottom, rgba(103,103,120,0) 0%, rgba(103,103,120,0.7) 50%, rgba(103,103,120,1) 100%)}aside.svelte-a3bmb2 button.svelte-a3bmb2{display:none}.sidebar.svelte-a3bmb2{padding:var(--top-offset) 0 6.4rem 3.2rem;font-family:var(--font);overflow-y:auto;height:100%;bottom:auto;width:100%}.content.svelte-a3bmb2{padding-left:calc(var(--sidebar-w) + var(--side-nav))}.content.svelte-a3bmb2 .side-by-side{display:grid;grid-template-columns:calc(50% - 0.5em) calc(50% - 0.5em);grid-gap:1em}.content.svelte-a3bmb2 .side-by-side .code{padding:1em 0}}.content.svelte-a3bmb2 h2.svelte-a3bmb2{margin-top:8rem;padding:2rem 1.6rem 4rem 0.2rem;border-top:var(--border-w) solid #6767785b;color:var(--text);line-height:1;font-size:var(--h3);letter-spacing:.05em;text-transform:uppercase}.content.svelte-a3bmb2 section:first-of-type>h2.svelte-a3bmb2{margin-top:0}.content.svelte-a3bmb2 h4{margin:2em 0 1em 0}.content.svelte-a3bmb2 .offset-anchor{position:relative;display:block;top:calc(-1 * (var(--nav-h) + var(--top-offset) - 1rem));width:0;height:0}.content.svelte-a3bmb2 .anchor{position:absolute;display:block;background:url(/icons/link.svg) 0 50% no-repeat;background-size:1em 1em;width:1.4em;height:1em;left:-1.3em;opacity:0;transition:opacity 0.2s;border:none !important}@media(min-width: 768px){.content.svelte-a3bmb2 h2:hover .anchor,.content.svelte-a3bmb2 h3:hover .anchor,.content.svelte-a3bmb2 h4:hover .anchor,.content.svelte-a3bmb2 h5:hover .anchor,.content.svelte-a3bmb2 h6:hover .anchor{opacity:1}.content.svelte-a3bmb2 h5 .anchor,.content.svelte-a3bmb2 h6 .anchor{top:0.2em}}.content.svelte-a3bmb2 h3,.content.svelte-a3bmb2 h3 > code{margin:6.4rem 0 0 0;padding:2rem 1.6rem 5.6rem .2rem;color:var(--text);border-top:var(--border-w) solid #6767781f;background:transparent;line-height:1}.content.svelte-a3bmb2 h3:first-of-type{border:none;margin:0}.content.svelte-a3bmb2 h3 > code{border-radius:0 0 0 0;border:none;font-size:inherit}.content.svelte-a3bmb2 h4,.content.svelte-a3bmb2 h4 > code{font-family:inherit;font-weight:600;font-size:2.4rem;color:var(--second);margin:6.4rem 0 1.6rem 0;padding-left:0;background:transparent;line-height:1;padding:0;top:0}.content.svelte-a3bmb2 h4 > em{opacity:0.7}.content.svelte-a3bmb2 h5{font-size:2.4rem;margin:2em 0 0.5em 0}.content.svelte-a3bmb2 code{padding:.3rem .8rem .3rem;margin:0 0.2rem;top:-.1rem;background:var(--back-api)}.content.svelte-a3bmb2 pre code{padding:0;margin:0;top:0;background:transparent}.content.svelte-a3bmb2 pre{margin:0 0 2em 0;width:100%;max-width:100%}.content.svelte-a3bmb2 .icon{width:2rem;height:2rem;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;fill:none}.content.svelte-a3bmb2 table{margin:0 0 2em 0}section.svelte-a3bmb2>.code-block>pre{display:inline-block;color:white;padding:.3rem .8rem;margin:0;max-width:100%}section.svelte-a3bmb2>.code-block>pre.language-markup{padding:.3rem .8rem .2rem;background:var(--back-api)}section.svelte-a3bmb2>p{max-width:var(--linemax)
	}section.svelte-a3bmb2 p{margin:1em 0}small.svelte-a3bmb2{font-size:var(--h5);float:right;pointer-events:all;color:var(--prime);cursor:pointer}small.svelte-a3bmb2 a.svelte-a3bmb2{all:unset }small.svelte-a3bmb2 a.svelte-a3bmb2:before{all:unset }section.svelte-a3bmb2 blockquote{color:hsl(204, 100%, 50%);border:2px solid var(--flash)}section.svelte-a3bmb2 blockquote code{background:hsl(204, 100%, 95%) !important;color:hsl(204, 100%, 50%)}
.parallax.svelte-1inoott{position:absolute;top:-4rem;right:0rem;width:50rem;will-change:transform;display:none}@media(min-width: 800px){.parallax.svelte-1inoott{display:block}}@media(min-width: 1200px){.parallax.svelte-1inoott{right:calc(50vw - 60rem)}}
.hero.svelte-1u1foo2{position:relative;margin:10rem auto;padding:0 var(--side-nav);max-width:120rem}h3.svelte-1u1foo2{color:var(--text) }.hero.svelte-1u1foo2{margin:10rem auto}.hero.svelte-1u1foo2 h3.svelte-1u1foo2,.logotype.svelte-1u1foo2{position:relative;left:1.6rem}.hero.svelte-1u1foo2 h3.svelte-1u1foo2{font-size:2rem}.logotype.svelte-1u1foo2{height:4rem}@media(min-width: 640px){.logotype.svelte-1u1foo2{height:6rem}.hero.svelte-1u1foo2 h3.svelte-1u1foo2{font-size:var(--h3)}}@media(min-width: 800px){.hero.svelte-1u1foo2{margin:15rem auto}.hero.svelte-1u1foo2 h3.svelte-1u1foo2,.logotype.svelte-1u1foo2{left:3rem}}
header.svelte-1txnqye{position:fixed;display:flex;align-items:center;justify-content:space-between;width:100vw;height:var(--nav-h);padding:0 var(--side-nav);margin:0 auto;background-color:white;box-shadow:0 -0.4rem 0.9rem 0.2rem rgba(0,0,0,.5);font-family:var(--font);z-index:100;user-select:none;transform:translate(0,calc(-100% - 1rem));transition:transform 0.2s}header.visible.svelte-1txnqye{transform:none}nav.svelte-1txnqye{position:fixed;top:0;left:0;width:100vw;height:var(--nav-h);padding:0 var(--side-nav) 0 var(--side-nav);display:flex;align-items:center;justify-content:space-between;background-color:transparent;transform:none;transition:none;box-shadow:none}.primary.svelte-1txnqye{list-style:none;font-family:var(--font);margin:0;line-height:1}ul.svelte-1txnqye li{display:block;display:none}ul.svelte-1txnqye li.active{display:block}ul.svelte-1txnqye{position:relative;padding:0 3rem 0 0;background:url(/icons/chevron.svg) calc(100% - 1em) 0.05em no-repeat;background-size:1em 1em}ul.svelte-1txnqye::after{position:absolute;content:'';width:100%;height:100%;left:0;top:0}ul.open.svelte-1txnqye{padding:0 0 1em 0;background:white;border-left:1px solid #eee;border-right:1px solid #eee;border-bottom:1px solid #eee;border-radius:0 0 var(--border-r) var(--border-r);align-self:start}ul.open.svelte-1txnqye li{display:block;text-align:right
	}ul.open.svelte-1txnqye::after{display:none}ul.svelte-1txnqye li a{font-size:var(--h5);padding:0 .8rem;border:none;color:inherit}ul.open.svelte-1txnqye li a{padding:1.5rem 3.7rem 1.5rem 4rem;display:block}ul.open.svelte-1txnqye li:first-child a{padding-top:2.3rem}.primary.svelte-1txnqye svg{width:2rem;height:2rem}.home.svelte-1txnqye{position:relative;top:-.1rem;width:18rem;height:4.2rem;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;background:0 50% no-repeat;background-size:auto 100%;text-indent:-9999px}ul.svelte-1txnqye li.active a{color:var(--prime)
	}.modal-background.svelte-1txnqye{position:fixed;width:100%;height:100%;left:0;top:0;background-color:rgba(255, 255, 255, 0.9)}a.svelte-1txnqye{color:inherit;border-bottom:none;transition:none}ul.svelte-1txnqye li:not(.active) a:hover{color:var(--flash)}@media(min-width: 840px){ul.svelte-1txnqye{padding:0;background:none}ul.open.svelte-1txnqye{padding:0;background:white;border:none;align-self:initial}ul.open.svelte-1txnqye li{display:inline;text-align:left}ul.open.svelte-1txnqye li a{font-size:var(--h5);padding:0 .8rem;display:inline}ul.svelte-1txnqye::after{display:none}ul.svelte-1txnqye li{display:inline !important}.hide-if-desktop.svelte-1txnqye{display:none !important}}
/* BASICS */

.CodeMirror {
	/* copied colors over from prism */
	--background: var(--back-light);
	--base:       hsl(45, 7%, 45%);
	--comment:    hsl(210, 25%, 60%);
	--keyword:    hsl(204, 58%, 45%);
	--function:   hsl(19, 67%, 45%);
	--string:     hsl(41, 37%, 45%);
	--number:     hsl(102, 27%, 50%);
	--tags:       var(--function);
	--important:  var(--string);

  /* Set height, width, borders, and global font properties here */
  /* see prism.css */
  height: 300px;
  direction: ltr;
}

/* PADDING */

.CodeMirror-lines {
  padding: 4px 0; /* Vertical padding around content */
}
.CodeMirror pre {
  padding: 0 4px; /* Horizontal padding of content */
}

.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
  background-color: white; /* The little square between H and V scrollbars */
}

/* GUTTER */

.CodeMirror-gutters {
  border-right: 1px solid #ddd;
  background-color: var(--back-light);
  white-space: nowrap;
}
.CodeMirror-linenumber {
  padding: 0 3px 0 5px;
  min-width: 20px;
  text-align: right;
  color: var(--comment);
  white-space: nowrap;
  opacity: .6;
}

.CodeMirror-guttermarker { color: black; }
.CodeMirror-guttermarker-subtle { color: #999; }

/* CURSOR */

.CodeMirror-cursor {
  border-left: 1px solid black;
  border-right: none;
  width: 0;
}
/* Shown when moving in bi-directional text */
.CodeMirror div.CodeMirror-secondarycursor {
  border-left: 1px solid silver;
}
.cm-fat-cursor .CodeMirror-cursor {
  width: auto;
  border: 0 !important;
  background: #7e7;
}
.cm-fat-cursor div.CodeMirror-cursors {
  z-index: 1;
}
.cm-fat-cursor-mark {
  background-color: rgba(20, 255, 20, .5);
  -webkit-animation: blink 1.06s steps(1) infinite;
  -moz-animation: blink 1.06s steps(1) infinite;
  animation: blink 1.06s steps(1) infinite;
}
.cm-animate-fat-cursor {
  width: auto;
  border: 0;
  -webkit-animation: blink 1.06s steps(1) infinite;
  -moz-animation: blink 1.06s steps(1) infinite;
  animation: blink 1.06s steps(1) infinite;
  background-color: #7e7;
}
@-moz-keyframes blink {
  0% {}
  50% { background-color: transparent; }
  100% {}
}
@-webkit-keyframes blink {
  0% {}
  50% { background-color: transparent; }
  100% {}
}
@keyframes blink {
  0% {}
  50% { background-color: transparent; }
  100% {}
}

.cm-tab { display: inline-block; text-decoration: inherit; }

.CodeMirror-rulers {
  position: absolute;
  left: 0; right: 0; top: -50px; bottom: -20px;
  overflow: hidden;
}
.CodeMirror-ruler {
  border-left: 1px solid #ccc;
  top: 0; bottom: 0;
  position: absolute;
}

/* DEFAULT THEME */
.cm-s-default .cm-header {color: blue}
.cm-s-default .cm-quote {color: #090}
.cm-negative {color: #d44}
.cm-positive {color: #292}
.cm-header, .cm-strong {font-weight: bold}
.cm-em {font-style: italic}
.cm-link {text-decoration: underline}
.cm-strikethrough {text-decoration: line-through}

.cm-s-default .cm-atom,
.cm-s-default .cm-def,
.cm-s-default .cm-property,
.cm-s-default .cm-variable-2,
.cm-s-default .cm-variable-3,
.cm-s-default .cm-punctuation {color: var(--base)}
.cm-s-default .cm-hr,
.cm-s-default .cm-comment {color: var(--comment)}
.cm-s-default .cm-attribute,
.cm-s-default .cm-keyword {color: var(--keyword)}
.cm-s-default .cm-variable,
.cm-s-default .cm-bracket,
.cm-s-default .cm-tag {color: var(--tags)}
.cm-s-default .cm-number {color: var(--number)}
.cm-s-default .cm-string {color: var(--string)}

.cm-s-default .cm-string-2 {color: #f50}
.cm-s-default .cm-type {color: #085}
.cm-s-default .cm-meta {color: #555}
.cm-s-default .cm-qualifier {color: #555}
.cm-s-default .cm-builtin {color: #30a}
.cm-s-default .cm-link {color: var(--flash)}
.cm-s-default .cm-error {color: #ff008c}
.cm-invalidchar {color: #ff008c}

.CodeMirror-composing { border-bottom: 2px solid; }

/* Default styles for common addons */

div.CodeMirror span.CodeMirror-matchingbracket {color: #0b0;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #a22;}
.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
.CodeMirror-activeline-background {background: #e8f2ff;}

/* STOP */

/* The rest of this file contains styles related to the mechanics of
   the editor. You probably shouldn't touch them. */

.CodeMirror {
  position: relative;
  overflow: hidden;
  background: white;
}

.CodeMirror-scroll {
  overflow: scroll !important; /* Things will break if this is overridden */
  /* 30px is the magic margin used to hide the element's real scrollbars */
  /* See overflow: hidden in .CodeMirror */
  margin-bottom: -30px; margin-right: -30px;
  padding-bottom: 30px;
  height: 100%;
  outline: none; /* Prevent dragging from highlighting the element */
  position: relative;
}
.CodeMirror-sizer {
  position: relative;
  border-right: 30px solid transparent;
}

/* The fake, visible scrollbars. Used to force redraw during scrolling
   before actual scrolling happens, thus preventing shaking and
   flickering artifacts. */
.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
  position: absolute;
  z-index: 6;
  display: none;
}
.CodeMirror-vscrollbar {
  right: 0; top: 0;
  overflow-x: hidden;
  overflow-y: scroll;
}
.CodeMirror-hscrollbar {
  bottom: 0; left: 0;
  overflow-y: hidden;
  overflow-x: scroll;
}
.CodeMirror-scrollbar-filler {
  right: 0; bottom: 0;
}
.CodeMirror-gutter-filler {
  left: 0; bottom: 0;
}

.CodeMirror-gutters {
  position: absolute; left: 0; top: 0;
  min-height: 100%;
  z-index: 3;
}
.CodeMirror-gutter {
  white-space: normal;
  height: 100%;
  display: inline-block;
  vertical-align: top;
  margin-bottom: -30px;
}
.CodeMirror-gutter-wrapper {
  position: absolute;
  z-index: 4;
  background: none !important;
  border: none !important;
}
.CodeMirror-gutter-background {
  position: absolute;
  top: 0; bottom: 0;
  z-index: 4;
}
.CodeMirror-gutter-elt {
  position: absolute;
  cursor: default;
  z-index: 4;
}
.CodeMirror-gutter-wrapper ::selection { background-color: transparent }
.CodeMirror-gutter-wrapper ::-moz-selection { background-color: transparent }

.CodeMirror-lines {
  cursor: text;
  min-height: 1px; /* prevents collapsing before first draw */
}
.CodeMirror pre {
  /* Reset some styles that the rest of the page might have set */
  -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
  border-width: 0;
  background: transparent;
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  white-space: pre;
  word-wrap: normal;
  line-height: inherit;
  color: inherit;
  z-index: 2;
  position: relative;
  overflow: visible;
  -webkit-tap-highlight-color: transparent;
  -webkit-font-variant-ligatures: contextual;
  font-variant-ligatures: contextual;
}
.CodeMirror-wrap pre {
  word-wrap: break-word;
  white-space: pre-wrap;
  word-break: normal;
}

.CodeMirror-linebackground {
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
  z-index: 0;
}

.CodeMirror-linewidget {
  position: relative;
  z-index: 2;
  padding: .1px; /* Force widget margins to stay inside of the container */
}

.CodeMirror-rtl pre { direction: rtl; }

.CodeMirror-code {
  outline: none;
}

/* Force content-box sizing for the elements where we expect it */
.CodeMirror-scroll,
.CodeMirror-sizer,
.CodeMirror-gutter,
.CodeMirror-gutters,
.CodeMirror-linenumber {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

.CodeMirror-measure {
  position: absolute;
  width: 100%;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.CodeMirror-cursor {
  position: absolute;
  pointer-events: none;
}
.CodeMirror-measure pre { position: static; }

div.CodeMirror-cursors {
  visibility: hidden;
  position: relative;
  z-index: 3;
}
div.CodeMirror-dragcursors {
  visibility: visible;
}

.CodeMirror-focused div.CodeMirror-cursors {
  visibility: visible;
}

.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
.CodeMirror-crosshair { cursor: crosshair; }
.CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection { background: #d7d4f0; }
.CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection { background: #d7d4f0; }

.cm-searching {
  background-color: #ffa;
  background-color: rgba(255, 255, 0, .4);
}

/* Used to force a border model for a node */
.cm-force-border { padding-right: .1px; }

@media print {
  /* Hide the cursor when printing */
  .CodeMirror div.CodeMirror-cursors {
    visibility: hidden;
  }
}

/* See issue #2901 */
.cm-tab-wrap-hack:after { content: ''; }

/* Help users use markselection to safely style text background */
span.CodeMirror-selectedtext { background: none; }