working well - base code

 moving the sign up

<div class="form-group">

<label for="userName" class="form-label">Your Name</label>

<input type="text" id="userName" class="form-input" placeholder="Enter your name" required>

</div>

<div class="form-group">

<label for="userEmail" class="form-label">Your Email</label>

<input type="email" id="userEmail" class="form-input" placeholder="Enter your email" required>

</div>

function startQuiz() {

const name = document.getElementById("userName").value.trim();

const email = document.getElementById("userEmail").value.trim();

if (!name || !email) {

alert("Please enter your name and email to continue.");

return;

}

if (!validateEmail(email)) {

alert("Please enter a valid email address.");

return;

}

userData.name = name;

userData.email = email;

document.getElementById("startScreen").classList.add("hidden");

document.getElementById("quizScreen").classList.remove("hidden");

displayQuestion();

}

function validateEmail(email) {

const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;

return re.test(email);

}