:root {
  --sx96-header-h: 76px;
  --sx96-line: rgba(172, 196, 228, 0.22);
  --sx96-line-strong: rgba(205, 222, 244, 0.42);
  --sx96-ink: #eef3f9;
  --sx96-muted: #909cad;
  --sx96-panel: #070c14;
}

/* One viewport-owned loader. It is deliberately detached from every route shell. */
#sx96-global-loader {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  display: grid !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-width: 100vw !important;
  min-height: 100dvh !important;
  place-items: center !important;
  overflow: hidden !important;
  background: #03070c !important;
  transform: none !important;
  contain: none !important;
  margin: 0 !important;
  padding: 0 !important;
  translate: none !important;
  max-width: none !important;
  max-height: none !important;
  box-sizing: border-box !important;
}

#sx96-global-loader .sx96-loader-core {
  position: relative !important;
  isolation: isolate;
  display: grid !important;
  width: min(248px, 68vw) !important;
  justify-items: center !important;
  gap: 25px !important;
  transform: translateZ(0) !important;
}

#sx96-global-loader .sx96-loader-core::before {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 196px;
  height: 196px;
  border-radius: 999px;
  background: radial-gradient(circle at 50% 50%, rgba(154, 192, 239, 0.17) 0 11%, rgba(88, 133, 190, 0.075) 34%, transparent 70%);
  filter: none;
  content: "";
  transform: translate(-50%, -60%);
  animation: sx96-loader-breathe 1.8s ease-in-out infinite;
}

.sx96-loader-source-hidden {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#sx96-global-loader img {
  position: relative !important;
  display: block !important;
  width: 82px !important;
  height: 82px !important;
  object-fit: contain !important;
  filter: none !important;
  transform: none !important;
}

#sx96-global-loader .sx96-loader-track {
  position: relative;
  width: 100%;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(135, 157, 185, 0.18);
}

#sx96-global-loader .sx96-loader-track::after {
  position: absolute;
  inset: 0 auto 0 0;
  width: 42%;
  border-radius: inherit;
  background: #b8cee9;
  content: "";
  animation: sx96-loader-progress 1.2s cubic-bezier(.4, 0, .2, 1) infinite;
}

@keyframes sx96-loader-breathe {
  0%, 100% { opacity: .62; transform: translate(-50%, -60%) scale(.9); }
  50% { opacity: 1; transform: translate(-50%, -60%) scale(1.08); }
}

@keyframes sx96-loader-progress {
  0% { transform: translateX(-112%); }
  100% { transform: translateX(340%); }
}

/* Processing pages retain the same global navigation as the rest of the product. */
body.suh-active.sundex-transaction-system {
  padding-top: var(--sx96-header-h) !important;
  box-sizing: border-box !important;
}

body.suh-active.sx96-processing-route {
  padding-top: var(--sx96-header-h) !important;
  box-sizing: border-box !important;
}

/* p43 hid every direct header on processing routes. The unified product
   header is deliberately restored after that broad legacy selector. */
