/* 邀请好友组件 - 简化样式，方便后期替换背景图 */
[v-cloak] { display: none; }

.invite-container {
    width: 100%;
    padding: 0.3rem;
    background: #f5f5f5;
}

/* 头部 */
.invite-header {
    position: relative;
    margin-bottom: 0.3rem;
}


.rule-btn {
    position: absolute;
    top: 0.2rem;
    right: 0.2rem;
    padding: 0.1rem 0.3rem;
    background: #fff;
    border: none;
    border-radius: 0.3rem;
}

/* 描述 */
.invite-desc {
    text-align: center;
    margin-bottom: 0.3rem;
}

.invite-desc h4 {
    font-size: 0.32rem;
    margin: 0 0 0.1rem 0;
}

.invite-desc p {
    font-size: 0.24rem;
    color: #666;
    margin: 0;
}

/* 进度信息 */
.progress-info {
    text-align: center;
    font-size: 0.28rem;
    margin-bottom: 0.3rem;
    /* padding-top: 1rem; */
}

/* 进度条 */
.progress-section {
    margin-bottom: 0.4rem;
}

.progress-bar {
    width: 6rem;
    height: 0.14rem;
    background: rgba(255,113,5,0.16);
    border-radius: 0.07rem;
    position: relative;
    margin: 0 auto;
}

.progress-track {
    width: 1.28rem;
    height: 0.14rem;
    background: #FF7105;
    border-radius: 0.07rem;
}
.progress-avatar{
    position: absolute;
    top: .2rem;
    left: 0;
    left: 1.28rem;
    transform:translate(-50%, -100%);
}
.invite-avatar {
    width: 0.29rem;
    height: 0.29rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-avator.db589c18.png');
    background-repeat: no-repeat;
}
.invite-mark {
    position: absolute;
    transform: translate(-50%, -100%);
    width: 0.27rem;
    height: 0.30rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-mark.815e2ff4.png');
    background-repeat: no-repeat;
    top: 0;
}
.progress-mark1{
    left: 1.54rem;
}
.progress-mark2{
    left: 3.39rem;
}
.progress-mark3{
    left: 5.37rem;
}
.progress-fill {
    position: absolute;
    top: 0.5rem;
    left: 0;
    height: 0.1rem;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
    border-radius: 0.05rem;
    transition: width 0.5s ease;
}
/*四阶段样式*/
.tie4 .progress-bar {
    width: 6.16rem;
    margin: unset;
    margin-left:.42rem;
}
.tie4 .progress-mark1{
    left: .99rem;
}
.tie4 .progress-mark2{
    left: 2.57rem;
}
.tie4 .progress-mark3{
    left: 4.25rem;
}
.tie4 .progress-mark4{
    left: 5.75rem;
}

.tie4 .invite-tab4{
    background-image: url('static/202510/invite-tab10.8ffa4624.png');
}
.tie4 .invite-tab1{
    left:0.92rem;
}
.tie4 .invite-tab2{
    left:2.50rem;
}
.tie4 .invite-tab3{
    left:4.17rem;
}
.tie4 .invite-tab4{
    left:5.68rem;
}
.tie4 .invite-prize-bg.tab1{
    /*invite-prize-bg41.png*/
    background-image: url('static/202510/invite-prize-bg41.739ba69b.png');
}
.tie4 .invite-prize-bg.tab2{
    /*invite-prize-bg41.png*/
    background-image: url('static/202510/invite-prize-bg42.3dad3541.png');
}
.tie4 .invite-prize-bg.tab3{
    /*invite-prize-bg41.png*/
    background-image: url('static/202510/invite-prize-bg43.25b0a2d9.png');
}
.tie4 .invite-prize-bg.tab4{
    /*invite-prize-bg41.png*/
    background-image: url('static/202510/invite-prize-bg44.c91792ca.png');
}
.node-dot {
    width: 0.4rem;
    height: 0.4rem;
    background: #ddd;
    border-radius: 50%;
    margin: 0 auto 0.1rem;
    transition: background 0.3s;
}

