* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: #030102;
}

body {
  color: #ffd968;
  font-family: Georgia, serif;
}

body::before {
  display: none;
}

.cashout-shell {
  position: relative;
  width: min(100vw, 700px);
  min-height: 100vh;
  margin: 0 auto;
  background:
    url("./images/cashout-bg.jpeg")
    center top / 100% 100%
    no-repeat;
}

.cashout-note {
  display: none;
}

.cashout-live,
.cashout-hotspot,
.cashout-result {
  position: absolute;
  z-index: 10;
  color: #ffd968;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 0 6px #000, 0 0 10px rgba(255, 215, 0, 0.25);
}

/* live values */
.cashout-balance,
.cashout-wallet-status,
.cashout-player-status,
.cashout-vip {
  top: 52.25%;
  height: 2.8%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  color: #f5f5f5;
  text-shadow: 0 0 6px rgba(0,0,0,.9);
}

/* individual value boxes */
.cashout-balance {
  left: 8.5%;
  width: 18%;
  font-size:10px;
}

.cashout-wallet-status {
  left: 29.7%;
  width: 18%;
  font-size: 9px !important;
}

.cashout-player-status {
  left: 51%;
  width: 18%;
}

.cashout-vip {
  left: 73%;
  width: 18%;
}

/* main cashout button */
.cashout-request-btn {
  left: 23%;
  top: 61.8%;
  width: 54%;
  height: 3.6%;

  display: flex;
  align-items: center;
  justify-content: center;

  border: none;
  background: transparent;

  color: transparent;
  font-size: 0;
}

/* bottom nav */
.cashout-back {
  left: 9%;
  top: 93.5%;
  width: 24%;
  height: 4%;

  display: flex;
  align-items: center;
  justify-content: center;

  color: transparent;
  font-size: 0;
}

.cashout-buy {
  left: 64%;
  top: 93.5%;
  width: 24%;
  height: 4%;

  display: flex;
  align-items: center;
  justify-content: center;

  color: transparent;
  font-size: 0;
}

/* hidden result message for now */
.cashout-result {
  display: none;
}