@charset "UTF-8";

html.page-index-yiyuan-grid {
  min-width: 320px;
  min-height: 100%;
  overflow-x: hidden;
  background: #edf0f4;
  font-size: min(5.833333vw, 28px) !important;
}

body.page-index-yiyuan-grid {
  --lux-bg: #0b0f1c;
  --lux-bg-deep: #080b15;
  --lux-panel: #171c2d;
  --lux-panel-soft: #1b2032;
  --lux-gold: #c9a87a;
  --lux-gold-bright: #f1ca83;
  --lux-text: rgba(255, 255, 255, .9);
  --lux-muted: rgba(229, 231, 239, .62);
  --lux-line: rgba(201, 168, 122, .2);
  width: 100%;
  max-width: 480px;
  min-height: 100vh;
  margin: 0 auto !important;
  overflow-x: hidden;
  color: var(--lux-text);
  background:
    radial-gradient(circle at 10% 8%, rgba(100, 79, 160, .13), transparent 24rem),
    linear-gradient(180deg, #0d1120 0%, #090d19 100%);
  box-shadow: 0 0 42px rgba(9, 12, 23, .18);
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  font-size: .48rem;
  font-weight: 300;
  letter-spacing: .01em;
}

body.page-index-yiyuan-grid *,
body.page-index-yiyuan-grid *::before,
body.page-index-yiyuan-grid *::after {
  box-sizing: border-box;
}

body.page-index-yiyuan-grid a {
  color: inherit;
  text-decoration: none;
}

body.page-index-yiyuan-grid img {
  max-width: 100%;
}

.lux-home-shell {
  position: relative;
  min-height: 100vh;
  padding-bottom: calc(2.2rem + env(safe-area-inset-bottom, 0px));
}

.lux-header-spacer {
  height: 1.845rem;
}

.lux-header {
  position: fixed;
  z-index: 900;
  top: 0;
  left: 50%;
  display: flex;
  align-items: center;
  gap: .1rem;
  width: min(100%, 480px);
  height: 1.845rem;
  padding: .12rem .28rem .1rem;
  transform: translateX(-50%);
  border-bottom: 1px solid rgba(201, 168, 122, .08);
  background: rgba(10, 14, 28, .82);
  box-shadow: 0 .28rem 1rem rgba(0, 0, 0, .35);
  backdrop-filter: blur(14px);
}

.lux-lang {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .1rem;
  height: 1.16rem;
  padding: 0 .16rem 0 .12rem;
  color: var(--lux-text);
  border: 1px solid rgba(201, 168, 122, .2);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  box-shadow: 0 .14rem .56rem rgba(0, 0, 0, .25);
  font-size: .48rem;
  cursor: pointer;
}

.lux-lang img {
  width: .62rem;
  height: .44rem;
  border-radius: .08rem;
  object-fit: cover;
}

.lux-lang-caret {
  width: 0;
  height: 0;
  margin-left: .02rem;
  border-top: .14rem solid rgba(255, 255, 255, .68);
  border-right: .1rem solid transparent;
  border-left: .1rem solid transparent;
}

.lux-search {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: .14rem;
  min-width: 0;
  height: 1.22rem;
  margin: 0 .12rem 0 .08rem;
  padding: 0 .32rem;
  color: rgba(255, 255, 255, .46);
  border: 1px solid rgba(201, 168, 122, .22);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 1px rgba(255, 255, 255, .06);
  font-size: .44rem;
}

.lux-search img {
  width: .7rem;
  height: .7rem;
  opacity: .72;
}

.lux-search span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.lux-header-actions {
  display: flex;
  flex: 0 0 auto;
  gap: .08rem;
}

.lux-icon-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.08rem;
  height: 1.08rem;
  padding: .18rem;
  border: 1px solid rgba(201, 168, 122, .22);
  border-radius: 50%;
  background: rgba(255, 255, 255, .06);
  cursor: pointer;
}

