Embed

<style>
  body {
    background: rgba(0,0,0,0); 
    font-family: Arial, sans-serif;
    text-align:center;
  }

  /* GLASS EFFECT BOX */
  .game-box {
    background: rgba(0,0,0,0.40);
    padding:20px;
    border-radius:14px;
    border:3px solid #00ff66;
    color:white;
    text-align:center;
    max-width:420px;
    margin:auto;
    margin-top:20px;
    box-shadow:0 0 25px #00ff66;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }

  /* Small buttons */
  button {
    width:85%;
    padding:10px;
    font-size:16px;
    border:none;
    border-radius:8px;
    margin-top:10px;
    color:white;
    font-weight:bold;
    cursor:pointer;
  }

  .btn-green {background:#00c04b;}
  .btn-blue {background:#0057ff;}
  .btn-red {background:#c30000;}

  /* Bet Inputs */
  input {
    width:85%;
    padding:10px;
    font-size:16px;
    border-radius:8px;
    border:2px solid #00ff66;
    margin-bottom:12px;
    background:white;
    color:black;
  }

  /* Slot numbers EXACT layout */
  .slot-box {
    display:flex;
    gap:12px;
    justify-content:center;
    margin-bottom:15px;
  }

  .slot {
    font-size:36px;
    background:#fff;
    color:#000;
    padding:10px 25px;
    border-radius:12px;
    border:3px solid #00ff66;
    min-width:60px;
  }

  .slot-title {
    color:red;
    font-weight:bold;
    font-size:17px;
  }

  /* MODAL */
  #adModal {
    position:fixed;
    top:0; left:0;
    width:100%; height:100%;
    background:rgba(0,0,0,0.92);
    display:none;
    justify-content:center;
    align-items:center;
    z-index:99999;
  }
</style>


<script src="https://www.youtube.com/iframe_api"></script>


<div class="game-box">

  <h2 style="color:red;">Pick any number to test<br>your lottery dream</h2>

  <h2>Coins: <span id="coins">100</span></h2>

  
  <div style="display:flex;gap:60px;justify-content:center;margin-bottom:5px;">
    <div class="slot-title">Slot 1</div>
    <div class="slot-title">Slot 2</div>
    <div class="slot-title">Slot 3</div>
  </div>

  
  <div class="slot-box">
    <div id="n1" class="slot">00</div>
    <div id="n2" class="slot">00</div>
    <div id="n3" class="slot">00</div>
  </div>

  <input id="betNumber" maxlength="2" placeholder="Choose number (00-99)">
  <input id="betCoins" type="number" placeholder="Bet coins">

  <button class="btn-blue" onclick="addBet()">Add Bet</button>

  <div id="betList" style="margin-top:10px;text-align:left;"></div>

  <button class="btn-green" onclick="spin()">🎰 Spin</button>
  <button class="btn-blue" onclick="showAds()">Watch Ads (+100 coins)</button>
  <button class="btn-red" onclick="resetBets()">Reset</button>
</div>


<div id="adModal">
  <div style="width:90%;max-width:550px;background:#111;padding:20px;border-radius:12px;text-align:center;">
      <div id="ytPlayer" style="position:relative;width:100%;padding-top:56.2%;border-radius:12px;overflow:hidden;"></div>
      <h2 style="color:white;margin-top:15px;">Watching ad… please wait</h2>
      <h1 id="adTimer" style="color:#00ff66;font-size:40px;margin:10px 0;">27</h1>
  </div>
</div>


<script>
let coins = 100;
let bets = [];
let player;

/* Load YT */
function onYouTubeIframeAPIReady() {
  player = new YT.Player('ytPlayer', {
    videoId: 'qt5wVnzMScc',
    playerVars: {
      autoplay: 1,
      mute: 1,
      controls: 0,
      showinfo: 0,
      modestbranding: 1,
      rel: 0,
      playsinline: 1
    }
  });
}

/* Add Bet */
function addBet() {
  let num = document.getElementById("betNumber").value.padStart(2,"0");
  let amt = parseInt(document.getElementById("betCoins").value);

  if (num === "" || isNaN(amt) || amt <= 0) {
    alert("Enter a number and coin amount.");
    return;
  }

  if (amt > coins) {
    alert("Not enough coins to place this bet.");
    return;
  }

  bets.push({ num, amt });
  displayBets();
}

/* Display bets */
function displayBets() {
  let box = document.getElementById("betList");
  box.innerHTML = "";

  bets.forEach((b, i) => {
    box.innerHTML += `
      <div style="color:white;background:#222;padding:8px;border-radius:10px;margin-bottom:6px;display:flex;justify-content:space-between;">
        <span><b>${b.num}</b> = ${b.amt} coins</span>
        <span style="cursor:pointer;color:#ff4444;font-size:20px;" onclick="removeBet(${i})">🗑️</span>
      </div>`;
  });
}

/* Remove bet */
function removeBet(i) {
  bets.splice(i,1);
  displayBets();
}

/* Spin (9 seconds) */
function spin() {
  if (bets.length === 0) {
    alert("Add at least one bet.");
    return;
  }

  let totalBet = bets.reduce((t,b)=>t+b.amt,0);
  if (totalBet > coins) {
    alert("Not enough coins! Watch ads.");
    return;
  }

  coins -= totalBet;
  document.getElementById("coins").innerText = coins;

  let s1=document.getElementById("n1");
  let s2=document.getElementById("n2");
  let s3=document.getElementById("n3");

  let spinTime = 9000;
  let interval = setInterval(()=>{
    s1.innerText = String(Math.floor(Math.random()*100)).padStart(2,"0");
    s2.innerText = String(Math.floor(Math.random()*100)).padStart(2,"0");
    s3.innerText = String(Math.floor(Math.random()*100)).padStart(2,"0");
  },80);

  setTimeout(()=>{
    clearInterval(interval);

    let r1 = String(Math.floor(Math.random()*100)).padStart(2,"0");
    let r2 = String(Math.floor(Math.random()*100)).padStart(2,"0");
    let r3 = String(Math.floor(Math.random()*100)).padStart(2,"0");

    s1.innerText=r1; s2.innerText=r2; s3.innerText=r3;

    calculateWin(r1,r2,r3);
  }, spinTime);
}

/* WIN SYSTEM */
function calculateWin(w1,w2,w3){
  let win=0;

  bets.forEach(b=>{
    if(b.num===w1) win+= b.amt * 100;
    else if(b.num===w2) win+= b.amt * 50;
    else if(b.num===w3) win+= b.amt * 10;
  });

  if(win>0){
    alert("🎉 YOU WIN: "+win+" coins!");
    coins+=win;
  } else {
    alert("😢 You lost… try again!");
  }

  bets=[];
  displayBets();
  document.getElementById("coins").innerText=coins;
}

/* Ads */
function showAds(){
  document.getElementById("adModal").style.display="flex";
  player.seekTo(0);
  player.playVideo();

  let t=27;
  document.getElementById("adTimer").innerText=t;

  let timer=setInterval(()=>{
    t--;
    document.getElementById("adTimer").innerText=t;
    if(t<=0){
      clearInterval(timer);
      player.pauseVideo();
      document.getElementById("adModal").style.display="none";
      coins+=100;
      document.getElementById("coins").innerText=coins;
      alert("🎉 +100 coins added!");
    }
  },1000);
}

/* Reset */
function resetBets(){
  bets=[];
  displayBets();
}
</script>

Nouvote Production

Nouvote Production is a photography studio located in Coldwater, United States, offering creative visual solutions. As a newly launched venture, the company is just starting out and building its portfolio.

Nouvote Production

Pick any number to test
your lottery dream

Coins: 100

Watching ad… please wait

27

Pick any number to testyour lottery dream

Coins: 100

Watching ad… please wait

27

Pick any number to test
your lottery dream