:root {
  --tw-ink: var(--lx-ink, #2b211c);
  --tw-ink-2: var(--lx-ink-2, #4d4038);
  --tw-muted: var(--lx-muted, #81736a);
  --tw-line: var(--lx-line, #e9ded4);
  --tw-line-strong: var(--lx-line-strong, #d7c8bc);
  --tw-paper: var(--lx-paper, #fffdfa);
  --tw-paper-2: var(--lx-paper-2, #f5efe8);
  --tw-brand: var(--lx-orange, #ee4d2d);
  --tw-brand-soft: var(--lx-orange-soft, #fff0e9);
  --tw-green: var(--lx-green, #23865f);
  --tw-amber: #b7791f;
  --tw-danger: var(--lx-danger, #c83d37);
  --tw-radius: 16px;
  --tw-radius-sm: 10px;
  --tw-shadow: none;
  --tw-ease: cubic-bezier(.2, .7, .2, 1);
}
:root[data-theme="dark"] {
  --tw-amber: #e2b05a;
  --tw-shadow: none;
}

.st-content h1,
.st-content h2 {
  text-wrap: balance;
}
.st-content p {
  text-wrap: pretty;
}
.tw-intro h1 {
  margin: 0;
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.05;
}
.tw-intro + .px-subtabs {
  margin-top: 16px;
}

.tw-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .2s var(--tw-ease), border-color .2s var(--tw-ease), transform .15s var(--tw-ease), color .2s var(--tw-ease);
}
.tw-btn:hover {
  background: color-mix(in srgb, var(--tw-paper-2) 70%, var(--tw-line));
}
.tw-btn:active {
  transform: translateY(1px) scale(.99);
}
.tw-btn:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: 2px;
}
.tw-btn-primary {
  border-color: var(--tw-brand);
  background: var(--tw-brand);
  color: #fff;
}
.tw-btn-primary:hover {
  background: color-mix(in srgb, var(--tw-brand) 88%, #2b211c);
  border-color: color-mix(in srgb, var(--tw-brand) 88%, #2b211c);
}
.tw-btn-quiet {
  border-color: transparent;
  background: transparent;
  color: var(--tw-ink-2);
}
.tw-btn-quiet:hover {
  background: var(--tw-paper-2);
  border-color: transparent;
}

.tw-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 14px;
}
.tw-section-head h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.tw-section-meta {
  font-size: 13px;
  color: var(--tw-muted);
}

.tw-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  max-width: 46ch;
  padding: 28px 0 8px;
  color: var(--tw-muted);
  font-size: 14px;
  line-height: 1.55;
}
.tw-empty p {
  margin: 0;
}
.tw-empty-title {
  font-size: 17px;
  font-weight: 700;
  color: var(--tw-ink);
}
.tw-empty .tw-btn {
  margin-top: 10px;
}

.tw-wallet {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 22px;
}
.tw-balance {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 30px 32px 28px;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.tw-balance p {
  margin: 0;
}
.tw-balance-label {
  font-size: 14px;
  font-weight: 600;
  color: var(--tw-muted);
}
.tw-balance-amount {
  margin-top: 6px !important;
  font-size: clamp(40px, 5vw, 60px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.tw-balance-note {
  max-width: 52ch;
  margin-top: 12px !important;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--tw-muted);
}
.tw-balance-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  flex: 0 0 auto;
}

.tw-notice {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-radius: var(--tw-radius);
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  text-decoration: none;
  transition: background-color .2s var(--tw-ease);
}
.tw-notice:hover {
  background: color-mix(in srgb, var(--tw-paper-2) 70%, var(--tw-line));
}
.tw-notice-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--tw-brand-soft);
  color: var(--tw-brand);
}
.tw-notice-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tw-notice-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  font-size: 13.5px;
  color: var(--tw-muted);
}
.tw-notice-text b {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--tw-ink);
}
.tw-notice-cta {
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  color: var(--tw-brand);
}
.tw-notice-cta i {
  font-style: normal;
  display: inline-block;
  transition: transform .2s var(--tw-ease);
}
.tw-notice:hover .tw-notice-cta i {
  transform: translateX(3px);
}

.tw-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}
.tw-flow-item {
  padding: 18px 22px 20px;
  border-radius: var(--tw-radius);
  background: var(--tw-paper-2);
}
.tw-flow-item dt {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-muted);
}
.tw-flow-item dt i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--tw-amber);
}
.tw-flow-item.is-ready dt i {
  background: var(--tw-brand);
}
.tw-flow-item.is-paid dt i {
  background: var(--tw-green);
}
.tw-flow-item dd {
  margin: 8px 0 0;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.tw-flow-item p {
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--tw-muted);
}

.tw-ledger {
  padding-top: 6px;
}
.tw-ledger-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.tw-ledger-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--tw-paper-2);
}
.tw-ledger-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
  font-size: 15px;
  font-weight: 700;
}
.tw-ledger-mark.is-in {
  background: color-mix(in srgb, var(--tw-green) 12%, transparent);
  color: var(--tw-green);
}
.tw-ledger-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.tw-ledger-main p {
  margin: 0;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  color: var(--tw-ink);
}
.tw-ledger-main time {
  font-size: 12.5px;
  color: var(--tw-muted);
  font-variant-numeric: tabular-nums;
}
.tw-ledger-amount {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.tw-ledger-amount.is-in {
  color: var(--tw-green);
}
.tw-ledger-amount.is-out {
  color: var(--tw-ink-2);
}

.tw-orders {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin-top: 26px;
}
.tw-orders-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}
.tw-orders-head h1 {
  margin: 0;
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.05;
}
.tw-orders-head p {
  margin: 8px 0 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.tw-search {
  display: flex;
  align-items: center;
  gap: 10px;
  width: min(360px, 100%);
  height: 44px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
  transition: border-color .2s var(--tw-ease);
}
.tw-search:focus-within {
  border-color: var(--tw-brand);
}
.tw-search svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
}
.tw-search input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  color: var(--tw-ink);
}
.tw-search input:focus {
  outline: none;
}
.tw-search input::placeholder {
  color: var(--tw-muted);
}

.tw-tabs {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  scrollbar-width: none;
}
.tw-tabs::-webkit-scrollbar {
  display: none;
}
.tw-tabs a {
  position: relative;
  flex: 0 0 auto;
  padding: 10px 14px 12px;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  color: var(--tw-muted);
  text-decoration: none;
  transition: color .2s var(--tw-ease);
}
.tw-tabs a:hover {
  color: var(--tw-ink);
}
.tw-tabs a.active {
  color: var(--tw-ink);
}
.tw-tabs a::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -1px;
  height: 2px;
  border-radius: 2px;
  background: transparent;
  transition: background-color .2s var(--tw-ease);
}
.tw-tabs a.active::after {
  background: var(--tw-brand);
}
.tw-tabs a:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: -2px;
  border-radius: 8px;
}

.tw-order-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tw-order {
  border-radius: 14px;
  background: var(--tw-paper-2);
  transition: background-color .2s var(--tw-ease);
}
.tw-order[open] {
  background: color-mix(in srgb, var(--tw-paper-2) 70%, var(--tw-line));
}
.tw-order.is-closed .tw-order-thumb,
.tw-order.is-closed .tw-order-name {
  opacity: .62;
}
.tw-order-row {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto 24px;
  align-items: center;
  gap: 14px;
  padding: 12px 12px 12px 14px;
  list-style: none;
  cursor: pointer;
  border-radius: 14px;
}
.tw-order-row::-webkit-details-marker {
  display: none;
}
.tw-order-row:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: -2px;
}
.tw-order-thumb {
  display: block;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--tw-paper-2);
}
.tw-order-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tw-order-thumb-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-weight: 800;
  color: var(--tw-muted);
}
.tw-order-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.tw-order-name {
  overflow: hidden;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tw-ink);
}
.tw-order-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 0;
  font-size: 12.5px;
  color: var(--tw-muted);
}
.tw-order-meta > span:not(.tw-status)::after {
  content: "·";
  margin: 0 6px;
  color: var(--tw-line-strong);
}
.tw-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  color: var(--tw-ink-2);
}
.tw-status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
.tw-status.is-wait { color: var(--tw-amber); }
.tw-status.is-done { color: var(--tw-brand); }
.tw-status.is-paid { color: var(--tw-green); }
.tw-status.is-void { color: var(--tw-muted); }
.tw-order-cash {
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--tw-muted);
}
.tw-order-cash.is-cash {
  color: var(--tw-green);
}
.tw-order-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--tw-muted);
  transition: transform .25s var(--tw-ease);
}
.tw-order-chevron svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tw-order[open] .tw-order-chevron {
  transform: rotate(90deg);
}
.tw-order-detail {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 4px 16px 16px 76px;
  animation: tw-reveal .28s var(--tw-ease);
}
@keyframes tw-reveal {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: none; }
}

.tw-stepper {
  display: flex;
  align-items: flex-start;
  width: 100%;
  max-width: 560px;
  margin: 4px 0 0;
}
.tw-step {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.tw-step-dot {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--tw-line);
  color: #fff;
}
.tw-step-dot svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tw-step-label {
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
  color: var(--tw-muted);
}
.tw-step-line {
  flex: 1 1 auto;
  min-width: 10px;
  height: 3px;
  margin: 10.25px 6px 0;
  border-radius: 999px;
  background: var(--tw-line);
}
.tw-step-line.is-done {
  background: var(--tw-brand);
}
.tw-step.is-done .tw-step-dot {
  background: var(--tw-brand);
}
.tw-step.is-done .tw-step-label {
  font-weight: 600;
  color: var(--tw-ink-2);
}
.tw-step.is-current .tw-step-dot {
  background: var(--tw-brand-soft);
}
.tw-step.is-current .tw-step-dot::after {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--tw-brand);
}
.tw-step.is-current .tw-step-label {
  font-weight: 700;
  color: var(--tw-brand);
}
.tw-step.is-todo .tw-step-dot::after {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--tw-line-strong);
}

.tw-facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px 20px;
  margin: 0;
}
.tw-facts > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.tw-facts dt {
  font-size: 12px;
  color: var(--tw-muted);
}
.tw-facts dd {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.tw-facts dd small {
  font-size: 12px;
  font-weight: 500;
  color: var(--tw-muted);
}
.tw-facts dd.is-cash {
  color: var(--tw-green);
}
.tw-facts dd.is-void,
.tw-facts .is-void {
  font-weight: 500;
  color: var(--tw-muted);
}
.tw-code {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  color: var(--tw-ink);
  cursor: pointer;
}
.tw-code span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tw-code svg {
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  fill: none;
  stroke: var(--tw-muted);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tw-code:hover svg {
  stroke: var(--tw-ink);
}
.tw-code.is-copied,
.tw-code.is-copied svg {
  color: var(--tw-green);
  stroke: var(--tw-green);
}
.tw-order-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.tw-order-note {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--tw-muted);
}
.tw-order-support {
  margin-left: auto;
  min-height: 34px;
  padding: 0 10px;
  font-size: 13px;
}

@media (max-width: 900px) {
  .tw-balance {
    flex-direction: column;
    align-items: stretch;
    padding: 24px 22px 22px;
  }
  .tw-balance-actions {
    justify-content: flex-start;
  }
  .tw-balance-actions .tw-btn-primary {
    flex: 1 1 auto;
  }
  .tw-flow {
    grid-template-columns: 1fr;
  }
  .tw-flow-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "dt dd" "p dd";
    align-items: center;
    column-gap: 16px;
    padding: 14px 18px;
  }
  .tw-flow-item dt {
    grid-area: dt;
  }
  .tw-flow-item dd {
    grid-area: dd;
    margin: 0;
    font-size: 19px;
  }
  .tw-flow-item p {
    grid-area: p;
    margin-top: 2px;
  }
  .tw-orders-head {
    flex-direction: column;
    align-items: stretch;
    gap: 14px;
  }
  .tw-search {
    width: 100%;
  }
  .tw-order-row {
    grid-template-columns: 44px minmax(0, 1fr) 20px;
    gap: 12px;
    padding: 12px;
  }
  .tw-order-thumb {
    width: 44px;
    height: 44px;
  }
  .tw-order-meta .tw-status {
    flex-basis: 100%;
  }
  .tw-order-cash {
    font-size: 13.5px;
  }
  .tw-order-chevron {
    grid-column: 3;
    grid-row: 1 / span 2;
  }
  .tw-order-detail {
    padding: 0 14px 14px;
  }
  .tw-stepper {
    max-width: none;
  }
  .tw-step-label {
    font-size: 11px;
  }
  .tw-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
  }
  .tw-order-foot {
    flex-wrap: wrap;
  }
}

@media (max-width: 560px) {
  .tw-wallet {
    gap: 16px;
    margin-top: 14px;
  }
  .tw-balance-amount {
    font-size: 38px;
  }
  .tw-notice {
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 12px 14px;
  }
  .tw-notice-cta {
    grid-column: 2;
    font-size: 13px;
  }
  .tw-ledger-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
  }
  .tw-ledger-mark {
    display: none;
  }
  .tw-orders {
    gap: 14px;
    margin-top: 16px;
  }
  .tw-order-list {
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tw-btn,
  .tw-notice,
  .tw-notice-cta i,
  .tw-order,
  .tw-tabs a,
  .tw-tabs a::after,
  .tw-search {
    transition: none;
  }
}

.st-content .eyebrow:not(.tw-keep),
.st-content .px-eyebrow:not(.tw-keep) {
  display: none;
}
.st-content :is(.page-head, .page-heading, .px-page-intro, .orders-history-hero) h1 {
  font-size: clamp(30px, 3.4vw, 44px);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -.035em;
  margin: 0;
}
.st-content :is(.page-head, .page-heading) h1 em {
  font-style: normal;
  color: inherit;
}
.st-content :is(.page-head, .page-heading, .px-page-intro) p {
  margin: 8px 0 0;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--tw-muted);
}
.st-content .panel-heading h2 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.st-content .panel-heading p {
  font-size: 13.5px;
  color: var(--tw-muted);
}

.st-content .stat-grid:not(.stat-grid-compact) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  gap: 10px;
  margin: 18px 0;
}
.st-content .stat-grid:not(.stat-grid-compact) .stat-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 16px 18px;
  border: 0;
  border-radius: var(--tw-radius);
  background: var(--tw-paper-2);
  box-shadow: none;
}
.st-content .stat-grid:not(.stat-grid-compact) .stat-icon {
  display: none;
}
.st-content .stat-grid:not(.stat-grid-compact) .stat-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.st-content .stat-grid:not(.stat-grid-compact) .stat-copy small {
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--tw-muted);
}
.st-content .stat-grid:not(.stat-grid-compact) .stat-copy strong {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
@media (max-width: 560px) {
  .st-content .stat-grid:not(.stat-grid-compact) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.st-content .referral-hero {
  padding: 24px !important;
  border: 0;
  border-radius: 20px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  box-shadow: none;
}
.st-content .referral-hero-main > strong {
  font-size: clamp(32px, 4vw, 44px);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1;
  color: var(--tw-ink);
}
.st-content .referral-hero p,
.st-content .referral-hero small,
.st-content .referral-step small {
  color: var(--tw-muted);
}
.st-content .referral-hero .copy-field-light input {
  border: 1px solid transparent;
  background: var(--tw-paper);
  color: var(--tw-ink);
}
.st-content .referral-hero .copy-icon-btn {
  border: 0;
  background: var(--tw-brand);
  color: #fff;
}
.st-content .referral-steps {
  gap: 12px;
}
.st-content .referral-step {
  padding: 0;
  background: transparent;
  border: 0;
}
.st-content .referral-step-ic {
  background: var(--tw-brand-soft);
  color: var(--tw-brand);
}
.st-content .referral-step b {
  color: var(--tw-ink);
}
.st-content .referral-qr {
  border: 0;
  border-radius: 16px;
  background: var(--tw-paper);
  color: var(--tw-ink);
  box-shadow: none;
}
.st-content .referral-qr-headline {
  color: var(--tw-ink);
  font-size: 15px;
  font-weight: 700;
}
.st-content .referral-qr-code {
  border: 0;
  background: #fff;
}
.st-content .referral-qr-brand {
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--tw-muted);
}
.st-content .referral-qr-below,
.st-content .referral-qr-caption {
  color: var(--tw-muted);
}
.st-content .referral-hero .button-light {
  border: 0;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
}

.st-content .mission-point-note {
  border: 0;
  border-radius: var(--tw-radius);
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  box-shadow: none;
}
.st-content .mission-point-note-ic {
  display: none;
}
.st-content .mission-point-note-lines,
.st-content .mission-point-note p {
  color: var(--tw-muted);
}
.st-content .monthly-mission .mm-reward {
  border: 0;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  box-shadow: none;
}
.st-content .monthly-mission .mm-reward b,
.st-content .monthly-mission .mm-reward strong {
  color: var(--tw-ink);
}
.st-content .mm-head-copy .tw-keep {
  display: inline;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--tw-muted);
}

.st-content .withdraw-action > span {
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--tw-muted);
}
.st-content .withdraw-action > strong {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.035em;
}
.st-content .withdraw-steps h2 {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.st-content .withdraw-steps ol {
  margin-top: 14px;
}
.st-content .withdraw-steps li {
  min-height: 0;
  padding-bottom: 12px;
}
.st-content .withdraw-steps li > span {
  width: 24px;
  height: 24px;
  flex-basis: 24px;
  border: 0;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
  font-size: 12px;
  font-weight: 700;
  box-shadow: none;
}
.st-content .withdraw-steps li.active > span {
  background: var(--tw-brand);
  color: #fff;
}
.st-content .withdraw-steps li:not(:last-child)::after {
  top: 26px;
  left: 11.5px;
}
.st-content .withdraw-steps li b {
  font-size: 14px;
  font-weight: 600;
}
.st-content .withdraw-steps li small {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.st-content .feature-gate {
  border: 0;
  background: var(--tw-paper-2);
  box-shadow: none;
}

.st-content .mb-refcode-qr-hero {
  border: 0;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  box-shadow: none;
}
.st-content .mb-refcode .copy-icon-btn {
  border: 0;
  background: var(--tw-brand);
  color: #fff;
}
.st-content .mb-profile {
  border: 0;
  background: var(--tw-paper-2);
  box-shadow: none;
}

.st-content .buy-multi-note {
  border: 0;
  border-radius: 12px;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
  box-shadow: none;
}
.st-content .buy-multi-note b {
  color: var(--tw-ink);
}
.st-content .buy-multi-note-ico {
  display: none;
}

.st-app .px-app {
  background: var(--lx-ivory);
}
.st-app .px-header {
  background: var(--lx-ivory);
  border-bottom: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.st-app :is(.button-primary, .px-btn-dark, .buy-now-button, .button-coral, .discover-primary-action, .promo-card-buy) {
  background: var(--lx-orange) !important;
  background-image: none !important;
  box-shadow: none !important;
  border-color: transparent !important;
  border-radius: 10px !important;
  transition: background-color .2s var(--tw-ease), transform .15s var(--tw-ease);
}
.st-app :is(.button-primary, .px-btn-dark, .buy-now-button, .button-coral, .discover-primary-action, .promo-card-buy):hover {
  transform: none !important;
  background: color-mix(in srgb, var(--lx-orange) 88%, #2b211c) !important;
}
.st-app :is(.button-primary, .px-btn-dark, .buy-now-button, .button-coral, .discover-primary-action, .promo-card-buy):active {
  transform: translateY(1px) scale(.99) !important;
}
.st-app :is(.button-light, .button-ghost, .button:not(.button-primary):not(.button-coral):not(.button-danger)) {
  background: var(--tw-paper-2);
  border-color: transparent;
  box-shadow: none;
  border-radius: 10px;
}
.st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) {
  padding: 0;
  gap: 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) a {
  position: relative;
  padding: 10px 14px 12px;
  border-radius: 0;
  font-size: 14px;
  font-weight: 600;
}
.st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) a:hover {
  background: transparent;
}
.st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) a::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 0;
  height: 2px;
  border-radius: 2px;
  background: transparent;
}
.st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) a.active {
  background: transparent;
  color: var(--tw-ink);
  box-shadow: none;
}
.st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) a.active::after {
  background: var(--tw-brand);
}
.st-app .st-content .empty-state {
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--tw-paper-2) !important;
  box-shadow: none !important;
}
.st-app .st-content .empty-state .empty-orbit {
  border: 0 !important;
  background: var(--tw-paper) !important;
  box-shadow: none !important;
}
.st-app :is(.panel, .buy-card, .mb-panel, .px-panel) {
  border: 0 !important;
  box-shadow: none !important;
}

