.rescue-bonus-page {
  min-height: calc(100dvh - 86px);
  padding: 0 28px 132px;
  background: #141414;
}

.rescue-bonus-toolbar {
  height: 78px;
  display: grid;
  grid-template-columns: 52px 1fr 52px;
  align-items: center;
  gap: 12px;
}

.rescue-bonus-toolbar h1 {
  margin: 0;
  color: #f6cf72;
  font-size: 27px;
  text-align: center;
}

.rescue-bonus-back,
.rescue-bonus-music {
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(246, 207, 114, 0.65);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(7, 12, 20, 0.82);
  color: #fff;
}

.rescue-bonus-back svg,
.rescue-bonus-music svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rescue-bonus-music {
  position: relative;
  justify-self: end;
  box-shadow: 0 0 18px rgba(246, 191, 64, 0.2);
}

.rescue-bonus-music .music-off {
  display: none;
}

.rescue-bonus-music.is-muted .music-on {
  display: none;
}

.rescue-bonus-music.is-muted .music-off {
  display: block;
}

.rescue-bonus-card {
  position: relative;
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid #d8a22f;
  border-radius: 18px;
  background: #080504;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.42);
}

.rescue-bonus-card img {
  display: block;
  width: 100%;
  height: auto;
}

.rescue-bonus-caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 90px 24px 25px;
  background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.92));
  text-align: center;
}

.rescue-bonus-caption strong,
.rescue-bonus-caption span {
  display: block;
}

.rescue-bonus-caption strong {
  color: #ffe08a;
  font-size: 31px;
  line-height: 1.1;
}

.rescue-bonus-caption span {
  margin-top: 7px;
  color: #fff;
  font-size: 15px;
}

@media (max-width: 600px) {
  .rescue-bonus-page {
    min-height: 100dvh;
    padding: 0 14px calc(96px + env(safe-area-inset-bottom));
  }

  .rescue-bonus-toolbar {
    height: 68px;
    grid-template-columns: 44px 1fr 44px;
  }

  .rescue-bonus-toolbar h1 {
    font-size: 22px;
  }

  .rescue-bonus-back,
  .rescue-bonus-music {
    width: 42px;
    height: 42px;
  }

  .rescue-bonus-card {
    border-radius: 12px;
  }
}