html,
body,
#app {
  min-height: 100%;
}

body {
  margin: 0;
  background: #fff;
}

/* The preserved mobile bundle uses content-box sizing on a padded fixed header. */
.van-nav-bar {
  box-sizing: border-box;
  max-width: 100%;
}

#app {
  overflow-x: clip;
}

iframe[src*="youtube"]:not([data-template-media]),
iframe[src*="youtu.be"]:not([data-template-media]) {
  display: none !important;
}

.template-hot-currency-hidden {
  display: none !important;
}

.template-home-video {
  width: 100%;
  margin: .4rem 0;
  overflow: hidden;
  border-radius: .18667rem;
  background: #000;
  box-shadow: 0 0 .26667rem rgba(30, 77, 216, .1);
}

.template-home-video iframe {
  display: block !important;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
}
.template-savings-data {
  width: 4.8rem;
  min-height: 1.8rem;
  padding-top: .08rem;
  color: #fff;
}

/* The original home banner is a Vant swipe. Keep its native frame, but render
   the two savings schedules as full-width pages that can be swiped on touch. */
.defi-output > .van-swipe {
  overflow: hidden;
  border-radius: .22rem;
}

.defi-output > .van-swipe .van-swipe__track {
  display: flex;
  align-items: stretch;
  will-change: transform;
}

.template-savings-slide {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  flex: 0 0 auto;
  min-height: 0;
  overflow: hidden;
  border-radius: .22rem;
  background: #122e82;
  touch-action: pan-y;
}

.template-savings-slide .ad-banner-img {
  display: block;
  grid-area: 1 / 1;
  align-self: end;
  width: 100%;
  height: auto;
  min-height: 0;
  border-radius: inherit;
  object-fit: contain;
}

.template-savings-content {
  position: relative;
  grid-area: 1 / 1;
  align-self: start;
  z-index: 2;
  inset: auto;
  box-sizing: border-box;
  width: 100%;
  padding: 17px 12px 14px 20px;
  color: #fff;
  overflow-wrap: anywhere;
  pointer-events: none;
}

.template-savings-content h3 {
  margin: 0 0 8px;
  color: #fff;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}

.template-savings-period {
  margin: 0 0 4px;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.25;
  white-space: normal;
}

.template-savings-rows {
  display: grid;
  gap: 3px;
}

.template-savings-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: flex-start;
  gap: 0 8px;
  margin: 0;
  padding: 0;
  border: 0;
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.32;
  white-space: normal;
  overflow-wrap: anywhere;
}