.st-app :is(.px-landing-copy > span, .lux-platform-copy small, .responsive-table th, .share-table-wrap th, .policy-toc-title, .lb2-hero h2, .px-footer-connect b, .st-menu-refcode small, .camio-picker-or, .referral-table th, .go-open-eyebrow, .kol-eyebrow) {
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.st-app :is(.responsive-table th, .share-table-wrap th, .referral-table th) {
  font-size: 12.5px !important;
  font-weight: 600 !important;
}
.st-app .px-footer-connect b {
  font-size: 13.5px;
  font-weight: 600;
}
.st-app :is(.discover-database-empty, .discover-filter-empty) {
  border: 0 !important;
  border-radius: 16px !important;
  background: var(--tw-paper-2) !important;
  box-shadow: none !important;
}
.st-app .st-content :is(.kol-badge, .kol-approved-badge) {
  border: 0 !important;
  border-radius: 8px !important;
}
.st-app .income-src {
  border: 0 !important;
  background: var(--tw-paper-2) !important;
}
.st-app .income-src::before {
  content: none !important;
}
.st-app .income-src small::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--tw-line-strong);
  vertical-align: 1px;
}
.st-app .income-src.is-own small::before { background: var(--src-own); }
.st-app .income-src.is-referral small::before { background: var(--src-referral); }
.st-app .income-src.is-shareLink small::before { background: var(--src-shareLink); }
.st-app .support-choice {
  border: 0 !important;
  background: var(--tw-paper-2) !important;
  box-shadow: none !important;
}
.st-app .support-choice:hover {
  background: color-mix(in srgb, var(--tw-paper-2) 70%, var(--tw-line)) !important;
  transform: none !important;
}
.st-app .stat-grid-compact .stat-card {
  border: 0 !important;
  background: var(--tw-paper-2) !important;
  box-shadow: none !important;
}
.st-app .stat-grid-compact .stat-icon {
  display: none !important;
}
.st-app :is(.voucher-card, .buy-multi-note) {
  border-left-width: 0 !important;
}
.st-app .voucher-card {
  border: 0 !important;
  background: var(--tw-paper-2) !important;
}

.auth-shell .auth-card {
  border: 0 !important;
  border-radius: 20px !important;
  background: var(--lx-paper) !important;
  box-shadow: none !important;
}
.auth-shell .auth-card-body :is(.login-submit, .button-block:not(.button-google), .button-primary) {
  border-radius: 10px !important;
  background: var(--lx-orange) !important;
  background-image: none !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
.auth-shell .auth-card-body :is(.login-submit, .button-block:not(.button-google), .button-primary):hover:not(:disabled) {
  transform: none !important;
  box-shadow: none !important;
  background: color-mix(in srgb, var(--lx-orange) 88%, #2b211c) !important;
}
.auth-shell .auth-card-body :is(.login-submit, .button-block:not(.button-google), .button-primary):active {
  transform: translateY(1px) scale(.99) !important;
}
.auth-shell :is(.axs-kicker, .axs-show-tag) {
  text-transform: none !important;
  letter-spacing: 0 !important;
  border-radius: 6px !important;
}
.auth-shell .auth-card-secure {
  border-top: 0 !important;
  padding-top: 0 !important;
  margin-top: 16px !important;
  color: var(--lx-muted) !important;
  background: transparent !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
}
.auth-shell .axs-kicker {
  display: none !important;
}
.auth-shell :is(.auth-card-header-line, .auth-divider) {
  border: 0 !important;
}
.auth-shell .auth-card-footer,
.auth-shell .auth-card-security {
  border-top: 0 !important;
  padding-top: 0 !important;
}
.auth-shell .auth-input-shell,
.auth-shell .login-field {
  box-shadow: none !important;
}
.auth-shell .button-google {
  border: 0 !important;
  background: var(--lx-paper-2) !important;
  color: var(--lx-ink) !important;
  box-shadow: none !important;
  border-radius: 10px !important;
}
.legal-version {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--lx-muted);
}
.px-footer-connect b,
.public-footer .px-footer-connect b {
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
}
.go-open {
  border: 0 !important;
  box-shadow: none !important;
  background: var(--lx-paper-2) !important;
}
.go-open .button {
  border-radius: 10px !important;
  box-shadow: none !important;
}
.go-open .button-primary {
  background: var(--lx-orange) !important;
  background-image: none !important;
}
.go-open .button-light {
  border: 0 !important;
  background: var(--lx-paper) !important;
}

@media (max-width: 760px) {
  .st-app body,
  .st-app .st-content {
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
  }
  .st-app .px-header {
    height: 52px;
  }
  .st-app .px-header-inner {
    min-height: 52px;
    height: 52px;
  }
  .st-app .px-brand img,
  .st-app .px-brand-mark {
    width: 30px !important;
    height: 30px !important;
  }
  .st-app .px-brand span {
    font-size: 19px;
  }
  .st-app .px-header-actions > *,
  .st-app .px-header .px-icon-btn,
  .st-app .px-header .px-avatar {
    width: 34px;
    height: 34px;
    min-height: 0;
  }
  .st-app .px-header-actions > .px-guest-login,
  .st-app .px-header-actions > .px-guest-register {
    width: auto;
    padding: 0 14px;
  }
  .st-app .px-header-actions svg {
    width: 18px;
    height: 18px;
  }

  .st-app .st-content h1,
  .st-app .st-content .tw-intro h1,
  .st-app .st-content :is(.page-head, .page-heading, .px-page-intro, .orders-history-hero) h1,
  .st-app .tw-orders-head h1 {
    font-size: 22px !important;
    font-weight: 700 !important;
    letter-spacing: -.02em !important;
    line-height: 1.15 !important;
  }
  .st-app .st-content h2,
  .st-app .tw-section-head h2,
  .st-app .st-content .panel-heading h2 {
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: -.01em !important;
  }
  .st-app .st-content h3 {
    font-size: 14.5px !important;
    font-weight: 600 !important;
  }
  .st-app .st-content :is(.page-head, .page-heading, .px-page-intro) p,
  .st-app .tw-orders-head p {
    font-size: 13px !important;
    margin-top: 4px !important;
  }
  .st-app .st-content p,
  .st-app .st-content li,
  .st-app .st-content label,
  .st-app .st-content dd {
    font-size: 14px;
  }
  .st-app .st-content small {
    font-size: 12px;
  }
  .st-app .st-content b,
  .st-app .st-content strong {
    font-weight: 600;
  }

  .st-app .st-content :is(.button, .tw-btn, .button-primary, .button-coral, .button-light, .button-ghost, .buy-now-button, .discover-primary-action) {
    min-height: 40px !important;
    height: auto;
    padding: 0 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
  }
  .st-app .st-content :is(.button-large, .button-block, .tw-btn-primary) {
    min-height: 44px !important;
    font-size: 15px !important;
  }
  .st-app .st-content :is(.button-small, .tw-btn-quiet) {
    min-height: 34px !important;
    padding: 0 10px !important;
    font-size: 13px !important;
  }
  .st-app .st-content :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    min-height: 40px !important;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 15px !important;
    border-radius: 10px !important;
  }
  .st-app .st-content textarea {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .st-app .st-content :is(.status-badge, .tw-status) {
    font-size: 11.5px !important;
    font-weight: 600 !important;
  }

  .st-app :is(.px-subtabs, .st-subtabs, .orders-history-tabs) a,
  .st-app .tw-tabs a {
    padding: 8px 12px 10px !important;
    font-size: 13.5px !important;
  }

  .st-app .tw-balance {
    padding: 18px 16px 16px;
    border-radius: 16px;
  }
  .st-app .tw-balance-label {
    font-size: 13px;
  }
  .st-app .tw-balance-amount {
    font-size: 32px !important;
    font-weight: 700;
    letter-spacing: -.03em;
  }
  .st-app .tw-balance-note {
    font-size: 12.5px;
    margin-top: 8px !important;
  }
  .st-app .tw-balance-actions {
    margin-top: 2px;
  }
  .st-app .tw-notice {
    padding: 10px 12px;
    border-radius: 12px;
  }
  .st-app .tw-notice-text b {
    font-size: 14px;
  }
  .st-app .tw-notice-text span,
  .st-app .tw-notice-cta {
    font-size: 12.5px;
  }
  .st-app .tw-flow-item {
    padding: 11px 14px;
    border-radius: 12px;
  }
  .st-app .tw-flow-item dt {
    font-size: 12.5px;
  }
  .st-app .tw-flow-item dd {
    font-size: 16px;
    font-weight: 600;
  }
  .st-app .tw-flow-item p {
    font-size: 12px;
  }
  .st-app .tw-ledger-row {
    padding: 10px 12px;
    border-radius: 10px;
  }
  .st-app .tw-ledger-main p {
    font-size: 13.5px;
    font-weight: 500;
  }
  .st-app .tw-ledger-amount {
    font-size: 14px;
    font-weight: 600;
  }
  .st-app .tw-order-row {
    grid-template-columns: 40px minmax(0, 1fr) 18px;
    gap: 10px;
    padding: 10px 10px 10px 12px;
  }
  .st-app .tw-order-thumb {
    width: 40px;
    height: 40px;
    border-radius: 8px;
  }
  .st-app .tw-order-name {
    font-size: 14px;
    font-weight: 600;
  }
  .st-app .tw-order-meta,
  .st-app .tw-order-meta .tw-status {
    font-size: 12px;
  }
  .st-app .tw-order-cash {
    font-size: 13px;
  }
  .st-app .tw-step-label {
    font-size: 10.5px;
  }
  .st-app .tw-facts dt {
    font-size: 11.5px;
  }
  .st-app .tw-facts dd {
    font-size: 13.5px;
  }
  .st-app .stat-grid:not(.stat-grid-compact) .stat-card,
  .st-app .stat-grid-compact .stat-card {
    padding: 12px 14px;
    border-radius: 12px;
  }
  .st-app .stat-grid:not(.stat-grid-compact) .stat-copy strong,
  .st-app .stat-grid-compact .stat-copy strong {
    font-size: 18px !important;
    font-weight: 600 !important;
  }
  .st-app .stat-grid:not(.stat-grid-compact) .stat-copy small,
  .st-app .stat-grid-compact .stat-copy small {
    font-size: 12px !important;
  }
  .st-app .st-content .panel,
  .st-app .st-content .buy-card,
  .st-app .st-content .mb-panel {
    padding: 14px !important;
    border-radius: 14px !important;
  }

  .st-app .px-bottomnav {
    height: 54px;
    background: color-mix(in srgb, var(--lx-paper) 94%, transparent);
    border-top: 1px solid var(--lx-line);
    backdrop-filter: saturate(180%) blur(14px);
  }
  .st-app .px-bottomnav a,
  .st-app .px-bottomnav button {
    color: var(--lx-muted);
  }
  .st-app .px-bottomnav a.active,
  .st-app .px-bottomnav a[aria-current="page"] {
    color: var(--lx-orange);
  }
  .st-app .px-bottomnav a,
  .st-app .px-bottomnav button {
    gap: 2px;
    font-size: 10px;
    font-weight: 500;
  }
  .st-app .px-bottomnav a b {
    font-size: 10px;
    font-weight: 500;
  }
  .st-app .px-bottomnav a.active b {
    font-weight: 600;
  }
  .st-app .px-bottomnav a svg,
  .st-app .px-bottomnav button svg {
    width: 22px !important;
    height: 22px !important;
  }
  .st-app .px-main {
    padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important;
  }

  .st-app .px-footer .px-footer-col,
  .st-app .px-footer .px-footer-connect,
  .st-app .px-footer .px-footer-apps,
  .st-app .px-footer .px-footer-contactlines {
    display: none !important;
  }
  .st-app .px-footer .px-footer-top {
    display: block;
  }
  .st-app .px-footer {
    padding: 20px 16px calc(24px + env(safe-area-inset-bottom)) !important;
  }
  .st-app .px-footer-brand img {
    width: 28px;
    height: 28px;
  }
  .st-app .px-footer-brand a strong {
    font-size: 16px;
  }
  .st-app .px-footer p,
  .st-app .px-footer li,
  .st-app .px-footer small {
    font-size: 12px;
  }
}

a.tw-order {
  color: inherit;
  text-decoration: none;
}
a.tw-order:hover {
  background: color-mix(in srgb, var(--tw-paper-2) 70%, var(--tw-line));
}
a.tw-order:active {
  transform: scale(.995);
}
.tw-order-page {
  gap: 18px;
}
.tw-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  font-size: 14px;
  font-weight: 600;
  color: var(--tw-muted);
  text-decoration: none;
}
.tw-back:hover {
  color: var(--tw-ink);
}
.tw-order-hero {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
}
.tw-order-hero .tw-order-thumb.is-large {
  width: 72px;
  height: 72px;
  border-radius: 14px;
}
.tw-order-hero h1 {
  margin: 0 0 6px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -.01em;
  color: var(--tw-ink);
}
.tw-order-hero .tw-order-meta {
  margin: 0;
}
.tw-order-hero .tw-order-cash {
  font-size: 18px;
}
.tw-order-detail.is-page {
  padding: 20px 20px 18px;
  border-radius: 16px;
  background: var(--tw-paper-2);
  animation: none;
}
.tw-order-detail.is-page .tw-stepper {
  max-width: none;
}
.tw-id {
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  word-break: break-all;
}
@media (max-width: 760px) {
  .tw-order-hero {
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 12px;
  }
  .tw-order-hero .tw-order-thumb.is-large {
    width: 56px;
    height: 56px;
    border-radius: 12px;
  }
  .tw-order-hero h1 {
    font-size: 17px;
  }
  .tw-order-hero .tw-order-cash {
    grid-column: 2;
    justify-self: start;
    font-size: 16px;
  }
  .tw-order-detail.is-page {
    padding: 14px;
  }
}
.st-app .tw-back {
  font-size: 14px;
}
@media (max-width: 760px) {
  .st-app .tw-order-hero h1 {
    font-size: 17px;
    line-height: 1.3;
  }
}
@media (min-width: 761px) {
  .tw-order-page {
    max-width: 760px;
  }
}

.tw-order-detail.is-page .tw-facts {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.tw-order-detail.is-page .tw-facts > div {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 0;
}
.tw-order-detail.is-page .tw-facts > div + div {
  border-top: 0;
}
.tw-order-detail.is-page .tw-facts dt {
  flex: 0 0 auto;
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--tw-muted);
}
.tw-order-detail.is-page .tw-facts dd {
  flex: 1 1 auto;
  margin: 0;
  text-align: right;
  font-size: 15px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.tw-order-detail.is-page .tw-facts dd .tw-code {
  justify-content: flex-end;
}
.tw-order-detail.is-page .tw-facts dd small {
  display: block;
  font-size: 12px;
  font-weight: 500;
  color: var(--tw-muted);
}
a.tw-order {
  transition: background-color .2s var(--tw-ease), transform .15s var(--tw-ease);
}

.wl {
  display: flex;
  flex-direction: column;
  gap: 24px;
  max-width: 1120px;
  margin: 8px 0 0;
}
.wl-hero {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 26px;
  padding: 24px 8px 32px;
}
.wl-hero-text {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 48ch;
}
.wl-amount {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0;
  line-height: 1;
  color: var(--tw-ink);
}
.wl-amount-number {
  font-size: clamp(56px, 6.5vw, 88px);
  font-weight: 500;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums lining-nums;
}
.wl-amount-unit {
  font-size: 24px;
  font-weight: 400;
  color: var(--tw-muted);
}
.wl-statement {
  margin: 0;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: -.005em;
  color: var(--tw-ink-2);
  text-wrap: pretty;
}
.wl-statement b {
  font-weight: 600;
  color: var(--tw-ink);
  white-space: nowrap;
}
.wl-statement-soon {
  display: block;
  margin-top: 6px;
  font-size: 15px;
  color: var(--tw-muted);
}
.wl-hero-actions {
  display: flex;
  align-items: center;
  gap: 20px;
}
.wl-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 24px;
  border-radius: 999px;
  background: var(--tw-brand);
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .15s var(--tw-ease), filter .2s var(--tw-ease);
}
.wl-cta:hover {
  filter: brightness(1.06);
}
.wl-cta:active {
  transform: scale(.985);
}
.wl-link {
  font-size: 15px;
  font-weight: 500;
  color: var(--tw-ink-2);
  text-decoration: none;
  white-space: nowrap;
}
.wl-link:hover {
  color: var(--tw-ink);
}
.wl-promo {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding: 28px 32px;
  border-radius: 24px;
  background: var(--tw-ink);
  color: var(--tw-paper);
  text-decoration: none;
  transition: transform .15s var(--tw-ease);
}
.wl-promo:active {
  transform: scale(.995);
}
.wl-promo-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.wl-promo-amount {
  font-size: 40px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.05;
  color: var(--tw-brand);
  font-variant-numeric: tabular-nums;
}
.wl-promo-sub {
  margin-top: 6px;
  font-size: 14.5px;
  line-height: 1.45;
  opacity: .82;
  max-width: 44ch;
}
.wl-promo-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 999px;
  background: var(--tw-brand);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  transition: transform .15s var(--tw-ease);
}
.wl-promo:hover .wl-promo-btn {
  transform: translateX(3px);
}

.wl-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}
.wl-flow-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  grid-template-areas: "ic amt" "ic label";
  column-gap: 14px;
  row-gap: 2px;
  padding: 20px 22px;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.wl-flow-ic {
  grid-area: ic;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--tw-paper);
  color: var(--tw-ink);
}
.wl-flow-ic.is-wait { color: var(--tw-amber); }
.wl-flow-ic.is-soon { color: var(--tw-brand); }
.wl-flow-ic.is-paid { color: var(--tw-green); }
.wl-flow-row dd {
  grid-area: amt;
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.wl-flow-row dt {
  grid-area: label;
  font-size: 14px;
  font-weight: 600;
  color: var(--tw-ink-2);
}
.wl-flow-row dt small {
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--tw-muted);
}

