:root{
  --bg: #f6f7fb;
  --card: #ffffff;
  --text: #1b1e28;
  --muted: #8b93a7;
  --line: rgba(17, 24, 39, .08);
  --shadow: 0 10px 25px rgba(20, 24, 40, .08);
  --shadow-soft: 0 8px 18px rgba(20, 24, 40, .06);
  --brand: #ff6b4a;
  --brand2: #ffb047;
  --nexus-violet: #c084fc;
  --nexus-cyan: #4cf2ff;
  --nexus-ink: #0c0614;
  --tabH: 64px;
  --radius: 16px;
}

*{ box-sizing: border-box; }
html, body{ height: 100%; }
body{
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  color: var(--text);
  background: var(--bg);
}
a{ color: inherit; text-decoration: none; }
button, input{ font: inherit; }

.app{
  min-height: 100vh;
  padding-bottom: calc(var(--tabH) + 14px);
}
.container{
  width: min(430px, 100%);
  margin: 0 auto;
}

.topbar{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(14px);
  background: rgba(246, 247, 251, .75);
  border-bottom: 1px solid rgba(255,255,255,.45);
}
.topbar .row{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 10px 14px;
}
.topbar .title{
  justify-self: center;
  font-weight: 700;
  letter-spacing: .3px;
}
.topbar .left,
.topbar .right{
  display: flex;
  align-items: center;
  gap: 10px;
  color: rgba(0,0,0,.55);
  font-size: 12px;
}
.chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(17, 24, 39, .06);
  box-shadow: 0 6px 14px rgba(20, 24, 40, .06);
}
.icon{
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.icon svg{ width: 18px; height: 18px; }

/* 首页 / 商城 顶部 chip — NEXUS（与注册页紫/青、玻璃描边一致） */
html[data-page="home"] .topbar,
html[data-page="shop"] .topbar{
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(248,245,255,.95));
  border-bottom: 1px solid rgba(192, 132, 252, 0.22);
  box-shadow:
    0 1px 0 rgba(255,255,255,.65) inset,
    0 12px 40px rgba(12, 8, 28, 0.05);
}
html[data-page="home"] .topbar .left,
html[data-page="home"] .topbar .right,
html[data-page="shop"] .topbar .left,
html[data-page="shop"] .topbar .right{
  color: rgba(35, 30, 55, 0.55);
}
html[data-page="home"] .topbar .title,
html[data-page="shop"] .topbar .title{
  font-weight: 800;
  letter-spacing: .06em;
  font-size: 15px;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="home"] .topbar .title,
  html[data-page="shop"] .topbar .title{
    color: #1a1528;
    background: none;
  }
}
html[data-page="home"] .topbar .chip,
html[data-page="shop"] .topbar .chip{
  padding: 7px 12px;
  gap: 6px;
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(255,255,255,.72));
  border: 1px solid rgba(192, 132, 252, 0.3);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75) inset,
    0 10px 28px rgba(192, 132, 252, 0.14),
    0 8px 24px rgba(76, 242, 255, 0.08);
  color: rgba(24, 20, 48, 0.82);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .02em;
  transition: transform .15s ease, box-shadow .18s ease;
}
@media (hover: hover){
  html[data-page="home"] .topbar .chip:hover,
  html[data-page="shop"] .topbar .chip:hover{
    box-shadow:
      0 0 0 1px rgba(255,255,255,.85) inset,
      0 12px 32px rgba(192, 132, 252, 0.2),
      0 0 24px rgba(76, 242, 255, 0.12);
  }
}
html[data-page="home"] .topbar .chip:active,
html[data-page="shop"] .topbar .chip:active{
  transform: scale(.98);
}
html[data-page="home"] .topbar .chip .icon,
html[data-page="shop"] .topbar .chip .icon{
  filter: drop-shadow(0 0 8px rgba(76, 242, 255, 0.22));
}
html[data-page="home"] .topbar .left .chip:nth-child(1) .icon,
html[data-page="shop"] .topbar .left .chip:nth-child(1) .icon{ color: var(--nexus-violet); }
html[data-page="home"] .topbar .left .chip:nth-child(2) .icon,
html[data-page="shop"] .topbar .left .chip:nth-child(2) .icon{ color: var(--nexus-cyan); }
html[data-page="home"] .topbar .chip .icon svg *,
html[data-page="shop"] .topbar .chip .icon svg *{
  stroke-linecap: round;
  stroke-linejoin: round;
}
html[data-page="home"] .msgChipBtn,
html[data-page="shop"] .msgChipBtn{
  position: relative;
  border: none;
  font: inherit;
  cursor: pointer;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
}

html[data-page="shop"] .topbar .right{
  justify-self: end;
}
html[data-page="shop"] .topbar .shopTopBalanceBtn{
  margin: 0;
  font: inherit;
  cursor: default;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  max-width: min(220px, 52vw);
}
html[data-page="shop"] .topbar .shopTopBalanceBtn__lab{
  font-weight: 750;
  opacity: 0.92;
}
html[data-page="shop"] .topbar .shopTopBalanceBtn__val{
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  font-size: 13px;
  background: linear-gradient(95deg, var(--nexus-violet), #ea580c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="shop"] .topbar .shopTopBalanceBtn__val{
    color: rgba(91, 33, 182, 0.96);
    background: none;
  }
}

.msgBadge{
  position: absolute;
  right: -2px;
  top: -5px;
  min-width: 17px;
  height: 17px;
  padding: 0 5px;
  box-sizing: border-box;
  border-radius: 999px;
  background: linear-gradient(135deg, #fb7185, #e11d48);
  color: #fff;
  font-size: 10px;
  font-weight: 850;
  line-height: 17px;
  text-align: center;
  box-shadow: 0 2px 10px rgba(225, 29, 72, 0.45);
  pointer-events: none;
}

.nexusModal.nexusModal--msgCenter{
  z-index: 215;
}
.nexusModal.nexusModal--msgDetail{
  z-index: 225;
}
.nexusModal__panel--msgList{
  width: min(400px, 100%);
  max-height: min(72vh, 520px);
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0;
  overflow: hidden;
}
.nexusModal__panel--msgDetail{
  width: min(400px, 100%);
  max-height: min(78vh, 560px);
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0;
  overflow: hidden;
}
.msgCenter__head{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px 10px 16px;
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
}
.msgCenter__title{
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.04em;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .msgCenter__title{
    color: #1a1528;
    background: none;
  }
}
.msgCenter__close{
  flex-shrink: 0;
  border: 0;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: rgba(192, 132, 252, 0.16);
  color: rgba(17, 24, 39, 0.72);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s ease;
}
@media (hover: hover){
  .msgCenter__close:hover{
    background: rgba(192, 132, 252, 0.28);
  }
}
.msgCenter__list{
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 6px 0 10px;
}
.msgCenter__row{
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  padding: 12px 16px;
  border: 0;
  border-bottom: 1px solid rgba(17, 24, 39, 0.06);
  background: transparent;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s ease;
}
.msgCenter__row:last-child{
  border-bottom: 0;
}
@media (hover: hover){
  .msgCenter__row:hover{
    background: rgba(192, 132, 252, 0.08);
  }
}
.msgCenter__rowDot{
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  margin-top: 6px;
  border-radius: 999px;
  background: transparent;
}
.msgCenter__row--unread .msgCenter__rowDot{
  background: linear-gradient(135deg, var(--nexus-violet), var(--nexus-cyan));
  box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.2);
}
.msgCenter__rowMain{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.msgCenter__rowTitle{
  font-size: 14px;
  font-weight: 800;
  color: rgba(17, 24, 39, 0.9);
  line-height: 1.3;
}
.msgCenter__row--unread .msgCenter__rowTitle{
  color: rgba(17, 24, 39, 0.96);
}
.msgCenter__rowPreview{
  font-size: 12px;
  font-weight: 600;
  color: rgba(35, 28, 70, 0.58);
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.msgCenter__rowMeta{
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  padding-top: 2px;
}
.msgCenter__rowTime{
  font-size: 11px;
  font-weight: 650;
  color: rgba(35, 28, 70, 0.45);
  white-space: nowrap;
}
.msgCenter__rowArrow{
  font-size: 16px;
  font-weight: 300;
  color: rgba(17, 24, 39, 0.22);
  line-height: 1;
}
.msgCenter__detailTime{
  margin: 0;
  padding: 8px 16px 0;
  font-size: 12px;
  font-weight: 650;
  color: rgba(35, 28, 70, 0.5);
}
.msgCenter__detailBody{
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 10px 16px 18px;
  font-size: 14px;
  line-height: 1.65;
  color: rgba(35, 28, 70, 0.88);
}
.msgCenter__detailBody p{
  margin: 0 0 10px;
}
.msgCenter__detailBody p:last-child{
  margin-bottom: 0;
}

.hero{
  padding: 14px 14px 8px;
}
.heroCard{
  border-radius: calc(var(--radius) + 6px);
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,.6);
  background: linear-gradient(135deg, rgba(255,255,255,.75), rgba(255,255,255,.35));
  position: relative;
}
.heroCard img{
  width: 100%;
  height: auto;
  display: block;
}
html[data-page="shop"] .heroCard .shopHeroVisual{
  width: 100%;
  min-height: 170px;
  aspect-ratio: 2 / 1;
  display: block;
  background:
    radial-gradient(ellipse 90% 70% at 28% 18%, rgba(255, 255, 255, 0.42), transparent 58%),
    radial-gradient(ellipse 55% 45% at 82% 58%, rgba(76, 242, 255, 0.28), transparent 52%),
    linear-gradient(
      145deg,
      rgba(192, 132, 252, 0.42) 0%,
      rgba(99, 102, 241, 0.28) 42%,
      rgba(45, 212, 191, 0.22) 100%
    );
}
.heroOverlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 14px;
  background: linear-gradient(to bottom, rgba(0,0,0,.00), rgba(0,0,0,.12));
}
.heroOverlay .badge{
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 999px;
  padding: 8px 10px;
  font-weight: 600;
  font-size: 12px;
  color: rgba(0,0,0,.75);
  box-shadow: 0 10px 22px rgba(0,0,0,.10);
}

.heroCarousel{
  position: relative;
  border-radius: calc(var(--radius) + 6px);
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,.6);
  background: linear-gradient(135deg, rgba(255,255,255,.75), rgba(255,255,255,.35));
}
.heroCarousel__viewport{
  overflow: hidden;
}
.heroCarousel__track{
  display: flex;
  transition: transform 0.48s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}
@media (prefers-reduced-motion: reduce){
  .heroCarousel__track{
    transition-duration: 0.01ms;
  }
}
.heroSlide{
  flex: 0 0 100%;
  min-width: 0;
}
.heroCarousel .heroCard{
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.heroCarousel .heroOverlay{
  padding-bottom: 36px;
}
.heroCarousel__dots{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 10px;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  pointer-events: none;
}
.heroCarousel__dots .heroCarousel__dot{
  pointer-events: auto;
}
.heroCarousel__dot{
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.45);
  box-shadow: 0 0 0 1px rgba(0,0,0,.12);
  cursor: pointer;
  transition: width 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}
.heroCarousel__dot.is-active{
  width: 22px;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  box-shadow: 0 0 12px rgba(76, 242, 255, 0.35);
}
.heroCarousel__dot:focus-visible{
  outline: 2px solid var(--nexus-cyan);
  outline-offset: 2px;
}

.section{
  padding: 10px 14px 0;
}
.sectionHeader{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.sectionHeader h2{
  margin: 0;
  font-size: 16px;
}
.sectionHeader .sub{
  font-size: 12px;
  color: var(--muted);
}
.sectionHeader .sub a{
  color: inherit;
  text-decoration: none;
}
.sectionHeader .sub a:hover{
  text-decoration: underline;
}

.card{
  background: var(--card);
  border: 1px solid rgba(17, 24, 39, .06);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
}
.card.pad{ padding: 14px; }

.grid{
  display: grid;
  gap: 10px;
}
.grid.cols-4{ grid-template-columns: repeat(4, 1fr); }
.grid.cols-5{ grid-template-columns: repeat(5, 1fr); }
.grid.cols-2{ grid-template-columns: repeat(2, 1fr); }

.miniTile{
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.80));
  border: 1px solid rgba(17, 24, 39, .06);
  border-radius: 14px;
  padding: 10px 8px;
  box-shadow: 0 10px 20px rgba(20, 24, 40, .06);
}
.miniTile .t{
  font-weight: 700;
  font-size: 12px;
  margin: 0 0 4px;
}
.miniTile .d{
  margin: 0;
  font-size: 11px;
  color: var(--muted);
}
.miniTile .tag{
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(255,107,74,.15), rgba(255,176,71,.12));
  color: rgba(255,107,74,.95);
  font-weight: 700;
  font-size: 11px;
  border: 1px solid rgba(255, 107, 74, .18);
}
.miniTile.orange{
  background: linear-gradient(135deg, rgba(255, 121, 73, .18), rgba(255, 209, 124, .12));
}
.miniTile.blue{
  background: linear-gradient(135deg, rgba(78, 169, 255, .16), rgba(124, 210, 255, .10));
}
.miniTile.green{
  background: linear-gradient(135deg, rgba(63, 195, 154, .16), rgba(152, 255, 194, .10));
}
.miniTile.purple{
  background: linear-gradient(135deg, rgba(160, 110, 255, .16), rgba(226, 186, 255, .10));
}

.pillTabs{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(17, 24, 39, .06);
  box-shadow: 0 10px 20px rgba(20, 24, 40, .06);
}
.pillTabs a{
  text-align: center;
  font-weight: 700;
  font-size: 12px;
  padding: 9px 6px;
  border-radius: 999px;
  color: rgba(0,0,0,.55);
}
.pillTabs a[aria-current="page"]{
  background: linear-gradient(135deg, rgba(255,107,74,.95), rgba(255,176,71,.95));
  color: white;
  box-shadow: 0 12px 22px rgba(255, 107, 74, .22);
}

.productGrid{
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, 1fr);
}
.shopLoadMoreStatus{
  margin: 12px 0 0;
  font-size: 12px;
  font-weight: 650;
  text-align: center;
  color: rgba(100, 116, 139, 0.92);
  min-height: 1.25em;
}
.product{
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid rgba(17, 24, 39, .06);
  background: white;
  box-shadow: var(--shadow-soft);
}
.product .ph{
  height: 150px;
  background:
    radial-gradient(120px 80px at 30% 30%, rgba(255,107,74,.22), transparent 60%),
    radial-gradient(120px 80px at 70% 70%, rgba(78,169,255,.22), transparent 60%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
.product .body{ padding: 10px 10px 12px; }
.product .name{ margin: 0 0 8px; font-size: 12px; color: rgba(0,0,0,.72); }
.product .priceRow{
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
}
.price{
  font-weight: 900;
  color: #111827;
}
.subPrice{
  font-size: 12px;
  font-weight: 800;
  color: rgba(255,107,74,.95);
}

.search{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  padding: 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(17, 24, 39, .06);
  box-shadow: var(--shadow-soft);
}
.search input{
  border: 0;
  outline: none;
  background: transparent;
  font-size: 13px;
  color: rgba(0,0,0,.78);
}
.search button{
  border: 0;
  border-radius: 10px;
  padding: 9px 14px;
  font-weight: 800;
  font-size: 12px;
  color: white;
  background: #3a3d45;
}

.profileHeader{
  padding: 12px 14px 10px;
  background: linear-gradient(180deg, rgba(255, 206, 220, .38), rgba(246, 247, 251, .0));
}
.profileRow{
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: center;
}
.avatar{
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(255,107,74,.22), rgba(78,169,255,.20));
  border: 1px solid rgba(17, 24, 39, .06);
  box-shadow: 0 10px 20px rgba(20, 24, 40, .08);
}
.profileRow .name{
  font-weight: 900;
}
.profileRow .hint{
  margin-top: 2px;
  font-size: 12px;
  color: var(--muted);
}
.ghostBtn{
  border: 1px solid rgba(17, 24, 39, .10);
  background: rgba(255,255,255,.8);
  border-radius: 12px;
  padding: 8px 10px;
  font-weight: 800;
  font-size: 12px;
  box-shadow: 0 10px 18px rgba(20, 24, 40, .06);
}
.profileWalletActions{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.vipWalletBtn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 15px;
  min-height: 36px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-decoration: none;
  white-space: nowrap;
  box-sizing: border-box;
  transition: transform 0.15s ease, box-shadow 0.2s ease, filter 0.15s ease, border-color 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}
.vipWalletBtn--recharge{
  color: rgba(255, 255, 255, 0.98);
  border: none;
  background: linear-gradient(115deg, #a78bfa 0%, #8b9cf5 45%, #67d4f7 100%);
  box-shadow:
    0 8px 22px rgba(129, 140, 248, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.18) inset,
    0 0 20px rgba(125, 211, 252, 0.12);
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}
@media (hover: hover){
  .vipWalletBtn--recharge:hover{
    filter: brightness(1.06);
    box-shadow:
      0 10px 26px rgba(129, 140, 248, 0.4),
      0 0 0 1px rgba(255, 255, 255, 0.22) inset,
      0 0 26px rgba(125, 211, 252, 0.16);
    transform: translateY(-1px);
  }
}
.vipWalletBtn--recharge:active{
  transform: translateY(0) scale(0.98);
}
.vipWalletBtn--withdraw{
  color: rgba(17, 24, 39, 0.9);
  border: 1px solid rgba(192, 132, 252, 0.38);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.92));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 6px 16px rgba(192, 132, 252, 0.12),
    0 4px 12px rgba(20, 24, 40, 0.05);
}
@media (hover: hover){
  .vipWalletBtn--withdraw:hover{
    border-color: rgba(167, 139, 250, 0.55);
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.85) inset,
      0 8px 20px rgba(192, 132, 252, 0.18),
      0 4px 14px rgba(76, 242, 255, 0.08);
    transform: translateY(-1px);
  }
}
.vipWalletBtn--withdraw:active{
  transform: translateY(0) scale(0.98);
}

/* 充值 / 提现子页面 */
html.wallet-page .topbar{
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 245, 255, 0.98));
  border-bottom: 1px solid rgba(192, 132, 252, 0.18);
}
html.wallet-page .topbar .title{
  font-weight: 800;
  letter-spacing: 0.06em;
  font-size: 15px;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html.wallet-page .topbar .title{
    color: #1a1528;
    background: none;
  }
}
html.wallet-page .topbar .right{
  justify-self: end;
  display: flex;
  align-items: center;
}
.walletTopbarLink{
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(192, 132, 252, 0.35);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.88));
  font-size: 12px;
  font-weight: 850;
  font-family: inherit;
  letter-spacing: 0.02em;
  color: rgba(91, 33, 182, 0.94);
  cursor: pointer;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.65) inset;
  transition: filter 0.15s ease, transform 0.1s ease;
}
.walletTopbarLink:active{
  transform: scale(0.98);
}
@media (hover: hover){
  .walletTopbarLink:hover{
    filter: brightness(1.03);
    border-color: rgba(192, 132, 252, 0.5);
  }
}