.lux-icon-btn img {
  width: .68rem;
  height: .68rem;
  opacity: .78;
}

.lux-msg-dot {
  position: absolute;
  top: .1rem;
  right: .08rem;
  width: .18rem;
  height: .18rem;
  border-radius: 50%;
  background: #d8aa58;
  box-shadow: 0 0 .24rem rgba(241, 202, 131, .7);
}

.lux-lang-menu {
  position: fixed;
  z-index: 1200;
  top: 1.5rem;
  left: max(calc(50% - 8.28rem), .28rem);
  display: none;
  width: 7.3rem;
  padding: .2rem;
  border: 1px solid var(--lux-line);
  border-radius: .4rem;
  background: rgba(20, 24, 39, .98);
  box-shadow: 0 .5rem 1.8rem rgba(0, 0, 0, .5);
}

.lux-lang-menu.is-open {
  display: block;
}

.lux-lang-menu button {
  width: 100%;
  padding: .34rem .4rem;
  color: var(--lux-text);
  border: 0;
  border-radius: .24rem;
  background: transparent;
  text-align: left;
  font-size: .46rem;
}

.lux-lang-menu button:first-child {
  color: var(--lux-gold-bright);
  background: rgba(201, 168, 122, .12);
}

.lux-hero {
  position: relative;
  display: block;
  overflow: hidden;
  aspect-ratio: 2 / 1;
  margin: .315rem .36rem .225rem;
  border: 0;
  border-radius: .585rem;
  background: #111525;
  box-shadow: none;
}

.lux-hero .bd {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.lux-hero .wap-h-carousel__track {
  display: flex;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  will-change: transform;
  transform: translate3d(0, 0, 0);
  transition: transform 380ms cubic-bezier(.25, .46, .45, .94);
}

.lux-hero .wap-h-carousel__track > li {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.lux-hero .wap-h-carousel__track a {
  display: block;
  width: 100%;
  height: 100%;
}

.lux-hero img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lux-hero .hd {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: .18rem;
  width: auto;
  transform: translateX(-50%);
}

.lux-hero .hd ul {
  display: flex;
  align-items: center;
  gap: .1575rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lux-hero .hd li {
  display: block;
  width: .1575rem;
  height: .1575rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .28);
  cursor: pointer;
  transition: background .3s, transform .3s;
}

.lux-hero .hd li.on {
  background: linear-gradient(135deg, #e8c88a, #c9a87a);
  box-shadow: 0 0 10px rgba(232, 200, 138, .6);
  transform: scale(1.15);
}

.lux-dock {
  min-height: 4.12rem;
  margin: 0 .315rem .225rem;
  padding: .36rem .2rem .4rem;
  border: 1px solid rgba(201, 168, 122, .15);
  border-radius: .54rem;
  background: #171c2d;
  box-shadow: 0 8px 32px rgba(0, 0, 0, .25);
}

.lux-dock-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
}

.lux-dock-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .12rem;
  color: rgba(236, 235, 242, .68);
  font-size: .54rem;
}

.lux-dock-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.68rem;
  height: 1.68rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(203, 169, 96, .12), transparent 68%);
}

.lux-dock-icon img {
  width: 1.62rem;
  height: 1.62rem;
  object-fit: contain;
}

.lux-notice {
  display: flex;
  align-items: center;
  min-height: 1.37rem;
  margin: .27rem .315rem;
  padding: .39rem .4rem;
  border: 1px solid var(--lux-line);
  border-radius: .4rem;
  background: #191f2f;
  box-shadow: 0 .14rem .86rem rgba(0, 0, 0, .2);
}