.progress-node.active .node-dot {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.node-label {
    font-size: 0.2rem;
    color: #666;
    white-space: nowrap;
}

/* 档位切换 */
.tier-tabs {
    display: flex;
    justify-content: center;
    gap: 0.3rem;
    margin-bottom: 0.3rem;
}

.tier-tab {
    cursor: pointer;
    transition: transform 0.2s;
}

.tier-tab.active {
    transform: scale(1.1);
}

.tier-gift-icon {
    width: 1rem;
    height: 1rem;
    background: #ddd; /* 占位背景，后期替换为 background-image */
    border-radius: 0.1rem;
    border: 0.03rem solid transparent;
}

.tier-tab.active .tier-gift-icon {
    border-color: #667eea;
}

.tier-tab.unlocked .tier-gift-icon {
    background: #e0e7ff;
}

/* 当前档位提示 */
.current-tier-info {
    text-align: center;
    margin-bottom: 0.2rem;
}

.current-tier-info p {
    font-size: 0.26rem;
    color: #333;
    margin: 0;
}

/* 奖励列表 */
.rewards-list {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    margin-bottom: 0.25rem;
    padding-top: .5rem;

}

.reward-item {
    flex-shrink: 0;
    width: 1.13rem;
    height: 1.35rem;
    background: #fff;
    border-radius: 0.2rem;
    padding: 0.2rem;
    text-align: center;
    position: relative;
}

.reward-item:last-child {
    margin-right:0;
}

.reward-btn {
    width: 0.94rem;
    height: 0.28rem;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: absolute;
    bottom: .1rem;
    left: 50%;
    transform: translateX(-50%);
}
.btn-djs {
    background-image: url('static/202510/invite-btn-djs.1edbc83d.png');
}

.btn-ylq {
    background-image: url('static/202510/invite-btn-ylq.2b7094d7.png');
}

.btn-ljlq-gray {
    background-image: url('static/202510/invite-btn-ljlq-gray.c61de469.png');
}

.btn-ljlq {
    background-image: url('static/202510/invite-btn-ljlq.c6dd5ca1.png');
}

.btn-yqg {
    background-image: url('static/202510/invite-btn-yqg.ed20aa3b.png');
}

/* 待解锁状态 - 灰色 */
.reward-btn.btn-locked {
    background: #ccc;
    color: #666;
    cursor: not-allowed;
}

/* 立即领取状态 - 渐变紫色 */
.reward-btn.btn-available {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
}

.reward-btn.btn-available:active {
    transform: scale(0.95);
}

/* 已领取状态 - 浅灰色边框 */
.reward-btn.btn-claimed {
    background: #f5f5f5;
    color: #999;
    border: 0.02rem solid #ddd;
    cursor: not-allowed;
}

.reward-btn:disabled {
    cursor: not-allowed;
}

/* 操作按钮 */
.action-buttons {
    display: flex;
    margin: 0 auto;
    margin-bottom: 0.2rem;
}
.invite-friend-btn {
    width: 3.05rem;
    height: 0.67rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-friend-btn.510d7fd7.png');
    background-repeat: no-repeat;
}

.invite-record-btn {
    width: 2.03rem;
    height: 0.65rem;
    background-size: 100% 100%;
    margin-right: .76rem;
    margin-left: .29rem;
    background-image: url('static/202510/invite-record-btn.827fdf7c.png');
    background-repeat: no-repeat;
}

/* 提示 */
.notice {
    text-align: center;
    font-size: 0.2rem;
    color: #999;
}

/* 通用弹窗容器样式 */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    padding: 0.4rem;
}
.modal-overlay.total-rule{
    z-index: 1010;
}
.modal-overlay.unlock,.modal-overlay.status,.modal-overlay.support{
    z-index: 2001;
}
.modal-container {
    background: white;
    border-radius: 0.24rem;
    box-shadow: 0 0.08rem 0.32rem rgba(0, 0, 0, 0.2);
    max-width: 6rem;
    width: 100%;
    position: relative;
    overflow: hidden;
}