.wallet-page .walletBalanceCard{
  border-radius: var(--radius);
  border: 1px solid rgba(192, 132, 252, 0.24);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.94));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 10px 32px rgba(12, 8, 28, 0.06);
  text-align: center;
  padding: 18px 16px 16px;
}
.wallet-page .walletBalanceCard__label{
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  color: rgba(35, 28, 70, 0.55);
  letter-spacing: 0.06em;
}
.wallet-page .walletBalanceCard__val{
  margin: 8px 0 0;
  font-size: 28px;
  font-weight: 950;
  letter-spacing: 0.04em;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .wallet-page .walletBalanceCard__val{
    color: #1a1528;
    background: none;
  }
}
.wallet-page .walletSectionTitle{
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: rgba(17, 24, 39, 0.78);
}
.wallet-page .walletField{
  margin-bottom: 14px;
}
.wallet-page .walletField label{
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: rgba(35, 28, 70, 0.72);
  margin-bottom: 6px;
}
.wallet-page .walletField input[type="text"],
.wallet-page .walletField input[type="number"],
.wallet-page .walletField select{
  width: 100%;
  box-sizing: border-box;
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid rgba(192, 132, 252, 0.28);
  background: rgba(255, 255, 255, 0.95);
  font-size: 15px;
  font-weight: 650;
  color: rgba(17, 24, 39, 0.9);
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.wallet-page .walletField input:focus,
.wallet-page .walletField select:focus{
  border-color: rgba(147, 51, 234, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.18);
}
.wallet-page .walletAmountChips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.wallet-page .walletAmountChips button{
  flex: 1;
  min-width: calc(25% - 6px);
  padding: 10px 8px;
  border-radius: 12px;
  border: 1px solid rgba(192, 132, 252, 0.28);
  background: rgba(255, 255, 255, 0.92);
  font-size: 13px;
  font-weight: 800;
  color: rgba(17, 24, 39, 0.82);
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
}
@media (hover: hover){
  .wallet-page .walletAmountChips button:hover{
    border-color: rgba(167, 139, 250, 0.5);
    background: rgba(248, 245, 255, 0.98);
  }
}
.wallet-page .walletAmountChips button.is-active{
  border-color: rgba(147, 51, 234, 0.55);
  background: linear-gradient(145deg, rgba(192, 132, 252, 0.18), rgba(76, 242, 255, 0.1));
  color: rgba(109, 40, 217, 0.95);
}
.wallet-page .walletPayGrid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 8px;
}
.wallet-page .walletPayGrid--3{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.wallet-page .walletPayGrid--4{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
html.recharge-page .walletPayGrid--4{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (min-width: 420px){
  .wallet-page .walletPayGrid--4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
@media (max-width: 380px){
  .wallet-page .walletPayGrid--3{
    grid-template-columns: 1fr;
  }
  .wallet-page .walletPayGrid--4{
    grid-template-columns: 1fr;
  }
  html.recharge-page .walletPayGrid--4{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  html.recharge-page .walletPayOpt{
    gap: 4px;
    padding: 8px 4px;
    font-size: 11px;
    border-radius: 10px;
  }
  html.recharge-page .walletPayOpt__icon{
    width: 20px;
    height: 20px;
    border-radius: 999px;
  }
  html.recharge-page .walletPayOpt__iconSvg{
    width: 12px;
    height: 12px;
  }
  html.recharge-page .walletPayOpt__name{
    font-size: 11px;
  }
  html.recharge-page .walletPayOpt__sub{
    font-size: 10px;
  }
}
.wallet-page .walletPayOpt{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 10px;
  border-radius: 12px;
  border: 1px solid rgba(192, 132, 252, 0.28);
  background: rgba(255, 255, 255, 0.94);
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  color: rgba(17, 24, 39, 0.85);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.wallet-page .walletPayOpt--icon{
  flex-direction: column;
  gap: 8px;
  padding: 14px 8px 12px;
  text-align: center;
}
.wallet-page .walletPayOpt__icon{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.wallet-page .walletPayOpt__icon--wechat{
  background: rgba(7, 193, 96, 0.14);
}
.wallet-page .walletPayOpt__icon--alipay{
  background: rgba(22, 119, 255, 0.14);
}
.wallet-page .walletPayOpt__icon--usdt{
  background: rgba(38, 161, 123, 0.16);
}
.wallet-page .walletPayOpt__icon--bank{
  background: rgba(100, 116, 139, 0.14);
}
.wallet-page .walletPayOpt__iconSvg{
  width: 24px;
  height: 24px;
  display: block;
}
.wallet-page .walletPayOpt__text{
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: center;
  line-height: 1.25;
}
.wallet-page .walletPayOpt__name{
  font-size: 12px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.9);
}
.wallet-page .walletPayOpt__sub{
  font-size: 10px;
  font-weight: 700;
  color: rgba(35, 28, 70, 0.48);
  letter-spacing: 0.02em;
}
.wallet-page .walletPayOpt input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.wallet-page .walletPayOpt:has(input:checked){
  border-color: rgba(147, 51, 234, 0.5);
  box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.2);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(248, 245, 255, 0.96));
}
@supports not selector(:has(*)){
  .wallet-page .walletPayOpt.is-selected{
    border-color: rgba(147, 51, 234, 0.5);
    box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.2);
  }
}
.wallet-page .walletTip{
  margin: 12px 0 0;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px dashed rgba(192, 132, 252, 0.35);
  background: rgba(248, 245, 255, 0.55);
  font-size: 12px;
  line-height: 1.55;
  color: rgba(35, 28, 70, 0.68);
  font-weight: 600;
}
.wallet-page .walletTip strong{
  color: rgba(147, 51, 234, 0.9);
  font-weight: 800;
}

/* 充值 / 提现记录弹窗 */
.nexusModal__panel--walletHistory{
  width: min(400px, 100%);
  max-height: min(82vh, 520px);
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0;
  overflow: hidden;
}
.walletHistoryHead{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 14px 10px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
  flex-shrink: 0;
}
.walletHistoryHead__title{
  margin: 0;
  font-size: 17px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.92);
}
.walletHistoryClose{
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: rgba(241, 245, 249, 0.95);
  font-size: 22px;
  line-height: 1;
  color: rgba(71, 85, 105, 0.85);
  cursor: pointer;
}
.walletHistoryList{
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 10px 12px 14px;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.walletHistoryRow{
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(192, 132, 252, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.92));
  box-shadow: 0 4px 14px rgba(12, 8, 28, 0.04);
}
.walletHistoryRow__hd{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.walletHistoryRow__no{
  font-size: 11px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.9);
}
.walletHistoryRow__st{
  flex-shrink: 0;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  border: 1px solid transparent;
}
.walletHistoryRow__st--ok{
  color: rgba(18, 100, 72, 0.92);
  background: rgba(94, 242, 184, 0.18);
  border-color: rgba(94, 242, 184, 0.4);
}
.walletHistoryRow__st--pending{
  color: rgba(180, 90, 0, 0.92);
  background: rgba(255, 176, 71, 0.18);
  border-color: rgba(255, 176, 71, 0.4);
}
.walletHistoryRow__st--fail{
  color: rgba(185, 28, 28, 0.92);
  background: rgba(254, 202, 202, 0.35);
  border-color: rgba(248, 113, 113, 0.35);
}
.walletHistoryRow__amt{
  font-size: 18px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  color: rgba(91, 33, 182, 0.95);
  margin-bottom: 8px;
}
.walletHistoryRow__amt--out{
  color: rgba(234, 88, 12, 0.98);
}
.walletHistoryRow__pay{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 750;
  color: rgba(30, 41, 59, 0.9);
}
.walletHistoryRow__payLab{
  font-size: 11px;
  font-weight: 700;
  color: rgba(100, 116, 139, 0.85);
}
.walletHistoryRow__time{
  margin: 0;
  font-size: 11px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.85);
}
.walletHistoryRow__note{
  margin: 0;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.75);
}

.wallet-page .walletBankInfo{
  margin: 14px 0 4px;
  padding: 14px 12px;
  border-radius: 12px;
  border: 1px solid rgba(100, 116, 139, 0.22);
  background: linear-gradient(165deg, rgba(241, 245, 249, 0.95), rgba(255, 255, 255, 0.98));
}
.wallet-page .walletBankInfo__title{
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 900;
  color: rgba(30, 41, 59, 0.9);
  letter-spacing: 0.02em;
}
.wallet-page .walletBankInfo__title + .walletUsdtRate{
  margin-top: 0;
}
.wallet-page .walletBankInfo__cell{
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}
.wallet-page .walletBankInfo__cell .walletBankInfo__v{
  flex: 1;
  min-width: 0;
}
.wallet-page .walletCopyBtn{
  flex-shrink: 0;
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(147, 51, 234, 0.35);
  background: rgba(255, 255, 255, 0.95);
  font-size: 11px;
  font-weight: 850;
  font-family: inherit;
  color: rgba(109, 40, 217, 0.95);
  cursor: pointer;
  line-height: 1.2;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}
.wallet-page .walletCopyBtn:disabled{
  opacity: 0.85;
  cursor: default;
}
@media (hover: hover){
  .wallet-page .walletCopyBtn:hover:not(:disabled){
    border-color: rgba(147, 51, 234, 0.55);
    background: rgba(248, 245, 255, 0.98);
  }
}
.wallet-page .walletBankInfo--usdt .walletCopyBtn{
  border-color: rgba(38, 161, 123, 0.4);
  color: rgba(6, 95, 70, 0.95);
}
@media (hover: hover){
  .wallet-page .walletBankInfo--usdt .walletCopyBtn:hover:not(:disabled){
    border-color: rgba(38, 161, 123, 0.55);
    background: rgba(236, 253, 245, 0.85);
  }
}
.wallet-page .walletBankInfo__row{
  display: grid;
  grid-template-columns: 76px 1fr;
  gap: 8px 10px;
  align-items: flex-start;
  padding: 8px 0;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  font-size: 13px;
}
.wallet-page .walletBankInfo__row:first-of-type{
  border-top: none;
  padding-top: 0;
}
.wallet-page .walletBankInfo__k{
  margin: 0;
  padding-top: 2px;
  font-weight: 800;
  color: rgba(71, 85, 105, 0.85);
}
.wallet-page .walletBankInfo__v{
  margin: 0;
  font-weight: 750;
  color: rgba(15, 23, 42, 0.92);
  word-break: break-all;
  font-variant-numeric: tabular-nums;
}
.wallet-page .walletBankInfo__note{
  margin: 12px 0 0;
  padding-top: 10px;
  border-top: 1px dashed rgba(148, 163, 184, 0.35);
  font-size: 11px;
  line-height: 1.5;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
}
.wallet-page .walletBankInfo--usdt{
  border-color: rgba(38, 161, 123, 0.28);
  background: linear-gradient(165deg, rgba(236, 253, 245, 0.92), rgba(255, 255, 255, 0.98));
}
.wallet-page .walletBankInfo--usdt .walletBankInfo__title{
  color: rgba(6, 78, 59, 0.92);
}
.wallet-page .walletUsdtRate{
  margin: 0 0 12px;
  padding: 12px 10px;
  border-radius: 10px;
  background: rgba(38, 161, 123, 0.08);
  border: 1px solid rgba(38, 161, 123, 0.18);
}
.wallet-page .walletUsdtRate__label{
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: rgba(6, 78, 59, 0.65);
  margin-bottom: 6px;
}
.wallet-page .walletUsdtRate__val{
  display: block;
  font-size: 18px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: rgba(6, 95, 70, 0.98);
  letter-spacing: 0.02em;
}
.wallet-page .walletUsdtRate__date{
  margin: 8px 0 0;
  font-size: 11px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.82);
}
.wallet-page .walletSubmit{
  width: 100%;
  margin-top: 8px;
  justify-content: center;
}
.wallet-page .walletLinkAll{
  display: inline-block;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(124, 58, 237, 0.92);
  text-decoration: none;
}
@media (hover: hover){
  .wallet-page .walletLinkAll:hover{
    text-decoration: underline;
  }
}

/* 会员页 · 盲盒鼓励语 + 开箱记录入口 */
.vipBlindBoxCard{
  position: relative;
  margin-top: 12px;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(124, 58, 237, 0.18);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.96) 0%, rgba(245, 243, 255, 0.94) 45%, rgba(236, 254, 255, 0.55) 100%);
  box-shadow:
    0 12px 32px rgba(76, 29, 149, 0.08),
    0 1px 0 rgba(255, 255, 255, 0.75) inset;
}
.vipBlindBoxCard__glow{
  position: absolute;
  inset: -40% -20% auto -20%;
  height: 70%;
  background: radial-gradient(ellipse at 50% 0%, rgba(167, 139, 250, 0.35), transparent 55%);
  pointer-events: none;
}
.vipBlindBoxCard__recycleLink{
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-decoration: none;
  color: rgba(91, 33, 182, 0.95);
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(124, 58, 237, 0.28);
  box-shadow: 0 4px 14px rgba(76, 29, 149, 0.1);
  transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
@media (hover: hover){
  .vipBlindBoxCard__recycleLink:hover{
    border-color: rgba(124, 58, 237, 0.45);
    box-shadow: 0 6px 18px rgba(76, 29, 149, 0.14);
    transform: translateY(-1px);
  }
}
.vipBlindBoxCard__recycleLink:active{
  transform: translateY(0);
}
.vipBlindBoxCard__inner{
  position: relative;
  padding: 14px 14px 12px;
}
.vipBlindBoxCard__mood{
  padding-bottom: 12px;
  border-bottom: 1px dashed rgba(124, 58, 237, 0.2);
}
.vipBlindBoxCard__badge{
  display: inline-block;
  margin-bottom: 8px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
  color: rgba(91, 33, 182, 0.95);
  background: linear-gradient(135deg, rgba(192, 132, 252, 0.28), rgba(34, 211, 238, 0.2));
  border: 1px solid rgba(124, 58, 237, 0.22);
}
.vipBlindBoxCard__slogan{
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.45;
  letter-spacing: 0.02em;
  color: rgba(17, 24, 39, 0.92);
}
.vipBlindBoxCard__sub{
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.5;
  color: rgba(71, 85, 105, 0.82);
}
.vipBlindBoxCard__entry{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 12px 12px;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.1), rgba(34, 211, 238, 0.08));
  border: 1px solid rgba(124, 58, 237, 0.16);
  box-shadow: 0 8px 20px rgba(76, 29, 149, 0.06);
  transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
@media (hover: hover){
  .vipBlindBoxCard__entry:hover{
    border-color: rgba(124, 58, 237, 0.32);
    box-shadow: 0 12px 28px rgba(76, 29, 149, 0.1);
    transform: translateY(-1px);
  }
}
.vipBlindBoxCard__entry:active{
  transform: translateY(0);
}
.vipBlindBoxCard__entryIcon{
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(91, 33, 182, 0.95);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.95), rgba(237, 233, 254, 0.9));
  border: 1px solid rgba(124, 58, 237, 0.18);
  box-shadow: 0 6px 14px rgba(76, 29, 149, 0.08);
}
.vipBlindBoxCard__entryIcon svg{
  width: 24px;
  height: 24px;
}
.vipBlindBoxCard__entryMain{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.vipBlindBoxCard__entryTitle{
  font-size: 15px;
  font-weight: 900;
  color: rgba(17, 24, 39, 0.92);
  letter-spacing: 0.02em;
}
.vipBlindBoxCard__entryDesc{
  font-size: 12px;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.78);
}
.vipBlindBoxCard__entryChev{
  flex-shrink: 0;
  font-size: 22px;
  font-weight: 300;
  line-height: 1;
  color: rgba(124, 58, 237, 0.55);
}

