*,*:after,*:before{box-sizing:border-box}:root{font-size:12px;--gutter: 2rem;--gap: 1rem;--zTop: 100;--zMid: 50;--zLow: 0;--color-text: #fff;--color-bg: #000;--link-color: var(--color-text);--link-color-hover: var(--color-text);--link-rotate-padding: 5px 14px;--link-rotate-color: var(--color-text);--link-rotate-color-hover: var(--color-text);--link-rotate-backgroundColor: #222;--link-rotate-backgroundColor-hover: #333}@media screen and (max-width: 600px){:root{--gap: 2rem}}html{scrollbar-width:none;-ms-overflow-style:none;height:100%;overflow:hidden}html::-webkit-scrollbar{display:none}body{margin:0;color:var(--color-text);background-color:var(--color-bg);font-family:ui-monospace,monospace;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;position:fixed;width:100%;height:100%;overflow:hidden;touch-action:pan-x pan-y;-webkit-overflow-scrolling:touch}.js canvas{position:fixed;top:0;left:0;height:100%;width:100%}ul{list-style:none;padding:0;margin:0;display:flex;gap:var(--gap)}a{text-decoration:none;color:var(--link-color);outline:none;cursor:pointer}a:hover{text-decoration:underline;color:var(--link-color-hover);outline:none}header{padding:var(--gutter);position:fixed;top:0;left:0;width:100%;height:auto;z-index:1000;margin-right:200px;display:flex;justify-content:space-between;align-items:center}header h1{z-index:var(--zTop);font-size:inherit;margin:0}canvas{display:block;width:100%;height:100%}.content{position:relative;z-index:1;padding-top:100vh}.spacer{height:50vh}.spacer.large{height:100vh}.section{position:fixed;bottom:0;left:0;padding:var(--gutter);text-align:left;max-width:600px;opacity:0;font-weight:100}.section.visible{opacity:1!important}.section.transition-enabled{transition:opacity .8s ease-in-out}.section.without-transition{transition:none}.section p{font-size:1.2rem;line-height:1.6;margin-bottom:1rem}.section p:last-child{margin-bottom:0}.rotate>span{position:relative;display:inline-block;padding:var(--link-rotate-padding);background-color:#222;color:var(--link-rotate-color);transition:transform .3s;transform-origin:50% 0;transform-style:preserve-3d}.rotate>span:before{position:absolute;top:100%;left:0;width:100%;height:100%;padding:5px 14px;background-color:var(--link-rotate-backgroundColor-hover);color:var(--link-rotate-color-hover);content:attr(data-hover);transition:background .3s;transform:rotateX(-90deg);transform-origin:50% 0}.rotate:hover>span{transform:rotateX(90deg) translateY(-22px)}@media screen and (max-width: 600px){.menu.is-open .menu-content{opacity:1}.menu.is-transitioned .menu-content{transition:opacity .5s ease-in-out}.menu-content{position:fixed;top:0;left:0;opacity:0;width:100%;height:100%;background:var(--color-bg);z-index:var(--zMid)}.menu-content ul{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.menu-content ul li{-webkit-transform:translate3d(0,60vh,0) scale3d(1,.2,1);transform:translate3d(0,60vh,0) scale3d(1,.2,1);-webkit-transform-origin:100% 50%;transform-origin:100% 50%;-webkit-transition:-webkit-transform .5s;transition:transform .5s;-webkit-transition-timing-function:cubic-bezier(.7,0,.3,1);transition-timing-function:cubic-bezier(.7,0,.3,1)}.menu.is-opening .menu-content ul li{-webkit-transition-timing-function:cubic-bezier(.56,1.19,.2,1.05);transition-timing-function:cubic-bezier(.56,1.19,.2,1.05);-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}.menu.is-closing .menu-content ul li:nth-child(3),.menu.is-opening .menu-content ul li:first-child{-webkit-transition-delay:.05s;transition-delay:.05s}.menu.is-closing .menu-content ul li:nth-child(2),.menu.is-opening .menu-content ul li:nth-child(2){-webkit-transition-delay:.1s;transition-delay:.1s}.menu.is-closing .menu-content ul li:nth-child(1),.menu.is-opening .menu-content ul li:nth-child(3){-webkit-transition-delay:.15s;transition-delay:.15s}.rotate{font-size:1.5rem}.rotate>span{padding:5px 14px;background-color:transparent;transform:none!important}.rotate>span:before{content:none}}:root{--menu-burger-transition-duration: .1s;--menu-burger-dimension: 24px;--menu-burger-scaleSize: .08;--menu-burger-scaled-scaleSize: .5;--menu-burger-svg-offset: -28px;--menu-burger-svg-stroke: #fff;--menu-burger-svg-strokeWidth: 24px}.menu-burger{position:relative;width:var(--menu-burger-dimension);height:var(--menu-burger-dimension);transition:var(--menu-burger-transition-duration);pointer-events:none;z-index:var(--zTop)}.menu-burger.scaled{-webkit-transform:scale(var(--menu-burger-scaled-scaleSize));-ms-transform:scale(var(--menu-burger-scaled-scaleSize));transform:scale(var(--menu-burger-scaled-scaleSize))}.menu-burger svg{position:absolute;top:var(--menu-burger-svg-offset);left:var(--menu-burger-svg-offset);-webkit-transform:scale(var(--menu-burger-scaleSize));-ms-transform:scale(var(--menu-burger-scaleSize));transform:scale(var(--menu-burger-scaleSize));-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0}.menu-burger svg path{stroke:var(--menu-burger-svg-stroke);stroke-width:var(--menu-burger-svg-strokeWidth);stroke-linecap:round;stroke-linejoin:round;fill:transparent}.menu-burger .menu-burger-trigger{position:relative;width:100%;height:100%;margin:0;padding:0;cursor:pointer;pointer-events:auto;background:none;border:none}.menu-burger .menu-burger-trigger:hover,.menu-burger .menu-burger-trigger:focus{outline:none}@media screen and (min-width: 601px){.menu-burger{display:none}}