/*邀请弹窗样式*/
.invite-modal {
    width: 6.15rem;
    height: 8.45rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-friend-inner.3f1aa71d.png');
    background-repeat: no-repeat;
    position: relative;
}
.invite-modal.outer{
    background-image: url('static/202510/invite-friend-outer.64e4926c.png');
}
.invite-modal .invite-btn{
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    width: 2.7rem;
    height: 0.8rem;
    border-radius: 0.4rem;
    position: absolute;
    bottom: 0.6rem;
    left: 0.3rem;
}
.invite-modal .invite-copy-btn{
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    width: 2.7rem;
    height: 0.8rem;
    border-radius: 0.4rem;
    position: absolute;
    bottom: 0.6rem;
    right: 0.3rem;
}
.invite-modal .invite-go-btn{
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    width: 3.8rem;
    height: 0.8rem;
    border-radius: 0.4rem;
    position: absolute;
    bottom: 0.8rem;
    left: 50%;
    transform: translateX(-50%);
}

/*邀请记录弹窗样式*/
.invite-record-modal {
    width: 6.1rem;
    background: linear-gradient(0deg, #F6EBD8 0%, #FFFFFF 100%);
    border-radius: 0.3rem;
    position: relative;
    padding: 0.9rem 0.25rem 0;

}
.invite-record-title {
    width: 2.87rem;
    height: 0.64rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-record-title.5583f3c6.png');
    background-repeat: no-repeat;
    position: absolute;
    top: -0.14rem;
    left: 50%;
    transform: translateX(-50%);
}
.invite-record-pop-btn{
    width: 3.22rem;
    height: 0.68rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-record-pop-btn.eb4d9d5f.png');
    background-repeat: no-repeat;
    margin: 0 auto;
    margin-bottom: .37rem;
}
.invite-colCC{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.invite-record-empty-wrap{
    margin-bottom: .37rem;

}
.invite-record-empty {
    width: 2.11rem;
    height: 1.24rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-record-empty.3ae3a789.png');
    background-repeat: no-repeat;
}
.invite-record-empty-txt {
    width: 1.91rem;
    height: 0.57rem;
    font-family: FZLanTingHei-R-GBK;
    font-weight: 400;
    font-size: 0.24rem;
    color: #666666;
    line-height: 0.34rem;
    white-space: nowrap;
}

.invite-record-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 0.2rem;
}
.invite-record-table th{
    font-family: FZLanTingHei-DB-GBK;
    font-weight: 400;
    font-size: 0.26rem;
    color: #333333;
    line-height: 0.27rem;
}
.invite-record-table td {
    font-family: FZLanTingHei-R-GBK;
    font-weight: 400;
    font-size: 0.2rem;
    color: #333333;
    line-height: 0.27rem;
    border-bottom: 2px solid #eee;
    padding: 0.18rem 0.1rem;
    white-space: nowrap;
  text-align: center;
}

.invite-record-table td.detail{
    font-family: FZLanTingHei-R-GBK;
    font-weight: 400;
    font-size: 0.2rem;
    color: #FF8738;
    line-height: 0.27rem;
    text-align: center;
}
.invite-record-table th {
    font-weight: bold;
    background: #fafafa;
}
.invite-detail-mask{
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    z-index: 1000;
}
.invite-record-close {
    margin-top: .3rem;
    width: 0.51rem;
    height: 0.51rem;
    /*background: url('../images/xhs/rule_close.png') no-repeat center center;*/
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
}


/* 邀请组件活动规则弹窗样式 */
.invite-rule-popup {
  width: 6.01rem;
  height: 9.43rem;
  background: url('https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202505/gztc.png') no-repeat;
  background-size: 100% 100%;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
}
.invite-rule-popup .invite-rule-close-btn {
  width: 0.66rem;
  height: 0.66rem;
  background: transparent;
  position: absolute;
  bottom: 0;
  left: 2.72rem;
  cursor: pointer;
}
.invite-rule-popup .invite-rule-confirm-btn {
  width: 3.12rem;
  height: 0.7rem;
  position: absolute;
  top: 7.54rem;
  left: 1.46rem;
  cursor: pointer;
}
.invite-rule-popup .invite-rule-txt-content {
  width: 100%;
  height: 6.8rem;
  position: absolute;
  top: 0.38rem;
  left: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.invite-rule-popup .invite-rule-txt-img {
    width: 5.79rem;
    height: 36.72rem;
    background-image: url('../../images/gztc1.ec6cc10b.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.invite-rule-popup .invite-rule-txt-img.normal{
    background-image: url('../../images/xdrNormal/202505/rule_bg.d9b034a8.png');
}

/* 邀请组件规则确认弹窗样式 */
.invite-rule-confirm-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5.84rem;
  height: 5.32rem;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  z-index: 301;
  background: url("https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202501/tc_20.png") no-repeat;
  -webkit-background-size: 5.84rem 5.32rem;
  background-size: 5.84rem 5.32rem;
}
.invite-rule-confirm-popup .invite-rule-confirm-close {
  width: 2.12rem;
  height: .7rem;
  position: absolute;
  top: 3.06rem;
  left: .44rem;
  z-index: 301;
  cursor: pointer;
}
.invite-rule-confirm-popup .invite-rule-confirm-close-icon {
  width: 0.56rem;
  height: 0.56rem;
  position: absolute;
  top: 4.74rem;
  left: 2.64rem;
  z-index: 301;
  cursor: pointer;
}
.invite-rule-confirm-popup .invite-rule-confirm-btn1 {
  width: 2.42rem;
  height: .7rem;
  position: absolute;
  top: 3.06rem;
  left: 3.02rem;
  z-index: 301;
  cursor: pointer;
}
.invite-rule-confirm-popup .invite-rule-confirm-btn2 {
  width: 1.8rem;
  height: .76rem;
  position: absolute;
  top: 2rem;
  left: 1.26rem;
  z-index: 301;
  cursor: pointer;
}

/* 邀请组件助力弹窗样式 */
.invite-support-popup {
    width: 6.01rem;
    height: 9.76rem;
    transform: translateY(-0.8rem);
    background-size: 100% 100%;
    background-image: url('static/202510/invite-support-xdr.b02dcd17.png');
    background-repeat: no-repeat;
    position: relative;
}
.invite-support-popup.normal {
    width: 6.02rem;
    height: 7.82rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-support-normal.edc4c8a9.png');
    background-repeat: no-repeat;
}
.invite-support-popup .invite-support-close-icon {
    margin-top: 0.3rem;
    width: 0.6rem;
    height: 0.6rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
    position: absolute;
    bottom: -1rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 302;
}
.invite-support-popup .invite-support-btn {
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    width: 3.9rem;
    height: 0.9rem;
    border-radius: 0.4rem;
    position: absolute;
    bottom: 0.3rem;
    left: 50%;
    transform: translateX(-50%);
}


/* 邀请组件解锁弹窗样式 */
.invite-unlock-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6.4rem;
  height: 7.2rem;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  z-index: 301;
  background: #fff;
  border-radius: 0.24rem;
  box-shadow: 0 0.08rem 0.32rem rgba(0, 0, 0, 0.2);
}
/* 根据type切换不同背景图 */
.invite-unlock-popup.type-101 {
  background: url("https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202501/unlock_101.png") no-repeat;
  background-size: 100% 100%;
}
.invite-unlock-popup.type-102 {
  background: url("https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202501/unlock_102.png") no-repeat;
  background-size: 100% 100%;
}
.invite-unlock-popup.type-103 {
  background: url("https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202501/unlock_103.png") no-repeat;
  background-size: 100% 100%;
}
.invite-unlock-popup.type-104 {
    background: url("https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202501/unlock_103.png") no-repeat;
    background-size: 100% 100%;
}
.invite-unlock-popup .invite-unlock-close {
    margin-top: 0.3rem;
    width: 0.6rem;
    height: 0.6rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
    position: absolute;
    bottom: -1rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 302;
}
.invite-unlock-popup .invite-unlock-close-icon {
    width: 0.51rem;
    height: 0.51rem;
    position: absolute;
    top: 0.2rem;
    right: 0.2rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
    z-index: 302;
}
.invite-unlock-popup .invite-unlock-btn {
    width: 4.8rem;
    height: 0.88rem;
    position: absolute;
    bottom: 1.2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 302;
    cursor: pointer;
    background: transparent;
}

/* 图片样式类 */
.invite-bg {
    padding-top: 1.2rem;
    width: 7.50rem;
    height: 8.83rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-bg.35ed2a84.png');
    background-repeat: no-repeat;
}
.invite-bg.normal{
    padding-top: 0.6rem;
    width: 7.22rem;
    height: 10.67rem;
    margin: 0 auto;
    margin-bottom: .5rem;
    background-image: url('static/202510/invite-bg-normal.6c458871.png');

}
.invite-xhs{
    margin: 0 auto;
    margin-top: .17rem;
    width: 6.86rem;
    height: 2.26rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-xhs.4d8c0b39.png');
    background-repeat: no-repeat;
}
.invite-wechat{
    position: relative;
    width: 7.5rem;
    height: 3.07rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-wechat-xdr.28d391b4.png');
    background-repeat: no-repeat;
}
.invite-wechat.normal{
    width: 7.22rem;
    height: 3.08rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-wechat-normal.9a513740.png');
    background-repeat: no-repeat;
    margin: 0 auto;
    margin-bottom: .5rem;
}
.invite-wechat .invite-wechat-base{
    bottom: 0.2rem;
}
.normal .invite-wechat .invite-wechat-base{
    bottom: 0.4rem;
}

.invite-wechat .invite-wechat-left{
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    width: 3.3rem;
    height: 1.8rem;
    border-radius: 0.4rem;
    position: absolute;
    left: 0.4rem;
}
.invite-wechat .invite-wechat-right{
    /*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
    width: 3.3rem;
    height: 1.8rem;
    border-radius: 0.4rem;
    position: absolute;
    right: 0.4rem;
}


.invite-group {
    width: 6.86rem;
    height: 2.25rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-group.448073a0.png');
    background-repeat: no-repeat;
    margin: 0 auto;
}
.invite-prize-bg{
    margin: 0 auto;
    width: 6.29rem;
    height: 1.97rem;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
}
.invite-prize-bg .prize-tips{
    font-family: HarmonyOS Sans SC;
    font-weight: 500;
    font-size: 0.19rem;
    color: #E3461E;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 0.16rem;
}
.invite-prize-bg.tab1 {
    background-image: url('static/202510/invite-prize-bg1.178a8cbe.png');

}

.invite-prize-bg.tab2 {
    background-image: url('static/202510/invite-prize-bg2.0070ae9f.png');
}

.invite-prize-bg.tab3 {
    background-image: url('static/202510/invite-prize-bg3.fe06b204.png');
}
.invite-qy-dy{
    width: 3.62rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-dy.26035549.png');
    background-repeat: no-repeat;
}

.invite-qy-aqy {
    width: 1.13rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-aqy.48c03ee0.png');
    background-repeat: no-repeat;
}

.invite-qy-qqyy {
    width: 1.14rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-qqyy.ca6d3d9f.png');
    background-repeat: no-repeat;
}

.invite-qy-rxkf29 {
    width: 1.14rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-rxkf29.2f07bd47.png');
    background-repeat: no-repeat;
}

.invite-qy-txsp {
    width: 1.15rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-txsp.6954df3a.png');
    background-repeat: no-repeat;
}

.invite-qy-hf8d88{
    width: 1.14rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-hf8.88.139e408b.png');
    background-repeat: no-repeat;
}

.invite-qy-virtual {
    width: 1.14rem;
    height: 1.35rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-qy-virtual.65b2b836.png');
    background-repeat: no-repeat;
}


.invite-bubble {
    width: 0.82rem;
    height: 0.23rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-bubble.d971356f.png');
    background-repeat: no-repeat;
    position: absolute;
    transform:translate(-36.4%,50%);
    top: -.48rem;
    left: 0;
    font-family: HarmonyOS Sans SC;
    font-weight: 400;
    font-size: 0.15rem;
    color: #FFFFFF;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    z-index: 2;

}
.invite-bubble .invite-bubble-txt{
    transform: translateY(-6.5%);
    white-space: nowrap;
}

.invite-tab{
    width: 1.20rem;
    height: 0.29rem;
    background-size: 100% 100%;
    transform:translate(-50%,50%);
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
}
.invite-tab1 {
    background-image: url('static/202510/invite-tab1.dca91291.png');
    left: 1.48rem;
}

.invite-tab2 {
    background-image: url('static/202510/invite-tab2.6287465c.png');
    left: 3.42rem;
}

.invite-tab3 {
    background-image: url('static/202510/invite-tab3.ef836d9b.png');
    left: 5.29rem;
}

.invite-wrap {
    width: 6.86rem;
    height: 4.96rem;
    position: relative;
    background-size: 100% 100%;
    margin: 0 auto;
    background-image: url('static/202510/invite-wrap.68607c1a.png');
    background-repeat: no-repeat;
    padding-top: 1.25rem;
    margin-bottom: .17rem;
}

.invite-watch-rule{
    position: absolute;
    top: .15rem;
    right: .1rem;
    width: 0.87rem;
    height: 0.24rem;
    font-family: FZLanTingHeiS-R-GB;
    font-weight: 400;
    font-size: 0.22rem;
    color: #FF4E12;
    white-space: nowrap;
}
.invite-watch-rule::after{
    /*underline*/
    content: '';
    display: block;
    width: 100%;
    height: 0.02rem;
    background: #FF4E12;
    transform: translateY(-121.7%);
}
.preload-backgrounds {
    position: absolute;
    left: -9999px;
    top: -9999px;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

/* 邀请组件助力成功弹窗样式 */
.invite-support-status-modal {
    width: 5.84rem;
    height: 4.80rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-support-success.081e1875.png');
    background-repeat: no-repeat;
    padding-top: 2.1rem;
}
.invite-support-status-txt{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: FZLanTingHei-R-GBK;
    font-weight: 400;
    font-size: 0.28rem;
    color: #666666;
    line-height: 0.42rem;
    margin-bottom: 2.03em;
}
.invite-support-status-txt.success{
    color: #CE8023;
    line-height: 0.48rem;
    margin-bottom: 2.93em;
}
.invite-support-status-modal.failed {
    width: 5.84rem;
    height: 4.80rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-support-failed.80aab181.png');
    background-repeat: no-repeat;
}
.invite-support-status-buttons {
    display: flex;
    justify-content: center;
}
.invite-support-status-left {
    width: 2.10rem;
    height: 0.68rem;
    margin-right: .48rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success-left.fc555162.png');
    background-repeat: no-repeat;
}
.invite-support-status-right {
    width: 2.40rem;
    height: 0.68rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success-right.27bdb2e1.png');
    background-repeat: no-repeat;
    position: relative;
}
.invite-success-right-prefix {
    position: absolute;
    width: 1.18rem;
    height: 0.32rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success-right-prefix.91d265bc.png');
    background-repeat: no-repeat;
    top: -.3rem;
    right: 0rem;
}
.invite-support-status-content {
}
.invite-support-status-close {
    margin-top: 0.3rem;
    width: 0.51rem;
    height: 0.51rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
}

/* 邀请组件解锁成功弹窗样式 */
.invite-support-unlock-modal {
    padding: 0.4rem 0.3rem 0.3rem 0.3rem;
    border-radius: 0.24rem;
    min-width: 5rem;
    position: relative;
}
.invite-support-unlock-btn {
    width: 3.2rem;
    height: 0.7rem;
    border-radius: 0.4rem;
    position: absolute;
    bottom: 0.8rem;
    left: 50%;
    transform: translateX(-50%);
}
.invite-support-unlock-modal0,.invite-support-unlock-modal101 {
    width: 5.84rem;
    height: 5.5rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success1.449576d2.png');
    background-repeat: no-repeat;
    position: relative;
}
.invite-support-unlock-modal102 {
    position: relative;
    width: 5.84rem;
    height: 5.50rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success2.449576d2.png');
    background-repeat: no-repeat;
}
.invite-support-unlock-modal103 {
    position: relative;
    width: 5.84rem;
    height: 6.45rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success3.449576d2.png');
    background-repeat: no-repeat;
}
.invite-support-unlock-modal104 {
    position: relative;
    width: 5.84rem;
    height: 6.45rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-success4.affb4c5e.png');
    background-repeat: no-repeat;
}
.invite-support-unlock-close {
    margin-top: 0.3rem;
    width: 0.51rem;
    height: 0.51rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
}

/* 邀请组件虚拟奖品弹窗样式 */
.invite-virtual-prize-modal {
    position: relative;

}
.invite-virtual-prize-btn {
    width: 3.2rem;
    height: 0.8rem;
    border-radius: 0.4rem;
     position: absolute;
    bottom: .4rem;
    left: 50%;
    transform: translateX(-50%);
}
.invite-virtual-prize-close {
    margin-top: 0.3rem;
    width: 0.51rem;
    height: 0.51rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
}
.invite-virtual-bg {
    width: 5.84rem;
    height: 4.63rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-virtual-bg.27799e27.png');
    background-repeat: no-repeat;
}

/*邀请组件二次确认弹窗样式*/
.invite-sec-confirm-bg {
    width: 5.84rem;
    height: 4.51rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-sec-confirm-bg.f8c04ba9.png');
    background-repeat: no-repeat;
   padding-top: .62rem;
}
.invite-sec-confirm-bg.virtual{
    padding-top: .92rem;
}
.invite-confirm-content{
    font-family: FZLanTingHei-DB-GBK;
    font-weight: 400;
    font-size: 0.32rem;
    color: #CE8023;
    line-height: 0.48rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: .36rem;
}
.invite-confirm-actions{
    display: flex;
    justify-content: center;
    align-items: center;
}
.invite-confirm-actions .invite-confirm-btn{

}
.invite-sec-confirm-btn {
    width: 3.22rem;
    height: 0.68rem;
    background-size: 100% 100%;
    background-image: url('static/202510/invite-sec-confirm-btn.f4cd6e81.png');
    background-repeat: no-repeat;
    margin-bottom: .29rem;
}

/*邀请组件-活动规则弹窗样式*/
.invite-rule-modal{
    padding: 0.4rem 0.3rem 0.3rem 0.3rem;
    border-radius: 0.24rem;
    background: #fff;
    min-width: 5rem;
    max-width: 90vw;
    position: relative;
    text-align: center;
}
 .invite-rule-close-btn {
    margin-top: 0.3rem;
    width: 0.51rem;
    height: 0.51rem;
    background: url('static/rule_close.bef791b4.png') no-repeat center center;
    background-size: 100% 100%;
    cursor: pointer;
}

/* 邀请组件-邀请规则弹窗样式 */
.invite-rule-modal-popup {
  width: 6.01rem;
  height: 9.43rem;
  background: url('https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202505/gztc.png') no-repeat;
  background-size: 100% 100%;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 9999;
}

.invite-rule-modal-popup .invite-rule-modal-close-btn {
  width: 0.66rem;
  height: 0.66rem;
  background: transparent;
  position: absolute;
  bottom: 0;
  left: 2.72rem;
  cursor: pointer;
}

.invite-rule-modal-popup .invite-rule-modal-confirm-btn {
  width: 3.12rem;
  height: 0.7rem;
  position: absolute;
  top: 7.54rem;
  left: 1.46rem;
  cursor: pointer;
}

.invite-rule-modal-popup .invite-rule-modal-txt-content {
  width: 100%;
  height: 6.8rem;
  position: absolute;
  top: 0.38rem;
  left: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.invite-rule-modal-popup .invite-rule-modal-txt-img {
  width: 5.79rem;
  height: 36.72rem;
  background-image: url('static/202510/invite-rule202511.b20d993c.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

.modal-overlay.rule-tips{
    z-index: 1001;
}
/* 邀请组件规则提示弹窗样式 */
.invite-rule-tips-popup {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 5.84rem;
    height: 5.32rem;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    z-index: 301;
    background: url("https://qqt-res.cmicrwx.cn/2016tyjf/xhmqqthy/res/wap/images202501/tc_20.png") no-repeat;
    -webkit-background-size: 5.84rem 5.32rem;
    background-size: 5.84rem 5.32rem;
}

.invite-rule-tips-popup .invite-rule-tips-close {
    width: 2.12rem;
    height: 0.7rem;
    position: absolute;
    top: 3.06rem;
    left: 0.44rem;
    z-index: 301;
    cursor: pointer;
}

.invite-rule-tips-popup .invite-rule-tips-close-icon {
    width: 0.56rem;
    height: 0.56rem;
    position: absolute;
    top: 4.74rem;
    left: 2.64rem;
    z-index: 301;
    cursor: pointer;
}

.invite-rule-tips-popup .invite-rule-tips-btn1 {
    width: 2.42rem;
    height: 0.7rem;
    position: absolute;
    top: 3.06rem;
    left: 3.02rem;
    z-index: 301;
    cursor: pointer;
}

.invite-rule-tips-popup .invite-rule-tips-btn2 {
    width: 1.8rem;
    height: 0.76rem;
    position: absolute;
    top: 2rem;
    left: 1.26rem;
    z-index: 301;
    cursor: pointer;
}