.statRow{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 10px;
}
.stat{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(17, 24, 39, .06);
  border-radius: var(--radius);
  padding: 12px 10px;
  text-align: center;
  box-shadow: var(--shadow-soft);
}
.stat .v{ font-weight: 950; color: rgba(255,107,74,.95); font-size: 18px; }
.stat .k{ margin-top: 4px; font-size: 12px; color: var(--muted); }
a.stat.stat--tap{
  display: block;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: transform 0.12s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
a.stat.stat--tap:active{
  transform: scale(0.98);
}
@media (hover: hover){
  a.stat.stat--tap:hover{
    border-color: rgba(192, 132, 252, 0.32);
    box-shadow: 0 12px 26px rgba(192, 132, 252, 0.12);
  }
}

.iconGrid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.iconItem{
  text-align: center;
  padding: 10px 6px;
  border-radius: 14px;
  border: 1px solid rgba(17, 24, 39, .06);
  background: rgba(255,255,255,.88);
  box-shadow: 0 10px 18px rgba(20, 24, 40, .05);
}
.iconItem .i{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  margin: 0 auto 8px;
  background: linear-gradient(135deg, rgba(0,0,0,.05), rgba(0,0,0,.02));
  display: flex;
  align-items: center;
  justify-content: center;
}
.iconItem .l{
  font-size: 12px;
  color: rgba(0,0,0,.70);
  font-weight: 700;
}
button.iconItem{
  display: block;
  width: 100%;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.checkinCard{
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 10px;
}
.checkinCard .big{
  font-weight: 950;
  font-size: 18px;
}
.checkinCard .big .red{ color: rgba(255, 62, 62, .95); }
.checkinCard .btn{
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 900;
  color: white;
  background: linear-gradient(135deg, rgba(255,107,74,.98), rgba(255,176,71,.98));
  box-shadow: 0 14px 26px rgba(255, 107, 74, .22);
}
.checkinCard--jifen{
  align-items: start;
}
.checkinCard__main{
  min-width: 0;
}
.checkinCard__kicker{
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  margin-bottom: 8px;
  background: linear-gradient(95deg, rgba(192,132,252,.2), rgba(76,242,255,.2));
  border: 1px solid rgba(192,132,252,.35);
  color: rgba(50, 35, 90, .88);
}
.checkinCard__hint{
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: rgba(70, 65, 95, .65);
  font-weight: 600;
}

.days{
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.day{
  text-align: center;
  padding: 10px 8px;
  border-radius: 14px;
  border: 1px solid rgba(17, 24, 39, .06);
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 18px rgba(20, 24, 40, .05);
}
.day .n{ font-size: 12px; color: rgba(0,0,0,.60); font-weight: 800; }
.day .gift{
  margin: 8px auto;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: linear-gradient(135deg, rgba(78,169,255,.35), rgba(78,169,255,.10));
  border: 1px solid rgba(78,169,255,.25);
}
.day .val{ font-size: 12px; color: rgba(0,0,0,.62); font-weight: 800; }

.qrCard{
  height: 100%;
  border-radius: var(--radius);
  border: 1px solid rgba(17, 24, 39, .06);
  background:
    linear-gradient(135deg, rgba(255,255,255,.95), rgba(255,255,255,.75));
  display: grid;
  place-items: center;
  padding: 10px;
}
.qr{
  width: 120px;
  height: 120px;
  border-radius: 12px;
  background:
    linear-gradient(90deg, rgba(0,0,0,.08) 1px, transparent 1px),
    linear-gradient(rgba(0,0,0,.08) 1px, transparent 1px);
  background-size: 10px 10px;
  border: 1px solid rgba(17, 24, 39, .10);
}

.section--pt{ padding-top: 12px; }
.section--pb{ padding-bottom: 14px; }

.nexusBtnMain{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 18px;
  border-radius: 14px;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .04em;
  color: var(--nexus-ink);
  border: none;
  cursor: pointer;
  text-decoration: none;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  box-shadow:
    0 10px 28px rgba(192, 132, 252, 0.22),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
  transition: transform .15s ease, filter .15s ease;
}
button.nexusBtnMain{ font: inherit; }
.nexusBtnMain:active{ transform: scale(.98); }
@media (hover: hover){
  .nexusBtnMain:hover{ filter: brightness(1.06); }
}
.nexusBtnMain--sm{
  padding: 8px 14px;
  font-size: 12px;
  border-radius: 12px;
}

/* 邻近色渐变（紫→靛→天青），签到按钮 */
.nexusBtnMain.nexusBtnMain--soft{
  color: #0b1520;
  background: linear-gradient(115deg, #a78bfa 0%, #8b9cf5 42%, #67d4f7 100%);
  box-shadow:
    0 10px 30px rgba(129, 140, 248, 0.22),
    0 0 0 1px rgba(255, 255, 255, 0.14) inset,
    0 0 26px rgba(125, 211, 252, 0.14);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.12);
  transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.2s ease;
}
@media (hover: hover){
  .nexusBtnMain.nexusBtnMain--soft:hover{
    filter: brightness(1.05);
    box-shadow:
      0 12px 34px rgba(129, 140, 248, 0.26),
      0 0 0 1px rgba(255, 255, 255, 0.16) inset,
      0 0 32px rgba(125, 211, 252, 0.18);
  }
}
.checkinCard .btn.nexusBtnMain{
  border-radius: 999px;
  padding: 10px 18px;
}

/* 与 orders.html 筛选条选中项（如「全部」）同一套：紫青渐变胶囊 */
.pillBtnOrder{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.02em;
  padding: 9px 6px;
  border-radius: 999px;
  border: none;
  cursor: pointer;
  text-decoration: none;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  color: rgba(255, 255, 255, 0.98);
  box-shadow: 0 12px 22px rgba(192, 132, 252, 0.22);
  transition: transform 0.15s ease, filter 0.15s ease;
}
button.pillBtnOrder{ font: inherit; }
.pillBtnOrder:active:not(:disabled){
  transform: scale(0.98);
}
@media (hover: hover){
  .pillBtnOrder:hover:not(:disabled){
    filter: brightness(1.06);
  }
}
.pillBtnOrder--sm{
  padding: 9px 12px;
  font-size: 12px;
}

.nexusModal[hidden]{
  display: none !important;
}
.nexusModal{
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 20px 16px;
  box-sizing: border-box;
}
.nexusModal__backdrop{
  position: absolute;
  inset: 0;
  cursor: pointer;
  background: rgba(4, 5, 10, 0.55);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.nexusModal__panel{
  position: relative;
  z-index: 1;
  width: min(340px, 100%);
  padding: 22px 20px 20px;
  border-radius: 16px;
  border: 1px solid rgba(192, 132, 252, 0.28);
  background: linear-gradient(155deg, rgba(255,255,255,.95), rgba(248,245,255,.88));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75) inset,
    0 24px 80px rgba(0, 0, 0, 0.45),
    0 0 30px rgba(76, 242, 255, 0.06);
  text-align: center;
}
.nexusModal__title{
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: .04em;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .nexusModal__title{ color: #1a1528; background: none; }
}
.nexusModal__msg{
  margin: 0 0 18px;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(35, 28, 70, .88);
}
.nexusModal__msg strong{
  font-weight: 900;
  color: #9333ea;
}

.nexusModal--vipLoginRequired .vipLoginRequiredPanel{
  width: min(320px, 100%);
}
.vipLoginRequiredActions{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin: 4px 0 12px;
}
.vipLoginRequiredActions .nexusBtnMain{
  flex: 1 1 auto;
  min-width: 112px;
  justify-content: center;
}
.vipLoginRequiredLater{
  width: 100%;
}

/* VIP 联系客服弹窗（vip.html） */
.nexusModal--vipService .vipServicePanel{
  width: min(360px, 100%);
  max-height: min(86vh, 680px);
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-align: left;
}
.nexusModal--vipService .vipServiceHead{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 14px 10px;
  border-bottom: 1px solid rgba(192, 132, 252, 0.22);
}
.nexusModal--vipService .vipServiceHead .nexusModal__title{
  margin: 0;
  font-size: 17px;
  text-align: left;
}
.nexusModal--vipService .vipServiceClose{
  flex-shrink: 0;
  border: 0;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: rgba(192, 132, 252, 0.16);
  color: rgba(17, 24, 39, 0.72);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s ease;
}
@media (hover: hover){
  .nexusModal--vipService .vipServiceClose:hover{
    background: rgba(192, 132, 252, 0.28);
  }
}
.nexusModal--vipService .vipServiceBody{
  padding: 12px 16px 18px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1;
  min-height: 0;
}
.nexusModal--vipService .vipServiceBlock{
  margin-bottom: 18px;
}
.nexusModal--vipService .vipServiceBlock:last-child{
  margin-bottom: 0;
}
.nexusModal--vipService .vipServiceBlock__title{
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 850;
  letter-spacing: 0.04em;
  color: rgba(91, 33, 182, 0.95);
}
.nexusModal--vipService .vipServiceQQRow{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0 0 12px;
  font-size: 14px;
}
.nexusModal--vipService .vipServiceQQ__lab{
  font-weight: 750;
  color: rgba(71, 85, 105, 0.88);
}
.nexusModal--vipService .vipServiceQQ__num{
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: rgba(17, 24, 39, 0.9);
}
.nexusModal--vipService .vipServiceCopyQQ{
  margin-left: auto;
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.35);
  background: rgba(255, 255, 255, 0.95);
  font-size: 12px;
  font-weight: 800;
  color: rgba(91, 33, 182, 0.96);
  cursor: pointer;
  font-family: inherit;
}
.nexusModal--vipService .vipServiceQr{
  width: 168px;
  height: 168px;
  margin: 0 auto 10px;
  border-radius: 12px;
  border: 1px solid rgba(192, 132, 252, 0.35);
  background:
    linear-gradient(90deg, rgba(0, 0, 0, 0.06) 1px, transparent 1px),
    linear-gradient(rgba(0, 0, 0, 0.06) 1px, transparent 1px),
    linear-gradient(145deg, rgba(248, 245, 255, 0.95), rgba(255, 255, 255, 0.9));
  background-size: 10px 10px, 10px 10px, auto;
  box-shadow: 0 8px 24px rgba(76, 29, 149, 0.08);
}
.nexusModal--vipService .vipServiceHint,
.nexusModal--vipService .vipServiceLead{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  color: rgba(71, 85, 105, 0.9);
}
.nexusModal--vipService .vipServiceLead{
  margin-bottom: 12px;
}
.nexusModal--vipService .vipServiceOnlineBtn{
  display: inline-flex;
  width: 100%;
  justify-content: center;
  text-decoration: none;
  box-sizing: border-box;
}

.nexusModal__panel--invite{
  width: min(380px, 100%);
  text-align: left;
}
.nexusModal__panel--invite .nexusModal__title{
  text-align: center;
}

/* 邀请推广独立页 invite-promo.html（原 VIP 弹窗内容） */
.invite-promo-page .invitePromoPanel{
  max-width: 400px;
  margin: 0 auto;
}
.invite-promo-page .app{
  padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
}
.invite-promo-page .invitePromoTopbarRow{
  position: relative;
  grid-template-columns: 1fr;
  justify-items: center;
}
.invite-promo-page .invitePromoTopbarRow .left{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.invite-promo-page .invitePromoTopbarRow .title{
  justify-self: center;
  text-align: center;
  padding-left: 0;
  max-width: calc(100% - 72px);
}
.invite-promo-page .invitePromoBackBtn{
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(17, 24, 39, 0.08);
  color: rgba(17, 24, 39, 0.78);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
@media (hover: hover){
  .invite-promo-page .invitePromoBackBtn:hover{
    background: rgba(255, 255, 255, 0.95);
  }
}
.invite-promo-page .invitePromoBackBtn:active{
  transform: scale(0.96);
}
.invite-promo-page .invitePromoBackBtn__ico{
  display: block;
  width: 18px;
  height: 18px;
}

/* VIP 子页 coupons / invite-friends / commission / orders / addresses：无底部 Tab */
.coupons-page .app,
.invite-friends-page .app,
.commission-page .app,
.orders-page .app,
.addresses-page .app{
  padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
}
.coupons-page .vipSubPageTopbarRow,
.invite-friends-page .vipSubPageTopbarRow,
.commission-page .vipSubPageTopbarRow,
.addresses-page .vipSubPageTopbarRow{
  position: relative;
  grid-template-columns: 1fr;
  justify-items: center;
}
.coupons-page .vipSubPageTopbarRow .left,
.invite-friends-page .vipSubPageTopbarRow .left,
.commission-page .vipSubPageTopbarRow .left,
.addresses-page .vipSubPageTopbarRow .left{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.coupons-page .vipSubPageTopbarRow .title,
.invite-friends-page .vipSubPageTopbarRow .title,
.commission-page .vipSubPageTopbarRow .title,
.addresses-page .vipSubPageTopbarRow .title{
  justify-self: center;
  text-align: center;
  padding-left: 0;
  max-width: calc(100% - 72px);
}
.coupons-page .vipSubPageBackBtn,
.invite-friends-page .vipSubPageBackBtn,
.commission-page .vipSubPageBackBtn,
.addresses-page .vipSubPageBackBtn{
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(17, 24, 39, 0.08);
  color: rgba(17, 24, 39, 0.78);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
@media (hover: hover){
  .coupons-page .vipSubPageBackBtn:hover,
  .invite-friends-page .vipSubPageBackBtn:hover,
  .commission-page .vipSubPageBackBtn:hover,
  .addresses-page .vipSubPageBackBtn:hover{
    background: rgba(255, 255, 255, 0.95);
  }
}
.coupons-page .vipSubPageBackBtn:active,
.invite-friends-page .vipSubPageBackBtn:active,
.commission-page .vipSubPageBackBtn:active,
.addresses-page .vipSubPageBackBtn:active{
  transform: scale(0.96);
}
.coupons-page .vipSubPageBackBtn__ico,
.invite-friends-page .vipSubPageBackBtn__ico,
.commission-page .vipSubPageBackBtn__ico,
.addresses-page .vipSubPageBackBtn__ico{
  display: block;
  width: 18px;
  height: 18px;
}
.invite-promo-page .walletTip{
  margin: 0;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px dashed rgba(192, 132, 252, 0.35);
  background: rgba(248, 245, 255, 0.55);
  font-size: 12px;
  line-height: 1.55;
  color: rgba(35, 28, 70, 0.68);
  font-weight: 600;
}
.invite-promo-page .walletTip strong{
  color: rgba(147, 51, 234, 0.9);
  font-weight: 800;
}
.invite-promo-page .invitePromoRules p{
  margin: 0 0 10px;
}
.invite-promo-page .invitePromoRules p:last-child{
  margin-bottom: 0;
}
.invite-promo-page .invitePromoRules__banner{
  margin-top: 12px !important;
  text-align: center;
  font-size: 13px;
}
.invite-promo-page .invitePromoRules__sub{
  margin-top: -4px !important;
  text-align: center;
  color: rgba(35, 28, 70, 0.58);
  font-weight: 650;
}
.invite-promo-page .invitePromoRules__foot{
  margin-top: 4px !important;
  font-weight: 750;
  color: rgba(35, 28, 70, 0.78);
}
.nexusInviteModal__lead{
  margin: 0 0 16px;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(35, 28, 70, .78);
}
.nexusInviteModal__qrwrap{
  margin-bottom: 18px;
  padding: 12px 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(192,132,252,.22);
  background: rgba(255,255,255,.55);
  text-align: center;
}
.nexusInviteModal__qr{
  width: 140px;
  height: 140px;
  margin: 0 auto;
  border-radius: 12px;
  background:
    linear-gradient(90deg, rgba(0,0,0,.08) 1px, transparent 1px),
    linear-gradient(rgba(0,0,0,.08) 1px, transparent 1px);
  background-size: 10px 10px;
  border: 1px solid rgba(192,132,252,.28);
  box-shadow: 0 0 0 1px rgba(255,255,255,.5) inset;
}
.nexusInviteModal__qrtip{
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--muted);
}
.nexusInviteModal__codeRow{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
}
.nexusInviteModal__code{
  margin: 0;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: rgba(35, 28, 70, 0.82);
}
.nexusInviteModal__codeCopyBtn{
  min-width: 92px;
  padding-inline: 12px;
}
.invite-promo-page .nexusInviteCopyBtn,
.invite-promo-page .nexusInviteModal__codeCopyBtn{
  border: 1px solid rgba(14, 116, 144, 0.24);
  background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 42%, #bae6fd 100%);
  color: rgba(8, 47, 73, 0.96);
  box-shadow:
    0 8px 20px rgba(14, 116, 144, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.55) inset;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
  letter-spacing: 0.03em;
  transition: transform 0.14s ease, filter 0.16s ease, box-shadow 0.2s ease;
}
.invite-promo-page .nexusInviteCopyBtn{
  min-width: 72px;
}
@media (hover: hover){
  .invite-promo-page .nexusInviteCopyBtn:hover,
  .invite-promo-page .nexusInviteModal__codeCopyBtn:hover{
    filter: brightness(1.03);
    box-shadow:
      0 10px 24px rgba(14, 116, 144, 0.24),
      0 0 0 1px rgba(255, 255, 255, 0.62) inset,
      0 0 18px rgba(56, 189, 248, 0.22);
  }
}
.invite-promo-page .nexusInviteCopyBtn:active,
.invite-promo-page .nexusInviteModal__codeCopyBtn:active{
  transform: translateY(1px) scale(0.98);
}
.nexusInviteModal__field{
  margin-bottom: 4px;
}
.nexusInviteModal__label{
  display: block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
  color: rgba(35, 28, 70, .78);
  margin-bottom: 8px;
}
.nexusInviteModal__linkRow{
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.nexusInviteModal__linkRow .nexusBtnMain{
  flex-shrink: 0;
}
.nexusInviteModal__input{
  flex: 1;
  min-width: 0;
  border: 1px solid rgba(192,132,252,.28);
  border-radius: 10px;
  padding: 9px 10px;
  font-size: 12px;
  color: rgba(24, 20, 48, .9);
  background: rgba(255,255,255,.92);
  outline: none;
}
.nexusInviteModal__input:focus{
  border-color: rgba(76, 242, 255, 0.55);
  box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.2);
}
.nexusInviteModal__close{
  margin-top: 16px;
  width: 100%;
  justify-content: center;
}

html[data-page="vip"] .topbar{
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 255, 0.96));
  border-bottom: 1px solid rgba(192, 132, 252, 0.22);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.65) inset,
    0 12px 40px rgba(12, 8, 28, 0.05);
}
html[data-page="vip"] .topbar .title{
  font-weight: 800;
  letter-spacing: 0.06em;
  font-size: 15px;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="vip"] .topbar .title{
    color: #1a1528;
    background: none;
  }
}
html[data-page="vip"] .topbar .right{
  justify-self: end;
  color: rgba(35, 30, 55, 0.55);
}
html[data-page="vip"] .vipTopbarActions{
  gap: 8px;
}
html[data-page="vip"] .vipTopbarBtn{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(192, 132, 252, 0.32);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.99), rgba(252, 250, 255, 0.86));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.88) inset,
    0 8px 22px rgba(192, 132, 252, 0.14),
    0 4px 16px rgba(76, 242, 255, 0.07);
  color: rgba(24, 20, 48, 0.9);
  font-size: 12px;
  font-weight: 750;
  letter-spacing: 0.03em;
  cursor: pointer;
  font-family: inherit;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
@media (hover: hover){
  html[data-page="vip"] .vipTopbarBtn:hover{
    border-color: rgba(167, 139, 250, 0.48);
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.95) inset,
      0 10px 28px rgba(192, 132, 252, 0.2),
      0 6px 20px rgba(76, 242, 255, 0.1);
    transform: translateY(-1px);
  }
}
html[data-page="vip"] .vipTopbarBtn:active{
  transform: translateY(0) scale(0.98);
}

/* vip 右上角「设置」— 底部菜单 */
.nexusModal.nexusModal--bottomSheet{
  z-index: 210;
  display: flex;
  align-items: flex-end;
  justify-content: stretch;
  padding: 0;
}
.nexusModal.nexusModal--bottomSheet .nexusModal__panel{
  width: 100%;
  max-width: 100%;
  border-radius: 16px 16px 0 0;
  margin: 0;
  padding: 0 0 calc(14px + env(safe-area-inset-bottom, 0px));
  text-align: left;
  box-sizing: border-box;
}
.nexusModal__panel--vipSettings{
  max-height: min(78vh, 520px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.vipSettingsSheetHd{
  flex-shrink: 0;
  padding: 8px 16px 4px;
  text-align: center;
}
.vipSettingsGrab{
  width: 36px;
  height: 4px;
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.12);
  margin: 0 auto 8px;
}
.vipSettingsSheetTitle{
  margin: 0;
  font-size: 15px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: rgba(17, 24, 39, 0.88);
}
.vipSettingsList{
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 4px 0 0;
}
.vipSettingsList > *{
  border-top: 1px solid rgba(17, 24, 39, 0.06);
}
.vipSettingsList > :first-child{
  border-top: 0;
}
.vipSettingsRow{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 0;
  background: transparent;
  width: 100%;
  box-sizing: border-box;
  font: inherit;
  text-align: left;
  text-decoration: none;
  color: rgba(17, 24, 39, 0.9);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover){
  .vipSettingsRow:hover{
    background: rgba(192, 132, 252, 0.08);
  }
}
.vipSettingsRow:active{
  background: rgba(192, 132, 252, 0.12);
}
.vipSettingsRow__label{
  flex: 1;
  min-width: 0;
  font-size: 15px;
  font-weight: 700;
}
.vipSettingsRow__chev{
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 300;
  color: rgba(17, 24, 39, 0.28);
}
.vipSettingsRow--logout .vipSettingsRow__label{
  color: rgba(220, 38, 38, 0.95);
}
@media (hover: hover){
  .vipSettingsRow--logout:hover{
    background: rgba(254, 226, 226, 0.4);
  }
}
.vipSettingsIcon{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.vipSettingsIcon svg{
  width: 22px;
  height: 22px;
  stroke: currentColor;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.vipSettingsIcon--faq{
  color: rgba(255, 255, 255, 0.98);
  background: linear-gradient(135deg, rgba(255, 84, 140, 0.92), rgba(255, 176, 71, 0.9));
}
.vipSettingsIcon--privacy{
  color: rgba(255, 255, 255, 0.98);
  background: linear-gradient(135deg, rgba(63, 195, 154, 0.95), rgba(152, 255, 194, 0.9));
}
.vipSettingsIcon--terms{
  color: rgba(255, 255, 255, 0.98);
  background: linear-gradient(135deg, rgba(160, 110, 255, 0.95), rgba(226, 186, 255, 0.92));
}
.vipSettingsIcon--pwd{
  color: rgba(255, 255, 255, 0.98);
  background: linear-gradient(135deg, rgba(17, 24, 39, 0.86), rgba(59, 70, 90, 0.86));
}
.vipSettingsIcon--logout{
  color: rgba(255, 255, 255, 0.98);
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.95), rgba(251, 113, 133, 0.92));
}

.nexusModal.nexusModal--vipLegal{
  z-index: 220;
}
.nexusModal__panel--vipLegal{
  width: min(400px, 100%);
  max-height: min(82vh, 620px);
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0;
  overflow: hidden;
}
.nexusModal__panel--vipResetPwd{
  max-height: min(80vh, 520px);
}
.vipLegalModal__head{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 10px 16px;
  border-bottom: 1px solid rgba(17, 24, 39, 0.08);
}
.vipLegalModal__title{
  margin: 0;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0.04em;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .vipLegalModal__title{
    color: #1a1528;
    background: none;
  }
}
.vipLegalModal__close{
  flex-shrink: 0;
  border: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(192, 132, 252, 0.16);
  color: rgba(17, 24, 39, 0.72);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s ease;
}
@media (hover: hover){
  .vipLegalModal__close:hover{
    background: rgba(192, 132, 252, 0.28);
  }
}
.vipLegalModal__body{
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 14px 16px 18px;
  font-size: 13px;
  line-height: 1.65;
  color: rgba(35, 28, 70, 0.88);
}
.vipLegalModal__body h3{
  margin: 14px 0 8px;
  font-size: 13px;
  font-weight: 800;
  color: rgba(147, 51, 234, 0.92);
}
.vipLegalModal__body h3:first-child{
  margin-top: 0;
}
.vipLegalModal__body p{
  margin: 0 0 10px;
}
.vipLegalModal__body ol,
.vipLegalModal__body ul{
  margin: 0 0 10px;
  padding-left: 1.25em;
}
.vipLegalModal__body li{
  margin-bottom: 6px;
}
.vipLegalModal__body strong{
  font-weight: 800;
  color: rgba(17, 24, 39, 0.82);
}
.vipResetPwdModal__body.vipLegalModal__body{
  padding: 8px 12px 10px;
}
.nexusModal__panel--vipResetPwd .vipLegalModal__head{
  padding: 8px 12px 6px 12px;
  gap: 8px;
}
.nexusModal__panel--vipResetPwd .vipLegalModal__title{
  font-size: 15px;
}
.nexusModal__panel--vipResetPwd .vipLegalModal__close{
  width: 32px;
  height: 32px;
  font-size: 19px;
  border-radius: 9px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .field{
  margin-bottom: 8px;
  gap: 8px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .field.field-tall .lbl{
  padding-top: 6px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .field-body{
  gap: 4px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd label.lbl{
  font-size: 12px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd input[type="text"],
.nexusModal__panel--vipResetPwd #formVipResetPwd input[type="password"]{
  padding: 7px 46px 7px 10px;
  font-size: 14px;
  border-radius: 10px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd input:focus{
  box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.2);
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .pw-toggle{
  padding: 4px 8px;
  font-size: 11px;
  border-radius: 7px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .strength{
  gap: 6px;
  min-height: 14px;
  font-size: 11px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .strength-bar{
  max-width: 118px;
  height: 3px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .msg{
  min-height: 14px;
  margin-top: 2px;
  margin-bottom: 2px;
  font-size: 12px;
}
.nexusModal__panel--vipResetPwd #formVipResetPwd .btn-main{
  margin-top: 6px;
  padding: 10px 14px;
  font-size: 14px;
  border-radius: 12px;
}
/* 与 注册.html 表单结构一致，配色适配会员中心浅色弹窗 */
#formVipResetPwd label.lbl{
  font-size: 13px;
  color: rgba(35, 28, 70, 0.62);
  letter-spacing: 0.04em;
  white-space: nowrap;
  flex-shrink: 0;
  width: 6.5em;
  text-align: right;
  padding-right: 4px;
}
#formVipResetPwd .field{
  margin-bottom: 14px;
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 12px;
}
#formVipResetPwd .field.field-tall{
  align-items: flex-start;
}
#formVipResetPwd .field.field-tall .lbl{
  padding-top: 10px;
}
#formVipResetPwd .field-body{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#formVipResetPwd .input-wrap{
  position: relative;
  width: 100%;
}
#formVipResetPwd input[type="text"],
#formVipResetPwd input[type="password"]{
  width: 100%;
  box-sizing: border-box;
  padding: 11px 52px 11px 12px;
  border-radius: 12px;
  border: 1px solid rgba(192, 132, 252, 0.32);
  background: rgba(255, 255, 255, 0.94);
  color: rgba(17, 24, 39, 0.92);
  font-size: 15px;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}
#formVipResetPwd input.no-toggle{
  padding-right: 12px;
}
#formVipResetPwd input:focus{
  border-color: rgba(147, 51, 234, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.18);
}
#formVipResetPwd .pw-toggle{
  position: absolute;
  right: 4px;
  top: 50%;
  transform: translateY(-50%);
  border: none;
  background: rgba(192, 132, 252, 0.14);
  color: rgba(124, 58, 237, 0.95);
  font-size: 12px;
  padding: 6px 10px;
  border-radius: 8px;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.2s;
}
@media (hover: hover){
  #formVipResetPwd .pw-toggle:hover{
    background: rgba(76, 242, 255, 0.18);
  }
}
#formVipResetPwd .strength{
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  min-height: 18px;
}
#formVipResetPwd .strength-bar{
  flex: 1;
  max-width: 140px;
  height: 4px;
  border-radius: 99px;
  background: rgba(17, 24, 39, 0.08);
  overflow: hidden;
}
#formVipResetPwd .strength-bar .sf{
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  transition: width 0.25s, background 0.25s;
}
#formVipResetPwd .strength.weak .strength-bar .sf{
  width: 33%;
  background: #fb7185;
}
#formVipResetPwd .strength.mid .strength-bar .sf{
  width: 66%;
  background: #fbbf24;
}
#formVipResetPwd .strength.strong .strength-bar .sf{
  width: 100%;
  background: #34d399;
}
#formVipResetPwd .strength.none .strength-bar .sf{
  width: 0%;
}
#formVipResetPwd .strength-text{
  color: rgba(35, 28, 70, 0.55);
}
#formVipResetPwd .strength.weak .strength-text{
  color: rgba(220, 38, 38, 0.88);
}
#formVipResetPwd .strength.mid .strength-text{
  color: rgba(180, 83, 9, 0.9);
}
#formVipResetPwd .strength.strong .strength-text{
  color: rgba(5, 150, 105, 0.95);
}
#formVipResetPwd .msg{
  min-height: 20px;
  margin-top: 6px;
  margin-bottom: 4px;
  font-size: 13px;
  text-align: center;
  font-weight: 700;
}
#formVipResetPwd .msg.err{
  color: #e11d48;
}
#formVipResetPwd .msg.ok{
  color: #059669;
}
#formVipResetPwd .btn-main{
  width: 100%;
  margin-top: 10px;
  margin-left: 0;
  padding: 14px 18px;
  border: none;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.08em;
  cursor: pointer;
  color: #0c0614;
  background: linear-gradient(95deg, #c084fc, #4cf2ff);
  box-shadow:
    0 10px 40px rgba(192, 132, 252, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.12) inset;
  transition: transform 0.15s, filter 0.15s;
  font-family: inherit;
}
@media (hover: hover){
  #formVipResetPwd .btn-main:hover{
    filter: brightness(1.06);
    transform: translateY(-1px);
  }
}
#formVipResetPwd .btn-main:active{
  transform: translateY(0) scale(0.98);
}
@media (max-width: 440px){
  #formVipResetPwd .field{
    flex-wrap: wrap;
  }
  #formVipResetPwd label.lbl{
    width: 100%;
    text-align: left;
    padding-right: 0;
  }
}

