.boot-screen {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #090909;
  color: #d8d8d8;
  font-family: "VT323", monospace;
  opacity: 1;
  transition: opacity 0.5s ease;
}

.boot-screen.hidden {
  opacity: 0;
  pointer-events: none;
}
.boot-content {
  width: min(520px, 80vw);
}
.boot-logo {
  margin-bottom: 34px;
  text-align: center;
  color: #f0f0f0;
  font-size: 64px;
  letter-spacing: 8px;
  opacity: 0;
  animation: bootLogo 0.7s ease forwards;
}
.boot-version {
  margin-top: -26px;
  margin-bottom: 36px;
  text-align: center;
  color: #777;
  font-size: 17;
  letter-spacing: 3px;
  opacity: 0;
  animation: bootVersion 0.5 ease 0.35s forwards;
}
.boot-messages {
  min-height: 150px;
  font-size: 19px;
  line-height: 1.45;
}
.boot-messages {
  opacity: 1;
  color: #9b9b9b;
}
.boot-message.show {
  opacity: 1;
}
.boot-messages .ok {
  color: #7ee787;
}

.boot-progress-wrap {
  margin-top: 24px;
}
.boot-progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  background: #202020;
  border-radius: 2px;
}
.boot-progress-bar {
  width: 0%;
  height: 100%;
  background: #7ee787;
  transition: width 0.12s linear;
}

.boot-progress-text {
  margin-top: 8px;
  color: #777;
  font-size: 16px;
  text-align: right;
}
@keyframes bootLogo {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes bootVersion {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}