/* PC 会员中心：Figma 49073:487271 / 49073:488960。
   仅由电脑端会员模板加载，保留手机端和金币充值的既有布局。 */
.desktop-member-light-beams { display: none; }
@media (min-width: 1200px) {
  .desktop-member-light-beams { position: absolute; z-index: -1; top: 48px; left: calc((100% - var(--member-width)) / 2); display: block; width: 718px; height: 461px; opacity: .6; pointer-events: none; }
  .desktop-member-light-beams i { position: absolute; top: 0; width: 32px; height: 458px; background: linear-gradient(transparent, rgba(255,255,255,.3) 47.596%, transparent); }
  .desktop-member-light-beams i:nth-child(1) { left: 91px; width: 67px; }
  .desktop-member-light-beams i:nth-child(2) { left: 0; width: 67px; }
  .desktop-member-light-beams i:nth-child(3) { left: 196px; width: 66px; }
  .desktop-member-light-beams i:nth-child(4) { left: 308px; }
  .desktop-member-light-beams i:nth-child(5) { left: 589px; }
  .desktop-member-light-beams i:nth-child(6) { left: 638px; }
  .desktop-member-light-beams i:nth-child(7) { left: 686px; }
  .desktop-member-light-beams i:nth-child(8) { left: 360px; width: 37px; }
  .desktop-member-light-beams i:nth-child(9) { left: 420px; width: 37px; }
  .desktop-member-light-beams i:nth-child(10) { left: 473px; width: 99px; }
  body[data-recharge-tab="member"] { background: #070707; }
  body[data-recharge-tab="member"] .mobile-recharge-shell {
    --member-width: min(1200px, calc(100vw - 48px));
    --member-left: calc(var(--member-width) * 718 / 1200);
    --member-right: calc(var(--member-width) - var(--member-left) - 27px);
    display: grid;
    grid-template-columns: var(--member-left) var(--member-right);
    grid-template-rows: 32px 361px 335px;
    column-gap: 27px;
    row-gap: 25px;
    justify-content: center;
    align-content: start;
    min-height: max(1004px, calc(100vh - 76px));
    padding: 49px 0 160px;
    isolation: isolate;
    background: #070707 url("/static/images/desktop-member-20261021/light-columns.svg") center -76px / 1200px 2598.4px no-repeat;
  }
  body[data-recharge-tab="member"] .mobile-recharge-shell::before,
  body[data-recharge-tab="member"] .mobile-recharge-shell::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
  body[data-recharge-tab="member"] .mobile-recharge-shell::before {
    top: -75px; left: calc(50% - 960px); width: 1920px; height: 1081px;
    background: url("/static/images/desktop-member-20261021/planet.png") center / cover no-repeat;
    opacity: .1; mix-blend-mode: hard-light; mask-image: url("/static/images/desktop-member-20261021/planet-mask.svg"); mask-size: 1920px 1080px;
  }
  body[data-recharge-tab="member"] .mobile-recharge-shell::after {
    top: -246px; left: calc(50% - 1343px); width: 3021.07px; height: 2227px;
    background: url("/static/images/desktop-member-20261021/glow.svg") no-repeat;
    mask-image: linear-gradient(#000 15%, transparent 57%);
  }
  body[data-recharge-tab="member"] .desktop-recharge-heading {
    position: relative; top: auto; left: auto; grid-column: 1 / -1; width: 100%; padding: 0 48px; transform: none;
  }
  body[data-recharge-tab="member"] .mobile-recharge-records { top: 55px; right: calc((100% - var(--member-width)) / 2 + 48px); }
  body[data-recharge-tab="member"] .mobile-recharge-shell .mobile-recharge-hero {
    position: relative; top: auto; left: auto; grid-column: 1; grid-row: 2; width: 100%; height: 361px;
    margin-top: 14px; overflow: hidden; border-radius: 20px; transform: none;
  }
  body[data-recharge-tab="member"] .mobile-recharge-shell .desktop-recharge-member-art,
  body[data-recharge-tab="member"] .mobile-recharge-shell:not(.has-active-member) .desktop-recharge-member-art {
    top: 0; left: 0; width: 100%; height: 100%; transform: none;
    background: url("/static/images/desktop-member-20261021/hero-guest.png") center / cover no-repeat;
    filter: blur(3px);
  }
  body[data-recharge-tab="member"] .desktop-recharge-member-art::before,
  body[data-recharge-tab="member"] .desktop-recharge-member-art::after,
  body[data-recharge-tab="member"] .desktop-recharge-member-art__gem { display: none; }
  body[data-recharge-tab="member"] .mobile-recharge-hero::after {
    content: ""; position: absolute; z-index: 2; inset: 0; display: block;
    background: url("/static/images/desktop-member-20261021/hero-shade.svg") center / cover no-repeat; pointer-events: none;
  }
  body[data-recharge-tab="member"] .mobile-recharge-shell.has-active-member .desktop-recharge-member-art {
    filter: none;
    background-image: url("/static/images/desktop-member-20261021/hero-member-overlay.png"), url("/static/images/desktop-member-20261021/hero-member.png"), url("/static/images/desktop-member-20261021/hero-member-base.svg");
    background-size: cover, 100.05% 110.8%, cover;
  }
  body[data-recharge-tab="member"] .has-active-member .mobile-recharge-hero::after { display: none; }
  body[data-recharge-tab="member"] .mobile-recharge-hero__headline { top: 187px; left: 0; width: 100%; gap: 6px; line-height: 44px; text-shadow: 0 4px 2px #000, 0 -4px 2px #000, 0 4px 10px #000, 0 -4px 10px #000; }
  body[data-recharge-tab="member"] .mobile-recharge-subline-copy--desktop { background: linear-gradient(146.32deg, #fcc100 14.159%, #fff7ee 44.435%, #8651f8 85.37%); background-clip: text; -webkit-background-clip: text; text-shadow: none; filter: drop-shadow(0 4px 2px #000) drop-shadow(0 -4px 2px #000); }
  body[data-recharge-tab="member"] .mobile-recharge-subline-copy--desktop i:nth-child(n) { color: transparent; }
  body[data-recharge-tab="member"] .mobile-recharge-member-card { top: 186.5px; width: max-content; max-width: calc(100% - 40px); height: 84px; padding: 12px; gap: 12px; }
  body[data-recharge-tab="member"] .mobile-recharge-member-card > img { width: 60px; height: 60px; border-width: 2.5px; }
  body[data-recharge-tab="member"] .mobile-recharge-member-card > span { grid-template-columns: minmax(0, 1fr) max-content; gap: 4px 8px; }
  body[data-recharge-tab="member"] .mobile-recharge-member-card strong { overflow: hidden; text-overflow: ellipsis; font-size: 24px; line-height: 32px; font-weight: 500; }
  body[data-recharge-tab="member"] .mobile-recharge-member-card small { color: rgba(255,255,255,.55); font-size: 16px; line-height: 22px; white-space: nowrap; }
  body[data-recharge-tab="member"] .mobile-recharge-member-card em { min-width: 0; justify-self: start; padding: 1px 6px; font-size: 10px; line-height: 16px; color: #694923; }
  body[data-recharge-tab="member"] .mobile-recharge-shell .mobile-recharge-content { display: contents; }
  body[data-recharge-tab="member"] .mobile-recharge-shell .mobile-recharge-member-plans {
    position: relative; top: auto; right: auto; left: auto; grid-column: 1; grid-row: 3; display: flex;
    width: 100%; height: 335px; margin: 14px 0 0; padding: 64px 42px 56px; gap: 14px;
    align-items: flex-start; justify-content: flex-start; transform: none; overflow-x: hidden; overflow-y: hidden;
    border: 1px solid transparent; border-radius: 20px;
    background: linear-gradient(#23161c, #14010a 25.156%) padding-box, linear-gradient(#fff, transparent 45%) border-box;
    scrollbar-width: none; -ms-overflow-style: none; user-select: none; cursor: grab;
  }
  body[data-recharge-tab="member"] .mobile-recharge-member-plans::-webkit-scrollbar { display: none; width: 0; height: 0; }
  body[data-recharge-tab="member"] .mobile-recharge-member-plans.is-dragging,
  body[data-recharge-tab="member"] .mobile-recharge-member-plans.is-dragging .mobile-recharge-member-plan { cursor: grabbing; }
  body[data-recharge-tab="member"] .mobile-recharge-member-plan {
    width: calc((var(--member-left) - 114px) / 3); min-width: 0; height: 202px; flex: 0 0 calc((var(--member-left) - 114px) / 3);
    padding: 16px 6px 12px; border: 3px solid transparent; border-radius: 17.318px; outline: 0;
    background: linear-gradient(#090607, #552e3e) border-box;
  }
  body[data-recharge-tab="member"] .mobile-recharge-member-plan.is-active { background: linear-gradient(#090607, #552e3e) padding-box, linear-gradient(135deg, #ffd301, #fff 48%, #ff78c6) border-box; }
  /* Figma 49073:488330：原始字形自带透明渐变，贴底展示，不叠加透明度或旧版文字变形。 */
  body[data-recharge-tab="member"] .mobile-recharge-member-plan::before {
    content: ""; top: auto; right: auto; bottom: -3px; left: -3px;
    width: calc(100% + 6px); height: 63px;
    background: url("/static/images/desktop-member-20261021/plan-vip.svg") center bottom / 203px 63px no-repeat;
    background-clip: border-box; -webkit-background-clip: border-box;
    clip-path: inset(0 round 0 0 17.318px 17.318px);
    transform: none; opacity: 1;
  }
  body[data-recharge-tab="member"] .mobile-recharge-plan-title { height: 27px; gap: 3px; }
  body[data-recharge-tab="member"] .mobile-recharge-plan-title strong { color: #fcc100; font-size: 22px; line-height: 27px; }
  /* 按粉色标签主体居中，排除上方和右侧的外伸装饰。 */
  body[data-recharge-tab="member"] .mobile-recharge-plan-gift { width: 39.2634px; height: 25.6847px; display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; padding: 4.811px 4.533px 0 0; background: url("/static/images/desktop-member-20261021/plan-gift.svg") no-repeat; border-radius: 0; transform: none; color: #fff; font-size: 14px; line-height: 14px; text-align: center; }
  body[data-recharge-tab="member"] .mobile-recharge-plan-price { height: 48px; margin-top: 3px; }
  body[data-recharge-tab="member"] .mobile-recharge-plan-price b { font-size: 44px; line-height: 48px; background-image: linear-gradient(270deg, #fcb98c, #ff6200); }
  body[data-recharge-tab="member"] .mobile-recharge-plan-price small { font-size: 17px; }
  body[data-recharge-tab="member"] .mobile-recharge-plan-original { height: 20px; font-size: 14px; line-height: 20px; color: rgba(255,255,255,.55); }
  body[data-recharge-tab="member"] .mobile-recharge-plan-bonus { height: 20px; margin-top: 7px; font-size: 14px; line-height: 20px; }
  body[data-recharge-tab="member"] .mobile-recharge-member-plan > em { height: 22px; margin-top: 8px; font-size: 16px; line-height: 22px; }
  body[data-recharge-tab="member"] .mobile-recharge-countdown { top: 180.57px; width: 180px; height: 29px; }
  body[data-recharge-tab="member"] .mobile-recharge-countdown b,
  body[data-recharge-tab="member"] .mobile-recharge-countdown i { height: 29px; padding: 5.773px; border-radius: 4.329px; font-size: 14px; }
  body[data-recharge-tab="member"] .mobile-recharge-countdown b { width: 55px; }
  body[data-recharge-tab="member"] .mobile-recharge-countdown i { min-width: 29px; }
  body[data-recharge-tab="member"] .mobile-recharge-countdown > span { width: 11px; flex: 0 0 11px; }
  body[data-recharge-tab="member"] .mobile-recharge-payment {
    grid-column: 2; grid-row: 2 / 4; height: 724px; margin-top: 14px; padding: 45px;
    border: 1px solid transparent; border-radius: 20px;
    background: linear-gradient(#23161c, #14010a 25.156%) padding-box, linear-gradient(#fff, transparent 45%) border-box;
  }
  body[data-recharge-tab="member"] .mobile-recharge-payment h1 { margin-bottom: 40px; }
  body[data-recharge-tab="member"] .mobile-recharge-payment h1 img { content: url("/static/images/desktop-member-20261021/wallet.svg"); width: 31px; height: 29px; margin: 3.5px 2.5px; }
  body[data-recharge-tab="member"] .mobile-recharge-method.is-active > i { background-image: url("/static/images/desktop-member-20261021/radio.svg"); background-size: 12px 12px; }
  body[data-recharge-tab="member"] .mobile-recharge-payment__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
  body[data-recharge-tab="member"] .mobile-recharge-payment__grid[data-method-count="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body[data-recharge-tab="member"] .mobile-recharge-payment__grid[data-method-count="1"] { grid-template-columns: minmax(0, 1fr); }
  body[data-recharge-tab="member"] .mobile-recharge-method { padding: 12px; background: linear-gradient(rgba(255,255,255,.05), transparent); }
  body[data-recharge-tab="member"] .mobile-recharge-method > span { gap: 12px; }
  body[data-recharge-tab="member"] .mobile-recharge-method b { font-size: 14px; }
  body[data-recharge-tab="member"] .mobile-recharge-notes { position: absolute; top: 437px; right: calc((100% - var(--member-width)) / 2 + 55px); width: calc(var(--member-right) - 110px); margin: 0; color: rgba(255,255,255,.55); }
  body[data-recharge-tab="member"] .mobile-recharge-footer { top: 646px; left: auto; right: calc((100% - var(--member-width)) / 2 + (var(--member-right) - 375px) / 2); transform: none; }
  body[data-recharge-tab="member"] .mobile-recharge-footer button::before { background-image: url("/static/images/desktop-member-20261021/button-left.svg"); }
  body[data-recharge-tab="member"] .mobile-recharge-footer button::after { background-image: url("/static/images/desktop-member-20261021/button-right.svg"); }
  body[data-recharge-tab="member"] .mobile-recharge-footer button > span { color: #fff; }
  body[data-recharge-tab="member"] .mobile-recharge-footer button > strong { color: #14192c; font-size: 16px; }
  body[data-recharge-tab="member"] .mobile-recharge-footer button > em { font-size: 10px; line-height: 16px; color: #000; border-color: #fce4c5; background: linear-gradient(168deg, #ffe580, #facc15); }
  body[data-recharge-tab="member"] .mobile-recharge-footer p a { color: #fd3666; }
}
