@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Poppins:wght@300;400;500;600;700&display=swap");:root{--bg-color:#1A1A2E;--primary-color:#00D4FF;--secondary-color:#FF00FF;--text-color:#E0E0E0;--success-color:#39FF14;--error-color:#FF5555}.cyberpunk-signup{font-family:Inter,Poppins,sans-serif}.signup-container{min-height:80vh;background:linear-gradient(45deg,rgba(26,26,46,.9),rgba(26,26,46,.95))}.signup-container,.wrapper{display:flex;justify-content:center;align-items:center}.wrapper{position:relative;width:850px;height:600px;background:rgba(0,0,0,.3);border-radius:20px;border:1px solid rgba(0,212,255,.3);box-shadow:0 0 20px rgba(0,212,255,.2);backdrop-filter:blur(10px);overflow:hidden}.wrapper .bg-animate{top:-50px;right:-50px;width:500px;height:500px;background:rgba(0,212,255,.05);animation:pulsate 6s ease-in-out infinite alternate}.wrapper .bg-animate,.wrapper .bg-animate2{position:absolute;border-radius:50%;filter:blur(5px)}.wrapper .bg-animate2{bottom:-50px;left:-50px;width:300px;height:300px;background:rgba(255,0,255,.05);animation:pulsate 8s ease-in-out infinite alternate-reverse}@keyframes pulsate{0%{transform:scale(1);opacity:.3}to{transform:scale(1.1);opacity:.7}}.wrapper>div{display:flex;width:100%}.wrapper .form-box{width:50%;display:flex;flex-direction:column;align-items:center;padding:0 30px}.wrapper .form-box.signup{opacity:1;transition:.5s ease;transition-delay:calc(.1s * var(--i))}.wrapper .info-text{width:50%;padding:0 40px;display:flex;flex-direction:column;justify-content:center;text-align:center}.wrapper .info-text.signup{opacity:1;transition:.5s ease;transition-delay:calc(.1s * var(--i))}.info-text h2{font-size:36px;color:var(--primary-color);text-shadow:0 0 10px rgba(0,212,255,.6);margin-bottom:20px}.info-text p{font-size:16px;color:var(--text-color)}.form-box h2{font-size:32px;text-align:center;color:var(--primary-color);text-shadow:0 0 10px rgba(0,212,255,.6);margin-bottom:20px}.form-box .input-box,.form-box .select-box{position:relative;width:100%;height:50px;margin:15px 0}.input-box input,.select-box select{width:100%;height:100%;background:rgba(0,0,0,.2);border:1px solid rgba(0,212,255,.3);outline:none;border-radius:40px;font-size:16px;color:var(--text-color);padding:0 20px 0 35px;transition:border .3s}.input-box input:focus,.select-box select:focus{border:1px solid var(--primary-color);box-shadow:0 0 10px rgba(0,212,255,.3)}.input-box label,.select-box label{position:absolute;top:50%;left:35px;transform:translateY(-50%);color:var(--text-color);pointer-events:none;transition:.5s}.input-box input:focus~label,.input-box input:valid~label,.select-box select:focus~label,.select-box select:valid~label{top:-10px;left:20px;font-size:14px;background:rgba(0,0,0,.4);border-radius:10px;padding:1px 8px;color:var(--primary-color)}.form-box .btn{width:100%;height:45px;background:rgba(0,212,255,.2);border:1px solid rgba(0,212,255,.5);outline:none;border-radius:40px;cursor:pointer;font-size:16px;color:var(--text-color);font-weight:600;transition:all .3s}.form-box .btn:hover{background:rgba(0,212,255,.4);box-shadow:0 0 15px rgba(0,212,255,.5)}.form-box .logreg-link{text-align:center;margin-top:20px}.logreg-link p{color:var(--text-color);font-size:14px;margin:5px 0}.logreg-link a{color:var(--primary-color);font-weight:600;text-decoration:none;transition:text-shadow .3s}.logreg-link a:hover{text-shadow:0 0 8px rgba(0,212,255,.8)}.animation{opacity:0;filter:blur(5px);transform:translateY(40px);animation:fade-in .5s ease forwards;animation-delay:calc(.1s * var(--i))}@keyframes fade-in{to{opacity:1;filter:blur(0);transform:translateY(0)}}.error-message{background:rgba(255,85,85,.2);border:1px solid rgba(255,85,85,.5);border-radius:20px;animation:shake .5s ease}.error-message,.success-message{color:var(--text-color);padding:10px 15px;margin-bottom:15px;width:100%;text-align:center}.success-message{background:rgba(57,255,20,.2);border:1px solid rgba(57,255,20,.5);border-radius:20px}@keyframes shake{0%,to{transform:translateX(0)}20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}.select-box select{-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;color:var(--text-color);background:rgba(0,0,0,.4);border:1px solid rgba(0,212,255,.5);border-radius:40px;padding:0 20px 0 35px;transition:border .3s,background .3s}.select-box select:focus{border:1px solid var(--primary-color);box-shadow:0 0 10px rgba(0,212,255,.3);background:rgba(0,0,0,.6)}.select-box:after{content:"";position:absolute;right:15px;top:50%;transform:translateY(-50%);width:10px;height:10px;border-bottom:2px solid var(--primary-color);border-right:2px solid var(--primary-color);transform:translateY(-50%) rotate(45deg);pointer-events:none}.neon-text{text-shadow:0 0 5px rgba(0,212,255,1),0 0 20px rgba(0,212,255,.5)}.suggestions-container{background:rgba(0,0,0,.3);border:1px solid rgba(0,212,255,.4);border-radius:10px;padding:10px;margin-bottom:15px;width:100%}.suggestions-title{font-size:14px;color:var(--text-color);margin-bottom:8px}.suggestions-list{display:flex;flex-wrap:wrap;gap:8px}.suggestion-button{background:rgba(0,212,255,.15);border:1px solid rgba(0,212,255,.3);color:var(--primary-color);padding:4px 12px;border-radius:20px;font-size:13px;transition:all .2s}.suggestion-button:hover{background:rgba(0,212,255,.3);box-shadow:0 0 8px rgba(0,212,255,.6);transform:translateY(-2px)}@media (max-width:850px){.wrapper{width:90%;height:auto;padding:40px 0}.wrapper>div{flex-direction:column}.wrapper .form-box,.wrapper .info-text{width:100%;padding:20px}.wrapper .info-text{order:-1;margin-bottom:20px}}