.wl-history {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.wl-history-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 0 4px 8px;
}
.wl-history-head h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
}
.wl-history-head span {
  font-size: 13px;
  color: var(--tw-muted);
}
.wl-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wl-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  border-radius: 16px;
  background: var(--tw-paper-2);
}
.wl-row-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--tw-paper);
  color: var(--tw-muted);
}
.wl-row-mark.is-in { color: var(--tw-green); }
.wl-row-mark.is-out { color: var(--tw-ink); }
.wl-row-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.wl-row-desc {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--tw-ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wl-row-main time {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.wl-row-amount {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.01em;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.wl-row-amount.is-in { color: var(--tw-green); }
.wl-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 28px 24px;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.wl-empty p {
  margin: 0;
  color: var(--tw-muted);
  font-size: 14px;
}
.wl-empty-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--tw-ink) !important;
}
.wl-empty .wl-cta {
  margin-top: 8px;
}

:root[data-theme="dark"] .wl-promo {
  background: var(--tw-paper-2);
  color: var(--tw-ink);
}
:root[data-theme="dark"] .wl-flow-ic,
:root[data-theme="dark"] .wl-row-mark {
  background: color-mix(in srgb, var(--tw-paper) 60%, var(--tw-paper-2));
}

@media (max-width: 760px) {
  .wl {
    gap: 16px;
    margin-top: 10px;
  }
  .wl-hero {
    gap: 18px;
    padding: 6px 2px 18px;
  }
  .wl-amount-number {
    font-size: 48px;
  }
  .wl-amount-unit {
    font-size: 18px;
  }
  .st-app .wl-statement {
    font-size: 16px;
    line-height: 1.5;
  }
  .st-app .wl-statement-soon {
    font-size: 13.5px;
  }
  .wl-hero-actions {
    gap: 16px;
  }
  .st-app .wl-cta {
    min-height: 44px;
    padding: 0 20px;
    font-size: 15px;
  }
  .st-app .wl-link {
    font-size: 14px;
  }
  .st-app .wl-promo-btn {
    width: 100%;
    min-height: 46px;
    font-size: 15px;
  }
  .wl-promo {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 20px;
    border-radius: 20px;
  }
  .st-app .wl-promo-amount {
    font-size: 34px;
  }
  .st-app .wl-promo-sub {
    font-size: 13.5px;
  }
  .wl-flow {
    grid-template-columns: 1fr;
    gap: 0;
    border-radius: 18px;
    background: var(--tw-paper-2);
    padding: 4px 0;
  }
  .wl-flow-row {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    grid-template-areas: "ic label amt";
    align-items: center;
    padding: 12px 16px;
    border-radius: 0;
    background: transparent;
  }
  .wl-flow-ic {
    width: 36px;
    height: 36px;
  }
  .st-app .wl-flow-row dd {
    font-size: 16px;
    text-align: right;
  }
  .st-app .wl-flow-row dt {
    font-size: 14px;
  }
  .st-app .wl-flow-row dt small {
    font-size: 11.5px;
  }
  .st-app .wl-history-head h2 {
    font-size: 17px;
  }
  .wl-row {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 14px;
  }
  .wl-row-mark {
    width: 34px;
    height: 34px;
  }
  .st-app .wl-row-desc {
    font-size: 14px;
  }
  .st-app .wl-row-amount {
    font-size: 15px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .wl-cta,
  .wl-promo,
  .wl-promo-btn {
    transition: none;
  }
}

.wk,
.wk-accounts-panel {
  --wk-pocket: var(--tw-brand);
  --wk-pocket-ink: #fff;
  --wk-card: #3a1d12;
  --wk-card-ink: #fff3ec;
  display: flex;
  flex-direction: column;
  gap: 28px;
  margin-top: 4px;
}
.wk-head {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 12px;
}
.wk-head-text {
  grid-column: 1 / 3;
  text-align: left;
}
.wk-head-text h1 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
}
.wk-head-text p {
  margin: 2px 0 0;
  font-size: 13.5px;
  color: var(--tw-muted);
}
.wk-head-add {
  grid-column: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  transition: background-color .2s var(--tw-ease);
}
.wk-head-add:hover {
  background: color-mix(in srgb, var(--tw-paper-2) 70%, var(--tw-line));
}
.wk svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wk-main {
  display: grid;
  grid-template-columns: minmax(0, 480px) minmax(0, 1fr);
  gap: 32px 56px;
  align-items: start;
}
.wk-left,
.wk-right {
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}

.wk-wallet {
  position: relative;
  padding-top: calc(var(--n, 1) * 60px + 48px);
}
.wk-card {
  position: absolute;
  top: calc(var(--i, 0) * 60px);
  left: 0;
  right: 0;
  z-index: calc(var(--i, 0) + 1);
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "bank state" "number name";
  align-items: end;
  gap: 44px 12px;
  padding: 18px 22px 22px;
  border-radius: 22px;
  background: var(--wk-card);
  color: var(--wk-card-ink);
  text-decoration: none;
  transition: transform .4s cubic-bezier(.32, .72, 0, 1);
}
.wk-card.tone-1 { --wk-card: #1f2a44; --wk-card-ink: #eef2ff; }
.wk-card.tone-2 { --wk-card: #1d3b33; --wk-card-ink: #e9f7f0; }
.wk-card.tone-3 { --wk-card: #3b2446; --wk-card-ink: #f5eefb; }
.wk-card:hover {
  transform: translateY(-8px);
}
.wk-card.is-pending {
  filter: saturate(.55);
}
.wk-card.is-pending .wk-card-state {
  color: var(--tw-amber);
  opacity: 1;
}
.wk-card-bank {
  grid-area: bank;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .01em;
}
.wk-card-state {
  grid-area: state;
  font-size: 12px;
  opacity: .8;
  white-space: nowrap;
}
.wk-card-number {
  grid-area: number;
  font-size: 14px;
  letter-spacing: .14em;
  font-variant-numeric: tabular-nums;
  opacity: .9;
}
.wk-card-name {
  grid-area: name;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 18ch;
  opacity: .9;
}
.wk-card.is-empty {
  background: color-mix(in srgb, var(--wk-card) 55%, var(--tw-paper-2));
}
.wk-pocket {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 26px 26px 24px;
  border-radius: 26px;
  background: var(--wk-pocket);
  color: var(--wk-pocket-ink);
}
.wk-pocket::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 40px;
  border-radius: 26px 26px 0 0;
  background: color-mix(in srgb, var(--wk-pocket) 88%, #000);
  opacity: .22;
  pointer-events: none;
}
.wk-pocket-label {
  margin: 0;
  font-size: 13.5px;
  font-weight: 500;
  opacity: .88;
}
.wk-pocket-amount {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 2px 0 0;
  line-height: 1;
}
.wk-pocket-number {
  font-size: 44px;
  font-weight: 600;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
.wk-pocket-unit {
  font-size: 18px;
  font-weight: 500;
  opacity: .85;
}
.wk-pocket-note {
  margin: 10px 0 0;
  font-size: 13.5px;
  line-height: 1.45;
  opacity: .9;
}
.wk-pocket-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
}
.wk-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .18);
  color: inherit;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .2s var(--tw-ease), transform .15s var(--tw-ease);
}
.wk-pill svg {
  width: 18px;
  height: 18px;
}
.wk-pill:hover {
  background: rgba(255, 255, 255, .26);
}
.wk-pill:active {
  transform: scale(.985);
}
.wk-pocket-icons {
  display: inline-flex;
  gap: 8px;
}
.wk-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .18);
  color: inherit;
  cursor: pointer;
  transition: background-color .2s var(--tw-ease);
}
.wk-icon:hover {
  background: rgba(255, 255, 255, .26);
}
.wk-icon svg {
  width: 18px;
  height: 18px;
}
.wk.is-hidden [data-wallet-amount] {
  filter: blur(9px);
  user-select: none;
}
.wk.is-hidden .wk-icon[data-wallet-eye] {
  background: #fff;
  color: var(--wk-pocket);
}

.wk-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.wk-flow > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 16px;
  background: var(--tw-paper-2);
}
.wk-flow dt {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--tw-muted);
}
.wk-flow dt small {
  display: block;
  font-size: 11.5px;
  opacity: .85;
}
.wk-flow dd {
  margin: 0;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}

.wk-promo {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border-radius: 18px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  text-decoration: none;
}
.wk-promo-amount {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-brand);
  font-variant-numeric: tabular-nums;
}
.wk-promo-text {
  font-size: 13.5px;
  line-height: 1.4;
  color: var(--tw-ink-2);
}
.wk-promo-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  background: var(--tw-brand);
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
  white-space: nowrap;
}
.wk-promo-cta svg {
  width: 16px;
  height: 16px;
}

.wk-section {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.wk-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
}
.wk-section-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--tw-ink);
}
.wk-section-head a,
.wk-section-head span {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--tw-muted);
  text-decoration: none;
}
.wk-section-head a:hover {
  color: var(--tw-ink);
}
.wk-accounts {
  display: flex;
  gap: 18px;
  margin: 0;
  padding: 2px 2px 6px;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.wk-accounts::-webkit-scrollbar {
  display: none;
}
.wk-account {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  width: 64px;
  text-decoration: none;
  color: var(--tw-ink-2);
}
.wk-account-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  transition: transform .2s var(--tw-ease), background-color .2s var(--tw-ease);
}
.wk-account-avatar.is-bank {
  background: var(--wk-card);
  color: var(--wk-card-ink);
}
.wk-account:hover .wk-account-avatar {
  transform: translateY(-2px);
}
.wk-account-add .wk-account-avatar {
  color: var(--tw-muted);
}
.wk-account-label {
  font-size: 12.5px;
  font-weight: 500;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.wk-account-state {
  margin-top: -4px;
  font-size: 11px;
  color: var(--tw-amber);
}
.wk-account.is-pending .wk-account-avatar {
  opacity: .55;
}

.wk-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wk-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-radius: 16px;
  background: var(--tw-paper-2);
}
.wk-row-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--tw-paper);
  color: var(--tw-ink);
}
.wk-row-mark.is-in {
  color: var(--tw-green);
}
.wk-row-mark svg {
  width: 17px;
  height: 17px;
}
.wk-row-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wk-row-desc {
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--tw-ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wk-row-main time {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.wk-row-amount {
  font-size: 15.5px;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.wk-row-amount.is-in {
  color: var(--tw-green);
}
.wk-row-amount.is-out,
.wk-row-mark.is-out {
  color: var(--tw-danger);
}
.wk-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 24px;
  border-radius: 18px;
  background: var(--tw-paper-2);
}
.wk-empty p {
  margin: 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.wk-empty-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--tw-ink) !important;
}
.wk-empty .wk-pill {
  margin-top: 6px;
  background: var(--tw-brand);
  color: #fff;
}

:root[data-theme="dark"] .wk,
:root[data-theme="dark"] .wk-accounts-panel {
  --wk-card: #4a2a1c;
  --wk-card-ink: #fff3ec;
}
:root[data-theme="dark"] .wk-card.tone-1 { --wk-card: #2a3a5e; }
:root[data-theme="dark"] .wk-card.tone-2 { --wk-card: #27504a; }
:root[data-theme="dark"] .wk-card.tone-3 { --wk-card: #4a2f5a; }
:root[data-theme="dark"] .wk-row-mark {
  background: color-mix(in srgb, var(--tw-paper) 60%, var(--tw-paper-2));
}

@media (max-width: 980px) {
  .wk-main {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .wk-left {
    max-width: 520px;
  }
}
@media (max-width: 760px) {
  .wk {
    gap: 18px;
    margin-top: 0;
  }
  .wk-head {
    grid-template-columns: 40px minmax(0, 1fr) 40px;
  }
  .wk-head-text {
    grid-column: 2;
    text-align: center;
  }
  .st-app .wk-head-text h1 {
    font-size: 20px;
  }
  .st-app .wk-head-text p {
    font-size: 12.5px;
  }
  .wk-head-add {
    width: 40px;
    height: 40px;
  }
  .wk-left {
    max-width: none;
    gap: 16px;
  }
  .wk-wallet {
    padding-top: calc(var(--n, 1) * 54px + 40px);
  }
  .wk-card {
    top: calc(var(--i, 0) * 54px);
    padding: 16px 18px 20px;
    gap: 36px 10px;
  }
  .st-app .wk-card-bank {
    font-size: 14px;
  }
  .st-app .wk-card-name {
    font-size: 14px;
  }
  .st-app .wk-card-number {
    font-size: 13px;
  }
  .wk-pocket {
    padding: 22px 20px 18px;
    border-radius: 22px;
  }
  .wk-pocket-number {
    font-size: 38px;
  }
  .wk-pocket-unit {
    font-size: 16px;
  }
  .st-app .wk-pocket-note {
    font-size: 12.5px;
  }
  .st-app .wk-pill {
    min-height: 40px;
    padding: 0 16px;
    font-size: 14px;
  }
  .wk-icon {
    width: 40px;
    height: 40px;
  }
  .wk-flow {
    gap: 6px;
  }
  .wk-flow > div {
    padding: 12px 12px;
    border-radius: 14px;
  }
  .st-app .wk-flow dt {
    font-size: 11.5px;
  }
  .st-app .wk-flow dd {
    font-size: 14.5px;
  }
  .wk-promo {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px 14px;
    padding: 14px 16px;
  }
  .wk-promo-cta {
    grid-column: 1 / -1;
    justify-content: center;
    min-height: 40px;
  }
  .st-app .wk-section-head h2 {
    font-size: 16px;
  }
  .wk-accounts {
    gap: 14px;
    margin: 0 -16px;
    padding: 2px 16px 6px;
  }
  .wk-account {
    width: 58px;
  }
  .wk-account-avatar {
    width: 52px;
    height: 52px;
    font-size: 12px;
  }
  .wk-row {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 12px;
    padding: 11px 14px;
    border-radius: 14px;
  }
  .wk-row-mark {
    width: 34px;
    height: 34px;
  }
  .st-app .wk-row-desc {
    font-size: 13.5px;
  }
  .st-app .wk-row-amount {
    font-size: 14.5px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .wk-card,
  .wk-account-avatar,
  .wk-pill,
  .wk-icon,
  .wk-head-add {
    transition: none;
  }
}

.wk-pill.is-primary {
  flex: 1 1 auto;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  background: #fff;
  color: var(--wk-pocket);
  font-size: 15.5px;
  font-weight: 700;
}
.wk-pill.is-primary:hover {
  background: #fff4f0;
}
.wk-pill.is-primary svg {
  stroke-width: 2.4;
}
.wk-icon.is-on {
  background: #fff;
  color: var(--wk-pocket);
}
.wk-accounts-panel {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px 18px 14px;
  border-radius: 18px;
  background: var(--tw-paper-2);
}
.wk-accounts-panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.wk-accounts-panel-head h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--tw-ink);
}
.wk-accounts-panel-head a {
  font-size: 13px;
  font-weight: 500;
  color: var(--tw-muted);
  text-decoration: none;
}
.wk-accounts-list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wk-accounts-item {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
}
.wk-accounts-item .wk-account-avatar {
  width: 40px;
  height: 40px;
  font-size: 11.5px;
}
.wk-accounts-item.is-pending .wk-account-avatar {
  opacity: .55;
}
.wk-accounts-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wk-accounts-text b {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.wk-accounts-text small {
  font-size: 12.5px;
  color: var(--tw-muted);
  letter-spacing: .02em;
}
.wk-accounts-state {
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
  color: var(--tw-green);
}
.wk-accounts-item.is-pending .wk-accounts-state {
  color: var(--tw-amber);
}
.wk-accounts-empty {
  margin: 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.wk-accounts-empty a {
  font-weight: 600;
  color: var(--tw-brand);
  text-decoration: none;
}
@media (max-width: 760px) {
  .st-app .wk-pill.is-primary {
    min-height: 46px;
    font-size: 15px;
  }
  .wk-accounts-panel {
    padding: 14px 16px 12px;
  }
}
.wk-pocket-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.wk-pocket-top .wk-icon {
  width: 38px;
  height: 38px;
  margin: -6px -6px 0 0;
}
.wk-pocket-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.wk-pocket-actions .wk-pill {
  justify-content: center;
  min-height: 46px;
  padding: 0 14px;
  font-size: 14.5px;
  font-weight: 600;
}
.wk-pocket-actions .wk-pill.is-primary {
  font-weight: 700;
}
.wk-pill.is-dim {
  opacity: .5;
  pointer-events: none;
}
.sheet-body .wk-accounts-panel {
  padding: 4px 0 12px;
  background: transparent;
}
.sheet-body .wk-accounts-panel-head h2 {
  font-size: 18px;
}
.sheet-body .wk-accounts-item {
  padding: 10px 0;
}
.wk-accounts-note {
  margin: 8px 0 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--tw-muted);
}
@media (max-width: 760px) {
  .wk-pocket-actions .wk-pill {
    min-height: 44px;
    padding: 0 10px;
    font-size: 14px;
  }
  .wk-pocket-actions .wk-pill svg {
    width: 16px;
    height: 16px;
  }
}
.st-content .mb-points-note {
  margin: 14px 0 0;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--tw-muted);
}
.st-content .mb-points-note strong {
  color: var(--tw-ink);
  font-weight: 600;
}

@media (min-width: 981px) {
  .st-app .mb-shell {
    align-items: start !important;
    gap: 20px !important;
  }
  .st-app .mb-shell .mb-profile {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: none !important;
    grid-template-rows: auto !important;
    align-items: center;
    gap: 18px;
    padding: 18px 22px !important;
    margin: 0 !important;
  }
  .st-app .mb-shell .mb-profile > * {
    grid-area: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
    margin: 0 !important;
  }
  .st-app .mb-shell .mb-profile-avatar {
    width: 64px !important;
    height: 64px !important;
  }
  .st-app .mb-shell .mb-profile-go {
    justify-self: end;
  }
  .st-app .mb-shell .mb-profile-head {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
  }
  .st-app .mb-shell .mb-profile-edit {
    border-color: var(--tw-line-strong);
    background: var(--tw-paper-2);
    color: var(--tw-ink);
  }
  .st-app .mb-shell .mb-profile-stats > * > span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    color: var(--tw-muted);
    text-transform: none;
    letter-spacing: 0;
  }
  .st-app .mb-shell .mb-profile-stats > * > span svg {
    width: 16px;
    height: 16px;
  }
  .st-app .mb-shell .mb-profile-stats {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 28px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }
  .st-app .mb-shell .mb-profile-stats > * {
    display: flex !important;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  .st-app .mb-shell .mb-profile-stats b {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.02em;
  }
  .st-app .mb-shell .mb-panel {
    margin-top: 0 !important;
  }
}
.st-app .mission-row,
.st-app .mm-bd-link,
.st-app .mm-status {
  background: var(--tw-paper-2) !important;
  border: 0 !important;
  box-shadow: none !important;
}
.st-app .mm-status {
  border-radius: 12px !important;
}

.st-app .px-header-inner {
  gap: 40px;
}
.st-app .px-desktop-nav {
  justify-content: flex-start;
}

.wc {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 4px;
  --wc-ink: #2b211c;
  --wc-blob-a: rgba(255, 255, 255, .22);
  --wc-blob-b: rgba(43, 33, 28, .14);
}
.wc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.wc-head h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
}
.wc-head p {
  margin: 2px 0 0;
  font-size: 13.5px;
  color: var(--tw-muted);
}
.wc-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  overflow: hidden;
  background: var(--tw-brand);
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}
.wc-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.wc-main {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
}
.wc-left,
.wc-right {
  display: flex;
  flex-direction: column;
  gap: 22px;
  min-width: 0;
}

.wc-cards {
  display: flex;
  gap: 14px;
  padding: 4px 2px 8px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.wc-cards::-webkit-scrollbar {
  display: none;
}
.wc-card {
  position: relative;
  flex: 0 0 min(100%, 320px);
  aspect-ratio: 320 / 200;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 18px 20px;
  border-radius: 22px;
  overflow: hidden;
  color: var(--wc-ink);
  text-decoration: none;
  scroll-snap-align: start;
  background: #f3b63f;
  transition: transform .25s var(--tw-ease);
}
.wc-card:hover {
  transform: translateY(-3px);
}
.wc-card.is-balance {
  background: var(--tw-brand);
  color: #fff;
  --wc-blob-a: rgba(255, 255, 255, .22);
  --wc-blob-b: rgba(43, 33, 28, .18);
}
.wc-card.tone-1 { background: #f3b63f; --wc-blob-a: rgba(255, 255, 255, .28); --wc-blob-b: rgba(31, 42, 68, .22); }
.wc-card.tone-2 { background: #1f2a44; color: #eef2ff; --wc-blob-a: rgba(243, 182, 63, .55); --wc-blob-b: rgba(96, 165, 250, .35); }
.wc-card.tone-3 { background: #ec8a6b; color: #2b211c; --wc-blob-a: rgba(255, 255, 255, .28); --wc-blob-b: rgba(31, 42, 68, .24); }
.wc-card.is-pending {
  filter: saturate(.6);
}
.wc-card-art {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.wc-card-art path { stroke: none; }
.wc-card-art .a { fill: var(--wc-blob-a); }
.wc-card-art .b { fill: var(--wc-blob-b); }
.wc-card-art .c,
.wc-card-art .d { fill: none; stroke: currentColor; stroke-width: 2; opacity: .55; }
.wc-card-number {
  position: relative;
  font-size: 14px;
  letter-spacing: .14em;
  font-variant-numeric: tabular-nums;
  opacity: .85;
}
.wc-card-foot {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 70%;
}
.wc-card-label {
  font-size: 12px;
  opacity: .8;
}
.wc-card-amount {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.wc-card-amount.is-bank {
  font-size: 17px;
}
.wc-card-brand {
  position: absolute;
  right: 18px;
  bottom: 16px;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  object-fit: cover;
}
.wc-card-brand.is-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 36px;
  height: 30px;
  padding: 0 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, .22);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
}
.wc-card.is-add {
  flex-basis: 150px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--tw-paper-2);
  color: var(--tw-ink-2);
  text-align: center;
}
.wc-add-plus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--tw-paper);
  color: var(--tw-ink);
}
.wc-add-plus svg,
.wc-btn.is-icon svg,
.wc-row-icon svg,
.wc-tile-avatar svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-add-text {
  font-size: 13px;
  font-weight: 600;
}

.wc-state {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wc-state-note {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--tw-ink-2);
}
.wc-state-note b {
  font-weight: 600;
  color: var(--tw-ink);
  white-space: nowrap;
}
.wc-state-note > span {
  display: block;
  font-size: 13px;
  color: var(--tw-muted);
}
.wc-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px;
  gap: 10px;
}
.wc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: 14px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s var(--tw-ease), filter .2s var(--tw-ease);
}
.wc-btn:active {
  transform: scale(.985);
}
.wc-btn.is-primary {
  background: var(--tw-brand);
  color: #fff;
  font-weight: 700;
}
.wc-btn.is-primary:hover {
  filter: brightness(1.06);
}
.wc-btn.is-dim {
  opacity: .5;
  pointer-events: none;
}
.wc-btn.is-icon {
  padding: 0;
}

.wc-flow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}
.wc-flow > div {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--tw-paper-2);
}
.wc-flow dt {
  font-size: 12px;
  color: var(--tw-muted);
}
.wc-flow dd {
  margin: 0;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}