.nexusBuyCard{
  border-radius: calc(var(--radius) + 4px);
  padding: 16px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(192, 132, 252, 0.28);
  background: linear-gradient(155deg, rgba(255,255,255,.95), rgba(248,245,255,.88));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75) inset,
    0 10px 40px rgba(12, 8, 32, 0.08),
    0 0 40px rgba(76, 242, 255, 0.06);
}
.nexusBuyCard::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(120px 100px at 0% 0%, rgba(192,132,252,.12), transparent 60%),
    radial-gradient(140px 120px at 100% 0%, rgba(76,242,255,.1), transparent 55%);
}
.nexusBuyCard__inner{
  position: relative;
  z-index: 1;
  display: grid;
  gap: 14px;
}
.nexusBuyCard__row{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}
.nexusBuyCard__badge{
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  background: linear-gradient(95deg, rgba(192,132,252,.2), rgba(76,242,255,.2));
  border: 1px solid rgba(192,132,252,.35);
  color: rgba(50, 35, 90, .88);
}
.nexusBuyCard__title{
  margin: 8px 0 0;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(20, 18, 40, .92);
}
.nexusBuyCard__meta{
  margin: 8px 0 0;
  font-size: 12px;
  color: rgba(70, 65, 95, .65);
  font-weight: 600;
  line-height: 1.35;
}
.nexusBuyCard__priceCol{
  text-align: right;
  flex-shrink: 0;
}
.nexusBuyCard__price{
  font-size: 24px;
  font-weight: 950;
  line-height: 1.1;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .nexusBuyCard__price{ color: #6d28d9; background: none; }
}
.nexusBuyCard__priceHint{
  margin-top: 4px;
  font-size: 11px;
  color: rgba(100, 90, 130, .55);
  font-weight: 700;
}
.nexusBuyCard__visual{
  border-radius: 16px;
  min-height: 148px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(192, 132, 252, 0.22);
  background:
    radial-gradient(120px 90px at 20% 25%, rgba(192,132,252,.2), transparent 60%),
    radial-gradient(120px 80px at 85% 70%, rgba(76,242,255,.18), transparent 58%),
    linear-gradient(160deg, rgba(255,255,255,.95), rgba(236, 245, 255, .75));
  position: relative;
  overflow: hidden;
}
.nexusBuyCard__visual::after{
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(from 200deg at 50% 50%, transparent 0 25%, rgba(76,242,255,.04) 25% 35%, transparent 35% 60%, rgba(192,132,252,.05) 60% 72%, transparent 72%);
  animation: nexusBuySpin 48s linear infinite;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce){
  .nexusBuyCard__visual::after{ animation: none; }
}
@keyframes nexusBuySpin{
  to{ transform: rotate(360deg); }
}
.nexusBuyCard__phLabel{
  position: relative;
  z-index: 1;
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .04em;
  color: rgba(60, 55, 95, .45);
}
.nexusBuyCard__foot{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.nexusBuyCard__countdown{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(45, 40, 75, .78);
}
.nexusBuyCard__clock{
  width: 15px;
  height: 15px;
  color: var(--nexus-cyan);
  flex-shrink: 0;
}

/* 首页 · 底部购买卡科技风（index.html） */
html[data-page="home"] .section.section--pb{
  padding-top: 6px;
  padding-bottom: 8px;
}
html[data-page="home"] .nexusBuyStack{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
html[data-page="home"] .nexusBuyCard--tech{
  --buy-a: 56, 189, 248;
  --buy-b: 192, 132, 252;
  padding: 0;
  border: 1px solid rgba(var(--buy-a), 0.35);
  background:
    linear-gradient(165deg, rgba(15, 23, 42, 0.06) 0%, transparent 42%),
    linear-gradient(155deg, rgba(255, 255, 255, 0.97), rgba(241, 245, 255, 0.9));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.65) inset,
    0 0 48px rgba(var(--buy-a), 0.12),
    0 16px 48px rgba(15, 23, 42, 0.1);
}
html[data-page="home"] .nexusBuyCard--tech::before{
  opacity: 0.85;
  background:
    radial-gradient(160px 120px at 8% 0%, rgba(var(--buy-a), 0.18), transparent 62%),
    radial-gradient(180px 140px at 96% 8%, rgba(var(--buy-b), 0.16), transparent 58%);
}
html[data-page="home"] .nexusBuyCard__glow{
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(120deg, rgba(var(--buy-a), 0.35), rgba(var(--buy-b), 0.25), rgba(var(--buy-a), 0.3));
  opacity: 0.45;
  filter: blur(18px);
  z-index: 0;
  animation: nexusBuyTechGlow 5s ease-in-out infinite;
}
html[data-page="home"] .nexusBuyCard--tech.nexusBuyCard--toneEmerald{
  --buy-a: 16, 185, 129;
  --buy-b: 45, 212, 191;
}
html[data-page="home"] .nexusBuyCard--tech.nexusBuyCard--toneAmber{
  --buy-a: 245, 158, 11;
  --buy-b: 251, 146, 60;
}
html[data-page="home"] .nexusBuyCard--tech.nexusBuyCard--toneRose{
  --buy-a: 244, 63, 94;
  --buy-b: 217, 70, 239;
}
html[data-page="home"] .nexusBuyCard--tech.nexusBuyCard--toneIndigo{
  --buy-a: 99, 102, 241;
  --buy-b: 125, 211, 252;
}
html[data-page="home"] .nexusBuyCard--tech.nexusBuyCard--toneLime{
  --buy-a: 132, 204, 22;
  --buy-b: 34, 197, 94;
}
html[data-page="home"] .nexusBuyCard--tech.nexusBuyCard--toneViolet{
  --buy-a: 139, 92, 246;
  --buy-b: 236, 72, 153;
}
@media (prefers-reduced-motion: reduce){
  html[data-page="home"] .nexusBuyCard__glow{
    animation: none;
    opacity: 0.28;
  }
}
@keyframes nexusBuyTechGlow{
  0%,
  100%{
    opacity: 0.35;
    transform: scale(1);
  }
  50%{
    opacity: 0.52;
    transform: scale(1.02);
  }
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__inner{
  padding: 10px 12px 11px;
  gap: 8px;
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__row{
  gap: 8px;
  align-items: center;
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__foot{
  gap: 8px;
  padding-right: 76px;
}
html[data-page="home"] .nexusBuyCard__split{
  display: flex;
  align-items: stretch;
  gap: 10px;
}
html[data-page="home"] .nexusBuyCard__main{
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
html[data-page="home"] .nexusBuyCard__main .nexusBuyCard__foot{
  margin-top: auto;
}
html[data-page="home"] .nexusBuyCard__main .nexusBuyCard__row{
  align-items: flex-start;
}
html[data-page="home"] .nexusBuyCard__topbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  padding-bottom: 6px;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(var(--buy-a), 0.2);
}
html[data-page="home"] .nexusBuyCard__topbarBrand{
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(var(--buy-a), 0.92);
  text-shadow: 0 0 18px rgba(var(--buy-a), 0.45);
}
html[data-page="home"] .nexusBuyCard__topbarSn{
  font-size: 10px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  color: rgba(100, 116, 139, 0.88);
}
html[data-page="home"] .nexusBuyCard__topbar--tierPick{
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 8px 10px;
  flex-wrap: wrap;
}
html[data-page="home"] .nexusBuyCard__topbar--tierPick .nexusBuyCard__topbarBrand{
  flex-shrink: 0;
  line-height: 1.2;
}
html[data-page="home"] .nexusBuyCard__topbar--tierPick .nexusBuyTierBar{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex: 1 1 auto;
  min-width: 0;
}
html[data-page="home"] .nexusBuyTierBtn{
  margin: 0;
  padding: 8px 14px;
  min-height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(var(--buy-a), 0.32);
  background: rgba(255, 255, 255, 0.55);
  font: inherit;
  font-size: 13px;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
  color: rgba(30, 41, 59, 0.88);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}
html[data-page="home"] .nexusBuyTierBtn.is-active{
  border-color: rgba(var(--buy-a), 0.55);
  background: linear-gradient(115deg, rgba(var(--buy-a), 0.22), rgba(var(--buy-b), 0.18));
  color: rgba(76, 29, 149, 0.96);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.45) inset;
}
@media (hover: hover){
  html[data-page="home"] .nexusBuyTierBtn:hover:not(.is-active){
    border-color: rgba(var(--buy-a), 0.42);
    background: rgba(255, 255, 255, 0.78);
  }
}
html[data-page="home"] .nexusBuyTierBtn:active{
  transform: scale(0.98);
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__badge{
  padding: 3px 8px;
  font-size: 11px;
  border-color: rgba(var(--buy-a), 0.45);
  background: linear-gradient(95deg, rgba(var(--buy-a), 0.15), rgba(var(--buy-b), 0.14));
  color: rgba(30, 41, 59, 0.92);
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__title{
  margin-top: 4px;
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.03em;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__meta{
  margin-top: 4px;
  font-size: 11px;
  line-height: 1.3;
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__price{
  font-size: 22px;
  background: linear-gradient(115deg, rgba(var(--buy-a), 0.98), rgba(var(--buy-b), 0.95));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__price{
    color: rgb(var(--buy-a));
    background: none;
  }
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__priceHint{
  margin-top: 2px;
  font-size: 10px;
}
html[data-page="home"] .nexusBuyCard__visual--tech{
  border-radius: 10px;
  border: 1px solid rgba(var(--buy-a), 0.28);
  background:
    linear-gradient(rgba(var(--buy-a), 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(var(--buy-a), 0.04) 1px, transparent 1px),
    radial-gradient(100% 80% at 50% 0%, rgba(var(--buy-a), 0.12), transparent 55%),
    radial-gradient(90px 70px at 88% 78%, rgba(var(--buy-b), 0.2), transparent 65%),
    linear-gradient(165deg, rgba(15, 23, 42, 0.06), rgba(248, 250, 252, 0.95));
  background-size:
    100% 10px,
    10px 100%,
    auto,
    auto,
    auto;
}
html[data-page="home"] .nexusBuyCard__split .nexusBuyCard__visual--tech{
  flex: 0 0 104px;
  width: 104px;
  min-width: 104px;
  min-height: 104px;
  height: auto;
  max-height: none;
  align-self: stretch;
}
html[data-page="home"] .nexusBuyCard__visual--tech::after{
  opacity: 0.55;
  background: conic-gradient(
    from 220deg at 50% 50%,
    transparent 0 28%,
    rgba(var(--buy-a), 0.07) 28% 36%,
    transparent 36% 62%,
    rgba(var(--buy-b), 0.08) 62% 74%,
    transparent 74%
  );
}
html[data-page="home"] .nexusBuyCard__grid{
  position: absolute;
  inset: 0;
  opacity: 0.35;
  background-image: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 9px,
    rgba(var(--buy-a), 0.09) 9px,
    rgba(var(--buy-a), 0.09) 10px
  );
  pointer-events: none;
}
html[data-page="home"] .nexusBuyCard__corners{
  position: absolute;
  inset: 4px;
  pointer-events: none;
  z-index: 1;
}
html[data-page="home"] .nexusBuyCard__corners span{
  position: absolute;
  width: 11px;
  height: 11px;
  border: 1.5px solid rgba(var(--buy-a), 0.55);
  box-shadow: 0 0 12px rgba(var(--buy-a), 0.25);
}
html[data-page="home"] .nexusBuyCard__corners span:nth-child(1){
  top: 0;
  left: 0;
  border-right: 0;
  border-bottom: 0;
}
html[data-page="home"] .nexusBuyCard__corners span:nth-child(2){
  top: 0;
  right: 0;
  border-left: 0;
  border-bottom: 0;
}
html[data-page="home"] .nexusBuyCard__corners span:nth-child(3){
  bottom: 0;
  left: 0;
  border-right: 0;
  border-top: 0;
}
html[data-page="home"] .nexusBuyCard__corners span:nth-child(4){
  bottom: 0;
  right: 0;
  border-left: 0;
  border-top: 0;
}
html[data-page="home"] .nexusBuyCard__split .nexusBuyCard__visualCore{
  padding: 4px;
}
html[data-page="home"] .nexusBuyCard__visualCore{
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  text-align: center;
  padding: 4px 6px;
  max-width: 100%;
}
html[data-page="home"] .nexusBuyCard__sku{
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(var(--buy-a), 0.95);
  text-shadow: 0 0 20px rgba(var(--buy-a), 0.4);
}
html[data-page="home"] .nexusBuyCard--tech .nexusBuyCard__phLabel{
  font-size: 10px;
  font-weight: 750;
  letter-spacing: 0.04em;
  line-height: 1.25;
  color: rgba(51, 65, 85, 0.72);
}
html[data-page="home"] .nexusBuyCard__countdown--tech{
  padding: 5px 9px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(var(--buy-a), 0.25);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06) inset, 0 8px 24px rgba(15, 23, 42, 0.2);
}
html[data-page="home"] .nexusBuyCard__countdown--tech .nexusBuyCard__clock{
  width: 14px;
  height: 14px;
  color: rgba(var(--buy-a), 0.95);
  filter: drop-shadow(0 0 6px rgba(var(--buy-a), 0.5));
}
html[data-page="home"] .nexusBuyCard__countdownTxt{
  font-size: 12px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  color: rgba(226, 232, 240, 0.95);
}
html[data-page="home"] .nexusBuyCard__countdownTxt time{
  color: rgba(52, 211, 153, 0.98);
  text-shadow: 0 0 12px rgba(52, 211, 153, 0.35);
}
html[data-page="home"] .nexusBuyCard__cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.06em;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.14) inset,
    0 12px 32px rgba(var(--buy-b), 0.28),
    0 0 28px rgba(var(--buy-a), 0.22);
}
html[data-page="home"] .nexusBuyCard__ctaIcon{
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  stroke: currentColor;
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.35));
}

html[data-page="home"] .nexusBuyRewardFab{
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 6;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  color: rgba(15, 23, 42, 0.92);
  border: 1px solid rgba(var(--buy-a), 0.5);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.94));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.65) inset,
    0 4px 14px rgba(var(--buy-a), 0.22);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
html[data-page="home"] .nexusBuyRewardFab:hover{
  filter: brightness(1.02);
}
html[data-page="home"] .nexusBuyRewardFab:focus-visible{
  outline: 2px solid rgba(var(--buy-a), 0.55);
  outline-offset: 2px;
}
html[data-page="home"] .nexusModal__panel--buyReward{
  width: min(340px, 100%);
  text-align: left;
}
html[data-page="home"] .nexusModal__panel--buyReward .nexusModal__title{
  text-align: center;
}
html[data-page="home"] .nexusBuyRewardModal__lead{
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.55;
  color: rgba(35, 28, 70, 0.78);
}
html[data-page="home"] .nexusBuyRewardModal__list{
  margin: 0;
  padding: 0;
  list-style: none;
}
html[data-page="home"] .nexusBuyRewardModal__list li{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 10px;
  font-size: 13px;
  line-height: 1.45;
  color: rgba(35, 28, 70, 0.88);
}
html[data-page="home"] .nexusBuyRewardModal__list li:last-child{
  margin-bottom: 0;
}
html[data-page="home"] .nexusBuyRewardModal__tag{
  flex-shrink: 0;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  background: linear-gradient(95deg, rgba(56, 189, 248, 0.16), rgba(192, 132, 252, 0.14));
  border: 1px solid rgba(192, 132, 252, 0.22);
  color: rgba(88, 28, 135, 0.9);
}
html[data-page="home"] .nexusModal__panel--buyReward .nexusBtnMain{
  display: block;
  margin-inline: auto;
  min-width: 132px;
}

.nexusPromoBanner{
  border: 1px solid rgba(192, 132, 252, 0.22);
  background: linear-gradient(135deg, rgba(192,132,252,.12), rgba(76,242,255,.1));
  box-shadow: 0 0 0 1px rgba(255,255,255,.5) inset;
}
.nexusPromoBanner__row{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.nexusPromoBanner__text{
  font-weight: 800;
  font-size: 14px;
  line-height: 1.35;
  color: rgba(35, 28, 70, .88);
}

.nexusInviteCard{
  border: 1px solid rgba(192, 132, 252, 0.22);
  background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(248,245,255,.94));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75) inset,
    0 10px 32px rgba(192, 132, 252, 0.1),
    0 0 40px rgba(76, 242, 255, 0.05);
}
.nexusInviteCard__head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.nexusInviteCard__title{
  font-weight: 900;
  font-size: 15px;
  line-height: 1.3;
  letter-spacing: .02em;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .nexusInviteCard__title{ color: #1a1528; background: none; }
}
.nexusInviteCard__stats{
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.nexusInviteCard__stats .stat{ margin-top: 0; }
.nexusInviteCard__stats .v{
  color: rgba(24, 20, 48, .88);
  font-weight: 950;
}

.nexusQrBody{ padding-top: 8px; }
.nexusQrBody .name{ margin-bottom: 0; }

html[data-page="points"] body{
  background:
    radial-gradient(620px 400px at 88% 5%, rgba(192,132,252,.10), transparent 55%),
    radial-gradient(520px 440px at 5% 12%, rgba(76,242,255,.09), transparent 55%),
    var(--bg);
}
html[data-page="points"] .topbar{
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(248,245,255,.95));
  border-bottom: 1px solid rgba(192, 132, 252, 0.22);
  box-shadow:
    0 1px 0 rgba(255,255,255,.65) inset,
    0 12px 40px rgba(12, 8, 28, 0.05);
}
html[data-page="points"] .topbar .title{
  font-weight: 800;
  letter-spacing: .06em;
  font-size: 15px;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="points"] .topbar .title{
    color: #1a1528;
    background: none;
  }
}
html[data-page="points"] .topbar .right{
  justify-self: end;
}
html[data-page="points"] .topbar .chip{
  padding: 7px 12px;
  gap: 6px;
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(255,255,255,.72));
  border: 1px solid rgba(192, 132, 252, 0.3);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75) inset,
    0 10px 28px rgba(192, 132, 252, 0.14),
    0 8px 24px rgba(76, 242, 255, 0.08);
  color: rgba(24, 20, 48, 0.82);
  font-weight: 700;
  font-size: 11px;
  letter-spacing: .02em;
}
html[data-page="points"] .topbar .pointsTopTotalBtn{
  margin: 0;
  font: inherit;
  cursor: default;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  max-width: min(200px, 46vw);
}
html[data-page="points"] .topbar .pointsTopTotalBtn__lab{
  font-weight: 750;
  opacity: 0.92;
}
html[data-page="points"] .topbar .pointsTopTotalBtn__val{
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  font-size: 13px;
  background: linear-gradient(95deg, var(--nexus-violet), #ea580c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="points"] .topbar .pointsTopTotalBtn__val{
    color: rgba(91, 33, 182, 0.96);
    background: none;
  }
}
html[data-page="points"] .nexusPointsCard{
  border: 1px solid rgba(192, 132, 252, 0.22);
  background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(248,245,255,.94));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.75) inset,
    0 10px 36px rgba(12, 8, 28, 0.05);
}
html[data-page="points"] .section--pointsCheckin{
  padding-top: 8px;
}
html[data-page="points"] .nexusPointsCard.card.pad{
  padding: 10px 12px;
}
html[data-page="points"] .checkinCard--jifen{
  align-items: center;
  gap: 8px;
}
html[data-page="points"] .checkinCard__kicker{
  margin-bottom: 4px;
  padding: 2px 8px;
  font-size: 11px;
}
html[data-page="points"] .checkinCard .big{
  font-size: 15px;
  line-height: 1.25;
}
html[data-page="points"] .checkinCard__hint{
  margin: 4px 0 0;
  font-size: 11px;
  line-height: 1.35;
}
html[data-page="points"] .checkinCard .btn.nexusBtnMain{
  padding: 8px 14px;
  font-size: 12px;
  align-self: center;
}
html[data-page="points"] .days{
  margin-top: 8px;
  display: grid;
  grid-template-columns: unset;
  grid-auto-flow: column;
  grid-auto-columns: minmax(82px, 28vw);
  gap: 6px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}
