<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>حدس عدد</title>

<style>
body {
  font-family: Tahoma;
  text-align: center;
  background: linear-gradient(135deg,#ead7ff,#ffd6ec);
  padding: 40px 15px;
}

.box {
  background: white;
  max-width: 400px;
  margin: auto;
  padding: 30px;
  border-radius: 25px;
}

h1 { color: #9b45bd; }

input {
  padding: 12px;
  font-size: 18px;
  width: 80%;
  border-radius: 12px;
  border: 2px solid #d8b4e8;
}

button {
  margin: 10px 5px;
  padding: 12px 20px;
  border: none;
  border-radius: 12px;
  background: #a855c7;
  color: white;
  font-size: 17px;
}
</style>
</head>

<body>

<div class="box">

<h1>🎀 حدس عدد 🎀</h1>

<p>من یک عدد بین ۱ تا ۱۰۰ انتخاب کرده‌ام.<br>
حدس بزن چه عددی است!</p>

<input id="guess" type="number" placeholder="حدست را بنویس">

<br>

<button onclick="checkGuess()">حدس بزن</button>
<button onclick="newGame()">بازی دوباره</button>

<p id="message"></p>
<p id="attempts">تعداد حدس‌ها: ۰</p>

</div>

<script>

let secretNumber;
let attempts = 0;

function newGame() {
  secretNumber = Math.floor(Math.random() * 100) + 1;
  attempts = 0;

  document.getElementById("guess").value = "";
  document.getElementById("message").innerText =
    "یک عدد بین ۱ تا ۱۰۰ وارد کن! 🎯";
  document.getElementById("attempts").innerText =
    "تعداد حدس‌ها: ۰";
}

function checkGuess() {

  let guess = Number(document.getElementById("guess").value);

  if (guess < 1 || guess > 100) {
    document.getElementById("message").innerText =
      "یک عدد بین ۱ تا ۱۰۰ وارد کن.";
    return;
  }

  attempts++;

  if (guess === secretNumber) {
    document.getElementById("message").innerText =
      "🎉 آفرین! درست حدس زدی!";
  }
  else if (guess < secretNumber) {
    document.getElementById("message").innerText =
      "⬆️ بیشتر حدس بزن!";
  }
  else {
    document.getElementById("message").innerText =
      "⬇️ کمتر حدس بزن!";
  }

  document.getElementById("attempts").innerText =
    "تعداد حدس‌ها: " + attempts;
}

newGame();

</script>

</body>
</html>