.lux-notice-tag {
  flex: 0 0 auto;
  margin-right: .34rem;
  padding: .08rem .28rem;
  color: #2b241a;
  border-radius: .16rem;
  background: linear-gradient(180deg, #f4d89c, #cba45d);
  box-shadow: 0 0 .34rem rgba(235, 195, 116, .26);
  font-size: .42rem;
  font-weight: 800;
}

.lux-notice-copy {
  min-width: 0;
  color: rgba(255, 255, 255, .58);
  white-space: nowrap;
  overflow: hidden;
  font-size: .42rem;
}

.lux-notice-copy marquee {
  display: block;
}

.lux-notice-copy em {
  color: var(--lux-gold-bright);
  font-style: normal;
  font-weight: 700;
}

.lux-panel {
  position: relative;
  overflow: hidden;
  min-height: 8.21rem;
  margin: .315rem .315rem 0;
  border: 1px solid rgba(201, 168, 122, .28);
  border-radius: .52rem;
  background: linear-gradient(145deg, rgba(30, 28, 45, .95), rgba(18, 20, 35, .98));
  box-shadow: 0 .56rem 1.72rem rgba(0, 0, 0, .4), inset 0 1px rgba(255, 255, 255, .06);
}

.lux-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 1.22rem;
  padding: .32rem .34rem .18rem;
}

.lux-section-title {
  display: flex;
  align-items: center;
  gap: .18rem;
  color: rgba(255, 255, 255, .9);
  font-size: .58rem;
  font-weight: 700;
}