.wc-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wc-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 0 2px;
}
.wc-section-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.015em;
  color: var(--tw-ink);
}
.wc-section-head a,
.wc-section-head span {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--tw-muted);
  text-decoration: none;
}
.wc-tiles {
  display: flex;
  gap: 12px;
  overflow-x: auto;
  padding: 2px 2px 6px;
  scrollbar-width: none;
}
.wc-tiles::-webkit-scrollbar {
  display: none;
}
.wc-tile {
  flex: 0 0 128px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border-radius: 18px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  text-decoration: none;
  transition: transform .2s var(--tw-ease);
}
.wc-tile:hover {
  transform: translateY(-2px);
}
.wc-tile.tone-1 { background: #f3b63f; color: #2b211c; }
.wc-tile.tone-2 { background: #1f2a44; color: #eef2ff; }
.wc-tile.tone-3 { background: #ec8a6b; color: #2b211c; }
.wc-tile.is-promo { background: var(--tw-brand); color: #fff; }
.wc-tile-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: rgba(255, 255, 255, .28);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .03em;
}
.wc-tile.is-add .wc-tile-avatar {
  background: var(--tw-paper);
}
.wc-tile-name {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}
.wc-tile-sub {
  margin-top: -6px;
  font-size: 12px;
  opacity: .8;
}

.wc-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wc-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 10px 6px;
}
.wc-row-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
}
.wc-row-icon.is-in {
  background: color-mix(in srgb, var(--tw-green) 14%, var(--tw-paper));
  color: var(--tw-green);
}
.wc-row-icon.is-out {
  background: color-mix(in srgb, var(--tw-danger) 12%, var(--tw-paper));
  color: var(--tw-danger);
}
.wc-row-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wc-row-main b {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--tw-ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.wc-row-main small {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.wc-row-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}
.wc-row-side b {
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.wc-row-side b.is-in { color: var(--tw-green); }
.wc-row-side b.is-out { color: var(--tw-danger); }
.wc-row-side time {
  font-size: 12px;
  color: var(--tw-muted);
  font-variant-numeric: tabular-nums;
}
.wc-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 24px;
  border-radius: 18px;
  background: var(--tw-paper-2);
}
.wc-empty p {
  margin: 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.wc-empty-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--tw-ink) !important;
}
.wc-empty .wc-btn {
  margin-top: 6px;
}

:root[data-theme="dark"] .wc-card.is-add,
:root[data-theme="dark"] .wc-tile:not(.tone-1):not(.tone-2):not(.tone-3):not(.is-promo) {
  color: var(--tw-ink);
}

@media (max-width: 980px) {
  .wc-main {
    max-width: none;
    gap: 22px;
  }
}
@media (max-width: 760px) {
  .wc {
    gap: 18px;
    margin-top: 0;
  }
  .st-app .wc-head h1 {
    font-size: 22px;
  }
  .wc-avatar {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }
  .wc-cards {
    margin: 0 -16px;
    padding: 4px 16px 8px !important;
    scroll-padding-left: 16px;
  }
  .wc-card {
    flex-basis: 78%;
  }
  .wc-card.is-add {
    flex-basis: 120px;
  }
  .st-app .wc-card-amount {
    font-size: 20px;
  }
  .st-app .wc-state-note {
    font-size: 13.5px;
  }
  .wc-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 42px;
    gap: 8px;
  }
  .st-app .wc-btn {
    min-height: 42px;
    font-size: 14px;
  }
  .wc-flow > div {
    padding: 10px 12px;
  }
  .st-app .wc-flow dd {
    font-size: 14px;
  }
  .wc-tiles {
    margin: 0 -16px;
    padding: 2px 16px 6px;
  }
  .wc-tile {
    flex-basis: 116px;
    padding: 12px;
  }
  .st-app .wc-section-head h2 {
    font-size: 16px;
  }
  .wc-row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 12px;
    padding: 8px 2px;
  }
  .wc-row-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }
  .st-app .wc-row-main b {
    font-size: 13.5px;
  }
  .st-app .wc-row-side b {
    font-size: 14px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .wc-card,
  .wc-tile,
  .wc-btn {
    transition: none;
  }
}

.wc-balance {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 2px 0;
}
.wc-balance-label {
  margin: 0;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--tw-muted);
}
.wc-balance-amount {
  margin: 0;
  font-size: 44px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
  color: var(--tw-ink);
}
.wc-balance .wc-state-note {
  margin-top: 2px;
}
.wc-balance .wc-actions {
  margin-top: 8px;
}
.wc-mini {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 30px;
  padding: 0 12px 0 8px;
  border-radius: 999px;
  background: var(--tw-paper-2);
  color: var(--tw-ink) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none;
}
.wc-mini svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
}
.wc-card-top {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.wc-card-status {
  font-size: 11.5px;
  font-weight: 600;
  opacity: .85;
  white-space: nowrap;
}
.wc-card-bankname {
  font-size: 12.5px;
  opacity: .85;
}
.wc-card.is-empty {
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  --wc-blob-a: rgba(43, 33, 28, .06);
  --wc-blob-b: rgba(43, 33, 28, .1);
}
.wc-card .wc-card-amount.is-bank {
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wc-card-foot {
  max-width: 72%;
}

.wc-promo {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 20px 22px;
  border-radius: 22px;
  overflow: hidden;
  background: var(--tw-brand);
  color: #fff;
  text-decoration: none;
  --wc-blob-a: rgba(255, 255, 255, .2);
  --wc-blob-b: rgba(43, 33, 28, .18);
  transition: transform .2s var(--tw-ease);
}
.wc-promo:hover {
  transform: translateY(-2px);
}
.wc-promo-text {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.wc-promo-amount {
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.wc-promo-sub {
  font-size: 13.5px;
  line-height: 1.4;
  opacity: .92;
  max-width: 36ch;
}
.wc-promo-cta {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border-radius: 999px;
  background: #fff;
  color: var(--tw-brand);
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.wc-promo-cta svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.wc-stack-panel {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 4px 0 12px;
}
.wc-stack {
  position: relative;
  height: 0;
  padding-top: calc(62.5% + (var(--n, 1) - 1) * 64px);
  max-width: 360px;
  margin: 8px auto 0;
  width: 100%;
}
.wc-stack-card {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  aspect-ratio: 320 / 200;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 18px 20px;
  border: 0;
  border-radius: 22px;
  overflow: hidden;
  color: var(--wc-ink);
  font: inherit;
  text-align: left;
  cursor: pointer;
  --order: var(--i, 0);
  transform: translateY(calc(var(--order) * 64px)) scale(calc(1 - var(--order) * .03));
  z-index: calc(20 - var(--order));
  transition: transform .45s cubic-bezier(.32, .72, 0, 1), filter .3s var(--tw-ease);
  filter: brightness(calc(1 - var(--order) * .08));
}
.wc-stack-card.is-active {
  filter: none;
}
.wc-stack-card.tone-1 { background: #f3b63f; --wc-blob-a: rgba(255, 255, 255, .28); --wc-blob-b: rgba(31, 42, 68, .22); }
.wc-stack-card.tone-2 { background: #1f2a44; color: #eef2ff; --wc-blob-a: rgba(243, 182, 63, .55); --wc-blob-b: rgba(96, 165, 250, .35); }
.wc-stack-card.tone-3 { background: #ec8a6b; color: #2b211c; --wc-blob-a: rgba(255, 255, 255, .28); --wc-blob-b: rgba(31, 42, 68, .24); }
.wc-stack-card:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: 2px;
}
.wc-stack-go {
  align-self: stretch;
}
.wc-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0 6px;
  font-size: 14px;
  font-weight: 600;
  color: var(--tw-muted);
  text-decoration: none;
}
.wc-back:hover {
  color: var(--tw-ink);
}

@media (max-width: 760px) {
  .wc-balance-amount {
    font-size: 38px;
  }
  .wc-promo {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 18px;
  }
  .st-app .wc-promo-amount {
    font-size: 28px;
  }
  .wc-promo-cta {
    justify-content: center;
  }
  .wc-stack {
    padding-top: calc(62.5% + (var(--n, 1) - 1) * 56px);
  }
  .wc-stack-card {
    transform: translateY(calc(var(--order) * 56px)) scale(calc(1 - var(--order) * .03));
  }
}
@media (prefers-reduced-motion: reduce) {
  .wc-stack-card,
  .wc-promo {
    transition: none;
  }
}
.st-app .wc-balance-amount {
  font-size: 48px !important;
  line-height: 1 !important;
}
.st-app .wc-balance-label {
  font-size: 13.5px !important;
}
.wc-card-number {
  white-space: nowrap;
  font-size: 13px;
  letter-spacing: .12em;
}
.wc-card-top .wc-card-status {
  flex: 0 0 auto;
}
@media (max-width: 760px) {
  .st-app .wc-balance-amount {
    font-size: 38px !important;
  }
}

.st-app .wc-back {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin: 2px 0 4px -6px;
  padding: 4px 8px 4px 2px;
  border-radius: 999px;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--tw-brand) !important;
  text-decoration: none;
}
.st-app .wc-back svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.st-app .discover-filters {
  --pf: var(--tw-brand);
  --pf-ink: #fff;
  position: sticky;
  top: 86px;
  z-index: 40;
  isolation: isolate;
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px !important;
  margin: 0 0 16px !important;
  padding: 12px !important;
  border: 1px solid var(--glass-edge-soft, rgba(43, 33, 28, .06)) !important;
  border-radius: 18px !important;
  background: color-mix(in srgb, var(--tw-brand) 4%, var(--glass-bg, rgba(255, 253, 250, .84))) !important;
  box-shadow: inset 0 1px 0 var(--glass-edge, rgba(255, 255, 255, .5)), var(--glass-shadow, 0 14px 40px -26px rgba(43, 33, 28, .3)) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.3) !important;
  backdrop-filter: blur(18px) saturate(1.3) !important;
}
.st-app .discover-page[data-discover-platform="lazada"] .discover-filters {
  --pf: #1a237e;
  background: color-mix(in srgb, #1a237e 4%, var(--glass-bg, rgba(255, 253, 250, .84))) !important;
}
:root[data-theme="dark"] .st-app .discover-page[data-discover-platform="lazada"] .discover-filters {
  --pf: #6c7bff;
  --pf-ink: #0b0d2a;
}
.st-app .discover-search {
  flex: 1 1 260px;
  max-width: 420px;
}
.st-app .discover-search input {
  min-height: 40px !important;
  padding-left: 40px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--tw-paper) !important;
  font-size: 14px !important;
}
.st-app .discover-search > span:first-child {
  left: 12px;
}
.st-app .discover-filter-buttons {
  display: flex !important;
  flex: 1 1 auto;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px !important;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
  padding-bottom: 2px;
}
.st-app .discover-filter-buttons::-webkit-scrollbar {
  display: none;
}
.st-app .discover-platform-switch,
.st-app .discover-category-tabs {
  display: inline-flex !important;
  flex: 0 0 auto;
  gap: 4px !important;
  margin: 0 !important;
  padding: 3px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: var(--tw-paper) !important;
  box-shadow: none !important;
}
.st-app .discover-category-tabs {
  background: transparent !important;
  padding: 0 !important;
  gap: 6px !important;
}
.st-app .discover-category-tabs[hidden] {
  display: none !important;
}
.st-app .discover-platform-switch > button,
.st-app .discover-category-tabs > button {
  min-height: 32px !important;
  padding: 0 12px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: var(--tw-ink-2) !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  white-space: nowrap;
  box-shadow: none !important;
  transition: background .18s var(--tw-ease, ease), color .18s var(--tw-ease, ease);
}
.st-app .discover-category-tabs > button {
  background: var(--tw-paper) !important;
}
.st-app .discover-platform-switch > button.platform-shopee.active,
.st-app .discover-platform-switch > button.platform-shopee[aria-pressed="true"] {
  background: var(--tw-brand) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px -4px color-mix(in srgb, var(--tw-brand) 60%, transparent) !important;
}
.st-app .discover-platform-switch > button.platform-lazada.active,
.st-app .discover-platform-switch > button.platform-lazada[aria-pressed="true"] {
  background: #1a237e !important;
  color: #fff !important;
  box-shadow: 0 4px 12px -4px rgba(26, 35, 126, .6) !important;
}
:root[data-theme="dark"] .st-app .discover-platform-switch > button.platform-lazada.active,
:root[data-theme="dark"] .st-app .discover-platform-switch > button.platform-lazada[aria-pressed="true"] {
  background: #6c7bff !important;
  color: #0b0d2a !important;
}
.st-app .discover-category-tabs > button.active,
.st-app .discover-category-tabs > button[aria-pressed="true"] {
  background: var(--pf) !important;
  color: var(--pf-ink) !important;
}
@media (max-width: 760px) {
  .st-app .discover-filters {
    top: 60px;
    gap: 8px !important;
    margin-bottom: 10px !important;
  }
  .st-app .discover-search {
    flex-basis: 100%;
    max-width: none;
  }
  .st-app .discover-filter-buttons {
    margin: 0 -16px;
    padding: 0 16px 2px;
  }
  .st-app .discover-platform-switch > button,
  .st-app .discover-category-tabs > button {
    min-height: 30px !important;
    padding: 0 11px !important;
    font-size: 13px !important;
  }
}
.st-app .discover-search > span:first-child {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: 18px !important;
  height: 18px !important;
  left: 12px !important;
}
.st-app .discover-search svg {
  stroke: var(--tw-muted);
}
.st-app .px-discover-search {
  height: 40px !important;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--tw-paper-2) !important;
  gap: 8px !important;
}
.st-app .px-discover-search > span:first-child {
  position: static !important;
  transform: none !important;
}
.st-app .px-discover-search input {
  min-height: 40px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.wc-balance {
  padding: 18px 20px 20px !important;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.wc-balance-amount {
  display: flex;
  align-items: baseline;
  gap: 8px;
  color: var(--tw-brand) !important;
}
.st-app .wc-balance-number {
  font-size: 48px;
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.st-app .wc-balance-unit {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--tw-brand);
  opacity: .9;
}
.wc-card-wrap {
  position: relative;
  flex: 0 0 min(100%, 320px);
  scroll-snap-align: start;
}
.wc-card-wrap .wc-card {
  flex-basis: auto;
  width: 100%;
}
.wc-card-remove {
  position: absolute;
  top: 10px;
  right: 10px;
  margin: 0;
}
.wc-card-remove button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .28);
  color: inherit;
  cursor: pointer;
  opacity: .75;
}
.wc-card-remove button:hover {
  opacity: 1;
}
.wc-card-remove svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: #2b211c;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-card-wrap .tone-2 ~ .wc-card-remove svg,
.wc-card-wrap:has(.tone-2) .wc-card-remove svg {
  stroke: #eef2ff;
}
.wc-card-wrap .wc-card-status {
  margin-right: 34px;
}
.wc-stack-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}
.wc-stack-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 2px;
  font-size: 14px;
  color: var(--tw-ink);
}
.wc-stack-list form {
  margin: 0;
}
.wc-stack-remove {
  border: 0;
  padding: 6px 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tw-danger) 10%, var(--tw-paper));
  color: var(--tw-danger);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
@media (max-width: 760px) {
  .wc-balance {
    padding: 16px 16px 18px !important;
  }
  .st-app .wc-balance-number {
    font-size: 40px;
  }
  .wc-card-wrap {
    flex-basis: 78%;
  }
}
.wc-balance .wc-btn:not(.is-primary) {
  background: var(--tw-paper);
}
.wc-card-remove button.button-danger {
  width: 30px !important;
  height: 30px !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, .3) !important;
  box-shadow: none !important;
}
.wc-stack-remove.button-danger {
  min-height: 0 !important;
  padding: 6px 10px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: color-mix(in srgb, var(--tw-danger) 10%, var(--tw-paper)) !important;
  color: var(--tw-danger) !important;
  font-size: 13px !important;
  box-shadow: none !important;
}
.money {
  white-space: nowrap;
}
.money small {
  display: inline-block;
  margin-left: .28em;
  font-size: .62em;
  font-weight: 600;
  letter-spacing: .04em;
  opacity: .8;
  vertical-align: baseline;
}
.wc-balance-amount .money small,
.wc-promo-amount .money small {
  font-size: .34em;
  font-weight: 700;
  margin-left: .22em;
}
.st-app .wc-balance-amount {
  font-size: 48px !important;
  font-weight: 800 !important;
  letter-spacing: -.035em !important;
}
@media (max-width: 760px) {
  .st-app .wc-balance-amount {
    font-size: 40px !important;
  }
}
.wc-state-note {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wc-state-note > span {
  white-space: normal;
}
.wc-state-note .wc-hl {
  font-weight: 700;
  color: var(--tw-brand);
}
.wc-state-note .wc-hl.is-min {
  color: var(--tw-ink);
}
@media (max-width: 760px) {
  .st-app .wc-state-note {
    font-size: 13px;
  }
}
.st-app .wc-state-note {
  white-space: nowrap !important;
}
.wc-section-tools {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.wc-mini.is-icon {
  width: 30px;
  padding: 0 !important;
  justify-content: center;
  border: 0;
  cursor: pointer;
  font: inherit;
}
.wc-mini.is-icon svg {
  width: 16px;
  height: 16px;
}
.wc-cards-wrap,
.wc-stack-wrap {
  position: relative;
}
.wc-arrow {
  position: absolute;
  top: 50%;
  z-index: 30;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 253, 250, .9);
  color: var(--tw-ink);
  box-shadow: 0 6px 18px -8px rgba(43, 33, 28, .45);
  cursor: pointer;
  transform: translateY(-50%);
  transition: opacity .2s var(--tw-ease), transform .15s var(--tw-ease);
}
.wc-arrow svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-arrow.is-prev { left: 6px; }
.wc-arrow.is-next { right: 6px; }
.wc-arrow:active { transform: translateY(-50%) scale(.94); }
.wc-cards-wrap.at-start .wc-arrow.is-prev,
.wc-cards-wrap.at-end .wc-arrow.is-next,
.wc-cards-wrap.no-scroll .wc-arrow {
  opacity: 0;
  pointer-events: none;
}
.wc-stack-wrap .wc-arrow {
  top: auto;
  bottom: 14px;
  transform: none;
}
.wc-stack-wrap .wc-arrow:active { transform: scale(.94); }
.wc-stack-wrap .wc-arrow.is-prev { left: -4px; }
.wc-stack-wrap .wc-arrow.is-next { right: -4px; }
:root[data-theme="dark"] .wc-arrow {
  background: rgba(40, 32, 28, .92);
  color: #fff;
}
.mb-points-note .wc-hl {
  font-weight: 700;
  color: var(--tw-brand);
}
.mb-points-note .wc-hl.is-min {
  color: var(--tw-ink);
}
.st-content .mb-points-note {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 760px) {
  .wc-cards-wrap .wc-arrow.is-prev { left: 2px; }
  .wc-cards-wrap .wc-arrow.is-next { right: 2px; }
}
.px-hero-money .money small,
.px-hero-stat .money small {
  font-size: .5em;
  margin-left: .2em;
}
.wc-cards-wrap.at-start .wc-arrow.is-prev,
.wc-cards-wrap.at-end .wc-arrow.is-next {
  opacity: 1;
  pointer-events: auto;
}
.wc-dots {
  display: flex;
  justify-content: center;
  gap: 6px;
  margin-top: 8px;
}
.wc-dots span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--tw-line-strong);
  transition: width .25s var(--tw-ease), background-color .25s var(--tw-ease);
}
.wc-dots span.is-on {
  width: 18px;
  border-radius: 3px;
  background: var(--tw-brand);
}
.buy-steps {
  display: flex;
  gap: 8px;
  margin: 12px 0 14px;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.buy-steps li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  padding: 6px 12px 6px 6px;
  border-radius: 999px;
  background: var(--tw-paper-2);
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-ink-2);
  white-space: nowrap;
}
.buy-steps li span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--tw-brand);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.st-content .buy-form-hint:empty {
  display: none;
}
.st-content .buy-multi-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 12px 0 0;
  padding: 10px 12px !important;
  border-radius: 12px;
  background: var(--tw-paper-2);
  font-size: 13px;
  line-height: 1.45;
  color: var(--tw-muted);
}
.st-content .buy-multi-note b {
  color: var(--tw-ink);
  font-weight: 600;
}
.st-content .buy-multi-note-ico {
  flex: 0 0 auto;
  display: inline-flex;
  width: 18px;
  height: 18px;
  color: var(--tw-brand);
}
.st-content .buy-multi-note-ico svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.st-content .mb-converter-head p {
  font-size: 13px;
  color: var(--tw-muted);
}
.st-content .buy-multi-note > span {
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal !important;
}
.st-content .buy-steps {
  max-width: 100%;
}
.st-content .buy-steps {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.st-content .mb-converter {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
}
.wc-stack-note {
  margin: 14px 0 0 !important;
  font-size: 14px;
}
.st-app .px-home-hero-meta > * {
  display: flex !important;
  flex-direction: column;
  justify-content: flex-end;
  gap: 3px;
}
.st-app .px-home-hero-meta b {
  display: block;
  min-height: 1.25em;
  line-height: 1.25;
}
.st-app .px-home-hero-meta b.px-hero-rate {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #ffd36b;
  white-space: nowrap;
}
.st-app .px-home-hero-meta small {
  margin-top: 0 !important;
}
.st-content .buy-steps li {
  font-size: 12px;
  padding: 5px 10px 5px 5px;
  gap: 6px;
}
.st-content .buy-steps li span {
  width: 20px;
  height: 20px;
  font-size: 11px;
}
.st-content .mb-points-value,
.st-content .mb-points-value .money {
  color: var(--tw-brand) !important;
}
.st-content .mb-points-pending strong,
.st-content .mb-points-pending .money {
  color: var(--tw-amber) !important;
  font-weight: 700;
}
.st-content .mb-points-note .wc-hl,
.st-content .mb-points-note .wc-hl .money {
  color: var(--tw-brand) !important;
}
.st-content .mb-points-note .wc-hl.is-min,
.st-content .mb-points-note .wc-hl.is-min .money {
  color: var(--tw-ink) !important;
}
@media (max-width: 760px) {
  .st-app .px-home-hero-meta b.px-hero-rate {
    font-size: 12.5px !important;
  }
  .st-content .buy-steps li {
    font-size: 11.5px;
  }
}
.st-content .withdraw-action > strong,
.st-content .withdraw-action > strong .money {
  color: var(--tw-brand) !important;
  font-weight: 800 !important;
}
.st-content .bank-disclaimer,
.st-content .security-note {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--tw-paper-2) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: var(--tw-muted) !important;
}
.st-content .security-note > span {
  flex: 0 0 auto;
  display: inline-flex;
  width: 18px;
  height: 18px;
  color: var(--tw-green);
}
.st-content .security-note > span svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.st-content .security-note p {
  margin: 0;
}
.wc-btn svg {
  width: 18px;
  height: 18px;
  margin-right: 8px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-flow dt {
  display: flex;
  align-items: center;
  gap: 6px;
}
.wc-flow dt svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-flow dt svg.is-amber { color: var(--tw-amber); }
.wc-flow dt svg.is-green { color: var(--tw-green); }
.wc-state-note {
  white-space: normal !important;
}
.st-app .wc-state-note {
  white-space: normal !important;
}
@media (max-width: 760px) {
  .st-app .wc-actions .wc-btn {
    padding: 0 8px;
    font-size: 13.5px;
  }
  .st-app .wc-actions .wc-btn svg {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }
  .st-app .wc-flow dt {
    font-size: 11.5px;
    white-space: nowrap;
  }
}
.wc-stack-wrap .wc-arrow.is-up,
.wc-stack-wrap .wc-arrow.is-down {
  left: auto;
  right: -4px;
  bottom: auto;
  transform: none;
}
.wc-stack-wrap .wc-arrow.is-up {
  top: -6px;
}
.wc-stack-wrap .wc-arrow.is-down {
  bottom: 10px;
}
.wc-stack-wrap .wc-arrow.is-up:active,
.wc-stack-wrap .wc-arrow.is-down:active {
  transform: scale(.94);
}
.wc-cards-grid {
  flex-wrap: wrap;
  overflow: visible;
  scroll-snap-type: none;
}
.wc-cards-grid .wc-card-wrap {
  flex: 0 0 min(100%, 320px);
}
.wc-card-eye {
  position: absolute;
  top: 10px;
  right: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .3);
  color: #2b211c;
  cursor: pointer;
}
.wc-card-eye svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-card-wrap:has(.tone-2) .wc-card-eye {
  color: #eef2ff;
}
.wc-cards-grid .wc-card-wrap .wc-card-status {
  margin-right: 70px;
}
.wc-cards-grid .bank-reason {
  margin: 8px 2px 0;
  font-size: 12.5px;
  color: var(--tw-danger);
}
@media (max-width: 760px) {
  .wc-cards-grid {
    margin: 0;
    padding: 0 !important;
  }
  .wc-cards-grid .wc-card-wrap {
    flex-basis: 100%;
  }
}