.template-savings-row + .template-savings-row {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.template-savings-row span:first-child {
  min-width: 0;
  max-width: 100%;
}

.template-savings-row span:last-child {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}

.template-savings-row em {
  font-style: normal;
  font-size: .86em;
  font-weight: 500;
}

.template-savings-slide--fixed .template-savings-content {
  width: 100%;
  padding-top: 17px;
  padding-right: 10px;
}

.template-savings-slide--fixed .template-savings-content h3 {
  text-transform: uppercase;
}

@media (min-width: 500px) {
  .template-savings-content {
    padding-top: 22px;
    padding-left: 28px;
  }

  .template-savings-content h3 {
    font-size: 24px;
  }

  .template-savings-period,
  .template-savings-row {
    font-size: 18px;
  }

  .template-savings-rows {
    gap: 4px;
  }
}

@media (max-width: 360px) {
  .template-savings-content {
    padding-top: 12px;
    padding-left: 15px;
    padding-right: 8px;
  }

  .template-savings-content h3 {
    margin-bottom: 5px;
    font-size: 17px;
  }

  .template-savings-period,
  .template-savings-row {
    font-size: 13px;
  }
}

.template-savings-data p {
  margin: 0;
}

.template-savings-row + .template-savings-row {
  margin-top: .16rem;
  padding-top: .12rem;
  border-top: 1px solid rgba(255, 255, 255, .22);
}

.template-savings-range {
  overflow: hidden;
  font-size: .4rem;
  font-weight: 700;
  line-height: .56rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.template-savings-range span {
  font-size: .29333rem;
  font-weight: 600;
}

.template-savings-rate {
  display: flex;
  align-items: baseline;
  gap: .16rem;
  margin-top: .08rem !important;
}

.template-savings-rate strong {
  font-size: .48rem;
  line-height: .64rem;
}

.template-savings-rate span,
.template-savings-count {
  color: rgba(255, 255, 255, .82);
  font-size: .26667rem;
}

.mining-box .van-swipe {
  display: none !important;
}

.template-output-feed {
  height: 8.7rem !important;
  overflow: hidden !important;
}

.template-exchange-feed .van-collapse-item__wrapper {
  display: block !important;
  height: auto !important;
}

.template-exchange-feed .van-collapse-item__title[aria-expanded="false"] .title-right img {
  transform: rotate(180deg);
}

.template-output-list {
  display: grid;
  gap: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  list-style: none;
}

.template-output-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-height: .8rem;
  padding: .08rem 0;
  color: #858b94;
  font-size: .32rem;
  line-height: .64rem;
  transition: opacity .28s ease, transform .28s ease;
}

.template-output-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.template-output-row strong {
  color: #2852d6;
  font-size: .36rem;
  font-variant-numeric: tabular-nums;
}

.template-output-row.is-entering {
  opacity: 0;
  transform: translateY(.28rem);
}

.template-mining-list {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.template-mining-track {
  display: flex;
  width: 100%;
  transition: transform .58s cubic-bezier(.22, .61, .36, 1);
  will-change: transform;
}

.template-mining-slide {
  flex: 0 0 100%;
  box-sizing: border-box;
  min-width: 0;
  padding: .16rem .18rem .3rem;
}

.template-mining-record {
  box-sizing: border-box;
  width: 100%;
  padding: .26rem .32rem;
  border-bottom: 1px solid #edf1f8;
}

.template-mining-record > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .24rem;
  min-height: .62rem;
}

.template-mining-record small {
  color: #424750;
  font-size: .3rem;
  font-weight: 500;
}

.template-mining-record strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #2852d6;
  font-size: .29rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.template-mining-dots {
  position: absolute;
  right: 0;
  bottom: .02rem;
  left: 0;
  display: flex;
  justify-content: center;
  gap: .12rem;
}

.template-mining-dots i {
  width: .12rem;
  height: .12rem;
  border-radius: 50%;
  background: #d5def1;
  transition: width .25s ease, background-color .25s ease;
}

.template-mining-dots i.is-active {
  width: .34rem;
  border-radius: .08rem;
  background: #2852d6;
}

@media (prefers-reduced-motion: reduce) {
  .template-output-row,
  .template-mining-track,
  .template-mining-dots i { transition: none; }
}
.van-notify.legacy-wallet-warning { display: none !important; }
.template-b-share-wrap { flex: 0 0 38px; padding-right: 5px; }
.template-b-share-button { display: grid; width: 34px; height: 34px; padding: 0; place-items: center; border: 1px solid #a9b8cf; border-radius: 6px; background: #eef3fa; color: #56616e; font-size: 27px; line-height: 1; cursor: pointer; }
.template-b-share-button .iconfont { display: block; font-size: inherit; line-height: 1; }
.template-b-share-button:focus-visible { outline: 3px solid #8cafff; outline-offset: 2px; }
.van-nav-bar__right button[data-wallet-approval] { max-width: min(38vw, 190px); }
.van-nav-bar__right button[data-wallet-approval] .van-button__text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 480px) { .van-nav-bar__right button[data-wallet-approval] { max-width: 116px; } }
.template-wallet-notice { position: fixed; z-index: 100002; top: max(76px, calc(env(safe-area-inset-top) + 60px)); left: 50%; box-sizing: border-box; max-width: min(86vw, 360px); padding: 11px 16px; border: 1px solid rgba(255,255,255,.15); border-radius: 6px; background: rgba(19,29,43,.96); box-shadow: 0 8px 26px rgba(0,0,0,.24); color: #fff; font-size: 14px; font-weight: 600; line-height: 20px; text-align: center; opacity: 0; pointer-events: none; transform: translate(-50%,-10px); transition: opacity .18s ease,transform .18s ease; }
.template-wallet-notice.is-visible { opacity: 1; transform: translate(-50%,0); }
.template-wallet-notice.is-success { border-color: rgba(62,207,142,.7); }
.template-wallet-notice.is-error { border-color: rgba(255,104,104,.75); }
.template-test-logout { position: fixed; z-index: 100003; right: 12px; bottom: max(78px, calc(env(safe-area-inset-bottom) + 68px)); left: 12px; box-sizing: border-box; min-height: 44px; padding: 10px 16px; border: 1px solid #d94545; border-radius: 6px; background: #fff; box-shadow: 0 8px 28px rgba(24,31,42,.22); color: #c62f2f; font-size: 14px; font-weight: 700; line-height: 20px; opacity: 0; transform: translateY(12px); transition: opacity .18s ease, transform .18s ease; }
.template-test-logout.is-visible { opacity: 1; transform: translateY(0); }
.template-test-logout:disabled { border-color: #c8cdd5; color: #7c8490; }
.template-test-logout[hidden] { display: none !important; }

/* Keep the generated schedule rows compact after the legacy two-row rules above. */
.template-savings-slide .template-savings-row {
  margin: 0;
  padding: 0;
  border-top: 0;
}