body.sundex-transaction-system > header.suh-header,
body.sundex-transaction-system [role="banner"].suh-header,
body.suh-active.sundex-transaction-system > .suh-header {
  position: fixed !important;
  z-index: 2147482000 !important;
  inset: 0 0 auto !important;
  display: block !important;
  width: 100% !important;
  height: var(--suh-height, var(--sx96-header-h)) !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

body.suh-active.sundex-transaction-system .platform-header,
body.suh-active.sundex-transaction-system .smi-nav,
body.suh-active.sundex-transaction-system .platform-page-name,
body.suh-active.sundex-transaction-system .platform-brand-context {
  display: none !important;
}

body.suh-active.sundex-transaction-system .stx-shell {
  min-height: calc(100dvh - var(--sx96-header-h)) !important;
}

body.suh-active.sundex-transaction-system .platform-main,
body.suh-active.sundex-transaction-system main.platform-main {
  height: calc(100dvh - var(--sx96-header-h)) !important;
  min-height: max(620px, calc(100dvh - var(--sx96-header-h))) !important;
}

body.sx96-processing-route .platform-page-name,
body.sx96-processing-route .platform-brand-context,
body.sx96-processing-route .platform-header:not(.suh-header) {
  display: none !important;
}

.stx-head {
  position: relative !important;
}

.stx-head > .sx96-processing-mode-switch,
.stx-head > .stx-mode-switch.sx96-processing-mode-switch {
  display: none !important;
}

.stx-head .stx-back-control,
.stx-head .sx96-back-control {
  position: absolute !important;
  top: 2px !important;
  right: 0 !important;
  display: inline-flex !important;
  width: auto !important;
  min-width: 112px !important;
  height: 48px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 0 !important;
  border: 1px solid var(--sx96-line-strong) !important;
  border-radius: 999px !important;
  background: rgba(4, 8, 14, 0.7) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  color: var(--sx96-ink) !important;
  font: inherit !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  cursor: pointer !important;
  backdrop-filter: blur(14px) !important;
  transition: border-color 180ms ease, background 180ms ease, transform 180ms ease !important;
}

.stx-head .stx-back-control:hover,
.stx-head .sx96-back-control:hover {
  border-color: rgba(225, 235, 249, .72) !important;
  background: rgba(15, 21, 31, .78) !important;
  transform: translateY(-1px) !important;
}

.stx-stage,
.stx-stage-panel,
.stx-order-form,
.stx-process-frame {
  min-width: 0 !important;
}

.stx-stage-coins,
.stx-vf-coin-list,
.sx96-coin-list {
  max-height: min(430px, 48dvh) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
  border-radius: 18px !important;
  clip-path: inset(0 round 18px) !important;
}

.stx-stage-coins > *,
.stx-vf-coin-list > *,
.sx96-coin-list > * {
  max-width: 100% !important;
}

.sx96-buycard-asset {
  position: relative !important;
  min-height: 138px !important;
  overflow: hidden !important;
  border: 1px solid var(--sx96-line) !important;
  border-radius: 18px !important;
  background: rgba(5, 10, 17, .72) !important;
  padding: 24px 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  text-align: center !important;
}

.sx96-buycard-asset > div,
.sx96-buycard-asset > span {
  display: flex !important;
  min-width: 0 !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-align: center !important;
}

.sx96-buycard-asset :is(p, span, strong) {
  margin: 0 !important;
  line-height: 1.18 !important;
}

.sx96-buycard-asset img,
.sx96-buycard-asset svg {
  width: 48px !important;
  height: 48px !important;
  max-width: 48px !important;
  max-height: 48px !important;
  flex: 0 0 48px !important;
  object-fit: contain !important;
  filter: none !important;
}

.sx96-buycard-asset:hover {
  border-color: var(--sx96-line-strong) !important;
  background: rgba(10, 16, 25, .86) !important;
}

/* Card dashboard: one stable frame, two faces, no layout reflow while flipping. */
.scp-dashboard-stage .sx96-card-perspective,
.scp-dashboard-stage > div[style*="perspective"] {
  position: relative !important;
  width: min(100%, 570px) !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1.586 / 1 !important;
  margin: 0 !important;
  perspective: 1500px !important;
  transform: translateZ(0) !important;
  overflow: visible !important;
}

.scp-dashboard-stage .sx96-card-perspective > .scp-dashboard-flip-body,
.scp-dashboard-stage > div[style*="perspective"] > .scp-dashboard-flip-body {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  transform-style: preserve-3d !important;
  transform-origin: 50% 50% !important;
  transition: transform 460ms cubic-bezier(.22, .8, .22, 1) !important;
  will-change: transform !important;
  max-width: none !important;
  max-height: none !important;
}

.scp-dashboard-card-front,
.scp-dashboard-card-back {
  position: absolute !important;
  inset: 0 !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
  transform-origin: 50% 50% !important;
  margin: 0 !important;
  translate: none !important;
  max-width: none !important;
  max-height: none !important;
}

.scp-dashboard-card-front > img,
.scp-dashboard-card-front picture,
.scp-dashboard-card-front picture > img,
.scp-dashboard-card-back > img,
.scp-dashboard-card-back picture,
.scp-dashboard-card-back picture > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  transform: none !important;
}

.scp-dashboard-card-front { transform: rotateY(0deg) translateZ(.1px) !important; }
.scp-dashboard-card-back { transform: rotateY(180deg) translateZ(.1px) !important; }

.scp-dashboard-card-back .scp-card-back-details,
.scp-dashboard-card-back [data-card-details] {
  color: rgba(245, 248, 252, .92) !important;
}

@media (min-width: 980px) {
  .scp-card-dashboard {
    grid-template-columns: minmax(0, 1.14fr) minmax(360px, .86fr) !important;
    grid-template-rows: auto minmax(400px, auto) auto !important;
    grid-template-areas:
      "intro balance"
      "card controls"
      "ledger ledger" !important;
    column-gap: clamp(48px, 6vw, 104px) !important;
  }

  .scp-dashboard-copy { grid-area: intro !important; }

  .scp-dashboard-balance {
    grid-area: balance !important;
    align-self: start !important;
  }

  .scp-dashboard-stage {
    grid-area: card !important;
    min-height: 400px !important;
    padding: 20px 64px 18px 4px !important;
    align-items: start !important;
    justify-items: start !important;
  }

  .scp-dashboard-actions {
    grid-area: controls !important;
    align-self: center !important;
    margin: 0 !important;
  }

  .scp-dashboard-ledger { grid-area: ledger !important; }
}

/* Wallet table geometry uses one column contract for headers and data. */
.wallet-assets-panel [role="row"].sx96-wallet-columns,
.wallet-assets-panel .wallet-asset-row,
.wallet-assets-panel .sx92-wallet-head-row,
.wallet-assets-panel .sx92-wallet-asset-row,
.wallet-assets-panel [role="row"] {
  display: grid !important;
  grid-template-columns: minmax(210px, 1.7fr) minmax(96px, .72fr) minmax(122px, .86fr) minmax(100px, .76fr) minmax(92px, .62fr) !important;
  align-items: center !important;
  column-gap: clamp(16px, 2vw, 34px) !important;
  padding-right: 28px !important;
  padding-left: 28px !important;
}

