#cuisine #score-container {
  color: darkgoldenrod;
  font-size: 2em;
  width: 100%;
  text-align: center;
}

#cuisinepopup {
  display: none;
}
#cuisinepopup .popup-content {
  display: flex;
  flex-direction: column;
}
#cuisinepopup .popup-content > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
#cuisinepopup[role] {
  display: flex;
}
#cuisinepopup [role] {
  display: none;
}
#cuisinepopup[role="win"] [role="win"] {
  display: block;
}

#cuisinepopup[role="loose"] [role="loose"] {
  display: block;
}

#cuisinepopup[role="highscore"] [role="highscore"] {
  display: block;
}

#game-container {
  width: 100%;
  height: 95vh;
  position: relative;
}

#cabbage {
  position: absolute;
  /* transform-origin: center; */
}

#table {
  position: absolute;
  transform-origin: center;
  bottom: 0;
}

#sausage-template {
  display: none;
}

.sausage {
  position: absolute;
  transform-origin: center;
}

.sausage.special {
  animation: pulse-scale 1s infinite ease-in-out;
}

.sausage.speed {
  filter: hue-rotate(80deg);
}

.sausage.double {
  filter: hue-rotate(50deg) contrast(230%);
}

.sausage.explosion {
  filter: hue-rotate(-3deg) contrast(410%);
}

.sausage.add {
  filter: grayscale(100%) brightness(50%);
}

#explosion-template {
  display: none;
}

.explose {
  position: absolute;
}

@keyframes pulse-scale {
  0% {
    scale: 1;
  }
  50% {
    scale: 1.1;
  }
  100% {
    scale: 1;
  }
}

@media screen and (max-width: 600px) {
  #cuisine #score-container {
    font-size: 1.5em;
  }
  #cuisinepopup {
    font-size: 0.8rem;
  }
}
