body{

margin:0;
font-family:Arial, Helvetica, sans-serif;
background:#0b0b0b;
color:white;
text-align:center;

}

header{

display:flex;
justify-content:space-between;
align-items:center;
padding:10px 20px;
background:#111;

}

h1{

color:#ff2a8a;
font-size:24px;

}

.back{

background:#333;
border:none;
color:white;
padding:8px 12px;
border-radius:6px;
cursor:pointer;

}

main{

padding:10px;

}

canvas{

background:black;
border:4px solid #ff2a8a;
border-radius:12px;
max-width:95vw;
height:auto;

}

.hud{

margin:10px;
font-size:18px;

}

.controls{

margin-top:10px;

}

.controls button{

font-size:26px;
padding:14px 20px;
margin:5px;
border:none;
border-radius:10px;
background:#ff2a8a;
color:white;
cursor:pointer;

}

.start{

margin-top:10px;
background:#ff2a8a;
border:none;
padding:10px 20px;
border-radius:10px;
font-size:16px;
color:white;
cursor:pointer;

}

.donate{

margin-top:10px;
background:#2ecc71;
border:none;
padding:10px 20px;
border-radius:10px;
font-size:16px;
color:white;
cursor:pointer;

}

@media (max-width:600px){

h1{
font-size:20px;
}

.controls button{
font-size:22px;
padding:12px 16px;
}

}