@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap";*{margin:0;padding:0;font-family:inter,sans-serif;box-sizing:border-box}#root{width:100%;height:100vh;overflow-x:hidden}header{display:flex;background:#231942;color:#fff;height:50px;align-items:center;padding:20px;justify-content:space-between}.header-logo{display:flex;align-items:center}.first{color:#fff}.buttons a{text-decoration:none;color:#fff;font-size:1.2rem;font-weight:700}.signup-button a{color:#fff}.login-buttons{text-decoration:none;margin:10px;padding:12px 36px;border-radius:20px;border:none}.login-button{background:#5e548e}.signup-button{background:#9f86c0}.login-button:hover{background:#766baa;cursor:pointer;box-shadow:0 0 10px #be95c4,0 0 20px #be95c4;transform:scale(1.03)}.signup-button:hover{background:#b199d1;cursor:pointer;box-shadow:0 0 10px #fff,0 0 20px #fff;transform:scale(1.03)}.secound{display:flex;justify-content:center;position:relative;width:100%;margin-top:40px;font-size:clamp(1.2rem,calc(1vw + .5rem),1.8rem);text-align:center}main{position:relative;background:linear-gradient(to bottom right,#5e548e,#231942);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;height:calc(100% - 50px);width:100%;overflow:hidden}main:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(to right,#5e548e81 1px,transparent 1px),linear-gradient(to bottom,#5e548e75 1px,transparent 1px);background-size:30px 30px;z-index:0;pointer-events:none;opacity:1;mask-image:linear-gradient(to bottom,#000 10%,#0000);-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,1) 10%,rgba(0,0,0,0) 100%)}main>*{position:relative;z-index:1}.main-stuff{width:90%}.hover-text{width:100%;color:#fff;text-shadow:+3px +3px 0 #be95c4,+6px +6px 0 #9f86c0,+9px +9px 0 #5e548e;font-size:clamp(1rem,calc(4vw + 3rem),8rem);position:relative;display:flex;flex-direction:column;text-align:center}.small{color:#ffffff86}.img{width:50px;opacity:.6}.last{display:flex;width:100%;align-items:center;justify-content:center;padding-bottom:60px}*{margin:0;padding:0;box-sizing:border-box;font-family:inter,sans-serif}body,html{margin:0;padding:0;overflow:hidden;width:100%;height:100%;overflow-x:clip;overflow-y:clip}.go-back{position:absolute;top:5px;left:5px}.go-back button{margin:10px;padding:10px 20px;border-radius:20px;border:none;color:#fff;font-size:1.2rem;font-weight:700;background:#9f86c0}.go-back button:hover{background:#b199d1;cursor:pointer;box-shadow:0 0 10px #fff,0 0 20px #fff;transform:scale(1.03)}.shapes-wrapper{position:absolute;top:0;left:0;width:100vw;height:100vh;overflow:clip;pointer-events:none;z-index:0;contain:layout paint}.shape{position:absolute;top:100%;background:#ffffff36;opacity:.8;animation:float 25s linear infinite;pointer-events:none;max-width:100%;overflow:hidden;contain:layout paint;will-change:transform}.shape.circle{border-radius:50%}.shape.square{border-radius:5px}.shape.triangle{width:0;height:0;border-left:20px solid transparent;border-right:20px solid transparent;border-bottom:40px solid rgba(255,255,255,.137);background:none}@keyframes float{0%{transform:translate(0) rotate(0);opacity:1}to{transform:translate(-30px,-120vh) rotate(360deg);opacity:0}}.all-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;background:linear-gradient(to bottom right,#5e548e,#9f86c0,#e0b1cb)}.wrapper{z-index:2;overflow:hidden;max-width:380px;background:#231942;padding:30px;border-radius:15px;box-shadow:0 15px 20px #0000001a}@media (max-width: 450px){.wrapper{width:95%}.go-back{top:2px;left:2px}}.wrapper .title-text{display:flex;width:200%;color:#9f86c0;overflow:hidden;align-items:center;font-weight:700}.wrapper .title{width:50%;font-size:35px;font-weight:600;text-align:center}.wrapper .slide-controls{position:relative;display:flex;height:50px;width:100%;overflow:hidden;margin:30px 0 10px;justify-content:space-between;border-radius:15px;background-color:#2c214d}.slide-controls .slide{height:100%;width:100%;color:#fff;font-size:18px;font-weight:500;text-align:center;line-height:48px;cursor:pointer;z-index:1;transition:all .6s ease}.slide-controls label.signup{color:#fff}.slide-controls .slider-tab{position:absolute;height:100%;width:50%;left:0;z-index:0;border-radius:10px;background:#5e548e;transition:all .6s cubic-bezier(.68,-.55,.265,1.55)}input[type=radio]{display:none}#signup:checked~.slider-tab{left:50%}#signup:checked~label.signup{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}#signup:checked~label.login{color:#fff}#login:checked~label.signup{color:#fff}#login:checked~label.login{cursor:default;-webkit-user-select:none;user-select:none}.wrapper .form-container{width:100%;overflow:hidden}.form-container .form-inner{display:flex;width:200%}.form-container .form-inner form{width:50%;transition:all .6s cubic-bezier(.68,-.55,.265,1.55)}.form-inner form .field{height:50px;width:100%;margin-top:20px}.form-inner form .field input{border:0px;box-shadow:none;height:100%;width:100%;outline:none;padding-left:15px;border-radius:15px;color:#fff;background-color:#2c214d;font-size:17px;transition:all .3s ease}.form-inner form .field input::placeholder{color:#fff;transition:all .3s ease}form .field input:focus::placeholder{color:gray}.form-inner form .pass-link{margin-top:20px}.form-inner form .signup-link{text-align:center;margin-top:30px;color:#fff}.form-inner form .pass-link a,.form-inner form .signup-link a{color:#be95c4;text-decoration:none}.form-inner form .pass-link a:hover,.form-inner form .signup-link a:hover{text-decoration:underline}form .btn{height:50px;width:100%;border-radius:15px;position:relative;overflow:hidden}form .btn .btn-layer{height:100%;width:300%;position:absolute;left:-100%;background:#5e548e;border-radius:15px;transition:all .4s ease}form .btn:hover .btn-layer{left:0}form .btn input[type=submit]{height:100%;width:100%;z-index:1;position:relative;background:none;border:none;color:#fff;padding-left:0;border-radius:15px;font-size:20px;font-weight:500;cursor:pointer}