.wallet-assets-panel [role="row"].sx96-wallet-columns > :not(:first-child),
.wallet-assets-panel .wallet-asset-row > :not(:first-child),
.wallet-assets-panel .sx92-wallet-head-row > :not(:first-child),
.wallet-assets-panel .sx92-wallet-asset-row > :not(:first-child),
.wallet-assets-panel [role="row"] > :not(:first-child) {
  justify-self: end !important;
  width: 100% !important;
  text-align: right !important;
}

.wallet-assets-panel [role="row"].sx96-wallet-columns > :first-child,
.wallet-assets-panel .wallet-asset-row > :first-child,
.wallet-assets-panel .sx92-wallet-head-row > :first-child,
.wallet-assets-panel .sx92-wallet-asset-row > :first-child,
.wallet-assets-panel [role="row"] > :first-child {
  justify-self: start !important;
  width: 100% !important;
  text-align: left !important;
}

.wallet-assets-panel .wallet-asset-row > :last-child {
  justify-content: flex-end !important;
}

.wallet-assets-panel {
  min-width: 0 !important;
  overflow: hidden !important;
}

.wallet-assets-panel :is([role="row"].sx96-wallet-columns, .wallet-asset-row, .sx92-wallet-head-row, .sx92-wallet-asset-row, [role="row"]) > * {
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.wallet-assets-panel > :first-child {
  box-sizing: border-box !important;
  padding-right: 28px !important;
  padding-left: 28px !important;
}

.wallet-action-grid + .sx96-aml-card,
.sx96-aml-card {
  width: 100% !important;
  margin: 16px 0 !important;
}

/* p88 still owns the markets portal and may mark it hidden while the trade
   route hydrates.  A populated stable terminal must remain visible. */
body.sx96-trade-route #sx88-route-portal:has(.sx92-trade-fallback),
body.sx96-trade-route #sx88-route-portal[hidden]:has(.sx92-trade-fallback) {
  display: block !important;
  min-height: calc(100svh - var(--sx96-header-h)) !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.sx96-wallet-legacy-legal {
  display: none !important;
}

.wallet-activity-panel,
.wallet-activity-table {
  min-width: 0 !important;
  overflow: hidden !important;
}

.wallet-activity-panel .sx96-wallet-activity-row,
.wallet-activity-table .sx96-wallet-activity-row {
  min-width: 0 !important;
  padding-right: 22px !important;
  padding-left: 22px !important;
  column-gap: 14px !important;
}

.wallet-activity-panel .sx96-wallet-activity-row > *,
.wallet-activity-table .sx96-wallet-activity-row > * {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.wallet-activity-panel .sx96-wallet-activity-row > :last-child,
.wallet-activity-table .sx96-wallet-activity-row > :last-child {
  justify-self: end !important;
  max-width: 100% !important;
  text-align: right !important;
}

.sx96-aml-card {
  overflow: hidden !important;
  border: 1px solid rgba(224, 143, 153, .28) !important;
  border-radius: 16px !important;
  background: rgba(32, 18, 24, .74) !important;
}

@media (max-width: 979px) {
  :root { --sx96-header-h: 70px; }

  .stx-head .stx-back-control,
  .stx-head .sx96-back-control {
    position: static !important;
    min-width: 96px !important;
    height: 42px !important;
    margin: 0 0 18px auto !important;
  }

  .scp-dashboard-stage {
    min-height: 0 !important;
    padding: 0 !important;
  }

  .scp-dashboard-stage .sx96-card-perspective,
  .scp-dashboard-stage > div[style*="perspective"] {
    width: 100% !important;
  }

  .wallet-assets-panel [role="row"].sx96-wallet-columns,
  .wallet-assets-panel .wallet-asset-row,
  .wallet-assets-panel .sx92-wallet-head-row,
  .wallet-assets-panel .sx92-wallet-asset-row,
  .wallet-assets-panel [role="row"] {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 14px !important;
    padding-right: 18px !important;
    padding-left: 18px !important;
  }

  .wallet-assets-panel :is([role="row"].sx96-wallet-columns, .wallet-asset-row, .sx92-wallet-head-row, .sx92-wallet-asset-row, [role="row"]) > :nth-child(2),
  .wallet-assets-panel :is([role="row"].sx96-wallet-columns, .wallet-asset-row, .sx92-wallet-head-row, .sx92-wallet-asset-row, [role="row"]) > :nth-child(3),
  .wallet-assets-panel :is([role="row"].sx96-wallet-columns, .wallet-asset-row, .sx92-wallet-head-row, .sx92-wallet-asset-row, [role="row"]) > :nth-child(5) {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #sx96-global-loader .sx96-loader-core::before,
  #sx96-global-loader .sx96-loader-track::after { animation: none !important; }
  .scp-dashboard-stage .sx96-card-perspective > .scp-dashboard-flip-body,
  .scp-dashboard-stage > div[style*="perspective"] > .scp-dashboard-flip-body { transition-duration: 1ms !important; }
}