* {margin:0;padding:0;box-sizing:border-box;}

body {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  font-family: 'Segoe UI', sans-serif;
  background: black;
}

#stars {
  position:fixed;
  top:0;left:0;
  width:100%;height:100%;
}

#sabina {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 2em;
  font-weight: bold;
  color: #fff;
  text-shadow: 0 0 15px #ff69b4, 0 0 30px #ff69b4, 0 0 50px #ff69b4;
  opacity: 0;
  transition: opacity 2s ease;
  z-index: 1000;
}

#left-text {
  position: fixed;
  bottom: 20px;
  left: 20px;
  font-size: 1.4em;
  font-family: 'Courier New', cursive;
  font-weight: bold;
  color: #fff;
  text-shadow: 0 0 10px #ff69b4, 0 0 30px #ff69b4;
  opacity: 0;
  transition: opacity 2s ease;
  z-index: 1000;
}

.container {
  text-align:center; z-index:10;
}

h1 {
  font-size:2em;
  color:#fff;
  text-shadow:0 0 10px #ff69b4;
  margin-bottom:20px;
}

.buttons {
  display:flex;
  justify-content:center;
  gap:20px;
}

button {
  padding:10px 20px;
  border:none;
  background:#ff69b4;
  color:white;
  font-size:1.2em;
  border-radius:10px;
  cursor:pointer;
  position:relative;
}
button:hover {transform:scale(1.1);}

#video {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 360px;
  z-index: 500;
  border-radius: 10px;
  box-shadow: 0 0 30px #ff69b4;
}

#crack {
  position:fixed;top:0;left:0;width:100%;height:100%;
  background:url('https://i.ibb.co/p3wY9tW/crack.png') center no-repeat;
  background-size:contain;
  display:none;
  z-index:2000;
}

.falling {
  position:fixed;
  top:-50px;
  font-size:1.5em;
  animation:fall linear forwards;
  color:#fff;
  text-shadow:0 0 10px #ff69b4;
  z-index:999;
}
@keyframes fall {
  to {transform: translateY(120vh); opacity:0;}
}

@media (max-width: 600px){
  #left-text {font-size:1.1em;}
}