.wd {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-top: 12px;
}
.wd-grid {
  display: grid;
  grid-template-columns: minmax(0, 520px) minmax(260px, 400px);
  gap: 32px 56px;
  align-items: start;
}
.st-content .wd-form {
  padding: 24px;
  border: 0;
  border-radius: 22px;
  background: var(--tw-paper-2);
  box-shadow: none;
}
.st-content .wd-form > strong {
  margin: 6px 0 20px;
}
.st-content .wd-form .stack-form input,
.st-content .wd-form .stack-form select {
  background: var(--tw-paper);
}
.wd-form .currency-input-shell {
  position: relative;
  display: block;
}
.wd-form .currency-input-suffix {
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-muted);
}
.wd-steps {
  padding-top: 6px;
}
.wd-steps h2 {
  margin: 0 0 18px;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--tw-ink);
}
.wd-steps ol {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wd-steps li {
  position: relative;
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: 14px;
  padding: 0 0 20px;
}
.wd-steps li:last-child {
  padding-bottom: 0;
}
.wd-steps li:not(:last-child)::after {
  position: absolute;
  top: 30px;
  bottom: 4px;
  left: 12.5px;
  width: 1px;
  background: var(--tw-line);
  content: "";
}
.wd-steps li > span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.wd-steps li.active > span {
  background: var(--tw-brand);
  color: #fff;
}
.wd-steps li b {
  display: block;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--tw-ink);
}
.wd-steps li small {
  display: block;
  margin-top: 3px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--tw-muted);
}
.wd-steps-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 20px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--tw-brand);
  text-decoration: none;
}
.wd-steps-link svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wd-history {
  max-width: 760px;
}
.wd-list {
  gap: 0;
}
.wd-list .wc-row {
  padding: 13px 6px;
  border-bottom: 1px solid var(--tw-line);
}
.wd-list .wc-row:last-child {
  border-bottom: 0;
}
.wd-list .wc-row-side {
  gap: 5px;
}
.wd-list .status-badge {
  font-size: 11px;
  padding: 3px 9px;
}
.wc-row-icon.is-wait {
  background: color-mix(in srgb, var(--tw-amber) 16%, var(--tw-paper));
  color: var(--tw-amber);
}
.wc-row-side b.is-muted {
  color: var(--tw-muted);
  text-decoration: line-through;
}
.wd-reason {
  color: var(--tw-danger);
}
.wd.is-sheet {
  margin-top: 0;
}
.wd.is-sheet .wd-grid {
  grid-template-columns: 1fr;
  gap: 26px;
}
.wd.is-sheet .st-content .wd-form,
.wd.is-sheet .wd-form {
  padding: 0;
  background: transparent;
}
.wd.is-sheet .wd-steps {
  padding-top: 22px;
  border-top: 1px solid var(--tw-line);
}
@media (max-width: 900px) {
  .wd-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }
  .wd-steps {
    padding-top: 0;
  }
}
@media (max-width: 640px) {
  .st-content .wd-form {
    padding: 18px;
    border-radius: 18px;
  }
  .wd-list .wc-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px 0;
  }
  .wd-list .wc-row-icon {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }
}

.st-app .px-product-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px 14px;
  padding-top: 20px;
}
.st-app .px-product-card {
  border: 0;
  border-radius: 16px;
  background: var(--tw-paper);
  box-shadow: 0 1px 0 var(--tw-line), 0 10px 24px -20px rgba(43, 33, 28, .35);
}
.st-app .px-product-media {
  height: auto;
  aspect-ratio: 1;
  background: var(--tw-paper-2);
}
.st-app .px-product-body {
  padding: 12px 12px 6px;
}
.st-app .px-product-category,
.st-app .discover-card-meta {
  font-size: 11.5px;
  font-weight: 500;
  color: var(--tw-muted);
}
.st-app .px-product-body h2 {
  margin: 4px 0 0;
  min-height: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}
.st-app .px-price-box {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-top: 10px;
}
.st-app .px-cashback-line {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  color: var(--tw-muted);
  font-size: 11.5px;
  font-weight: 500;
}
.st-app .px-cashback-line b {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.01em;
  color: var(--tw-green);
  font-variant-numeric: tabular-nums;
}
.st-app .px-price-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  margin-top: 2px;
}
.st-app .px-price-line strong {
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-ink-2);
  font-variant-numeric: tabular-nums;
}
.st-app .px-price-line del {
  font-size: 11px;
  color: var(--tw-muted);
}
.st-app .px-product-footer {
  padding: 0 12px 12px;
}
.st-app .st-content .discover-primary-action {
  min-height: 36px;
  font-size: 13px;
  justify-content: center;
}
.st-app .discover-cashback-badge {
  font-size: 11px;
}
@media (max-width: 1180px) {
  .st-app .px-product-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  .st-app .px-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 10px;
    padding-top: 12px;
  }
  .st-app .px-product-body {
    padding: 10px 10px 4px;
  }
  .st-app .px-product-body h2 {
    font-size: 13px;
  }
  .st-app .px-cashback-line b {
    font-size: 15.5px;
  }
  .st-app .px-price-line strong {
    font-size: 12.5px;
  }
  .st-app .px-product-footer {
    padding: 0 10px 10px;
  }
  .st-app .st-content .discover-primary-action {
    min-height: 34px;
    font-size: 12.5px;
  }
}

.tw-order-meta > span:not(.tw-status):last-child::after {
  content: none;
}
.tw-order-code {
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  color: var(--tw-ink-2);
}
.tw-order-state {
  display: flex;
  margin-top: 2px;
}
.tw-order-state .tw-status {
  padding: 3px 9px 3px 7px;
  border-radius: 999px;
  font-size: 11.5px;
  background: color-mix(in srgb, currentColor 10%, transparent);
}
.tw-order-row .tw-order-cash {
  font-size: 15px;
}
.tw-order-row .tw-order-cash.is-cash {
  font-size: 16px;
}
@media (max-width: 640px) {
  .st-app .tw-order-row {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: start;
    gap: 10px;
    padding: 12px 12px 12px 10px;
  }
  .st-app .tw-order-row .tw-order-chevron {
    display: none;
  }
  .st-app .tw-order-row .tw-order-thumb {
    width: 44px;
    height: 44px;
    border-radius: 10px;
  }
  .st-app .tw-order-row .tw-order-name {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-size: 14px;
  }
  .st-app .tw-order-row .tw-order-meta {
    font-size: 12px;
  }
  .st-app .tw-order-row .tw-order-code {
    flex-basis: 100%;
  }
  .st-app .tw-order-row .tw-order-meta > span:nth-child(2)::after {
    content: none;
  }
  .st-app .tw-order-row .tw-order-cash {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    margin-top: 2px;
    font-size: 14px;
  }
  .st-app .tw-order-row .tw-order-cash.is-cash {
    font-size: 15px;
  }
}

.ms {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 4px;
}
.ms-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.st-app .ms-head h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.ms-head p {
  margin: 0;
  font-size: 13.5px;
  color: var(--tw-muted);
}
.ms-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 28px 40px;
  align-items: start;
}
.ms-col {
  display: flex;
  flex-direction: column;
  gap: 22px;
  min-width: 0;
}
.ms-label {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--tw-muted);
}
.ms-points {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.ms-points-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.ms-points-num {
  display: flex;
  align-items: baseline;
  gap: 6px;
  margin: 2px 0 0;
}
.ms-points-num strong {
  font-size: 40px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--tw-brand);
  font-variant-numeric: tabular-nums;
}
.ms-points-num span {
  font-size: 15px;
  font-weight: 600;
  color: var(--tw-muted);
}
.ms-points-reward {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: var(--tw-paper);
}
.ms-points-reward small {
  display: block;
  font-size: 11.5px;
  color: var(--tw-muted);
}
.ms-points-reward b {
  font-size: 15px;
  font-weight: 700;
  color: var(--tw-ink);
}
.ms-reward-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--tw-brand) 12%, var(--tw-paper));
  color: var(--tw-brand);
}
.ms-reward-ic svg,
.ms-mission-ic svg,
.ms-tier-ic svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ms-bar {
  display: block;
  width: 100%;
  height: 8px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tw-ink) 8%, transparent);
  overflow: hidden;
}
.ms-bar > span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--tw-brand);
  transition: width .5s var(--tw-ease);
}
.ms-bar.is-thin {
  height: 4px;
  margin-top: 6px;
}
.ms-points-foot {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ms-points-foot p {
  margin: 0;
  font-size: 14px;
  color: var(--tw-ink-2);
}
.ms-points-foot p b {
  color: var(--tw-brand);
}
.ms-points-reject {
  font-size: 13px !important;
  color: var(--tw-danger) !important;
}
.ms-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border: 0;
  border-radius: 12px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s var(--tw-ease), filter .2s var(--tw-ease);
}
.ms-btn:active {
  transform: scale(.985);
}
.ms-btn.is-primary {
  background: var(--tw-brand);
  color: #fff;
}
.ms-btn.is-primary:hover {
  filter: brightness(1.05);
}
.ms-btn.is-ghost {
  align-self: flex-start;
  margin-top: 14px;
  border: 1px solid var(--tw-line-strong);
  background: transparent;
}
.ms-btn.is-small {
  min-height: 32px;
  padding: 0 12px;
  font-size: 12.5px;
  border-radius: 999px;
}
.ms-next {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding: 20px;
  border-radius: 20px;
  color: #fff;
  background: linear-gradient(135deg, var(--tw-brand), color-mix(in srgb, var(--tw-brand) 70%, #ffb347));
}
.ms-next .ms-label {
  color: rgba(255, 255, 255, .8);
}
.st-app .ms-next h2 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.015em;
  color: #fff;
}
.ms-next p {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(255, 255, 255, .88);
}
.ms-next .ms-bar {
  margin-top: 4px;
  background: rgba(255, 255, 255, .25);
}
.ms-next .ms-bar > span {
  background: #fff;
}
.ms-next .ms-btn.is-primary {
  margin-top: 8px;
  background: #fff;
  color: var(--tw-brand);
}
.ms-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ms-missions,
.ms-tiers,
.ms-people-list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ms-mission-link,
.ms-tier,
.ms-people-list li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 12px 4px;
  border: 0;
  border-bottom: 1px solid var(--tw-line);
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.ms-tier,
.ms-people-list li {
  cursor: default;
}
.ms-missions > li:last-child .ms-mission-link,
.ms-tier:last-child,
.ms-people-list li:last-child {
  border-bottom: 0;
}
.ms-mission-ic,
.ms-tier-ic,
.ms-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 13px;
  background: var(--tw-paper-2);
  color: var(--tw-ink-2);
}
.ms-tier.is-done .ms-tier-ic {
  background: color-mix(in srgb, var(--tw-green) 14%, var(--tw-paper));
  color: var(--tw-green);
}
.ms-avatar {
  border-radius: 50%;
  font-size: 15px;
  font-weight: 700;
}
.ms-mission-main,
.ms-tier-main,
.ms-people-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ms-mission-main b,
.ms-tier-main b,
.ms-people-main b {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--tw-ink);
}
.ms-mission-main small,
.ms-tier-main small,
.ms-people-main small {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.ms-mission-side,
.ms-tier-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
}
.ms-mission-side b {
  font-size: 15px;
  font-weight: 700;
  color: var(--tw-green);
  font-variant-numeric: tabular-nums;
}
.ms-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tw-ink) 7%, transparent);
  color: var(--tw-ink-2);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}
.ms-pill.is-ok {
  background: color-mix(in srgb, var(--tw-green) 14%, transparent);
  color: var(--tw-green);
}
.ms-pill.is-wait {
  background: color-mix(in srgb, var(--tw-amber) 16%, transparent);
  color: var(--tw-amber);
}
.ms-pill.is-bad {
  background: color-mix(in srgb, var(--tw-danger) 12%, transparent);
  color: var(--tw-danger);
}
.ms-rule,
.ms-people {
  margin-top: 2px;
}
.ms-rule summary,
.ms-people summary {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--tw-ink-2);
  cursor: pointer;
  list-style: none;
}
.ms-rule summary::-webkit-details-marker,
.ms-people summary::-webkit-details-marker {
  display: none;
}
.ms-rule summary::before,
.ms-people summary::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(-45deg);
  transition: transform .2s var(--tw-ease);
}
.ms-rule[open] summary::before,
.ms-people[open] summary::before {
  transform: rotate(45deg);
}
.ms-rule ul {
  margin: 4px 0 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--tw-muted);
}
.ms-tabs {
  display: inline-flex;
  align-self: flex-start;
  gap: 4px;
  padding: 3px;
  border-radius: 999px;
  background: var(--tw-paper-2);
}
.ms-tabs button {
  min-height: 32px;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--tw-ink-2);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
}
.ms-tabs button.active {
  background: var(--tw-paper);
  color: var(--tw-ink);
  box-shadow: 0 1px 2px rgba(43, 33, 28, .12);
}
.ms-meter {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 0 10px;
}
.ms-meter-head {
  display: flex;
  align-items: baseline;
  gap: 5px;
}
.ms-meter-head b {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
}
.ms-meter-head span {
  font-size: 13px;
  color: var(--tw-muted);
}
.st-app .ms-track {
  margin: 0;
}
.ms-note {
  margin: 0 0 6px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--tw-muted);
}
.ms-note b {
  color: var(--tw-ink);
}
@media (max-width: 900px) {
  .ms-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }
}
@media (max-width: 640px) {
  .st-app .ms-head h1 {
    font-size: 22px;
  }
  .ms-points,
  .ms-next {
    padding: 16px;
    border-radius: 18px;
  }
  .ms-points-num strong {
    font-size: 34px;
  }
  .ms-points-reward {
    padding: 8px 10px;
  }
  .ms-mission-link,
  .ms-tier,
  .ms-people-list li {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 11px 0;
  }
  .ms-mission-ic,
  .ms-tier-ic,
  .ms-avatar {
    width: 36px;
    height: 36px;
    border-radius: 11px;
  }
}
.ms .mission-panel {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.ms-points-reward b .money,
.ms-tier-main small .money {
  white-space: nowrap;
}

.sl {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 4px;
}
.sl-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}
.st-app .sl-head h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.sl-head p {
  max-width: 56ch;
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.sl-create {
  position: relative;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
  padding: 6px 6px 6px 8px;
  border-radius: 16px;
  background: var(--tw-paper-2);
}
.sl-create-ic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: var(--tw-muted);
}
.sl-create-ic svg,
.sl-btn svg,
.sl-thumb-fallback svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.st-app .sl-create input[type="url"] {
  min-height: 44px;
  padding: 0 8px;
  border: 0;
  background: transparent;
  font-size: 15px;
  color: var(--tw-ink);
  box-shadow: none;
}
.st-app .sl-create input[type="url"]:focus {
  outline: none;
}
.sl-create:focus-within {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tw-brand) 18%, transparent);
}
.sl-create .field-error {
  grid-column: 1 / -1;
  padding: 0 10px 4px;
  color: var(--tw-danger);
}
.sl-off {
  margin: 0;
  padding: 14px 16px;
  border-radius: 14px;
  background: var(--tw-paper-2);
  font-size: 14px;
  color: var(--tw-muted);
}
.sl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 12px;
  background: var(--tw-paper);
  color: var(--tw-ink);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s var(--tw-ease), filter .2s var(--tw-ease), background .2s var(--tw-ease);
}
.sl-btn:active {
  transform: scale(.985);
}
.sl-btn.is-primary {
  background: var(--tw-brand);
  color: #fff;
}
.sl-btn.is-primary:hover {
  filter: brightness(1.05);
}
.sl-btn.is-small {
  min-height: 36px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 13px;
  background: var(--tw-paper-2);
}
.sl-btn.is-small.is-primary {
  background: var(--tw-brand);
}
.sl-btn.is-icon {
  width: 36px;
  padding: 0;
  color: var(--tw-muted);
}
.sl-btn.is-icon:hover {
  color: var(--tw-danger);
  background: color-mix(in srgb, var(--tw-danger) 10%, transparent);
}
.sl-btn.is-copied {
  background: color-mix(in srgb, var(--tw-green) 16%, transparent);
  color: var(--tw-green);
}
.sl-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}
.sl-stats > div {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 16px;
  background: var(--tw-paper-2);
}
.sl-stats dt {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--tw-muted);
}
.sl-stats dd {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.sl-stats dd small {
  margin-left: 2px;
  font-size: 14px;
  font-weight: 600;
  color: var(--tw-muted);
}
.sl-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sl-list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sl-item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 16px;
  padding: 14px 4px;
  border-bottom: 1px solid var(--tw-line);
}
.sl-item:last-child {
  border-bottom: 0;
}
.sl-thumb {
  display: block;
  width: 64px;
  height: 64px;
  border-radius: 14px;
  overflow: hidden;
  background: var(--tw-paper-2);
}
.sl-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sl-thumb-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  color: var(--tw-muted);
}
.sl-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.sl-main > b {
  overflow: hidden;
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--tw-ink);
}
.sl-main > small {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 0;
  font-size: 12.5px;
  color: var(--tw-muted);
}
.sl-main > small > span:not(:last-child)::after {
  content: "·";
  margin: 0 6px;
  color: var(--tw-line-strong);
}
.sl-cash {
  color: var(--tw-green);
  font-weight: 600;
}
.sl-url {
  display: block;
  margin-top: 2px;
}
.st-app .sl-url input {
  width: 100%;
  min-height: 30px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: var(--tw-paper-2);
  font-size: 12.5px;
  color: var(--tw-ink-2);
  box-shadow: none;
  font-variant-numeric: tabular-nums;
}
.sl-metrics {
  display: flex;
  gap: 18px;
}
.sl-metrics > span {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  min-width: 48px;
}
.sl-metrics b {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.sl-metrics small {
  font-size: 11.5px;
  color: var(--tw-muted);
}
.sl-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.sl-actions form {
  display: contents;
}
@media (max-width: 900px) {
  .sl-item {
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 10px 12px;
    padding: 14px 0;
  }
  .sl-thumb {
    width: 56px;
    height: 56px;
    border-radius: 12px;
  }
  .sl-main > b {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
  .sl-url {
    display: none;
  }
  .sl-metrics {
    grid-column: 2;
    gap: 14px;
  }
  .sl-metrics > span {
    flex-direction: row;
    align-items: baseline;
    gap: 4px;
    min-width: 0;
  }
  .sl-metrics b {
    font-size: 15px;
  }
  .sl-actions {
    grid-column: 1 / -1;
  }
  .sl-actions .sl-btn:not(.is-icon) {
    flex: 1 1 0;
  }
  .sl-actions .sl-btn.is-icon {
    margin-left: auto;
  }
}
@media (max-width: 640px) {
  .st-app .sl-head h1 {
    font-size: 22px;
  }
  .sl-create {
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 6px;
  }
  .sl-create .sl-btn {
    grid-column: 1 / -1;
    width: 100%;
  }
  .sl-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sl-stats > div {
    padding: 12px 14px;
  }
  .sl-stats dd {
    font-size: 20px;
  }
}

.bk {
  display: flex;
  flex-direction: column;
  gap: 26px;
  max-width: 760px;
  margin-top: 12px;
}
.bk-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.bk-note {
  margin: 0;
  font-size: 13px;
  color: var(--tw-muted);
}
.bk-add {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.bk-add[hidden] {
  display: none;
}
.st-app .bk-form {
  display: grid;
  gap: 14px;
}
.st-app .bk-form label {
  display: grid;
  gap: 6px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--tw-ink-2);
}
.st-app .bk-form input:not([type="checkbox"]),
.st-app .bk-form select {
  width: 100%;
  min-height: 46px;
  border: 0;
  border-radius: 12px;
  background: var(--tw-paper);
  color: var(--tw-ink);
  box-shadow: none;
}
.st-app .bk-form input:focus,
.st-app .bk-form select:focus {
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tw-brand) 18%, transparent);
}
.st-app .bk-form small {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--tw-muted);
}
.st-app .bk-form .field-error {
  color: var(--tw-danger);
}
.st-app .bk-form .bank-disclaimer {
  margin: 0;
  font-size: 13px;
  color: var(--tw-ink-2);
}
.st-app .bk-form .bank-confirm-check {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  font-weight: 500;
}
.st-app .bk-add .security-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 12.5px;
  color: var(--tw-muted);
}
.st-app .bk-add .security-note p {
  margin: 0;
}
.st-app .bk-add .security-note svg {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}
@media (max-width: 640px) {
  .bk {
    margin-top: 6px;
    gap: 20px;
  }
  .bk-add {
    padding: 16px;
    border-radius: 18px;
  }
}

