body{
font-family: Arial, sans-serif;
background: linear-gradient(135deg,#6a5acd,#ff69b4);
height:100vh;
display:flex;
justify-content:center;
align-items:center;
color:white;
text-align:center;
margin:0;
}

.container{
width:80%;
max-width:600px;
}

h1{
margin-bottom:40px;
}

.glass{
border:3px solid white;
padding:40px;
cursor:pointer;
border-radius:10px;
transition:0.4s;
background:rgba(255,255,255,0.1);
}

.glass:hover{
background:rgba(255,255,255,0.3);
}

.break{
animation:shatter 0.8s forwards;
}

@keyframes shatter{
0%{transform:scale(1)}
50%{transform:scale(1.1) rotate(3deg)}
100%{
opacity:0;
transform:scale(0);
}
}

.message{
display:none;
margin-top:30px;
font-size:20px;
}

.icons{
margin-top:30px;
font-size:30px;
animation:float 4s infinite;
}

@keyframes float{
0%{transform:translateY(0)}
50%{transform:translateY(-10px)}
100%{transform:translateY(0)}
}