html[data-page="points"] .days .day{
  scroll-snap-align: start;
}
html[data-page="points"] .day{
  padding: 6px 8px;
  min-width: 0;
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(20, 24, 40, 0.04);
  border-color: rgba(192,132,252,.18);
  background: rgba(255,255,255,.9);
}
html[data-page="points"] .day .n{
  font-size: 10px;
  line-height: 1.2;
}
html[data-page="points"] .day .gift{
  margin: 4px auto;
  width: 14px;
  height: 14px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(192,132,252,.3), rgba(76,242,255,.2));
  border-color: rgba(192,132,252,.38);
}
html[data-page="points"] .day .gift .gift__icon{
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  color: rgba(88, 28, 135, 0.88);
  filter: drop-shadow(0 0.5px 0.8px rgba(55, 48, 120, 0.2));
}
html[data-page="points"] .day .val{
  font-size: 10px;
  line-height: 1.25;
}
html[data-page="points"] .day .gift--jackpot{
  background: linear-gradient(135deg, rgba(192,132,252,.42), rgba(255,214,102,.28));
  border-color: rgba(255,214,102,.45);
}
html[data-page="points"] .day .gift--jackpot .gift__icon{
  color: rgba(180, 83, 9, 0.92);
  filter: drop-shadow(0 0.5px 1px rgba(146, 64, 14, 0.35));
}
html[data-page="points"] .day.day--done{
  border-color: rgba(94, 242, 184, 0.42);
  background: linear-gradient(155deg, rgba(255,255,255,.95), rgba(240,255,250,.88));
  box-shadow:
    0 0 0 1px rgba(255,255,255,.6) inset,
    0 8px 20px rgba(94, 242, 184, 0.15);
}
html[data-page="points"] .day.day--done .n{
  color: rgba(18, 100, 72, .88);
}
html[data-page="points"] .day.day--done .val{
  color: rgba(20, 100, 70, .82);
}
html[data-page="points"] .day.day--done .gift{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  background: linear-gradient(135deg, rgba(94, 242, 184, 0.55), rgba(76,242,255,.35));
  border-color: rgba(94, 242, 184, 0.55);
}
html[data-page="points"] .day.day--done .gift .gift__icon{
  display: none;
}
html[data-page="points"] .day.day--done .gift::after{
  content: "✓";
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
  color: var(--nexus-ink);
}
.checkinCard .btn.nexusBtnMain:disabled{
  opacity: 0.72;
  cursor: not-allowed;
  transform: none;
}
.checkinCard .btn.nexusBtnMain.nexusBtnMain--soft:disabled{
  text-shadow: none;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset;
  filter: grayscale(0.12);
}
@media (hover: hover){
  .checkinCard .btn.nexusBtnMain:disabled:hover{
    filter: none;
    opacity: 0.72;
  }
  .checkinCard .btn.nexusBtnMain.nexusBtnMain--soft:disabled:hover{
    filter: grayscale(0.12);
  }
}
html[data-page="points"] .sectionHeader h2{
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="points"] .sectionHeader h2{ color: #1a1528; background: none; }
}
html[data-page="points"] .product{
  border-color: rgba(192,132,252,.22);
}
html[data-page="points"] .ph--p1{
  background:
    radial-gradient(120px 80px at 30% 30%, rgba(192,132,252,.2), transparent 60%),
    radial-gradient(120px 80px at 70% 70%, rgba(76,242,255,.18), transparent 60%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
html[data-page="points"] .ph--p2{
  background:
    radial-gradient(120px 80px at 25% 30%, rgba(76,242,255,.22), transparent 60%),
    radial-gradient(120px 80px at 75% 70%, rgba(192,132,252,.2), transparent 60%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
html[data-page="points"] .ph--p3{
  background:
    radial-gradient(120px 80px at 30% 30%, rgba(192,132,252,.22), transparent 60%),
    radial-gradient(120px 80px at 70% 75%, rgba(76,242,255,.2), transparent 60%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
html[data-page="points"] .price--nexus{
  background: linear-gradient(95deg, #c084fc, #4cf2ff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  html[data-page="points"] .price--nexus{ color: #7c3aed; background: none; }
}
html[data-page="points"] .qrCard--nexus{
  border-color: rgba(192,132,252,.22);
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(245,245,255,.95));
}
html[data-page="points"] .qrCard--nexus .qr{
  border-color: rgba(192,132,252,.25);
}

.tabbar{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 80;
  padding: 8px 10px 10px;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(14px);
  border-top: 1px solid rgba(17, 24, 39, .08);
}
.tabbar .wrap{
  width: min(430px, 100%);
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  gap: 2px;
}
.tab{
  flex: 1;
  min-width: 0;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 4px;
  padding: 8px 0;
  border-radius: 14px;
  color: rgba(0,0,0,.55);
  font-size: 11px;
  font-weight: 700;
}
.tab .dot{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(192,132,252,.10), rgba(76,242,255,.07));
  border: 1px solid rgba(192,132,252,.22);
  color: rgba(45, 42, 72, .52);
  display: grid;
  place-items: center;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.tab .dot svg{
  width: 18px;
  height: 18px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tab .dot svg path{
  stroke-width: 1.65;
}
.tab[aria-current="page"]{
  color: rgba(20, 18, 40, .92);
  font-weight: 800;
}
.tab[aria-current="page"] .dot{
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  border-color: rgba(255,255,255,.14);
  color: var(--nexus-ink);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 10px 28px rgba(192,132,252,.22),
    0 0 20px rgba(76,242,255,.12);
  transform: translateY(-1px);
}
.tab[aria-current="page"] .dot svg path{
  stroke-width: 1.75;
}

/* 主导航四页：底部 Tab 更紧凑（index / shop / points / vip） */
html[data-page="home"],
html[data-page="shop"],
html[data-page="points"],
html[data-page="vip"]{
  --tabH: 50px;
}
html[data-page="home"] .app,
html[data-page="shop"] .app,
html[data-page="points"] .app,
html[data-page="vip"] .app{
  padding-bottom: calc(var(--tabH) + 10px);
}
html[data-page="home"] .tabbar,
html[data-page="shop"] .tabbar,
html[data-page="points"] .tabbar,
html[data-page="vip"] .tabbar{
  padding: 4px 8px calc(4px + env(safe-area-inset-bottom, 0px));
}
html[data-page="home"] .tab,
html[data-page="shop"] .tab,
html[data-page="points"] .tab,
html[data-page="vip"] .tab{
  gap: 2px;
  padding: 3px 0 4px;
  font-size: 10px;
  border-radius: 12px;
}
html[data-page="home"] .tab .dot,
html[data-page="shop"] .tab .dot,
html[data-page="points"] .tab .dot,
html[data-page="vip"] .tab .dot{
  width: 24px;
  height: 24px;
}
html[data-page="home"] .tab .dot svg,
html[data-page="shop"] .tab .dot svg,
html[data-page="points"] .tab .dot svg,
html[data-page="vip"] .tab .dot svg{
  width: 15px;
  height: 15px;
}
html[data-page="home"] .tab[aria-current="page"] .dot,
html[data-page="shop"] .tab[aria-current="page"] .dot,
html[data-page="points"] .tab[aria-current="page"] .dot,
html[data-page="vip"] .tab[aria-current="page"] .dot{
  transform: translateY(0);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 6px 18px rgba(192,132,252,.2),
    0 0 14px rgba(76,242,255,.1);
}

.iconItem .i{
  color: rgba(17, 24, 39, .72);
}
.iconItem .i svg{
  width: 19px;
  height: 19px;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.iconItem .i.v1{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(255,107,74,.95), rgba(255,176,71,.95)); }
.iconItem .i.v2{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(78,169,255,.95), rgba(124,210,255,.95)); }
.iconItem .i.v3{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(63,195,154,.95), rgba(152,255,194,.90)); }
.iconItem .i.v4{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(160,110,255,.95), rgba(226,186,255,.92)); }
.iconItem .i.v5{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(17,24,39,.86), rgba(59,70,90,.86)); }
.iconItem .i.v6{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(255,84,140,.92), rgba(255,176,71,.90)); }
.iconItem .i.v7{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(0,176,255,.92), rgba(0,212,255,.88)); }
.iconItem .i.v8{ color: rgba(255,255,255,.98); background: linear-gradient(135deg, rgba(126,87,255,.92), rgba(78,169,255,.90)); }

.orderBack{
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(0,0,0,.76);
  text-decoration: none;
}
.orderBack:hover{
  opacity: .88;
}

/* 平台优惠券列表（coupons.html） */
html.coupons-page body{
  background:
    radial-gradient(560px 380px at 90% 0%, rgba(192, 132, 252, 0.09), transparent 55%),
    radial-gradient(480px 360px at 5% 8%, rgba(76, 242, 255, 0.08), transparent 55%),
    var(--bg);
}
.couponsPageLead{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
}

/* 佣金记录（commission.html） */
html.commission-page body{
  background:
    radial-gradient(560px 380px at 88% 0%, rgba(192, 132, 252, 0.1), transparent 55%),
    radial-gradient(480px 360px at 6% 10%, rgba(76, 242, 255, 0.09), transparent 55%),
    var(--bg);
}
.commissionPageLead{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
}
.commissionSummaryCard{
  padding: 16px 14px;
  border-radius: 14px;
  border: 1px solid rgba(192, 132, 252, 0.24);
  background: linear-gradient(125deg, rgba(255, 250, 235, 0.95), rgba(248, 245, 255, 0.98));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 12px 32px rgba(12, 8, 28, 0.06);
  text-align: center;
}
.commissionSummaryCard__lab{
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: rgba(100, 116, 139, 0.88);
}
.commissionSummaryCard__val{
  margin: 0;
  font-size: 28px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  background: linear-gradient(95deg, var(--nexus-violet), #ea580c);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .commissionSummaryCard__val{
    color: rgba(234, 88, 12, 0.95);
    background: none;
  }
}
.commissionList{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.commissionRow{
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(192, 132, 252, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.94));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 8px 22px rgba(12, 8, 28, 0.05);
}
.commissionRow__hd{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.commissionRow__no{
  font-size: 11px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.88);
}
.commissionRow__st{
  flex-shrink: 0;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  border: 1px solid transparent;
}
.commissionRow__st--ok{
  color: rgba(18, 100, 72, 0.92);
  background: rgba(94, 242, 184, 0.18);
  border-color: rgba(94, 242, 184, 0.4);
}
.commissionRow__st--pending{
  color: rgba(180, 90, 0, 0.92);
  background: rgba(255, 176, 71, 0.18);
  border-color: rgba(255, 176, 71, 0.4);
}
.commissionRow__title{
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 850;
  line-height: 1.35;
  color: rgba(17, 24, 39, 0.92);
}
.commissionRow__sub{
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.85);
}
.commissionRow__ft{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px dashed rgba(148, 163, 184, 0.35);
}
.commissionRow__amt{
  font-size: 18px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  color: rgba(234, 88, 12, 0.96);
}
.commissionRow__time{
  margin: 0;
  font-size: 11px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.82);
}