.wd-review {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 2px 0 0;
  padding: 4px 14px;
  border-radius: 14px;
  background: var(--tw-paper);
}
.wd-review[hidden] {
  display: none;
}
.wd-review > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--tw-line);
}
.wd-review > div:last-child {
  border-bottom: 0;
}
.wd-review dt {
  font-size: 13px;
  font-weight: 500;
  color: var(--tw-muted);
}
.wd-review dd {
  margin: 0;
  font-size: 13.5px;
  font-weight: 600;
  text-align: right;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.wd-review dd.is-free {
  color: var(--tw-green);
}
.wd-review dd.is-strong {
  font-size: 15px;
  font-weight: 700;
  color: var(--tw-brand);
}

.wd-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.wd-filters button {
  min-height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: var(--tw-paper-2);
  color: var(--tw-ink-2);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.wd-filters button.active {
  background: var(--tw-ink);
  color: var(--tw-paper);
}
.wd-row {
  position: relative;
}
.wd-row[hidden] {
  display: none;
}
.wd-row-link {
  position: absolute;
  inset: 0;
  border-radius: 12px;
}
.wd-row-link:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: -2px;
}
.wd-row:hover {
  background: color-mix(in srgb, var(--tw-ink) 3%, transparent);
}
.wd-filter-empty {
  font-size: 14px;
  color: var(--tw-muted);
}
.wdd {
  gap: 20px;
}
.wdd-head {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
}
.wdd-amount {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.wdd-sub {
  margin: 2px 0 0;
  font-size: 13.5px;
  color: var(--tw-muted);
}
.wdd-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 16px;
  border-radius: 16px;
  background: var(--tw-paper-2);
  list-style: none;
}
.wdd-steps li {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
}
.wdd-steps li::before {
  content: "";
  position: absolute;
  top: 13px;
  left: 28px;
  right: -8px;
  height: 2px;
  background: var(--tw-line);
}
.wdd-steps li.is-done::before {
  background: var(--tw-green);
}
.wdd-steps li:last-child::before {
  display: none;
}
.wdd-steps li > span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--tw-paper);
  color: var(--tw-muted);
  font-size: 12px;
  font-weight: 700;
}
.wdd-steps li > span svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wdd-steps li.is-done > span {
  background: var(--tw-green);
  color: #fff;
}
.wdd-steps li.is-current > span {
  background: var(--tw-brand);
  color: #fff;
}
.wdd-steps li b {
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-ink);
}
.wdd-steps li small {
  font-size: 11.5px;
  line-height: 1.4;
  color: var(--tw-muted);
}
.wdd-fail {
  padding: 14px 16px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--tw-danger) 8%, var(--tw-paper));
}
.wdd-fail b {
  display: block;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--tw-danger);
}
.wdd-fail p {
  margin: 4px 0 0;
  font-size: 13.5px;
  color: var(--tw-ink-2);
}
.wdd .wc-btn {
  align-self: flex-start;
}
@media (max-width: 640px) {
  .wdd-steps {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 14px;
  }
  .wdd-steps li {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 2px 12px;
  }
  .wdd-steps li > span {
    grid-row: span 2;
  }
  .wdd-steps li::before {
    top: 28px;
    bottom: -16px;
    left: 12px;
    right: auto;
    width: 2px;
    height: auto;
  }
}

.rf {
  display: flex;
  flex-direction: column;
  gap: 22px;
  margin-top: 4px;
}
.rf-head p {
  max-width: 60ch;
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.st-app .rf-head h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.rf-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: stretch;
}
.rf-code {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 20px;
  border-radius: 20px;
  background: var(--tw-paper-2);
}
.st-app .rf-code-value {
  margin: 0;
  font-size: 34px;
  font-weight: 700;
  letter-spacing: .08em;
  color: var(--tw-brand);
  font-variant-numeric: tabular-nums;
}
.rf-link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.st-app .rf-link input {
  flex: 1 1 220px;
  min-width: 0;
  min-height: 36px;
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  background: var(--tw-paper);
  font-size: 13px;
  color: var(--tw-ink-2);
  box-shadow: none;
}
.rf-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  font-size: 13px;
  color: var(--tw-ink-2);
}
.rf-steps li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.rf-steps li span {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--tw-paper);
  font-size: 11.5px;
  font-weight: 700;
  color: var(--tw-brand);
}
.rf-qr {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 200px;
  padding: 18px;
  border-radius: 20px;
  background: var(--tw-paper-2);
  text-align: center;
}
.rf-qr img {
  display: block;
  width: 132px;
  height: 132px;
  padding: 6px;
  border-radius: 12px;
  background: #fff;
}
.rf-qr b {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--tw-muted);
}
.rf-stats dd.is-money {
  font-size: 20px;
}
.rf-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.rf-search {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 360px;
  padding: 0 12px;
  border-radius: 12px;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
}
.rf-search svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.st-app .rf-search input {
  flex: 1;
  min-width: 0;
  min-height: 40px;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 14px;
  color: var(--tw-ink);
}
.st-app .rf-search input:focus {
  outline: none;
}
.rf-list {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  list-style: none;
}
.rf-row {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 4px;
  border-bottom: 1px solid var(--tw-line);
}
.rf-row:last-child {
  border-bottom: 0;
}
.rf-row[hidden] {
  display: none;
}
.rf-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--tw-paper-2);
  font-size: 16px;
  font-weight: 700;
  color: var(--tw-ink-2);
}
.rf-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rf-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.rf-main > b {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14.5px;
  font-weight: 600;
  color: var(--tw-ink);
}
.rf-main > small {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.rf-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
}
.rf-side > b {
  font-size: 15px;
  font-weight: 700;
  color: var(--tw-green);
  font-variant-numeric: tabular-nums;
}
.rf-side > small {
  font-size: 11.5px;
  color: var(--tw-muted);
}
.rf-side .status-badge {
  font-size: 11px;
  padding: 3px 9px;
}
.rf-search-empty {
  font-size: 14px;
  color: var(--tw-muted);
}
@media (max-width: 760px) {
  .rf-grid {
    grid-template-columns: 1fr;
  }
  .rf-qr {
    flex-direction: row;
    justify-content: flex-start;
    text-align: left;
    gap: 14px;
    padding: 14px;
  }
  .rf-qr img {
    width: 96px;
    height: 96px;
  }
  .rf-qr b {
    flex: 1;
  }
}
@media (max-width: 640px) {
  .st-app .rf-head h1 {
    font-size: 22px;
  }
  .rf-code {
    padding: 16px;
    border-radius: 18px;
  }
  .st-app .rf-code-value {
    font-size: 28px;
  }
  .rf-link .sl-btn {
    flex: 1 1 0;
  }
  .rf-steps {
    flex-direction: column;
    gap: 6px;
  }
  .rf-row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 12px 0;
  }
  .rf-avatar {
    width: 40px;
    height: 40px;
  }
  .rf-search {
    max-width: none;
  }
}

.pf-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 24px 40px;
  align-items: start;
  margin-top: 8px;
}
.pf-nav {
  position: sticky;
  top: 96px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.pf-nav button,
.pf-nav a {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--tw-ink-2);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s var(--tw-ease), color .15s var(--tw-ease);
}
.pf-nav button:hover,
.pf-nav a:hover {
  background: var(--tw-paper-2);
}
.pf-nav button.active {
  background: var(--tw-paper-2);
  color: var(--tw-ink);
}
.pf-nav svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.pf-nav span {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.pf-nav small {
  padding: 1px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tw-ink) 7%, transparent);
  font-size: 11.5px;
  color: var(--tw-muted);
}
.pf-nav a {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--tw-line);
  border-radius: 0 0 12px 12px;
}
.pf-panels {
  min-width: 0;
  max-width: 640px;
}
.pf-panel {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.pf-panel[hidden] {
  display: none;
}
.st-app .pf-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px;
  border: 0;
  border-radius: 20px;
  background: var(--tw-paper-2);
  box-shadow: none;
}
.st-app .pf-card h3 {
  margin: 0;
  font-size: 15.5px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--tw-ink);
}
.st-app .pf-card .stack-form input:not([type="checkbox"]),
.st-app .pf-card .stack-form select,
.st-app .pf-card .referrer-enter-row input {
  border: 0;
  border-radius: 12px;
  background: var(--tw-paper);
  box-shadow: none;
}
.st-app .pf-card .danger-zone {
  padding: 14px;
  border: 0;
  border-radius: 14px;
  background: var(--tw-paper);
}
@media (max-width: 900px) {
  .pf-layout {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .pf-nav {
    position: static;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 6px;
    margin: 0 -16px;
    padding: 0 16px 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .pf-nav::-webkit-scrollbar {
    display: none;
  }
  .pf-nav button,
  .pf-nav a {
    width: auto;
    min-height: 36px;
    padding: 0 12px;
    border: 0;
    border-radius: 999px;
    background: var(--tw-paper-2);
    font-size: 13px;
    white-space: nowrap;
  }
  .pf-nav a {
    margin-top: 0;
    padding-top: 0;
  }
  .pf-nav button.active {
    background: var(--tw-ink);
    color: var(--tw-paper);
  }
  .pf-nav button.active small {
    background: rgba(255, 255, 255, .2);
    color: inherit;
  }
  .pf-panels {
    max-width: none;
  }
  .st-app .pf-card {
    padding: 16px;
    border-radius: 18px;
  }
}

.mb-feature-search {
  max-width: 420px;
  margin: 0 0 4px;
}
.mb-feature-empty {
  font-size: 14px;
  color: var(--tw-muted);
}
.mb-linkrow[hidden],
.mb-panel[hidden] {
  display: none;
}

.st-app .support-chatbar .support-attach-btn {
  width: 38px;
  height: 38px;
  margin-bottom: 2px;
  border-radius: 12px;
  background: var(--tw-paper-2);
  color: var(--tw-ink-2);
}
.st-app .support-chatbar .support-attach-btn:hover {
  color: var(--tw-brand);
}
.st-app .support-chatbar .support-attach-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.support-attach-chip {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 8px;
  padding: 6px 8px 6px 6px;
  border-radius: 12px;
  background: var(--tw-paper-2);
  font-size: 12.5px;
  color: var(--tw-ink-2);
}
.support-attach-chip[hidden] {
  display: none;
}
.support-attach-chip img {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  object-fit: cover;
  background: var(--tw-paper);
}
.support-attach-chip span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.support-attach-chip button {
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 50%;
  background: var(--tw-paper);
  color: var(--tw-muted);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.support-msg-image {
  display: block;
  max-width: 240px;
  margin: 4px 0 6px;
  border-radius: 12px;
  overflow: hidden;
  background: var(--tw-paper-2);
}
.support-msg-image img {
  display: block;
  width: 100%;
  height: auto;
}

.kol-wizard {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 8px;
  padding: 0;
  list-style: none;
}
.kol-wizard li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--tw-muted);
  font-size: 13px;
  font-weight: 600;
}
.kol-wizard li > span {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border-radius: 50%;
  background: var(--tw-paper-2);
  font-size: 12px;
  font-weight: 700;
}
.kol-wizard li.is-current {
  color: var(--tw-ink);
}
.kol-wizard li.is-current > span {
  background: var(--tw-brand);
  color: #fff;
}
.kol-wizard li.is-done {
  color: var(--tw-ink-2);
  cursor: pointer;
}
.kol-wizard li.is-done > span {
  background: var(--tw-green);
  color: #fff;
}
.kol-wizard li b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: inherit;
}
.kol-progress {
  height: 6px;
  margin: 0 0 18px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tw-ink) 8%, transparent);
  overflow: hidden;
}
.kol-progress span {
  display: block;
  width: 33%;
  height: 100%;
  border-radius: inherit;
  background: var(--tw-brand);
  transition: width .4s var(--tw-ease);
}
.kol-step-error {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--tw-danger) 8%, var(--tw-paper));
  color: var(--tw-danger);
  font-size: 13.5px;
}
.kol-step-error[hidden] {
  display: none;
}
.kol-form .is-invalid,
.kol-form input.is-invalid,
.kol-form select.is-invalid {
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--tw-danger) 45%, transparent) !important;
}
.kol-form .kol-upload.is-invalid .kol-upload-box {
  outline: 2px solid color-mix(in srgb, var(--tw-danger) 45%, transparent);
}
.kol-card[hidden] {
  display: none;
}
.kol-submit-bar [hidden] {
  display: none;
}
@media (max-width: 640px) {
  .kol-wizard li b {
    font-size: 12px;
  }
}

.wdash {
  display: none;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}
