.audio-page {
  position: relative;
  width: 100%;
  height: 100vh;
  background: radial-gradient(ellipse at bottom, #1b2735 0%, #090a0f 100%);

  > .page-content {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    margin: auto;
    z-index: 999;
  }
}

.starfield-full {
  position: fixed;
  inset: 0;
  height: 100%;
  background: linear-gradient(180deg, #0a0f1a 0%, #1a2a3a 50%, #2a3a52);

  > .buildings-bg {
    position: fixed;
    bottom: 0;
    left: 15%;
    height: 40%;
    width: 50%;
    z-index: 2;
  }
}

.star {
  position: absolute;
  width: 2px;
  height: 2px;
  background: white;
  border-radius: 50%;
  animation: twinkle linear infinite;
}

.star.small {
  width: 1px;
  height: 1px;
}

.star.medium {
  width: 2px;
  height: 2px;
}

.star.large {
  width: 3px;
  height: 3px;
  box-shadow: 0 0 4px rgba(255, 255, 255, 0.5);
}

@keyframes twinkle {
  0%,
  100% {
    opacity: 0.3;
  }
  50% {
    opacity: 1;
  }
}