
.prize-wheel-container {
  position: fixed;
  top: 50%;
  right:0;
  transform: translate(90%, -50%);
  z-index: 1000;
  transition: transform 1.5s ease-in-out 0s;
}

.dash-header {
  margin-bottom: 75px;
}

.prize-wheel-container.spinning {
  transform: translate(53%, -50%);
}

.bg-backdrop {
    background-size: 100% auto;
    inset: 0;
    overflow: hidden;
    position: fixed;
    touch-action: none;
    z-index: -1;
}

.bg-backdrop image {
  width: 100%;
}

.bg-innerbg {
    background-repeat: repeat-y;
    background-size: 100% 50%;
    height: 200%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.bg-animation {
  animation-play-state: running;
  animation: scroll-bg 12s linear infinite;
  position: relative;
  width: 100%;
}

@keyframes scroll-bg {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(0, -100%, 0);
  }
}

.video-bg-wrapper {
  height: 100%;
  left: 0;
  overflow: hidden;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
}

.video-bg {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 140%;
  position: fixed;
  z-index:90;
} 


.timeslots-wrapper {
  margin: 0 100px;
  display: flex;
  flex: 1;
  align-items: stretch;
}

/* Mobile and tablet responsive styles */
@media screen and (max-width: 768px) {
  .timeslots-wrapper {
    margin: 50px 10px;
  }
}
  
.timeslot {
  display: flex;
  flex: 1;
  flex-direction: column;
  opacity: .35;
  scale: 0.85;
}

.timeslot.current {
  opacity: .95;
  scale: 1.05;
}

.timeslot-header {
  text-align: center;
  padding: 4px;
}

.timeslot-header h2.neonText {
  font-family: "Press Start 2P", system-ui;
  font-size: 40px;
  margin: 8px;
}

/* Mobile and tablet responsive styles */
@media screen and (max-width: 768px) {
  .timeslot-header h2.neonText {
    font-family: "Press Start 2P", system-ui;
    font-size: 16px;
    margin: 8px;
  }
}

.timeslot-body {
  flex: 1;
}

.timeslot-body .activity {
  padding: 20px 26px;
}

.top-score {
  font-family: "Press Start 2P", system-ui;
  color: #fcfdd4;
  margin: 16px 0 8px 0;
  font-size: 24px;
  line-height: 1.3;
}

.score-prefix {
  display: none;
}
.show-score .score-prefix {
  display: inline;
}

.no-score {
  opacity: .6;
}

.blue-border {
  padding: 26px;
  box-shadow: 0 0 .2rem #fff,
  0 0 .2rem #fff,
  0 0 2rem #00ffff,
  0 0 0.8rem #00ffff,
  0 0 2.8rem #00ffff,
  inset 0 0 1.3rem #00ffff;
}

.green-border {
  padding: 26px;
  box-shadow: 0 0 .2rem #fff,
  0 0 .2rem #fff,
  0 0 2rem #00ff00,
  0 0 0.8rem #00ff00,
  0 0 2.8rem #00ff00,
  inset 0 0 1.3rem #00ff00;
}
.pink-border {
  padding: 26px;
  box-shadow: 0 0 .2rem #fff,
  0 0 .2rem #fff,
  0 0 2rem #bc13fe,
  0 0 0.8rem #bc13fe,
  0 0 2.8rem #bc13fe,
  inset 0 0 1.3rem #bc13fe;
}

.activity {
  margin-bottom: 40px;
}

.future .activity {
  filter: blur(15px);
}

.activity-name {
  margin: 4px 0 12px 0;
  font-size: 35px;  
  font-family: "Press Start 2P", system-ui;
}

.activity-desc {
    font-family: "Press Start 2P", system-ui;
    font-size: 18px;
    line-height:1.2;
}

.activity.pink {
  color: rgb(255 154 255);
  background: linear-gradient(135deg, rgba(255,0, 255, .35) 0%, rgba(0, 0, 0, 0.6) 100%);
}

.activity.blue {
  color: rgb(112, 222, 231);
  background: linear-gradient(135deg, rgba(112, 222, 231, .35) 0%, rgba(0, 0, 0, 0.6) 100%);
}

.activity.blue .activity-desc {
  color: rgb(192 240 255);
}
.activity.green {
  color: rgb(125 255 125);
  background: linear-gradient(135deg, rgba(0, 255, 255, .35) 0%, rgba(0, 0, 0, 0.6) 100%);
}

.pink .activity-name {
  text-shadow: rgb(255, 0, 255) 0px 0px 10px;
}

.blue .activity-name {
  text-shadow: rgb(112 222 231) 0px 0px 10px;
}

.green .activity-name {
  text-shadow: rgb(0, 255, 0) 0px 0px 10px;
}

@keyframes pulse-glow {
  0% {
    box-shadow: 0 0 50px #ff00ff, 0 0 100px #00ffff, 0 0 150px #ffff00;
    transform: scale(1);
  }
  100% {
    box-shadow: 0 0 80px #ff00ff, 0 0 120px #00ffff, 0 0 180px #ffff00;
    transform: scale(1.01);
  }
}

#fireworks {
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  z-index:999999;
}

h3.instructions {
  text-align: center;
  color: white;
  font-family: "Press Start 2P", system-ui;
  line-height: 2;
  margin-top: -50px;
  margin-bottom: 50px;
}
.instructions a {
  color: #fff;
}