@media (min-width: 1024px) {
  .wdash {
    display: flex;
  }
  .wc > .wc-main {
    display: none;
  }
}
.wdash-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.st-app .wdash-head h1 {
  margin: 0;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--tw-ink);
}
.wdash-head p {
  margin: 4px 0 0;
  font-size: 14.5px;
  color: var(--tw-muted);
}
.wdash-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--tw-line);
}
.wdash-tabs a {
  position: relative;
  padding: 10px 14px;
  color: var(--tw-ink-2);
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
}
.wdash-tabs a::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: -1px;
  height: 2px;
  background: transparent;
}
.wdash-tabs a:hover {
  color: var(--tw-ink);
}
.wdash-tabs a.active {
  color: var(--tw-brand);
}
.wdash-tabs a.active::after {
  background: var(--tw-brand);
}
.wdash-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 22px 24px;
  border: 1px solid var(--tw-line);
  border-radius: 16px;
  background: var(--tw-paper);
  box-shadow: 0 1px 2px rgba(43, 33, 28, .04);
}
.wdash-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.st-app .wdash-card-title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--tw-ink);
}
.wdash-card-title.is-accent {
  padding-left: 12px;
  border-left: 3px solid var(--tw-brand);
  font-size: 15px;
}
.wdash-top {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 20px;
  align-items: stretch;
}
.wdash-balance {
  gap: 10px;
}
.st-app .wdash-amount {
  margin: 2px 0 0;
  font-size: 44px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.03em;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.st-app .wdash-amount .money small {
  font-size: .4em;
  margin-left: 6px;
}
.wdash-meta {
  margin: 0;
  font-size: 14px;
  color: var(--tw-ink-2);
}
.wdash-meta b {
  font-weight: 600;
  color: var(--tw-ink);
}
.wdash-meta.is-warn {
  color: var(--tw-brand);
}
.wdash-meta.is-warn b {
  color: var(--tw-brand);
}
.wdash-meta.is-ok {
  color: var(--tw-green);
}
.wdash-actions {
  display: flex;
  gap: 12px;
  margin-top: 6px;
}
.wdash-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font: inherit;
  font-size: 14.5px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background .15s var(--tw-ease), color .15s var(--tw-ease), border-color .15s var(--tw-ease);
}
.wdash-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wdash-btn.is-primary {
  background: var(--tw-brand);
  color: #fff;
}
.wdash-btn.is-primary:hover {
  filter: brightness(1.05);
}
.wdash-btn.is-primary:disabled {
  background: color-mix(in srgb, var(--tw-ink) 10%, var(--tw-paper));
  color: var(--tw-muted);
  cursor: not-allowed;
}
.wdash-btn.is-ghost {
  border-color: var(--tw-line-strong);
  background: var(--tw-paper);
}
.wdash-btn.is-ghost:hover {
  background: var(--tw-paper-2);
}
.wdash-btn.is-outline {
  min-height: 38px;
  padding: 0 14px;
  border-color: var(--tw-brand);
  background: var(--tw-paper);
  color: var(--tw-brand);
  font-size: 13.5px;
}
.wdash-btn.is-outline:hover {
  background: color-mix(in srgb, var(--tw-brand) 8%, var(--tw-paper));
}
.wdash-btn:focus-visible,
.wdash-tabs a:focus-visible,
.wdash-segment button:focus-visible,
.wdash-pager button:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: 2px;
}
.wdash-actions .wdash-btn {
  flex: 1 1 0;
}
.wdash-receiver-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wdash-receiver {
  display: grid;
  grid-template-columns: 20px 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid var(--tw-line);
  border-radius: 12px;
  cursor: pointer;
  transition: border-color .15s var(--tw-ease), background .15s var(--tw-ease);
}
.wdash-receiver:hover {
  background: var(--tw-paper-2);
}
.wdash-receiver.is-selected {
  border-color: var(--tw-brand);
  background: color-mix(in srgb, var(--tw-brand) 4%, var(--tw-paper));
}
.st-app .wdash-receiver input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--tw-brand);
}
.wdash-bank-logo {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
}
.wdash-bank-logo.is-lg {
  width: 56px;
  height: 56px;
  font-size: 14px;
}
.wdash-receiver-main,
.wdash-bank-main {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wdash-receiver-main b,
.wdash-bank-main b {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--tw-ink);
}
.wdash-receiver-main small,
.wdash-bank-main small {
  font-size: 12.5px;
  color: var(--tw-muted);
  font-variant-numeric: tabular-nums;
}
.wdash-receiver-main small.is-holder,
.wdash-bank-main small.is-holder {
  letter-spacing: .02em;
  color: var(--tw-ink-2);
}
.wdash-receiver-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}
.wdash-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--tw-ink) 7%, transparent);
  color: var(--tw-ink-2);
  font-size: 11.5px;
  font-weight: 600;
  white-space: nowrap;
}
.wdash-pill svg,
.wdash-state svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wdash-pill.is-ok {
  background: color-mix(in srgb, var(--tw-green) 14%, transparent);
  color: var(--tw-green);
}
.wdash-pill.is-bad {
  background: color-mix(in srgb, var(--tw-danger) 11%, transparent);
  color: var(--tw-danger);
}
.wdash-pill.is-wait {
  background: color-mix(in srgb, var(--tw-amber) 16%, transparent);
  color: var(--tw-amber);
}
.wdash-pill.is-default {
  background: color-mix(in srgb, var(--tw-brand) 12%, transparent);
  color: var(--tw-brand);
}
.wdash-receiver-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
}
.wdash-link {
  font-size: 14px;
  font-weight: 600;
  color: var(--tw-brand);
  text-decoration: none;
}
.wdash-link[hidden] {
  display: none;
}
.wdash-link:hover {
  text-decoration: underline;
}
.wdash-empty {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border-radius: 12px;
  background: var(--tw-paper-2);
}
.wdash-empty p {
  margin: 0;
  font-size: 14px;
  color: var(--tw-muted);
}
.wdash-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
}
.wdash-metrics > div {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  border: 1px solid var(--tw-line);
  border-radius: 16px;
  background: var(--tw-paper);
}
.wdash-metrics dt {
  font-size: 13px;
  font-weight: 500;
  color: var(--tw-muted);
}
.wdash-metrics dd {
  margin: 2px 0 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--tw-ink);
  font-variant-numeric: tabular-nums;
}
.wdash-metric-ic {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border-radius: 50%;
  background: var(--tw-paper-2);
  color: var(--tw-ink-2);
}
.wdash-metric-ic svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wdash-metric-ic.is-amber {
  background: color-mix(in srgb, var(--tw-amber) 16%, var(--tw-paper));
  color: var(--tw-amber);
}
.wdash-metric-ic.is-blue {
  background: color-mix(in srgb, #2b6cb0 14%, var(--tw-paper));
  color: #2b6cb0;
}
.wdash-metric-ic.is-green {
  background: color-mix(in srgb, var(--tw-green) 14%, var(--tw-paper));
  color: var(--tw-green);
}
.wdash-metric-ic.is-brand {
  background: color-mix(in srgb, var(--tw-brand) 12%, var(--tw-paper));
  color: var(--tw-brand);
}
.wdash-note {
  margin: -10px 0 0;
  font-size: 12.5px;
  color: var(--tw-muted);
}
.wdash-card-head .wdash-note {
  margin: 0;
}
.wdash-bank-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.wdash-bank {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-height: 150px;
  padding: 18px;
  border: 1px solid var(--tw-line);
  border-radius: 14px;
  background: var(--tw-paper-2);
  color: inherit;
  text-decoration: none;
}
.wdash-bank {
  background: var(--tw-paper);
}
.wdash-bank.is-primary {
  border-color: color-mix(in srgb, var(--tw-brand) 45%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--tw-brand) 25%, transparent);
}
.wdash-bank.is-empty,
.wdash-bank.is-more {
  justify-content: center;
  align-items: center;
  text-align: center;
  border-style: dashed;
  background: transparent;
}
.wdash-bank.is-more b,
.wdash-bank.is-empty b {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--tw-ink);
}
.wdash-bank.is-more small,
.wdash-bank.is-empty small {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.wdash-bank-top {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
}
.wdash-bank-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: auto;
}
.wdash-menu {
  position: relative;
}
.wdash-menu summary {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  color: inherit;
  cursor: pointer;
  list-style: none;
}
.wdash-menu summary::-webkit-details-marker {
  display: none;
}
.wdash-menu summary svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.wdash-menu summary:hover {
  background: rgba(127, 127, 127, .15);
}
.wdash-menu-panel {
  position: absolute;
  top: 36px;
  right: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  min-width: 190px;
  padding: 6px;
  border: 1px solid var(--tw-line);
  border-radius: 12px;
  background: var(--tw-paper);
  box-shadow: 0 12px 30px -14px rgba(43, 33, 28, .35);
}
.wdash-menu-panel a,
.wdash-menu-panel button {
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--tw-ink);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.wdash-menu-panel a:hover,
.wdash-menu-panel button:hover {
  background: var(--tw-paper-2);
}
.wdash-menu-panel button.is-danger {
  color: var(--tw-danger);
}
.wdash-menu-panel form {
  margin: 0;
}
.wdash-mission {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  border: 1px solid color-mix(in srgb, var(--tw-brand) 25%, transparent);
  border-radius: 14px;
  background: color-mix(in srgb, var(--tw-brand) 6%, var(--tw-paper));
}
.wdash-mission-head {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}
.wdash-mission-head b {
  font-size: 14.5px;
  font-weight: 700;
  color: var(--tw-ink);
}
.wdash-mission-head p {
  margin: 2px 0 0;
  font-size: 13px;
  color: var(--tw-muted);
}
.wdash-mission-head p strong {
  font-size: 18px;
  font-weight: 700;
  color: var(--tw-brand);
}
.wdash-mission-reward {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.wdash-mission-reward small {
  font-size: 11.5px;
  color: var(--tw-muted);
}
.wdash-mission-reward b {
  font-size: 15px;
  font-weight: 700;
  color: var(--tw-brand);
}
.wdash-mission .wdash-btn {
  width: 100%;
}
.wdash-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 340px) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
}
.wdash-search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid var(--tw-line);
  border-radius: 10px;
  background: var(--tw-paper);
  color: var(--tw-muted);
}
.wdash-search svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
}
.st-app .wdash-search input {
  flex: 1;
  min-width: 0;
  min-height: 38px;
  border: 0;
  background: transparent;
  box-shadow: none;
  font-size: 14px;
  color: var(--tw-ink);
}
.st-app .wdash-search input:focus {
  outline: none;
}
.wdash-search:focus-within {
  border-color: var(--tw-brand);
}
.wdash-segment {
  display: inline-flex;
  gap: 6px;
}
.wdash-segment button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--tw-line);
  border-radius: 999px;
  background: var(--tw-paper);
  color: var(--tw-ink-2);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
}
.wdash-segment button.active {
  border-color: var(--tw-brand);
  background: var(--tw-brand);
  color: #fff;
}
.wdash-range {
  justify-self: end;
}
.st-app .wdash-range select {
  min-height: 38px;
  padding: 0 32px 0 12px;
  border: 1px solid var(--tw-line);
  border-radius: 10px;
  background: var(--tw-paper);
  font-size: 13.5px;
  font-weight: 600;
  color: var(--tw-ink);
  box-shadow: none;
}
.wdash-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--tw-line);
  border-radius: 12px;
}
.wdash-table {
  width: 100%;
  border-collapse: collapse;
}
.wdash-table th {
  padding: 11px 14px;
  background: var(--tw-paper-2);
  font-size: 12.5px;
  font-weight: 600;
  text-align: left;
  color: var(--tw-muted);
}
.wdash-table td {
  padding: 12px 14px;
  border-top: 1px solid var(--tw-line);
  font-size: 13.5px;
  color: var(--tw-ink);
  vertical-align: middle;
}
.wdash-table tr[hidden] {
  display: none;
}
.wdash-table .is-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.wdash-td-time {
  white-space: nowrap;
  color: var(--tw-ink-2);
  font-variant-numeric: tabular-nums;
}
.wdash-td-main {
  max-width: 420px;
}
.wdash-td-main b {
  display: -webkit-box;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.wdash-td-main small {
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  color: var(--tw-muted);
}
.wdash-table td.is-num b {
  font-size: 14.5px;
  font-weight: 700;
  white-space: nowrap;
}
.wdash-table td.is-num b.is-in {
  color: var(--tw-green);
}
.wdash-table td.is-num b.is-out {
  color: var(--tw-danger);
}
.wdash-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.wdash-state.is-ok {
  color: var(--tw-green);
}
.wdash-state.is-wait {
  color: var(--tw-amber);
}
.wdash-state svg {
  width: 16px;
  height: 16px;
  stroke-width: 2;
}
.wdash-empty-rows {
  margin: 0;
  padding: 18px;
  border-radius: 12px;
  background: var(--tw-paper-2);
  font-size: 14px;
  color: var(--tw-muted);
}
.wdash-empty-rows[hidden] {
  display: none;
}
.wdash-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.wdash-pager .wdash-note {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
.st-app .wdash-pager select {
  min-height: 32px;
  padding: 0 26px 0 10px;
  border: 1px solid var(--tw-line);
  border-radius: 8px;
  background: var(--tw-paper);
  font-size: 13px;
  font-weight: 600;
  color: var(--tw-ink);
  box-shadow: none;
}
.wdash-pager-nav {
  display: inline-flex;
  gap: 4px;
}
.wdash-pager-nav button {
  min-width: 34px;
  height: 34px;
  padding: 0 8px;
  border: 1px solid var(--tw-line);
  border-radius: 8px;
  background: var(--tw-paper);
  color: var(--tw-ink);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}
.wdash-pager-nav button.active {
  border-color: var(--tw-brand);
  background: var(--tw-brand);
  color: #fff;
}
.wdash-pager-nav button:disabled {
  opacity: .4;
  cursor: not-allowed;
}
@media (max-width: 1200px) {
  .wdash-top {
    grid-template-columns: 1fr;
  }
  .wdash-balance {
    min-height: 0;
  }
  .wdash-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .wdash-bank-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .wdash-toolbar {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .wdash-range {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

.wdash-bank-logo {
  position: relative;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--tw-line);
}
.wdash-bank-logo img {
  position: absolute;
  inset: 4px;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  object-fit: contain;
  background: #fff;
}
.wdash-bank-logo i {
  font-style: normal;
}
.wdash-receiver-list .wdash-receiver.is-alt {
  display: none;
}
.wdash-receiver-list.is-open .wdash-receiver.is-alt {
  display: grid;
}
.wdash-receiver-list.is-open .wdash-receiver input[type="radio"] {
  display: inline-block;
}
.wdash-link.is-btn {
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}
.wdash-td-go {
  width: 36px;
  padding-left: 0 !important;
}
.wdash-td-go a {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 8px;
  color: var(--tw-muted);
}
.wdash-td-go a:hover {
  background: var(--tw-paper-2);
  color: var(--tw-ink);
}
.wdash-td-go svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wdash-table tbody tr:hover td {
  background: color-mix(in srgb, var(--tw-ink) 2.5%, transparent);
}
.wdd-amount.is-in {
  color: var(--tw-green);
}
.wdd-amount.is-out {
  color: var(--tw-danger);
}
.wdd-full {
  padding: 14px 16px;
  border-radius: 14px;
  background: var(--tw-paper-2);
}
.wdd-full b {
  display: block;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--tw-muted);
}
.wdd-full p {
  margin: 6px 0 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tw-ink);
  overflow-wrap: anywhere;
}

.wc-balance-label {
  display: flex;
  align-items: center;
  gap: 8px;
}
.wc-eye {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--tw-muted);
  cursor: pointer;
}
.wc-eye svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wc-eye svg[hidden] {
  display: none;
}
.wc-balance-amount[hidden] {
  display: none;
}
.wc-progress {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 2px 0 4px;
}
.wc-progress .ms-bar {
  height: 8px;
  background: color-mix(in srgb, var(--tw-ink) 10%, transparent);
}
.wc-progress .ms-bar > span {
  background: linear-gradient(90deg, var(--tw-brand), #f3b63f);
}
.wc-progress small {
  font-size: 12px;
  color: var(--tw-muted);
}
.wc-gift {
  display: none;
  position: absolute;
  right: 10px;
  bottom: -6px;
  width: 112px;
  height: 112px;
  pointer-events: none;
}
.wc-flow > div {
  position: relative;
}
.wc-flow-link {
  position: absolute;
  inset: 0;
  border-radius: inherit;
}
.wc-flow-link:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: -2px;
}
.wc-flow > div::after {
  content: "";
  position: absolute;
  right: 12px;
  bottom: 14px;
  width: 7px;
  height: 7px;
  border-right: 1.8px solid var(--tw-muted);
  border-bottom: 1.8px solid var(--tw-muted);
  transform: rotate(-45deg);
  pointer-events: none;
}
@media (max-width: 760px) {
  .wc-promo {
    position: relative;
    min-height: 150px;
    padding-right: 120px;
  }
  .wc-promo .wc-promo-text {
    position: relative;
    z-index: 1;
  }
}
.wc-gift * {
  stroke: none;
}
.wc-gift .g-box { fill: url(#wcg-box); }
.wc-gift .g-lid { fill: #1c1c20; }
.wc-gift .g-rib { fill: url(#wcg-rib); }
.wc-gift .g-lid-glow { fill: #f3b63f; opacity: .18; }
.wc-gift .g-knot { fill: #ffe3a3; }
.wc-gift .g-spark { fill: #ffd27a; }
.wc-gift .g-spark.is-soft { opacity: .8; }

.mb-only {
  display: none;
}
@media (max-width: 760px) {
  .mb-only {
    display: block;
  }
  .st-app .mb-profile-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
  }
  .st-app .mb-profile-stats > * {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px;
    border-radius: 16px;
  }
  .st-app .mb-profile-stats > * > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    opacity: .9;
  }
  .st-app .mb-profile-stats > * > span svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .st-app .mb-profile-stats > * > b {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -.01em;
    font-variant-numeric: tabular-nums;
  }
  .st-app .mb-profile-stats > .is-avail > b,
  .st-app .mb-profile-stats > .is-avail .money small {
    color: var(--lx-orange-2, #ff8a5f);
  }
  .st-app .mb-refblock .mb-panel-title {
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }
  .st-app .mb-refblock .mb-panel-title svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: var(--lx-champagne, #f3b63f);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .mb-ref-guide {
    padding: 6px 12px;
    border-radius: 999px;
    background: var(--tw-paper-2);
    font-size: 12.5px;
    font-weight: 600;
    color: var(--tw-ink);
    text-decoration: none;
  }
  .mb-ref-sub {
    margin: 0 0 12px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--tw-muted);
  }
  .mb-ref-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px;
    gap: 10px;
    margin-bottom: 10px;
  }
  .mb-ref-row:last-child {
    margin-bottom: 0;
  }
  .mb-ref-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    padding: 10px 14px;
    border: 1px solid var(--tw-line);
    border-radius: 14px;
    background: var(--tw-paper-2);
  }
  .mb-ref-field small {
    font-size: 12px;
    color: var(--tw-muted);
  }
  .st-app .mb-ref-field input {
    min-height: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    font-size: 16px;
    font-weight: 600;
    color: var(--tw-ink);
    text-overflow: ellipsis;
  }
  .mb-ref-copy {
    display: grid;
    place-items: center;
    border: 1px solid var(--tw-line);
    border-radius: 14px;
    background: var(--tw-paper-2);
    color: var(--lx-champagne, #f3b63f);
    cursor: pointer;
  }
  .mb-ref-copy svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .mb-ref-copy.is-copied {
    color: var(--tw-green);
  }
  .mb-gift {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px 18px;
    border: 1px solid transparent;
    border-radius: 22px;
    background: linear-gradient(135deg, var(--tw-brand) 0%, #ff8a5f 100%);
    color: #fff;
    overflow: hidden;
  }
  .mb-gift::before {
    content: "";
    position: absolute;
    right: -30%;
    top: -40%;
    width: 80%;
    height: 120%;
    background: radial-gradient(closest-side, rgba(255, 255, 255, .28), transparent 70%);
    pointer-events: none;
  }
  .mb-gift-head {
    position: relative;
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 14px;
  }
  .mb-gift-ic {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .2);
    color: #fff;
  }
  .mb-gift-ic svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .mb-gift-head b {
    display: block;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.01em;
  }
  .mb-gift-head small {
    display: block;
    font-size: 13.5px;
    color: rgba(255, 255, 255, .72);
  }
  .mb-gift-amount {
    margin: 4px 0 0;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -.02em;
    color: #fff;
  }
  .mb-gift-amount .money small {
    font-size: .5em;
    color: inherit;
  }
  .mb-gift-note {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: rgba(255, 255, 255, .72);
  }
  .mb-gift-qr {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    width: min(100%, 240px);
    margin: 0 auto;
    padding: 16px 16px 14px;
    border-radius: 18px;
    background: #fff;
    color: #1d1512;
    text-align: center;
  }
  .mb-gift-qr img {
    display: block;
    width: 150px;
    height: 150px;
  }
  .mb-gift-qr b {
    margin-top: 6px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .02em;
  }
  .mb-gift-qr small {
    font-size: 12px;
    color: #6b5b50;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-gift-amount {
    font-size: 34px;
    line-height: 1.05;
  }
  .st-app .st-content .mb-gift-amount .money small {
    font-size: 15px;
  }
  .st-app .st-content .mb-profile-stats > * > b,
  .st-app .st-content .mb-profile-stats > * > b .money {
    font-size: 22px;
  }
  .st-app .st-content .mb-profile-stats > * > b .money small {
    font-size: 12px;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-gift-amount .money,
  .st-app .st-content .mb-gift-amount .money small {
    display: inline;
    white-space: nowrap;
  }
}

@media (max-width: 760px) {
  .st-app .px-main {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
  .px-bottomnav a,
  .px-bottomnav button {
    position: relative;
  }
  .px-bottomnav a.active::before,
  .px-bottomnav a[aria-current="page"]::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 50%;
    width: 36px;
    height: 3px;
    border-radius: 0 0 3px 3px;
    background: var(--tw-brand);
    transform: translateX(-50%);
  }
  .st-content .wc-promo .wc-card-art {
    display: none;
  }
  .st-content .wc-promo .wc-gift {
    display: block;
  }
  .st-content .wc-promo::before {
    content: "";
    position: absolute;
    right: -20%;
    top: -40%;
    width: 70%;
    height: 180%;
    background: radial-gradient(closest-side, rgba(255, 220, 120, .45), transparent 70%);
    pointer-events: none;
  }
  .st-content .wc-promo {
    background: linear-gradient(120deg, var(--tw-brand) 0%, #ff7a4a 55%, #ff9a5c 100%);
  }
  .st-content em {
    font-style: normal;
  }
  .blob-fab {
    transform: scale(.86);
    transform-origin: bottom right;
  }
  .st-content .mb-profile-stats > .is-avail {
    background: linear-gradient(135deg, rgba(255, 106, 61, .18), rgba(255, 106, 61, .06));
    border: 1px solid rgba(255, 106, 61, .3);
  }
  .st-content .mb-profile-stats > .is-pending {
    border: 1px solid var(--tw-line);
    background: color-mix(in srgb, var(--tw-ink) 4%, transparent);
  }
}

.wc-card.bank-vcb, .wc-stack-card.bank-vcb { background: linear-gradient(135deg, #0a5c36, #0f8a4f 60%, #37b36f); color: #f3fff7; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-tcb, .wc-stack-card.bank-tcb { background: linear-gradient(135deg, #8d0d14, #d6121b 60%, #f04a4a); color: #fff5f5; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-mb, .wc-stack-card.bank-mb { background: linear-gradient(135deg, #10184a, #1f2a7a 55%, #2f3fa8); color: #eef1ff; --wc-blob-a: rgba(255, 255, 255, .16); --wc-blob-b: rgba(226, 37, 48, .35); }
.wc-card.bank-acb, .wc-stack-card.bank-acb { background: linear-gradient(135deg, #0a3e78, #0d5fb0 60%, #2f86d6); color: #eef6ff; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-vpb, .wc-stack-card.bank-vpb { background: linear-gradient(135deg, #0d6b3a, #00a651 60%, #3fc27a); color: #f1fff6; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-bidv, .wc-stack-card.bank-bidv { background: linear-gradient(135deg, #0f6f6c, #00a19c 60%, #3dc4bf); color: #f0fffe; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-vtb, .wc-stack-card.bank-vtb { background: linear-gradient(135deg, #06345f, #0a4a8a 60%, #2f74b8); color: #eef6ff; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-tpb, .wc-stack-card.bank-tpb { background: linear-gradient(135deg, #3b1a5e, #5c2d91 60%, #8a57c6); color: #f6f0ff; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card.bank-stb, .wc-stack-card.bank-stb { background: linear-gradient(135deg, #0a4a7a, #0a6eb4 60%, #3b94d6); color: #eef7ff; --wc-blob-a: rgba(255, 255, 255, .18); --wc-blob-b: rgba(0, 0, 0, .18); }
.wc-card-brand.is-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 44px;
  height: 32px;
  padding: 0 6px;
  border-radius: 9px;
  background: #fff;
  color: #2b211c;
  font-size: 11px;
  font-weight: 800;
  overflow: hidden;
}
.wc-card-brand.is-logo img {
  display: block;
  height: 22px;
  width: auto;
  max-width: 72px;
  object-fit: contain;
}
.wc-card-brand.is-logo img + i {
  display: none;
}
.wc-card-brand.is-logo i {
  font-style: normal;
}
.wc-card.is-pending {
  filter: none;
  opacity: .82;
}
.st-app .st-content svg[viewBox="0 0 24 24"]:not(.wc-card-art):not(.wc-gift),
.st-app .px-header svg[viewBox="0 0 24 24"],
.st-app .px-bottomnav svg[viewBox="0 0 24 24"] {
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 760px) {
  .st-app .st-content .mb-profile-stats > * > span {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .st-app .st-content .mb-profile-stats > * > b,
  .st-app .st-content .mb-profile-stats > * > b .money {
    white-space: nowrap;
  }
  .st-app .st-content .mb-profile-stats > * {
    min-width: 0;
    padding: 12px;
  }
}
@media (max-width: 380px) {
  .st-app .st-content .mb-profile-stats > * > b,
  .st-app .st-content .mb-profile-stats > * > b .money {
    font-size: 19px;
  }
  .st-app .st-content .mb-profile-stats > * > span {
    font-size: 12.5px;
  }
}
@media (max-width: 400px) {
  .st-app .st-content .wc-actions .wc-btn {
    padding: 0 10px;
    font-size: 13.5px;
    white-space: nowrap;
  }
  .st-app .st-content .wc-actions .wc-btn svg {
    width: 16px;
    height: 16px;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .wc-balance {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(243, 182, 63, .22);
    background: #0f0e0d url("/assets/images/bg-sodu.webp") right center / cover no-repeat;
    color: #fff;
  }
  .st-app .st-content .wc-balance::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(13, 12, 11, .92) 0%, rgba(13, 12, 11, .78) 48%, rgba(13, 12, 11, .15) 100%);
    pointer-events: none;
  }
  .st-app .st-content .wc-balance > * {
    position: relative;
  }
  .st-app .st-content .wc-balance .wc-balance-label,
  .st-app .st-content .wc-balance .wc-state-note,
  .st-app .st-content .wc-balance .wc-state-note span,
  .st-app .st-content .wc-balance .wc-eye {
    color: rgba(255, 255, 255, .78);
  }
  .st-app .st-content .wc-balance .wc-balance-amount,
  .st-app .st-content .wc-balance .wc-balance-amount .money {
    color: #fff;
  }
  .st-app .st-content .wc-balance .wc-balance-amount .money small,
  .st-app .st-content .wc-balance .wc-hl,
  .st-app .st-content .wc-balance .wc-state-note b {
    color: #f3b63f;
  }
  .st-app .st-content .wc-balance .wc-progress .ms-bar {
    background: rgba(255, 255, 255, .16);
  }
  .st-app .st-content .wc-balance .wc-progress small {
    color: rgba(255, 255, 255, .7);
  }
  .st-app .st-content .wc-balance .wc-btn {
    background: rgba(255, 255, 255, .1);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .14);
  }
  .st-app .st-content .wc-balance .wc-btn.is-primary {
    background: linear-gradient(135deg, #ff6a3d, #ff8f4e);
    border-color: transparent;
  }
  .st-app .st-content .wc-balance .wc-btn.is-dim {
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .55);
  }
  .st-app .st-content .wc-promo {
    background: #0f0e0d url("/assets/images/bg-nhanthuong.webp") right center / cover no-repeat;
    border: 1px solid rgba(243, 182, 63, .22);
    min-height: 160px;
  }
  .st-app .st-content .wc-promo::before {
    background: linear-gradient(90deg, rgba(13, 12, 11, .9) 0%, rgba(13, 12, 11, .6) 50%, rgba(13, 12, 11, 0) 100%);
    inset: 0;
    width: auto;
    height: auto;
    right: 0;
    top: 0;
  }
  .st-app .st-content .wc-promo .wc-gift {
    display: none;
  }
  .st-app .st-content .wc-promo .wc-promo-amount,
  .st-app .st-content .wc-promo .wc-promo-amount .money,
  .st-app .st-content .wc-promo .wc-promo-amount small {
    color: #f3b63f;
  }
  .st-app .st-content .wc-promo .wc-promo-sub {
    color: rgba(255, 255, 255, .85);
  }
  .st-app .st-content .wc-promo .wc-promo-cta {
    background: transparent;
    border: 1px solid #ff6a3d;
    color: #ff8a5f;
  }
  .st-app .st-content .mb-gift {
    background: #0f0e0d url("/assets/images/bg-qr-gioi-thieu.webp") center top / cover no-repeat;
    border: 1px solid rgba(243, 182, 63, .22);
  }
  .st-app .st-content .mb-gift::before {
    background: linear-gradient(180deg, rgba(13, 12, 11, .55) 0%, rgba(13, 12, 11, .2) 40%, rgba(13, 12, 11, .35) 100%);
    inset: 0;
    width: auto;
    height: auto;
    right: 0;
    top: 0;
  }
  .st-app .st-content .mb-gift-ic {
    background: rgba(255, 106, 61, .22);
    color: #ff8a5f;
  }
  .st-app .st-content .mb-gift-amount {
    color: #ff8a5f;
  }
  .st-app .st-content .mb-gift-head b {
    color: #fff;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-profile {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(243, 182, 63, .22);
    border-radius: 22px;
    background: #121110 url("/assets/images/bg-waves.svg") center / cover no-repeat;
    box-shadow: none;
    color: #fff;
  }
  .st-app .st-content .mb-profile::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(18, 17, 16, .55) 0%, rgba(18, 17, 16, .25) 55%, rgba(60, 36, 18, .35) 100%);
    pointer-events: none;
  }
  .st-app .st-content .mb-profile > * {
    position: relative;
  }
  .st-app .st-content .mb-profile .mb-profile-copy b {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
  }
  .st-app .st-content .mb-profile .mb-profile-copy small {
    color: rgba(255, 255, 255, .72);
  }
  .st-app .st-content .mb-profile .mb-profile-avatar {
    border: 2px solid rgba(243, 182, 63, .6);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .35);
  }
  .st-app .st-content .mb-profile-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    margin-top: 2px;
  }
  .st-app .st-content .mb-profile-stats > * {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    width: 100%;
    min-width: 0;
    padding: 14px 32px 14px 14px;
    border-radius: 16px;
    text-align: left;
  }
  .st-app .st-content .mb-profile-stats > *::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 1.75px solid rgba(255, 255, 255, .6);
    border-top: 1.75px solid rgba(255, 255, 255, .6);
    transform: translateY(-50%) rotate(45deg);
  }
  .st-app .st-content .mb-profile-stats > * > span {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin: 0;
    font-size: 13.5px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: rgba(255, 255, 255, .78);
    white-space: nowrap;
    overflow: visible;
  }
  .st-app .st-content .mb-profile-stats > * > span svg {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
  }
  .st-app .st-content .mb-profile-stats > * > b,
  .st-app .st-content .mb-profile-stats > * > b .money {
    display: block;
    width: 100%;
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.01em;
    color: #fff;
    white-space: nowrap;
    overflow: visible;
  }
  .st-app .st-content .mb-profile-stats > * > b .money small {
    font-size: 13px;
    margin-left: 4px;
  }
  .st-app .st-content .mb-profile-stats > .is-avail {
    border: 1px solid rgba(255, 138, 61, .55);
    background: linear-gradient(135deg, rgba(255, 106, 61, .5), rgba(255, 106, 61, .18));
  }
  .st-app .st-content .mb-profile-stats > .is-avail > b,
  .st-app .st-content .mb-profile-stats > .is-avail > b .money,
  .st-app .st-content .mb-profile-stats > .is-avail > b .money small {
    color: #ff9a5c;
  }
  .st-app .st-content .mb-profile-stats > .is-avail > span,
  .st-app .st-content .mb-profile-stats > .is-avail > span svg {
    color: #ff9a5c;
  }
  .st-app .st-content .mb-profile-stats > .is-pending {
    border: 1px solid rgba(255, 255, 255, .12);
    background: rgba(255, 255, 255, .06);
  }
  .st-app .st-content .mb-profile .partner-badge {
    background: #f3b63f;
    color: #3a2a12;
  }
  .st-app .st-content .mb-profile-go {
    color: rgba(255, 255, 255, .7);
  }
}
/* Chế độ SÁNG: dùng ảnh nền phiên bản sáng cho các thẻ mobile
   (thẻ ví, thẻ ưu đãi, thẻ mời bạn bè). Chế độ tối giữ nguyên ảnh cũ. */
@media (max-width: 760px) {
  :root[data-theme="light"] .st-app .st-content .wc-balance {
    background-image: url("/assets/images/bg-sodu-light.webp");
  }
  :root[data-theme="light"] .st-app .st-content .wc-promo {
    background-image: url("/assets/images/bg-nhanthuong-light.webp");
  }
  :root[data-theme="light"] .st-app .st-content .mb-gift {
    background-image: url("/assets/images/bg-qr-gioi-thieu-light.webp");
  }
}
@media (max-width: 380px) {
  .st-app .st-content .mb-profile-stats > * > b,
  .st-app .st-content .mb-profile-stats > * > b .money {
    font-size: 21px;
  }
  .st-app .st-content .mb-profile-stats > * {
    padding: 12px 26px 12px 12px;
  }
  .st-app .st-content .mb-profile-stats > *::after {
    right: 10px;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-profile-go {
    display: none;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-shell {
    gap: 16px;
  }
  .st-app .st-content .mb-feature-search {
    width: 100%;
    max-width: none;
    margin: 4px 0 0;
  }
  .st-app .st-content .mb-feature-empty[hidden] {
    display: none;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-shell > * {
    margin-top: 0 !important;
  }
  .st-app .st-content .mb-shell > * + * {
    margin-top: 24px !important;
  }
  .st-app .st-content .mb-shell > [hidden] + * {
    margin-top: 24px !important;
  }
}
@media (max-width: 760px) {
  .st-app .st-content .mb-refblock .mb-panel-head {
    margin-bottom: 12px;
  }
  .st-app .st-content .mb-ref-sub {
    margin-bottom: 12px;
  }
  .st-app .st-content .mb-ref-row {
    margin-bottom: 12px;
  }
  .st-app .st-content .mb-ref-row:last-child {
    margin-bottom: 0;
  }
  .st-app .st-content .mb-profile-stats {
    margin-top: 14px;
  }
  .st-app .st-content .mb-profile,
  .st-app .st-content .mb-refblock,
  .st-app .st-content .mb-gift,
  .st-app .st-content .mb-shell .mb-panel {
    padding: 18px;
  }
}
.wc-card-default {
  position: absolute;
  top: 10px;
  right: 84px;
  z-index: 2;
  margin: 0;
}
.wc-card-default button {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .3);
  color: #fff;
  cursor: pointer;
}
.wc-card-default button svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linejoin: round;
}
.wc-stack-default {
  margin: 10px 0 0;
}
.wc-stack-default .wc-btn {
  width: 100%;
}
.wc-cards-grid .wc-card .wc-card-top {
  padding-right: 118px;
}
.wc-card-default button:hover {
  background: rgba(255, 255, 255, .45);
}
@media (max-width: 760px) {
  .st-app .st-content .wc-cards:not(.wc-cards-grid) {
    scroll-padding-left: 16px;
    scroll-padding-right: 16px;
  }
  .st-app .st-content .wc-cards:not(.wc-cards-grid) .wc-card,
  .st-app .st-content .wc-cards:not(.wc-cards-grid) .wc-card-wrap {
    flex: 0 0 calc(100vw - 32px);
    max-width: calc(100vw - 32px);
  }
  .st-app .st-content .wc-cards:not(.wc-cards-grid) .wc-card-wrap .wc-card {
    flex-basis: auto;
    width: 100%;
    max-width: none;
  }
  .st-app .st-content .wc-cards:not(.wc-cards-grid) .wc-card.is-add {
    flex-basis: calc(100vw - 32px);
  }
}
.st-app .st-content .wc-btn.is-dim,
.st-app .st-content .wc-btn[aria-disabled="true"] {
  pointer-events: none;
  opacity: .42;
  background: var(--tw-paper-2);
  color: var(--tw-muted);
  box-shadow: none;
  filter: none;
}
@media (max-width: 760px) {
  .st-app .st-content .wc-balance .wc-btn.is-dim,
  .st-app .st-content .wc-balance .wc-btn[aria-disabled="true"] {
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .7);
    border-color: rgba(255, 255, 255, .08);
    opacity: .5;
  }
}

.mb-profile-head {
  display: flex;
  flex: 1 1 100%;
  align-items: center;
  gap: 14px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.mb-profile-head .mb-profile-copy {
  flex: 1 1 auto;
  min-width: 0;
}
@media (max-width: 980px) {
  .mb-shell .mb-profile .mb-profile-head {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .mb-shell .mb-profile .mb-profile-stats {
    grid-column: 1 / -1;
    grid-row: 2;
  }
}
.mb-profile-head .mb-profile-avatar {
  flex: 0 0 auto;
}
.mb-profile-head .mb-profile-copy {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 10px;
  row-gap: 4px;
}
.mb-profile-head .mb-profile-copy > b {
  grid-area: 1 / 1;
  min-width: 0;
}
.mb-profile-head .mb-profile-copy > .partner-badge {
  grid-area: 1 / 2;
  justify-self: end;
  margin-left: 0;
}
.mb-profile-head .mb-profile-copy > small {
  grid-area: 2 / 1;
  margin-top: 0;
}
.mb-profile-head .mb-profile-copy > .mb-profile-edit {
  grid-area: 2 / 2;
  justify-self: end;
}
@media (min-width: 981px) {
  .st-app .mb-shell .mb-profile-head .mb-profile-copy {
    grid-template-columns: auto auto;
    justify-content: start;
    column-gap: 12px;
  }
  .st-app .mb-shell .mb-profile-head .mb-profile-copy > .partner-badge,
  .st-app .mb-shell .mb-profile-head .mb-profile-copy > .mb-profile-edit {
    justify-self: start;
  }
}
.mb-profile-edit {
  flex: 0 0 auto;
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  font-size: 12.5px;
  font-weight: 600;
  white-space: nowrap;
}
.mb-profile-stats > a {
  color: inherit;
  text-decoration: none;
}
.mb-profile-stats > a:focus-visible,
.mb-profile-head:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: 2px;
}
@media (max-width: 760px) {
  .st-app .st-content .mb-profile-head {
    gap: 12px;
  }
  .st-app .st-content .mb-profile-head .mb-profile-copy b {
    overflow-wrap: anywhere;
  }
}
.st-app .st-content .mb-profile-stats > * > span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-transform: none;
  letter-spacing: 0;
}
.st-app .st-content .mb-profile-stats > * > span svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
}
.st-app .pf-card .avatar-edit {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  grid-template-areas: "preview note" "form form";
  gap: 14px 16px;
  align-items: center;
  margin-top: 4px;
}
.st-app .pf-card .avatar-edit-preview {
  grid-area: preview;
}
.st-app .pf-card .avatar-edit-form {
  display: contents;
}
.st-app .pf-card .avatar-edit-form .panel-note {
  grid-area: note;
  margin: 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--tw-muted);
}
.st-app .pf-card .avatar-edit-form input[type="file"] {
  grid-area: form;
  width: 100%;
  min-height: 48px;
  padding: 6px 8px;
  border: 1px dashed var(--tw-line-strong);
  border-radius: 12px;
  background: var(--tw-paper);
  color: var(--tw-muted);
  font-size: 13px;
  line-height: 34px;
  box-sizing: border-box;
}
.st-app .pf-card .avatar-edit-form input[type="file"]::file-selector-button {
  margin-right: 10px;
  padding: 0 12px;
  height: 34px;
  border: 0;
  border-radius: 9px;
  background: var(--tw-paper-2);
  color: var(--tw-ink);
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 34px;
  cursor: pointer;
}
.st-app .pf-card .avatar-edit-form input[type="file"]::file-selector-button:hover {
  color: var(--tw-brand);
}
.st-app .pf-card .avatar-edit-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 8px;
  margin: 0;
}

.aic-scrim {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: grid;
  place-items: center;
  padding: 16px;
  background: rgba(28, 20, 16, .46);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  animation: st-scrim-in .16s ease-out;
}
.aic-scrim[hidden] {
  display: none;
}
body.aic-open {
  overflow: hidden;
}
.aic-card:focus {
  outline: none;
}
.aic-card {
  display: flex;
  flex-direction: column;
  width: min(520px, 100%);
  max-height: min(88vh, 680px);
  margin: 0;
  border-radius: 20px;
  background: var(--tw-paper);
  color: var(--tw-ink);
  box-shadow: 0 24px 60px -28px rgba(0, 0, 0, .5);
  animation: st-dialog-in .22s cubic-bezier(.32, .72, 0, 1);
  overflow: hidden;
}
.aic-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 22px 12px;
}
.aic-head h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -.01em;
}
.aic-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--tw-brand-soft);
  color: var(--tw-brand);
  font-size: 12px;
  font-weight: 800;
}
.aic-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 0 22px 8px;
  overflow-y: auto;
  overscroll-behavior: contain;
  font-size: 14px;
  line-height: 1.55;
  color: var(--tw-ink-2);
}
.aic-body p {
  margin: 0 0 10px;
}
.aic-label {
  font-weight: 700;
  color: var(--tw-ink);
}
.aic-list {
  margin: 0 0 10px;
  padding-left: 18px;
}
.aic-list li {
  margin: 0 0 4px;
}
.aic-note {
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--tw-paper-2);
  font-size: 13px;
}
.aic-links a {
  color: var(--tw-brand);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.aic-links span {
  margin: 0 6px;
  color: var(--tw-muted);
}
.aic-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 12px 22px 18px;
  border-top: 1px solid var(--tw-line);
}
.aic-btn {
  min-height: 44px;
  padding: 0 14px;
  border: 0;
  border-radius: 12px;
  font: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}