/* 已邀好友列表（invite-friends.html） */
html.invite-friends-page body{
  background:
    radial-gradient(560px 380px at 88% 0%, rgba(192, 132, 252, 0.1), transparent 55%),
    radial-gradient(480px 360px at 6% 10%, rgba(76, 242, 255, 0.09), transparent 55%),
    var(--bg);
}
.inviteFriendsPageLead{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
}
.inviteFriendsSummaryCard{
  padding: 16px 14px;
  border-radius: 14px;
  border: 1px solid rgba(192, 132, 252, 0.24);
  background: linear-gradient(125deg, rgba(248, 245, 255, 0.98), rgba(236, 253, 245, 0.92));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 12px 32px rgba(12, 8, 28, 0.06);
  text-align: center;
}
.inviteFriendsSummaryCard__lab{
  margin: 0 0 6px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: rgba(100, 116, 139, 0.88);
}
.inviteFriendsSummaryCard__val{
  margin: 0;
  font-size: 28px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@supports not ((-webkit-background-clip: text) or (background-clip: text)){
  .inviteFriendsSummaryCard__val{
    color: rgba(91, 33, 182, 0.95);
    background: none;
  }
}
.inviteFriendsList{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.inviteFriendRow{
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(192, 132, 252, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.94));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 8px 22px rgba(12, 8, 28, 0.05);
}
.inviteFriendRow__avatar{
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 17px;
  font-weight: 900;
  color: rgba(255, 255, 255, 0.98);
  background: linear-gradient(135deg, rgba(192, 132, 252, 0.95), rgba(76, 242, 255, 0.75));
  border: 1px solid rgba(255, 255, 255, 0.45);
  box-shadow: 0 6px 16px rgba(124, 58, 237, 0.18);
}
.inviteFriendRow__main{
  flex: 1;
  min-width: 0;
}
.inviteFriendRow__top{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.inviteFriendRow__name{
  font-size: 16px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.92);
}
.inviteFriendRow__tag{
  flex-shrink: 0;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  border: 1px solid transparent;
}
.inviteFriendRow__tag--done{
  color: rgba(18, 100, 72, 0.92);
  background: rgba(94, 242, 184, 0.18);
  border-color: rgba(94, 242, 184, 0.4);
}
.inviteFriendRow__tag--reg{
  color: rgba(37, 99, 235, 0.92);
  background: rgba(191, 219, 254, 0.45);
  border-color: rgba(59, 130, 246, 0.35);
}
.inviteFriendRow__phone{
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: rgba(71, 85, 105, 0.88);
}
.inviteFriendRow__meta{
  margin: 0;
  font-size: 11px;
  line-height: 1.45;
  font-weight: 600;
  color: rgba(100, 116, 139, 0.88);
}

.platformCouponList{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.platformCouponCard{
  display: grid;
  grid-template-columns: 88px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px 12px 12px 0;
  border-radius: 14px;
  border: 1px solid rgba(192, 132, 252, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.94));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 10px 28px rgba(12, 8, 28, 0.05);
}
.platformCouponCard__left{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 88px;
  padding: 8px 6px;
  border-radius: 0 12px 12px 0;
  margin-left: 0;
  background: linear-gradient(160deg, rgba(192, 132, 252, 0.22), rgba(76, 242, 255, 0.12));
  border: 1px solid rgba(192, 132, 252, 0.28);
  border-left: none;
}
.platformCouponCard__left--gold{
  background: linear-gradient(160deg, rgba(255, 214, 102, 0.35), rgba(255, 176, 71, 0.15));
  border-color: rgba(255, 176, 71, 0.35);
}
.platformCouponCard__left--cyan{
  background: linear-gradient(160deg, rgba(76, 242, 255, 0.22), rgba(78, 169, 255, 0.12));
  border-color: rgba(76, 242, 255, 0.32);
}
.platformCouponCard__left--violet{
  background: linear-gradient(160deg, rgba(167, 139, 250, 0.28), rgba(192, 132, 252, 0.14));
  border-color: rgba(167, 139, 250, 0.35);
}
.platformCouponCard__amt{
  font-size: 20px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  color: rgba(91, 33, 182, 0.95);
  line-height: 1.1;
}
.platformCouponCard__left--gold .platformCouponCard__amt{
  color: rgba(180, 90, 0, 0.95);
}
.platformCouponCard__left--cyan .platformCouponCard__amt{
  font-size: 17px;
  color: rgba(0, 110, 130, 0.92);
}
.platformCouponCard__left--violet .platformCouponCard__amt{
  font-size: 18px;
  color: rgba(76, 29, 149, 0.92);
}
.platformCouponCard__kind{
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(71, 85, 105, 0.75);
}
.platformCouponCard__main{
  min-width: 0;
}
.platformCouponCard__title{
  margin: 0 0 6px;
  font-size: 15px;
  font-weight: 850;
  line-height: 1.3;
  color: rgba(17, 24, 39, 0.92);
}
.platformCouponCard__scope{
  margin: 0 0 4px;
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.82);
}
.platformCouponCard__expire{
  margin: 0;
  font-size: 11px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.85);
}
.platformCouponCard__btn{
  flex-shrink: 0;
  align-self: center;
  white-space: nowrap;
}
.couponPageToast{
  position: fixed;
  left: 50%;
  bottom: 96px;
  transform: translateX(-50%) translateY(12px);
  max-width: min(360px, calc(100% - 32px));
  padding: 10px 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  text-align: center;
  color: rgba(17, 24, 39, 0.92);
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(192, 132, 252, 0.28);
  box-shadow: 0 16px 40px rgba(12, 8, 28, 0.12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
  z-index: 300;
}
.couponPageToast--show{
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* 收货地址管理（addresses.html） */
html.addresses-page body{
  background:
    radial-gradient(560px 380px at 90% 0%, rgba(192, 132, 252, 0.09), transparent 55%),
    radial-gradient(480px 360px at 5% 8%, rgba(76, 242, 255, 0.08), transparent 55%),
    var(--bg);
}
.addrManageToolbar{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.addrManageAddBtn{
  width: 100%;
  max-width: 100%;
  justify-content: center;
}
.addrCardList{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.addrListEmpty{
  padding: 28px 18px;
  border-radius: 14px;
  text-align: center;
  border: 1px dashed rgba(148, 163, 184, 0.45);
  background: rgba(248, 250, 252, 0.92);
}
.addrListEmpty__tit{
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 850;
  color: rgba(51, 65, 85, 0.92);
}
.addrListEmpty__sub{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  font-weight: 600;
  color: rgba(100, 116, 139, 0.9);
}
.addrCard{
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(192, 132, 252, 0.2);
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.94));
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.75) inset,
    0 10px 28px rgba(12, 8, 28, 0.05);
}
.addrCard__hd{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 8px;
}
.addrCard__name{
  font-size: 15px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.92);
}
.addrCard__phone{
  font-size: 14px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  color: rgba(71, 85, 105, 0.88);
}
.addrCard__badge{
  margin-left: auto;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 850;
  color: rgba(91, 33, 182, 0.95);
  background: rgba(192, 132, 252, 0.18);
  border: 1px solid rgba(192, 132, 252, 0.35);
}
.addrCard__detail{
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.5;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.9);
  word-break: break-word;
}
.addrCard__ft{
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
}
.addrCard__btn{
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  font-family: inherit;
  cursor: pointer;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(255, 255, 255, 0.9);
  color: rgba(51, 65, 85, 0.92);
  transition: filter 0.15s ease, border-color 0.15s ease;
}
.addrCard__btn--edit{
  border-color: rgba(124, 58, 237, 0.38);
  background: linear-gradient(135deg, rgba(245, 243, 255, 0.95), rgba(237, 233, 254, 0.75));
  color: rgba(91, 33, 182, 0.96);
}
.addrCard__btn--del{
  border-color: rgba(248, 113, 113, 0.35);
  color: rgba(185, 28, 28, 0.92);
  background: rgba(254, 242, 242, 0.75);
}
@media (hover: hover){
  .addrCard__btn:hover{
    filter: brightness(1.03);
  }
}
.addrCard__btn:active{
  transform: scale(0.98);
}
.nexusModal__panel--addrForm{
  width: min(400px, 100%);
  max-height: min(88vh, 560px);
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 0;
  overflow: hidden;
}
.addrFormModal__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 16px 16px 10px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}
.addrFormModal__head .nexusModal__title,
.addrFormModal__head h2{
  margin: 0;
  font-size: 17px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.92);
}
.addrFormModal__close{
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: rgba(241, 245, 249, 0.95);
  font-size: 22px;
  line-height: 1;
  color: rgba(71, 85, 105, 0.85);
  cursor: pointer;
}
.addrFormModal__body{
  padding: 14px 16px 18px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.addrFormField{
  margin-bottom: 12px;
}
.addrFormField__label{
  display: block;
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.88);
}
.addrFormField__input{
  width: 100%;
  box-sizing: border-box;
  padding: 11px 12px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  font-size: 15px;
  font-family: inherit;
  font-weight: 600;
  color: rgba(17, 24, 39, 0.92);
  background: rgba(255, 255, 255, 0.96);
}
.addrFormField__textarea{
  resize: vertical;
  min-height: 88px;
  line-height: 1.45;
}
.addrFormField__input:focus{
  outline: none;
  border-color: rgba(124, 58, 237, 0.55);
  box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.2);
}
.addrFormDefaultRow{
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0 12px;
  font-size: 13px;
  font-weight: 650;
  color: rgba(51, 65, 85, 0.9);
  cursor: pointer;
}
.addrFormDefaultRow input{
  width: 16px;
  height: 16px;
  accent-color: rgba(124, 58, 237, 0.9);
}
.addrFormErr{
  margin: 0 0 10px;
  min-height: 1.2em;
  font-size: 12px;
  font-weight: 650;
  color: rgba(220, 38, 38, 0.95);
}
.addrFormSubmit{
  width: 100%;
  justify-content: center;
  margin-top: 4px;
}
.addrManageToast{
  position: fixed;
  left: 50%;
  bottom: 96px;
  transform: translateX(-50%) translateY(12px);
  max-width: min(360px, calc(100% - 32px));
  padding: 10px 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  text-align: center;
  color: rgba(17, 24, 39, 0.92);
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(192, 132, 252, 0.28);
  box-shadow: 0 16px 40px rgba(12, 8, 28, 0.12);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
  z-index: 300;
}
.addrManageToast--show{
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

@media (max-width: 380px){
  .platformCouponCard{
    grid-template-columns: 72px 1fr;
    grid-template-rows: auto auto;
    padding: 10px 10px 10px 0;
  }
  .platformCouponCard__left{
    grid-column: 1;
    grid-row: 1 / -1;
    min-height: 92px;
  }
  .platformCouponCard__main{
    grid-column: 2;
    grid-row: 1;
  }
  .platformCouponCard__btn{
    grid-column: 2;
    grid-row: 2;
    justify-self: stretch;
    width: 100%;
  }
}

html.orders-page .pillTabs.orderTabs a[aria-current="page"]{
  background: linear-gradient(95deg, var(--nexus-violet), var(--nexus-cyan));
  color: rgba(255,255,255,.98);
  box-shadow: 0 12px 22px rgba(192, 132, 252, .22);
}
.orderList{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.orderCard{
  border-radius: var(--radius);
  border: 1px solid rgba(192, 132, 252, 0.18);
  background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(248,245,255,.94));
  box-shadow: var(--shadow-soft);
  padding: 14px;
}
.orderCard__hd{
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(17, 24, 39, .06);
}
.orderCard__no{
  font-size: 12px;
  font-weight: 700;
  color: rgba(0,0,0,.55);
}
.orderCard__st{
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 999px;
}
.orderCard__st--ship{
  background: rgba(255, 176, 71, 0.18);
  color: rgba(180, 90, 0, 0.9);
  border: 1px solid rgba(255, 176, 71, 0.35);
}
.orderCard__st--receive{
  background: rgba(76, 242, 255, 0.12);
  color: rgba(0, 110, 130, 0.92);
  border: 1px solid rgba(76, 242, 255, 0.35);
}
.orderCard__st--done{
  background: rgba(94, 242, 184, 0.15);
  color: rgba(18, 100, 72, 0.9);
  border: 1px solid rgba(94, 242, 184, 0.35);
}
.orderCard__body{
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.orderCard__lines{
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  min-width: 0;
}
.orderLine{
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.orderThumb{
  width: 72px;
  height: 72px;
  flex-shrink: 0;
  border-radius: 12px;
  border: 1px solid rgba(17, 24, 39, .08);
  background:
    radial-gradient(60px 50px at 30% 30%, rgba(255,107,74,.2), transparent 60%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
.orderThumb--b{
  background:
    radial-gradient(60px 50px at 40% 35%, rgba(78,169,255,.22), transparent 58%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
.orderThumb--c{
  background:
    radial-gradient(60px 50px at 35% 30%, rgba(160,110,255,.2), transparent 58%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
.orderThumb--d{
  background:
    radial-gradient(60px 50px at 30% 30%, rgba(255,176,71,.22), transparent 58%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
.orderThumb--e{
  background:
    radial-gradient(60px 50px at 50% 40%, rgba(192,132,252,.22), transparent 58%),
    linear-gradient(135deg, rgba(240,243,250,1), rgba(255,255,255,1));
}
.orderThumb--sm{
  width: 56px;
  height: 56px;
  border-radius: 10px;
}
.orderLine .orderCard__name{
  font-size: 13px;
}
.orderLine .orderCard__sku{
  margin-top: 4px;
}
.orderCard__info{
  min-width: 0;
  flex: 1;
}
.orderCard__name{
  margin: 0;
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
  color: rgba(17, 24, 39, .88);
}
.orderCard__sku{
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.orderCard__ft{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(17, 24, 39, .08);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 10px;
}
.orderCard__ftLeft{
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.orderCard__detailBtn{
  flex-shrink: 0;
  border: 0;
  background: transparent;
  padding: 4px 2px;
  font-size: 13px;
  font-weight: 800;
  color: rgba(147, 51, 234, 0.92);
  text-decoration: none;
  cursor: pointer;
  font-family: inherit;
}
@media (hover: hover){
  .orderCard__detailBtn:hover{
    color: rgba(124, 58, 237, 1);
  }
}
.orderCard__total{
  font-size: 13px;
  color: rgba(0,0,0,.62);
  font-weight: 700;
}
.orderCard__total strong{
  font-size: 16px;
  font-weight: 950;
  color: rgba(17, 24, 39, .92);
}
.orderCard__hint{
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.orderEmpty{
  margin: 24px 0 0;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: var(--muted);
}

.nexusModal__panel--orderDetail{
  width: min(380px, 100%);
  max-height: min(88vh, 640px);
  text-align: left;
  display: flex;
  flex-direction: column;
  padding-bottom: 18px;
}
.nexusModal__panel--orderDetail .nexusModal__title{
  text-align: center;
  flex-shrink: 0;
}
.orderDetailModal__body{
  margin: 0 0 16px;
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(35, 28, 70, .88);
}
.orderDetailModal__body .orderDetailMeta{
  margin: 0 0 14px;
  padding: 12px 12px 10px;
  border-radius: 12px;
  border: 1px solid rgba(192,132,252,.2);
  background: rgba(255,255,255,.55);
}
.orderDetailModal__body .orderDetailMeta p{
  margin: 0 0 8px;
  font-size: 12px;
}
.orderDetailModal__body .orderDetailMeta p:last-child{
  margin-bottom: 0;
}
.orderDetailModal__body .orderDetailMeta .k{
  display: inline-block;
  min-width: 4.5em;
  font-weight: 800;
  color: rgba(17, 24, 39, .55);
}
.orderDetailModal__body .orderDetailSectionTitle{
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .04em;
  color: rgba(17, 24, 39, .62);
}
.orderDetailModal__body .orderDetailItemRow{
  display: flex;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(17, 24, 39, .06);
}
.orderDetailModal__body .orderDetailItemRow:last-child{
  border-bottom: 0;
  padding-bottom: 0;
}
.orderDetailModal__body .orderDetailItemRow .orderThumb{
  flex-shrink: 0;
}
.orderDetailModal__body .orderDetailSum{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(17, 24, 39, .1);
  font-size: 13px;
  font-weight: 800;
  color: rgba(17, 24, 39, .88);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.orderCard__fullDetail{
  display: none;
}

@media (max-width: 360px){
  .grid.cols-5{ grid-template-columns: repeat(4, 1fr); }
  .pillTabs{ grid-template-columns: repeat(2, 1fr); border-radius: var(--radius); }
}

/* 开箱记录页 box-records.html */
/* 开箱记录页无底部 Tab，收紧主区域下边距 */
.box-records-page .app{
  padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
}
.box-records-page .boxRecordsLead{
  margin: 0;
  padding: 0 4px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.5;
  color: rgba(71, 85, 105, 0.88);
}
.box-records-page .boxRecordsTopbarRow{
  position: relative;
  grid-template-columns: 1fr;
  justify-items: center;
}
.box-records-page .boxRecordsTopbarRow .left{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.box-records-page .boxRecordsTopbarRow .title{
  justify-self: center;
  text-align: center;
  padding-left: 0;
  max-width: calc(100% - 72px - 92px);
}
.box-records-page .boxRecordsTopbarRow .right{
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  max-width: 46%;
  text-align: right;
}
.box-records-page .boxRecordsFundBtn--topbar{
  padding: 5px 10px;
  font-size: 11px;
  white-space: nowrap;
}
.box-records-page .boxRecordsBackBtn{
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(17, 24, 39, 0.08);
  color: rgba(17, 24, 39, 0.78);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordsBackBtn:hover{
    background: rgba(255, 255, 255, 0.95);
  }
}
.box-records-page .boxRecordsBackBtn:active{
  transform: scale(0.96);
}
.box-records-page .boxRecordsBackBtn__ico{
  display: block;
  width: 18px;
  height: 18px;
}
.box-records-page .boxRecordsSubbarSection{
  padding-bottom: 4px;
}
.box-records-page .boxRecordsSubbar{
  padding: 0;
}
.box-records-page .boxRecordsSubbar .boxRecordsTopWallet{
  display: flex;
  align-items: center;
  justify-content: stretch;
  flex-wrap: wrap;
  gap: 12px 16px;
  width: 100%;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.92),
    rgba(248, 245, 255, 0.88)
  );
  border: 1px solid rgba(192, 132, 252, 0.22);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.75) inset,
    0 8px 22px rgba(76, 29, 149, 0.06);
}
.box-records-page .boxRecordsTopWallet__chips{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 10px;
  width: 100%;
  min-width: 0;
  flex: 1 1 100%;
}
.box-records-page .boxRecordsTopBalance,
.box-records-page .boxRecordsTopPointsBtn{
  flex-shrink: 0;
}
.box-records-page .boxRecordsFundBtn{
  flex-shrink: 0;
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.32);
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 4px 14px rgba(76, 29, 149, 0.08);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.04em;
  color: rgba(91, 33, 182, 0.96);
  text-decoration: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordsFundBtn:hover{
    border-color: rgba(124, 58, 237, 0.48);
    box-shadow: 0 6px 18px rgba(76, 29, 149, 0.12);
    transform: translateY(-1px);
  }
}
.box-records-page .boxRecordsFundBtn:active{
  transform: translateY(0);
}
.box-records-page .boxRecordsList{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.box-records-page .boxRecordCard{
  margin: 0;
  padding: 14px 14px 12px;
  border-radius: 16px;
  border: 1px solid rgba(124, 58, 237, 0.14);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.55));
  box-shadow: 0 10px 24px rgba(76, 29, 149, 0.06);
}
.box-records-page .boxRecordCard__hd{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.box-records-page .boxRecordCard__time{
  font-size: 12px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
  color: rgba(71, 85, 105, 0.85);
}
.box-records-page .boxRecordCard__hd .boxRecordCard__noRow{
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
  flex: 1;
  justify-content: flex-start;
}
.box-records-page .boxRecordCard__hd .boxRecordCard__no{
  /* 勿 flex:1，否则会拉满一行，单号文字与复制按钮之间出现大块空白 */
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
  font-size: 12px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.85);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 图标用 background-image（data URI），避免内联 SVG 在部分环境不绘制；按钮可为空仅依赖此处 */
.box-records-page .boxRecordCard__copyBtn,
.boxRecordCard .boxRecordCard__copyBtn{
  --box-copy-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%235b21b6' d='M16 1H4a2 2 0 0 0-2 2v14h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z'/%3E%3C/svg%3E");
  --box-copy-img-hover: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%234c1d95' d='M16 1H4a2 2 0 0 0-2 2v14h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z'/%3E%3C/svg%3E");
  flex: 0 0 auto;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  min-width: 22px;
  height: 22px;
  min-height: 22px;
  margin: 0;
  padding: 0;
  line-height: 0;
  border: none;
  border-radius: 6px;
  background-color: rgba(124, 58, 237, 0.08);
  background-image: var(--box-copy-img);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
  color: rgba(91, 33, 182, 0.85);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.box-records-page .boxRecordCard__copyBtn:hover,
.boxRecordCard .boxRecordCard__copyBtn:hover{
  background-color: rgba(124, 58, 237, 0.16);
  background-image: var(--box-copy-img-hover);
  color: rgba(76, 29, 149, 0.95);
}
.box-records-page .boxRecordCard__copyBtn:focus-visible,
.boxRecordCard .boxRecordCard__copyBtn:focus-visible{
  outline: 2px solid rgba(124, 58, 237, 0.45);
  outline-offset: 1px;
}
.box-records-page .boxRecordCard__copyBtn .boxCopyIcon,
.boxRecordCard .boxRecordCard__copyBtn .boxCopyIcon{
  display: none;
}
.box-records-page .boxRecordCard__tag{
  flex-shrink: 0;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
}
.box-records-page .boxRecordCard__tag--ssr{
  color: rgba(147, 51, 234, 0.95);
  background: rgba(192, 132, 252, 0.22);
  border: 1px solid rgba(147, 51, 234, 0.35);
}
.box-records-page .boxRecordCard__tag--sr{
  color: rgba(37, 99, 235, 0.95);
  background: rgba(96, 165, 250, 0.2);
  border: 1px solid rgba(59, 130, 246, 0.35);
}
.box-records-page .boxRecordCard__tag--r{
  color: rgba(5, 150, 105, 0.95);
  background: rgba(52, 211, 153, 0.18);
  border: 1px solid rgba(16, 185, 129, 0.32);
}
.box-records-page .boxRecordCard__tag--n{
  color: rgba(100, 116, 139, 0.95);
  background: rgba(148, 163, 184, 0.22);
  border: 1px solid rgba(100, 116, 139, 0.28);
}
.box-records-page .boxRecordCard__series{
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.85);
}
.box-records-page .boxRecordCard__thumbs{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
}
.box-records-page .boxRecordCard__thumbWrap{
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(124, 58, 237, 0.15);
  background: rgba(241, 245, 249, 0.9);
  box-shadow: 0 4px 10px rgba(76, 29, 149, 0.06);
}
.box-records-page .boxRecordCard__thumbImg{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.box-records-page .boxRecordCard__thumbMore{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  height: 48px;
  padding: 0 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 900;
  color: rgba(91, 33, 182, 0.85);
  background: rgba(192, 132, 252, 0.14);
  border: 1px dashed rgba(124, 58, 237, 0.28);
}
.box-records-page .boxRecordCard__prizes{
  margin: 0 0 4px;
}
.box-records-page .boxRecordCard__prizePreview{
  margin: 0 0 6px;
  font-size: 14px;
  font-weight: 850;
  line-height: 1.45;
  color: rgba(17, 24, 39, 0.9);
}
.box-records-page .boxRecordCard__prizeCount{
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.82);
}
.box-records-page .boxRecordCard__addrLine{
  margin: 8px 0 0;
  font-size: 11px;
  font-weight: 650;
  line-height: 1.45;
  color: rgba(37, 99, 235, 0.88);
}
.box-records-page .boxRecordCard__addrLine strong{
  font-weight: 900;
}
.box-records-page .boxRecordCard__addrLine--muted{
  color: rgba(71, 85, 105, 0.55);
  font-weight: 600;
}
.box-records-page .boxRecordCard__pending{
  color: rgba(217, 119, 6, 0.95);
  font-weight: 800;
}
.box-records-page .boxRecordCard__pendingAmt{
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: rgba(91, 33, 182, 0.95);
  background: rgba(192, 132, 252, 0.16);
  border: 1px solid rgba(124, 58, 237, 0.22);
}
.box-records-page .boxRecordCard__done{
  color: rgba(5, 150, 105, 0.9);
  font-weight: 750;
}
.box-records-page .boxRecordCard__ft{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(124, 58, 237, 0.18);
  font-size: 11px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.78);
}
.box-records-page .boxRecordCard__no{
  font-variant-numeric: tabular-nums;
}
.box-records-page .boxRecordCard__actions{
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}
.box-records-page .boxRecordCard__addrBtn{
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(37, 99, 235, 0.38);
  background: linear-gradient(135deg, rgba(219, 234, 254, 0.85), rgba(191, 219, 254, 0.45));
  font-size: 13px;
  font-weight: 850;
  font-family: inherit;
  color: rgba(30, 64, 175, 0.96);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordCard__addrBtn:hover{
    border-color: rgba(37, 99, 235, 0.55);
    background: linear-gradient(135deg, rgba(239, 246, 255, 0.98), rgba(219, 234, 254, 0.7));
  }
}
.box-records-page .boxRecordCard__addrBtn:active{
  transform: scale(0.98);
}
.box-records-page .boxRecordCard__recycleAllBtn{
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(234, 88, 12, 0.42);
  background: linear-gradient(135deg, rgba(254, 215, 170, 0.45), rgba(253, 186, 116, 0.28));
  font-size: 12px;
  font-weight: 900;
  font-family: inherit;
  color: rgba(154, 52, 18, 0.98);
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.1s ease, opacity 0.15s ease;
}
.box-records-page .boxRecordCard__recycleAllBtn:disabled{
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(0.15);
}
@media (hover: hover){
  .box-records-page .boxRecordCard__recycleAllBtn:hover:not(:disabled){
    filter: brightness(1.06);
  }
}
.box-records-page .boxRecordCard__recycleAllBtn:active:not(:disabled){
  transform: scale(0.98);
}
.box-records-page .boxRecordCard__shipLine{
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 750;
  color: rgba(5, 150, 105, 0.92);
}
.box-records-page .boxRecordCard__shipBtn{
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(5, 150, 105, 0.42);
  background: linear-gradient(135deg, rgba(209, 250, 229, 0.75), rgba(167, 243, 208, 0.4));
  font-size: 12px;
  font-weight: 900;
  font-family: inherit;
  color: rgba(6, 95, 70, 0.98);
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.1s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordCard__shipBtn:hover{
    filter: brightness(1.04);
  }
}
.box-records-page .boxRecordCard__shipBtn:active{
  transform: scale(0.98);
}
.box-records-page .boxRecordCard__shipRow{
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.box-records-page .boxRecordCard__trackBtn{
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(59, 130, 246, 0.42);
  background: linear-gradient(135deg, rgba(239, 246, 255, 0.95), rgba(219, 234, 254, 0.5));
  font-size: 12px;
  font-weight: 850;
  font-family: inherit;
  color: rgba(30, 64, 175, 0.96);
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.1s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordCard__trackBtn:hover{
    filter: brightness(1.04);
  }
}
.box-records-page .boxRecordCard__trackBtn:active{
  transform: scale(0.98);
}
.box-records-page .boxRecordCard__detailBtn{
  padding: 8px 18px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.35);
  background: rgba(255, 255, 255, 0.95);
  font-size: 13px;
  font-weight: 850;
  font-family: inherit;
  color: rgba(91, 33, 182, 0.95);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordCard__detailBtn:hover{
    border-color: rgba(124, 58, 237, 0.5);
    background: rgba(248, 245, 255, 0.98);
  }
}
.box-records-page .boxRecordCard__detailBtn:active{
  transform: scale(0.98);
}
.box-records-page .boxRecordsTopBalance{
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(124, 58, 237, 0.2);
  box-shadow: 0 6px 14px rgba(76, 29, 149, 0.06);
}
.box-records-page .boxRecordsTopBalance__lab{
  font-size: 11px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.75);
}
.box-records-page .boxRecordsTopBalance__val{
  font-size: 13px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  color: rgba(234, 88, 12, 0.98);
}
.box-records-page .boxRecordsTopPointsBtn{
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(124, 58, 237, 0.28);
  box-shadow: 0 6px 14px rgba(76, 29, 149, 0.06);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordsTopPointsBtn:hover{
    border-color: rgba(124, 58, 237, 0.45);
    box-shadow: 0 8px 18px rgba(76, 29, 149, 0.1);
  }
}
.box-records-page .boxRecordsTopPointsBtn__lab{
  font-size: 11px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.75);
}
.box-records-page .boxRecordsTopPointsBtn__val{
  font-size: 13px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  color: rgba(124, 58, 237, 0.98);
}
.box-records-page .nexusModal__panel--boxRecordDetail{
  width: min(400px, 100%);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 20px 18px 18px;
}
.box-records-page .nexusModal__panel--boxShipTrack{
  width: min(400px, 100%);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  text-align: left;
  padding: 20px 18px 18px;
}
.box-records-page .boxShipTrackHead{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.box-records-page .nexusModal__title--boxShipTrack{
  margin: 0;
  flex: 1;
  min-width: 0;
  text-align: left;
  font-size: 17px;
}
.box-records-page .boxShipTrackClose{
  flex-shrink: 0;
  margin: -4px -6px 0 0;
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.65);
  font-size: 22px;
  line-height: 1;
  color: rgba(71, 85, 105, 0.85);
  cursor: pointer;
  transition: background 0.15s ease;
}
@media (hover: hover){
  .box-records-page .boxShipTrackClose:hover{
    background: rgba(241, 245, 249, 0.95);
  }
}
.box-records-page .boxShipTrackMeta{
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
  text-align: left;
}
.box-records-page .boxShipTrackWaybill{
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 750;
  text-align: left;
  color: rgba(17, 24, 39, 0.9);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}
.box-records-page .boxShipTrackCarrier{
  display: inline-block;
  margin-right: 0;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 850;
  font-style: normal;
  color: rgba(6, 95, 70, 0.98);
  background: rgba(209, 250, 229, 0.75);
  border: 1px solid rgba(16, 185, 129, 0.28);
}
.box-records-page .boxShipTrackNoLine{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex: 1;
}
.box-records-page .boxShipTrackNo{
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.02em;
}
.box-records-page .boxShipTrackCopyBtn,
.boxShipTrackCopyBtn{
  --box-copy-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%235b21b6' d='M16 1H4a2 2 0 0 0-2 2v14h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z'/%3E%3C/svg%3E");
  --box-copy-img-hover: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%234c1d95' d='M16 1H4a2 2 0 0 0-2 2v14h2V3h12V1zm3 4H8a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h11a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2zm0 16H8V7h11v14z'/%3E%3C/svg%3E");
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  height: 24px;
  min-height: 24px;
  margin: 0;
  padding: 0;
  line-height: 0;
  border: none;
  border-radius: 6px;
  background-color: rgba(124, 58, 237, 0.1);
  background-image: var(--box-copy-img);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
  color: rgba(91, 33, 182, 0.88);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.box-records-page .boxShipTrackCopyBtn:hover,
.boxShipTrackCopyBtn:hover{
  background-color: rgba(124, 58, 237, 0.18);
  background-image: var(--box-copy-img-hover);
  color: rgba(76, 29, 149, 0.95);
}
.box-records-page .boxShipTrackCopyBtn:focus-visible,
.boxShipTrackCopyBtn:focus-visible{
  outline: 2px solid rgba(124, 58, 237, 0.45);
  outline-offset: 1px;
}
.box-records-page .boxShipTrackCopyBtn .boxCopyIcon,
.boxShipTrackCopyBtn .boxCopyIcon{
  display: none;
}
.box-records-page .boxShipTrackBody{
  flex: 1;
  min-height: 0;
  overflow: auto;
  margin-bottom: 14px;
  -webkit-overflow-scrolling: touch;
}
.box-records-page .boxShipTrackAddr{
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.9);
  background: rgba(241, 245, 249, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.28);
  text-align: left;
}
.box-records-page .boxShipTrackEmpty{
  padding: 18px 12px;
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.95);
  border: 1px dashed rgba(148, 163, 184, 0.45);
  text-align: center;
}
.box-records-page .boxShipTrackEmpty__tit{
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 850;
  color: rgba(51, 65, 85, 0.9);
}
.box-records-page .boxShipTrackEmpty__sub{
  margin: 0;
  font-size: 12px;
  line-height: 1.55;
  font-weight: 600;
  color: rgba(100, 116, 139, 0.9);
}
.box-records-page .boxShipTrackTimeline{
  margin: 0;
  padding: 0 0 0 18px;
  list-style: none;
  border-left: 2px solid rgba(148, 163, 184, 0.35);
  text-align: left;
}
.box-records-page .boxShipTrackStep{
  position: relative;
  padding: 0 0 18px 14px;
}
.box-records-page .boxShipTrackStep:last-child{
  padding-bottom: 4px;
}
.box-records-page .boxShipTrackStep::before{
  content: "";
  position: absolute;
  left: -23px;
  top: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(148, 163, 184, 0.55);
  border: 2px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 0 0 1px rgba(148, 163, 184, 0.35);
}
.box-records-page .boxShipTrackStep--latest::before{
  background: rgba(5, 150, 105, 0.95);
  box-shadow: 0 0 0 1px rgba(16, 185, 129, 0.35);
}
.box-records-page .boxShipTrackStep__time{
  display: block;
  margin-bottom: 4px;
  font-size: 11px;
  font-weight: 700;
  font-style: normal;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.9);
}
.box-records-page .boxShipTrackStep--latest .boxShipTrackStep__time{
  color: rgba(5, 150, 105, 0.95);
}
.box-records-page .boxShipTrackStep__txt{
  margin: 0;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.45;
  color: rgba(30, 41, 59, 0.92);
}
.box-records-page .boxDetailHead{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.box-records-page .nexusModal__title--boxDetail{
  margin: 0;
  flex: 1;
  min-width: 0;
  text-align: left;
  font-size: 17px;
}
.box-records-page .boxDetailRecycleAllBtn{
  flex-shrink: 0;
  margin-top: 2px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(234, 88, 12, 0.45);
  background: linear-gradient(135deg, rgba(254, 215, 170, 0.5), rgba(253, 186, 116, 0.32));
  font-size: 12px;
  font-weight: 900;
  font-family: inherit;
  color: rgba(154, 52, 18, 0.98);
  cursor: pointer;
  white-space: nowrap;
  transition: filter 0.15s ease, opacity 0.15s ease;
}
.box-records-page .boxDetailRecycleAllBtn:disabled{
  opacity: 0.45;
  cursor: not-allowed;
}
@media (hover: hover){
  .box-records-page .boxDetailRecycleAllBtn:hover:not(:disabled){
    filter: brightness(1.05);
  }
}
body.box-records-sheet-open{
  overflow: hidden;
}
.box-records-page .boxAddressModalMeta{
  margin: 0 0 14px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
  text-align: left;
}
.box-records-page .boxAddrSheetMask{
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 220;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.box-records-page .boxAddrSheetMask.on{
  opacity: 1;
  visibility: visible;
}
.box-records-page .boxAddrSheet{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 221;
  max-height: min(88vh, 560px);
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.99));
  border: 1px solid rgba(124, 58, 237, 0.14);
  border-bottom: none;
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -12px 48px rgba(76, 29, 149, 0.12);
  transform: translateY(105%);
  transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.box-records-page .boxAddrSheet.on{
  transform: translateY(0);
}
.box-records-page .boxAddrSheet .sheet-hd{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28);
}
.box-records-page .boxAddrSheet .sheet-hd h2{
  margin: 0;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0.04em;
  background: linear-gradient(90deg, rgba(91, 33, 182, 0.95), rgba(37, 99, 235, 0.9));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.box-records-page .boxAddrSheet .sheet-close{
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.06);
  font-size: 20px;
  line-height: 1;
  color: rgba(17, 24, 39, 0.75);
  cursor: pointer;
}
.box-records-page .boxAddrSheet .sheet-body{
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 16px 18px;
}
.box-records-page .boxAddrSkipBlock{
  padding: 8px 0 4px;
}
.box-records-page .boxAddrSheet .form-field{
  margin-bottom: 12px;
}
.box-records-page .boxAddrSheet .form-field label{
  display: block;
  font-size: 13px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
  margin-bottom: 6px;
}
.box-records-page .boxAddrSheet .form-field input,
.box-records-page .boxAddrSheet .form-field textarea{
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid rgba(124, 58, 237, 0.22);
  border-radius: 12px;
  font: inherit;
  font-size: 15px;
  background: rgba(255, 255, 255, 0.95);
  color: rgba(17, 24, 39, 0.92);
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.box-records-page .boxAddrSheet .form-field textarea{
  min-height: 72px;
  resize: vertical;
}
.box-records-page .boxAddrSheet .form-field input:focus,
.box-records-page .boxAddrSheet .form-field textarea:focus{
  border-color: rgba(147, 51, 234, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.18);
}
.box-records-page .boxAddrSheet .btn-save-addr,
.box-records-page .boxShipSheet .btn-save-addr{
  width: 100%;
  height: 46px;
  margin-top: 8px;
  border: none;
  border-radius: 14px;
  background: linear-gradient(95deg, rgba(124, 58, 237, 0.95), rgba(37, 99, 235, 0.92));
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.06em;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(124, 58, 237, 0.22);
}
.box-records-page .boxShipSheet .btn-save-addr.boxShipPayBtn{
  background: linear-gradient(95deg, rgba(5, 150, 105, 0.95), rgba(37, 99, 235, 0.88));
  box-shadow: 0 8px 24px rgba(16, 185, 129, 0.2);
}
@media (hover: hover){
  .box-records-page .boxAddrSheet .btn-save-addr:hover,
  .box-records-page .boxShipSheet .btn-save-addr:hover:not(:disabled){
    filter: brightness(1.04);
  }
}
.box-records-page .boxAddrToast{
  position: fixed;
  left: 50%;
  bottom: calc(24px + env(safe-area-inset-bottom, 0));
  z-index: 300;
  transform: translate(-50%, 12px);
  padding: 10px 16px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 650;
  color: rgba(17, 24, 39, 0.92);
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(124, 58, 237, 0.2);
  box-shadow: 0 10px 36px rgba(76, 29, 149, 0.15);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease;
}
.box-records-page .boxAddrToast.boxAddrToast--show{
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
.box-records-page .boxShipSheetMask{
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 230;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.box-records-page .boxShipSheetMask.on{
  opacity: 1;
  visibility: visible;
}
.box-records-page .boxShipSheet{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 231;
  max-height: min(88vh, 580px);
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.99));
  border: 1px solid rgba(16, 185, 129, 0.22);
  border-bottom: none;
  border-radius: 20px 20px 0 0;
  box-shadow: 0 -12px 48px rgba(16, 185, 129, 0.1);
  transform: translateY(105%);
  transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.box-records-page .boxShipSheet.on{
  transform: translateY(0);
}
.box-records-page .boxShipSheet .sheet-hd{
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px 10px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.28);
}
.box-records-page .boxShipSheet .sheet-hd h2{
  margin: 0;
  font-size: 17px;
  font-weight: 900;
  letter-spacing: 0.04em;
  background: linear-gradient(90deg, rgba(5, 150, 105, 0.95), rgba(37, 99, 235, 0.88));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.box-records-page .boxShipSheet .sheet-close{
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.06);
  font-size: 20px;
  line-height: 1;
  color: rgba(17, 24, 39, 0.75);
  cursor: pointer;
}
.box-records-page .boxShipSheet .sheet-body{
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 16px 18px;
}
.box-records-page .boxShipSheetMeta{
  margin: 0 0 10px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
  text-align: left;
}
.box-records-page .boxShipSheetHint{
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.78);
}
.box-records-page .boxShipAddrList{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 10px;
}
.box-records-page .boxShipOtherAddrToggle{
  display: block;
  width: 100%;
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px dashed rgba(37, 99, 235, 0.45);
  background: rgba(239, 246, 255, 0.65);
  font-size: 13px;
  font-weight: 800;
  font-family: inherit;
  color: rgba(30, 64, 175, 0.95);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
@media (hover: hover){
  .box-records-page .boxShipOtherAddrToggle:hover{
    background: rgba(219, 234, 254, 0.9);
    border-color: rgba(37, 99, 235, 0.55);
  }
}
.box-records-page .boxShipOtherAddrBlock{
  margin-bottom: 14px;
  padding: 12px 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.18);
  background: rgba(255, 255, 255, 0.92);
}
.box-records-page .boxShipOtherAddrTit{
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.03em;
  color: rgba(71, 85, 105, 0.9);
}
.box-records-page .boxShipOtherAddrBlock .form-field{
  margin-bottom: 12px;
}
.box-records-page .boxShipOtherAddrBlock .form-field label{
  display: block;
  font-size: 13px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
  margin-bottom: 6px;
}
.box-records-page .boxShipOtherAddrBlock .form-field input,
.box-records-page .boxShipOtherAddrBlock .form-field textarea{
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border: 1px solid rgba(124, 58, 237, 0.22);
  border-radius: 12px;
  font: inherit;
  font-size: 15px;
  background: rgba(255, 255, 255, 0.98);
  color: rgba(17, 24, 39, 0.92);
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.box-records-page .boxShipOtherAddrBlock .form-field textarea{
  min-height: 72px;
  resize: vertical;
}
.box-records-page .boxShipOtherAddrBlock .form-field input:focus,
.box-records-page .boxShipOtherAddrBlock .form-field textarea:focus{
  border-color: rgba(147, 51, 234, 0.45);
  box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.18);
}
.box-records-page .boxShipSaveOtherBtn{
  margin-top: 4px;
}
.box-records-page .boxShipAddrItem{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 11px;
  border-radius: 12px;
  border: 1px solid rgba(124, 58, 237, 0.16);
  background: rgba(255, 255, 255, 0.92);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.box-records-page .boxShipAddrItem:has(input:checked){
  border-color: rgba(5, 150, 105, 0.45);
  background: rgba(236, 253, 245, 0.85);
}
.box-records-page .boxShipAddrItem input{
  margin-top: 3px;
  flex-shrink: 0;
  accent-color: rgba(5, 150, 105, 0.95);
}
.box-records-page .boxShipAddrItem__text{
  font-size: 13px;
  line-height: 1.45;
  font-weight: 650;
  color: rgba(17, 24, 39, 0.9);
}
.box-records-page .boxShipPayMethodTit{
  margin: 4px 0 10px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: rgba(71, 85, 105, 0.88);
}
.box-records-page .boxShipPaySelectWrap{
  margin-bottom: 6px;
}
.box-records-page .boxShipPaySelect{
  width: 100%;
  box-sizing: border-box;
  padding: 12px 40px 12px 14px;
  font-size: 15px;
  font-weight: 650;
  font-family: inherit;
  line-height: 1.35;
  color: rgba(17, 24, 39, 0.92);
  background-color: rgba(255, 255, 255, 0.95);
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 12px;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 18px 18px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.box-records-page .boxShipPaySelect:focus{
  outline: none;
  border-color: rgba(124, 58, 237, 0.55);
  box-shadow: 0 0 0 3px rgba(192, 132, 252, 0.22);
}
.box-records-page .boxShipPayMethodSub{
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  color: rgba(71, 85, 105, 0.82);
}
.box-records-page .boxShipPostageRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  margin-bottom: 8px;
  border-radius: 12px;
  background: rgba(241, 245, 249, 0.95);
  border: 1px dashed rgba(148, 163, 184, 0.45);
  font-size: 14px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.92);
}
.box-records-page .boxShipPostageRow strong{
  font-size: 18px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: rgba(5, 150, 105, 0.95);
}
.box-records-page .boxShipBalanceLine{
  margin: 0 0 12px;
  font-size: 12px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.85);
}
.box-records-page .boxShipPayBtn:disabled{
  opacity: 0.45;
  cursor: not-allowed;
  filter: grayscale(0.1);
}
.box-records-page .boxDetailPrizeTitle{
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: rgba(71, 85, 105, 0.75);
}
.box-records-page .boxDetailMeta{
  margin: 0 0 14px;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
}
.box-records-page .boxDetailList{
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  margin: 0 -4px 16px;
  padding: 0 4px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.box-records-page .boxDetailItem{
  padding: 12px 12px;
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.14);
  background: rgba(255, 255, 255, 0.75);
}
.box-records-page .boxDetailItem__top{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}
.box-records-page .boxDetailItem__thumb{
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(124, 58, 237, 0.16);
  background: rgba(241, 245, 249, 0.95);
  box-shadow: 0 6px 14px rgba(76, 29, 149, 0.07);
}
.box-records-page .boxDetailItem__thumb img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.box-records-page .boxDetailItem__main{
  flex: 1;
  min-width: 0;
}
.box-records-page .boxDetailItem__hd{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.box-records-page .boxDetailItem__name{
  flex: 1;
  min-width: 0;
  font-size: 14px;
  font-weight: 900;
  line-height: 1.35;
  color: rgba(17, 24, 39, 0.92);
}
.box-records-page .boxDetailItem__desc{
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  font-weight: 600;
  color: rgba(71, 85, 105, 0.85);
}
.box-records-page .boxDetailItem__recycleRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.box-records-page .boxDetailItem__price{
  font-size: 13px;
  font-weight: 800;
  color: rgba(91, 33, 182, 0.92);
}
.box-records-page .boxDetailRecycleBtn{
  flex-shrink: 0;
  padding: 7px 16px;
  border-radius: 999px;
  border: 1px solid rgba(234, 88, 12, 0.45);
  background: linear-gradient(135deg, rgba(254, 215, 170, 0.5), rgba(253, 186, 116, 0.35));
  font-size: 12px;
  font-weight: 900;
  font-family: inherit;
  color: rgba(154, 52, 18, 0.98);
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.1s ease;
}
@media (hover: hover){
  .box-records-page .boxDetailRecycleBtn:hover{
    filter: brightness(1.05);
  }
}
.box-records-page .boxDetailItem__recycled{
  display: block;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(5, 150, 105, 0.95);
}
.box-records-page .boxDetailItemAddr{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(124, 58, 237, 0.2);
}
.box-records-page .boxDetailItemAddr--skip{
  border-top-style: solid;
  border-top-color: rgba(148, 163, 184, 0.25);
}
.box-records-page .boxDetailItemAddr__skip{
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.72);
}
.box-records-page .boxDetailCloseBtn{
  width: 100%;
  margin-top: auto;
  justify-content: center;
}
.box-records-page .boxRecordsFoot{
  text-align: center;
}
.box-records-page .boxRecordsFoot__tip{
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.55;
  color: rgba(71, 85, 105, 0.85);
}
.box-records-page .boxRecordsFoot__cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 12px 16px;
  border-radius: 14px;
  font-size: 14px;
  font-weight: 900;
  color: rgba(91, 33, 182, 0.98);
  background: linear-gradient(135deg, rgba(192, 132, 252, 0.28), rgba(34, 211, 238, 0.2));
  border: 1px solid rgba(124, 58, 237, 0.28);
  box-shadow: 0 8px 20px rgba(76, 29, 149, 0.08);
  transition: transform 0.15s ease, box-shadow 0.2s ease;
}
@media (hover: hover){
  .box-records-page .boxRecordsFoot__cta:hover{
    transform: translateY(-1px);
    box-shadow: 0 12px 26px rgba(76, 29, 149, 0.12);
  }
}

/* 盲盒 · 回收记录列表（vip 入口） */
.blindbox-recycle-page .blindboxRecycleTopbarRow{
  position: relative;
  grid-template-columns: 1fr;
  justify-items: center;
}
.blindbox-recycle-page .blindboxRecycleTopbarRow .left{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.blindbox-recycle-page .blindboxRecycleTopbarRow .title{
  justify-self: center;
  text-align: center;
  padding-left: 0;
  max-width: calc(100% - 72px - 104px);
}
.blindbox-recycle-page .blindboxRecycleTopbarRow .right{
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  max-width: 46%;
  text-align: right;
}
.blindbox-recycle-page .blindboxRecycleTopLink{
  display: inline-block;
  padding: 5px 0 5px 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.25;
  color: rgba(91, 33, 182, 0.96);
  text-decoration: none;
  white-space: nowrap;
}
@media (hover: hover){
  .blindbox-recycle-page .blindboxRecycleTopLink:hover{
    color: rgba(76, 29, 149, 1);
    text-decoration: underline;
    text-underline-offset: 3px;
  }
}
.blindbox-recycle-page .blindboxRecycleTopLink:active{
  opacity: 0.88;
}
.blindbox-recycle-page .blindboxRecycleSubbarSection{
  padding-bottom: 4px;
}
.blindbox-recycle-page .blindboxRecycleSubbar{
  padding: 0;
}
.blindbox-recycle-page .blindboxRecycleSubbar .blindboxRecycleTopWallet{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px 14px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.92),
    rgba(248, 245, 255, 0.88)
  );
  border: 1px solid rgba(192, 132, 252, 0.22);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.75) inset,
    0 8px 22px rgba(76, 29, 149, 0.06);
}
.blindbox-recycle-page .blindboxRecycleBackBtn{
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(17, 24, 39, 0.08);
  color: rgba(17, 24, 39, 0.78);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
@media (hover: hover){
  .blindbox-recycle-page .blindboxRecycleBackBtn:hover{
    background: rgba(255, 255, 255, 0.95);
  }
}
.blindbox-recycle-page .blindboxRecycleBackBtn:active{
  transform: scale(0.96);
}
.blindbox-recycle-page .blindboxRecycleBackBtn__ico{
  display: block;
  width: 18px;
  height: 18px;
}
.blindbox-recycle-page .blindboxRecycleReleaseMeta{
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  color: rgba(71, 85, 105, 0.88);
  text-align: left;
  flex: 1 1 auto;
  min-width: 0;
}
.blindbox-recycle-page .blindboxRecycleReleaseMeta strong{
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: rgba(17, 24, 39, 0.88);
}
.blindbox-recycle-page .blindboxRecycleTopAllPts{
  flex-shrink: 0;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.28);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 4px 14px rgba(76, 29, 149, 0.08);
  cursor: pointer;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.04em;
  color: rgba(91, 33, 182, 0.96);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}
@media (hover: hover){
  .blindbox-recycle-page .blindboxRecycleTopAllPts:hover{
    border-color: rgba(124, 58, 237, 0.45);
    box-shadow: 0 6px 18px rgba(76, 29, 149, 0.12);
    transform: translateY(-1px);
  }
}
.blindbox-recycle-page .blindboxRecycleTopAllPts:active{
  transform: translateY(0);
}
.blindbox-recycle-page .blindboxRecycleLead a{
  color: rgba(91, 33, 182, 0.95);
  font-weight: 850;
}
.blindboxRecycleList{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.blindboxRecycleEmpty{
  margin: 0;
  padding: 36px 16px;
  text-align: center;
  font-size: 14px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.72);
  background: rgba(255, 255, 255, 0.72);
  border: 1px dashed rgba(124, 58, 237, 0.22);
  border-radius: 16px;
}
.blindboxRecycleRow{
  display: flex;
  align-items: stretch;
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(124, 58, 237, 0.14);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(245, 243, 255, 0.9));
  box-shadow: 0 8px 22px rgba(76, 29, 149, 0.06);
}
.blindboxRecycleRow__thumb{
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.06);
  border: 1px solid rgba(124, 58, 237, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
}
.blindboxRecycleRow__thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.blindboxRecycleRow__ph{
  font-size: 28px;
  line-height: 1;
  opacity: 0.75;
}
.blindboxRecycleRow__main{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.blindboxRecycleRow__hd{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.blindboxRecycleRow__name{
  font-size: 15px;
  font-weight: 900;
  line-height: 1.35;
  color: rgba(17, 24, 39, 0.92);
}
.blindboxRecycleRow__series{
  margin: 0;
  font-size: 12px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.78);
  line-height: 1.45;
}
.blindboxRecycleRow__order{
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  color: rgba(100, 116, 139, 0.85);
}
.blindboxRecycleRow__tail{
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 4px;
  min-width: 72px;
}
.blindboxRecycleRow__amt{
  font-size: 16px;
  font-weight: 950;
  letter-spacing: 0.02em;
  color: rgba(16, 185, 129, 0.95);
}
.blindboxRecycleRow__lbl{
  font-size: 11px;
  font-weight: 750;
  color: rgba(71, 85, 105, 0.65);
}

/* 盲盒回收记录 · 按单分组 + 积分详情弹窗 */
.blindboxRecycleCard{
  border-radius: 16px;
  border: 1px solid rgba(124, 58, 237, 0.14);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(245, 243, 255, 0.9));
  box-shadow: 0 8px 22px rgba(76, 29, 149, 0.06);
  overflow: hidden;
}
.blindboxRecycleCard__head{
  padding: 12px 14px 10px;
  border-bottom: 1px dashed rgba(124, 58, 237, 0.2);
}
.blindboxRecycleCard__series{
  margin: 0;
  font-size: 13px;
  font-weight: 800;
  color: rgba(17, 24, 39, 0.88);
  line-height: 1.4;
}
.blindboxRecycleCard__order{
  margin: 6px 0 0;
  font-size: 11px;
  font-weight: 600;
  color: rgba(100, 116, 139, 0.88);
}
.blindboxRecycleCard__items{
  padding: 10px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.blindboxRecycleItem{
  display: flex;
  align-items: center;
  gap: 10px;
}
.blindboxRecycleItem__thumb{
  width: 48px;
  height: 48px;
  border-radius: 12px;
}
.blindboxRecycleItem__main{
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.blindboxRecycleItem__hd{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  min-width: 0;
}
.blindboxRecycleItem__name{
  font-size: 14px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.92);
  line-height: 1.3;
}
.blindboxRecycleItem__amt{
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 900;
  color: rgba(16, 185, 129, 0.95);
}
.blindboxRecycleCard__ft{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 14px;
  border-top: 1px solid rgba(124, 58, 237, 0.1);
  background: rgba(255, 255, 255, 0.45);
}
.blindboxRecycleCard__sum{
  font-size: 12px;
  font-weight: 700;
  color: rgba(71, 85, 105, 0.88);
  line-height: 1.4;
}
.blindboxRecycleCard__detailBtn{
  margin-left: auto;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(124, 58, 237, 0.35);
  background: linear-gradient(135deg, rgba(192, 132, 252, 0.22), rgba(34, 211, 238, 0.14));
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: rgba(91, 33, 182, 0.98);
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.2s ease;
  box-shadow: 0 4px 14px rgba(76, 29, 149, 0.08);
}
@media (hover: hover){
  .blindboxRecycleCard__detailBtn:hover{
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(76, 29, 149, 0.12);
  }
}
.blindboxRecycleCard__detailBtn:active{
  transform: translateY(0);
}

.blindboxPointsModal{
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: 20px 16px;
  box-sizing: border-box;
}
.blindboxPointsModal[hidden]{
  display: none !important;
}
.blindboxPointsModal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.52);
  backdrop-filter: blur(4px);
}
.blindboxPointsModal__panel{
  position: relative;
  z-index: 1;
  width: min(400px, 100%);
  max-height: min(78vh, 560px);
  overflow: auto;
  border-radius: 18px;
  padding: 0 0 16px;
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(245, 243, 255, 0.96));
  border: 1px solid rgba(124, 58, 237, 0.2);
  box-shadow: 0 24px 60px rgba(76, 29, 149, 0.18);
}
.blindboxPointsModal__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px 8px;
  position: sticky;
  top: 0;
  background: inherit;
  border-bottom: 1px solid rgba(124, 58, 237, 0.1);
}
.blindboxPointsModal__title{
  margin: 0;
  font-size: 17px;
  font-weight: 950;
  color: rgba(17, 24, 39, 0.94);
}
.blindboxPointsModal__close{
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 10px;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: rgba(71, 85, 105, 0.75);
  background: rgba(15, 23, 42, 0.06);
}
.blindboxPointsModal__close:hover{
  background: rgba(15, 23, 42, 0.1);
}
.blindboxPointsModal__meta{
  margin: 0;
  padding: 10px 16px 12px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.5;
  color: rgba(71, 85, 105, 0.88);
}
.blindboxPointsModal__list{
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.blindboxPointsModal__row{
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.12);
  background: rgba(255, 255, 255, 0.75);
}
.blindboxPointsModal__rowTop{
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.blindboxPointsModal__date{
  font-size: 13px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.9);
}
.blindboxPointsModal__pts{
  font-size: 14px;
  font-weight: 900;
  color: rgba(124, 58, 237, 0.95);
}
.blindboxPointsModal__status{
  font-size: 11px;
  font-weight: 800;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2);
  color: rgba(71, 85, 105, 0.9);
}
.blindboxPointsModal__status--ok{
  background: rgba(16, 185, 129, 0.18);
  color: rgba(5, 122, 85, 0.95);
}
.blindboxPointsModal__status--run{
  background: rgba(251, 191, 36, 0.2);
  color: rgba(146, 64, 14, 0.95);
}
.blindboxPointsModal__status--wait{
  background: rgba(148, 163, 184, 0.22);
  color: rgba(71, 85, 105, 0.85);
}
.blindboxPointsModal__progress{
  height: 6px;
  border-radius: 999px;
  background: rgba(124, 58, 237, 0.1);
  overflow: hidden;
  margin-bottom: 8px;
}
.blindboxPointsModal__progressBar{
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(34, 211, 238, 0.85), rgba(124, 58, 237, 0.85));
  transition: width 0.3s ease;
}
.blindboxPointsModal__note{
  margin: 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.45;
  color: rgba(100, 116, 139, 0.88);
}
.blindboxPointsModal__footNote{
  margin: 14px 16px 0;
  font-size: 11px;
  font-weight: 600;
  text-align: center;
  color: rgba(100, 116, 139, 0.75);
}

