:root{font-family:Inter,Avenir,Helvetica,Arial,sans-serif;font-size:16px;line-height:24px;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{margin:0;padding:0;font-family:Inter,Avenir,Helvetica,Arial,sans-serif;font-size:16px;line-height:24px;font-weight:400;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{background-color:#fff;display:flex;min-height:100vh;flex-direction:column;justify-content:center;align-items:center;background-color:#1b252b;background-image:url(https://uploads-ssl.webflow.com/60edcff3f1358c466192e8d1/60f6cd19986978d9b0610225_Brand%20Gradient.png);background-position:50% 100%;background-size:cover;background-repeat:no-repeat;background-attachment:scroll;color:#fff}h1{font-size:32px}p.subtitle{font-size:14px;margin-top:-18px;color:#bbb1cc;margin-bottom:16px;display:block}.art{position:absolute;width:440px;right:280px;top:-110px;pointer-events:none}p{margin-top:10px}.resize{display:flex;flex-direction:row!important;gap:20px}.form-control.resize input{width:100px}canvas{display:block;margin-top:20px}.modes{display:flex;gap:20px;margin-bottom:20px}.modes .mode.active{background-color:#fff;color:#000}.progress-box{border-radius:4px;background-color:#ffffff26;border:0;height:24px;width:270px;margin-top:6px}.progress-box .progress{border-radius:4px;height:24px;background-color:#fff}.progress-box h2{color:#0cf;font-weight:600;position:relative;top:-23px;width:270px;text-align:center;margin:0;font-size:15px}#canvas{width:270px;height:270px;border-radius:10px}.form-control{display:flex;flex-direction:column;margin-bottom:20px}.form-control label{font-size:16px;font-weight:600;margin-bottom:5px;display:block}.form-control input{outline:none;height:auto;max-width:100px;margin-bottom:0;border:0px solid #000;border-radius:5px;background-color:#ffffff26;display:block;width:100%;padding:8px 12px;font-size:18px;color:#3c304b;vertical-align:middle;background-color:#fff;font-weight:600}button{background-color:#ffffff26;color:#fff;border-radius:5px;transition:border-color .2s ease,color .2s ease,box-shadow .25s ease,background-color .2s ease;line-height:1.5;text-align:center;padding:4px 12px;font-size:18px;border:0;cursor:pointer;font-weight:500}button:hover{background-color:#fff3;box-shadow:0 7px 20px -10px #0003}
