/* SUNDEX withdraw right-rail and verification payment — p130.
 * Loaded last and scoped to /withdraw by sundex-withdraw-layout-p127.js.
 * The unified header already owns its vertical space; the processing route
 * must consume only the remaining viewport and scroll inside the ticket.
 */

body.sx127-withdraw-layout {
  overflow: hidden !important;
  overscroll-behavior: none !important;
}

body.sx127-withdraw-layout #root {
  width: 100% !important;
  height: calc(100dvh - var(--sx127-header-h, var(--sx96-header-h, 76px))) !important;
  min-height: 0 !important;
  max-height: calc(100dvh - var(--sx127-header-h, var(--sx96-header-h, 76px))) !important;
  overflow: hidden !important;
}

body.sx127-withdraw-layout #root > .platform-shell {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

body.sx127-withdraw-layout .platform-main,
body.sx127-withdraw-layout main.platform-main {
  flex: 1 1 0% !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

body.sx127-withdraw-layout .stx-funding-shell,
body.sx127-withdraw-layout .stx-shell.sx127-withdraw-shell {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  grid-template-columns: minmax(300px, 43%) minmax(0, 57%) !important;
  grid-template-rows: 132px minmax(0, 1fr) !important;
  grid-template-areas: "context head" "context stage" !important;
  align-content: stretch !important;
  align-items: stretch !important;
  overflow: hidden !important;
}

body.sx127-withdraw-layout .stx-context {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
}

body.sx127-withdraw-layout .stx-head {
  min-width: 0 !important;
  min-height: 0 !important;
}

body.sx127-withdraw-layout .stx-stage,
body.sx127-withdraw-layout .stx-vf-stage,
body.sx127-withdraw-layout .stx-stage.sx123-stage {
  min-width: 0 !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-gutter: stable !important;
}

body.sx127-withdraw-layout .stx-stage > *,
body.sx127-withdraw-layout .stx-vf-stage > *,
body.sx127-withdraw-layout .sx123-motion-host {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.sx127-withdraw-layout .stx-stage::-webkit-scrollbar,
body.sx127-withdraw-layout .stx-vf-stage::-webkit-scrollbar,
body.sx127-withdraw-layout .stx-vf-coins-list::-webkit-scrollbar {
  width: 6px;
}

body.sx127-withdraw-layout .stx-stage::-webkit-scrollbar-thumb,
body.sx127-withdraw-layout .stx-vf-stage::-webkit-scrollbar-thumb,
body.sx127-withdraw-layout .stx-vf-coins-list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(175, 195, 221, 0.24);
}

/* Withdrawal details: the old summary was visually hidden but still occupied
 * a grid row. Its 24px ghost row also pushed the sticky CTA over the address. */
body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-stack {
  display: grid !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 14px !important;
}

body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-stack > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.sx127-withdraw-layout .stx-stage-amount
  .rounded-xl.bg-secondary.border.border-border.p-3.space-y-2.stx-withdraw-summary--fee-only,
body.sx127-withdraw-layout .stx-stage-amount
  .rounded-xl.bg-secondary.border.border-border.p-3.space-y-2.stx-withdraw-summary--empty,
body.sx127-withdraw-layout .stx-stage-amount
  .rounded-xl.bg-secondary.border.border-border.p-3.space-y-2.stx-withdraw-summary[hidden],
body.sx127-withdraw-layout .stx-stage-amount
  .rounded-xl.bg-secondary.border.border-border.p-3.space-y-2.stx-withdraw-summary[aria-hidden="true"] {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-address {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
}

body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-address > * {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-address > .text-xs.font-medium.text-muted-foreground {
  margin: 0 !important;
}

body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-stack > button:last-child {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 4px 0 0 !important;
  transform: none;
}

/* Verification screens must inherit the ticket height instead of introducing
 * a second viewport-based minimum height. */
body.sx127-withdraw-layout.sx123-verification-flow .sx123-stage {
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
}

body.sx127-withdraw-layout.sx123-verification-flow .sx123-screen {
  min-height: 0 !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-required-screen {
  min-height: 100% !important;
  padding-top: clamp(28px, 5vh, 54px) !important;
  padding-bottom: clamp(32px, 5.5vh, 62px) !important;
}

body.sx127-withdraw-layout.sx123-verification-coins .stx-vf-coins-list,
body.sx127-withdraw-layout.sx123-verification-coins [class*="coin-list"] {
  min-height: 0 !important;
  max-height: min(430px, calc(100dvh - var(--sx127-header-h, 76px) - 300px)) !important;
}

@media (max-height: 760px) and (min-width: 901px) {
  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-screen {
    padding: 20px 28px 30px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-warning {
    width: 64px !important;
    height: 64px !important;
    margin-bottom: 20px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-warning svg {
    width: 35px !important;
    height: 35px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-title {
    margin-bottom: 16px !important;
    font-size: 36px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-copy {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-copy-secondary {
    margin-top: 14px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-actions {
    margin-top: 26px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-primary {
    height: 56px !important;
    min-height: 56px !important;
  }
}

@media (max-width: 1000px) {
  body.sx127-withdraw-layout .stx-funding-shell,
  body.sx127-withdraw-layout .stx-shell.sx127-withdraw-shell {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    grid-template-areas: "head" "stage" !important;
  }

  body.sx127-withdraw-layout .stx-head {
    align-self: start !important;
  }

  body.sx127-withdraw-layout .stx-stage,
  body.sx127-withdraw-layout .stx-vf-stage,
  body.sx127-withdraw-layout .stx-stage.sx123-stage {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.sx127-withdraw-layout .stx-ticket-frame {
    inset: 12px !important;
    width: auto !important;
    height: auto !important;
    max-height: calc(100% - 16px) !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-screen {
    min-height: 0 !important;
  }
}

@media (max-width: 1000px) and (min-width: 641px) and (max-height: 740px) {
  body.sx127-withdraw-layout .stx-head {
    padding-top: 16px !important;
    padding-bottom: 6px !important;
  }

  body.sx127-withdraw-layout .stx-stage,
  body.sx127-withdraw-layout .stx-vf-stage {
    padding-bottom: 28px !important;
  }
}

@media (max-width: 640px) {
  body.sx127-withdraw-layout .stx-ticket-frame {
    inset: 8px !important;
  }

  body.sx127-withdraw-layout .stx-head {
    padding: 26px 18px 6px !important;
  }

  body.sx127-withdraw-layout .stx-stage,
  body.sx127-withdraw-layout .stx-vf-stage {
    margin: 0 8px 8px !important;
    padding: 12px 20px max(32px, env(safe-area-inset-bottom)) !important;
  }

  body.sx127-withdraw-layout .stx-stage-amount {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  body.sx127-withdraw-layout .stx-stage-amount > .stx-withdraw-form,
  body.sx127-withdraw-layout .stx-stage-amount > .w-full {
    padding-bottom: 22px !important;
  }

  body.sx127-withdraw-layout .stx-stage-amount .stx-withdraw-stack {
    gap: 13px !important;
  }

  body.sx127-withdraw-layout.sx123-verification-flow .sx123-screen,
  body.sx127-withdraw-layout.sx123-verification-required .sx123-required-screen,
  body.sx127-withdraw-layout.sx123-verification-coins .sx123-coins-screen,
  body.sx127-withdraw-layout.sx123-verification-deposit .sx123-deposit-screen {
    width: 100% !important;
    margin: 0 auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  body.sx127-withdraw-layout.sx123-verification-coins .stx-vf-coins-list,
  body.sx127-withdraw-layout.sx123-verification-coins [class*="coin-list"] {
    max-height: min(48dvh, 390px) !important;
  }
}

/* Keep the complete metal outline above the left context artwork. */
body.sx127-withdraw-layout .stx-context {
  z-index: 0 !important;
}

body.sx127-withdraw-layout .stx-ticket-frame {
  z-index: 1 !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(193, 216, 248, 0.46) !important;
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.44),
    0 0 40px rgba(80, 116, 165, 0.08),
    inset 0 0 0 1px rgba(152, 187, 232, 0.18) !important;
}

/* The legacy actions wrapper still had two grid tracks after the Back action
 * was removed. A single centered flex track places the remaining CTA on the
 * same axis as the icon, title and copy. */
body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-actions {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center !important;
  justify-content: center !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-primary {
  flex: 0 1 520px !important;
}

/* Verification payment: a deliberate payment hierarchy instead of a loose
 * collection of cards. QR is primary, amount/status are paired, and transfer
 * details occupy one calm full-width rail below. */
body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen {
  width: min(100%, 760px) !important;
  max-width: 760px !important;
  padding-top: 8px !important;
  padding-bottom: 36px !important;
  display: grid !important;
  grid-template-columns: 248px minmax(0, 1fr) !important;
  grid-template-areas:
    "eyebrow eyebrow"
    "head head"
    "qr amount"
    "qr status"
    "address address"
    "memo memo"
    "warning warning"
    "close close" !important;
  column-gap: 24px !important;
  row-gap: 16px !important;
  align-items: start !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen > .stx-vf-eyebrow {
  margin: 0 !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen > .stx-vf-section-head {
  margin: -2px 0 8px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen > .stx-vf-section-head h2 {
  margin-bottom: 8px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-qr-cell {
  width: 248px !important;
  min-width: 248px !important;
  height: 248px !important;
  min-height: 248px !important;
  padding: 13px !important;
  display: grid !important;
  place-items: center !important;
  align-self: start !important;
  justify-self: start !important;
  border: 1px solid rgba(185, 207, 236, 0.24) !important;
  border-radius: 18px !important;
  background: rgba(7, 12, 20, 0.9) !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-qr {
  width: 220px !important;
  max-width: 220px !important;
  height: 220px !important;
  max-height: 220px !important;
  margin: 0 !important;
  padding: 12px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-deposit-amount {
  min-height: 150px !important;
  margin: 0 !important;
  padding: 22px 24px !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
  border: 1px solid rgba(185, 207, 236, 0.2) !important;
  border-radius: 16px !important;
  background: rgba(7, 12, 20, 0.82) !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-deposit-amount > p:first-child {
  color: #aeb9c8 !important;
  font-size: 14px !important;
  font-weight: 520 !important;
  line-height: 1.3 !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-deposit-amount > div p {
  color: #f3f6fa !important;
  font-size: 30px !important;
  font-weight: 570 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.025em !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-status-row {
  width: 100% !important;
  min-height: 82px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-status-row > div {
  box-sizing: border-box !important;
  width: 100% !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  border: 1px solid rgba(185, 207, 236, 0.16) !important;
  border-radius: 14px !important;
  background: rgba(9, 15, 24, 0.74) !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-address,
body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-memo {
  display: grid !important;
  gap: 9px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-address label,
body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-memo label {
  margin: 0 !important;
  color: #dce3ec !important;
  font-size: 14px !important;
  font-weight: 560 !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-address > div,
body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-memo > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 56px !important;
  gap: 10px !important;
  align-items: stretch !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-address > div > div,
body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-memo > div > div {
  box-sizing: border-box !important;
  min-width: 0 !important;
  min-height: 64px !important;
  padding: 16px 18px !important;
  display: flex !important;
  align-items: center !important;
  overflow-wrap: anywhere !important;
  border-radius: 13px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-address > div > button,
body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-memo > div > button {
  width: 56px !important;
  min-width: 56px !important;
  height: 64px !important;
  min-height: 64px !important;
  border-radius: 13px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-warning {
  padding: 14px 16px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  border-radius: 13px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen > .stx-vf-close {
  justify-self: end !important;
  margin-top: 2px !important;
}

@container (max-width: 640px) {
  body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen {
    width: 100% !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "eyebrow"
      "head"
      "qr"
      "amount"
      "status"
      "address"
      "memo"
      "warning"
      "close" !important;
  }

  body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-qr-cell {
    justify-self: center !important;
  }
}

@media (max-width: 640px) {
  body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-qr-cell {
    width: 220px !important;
    min-width: 220px !important;
    height: 220px !important;
    min-height: 220px !important;
  }

  body.sx127-withdraw-layout.sx123-verification-deposit .sx130-payment-screen .stx-vf-qr {
    width: 194px !important;
    max-width: 194px !important;
    height: 194px !important;
    max-height: 194px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.sx127-withdraw-layout .stx-stage,
  body.sx127-withdraw-layout .stx-vf-stage {
    scroll-behavior: auto !important;
  }
}

/* The metal ticket begins at 43% + its 36px inset. Keep every processing
 * screen on that same rail and let no child calculate against the old 35/65
 * split. */
body.sx127-withdraw-layout .stx-head,
body.sx127-withdraw-layout .stx-stage,
body.sx127-withdraw-layout .stx-vf-stage,
body.sx127-withdraw-layout .stx-stage > *,
body.sx127-withdraw-layout .stx-vf-stage > * {
  box-sizing: border-box !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.sx127-withdraw-layout .stx-head h1,
body.sx127-withdraw-layout .stx-head .stx-step-meta,
body.sx127-withdraw-layout .stx-stage h1,
body.sx127-withdraw-layout .stx-stage h2,
body.sx127-withdraw-layout .stx-stage h3,
body.sx127-withdraw-layout .stx-stage p {
  max-width: 100% !important;
  white-space: normal !important;
}

body.sx127-withdraw-layout .stx-stage button,
body.sx127-withdraw-layout .stx-stage input,
body.sx127-withdraw-layout .stx-stage select,
body.sx127-withdraw-layout .stx-stage textarea {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* Step 1 — asset selection. The heading, helper copy, search and list share
 * the usable width inside the right ticket instead of the shell width. */
body.sx127-withdraw-layout[data-sx127-withdraw-stage="coin"] .stx-stage > *,
body.sx127-withdraw-layout[data-sx127-withdraw-stage="network"] .stx-stage > *,
body.sx127-withdraw-layout .stx-stage-coins > * {
  width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

body.sx127-withdraw-layout .stx-stage-coins .text-center,
body.sx127-withdraw-layout .stx-stage-coins .text-left {
  box-sizing: border-box !important;
  width: 100% !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* Step 2 — details. Once the rail itself is corrected, keep the form
 * geometrically centered; the rail correction supplies the requested small
 * move to the right without an arbitrary translate. */
body.sx127-withdraw-layout[data-sx127-withdraw-stage="details"] .stx-stage-amount > .w-full,
body.sx127-withdraw-layout[data-sx127-withdraw-stage="details"] .stx-stage-amount > .stx-withdraw-form {
  width: 100% !important;
  max-width: 720px !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

/* Step 3 — verification gate. The left context remains untouched. All gate
 * elements use one centerline inside the right ticket. */
body.sx127-withdraw-layout.sx126-verification-required .sx123-motion-host {
  display: flex !important;
  width: 100% !important;
  justify-content: center !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-required-screen {
  width: min(100%, 620px) !important;
  max-width: 620px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-warning,
body.sx127-withdraw-layout.sx126-verification-required .sx126-required-title,
body.sx127-withdraw-layout.sx126-verification-required .sx126-required-copy,
body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-actions {
  position: static !important;
  inset: auto !important;
  align-self: center !important;
  margin-right: auto !important;
  margin-left: auto !important;
  translate: none !important;
  transform: none !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-required-title {
  font-size: 40px !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-required-copy {
  width: min(100%, 560px) !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-actions {
  width: min(100%, 520px) !important;
}

body.sx127-withdraw-layout.sx126-verification-required .sx126-verification-primary {
  position: static !important;
  inset: auto !important;
  width: 100% !important;
  translate: none !important;
}

/* Step 4 — verification deposit. Rebuild the dense portion on a stable
 * two-column grid, then stack it from the stage's own width rather than from
 * the viewport. */
body.sx127-withdraw-layout .stx-stage,
body.sx127-withdraw-layout .stx-vf-stage {
  container-type: inline-size;
}

body.sx127-withdraw-layout.sx123-verification-flow .sx123-motion-host {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 0 !important;
}

body.sx127-withdraw-layout.sx123-verification-coins .sx123-coins-screen,
body.sx127-withdraw-layout.sx123-verification-deposit .sx123-deposit-screen {
  box-sizing: border-box !important;
  width: min(100%, 720px) !important;
  max-width: 720px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
}

body.sx127-withdraw-layout.sx123-verification-coins .stx-vf-coins-layout,
body.sx127-withdraw-layout.sx123-verification-coins .stx-vf-coins-list,
body.sx127-withdraw-layout.sx123-verification-coins [class*="coin-list"] {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .sx123-deposit-screen {
  display: grid !important;
  grid-template-columns: 184px minmax(0, 1fr) !important;
  grid-template-areas:
    "eyebrow eyebrow"
    "head head"
    "qr amount"
    "qr status"
    "address address"
    "memo memo"
    "warning warning"
    "close close" !important;
  column-gap: 20px !important;
  row-gap: 16px !important;
  align-items: start !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-qr-cell {
  box-sizing: border-box !important;
  width: 184px !important;
  min-width: 184px !important;
  height: 184px !important;
  min-height: 184px !important;
  align-self: start !important;
  justify-self: start !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-qr {
  width: 160px !important;
  height: 160px !important;
  max-width: 160px !important;
  max-height: 160px !important;
  margin: 0 auto !important;
  padding: 10px !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-deposit-amount,
body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-status-row,
body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-address,
body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-memo,
body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-warning {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}

body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-deposit-amount {
  min-height: 112px !important;
}

@container (max-width: 620px) {
  body.sx127-withdraw-layout.sx123-verification-deposit .sx123-deposit-screen {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas:
      "eyebrow"
      "head"
      "qr"
      "amount"
      "status"
      "address"
      "memo"
      "warning"
      "close" !important;
  }

  body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-qr-cell {
    justify-self: center !important;
  }
}

@media (max-width: 1200px) and (min-width: 1001px) {
  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-title {
    font-size: 34px !important;
  }

  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-screen {
    padding-top: 24px !important;
    padding-bottom: 36px !important;
  }
}

@media (max-width: 640px) {
  body.sx127-withdraw-layout.sx126-verification-required .sx126-required-title {
    font-size: 31px !important;
  }

  body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-qr-cell {
    width: 164px !important;
    min-width: 164px !important;
    height: 164px !important;
    min-height: 164px !important;
  }

  body.sx127-withdraw-layout.sx123-verification-deposit .stx-vf-qr {
    width: 140px !important;
    height: 140px !important;
    max-width: 140px !important;
    max-height: 140px !important;
  }
}