/* 资金记录 fund-records.html */
.fund-records-page .app{
  padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));
}
.fund-records-page .fundRecordsTopbarRow{
  position: relative;
  grid-template-columns: 1fr;
  justify-items: center;
}
.fund-records-page .fundRecordsTopbarRow .left{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.fund-records-page .fundRecordsTopbarRow .title{
  justify-self: center;
  text-align: center;
  padding-left: 0;
  max-width: calc(100% - 72px);
}
.fund-records-page .fundRecordsBackBtn{
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid rgba(17, 24, 39, 0.08);
  color: rgba(17, 24, 39, 0.78);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease;
}
@media (hover: hover){
  .fund-records-page .fundRecordsBackBtn:hover{
    background: rgba(255, 255, 255, 0.95);
  }
}
.fund-records-page .fundRecordsBackBtn:active{
  transform: scale(0.96);
}
.fund-records-page .fundRecordsBackBtn__ico{
  display: block;
  width: 18px;
  height: 18px;
}
.fund-records-page .fundRecordsSectionTabs{
  padding-top: 8px;
  padding-bottom: 0;
}
.fund-records-page .fundRecordsTabs{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
  border: 1px solid rgba(192, 132, 252, 0.22);
  box-shadow: 0 8px 22px rgba(76, 29, 149, 0.06);
}
.fund-records-page .fundRecordsTab{
  margin: 0;
  padding: 9px 6px;
  border: none;
  border-radius: 10px;
  background: transparent;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.02em;
  color: rgba(71, 85, 105, 0.82);
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}
.fund-records-page .fundRecordsTab[aria-selected="true"]{
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.95), rgba(34, 211, 238, 0.88));
  color: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 20px rgba(91, 33, 182, 0.22);
}
.fund-records-page .fundRecordsTab:focus-visible{
  outline: 2px solid rgba(124, 58, 237, 0.55);
  outline-offset: 2px;
}
.fund-records-page .fundRecordsSectionPanels{
  padding-top: 4px;
}
.fund-records-page .fundRecordsPanel[hidden]{
  display: none !important;
}
.fund-records-page .fundRecordsAccountBar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 255, 0.88));
  border: 1px solid rgba(192, 132, 252, 0.32);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.75) inset,
    0 6px 18px rgba(76, 29, 149, 0.07);
}
.fund-records-page .fundRecordsAccountBar__lab{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: rgba(71, 85, 105, 0.82);
}
.fund-records-page .fundRecordsAccountBar__val{
  font-size: 18px;
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  color: rgba(234, 88, 12, 0.98);
}
.fund-records-page .fundRecordsAccountBar--pts .fundRecordsAccountBar__val{
  color: rgba(124, 58, 237, 0.98);
}
.fund-records-page .fundRecordsExchange{
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(248, 245, 255, 0.88));
  border: 1px solid rgba(192, 132, 252, 0.32);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.75) inset,
    0 6px 18px rgba(76, 29, 149, 0.07);
}
.fund-records-page .fundRecordsExchange__head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.fund-records-page .fundRecordsExchange__title{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.02em;
  color: rgba(17, 24, 39, 0.9);
}
.fund-records-page .fundRecordsExchange__pts{
  font-size: 12px;
  font-weight: 650;
  color: rgba(71, 85, 105, 0.88);
}
.fund-records-page .fundRecordsExchange__pts strong{
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  color: rgba(124, 58, 237, 0.98);
}
.fund-records-page .fundRecordsExchange__rate{
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.45;
  color: rgba(71, 85, 105, 0.82);
}
.fund-records-page .fundRecordsExchange__rate strong{
  color: rgba(147, 51, 234, 0.95);
  font-weight: 850;
}
.fund-records-page .fundRecordsExchange__field{
  margin-bottom: 6px;
}
.fund-records-page .fundRecordsExchange__label{
  display: block;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 6px;
  color: rgba(35, 28, 70, 0.78);
}
.fund-records-page .fundRecordsExchange__row{
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.fund-records-page .fundRecordsExchange__input{
  flex: 1;
  min-width: 0;
  border: 1px solid rgba(192, 132, 252, 0.35);
  border-radius: 10px;
  padding: 9px 10px;
  font-size: 13px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  color: rgba(17, 24, 39, 0.9);
  background: rgba(255, 255, 255, 0.95);
  outline: none;
}
.fund-records-page .fundRecordsExchange__input:focus{
  border-color: rgba(76, 242, 255, 0.55);
  box-shadow: 0 0 0 2px rgba(192, 132, 252, 0.2);
}
.fund-records-page .fundRecordsExchange__input::placeholder{
  color: rgba(100, 116, 139, 0.55);
  font-size: 12px;
}
.fund-records-page .fundRecordsExchange__preview{
  margin: 8px 0 0;
  font-size: 12px;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: rgba(234, 88, 12, 0.95);
}
.fund-records-page .fundRecordsExchange__hint{
  margin: 8px 0 0;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.45;
  color: rgba(100, 116, 139, 0.78);
}
.fund-records-page .fundRecordsList{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.fund-records-page .fundRecordsEmpty{
  margin: 0;
  padding: 32px 14px;
  text-align: center;
  font-size: 13px;
  font-weight: 650;
  color: rgba(100, 116, 139, 0.82);
  background: rgba(255, 255, 255, 0.65);
  border: 1px dashed rgba(124, 58, 237, 0.22);
  border-radius: 14px;
}
.fund-records-page .fundRecordsCard{
  margin: 0;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(124, 58, 237, 0.16);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.98), rgba(248, 245, 255, 0.55));
  box-shadow: 0 8px 20px rgba(76, 29, 149, 0.05);
}
.fund-records-page .fundRecordsCard--msg .fundRecordsCard__title{
  margin-top: 4px;
}
.fund-records-page .fundRecordsCard__time{
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: rgba(100, 116, 139, 0.88);
}
.fund-records-page .fundRecordsCard__title{
  margin: 0;
  font-size: 14px;
  font-weight: 850;
  color: rgba(17, 24, 39, 0.9);
}
.fund-records-page .fundRecordsCard__body{
  margin: 6px 0 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: rgba(71, 85, 105, 0.9);
}
.fund-records-page .fundRecordsCard__row{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.fund-records-page .fundRecordsCard__main{
  min-width: 0;
  flex: 1;
}
.fund-records-page .fundRecordsDelta{
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
}
.fund-records-page .fundRecordsDelta--money,
.fund-records-page .fundRecordsDelta--pts{
  min-width: 5.5em;
  text-align: right;
}
.fund-records-page .fundRecordsDelta--pos{
  color: rgba(22, 163, 74, 0.95);
}
.fund-records-page .fundRecordsDelta--neg{
  color: rgba(220, 38, 38, 0.92);
}
.fund-records-page .fundRecordsCard__afterRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 10px 0 0;
  padding-top: 10px;
  border-top: 1px dashed rgba(124, 58, 237, 0.16);
  font-size: 12px;
  font-weight: 750;
}
.fund-records-page .fundRecordsCard__afterLab{
  flex-shrink: 0;
  color: rgba(71, 85, 105, 0.78);
}
.fund-records-page .fundRecordsCard__afterVal{
  font-weight: 950;
  font-variant-numeric: tabular-nums;
  text-align: right;
}
.fund-records-page .fundRecordsCard__afterVal--bal{
  color: rgba(234, 88, 12, 0.96);
}
.fund-records-page .fundRecordsCard__afterVal--pts{
  color: rgba(124, 58, 237, 0.96);
}
.fund-records-page .fundRecordsCard__afterUnit{
  font-weight: 700;
  font-size: 11px;
  color: rgba(71, 85, 105, 0.72);
}
.fund-records-page .fundRecordsCard__afterRow--muted .fundRecordsCard__afterVal{
  color: rgba(100, 116, 139, 0.5);
  font-weight: 800;
}