/* UK8 recharge presentation only. Payment actions and addresses remain native. */
html.uk8-ref-recharge .modal-overlay.n3r-ov,
html.uk8-ref-recharge .modal-container.deposit-modal.n3r {
  background: #080809 !important;
  color: #f5f5f6 !important;
}
html.uk8-ref-recharge .modal-container.deposit-modal.n3r {
  max-width: 590px !important;
  padding-bottom: 96px !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-nav {
  background: #080809 !important;
  color: #f5f5f6 !important;
  height: 68px;
  justify-content: flex-start;
  padding-left: 24px;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-title {
  color: #f5f5f6 !important;
  font-size: 18px;
  font-weight: 650;
  margin-left: 42px;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-back {
  left: 20px;
  top: 14px;
  width: 42px;
  height: 40px;
  padding: 0;
  justify-content: center;
  color: #f5f5f6;
  border-radius: 22px;
  background: #232326;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-back svg { width: 19px; height: 19px; }
html.uk8-ref-recharge .deposit-modal.n3r .n3r-rec {
  background: #232326 !important;
  border-color: #34343a !important;
  color: #e6e6e8 !important;
  border-radius: 20px !important;
  top: 16px;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tabs {
  gap: 10px;
  padding: 14px 24px 20px;
  overflow-x: auto;
  scrollbar-width: none;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tabs::-webkit-scrollbar { display: none; }
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tab,
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tab.on {
  flex: 0 0 auto;
  min-width: 105px;
  height: 42px;
  padding: 0 16px;
  border: 1px solid #34343a !important;
  border-radius: 24px;
  background: #171719 !important;
  color: #e6e6e8 !important;
  font-size: 14px;
  font-weight: 550;
  box-shadow: none !important;
  backdrop-filter: none;
}
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tab.on {
  border-color: #c2f238 !important;
  color: #d6fb72 !important;
  background: #222b19 !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .modal-body {
  padding: 0 24px !important;
  background: transparent !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .deposit-form.n3r-card,
html.uk8-ref-recharge .deposit-modal.n3r .x1-ucard,
html.uk8-ref-recharge .deposit-modal.n3r .x1-utips,
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tips {
  background: #171719 !important;
  color: #f5f5f6 !important;
  border: 1px solid #29292e !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .deposit-form.n3r-card { padding: 22px !important; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-ubox { padding: 0 24px !important; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-ucard { padding: 22px !important; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-urow,
html.uk8-ref-recharge .deposit-modal.n3r .x1-utt,
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tips-t,
html.uk8-ref-recharge .deposit-modal.n3r .form-label {
  color: #f5f5f6 !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-ucoinb {
  background: transparent !important;
  color: #f5f5f6 !important;
  border: 0 !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-ucoin {
  min-height: 52px;
  align-items: center;
  padding: 6px;
  border-radius: 14px;
  background: #25262a !important;
  border: 1px solid #34343a !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-uitem:last-child {
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  column-gap: 16px;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-uitem:last-child > .x1-urow { grid-column: 1 / -1; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-uqrrow {
  grid-column: 1;
  margin-top: 14px;
  display: block;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-uqr {
  width: 126px;
  height: 126px;
  margin: 0;
  padding: 9px;
  background: #fff;
  border-radius: 14px;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-uqr img { width: 108px; height: 108px; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-umin { padding: 9px 0 0; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-umint { color: #a4a4ad; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-uminv { color: #c2f238; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-uaddr {
  grid-column: 2;
  align-self: start;
  min-height: 126px;
  margin-top: 14px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-between;
  border: 0 !important;
  border-radius: 14px;
  background: #0b0b0c !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-uav {
  color: #eeeef0 !important;
  font-size: 13px;
  line-height: 1.55;
  overflow-wrap: anywhere;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-copy {
  align-self: flex-end;
  color: #c2f238 !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .x1-utips,
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tips { padding: 18px 20px; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-utips li,
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tips li { color: #b9b9c0 !important; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-utips .y,
html.uk8-ref-recharge .deposit-modal.n3r .n3r-tips .y { color: #c2f238 !important; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-okm .x1-urow { color: #f5f5f6 !important; }
html.uk8-ref-recharge .deposit-modal.n3r .x1-okpay {
  border-color: #c2f238;
  border-radius: 12px;
  background: #25262a;
}
html.uk8-ref-recharge .deposit-modal.n3r input.form-input {
  height: 52px !important;
  border: 1px solid #34343a !important;
  border-radius: 13px !important;
  background: #25262a !important;
  color: #fff !important;
  font-size: 16px !important;
}
html.uk8-ref-recharge .deposit-modal.n3r input.form-input::placeholder { color: #9999a2 !important; }
html.uk8-ref-recharge .deposit-modal.n3r .reward-setting {
  background: #171719 !important;
  border: 1px solid #34343a !important;
  border-radius: 14px !important;
  min-height: 52px;
}
html.uk8-ref-recharge .deposit-modal.n3r .reward-setting * { color: #d5d5db !important; }
html.uk8-ref-recharge .deposit-modal.n3r .reward-dropdown__panel {
  background: #232326 !important;
  border-color: #34343a !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .reward-option { color: #e6e6e8 !important; }
html.uk8-ref-recharge .deposit-modal.n3r .reward-option.active { color: #c2f238 !important; }
html.uk8-ref-recharge .deposit-modal.n3r .uk8-amount-presets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0 0;
}
html.uk8-ref-recharge .deposit-modal.n3r .uk8-amount-presets button {
  min-width: 0;
  height: 43px;
  border: 0;
  border-radius: 13px;
  background: #27301d;
  color: #c2f238;
  font-size: 14px;
  font-weight: 650;
  cursor: pointer;
}
html.uk8-ref-recharge .deposit-modal.n3r .uk8-amount-presets button:active { transform: scale(.98); }
html.uk8-ref-recharge .deposit-modal.n3r .ng03-submit {
  height: 52px !important;
  border-radius: 14px !important;
  background: #c2f238 !important;
  color: #10110d !important;
  box-shadow: none !important;
  font-size: 0 !important;
}
html.uk8-ref-recharge .deposit-modal.n3r .ng03-submit::after {
  content: "充值";
  color: #10110d;
  font-size: 18px;
  font-weight: 700;
  line-height: 52px;
}
html.uk8-ref-recharge.n3r-open #woai-tz-tabbar,
html.uk8-ref-recharge.n3r-open #ngtb-bar,
html.uk8-ref-recharge.n3r-open .mplayer-layer {
  display: none !important;
}
@media (max-width: 390px) {
  html.uk8-ref-recharge .deposit-modal.n3r .n3r-tabs { padding-left: 16px; padding-right: 16px; }
  html.uk8-ref-recharge .deposit-modal.n3r .modal-body { padding: 0 16px !important; }
  html.uk8-ref-recharge .deposit-modal.n3r .x1-ubox { padding: 0 16px !important; }
  html.uk8-ref-recharge .deposit-modal.n3r .x1-uitem:last-child { grid-template-columns: 104px minmax(0, 1fr); gap: 10px; }
  html.uk8-ref-recharge .deposit-modal.n3r .x1-uqr { width: 104px; height: 104px; padding: 7px; }
  html.uk8-ref-recharge .deposit-modal.n3r .x1-uqr img { width: 90px; height: 90px; }
  html.uk8-ref-recharge .deposit-modal.n3r .x1-uaddr { min-height: 104px; }
}
