*,*:before,*:after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}:root{--body-bg: #0d1117;--text-color: #000;--text-color-secondary: #b7b7b7;--primary: #4493f8;--link-color: #4493f8;--font-size: 16px}body{background:var(--body-bg);font-size:16px;font-family:Gordita,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}.main{width:100%;min-height:100dvh;overflow:hidden;position:relative;padding-top:32px}.glow{z-index:-1;position:absolute;top:35%;left:40%;width:60%;padding:30% 0;transform:translateY(-70%) rotate(65deg);background:radial-gradient(circle at left bottom,#e6b7fe 20%,#5049c2 40%,#3a37ff00 50%);mix-blend-mode:color-dodge;filter:blur(150px);opacity:0;animation:glowIn 3s cubic-bezier(.76,0,.24,1) forwards}.particles{position:absolute;z-index:-1;left:50%;width:35%;top:25%;transform:translate(-50%,-50%);opacity:0;animation:particlesIn 5s cubic-bezier(.34,1,.64,1) forwards .75s;transform-origin:center}@media screen and (max-width: 549px){.glow{left:40%;width:60%;padding:60% 0;background:radial-gradient(circle at left bottom,#e6b7fe 20%,#5049c2 40%,#3a37ff00 80%)}.particles{width:100%}}.hero{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;width:100%;margin-top:2rem;img{animation:titleIn 1.5s cubic-bezier(.16,1,.3,1) forwards}.title{display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;width:100%}h1{font-size:3rem;color:#fff;margin-top:1.5rem;opacity:0;margin-bottom:.875rem;animation:titleIn 1.5s cubic-bezier(.16,1,.3,1) forwards}p{max-width:70ch;color:var(--text-color-secondary);font-style:italic;font-size:1.4rem;line-height:1.2;opacity:0;animation:titleIn 1.5s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.15s}@media screen and (max-width: 549px){justify-content:flex-start;padding-inline:12px;img{width:100px;height:100px}h1{font-size:36px;line-height:1.1}}}.editor-try{display:flex;flex-direction:column;align-items:center;margin-top:68px;h2{margin-bottom:32px;letter-spacing:6px;text-transform:uppercase}.editor{min-width:75vh}}.cta-list{display:flex;gap:12px;justify-content:center;margin-top:2rem;opacity:0;animation:titleIn 1.5s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.15s;@media screen and (max-width: 549px){flex-direction:column}}.cta{padding:8px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:8px;height:44px;border:1px solid currentColor;background:#fff;color:#1a1a1a;text-decoration:unset;outline:2px solid transparent;outline-offset:0;transition:outline-color,outline-offset .1s ease-in-out;&:hover{text-decoration:unset;outline-offset:2px;outline-color:var(--primary)}}.github-button{background-color:#2f3337;color:#fff;border:1px solid rgb(47,51,55);cursor:pointer}.footer{margin-top:2rem;display:flex;justify-content:center;color:#fff;a{color:var(--link-color);font-weight:500}@media screen and (min-width: 549px){position:absolute;bottom:3rem;width:100%}}@keyframes titleIn{0%{opacity:0;transform:translateY(-50%)}to{opacity:1;transform:translateY(0)}}@keyframes glowIn{0%{opacity:0;transform:translate(-30%,-100%) rotate(30deg)}to{opacity:1;transform:translateY(-50%) rotate(65deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes particlesIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}75%{opacity:.8}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
