/* Mobile hardening: keep the raffle diagram in document flow. */
html,
body.live-page {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  overscroll-behavior-x: none;
}

.live-page main,
.live-page section,
.live-page .container,
.raffle-console,
.raffle-console__body,
.raffle-console__body > div {
  min-width: 0;
  max-width: 100%;
}

@media (min-width: 561px) and (max-width: 900px) {
  .raffle-pool {
    padding-bottom: 34px;
  }

  .raffle-pool__people {
    position: static;
    width: 100%;
    margin-top: 26px;
  }
}

@media (max-width: 560px) {
  .raffle-pool {
    display: block;
    padding-bottom: 27px !important;
    overflow: visible;
  }

  .raffle-pool > p {
    max-width: none;
  }

  .raffle-pool__people {
    position: static;
    width: 100%;
    margin-top: 27px;
  }

  .raffle-pool__people i {
    min-width: 0;
  }

  .raffle-action {
    padding-block: 34px 38px !important;
  }

  .raffle-action > p {
    margin-top: 42px;
    padding-inline: 4px;
  }

  .raffle-result {
    padding-top: 33px !important;
    padding-bottom: max(33px, env(safe-area-inset-bottom)) !important;
  }

  .raffle-result > span {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .raffle-console__flow span {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .raffle-console__flow b {
    flex: 0 0 auto;
    white-space: nowrap;
  }
}