:root{--black: hsla(0, 0%, 0%, 1);--oxford-blue: hsla(221, 51%, 16%, 1);--orange-web: hsla(37, 98%, 53%, 1);--platinum: hsla(0, 0%, 90%, 1);--white: hsla(0, 0%, 100%, 1)}*{margin:0;padding:0;outline:0;box-sizing:border-box;color:var(--white)}html,body{margin:0;color:var(--secondary)}body{min-height:100vh;background-size:cover;font-family:sans-serif}.color-secondary{color:var(--secondary)}#root{display:flex;flex-direction:column;justify-content:center}#bg{position:fixed;background:linear-gradient(var(--primary),var(--primaryLight)) no-repeat;height:100vh;width:100vw;top:0;left:0}.container{max-width:750px;width:100%;margin:0 auto}h1,h2{width:100%;text-align:center;font-family:Firasans,RobotoMono,sans-serif;margin-bottom:15px}h1{font-size:2.6em;font-weight:700;margin-bottom:30px;color:var(--accent);font-family:RobotoMono,sans serif}h2{font-size:2rem;font-weight:700;margin-top:0;color:var(--secondary);font-family:FirasansThin,RobotoMono,sans-serif}h2.code{font-size:1.4rem;font-weight:700;margin-top:0;font-family:Departure,sans serif;color:var(--secondary)}h2.section{font-family:RobotoMono,sans-serif;color:var(--accent)}.mobile h2.code{font-size:1.5rem}section{height:100vh;padding:80px 35px 100px}.mobule section{text-align:center}.mobile p{font-size:1.4rem}p{font-family:Firasans,sans serif;font-size:1.2rem;color:var(--primaryLight);margin-bottom:20px}p.alt{color:var(--secondary)}i{color:var(--secondary);filter:brightness(140%)}a{text-decoration:none;color:var(--secondary)}bold{font-weight:700}button{cursor:pointer;background:var(--accentDark);border:none;border-radius:4px;padding:0 15px;color:var(--light)}button.icon-text{padding:7px 15px;display:flex;place-items:anchor-center;gap:10px;background:var(--primaryLight);color:var(--secondary)}button:hover{filter:brightness(120%)}button.alt{font-family:Departure,RobotoMono,sans-serif;background:transparent;-webkit-tap-highlight-color:transparent;color:var(--lightTransparent)}button.accent{color:var(--accent)}button.alt:hover{color:var(--white)}button.icon{background:transparent;-webkit-tap-highlight-color:transparent;outline:none;opacity:.2;transition:all .2s cubic-bezier(0,-.3,.735,1)}button.icon.active{opacity:.8!important}ul{margin:0;padding:0}li{flex:1 0 auto;padding:0 10px}input{padding:10px;border-radius:5px;background-color:var(--lightTransparent);border:solid 1px var(--accent);color:var(--secondary)}.highlight{color:var(--secondary);font-weight:700}.highlight.bg{color:var(--white);background:var(--primary);font-weight:700;padding:2px 10px;display:inline-block;margin-bottom:3px}.highlight.bg.main{font-family:RobotoMono,sans-serif;color:var(--accent)}footer{margin-top:20px;padding:20px 0;text-align:center}.text{overflow:hidden;transition:max-width 3s ease-in-out}.text.hide{max-width:0px;transition:max-width 3s ease-in-out}.text.show{max-width:9999px;transition:max-width 3s ease-in-out}table{table-layout:fixed;border-collapse:separate;border-spacing:15px 1rem;width:100%}table tr{text-align:left;font-size:1.04rem;line-height:24px;vertical-align:top;margin-bottom:15px}.mobile table tr{font-size:1.4rem}@keyframes shiftGradient{0%{background-position:0 0}to{background-position:0 100%}}.terminal{display:flex;flex-direction:column;color:#32cd32;font-family:monospace;border-radius:.3125rem;position:relative;overflow:hidden;mix-blend-mode:color-dodge;z-index:2000;animation:shiftGradient 130s infinite linear;background-image:repeating-linear-gradient(to bottom,hsl(0deg 0% 35.85%) 0rem,var(--primaryLight) .3rem,transparent .1rem,transparent 2rem);background-size:100% 1.2rem}.grid{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(6,4rem)}.mobile .grid{grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(6,4rem)}.code{font-family:Departure,RobotoMono,sans-serif;font-size:1.04rem}.mobile .code{font-size:1.4rem}.roboto{font-family:RobotoMono}.center-v{position:absolute;top:50%;transform:translateY(-50%)}.no-select{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flex{display:flex}.flex.col{flex-direction:column}.flex.row{flex-direction:row}.flex.space-between{justify-content:space-between}.flex.space-even{justify-content:space-evenly}::-webkit-scrollbar{width:6px;background-color:var(--primary)}::-webkit-scrollbar-track{background-color:transparent}::-webkit-scrollbar-thumb{background-color:var(--secondaryDark);border-radius:6px}::-webkit-scrollbar-thumb:hover{background-color:var(--secondary)}.animation.fade-in{opacity:1;transition:all .4s cubic-bezier(.6,-.3,.535,1)}.animation.fade-in.hidden{opacity:0}.animation.slide-up{opacity:1;margin-top:0;transition:all .5s cubic-bezier(.34,1.56,.64,1)}.animation.slide-up.hidden{opacity:0;margin-top:60px}.animation.slide-right{opacity:1;margin-left:0;transition:all .5s cubic-bezier(.34,1.56,.64,1)}.animation.slide-right.hidden{opacity:0;margin-left:80px}@keyframes grow-up{0%{max-height:0px;opacity:0}to{max-height:130px;opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes fadeInIcon{0%{opacity:0;transform:rotateX(90deg)}to{opacity:.2;transform:rotateX(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up-alt{0%{opacity:0;transform:translateY(0)}to{opacity:1;transform:translateY(-100%)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes slide-in-left{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slide-out-left{0%{transform:translate(0);opacity:1}to{transform:translate(-100%);opacity:0}}.anim-grow-up{opacity:0;max-height:0px;overflow:hidden;animation:grow-up .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-grow-up-bounce-sml{opacity:0;max-height:0px;overflow:hidden;animation:grow-up .25s cubic-bezier(.175,.885,.32,1.275) forwards}.anim-grow-up-bounce-lrg{opacity:0;max-height:0px;overflow:hidden;animation:grow-up .3s cubic-bezier(.34,1.56,.64,1) forwards}.anim-slide-in-left{opacity:0;animation:slide-in-left .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-slide-out-left{animation:slide-out-left .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-fade-in{opacity:0;animation:fadeIn .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-fade-out{opacity:1;animation:fadeOut .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-slide-down{opacity:0;animation:slide-down .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-slide-in{opacity:0;animation:slide-up .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-slide-out{opacity:1;animation:slide-up .5s cubic-bezier(.6,-.3,.535,1) forwards,fadeOut .5s cubic-bezier(.6,-.3,.535,1) forwards}.anim-slide-out-alt{opacity:1;animation:slide-up-alt .5s cubic-bezier(.6,-.3,.535,1) forwards,fadeOut .5s cubic-bezier(.6,-.3,.535,1) forwards}.a-delay-xs{animation-delay:.2s}.a-delay-s{animation-delay:.4s}.a-delay-m{animation-delay:.7s}.a-delay-l{animation-delay:1.2s}.a-speed-xs{animation-duration:.1s}.a-speed-s{animation-duration:.2s}.a-speed-m{animation-duration:.7s}.a-speed-l{animation-duration:1.3s}.a-speed-xl{animation-duration:1.9s}button.anim-fade-in{transform-origin:center bottom;transform:rotateX(90deg);opacity:0;animation:fadeInIcon .5s cubic-bezier(.6,-.3,.535,1) forwards}.space{position:fixed;top:0;right:0;bottom:0;left:0;opacity:1;background:radial-gradient(3px 3px at 20% 30%,rgba(250,250,250,1),transparent),radial-gradient(1px 1px at 80% 70%,rgba(250,250,250,.5),transparent),radial-gradient(3px 3px at 50% 10%,rgba(250,250,250,.9),transparent),radial-gradient(4px 4px at 10% 80%,rgba(250,250,250,.6),transparent),radial-gradient(2px 2px at 90% 40%,rgba(250,250,250,.2),transparent);background-size:200px 200px;animation:drift 40s linear infinite}.space:before{content:"";position:fixed;background:var(--primary);width:100vw;height:100vh;top:0;left:0;opacity:.5}.space:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(1px 1px at 13% 27%,#fff,transparent),radial-gradient(2px 2px at 71% 83%,rgba(255,255,255,.8),transparent),radial-gradient(1px 1px at 44% 9%,rgba(255,255,255,.6),transparent),radial-gradient(3px 3px at 92% 41%,rgba(255,255,255,.9),transparent),radial-gradient(2px 2px at 6% 64%,rgba(255,255,255,.5),transparent),radial-gradient(1px 1px at 58% 52%,rgba(255,255,255,.7),transparent);background-size:300px 300px;animation:drift 60s linear infinite}.space:after{opacity:.5;background-size:150px 150px;animation-duration:2000s}@keyframes drift{0%{background-position:0 0}to{background-position:300px 200px}}
