ROAST YOURSELF

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
<title>ROAST YOURSELF</title>
<style>
body{
background:#090909;color:white;
font-family:Comic Sans MS;text-align:center;
margin:0;padding:10px;
}
h1{color:red;text-shadow:3px 3px orange}
#box{
background:#252525;border:5px dashed red;
border-radius:20px;padding:20px;
margin-top:20px;min-height:260px;
}
#face{font-size:90px}
#roast{font-size:23px;color:#ff5555;min-height:75px}
button{
background:red;color:white;
border:3px solid white;border-radius:12px;
padding:17px;margin:7px;font-size:18px;
font-weight:bold;
}
#score{color:yellow;font-size:20px}
</style>
</head>
<body>
<h1>🔥 ROAST YOURSELF 🔥</h1>
<div id="score">EMOTIONAL DAMAGE: 0</div>
<div id="box">
<div id="face">🤡</div>
<div id="roast">Welcome, professional disappointment.</div>
</div>
<button onclick="roast()">ROAST ME 💀</button>
<button onclick="defend()">DEFEND MYSELF 🛡️</button>
<button onclick="boss()">FIGHT THE BOSS 👹</button>
<button onclick="secret()">SECRET BUTTON ❓</button>

<script>
let damage=0;
let level=0;

const roasts=[
"Your WiFi has more connection than you.",
"You're the reason shampoo has instructions.",
"Your gaming skills need a software update.",
"Even a potato has better graphics than you.",
"You bring everyone so much joy... when you leave.",
"Your aim is sponsored by the blind.",
"Your brain is running on a free trial.",
"You have the reaction time of a sleeping turtle.",
"Your luck just filed a missing persons report.",
"Google can't even find your talent.",
"Your shadow tried to leave you.",
"You're playing on tutorial mode and still losing.",
"Your loading screen has more personality.",
"Even your NPCs are disappointed.",
"You have 0 wins and unlimited confidence.",
"Your controller filed a complaint.",
"Your high score is a participation trophy.",
"The uninstall button is looking very tempting."
];

function roast(){
damage+=100;
level++;
document.getElementById("score").innerText=
"EMOTIONAL DAMAGE: "+damage;
document.getElementById("roast").innerText=
roasts[Math.floor(Math.random()*roasts.length)];
document.getElementById("face").innerText=
["🤡","💀","😭","🗿","🤖"][Math.floor(Math.random()*5)];
}

function defend(){
document.getElementById("roast").innerText=
"DEFENSE FAILED. BRO GOT ROASTED ANYWAY.";
damage+=50;
document.getElementById("score").innerText=
"EMOTIONAL DAMAGE: "+damage;
}

function boss(){
document.getElementById("face").innerText="👹";
document.getElementById("roast").innerText=
"FINAL BOSS: YOUR REFLECTION. IT'S DISAPPOINTED.";
damage+=500;
document.getElementById("score").innerText=
"EMOTIONAL DAMAGE: "+damage;
}

function secret(){
document.getElementById("face").innerText="🗑️";
document.getElementById("roast").innerText=
"SECRET UNLOCKED: YOU SPENT YOUR TIME PLAYING THIS.";
damage+=1000;
document.getElementById("score").innerText=
"EMOTIONAL DAMAGE: "+damage;
}
</script>
</body>
</html>