@import"https://fonts.googleapis.com/css2?family=Avenir+Next:wght@400;500;600;700&family=Fira+Code:wght@400;700&family=Fira+Mono:wght@400;700&family=Manrope:wght@400;700&family=Roboto+Mono:wght@400;700&display=swap";:root{--font-base: "Avenir Next", "Manrope", sans-serif;--font-mono: "Fira Code", "Fira Mono", "Roboto Mono", monospace;--h: 380;--s: 0%;--l: 0%;--color-bg: hsl(0, 0%, 0%);--color-grey-100: #fff;--color-grey-300: #e4e7e7;--color-grey-400: #c9cfcf;--color-grey-500: #9ea9a9;--color-grey-700: rgb(8, 9, 9);--color-grey-900: rgb(0, 0, 0);--color-grey-950: rgb(0, 0, 0);--color-primary: hsl(var(--h), var(--s), var(--l));--shadow-md: rgba(0, 0, 0, .1) 0px 20px 25px -5px, rgba(0, 0, 0, .04) 0px 10px 10px -5px;--shadow-lg: rgba(0, 0, 0, .25) 0px 25px 50px -12px;--rounded-sm: .5rem;--rounded-md: 1.5rem}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{height:100%}html,body,#root{min-height:100%!important;height:100%}body{min-height:100%;font-family:var(--font-base);background-color:var(--color-bg);color:var(--color-grey-100);background-image:url(/pattern.png)}pre,code{font-family:var(--font-mono)}code{background-color:var(--color-grey-950);padding:.25rem .5rem;margin:0 .25rem;border-radius:.4rem;font-size:.875rem}code:before,code:after{content:"`"}ul,li{list-style-position:inside}header{position:fixed;width:100%}.main{display:grid;place-items:center;height:100%;background:linear-gradient(to bottom,var(--color-bg),transparent,var(--color-bg)),radial-gradient(circle,transparent 0%,var(--color-bg) 70%)}.wrapper{position:relative;border:1px solid var(--color-primary);border-radius:var(--rounded-md);background:hsl(var(--h),var(--s),0%);max-width:clamp(20rem,90%,30rem);box-shadow:var(--shadow-lg)}.wrapper:after{position:absolute;content:"";top:0;left:0;right:0;z-index:-1;height:100%;width:100%;filter:blur(100px);background:linear-gradient(95deg,#7baff3,#3f8ef6,#0b2c56,#4e70d0);background-size:50% 50%;animation:animateGlow 5s linear infinite}.content{margin-top:1.5rem}.footer{display:flex;justify-content:center;align-items:center;padding:.5rem;background-color:hsla(var(--h),var(--s),0%,1);border-radius:0 0 var(--rounded-md) var(--rounded-md);font-size:.875rem;white-space:pre;color:var(--color-grey-700)}.footer svg{margin-right:.25rem}.footer a{color:inherit;text-decoration:none;text-underline-offset:.125rem;white-space:normal}.footer a:hover{color:var(--color-grey-500)}.footer svg:has(+a:hover){color:var(--color-grey-500)!important}.container{padding:2rem 2.25rem}.wrapper li{color:var(--color-grey-400);line-height:1.75}.wrapper li:not(:first-child){margin-top:1rem}.main h1{font-size:1.75rem;font-weight:600}span.button{position:relative;display:inline-flex;vertical-align:bottom;align-items:center;justify-content:center;gap:.375rem;padding:.375rem .675rem;margin:0 .25rem;font-size:.875rem;border-radius:var(--rounded-sm);background-color:hsl(var(--h),var(--s),0%);border:1px solid hsl(var(--h),var(--s),22%);color:inherit;line-height:1;box-shadow:var(--shadow-md);cursor:pointer;-webkit-user-select:none;user-select:none;transition:all .1s}.highlight{position:relative}.highlightSelected{z-index:5}.highlightSelected:after{opacity:.5!important}.highlight:after{opacity:0}.highlight:after{transition:opacity .2s;position:absolute;content:"";top:0;left:0;right:0;z-index:-1;height:100%;width:100%;filter:blur(15px);background:linear-gradient(95deg,#7baff3,#3f8ef6,#0b2c56,#4e70d0);background-size:200% 200%;animation:animateGlow 5s linear infinite}span.button:hover{background-color:hsl(var(--h),var(--s),30%);border:1px solid hsl(var(--h),var(--s),32%);color:var(--color-grey-100)}.header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1rem 1.75rem}.header .buttons{display:flex;align-items:center;gap:.5rem}.backdrop{position:absolute;top:0;left:0;right:0;bottom:0;z-index:4;pointer-events:none;background:#0a0a0abf;transition:opacity .2s}@keyframes animateGlow{0%{background-position:0% 50%}to{background-position:200% 50%}}