.lux-section-title::before {
  content: "";
  width: .1rem;
  height: .66rem;
  border-radius: 999px;
  background: linear-gradient(#f0d08d, #a97d3d);
  box-shadow: 0 0 .3rem rgba(240, 208, 141, .35);
}

.lux-section-more {
  color: #d4b276;
  font-size: .4rem;
}

.lux-card-scroll {
  overflow-x: auto;
  padding: 0 .28rem .28rem;
  scrollbar-width: none;
}

.lux-card-scroll::-webkit-scrollbar {
  display: none;
}

.lux-reveal-list {
  display: flex;
  gap: .18rem;
  width: max-content;
}

.lux-reveal-card {
  position: relative;
  overflow: hidden;
  flex: 0 0 4.67rem;
  height: 6.48rem;
  border: 1px solid rgba(201, 168, 122, .12);
  border-radius: .16rem;
  background: rgba(255, 255, 255, .04);
  box-shadow: 0 .28rem .86rem rgba(0, 0, 0, .35);
}

.lux-reveal-pic {
  position: relative;
  height: 4.6rem;
  padding: .12rem;
  background: rgba(0, 0, 0, .25);
  box-shadow: inset 0 0 0 1px rgba(201, 168, 122, .08);
}

.lux-reveal-pic img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.lux-reveal-status {
  position: absolute;
  top: .12rem;
  right: .12rem;
  padding: .08rem .18rem;
  color: #2a2319;
  border-radius: .12rem;
  background: linear-gradient(180deg, #f2d594, #c89d50);
  font-size: .32rem;
  font-weight: 700;
}

.lux-reveal-info {
  padding: .22rem .24rem;
  text-align: center;
}

.lux-reveal-label {
  margin-bottom: .08rem;
  color: rgba(255, 255, 255, .52);
  font-size: .37rem;
}

.lux-reveal-value {
  overflow: hidden;
  color: #e8dece;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: .43rem;
  font-weight: 700;
}

.lux-countdown b {
  display: inline-block;
  min-width: .58rem;
  margin: 0 .02rem;
  padding: .08rem .06rem;
  color: #f6dda3;
  border: 1px solid rgba(201, 168, 122, .3);
  border-radius: .08rem;
  background: #2b2630;
  font-size: .38rem;
}

.lux-soon {
  margin-top: .34rem;
  padding-bottom: 0;
  border-top: 1px solid rgba(201, 168, 122, .12);
  border-bottom: 1px solid rgba(201, 168, 122, .12);
}

.lux-soon .lux-card-scroll {
  padding: 0;
}

.lux-soon-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .58rem .34rem .37rem;
}

.lux-soon-title {
  display: flex;
  align-items: center;
  gap: .32rem;
}

.lux-soon-title h3 {
  position: relative;
  margin: 0;
  color: rgba(255, 255, 255, .86);
  font-size: .56rem;
  font-weight: 700;
}

.lux-soon-title h3::before {
  content: "";
  position: absolute;
  left: -.26rem;
  top: .05rem;
  width: .1rem;
  height: .56rem;
  border-radius: 999px;
  background: #d0aa69;
}

.lux-soon-sub {
  color: rgba(255, 255, 255, .4);
  font-size: .38rem;
}

.lux-soon-track {
  display: flex;
  gap: .22rem;
  width: max-content;
  padding: .04rem .28rem .56rem;
}

.lux-soon-card {
  display: flex;
  flex: 0 0 7.88rem;
  align-items: center;
  gap: .24rem;
  min-height: 3.8rem;
  padding: .22rem;
  border: 1px solid rgba(201, 168, 122, .12);
  border-radius: .36rem;
  background: rgba(255, 255, 255, .04);
  box-shadow: inset 0 1px rgba(255, 255, 255, .03);
}

.lux-soon-card img {
  flex: 0 0 auto;
  width: 2.92rem;
  height: 2.92rem;
  object-fit: contain;
}

.lux-soon-info {
  min-width: 0;
}

.lux-soon-name {
  display: -webkit-box;
  overflow: hidden;
  margin: 0 0 .26rem;
  color: rgba(255, 255, 255, .76);
  font-size: .42rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.lux-progress {
  overflow: hidden;
  width: 100%;
  height: .12rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
}

.lux-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #b68745, #f1cf8e);
  box-shadow: 0 0 .3rem rgba(232, 191, 112, .42);
}

.lux-soon-remain {
  margin-top: .2rem;
  color: rgba(255, 255, 255, .42);
  font-size: .36rem;
}

.lux-soon-remain em {
  color: var(--lux-gold-bright);
  font-style: normal;
  font-weight: 700;
}

.lux-category-nav {
  position: sticky;
  z-index: 40;
  top: 1.64rem;
  overflow-x: auto;
  margin-top: .34rem;
  padding: 0 .28rem;
  border-top: 1px solid rgba(201, 168, 122, .12);
  border-bottom: 1px solid rgba(201, 168, 122, .12);
  background: rgba(12, 16, 29, .94);
  backdrop-filter: blur(10px);
  scrollbar-width: none;
}

.lux-category-nav::-webkit-scrollbar {
  display: none;
}

.lux-category-list {
  display: flex;
  align-items: center;
  gap: .1rem;
  width: max-content;
  min-width: 100%;
}

.lux-category-item {
  position: relative;
  flex: 0 0 auto;
  padding: .71rem .34rem .63rem;
  color: rgba(255, 255, 255, .5);
  font-size: .46rem;
  cursor: pointer;
}

.lux-category-item.current {
  color: #f0cf91;
  font-weight: 700;
}

.lux-category-item.current::after {
  content: "";
  position: absolute;
  right: .34rem;
  bottom: .08rem;
  left: .34rem;
  height: .08rem;
  border-radius: 999px;
  background: linear-gradient(90deg, #b7833d, #f2d69b);
  box-shadow: 0 0 .24rem rgba(240, 205, 139, .42);
}

.lux-products {
  padding: .22rem .27rem .4rem;
}

.lux-products .goodsList {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .25rem;
}

.lux-products .goodsList > ul {
  min-width: 0;
}

.idx-yiyuan-card {
  position: relative;
  overflow: visible;
  min-width: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.idx-yiyuan-card__link {
  display: block;
  padding: .225rem .22rem .24rem;
  border: 1px solid rgba(201, 168, 122, .16);
  border-radius: .36rem;
  background: linear-gradient(165deg, rgba(32, 30, 48, .92) 0%, rgba(18, 20, 34, .96) 100%);
  box-shadow: 0 12px 40px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .05);
}

.idx-yiyuan-card__pic {
  position: relative;
  width: 100%;
  height: 0;
  margin-bottom: .1575rem;
  padding: 88% 0 0;
  border-radius: .27rem;
  overflow: hidden;
}

.idx-yiyuan-card__img {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 96%;
  height: 96%;
  max-width: none;
  object-fit: contain;
  transform: translate(-50%, -50%);
}

.idx-yiyuan-card__tags {
  position: absolute;
  z-index: 2;
  top: .04rem;
  right: .02rem;
}

.idx-yiyuan-tag {
  display: inline-flex;
  align-items: center;
  padding: .08rem .2rem;
  color: #dfc894;
  border: 1px solid rgba(201, 168, 122, .25);
  border-radius: 999px;
  background: rgba(89, 69, 36, .32);
  font-size: .3rem;
}

.idx-yiyuan-tag::before {
  content: "";
  width: .12rem;
  height: .12rem;
  margin-right: .1rem;
  border-radius: 50%;
  background: #d9b265;
  box-shadow: 0 0 .2rem rgba(234, 194, 116, .7);
}

.idx-yiyuan-card__title {
  display: -webkit-box;
  overflow: hidden;
  min-height: 3em;
  max-height: 3em;
  margin: 0;
  padding: 0 .045rem;
  color: rgba(255, 255, 255, .86);
  font-size: .518rem;
  font-weight: 500;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.idx-yiyuan-card__price-row {
  display: flex;
  align-items: center;
  margin-top: .135rem;
  padding: 0 .045rem;
}

.idx-yiyuan-card__price {
  margin: 0;
  line-height: 1;
}

.idx-yiyuan-card__price em {
  color: #f0c14b;
  font-size: .72rem;
  font-style: normal;
  font-weight: 700;
}

.idx-yiyuan-card__price span {
  margin-left: .045rem;
  color: #bda56f;
  font-size: .4275rem;
  font-weight: 500;
}

.idx-yiyuan-card__prog-row {
  display: flex;
  align-items: center;
  gap: .135rem;
  margin: .1575rem .045rem 0;
  padding: 0 .045rem;
}

.idx-yiyuan-card__prog-track {
  flex: 1 1 auto;
  overflow: hidden;
  height: .18rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .35);
}

.idx-yiyuan-card__prog-track .idx-progress-fill {
  display: block;
  min-width: 0;
  height: 100%;
  border-radius: 999px;
  background-color: #c9a87a;
  background-image: linear-gradient(90deg, #f0c14b 0%, #e8a040 25%, #c9a87a 50%, #b87333 75%, #8b5a2b 100%);
  background-position: 200% 50%;
  background-size: 200% 100%;
  transition: width .25s ease;
  animation: idx-progress-flow 1.5s linear infinite, idxLuxGoldPulse 2s ease-in-out infinite;
}

.idx-yiyuan-card__pct {
  flex: 0 0 auto;
  min-width: 1.0125rem;
  color: rgba(255, 255, 255, .54);
  text-align: right;
  font-size: .4725rem;
  font-weight: 600;
  line-height: 1;
}

.idx-yiyuan-card__joining {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  margin: .1575rem .045rem 0;
  padding: .1575rem .135rem;
  border: 1px solid rgba(201, 168, 122, .12);
  border-radius: .225rem;
  background: rgba(255, 255, 255, .06);
}

.idx-yiyuan-card__avatars {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  max-width: 3.2625rem;
  padding-right: .045rem;
}

.idx-yiyuan-card__avatar {
  display: block;
  flex-shrink: 0;
  width: .63rem;
  height: .63rem;
  margin-left: -.1575rem;
  border: 2px solid rgba(18, 20, 34, .95);
  border-radius: 50%;
  background: rgba(30, 28, 45, .9);
  object-fit: cover;
}

.idx-yiyuan-card__avatar:first-child {
  margin-left: 0;
}

.idx-yiyuan-card__remain {
  position: relative;
  display: inline-flex;
  align-items: baseline;
  overflow: hidden;
  flex-shrink: 0;
  gap: .045rem;
  padding: .09rem .1575rem;
  color: rgba(255, 255, 255, .38);
  border: 1px solid rgba(201, 168, 122, .15);
  border-radius: .135rem;
  background: rgba(0, 0, 0, .22);
  white-space: nowrap;
  line-height: 1.3;
}

.idx-yiyuan-card__remain::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(232, 200, 138, .22) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  animation: idx-yiyuan-remain-shimmer 4.5s ease-in-out infinite;
}

.lux-products .goodsList > ul:nth-of-type(3n + 2) .idx-yiyuan-card__remain::after {
  animation-delay: 1.5s;
}

.lux-products .goodsList > ul:nth-of-type(3n) .idx-yiyuan-card__remain::after {
  animation-delay: 3s;
}

.idx-yiyuan-card__remain em {
  color: #f0c14b;
  font-size: .4725rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .0225em;
  text-shadow: 0 0 12px rgba(240, 193, 75, .35);
}

.idx-yiyuan-card__stat-label {
  color: rgba(255, 255, 255, .45);
  font-size: .3375rem;
  font-weight: 400;
}

.idx-yiyuan-card__cta {
  display: block;
  width: calc(100% - .09rem);
  height: auto;
  margin: .18rem .045rem 0;
  padding: .27rem 0;
  color: #2a2218;
  border-radius: 999px;
  background: linear-gradient(135deg, #a67c52 0%, #e8c88a 45%, #c9a87a 100%);
  box-shadow: 0 4px 16px rgba(201, 168, 122, .4);
  text-align: center;
  font-size: .518rem;
  font-weight: 800;
  line-height: 1.2;
}

@keyframes idx-progress-flow {
  0% { background-position: 200% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes idxLuxGoldPulse {
  0%,
  100% { filter: brightness(1) saturate(1.05); }
  50% { filter: brightness(1.12) saturate(1.15); }
}

@keyframes idx-yiyuan-remain-shimmer {
  0% {
    left: -75%;
    opacity: 0;
  }
  15% { opacity: 1; }
  50% {
    left: 125%;
    opacity: 0;
  }
  100% {
    left: 125%;
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .idx-yiyuan-card__prog-track .idx-progress-fill {
    animation: none;
  }

  .idx-yiyuan-card__remain::after {
    display: none;
  }
}

.idx-yiyuan-card__cta:active {
  transform: translateY(1px);
  filter: brightness(.94);
}

.lux-loading {
  grid-column: 1 / -1;
  display: none;
  padding: .6rem 0;
  color: rgba(255, 255, 255, .38);
  text-align: center;
  font-size: .4rem;
}

.lux-service-mask {
  position: fixed;
  z-index: 1600;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(2, 4, 10, .72);
  backdrop-filter: blur(6px);
}

.lux-service-mask.is-open {
  display: flex;
}

.lux-service-card {
  width: 12.4rem;
  padding: .55rem;
  border: 1px solid rgba(201, 168, 122, .28);
  border-radius: .52rem;
  background: #171c2d;
  box-shadow: 0 .6rem 2.2rem rgba(0, 0, 0, .55);
  text-align: center;
}

.lux-service-card img {
  width: 8.4rem;
  max-height: 10rem;
  border-radius: .3rem;
  object-fit: contain;
}

.lux-service-card p {
  margin-top: .34rem;
  color: rgba(255, 255, 255, .58);
  font-size: .42rem;
}

.lux-share-toast {
  position: fixed;
  z-index: 1800;
  left: 50%;
  bottom: 2.8rem;
  display: none;
  padding: .32rem .55rem;
  transform: translateX(-50%);
  color: #2b2318;
  border-radius: 999px;
  background: linear-gradient(180deg, #f1d498, #cba45f);
  box-shadow: 0 .28rem 1rem rgba(0, 0, 0, .4);
  font-size: .4rem;
  font-weight: 700;
}

.lux-footer {
  position: fixed;
  z-index: 1000;
  right: 50%;
  bottom: 0;
  left: 50%;
  width: min(100%, 480px);
  height: calc(2rem + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  border-top: 1px solid rgba(201, 168, 122, .2);
  background: rgba(10, 14, 27, .97);
  box-shadow: 0 -.2rem .8rem rgba(0, 0, 0, .35);
  backdrop-filter: blur(14px);
}

.lux-footer-list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  height: 2rem;
}

.lux-footer-item {
  min-width: 0;
  color: rgba(230, 231, 237, .56);
  text-align: center;
}

.lux-footer-item a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .02rem;
  height: 100%;
  font-size: .4rem;
}

.lux-footer-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: .8rem;
  height: .8rem;
}

.lux-footer-icon img {
  width: .8rem;
  height: .8rem;
  opacity: .72;
}

.lux-footer-item.is-active {
  color: #f1cb83;
  font-weight: 700;
}

.lux-footer-item.is-active .lux-footer-icon img {
  opacity: 1;
  filter: sepia(1) saturate(.7) brightness(1.3);
}

.lux-footer-item--medal .lux-footer-icon {
  flex: 0 0 1.4rem;
  width: 1.4rem;
  height: 1.4rem;
  min-height: 1.4rem;
  margin-top: -.4rem;
  border: 1px solid rgba(201, 168, 122, .45);
  border-radius: 50%;
  background: linear-gradient(180deg, rgba(30, 28, 45, .95) 0%, rgba(18, 20, 35, .98) 100%);
  box-shadow: 0 2px 12px rgba(0, 0, 0, .35);
}

.lux-footer-item--medal .lux-footer-icon img {
  width: 1.08rem;
  height: 1.08rem;
  opacity: 1;
}

.lux-cart-num {
  position: absolute;
  top: -.18rem;
  right: -.28rem;
  display: none;
  min-width: .56rem;
  height: .56rem;
  padding: 0 .12rem;
  color: white;
  border: 1px solid white;
  border-radius: 999px;
  background: #d73d3d;
  font-size: .3rem;
  line-height: .5rem;
}

@media (max-width: 360px) {
  .lux-search {
    padding: 0 .22rem;
  }

  .lux-dock-item {
    font-size: .5rem;
  }
}

@media (min-width: 480px) {
  .lux-header,
  .lux-header-spacer {
    height: 1.64rem;
  }

  .lux-hero {
    margin: .36rem .32rem .2rem;
  }

  .lux-dock {
    min-height: 3.66rem;
    margin-right: .28rem;
    margin-left: .28rem;
  }

  .lux-notice {
    margin: .24rem .28rem;
    padding-top: .3rem;
    padding-bottom: .3rem;
  }

  .lux-panel {
    min-height: 8rem;
    margin-top: .28rem;
    margin-right: .28rem;
    margin-left: .28rem;
  }

  .lux-soon {
    margin-top: .3rem;
    padding-bottom: .26rem;
  }

  .lux-soon-head {
    padding: .38rem .34rem .2rem;
  }

  .lux-soon-track {
    padding: .04rem .28rem .46rem;
  }

  .lux-soon-card {
    flex-basis: 6.3rem;
    min-height: 3.18rem;
  }

  .lux-soon-card img {
    width: 2.42rem;
    height: 2.42rem;
  }

  .lux-category-item {
    padding: .62rem .34rem .555rem;
  }

  .lux-category-nav {
    margin-top: .36rem;
  }

  .lux-products {
    padding-top: .16rem;
    padding-right: .24rem;
    padding-left: .24rem;
  }

  .lux-products .goodsList {
    gap: .265rem;
  }

  .idx-yiyuan-card__pic {
    height: 7rem;
  }

  .idx-yiyuan-card__cta {
    height: 1.18rem;
  }
}