.aic-btn.is-ghost {
  background: var(--tw-paper-2);
  color: var(--tw-ink);
}
.aic-btn.is-primary {
  background: var(--tw-brand);
  color: #fff;
  font-weight: 700;
}
.aic-btn:disabled {
  opacity: .6;
  cursor: default;
}
.aic-btn:focus-visible {
  outline: 2px solid var(--tw-brand);
  outline-offset: 2px;
}
.camio-consent-off {
  margin: 10px 0 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--tw-paper-2);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--tw-ink-2);
}
.camio-consent-off p {
  margin: 0 0 10px;
}
.st-app .aic-card-profile .aic-status-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px;
}
.aic-status {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}
.aic-status.is-on {
  background: color-mix(in srgb, var(--tw-green) 14%, var(--tw-paper));
  color: var(--tw-green);
}
.aic-status.is-off {
  background: var(--tw-paper-2);
  color: var(--tw-muted);
}
.aic-provider {
  font-size: 13px;
  color: var(--tw-muted);
}
.aic-provider b {
  color: var(--tw-ink);
}
.st-app .aic-card-profile .aic-copy,
.st-app .aic-card-profile .aic-meta {
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--tw-ink-2);
}
.st-app .aic-card-profile .aic-meta {
  font-size: 12.5px;
  color: var(--tw-muted);
}
.aic-details {
  margin: 0 0 10px;
  font-size: 13.5px;
  color: var(--tw-ink-2);
}
.aic-details summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--tw-ink);
}
.aic-details .aic-list {
  margin-top: 8px;
}
.st-app .aic-card-profile .aic-card-actions {
  margin-top: 12px;
}
@media (max-width: 480px) {
  .aic-scrim {
    padding: 0;
    align-items: end;
  }
  .aic-card {
    width: 100%;
    max-height: 92vh;
    border-radius: 20px 20px 0 0;
  }
  .aic-actions {
    padding-bottom: calc(18px + env(safe-area-inset-bottom));
  }
}