@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap";body,html{font-family:Roboto,sans-serif;margin:0;background:linear-gradient(135deg,#3f4040,#131313);height:100vh;overflow-x:hidden}.app-container{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:5px}.form-container{background:#fff;border-radius:25px;box-shadow:0 10px 25px #0000001a;padding:20px;width:450px;height:600px;max-width:85%;text-align:center;margin-bottom:20px;display:flex;flex-direction:column;justify-content:space-between}h2{margin-top:0;font-size:24px;color:#333}label{display:block;text-align:left;font-size:17px;font-weight:600;color:#000;margin:15px 0 5px}input,select,textarea,button{width:100%;padding:12px 15px;border:3px solid #000000;border-radius:25px;margin-bottom:15px;box-sizing:border-box;transition:border .3s ease}.char-limit{margin-top:-10px;color:#a0a0a0;font-size:12px;text-align:left;padding-left:10px}input:focus,select:focus,textarea:focus{border:2px solid #007bff;outline:none}.name{margin-bottom:350px}.bio{margin-bottom:300px}.avcont{margin-bottom:45px}.soc{margin-bottom:20px}textarea{height:100px;resize:none}.button-container{display:flex;justify-content:space-between;margin-top:20px}button{background:#007bff;color:#fff;font-weight:600;cursor:pointer;border:none;transition:background .3s;width:100px}.btn{display:flex;justify-content:space-between;margin-top:20px}button:hover{background:#0056b3}button:active{background:#003f8c}button:disabled{background:#a3c3ff;cursor:not-allowed}.next{border-radius:25px;width:120px;height:45px;font-size:16px}.gender-selection{display:flex;justify-content:center;align-items:center;gap:100px;margin:400px auto 0;padding:20px}.gender-icon{display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:transform .2s ease;padding:15px;border:5px solid #888;border-radius:50%;margin-top:-500px}.gender-icon:hover{transform:scale(1.1)}.gender-icon.selected{border:7px solid #14ff3f;transform:scale(1.1)}.avatar-selection{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;max-height:380px;overflow-y:scroll;padding:8px;border:3px solid #04d5ff;border-radius:25px;background-color:#eae7e7d4}.avatar-selection::-webkit-scrollbar{display:none}.avatar-selection{scrollbar-width:none}.avatar{width:60px;height:60px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:transform .2s,border .3s}.avatar:hover{transform:scale(1.1)}.avatar.selected{border:3px solid #007bff;transform:scale(1.1)}.buttons-container{display:flex;justify-content:space-between;margin-top:20px;gap:60px}.profile-card{position:relative;text-align:center;background:#fff;border-radius:45px;padding:30px;box-shadow:0 10px 25px #0000001a;width:280px;height:380px;max-width:100%;margin-bottom:20px;overflow:hidden}.profile-card:before{content:"";position:absolute;top:-20px;left:0;right:0;height:180px;background:linear-gradient(108.4deg,#fd2c38 3.3%,#b0020c 98.4%);border-radius:0 0 45px 45px;z-index:0}.profile-card img.avatar-image{width:100px;height:100px;top:70px;border-radius:50%;margin-bottom:20px;box-shadow:0 0 20px #0000001a;position:relative;z-index:1;border:8px solid #ffffff;background:linear-gradient(108.4deg,#c91921 3.3%,#820209 98.4%)}.profile-card h2{top:40px;font-size:24px;color:#000;margin:15px 0 10px;position:relative;z-index:1}.profile-card h4{top:35px;font-size:16px;font-weight:400;color:#000;margin:0;position:relative;z-index:1}.profile-card p{top:-8px;font-size:13px;color:#000;margin:15px 0;line-height:1.5;position:relative;z-index:1}hr{margin-top:45px;background:linear-gradient(108.4deg,#fd2c38 3.3%,#c7050e 98.4%);width:70%;height:2.5px;border:none}.social-links{justify-content:center;margin-top:10px}.social-icon{margin:0 10px;color:#555;transition:color .2s}.social-icon:hover{color:#007bff}@media (max-width: 768px){.form-container,.profile-card{width:100%;padding:20px}.avatar{width:50px;height:50px}.profile-card img.avatar-image{width:80px;height:80px}.gender-selection{display:flex;justify-content:center;align-items:center;gap:80px;margin:400px auto 0;padding:20px}.profile-card{position:relative;text-align:center;background:#fff;border-radius:45px;padding:30px;box-shadow:0 10px 25px #0000001a;width:280px;height:380px;max-width:100%;margin-bottom:20px;overflow:hidden}.profile-card:before{content:"";position:absolute;top:-20px;left:0;right:0;height:180px;background:linear-gradient(108.4deg,#fd2c38 3.3%,#b0020c 98.4%);border-radius:0 0 45px 45px;z-index:0}}@media (max-width: 576px){h2{font-size:20px}h4,p{font-size:14px}.profile-card h2{font-size:20px}.gender-selection{display:flex;justify-content:center;align-items:center;gap:50px;margin:400px auto 0;padding:20px}.profile-card{position:relative;text-align:center;background:#fff;border-radius:45px;padding:30px;box-shadow:0 10px 25px #0000001a;width:280px;height:380px;max-width:100%;margin-bottom:20px;overflow:hidden}.profile-card:before{content:"";position:absolute;top:-20px;left:0;right:0;height:180px;background:linear-gradient(108.4deg,#fd2c38 3.3%,#b0020c 98.4%);border-radius:0 0 45px 45px;z-index:0}}.generate-profile-button{background-color:#4caf50;color:#fff;border:none;border-radius:25px;padding:10px 20px;text-align:center;text-decoration:none;display:inline-block;font-size:14px;cursor:pointer;transition:background-color .3s;width:auto}.generate-profile-button:hover{background-color:#45a049}.shr{margin-top:2px;margin-bottom:-2px}body{overflow:auto;scrollbar-width:none}body::-webkit-scrollbar{display:none}.app-footer{background-color:#3a3939d4;color:#fff;text-align:center;padding:10px;margin:0;width:auto;position:relative;border-radius:25px 25px 0 0}.app-footer{font-size:16px}@media (max-width: 600px){.app-footer{font-size:12px}}@media (min-width: 601px) and (max-width: 960px){.app-footer{font-size:15px}}@media (min-width: 961px){.app-footer{font-size:16px}}.text{font-size:16px;color:#4a4a4a;font-weight:700;text-align:center;margin-bottom:19px;margin-top:-20px;padding:15px 20px;background:linear-gradient(45deg,#f093fb,#f5576c);color:#fff;border-radius:25px 25px 0 0;box-shadow:0 4px 10px #0003;width:100%;margin-left:-20px}@media (max-width: 768px){.text{font-size:14px}}@media (max-width: 480px){.text{font-size:12px}}