body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{background-attachment:fixed;background-image:url(/static/media/bgr.fa5c962b26fbef5ac45f.jpg);background-size:cover;background:linear-gradient(135deg,#5f4b78,#092645);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:0}.tools-conteiner{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;margin-top:10px}.footer{color:#fff;font-size:14px;font-weight:500;margin:15px;padding:20px}.preview{border:none;border-radius:16px;height:800px;transform:scale(1);transform-origin:top left;width:100%}.app{align-items:center;display:flex;flex-direction:column;justify-content:center;min-height:100vh}.info-card{animation:toUp 1s alternate;border-radius:30px;padding:20px;width:70%}.gradient{animation:zoomIn 1.5s alternate;background:#ffffff1a;border-radius:50px;box-shadow:0 0 15px #0000004d;height:250px;padding:20px;width:100%}.gradient>button{display:block}button{background:hsla(0,0%,100%,.347);font-size:10px;margin:6px;padding:10px}.navigation,button{border:none;border-radius:12px;color:#fff;cursor:pointer;font-family:Montserrat,sans-serif;font-weight:400;transition:.2s}.navigation{align-items:center;background:#45729500;font-size:15px;justify-content:center;top:10px}.nav-menu,.navigation{display:flex}.button-generator{animation:zoomIn 1s alternate;background-color:#cacaca62;border-radius:25px;height:450px;padding:10px;width:100%;width:600px}button:hover{background:#fff9;color:#000}.close{background:#fff;border-radius:18px;color:#000;color:color;cursor:pointer;font-size:20px;font-weight:500;height:20px;padding:5px;position:absolute;right:10px;top:5px;width:20px;z-index:1100}.banner,.close{align-items:center;display:flex;justify-content:center}.banner{animation:toUp 1s alternate;color:#fff;flex-direction:column;margin:20px auto;width:60%;z-index:3}.banner>button{align-items:center;background:linear-gradient(135deg,#e7e33d,#fec85e);border:none;border-radius:33px;box-shadow:0 29px 38px #ee09a440;color:#000;cursor:pointer;display:flex;font-family:Raleway,sans-serif;font-size:10px;height:36px;justify-content:center;margin:20px;padding:15px 30px;transition:transform .3s;width:80px}.banner>h2{font-family:Open Sans,sans-serif;font-size:22px;margin:30px}.banner>h3{font-size:20px;margin:10px;right:50%}.toast{align-items:center;animation:toUp 1s alternate;background-color:#fff;border-radius:30px;bottom:20px;color:#000;display:flex;font-size:20px;justify-content:center;padding:20px;position:fixed;z-index:1600}.logo{animation:rotate 1s infinite;display:flex;height:50px;margin:0 auto;right:50%;width:50px;z-index:600}.info-card{color:#fff;line-height:1.6;margin:2rem auto;max-width:600px;width:80%}.css-code{background:#0003;border-radius:6px;box-sizing:border-box;color:#fff;cursor:pointer;display:inline-block;font-family:Courier New,monospace;margin-top:20px;padding:8px 12px;width:100%}.palette{align-items:center;animation:toUp 1s alternate;background:hsla(0,0%,56%,.493);border-radius:20px;box-shadow:0 0 15px rgba(0,0,0,.568);display:flex;flex-direction:column;height:auto;justify-content:center;width:100%}.palette-colors{grid-gap:10px;display:grid;gap:10px;grid-template-columns:repeat(3,1fr);width:100%}.color-box{width:30px}.color-box:hover{transform:scale(1.05)}.font-demo{animation:zoomIn 2s alternate;background:linear-gradient(135deg,#0202036e,#1f21167f);box-shadow:0 0 15px rgba(0,0,0,.451);height:400px}.color-picker-block,.font-demo{border-radius:20px;padding:20px;width:100%;width:800px}.color-picker-block{animation:zoomIn 1s alternate;background:#2d2d2d80;box-shadow:0 0 15px #0006;text-align:center}.picker-window{border-radius:12px;margin-top:20px}.always-open-picker{-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;height:150px;max-width:150px;padding:0;width:100%}.always-open-picker::-webkit-color-swatch-wrapper{padding:0}.always-open-picker::-webkit-color-swatch{border:none;border-radius:12px}.selected-color{border-radius:30px;font-weight:700;height:60px;margin:20px}.header,.selected-color{align-items:center;display:flex;justify-content:center}.header{flex-direction:column}.nav{background-color:rgba(0,0,0,.678);bottom:10px;display:flex;gap:10px;height:70px;margin:10px;padding:10px;position:fixed;z-index:1400}.nav-btn{background:#cbcade00;border-radius:12px}.nav-btn.active{align-items:center;background:linear-gradient(135deg,#1a3e8b6d,#ef1657);border-radius:22px;box-shadow:0 29px 38px #ee09a440;cursor:pointer;display:flex;font-family:Lobster,sans-serif;font-family:Raleway,sans-serif;justify-content:center;transition:transform .3s}.nav-btn.fav.active{animation:glow 1.5s infinite alternate;background:#baac5080;box-shadow:0 0 12px #fd0;color:#fff}.auth-form{align-items:center;display:flex;flex-direction:column;gap:10px}.auth-form input{border:1px solid #ccc;border-radius:8px;outline:none;padding:10px;width:240px}.other-tools{grid-template-columns:repeat(2,1fr)}@media (max-width:550px){.tools-conteiner{flex-direction:row;flex-wrap:wrap;gap:10px;justify-content:center}.other-tools{grid-template-columns:repeat(1,1fr)}.nav-menu{display:inline;flex-direction:row}.button-generator,.color-picker-block,.font-demo,.gardient,.palette{flex-basis:calc(50% - 10px);flex-grow:0;flex-shrink:1;margin:5px 0;max-width:calc(50% - 10px);width:400px}.color-picker-block{order:-1}}@media (max-width:480px){.banner h2{font-size:24px}.bottom-nav{gap:14px;padding:12px 16px}.nav-btn{font-size:13px;padding:12px 14px}}@keyframes rotate{0%{rotate:0}to{rotate:360%}}@keyframes zoomIn{0%{transform:scale(0)}to{transform:scale(100%)}}@keyframes toLeft{0%{transform:translateX(400%)}to{transform:translateX(0)}}@keyframes toUp{0%{opacity:0;transform:translateY(100%)}to{opacity:100%;transform:translateX(0)}}@keyframes slideUp{0%{opacity:0;transform:translateX(-50%) translateY(100px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes dance{0%{transform:scale(100%)}50%{transform:scale(100%)}70%{transform:scale(120%)}to{transform:scale(100%)}}
/*# sourceMappingURL=main.696398ec.css.map*/