/* ====== ͨÓà Reset ====== */
*{margin:0;padding:0;box-sizing:border-box;}
/* ====== »ù´¡Ñùʽ ====== */
body{color:#141414;font-weight:normal;font-family:"PingFang SC","BlinkMacSystemFont","Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;font-size:12px;}
html,body{overflow-y:auto;/* ÏÔʽ¿ªÆô¹ö¶¯ */
 }
.top-bg{background:#F4F4F4 url(/content/images/plan/jb-topbg.png) no-repeat top center;background-size:100% auto;min-height:110vh;padding:0px 0px 16px 0px;}
.scroll-bg{background:#F4F4F4;min-height:110dvh;padding:0 0 calc(82px + env(safe-area-inset-bottom)) 0;/* ¹Ø¼ü£ºÔ¤Áôfixed¸ß¶È+µ×²¿°²È«Çø */
 box-sizing:border-box;/* È·±£padding¼ÆÈë¸ß¶È£¬²»¶îÍâ³Å¿ª */
 -webkit-overflow-scrolling:touch;/* iOSµ¯ÐÔ¹ö¶¯¶µµ× */
 overflow:visible;}
.top-detail{display:flex;padding:12px;flex-direction:column;}
.logo-part{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.plan-logo{width:100px;height:30px;}
.rule{border-radius:100px;border:0.5px solid #FFF;background:rgba(255,255,255,0.90);padding:2px 18px;color:#F44336;border:none;}
.text-part{color:#FFF;font-size:12px;font-style:normal;font-weight:400;line-height:18px;margin-bottom:16px;}
.explain{border-radius:6px;opacity:0.95;background:var(--bg-primary,#FFF);display:flex;padding:20px 16px;justify-content:space-around;align-items:center;position:relative;margin-bottom:4px;}
.explain-part{font-size:16px;font-weight:500;line-height:20px;display:flex;flex-direction:column;align-items:center;width:100%;}
.explain-part-top{margin-bottom:5px;}
.explain span{color:var(--design-red,#F44336);text-align:center;font-size:18px;font-weight:600;line-height:22px;margin-right:4px;}
.label-huodong{border-radius:4px 2px;background:var(--design-red,#F44336);position:absolute;font-size:10px;font-style:normal;font-weight:500;line-height:12px;color:#fff;padding:2px 6px;top:8px;right:15px}
.text-2{color:var(--text-secondary,#515151);text-align:center;font-size:12px;font-style:normal;font-weight:400;line-height:14px;}
.introduction{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;overflow:hidden;color:var(--text-primary,#18181B);text-overflow:ellipsis;font-size:14px;font-style:normal;font-weight:400;line-height:18px;}
.introduction2{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;align-self:stretch;overflow:hidden;color:var(--text-primary,#18181B);text-overflow:ellipsis;font-size:14px;font-style:normal;font-weight:400;line-height:18px;margin-top: 10px;}

.text-onsale {
    font-size: 13px;
    display: inline-block;
    position: absolute;
    right: 0px;
    color: #2196F3;
}
.border-1{width:1px;height:22px;border-radius:2px;opacity:0.3;background:#D9D9D9;margin:0 14px;}
.tab-container{width:100%;background-color:#fff;border-radius:10px 10px 0px 0px;}
.tab-list{display:flex;align-items:center;height:38px;/* ÊÊÅäÊÖ»úµã»÷ÇøÓò */
 position:relative;}
.tab-item{flex:0 0 auto;font-size:14px;color:#333;padding:0 16px;height:100%;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;}
/* Ñ¡ÖÐ̬Ñùʽ */
 .tab-item.active{color:#f43f5e;/* ºìÉ«ÎÄ×Ö */
 font-weight:600;}
.tab-item.active::after{content:'';position:absolute;bottom:0;left:12px;right:12px;height:2px;background-color:#f43f5e;/* ºìÉ«Ï»®Ïß */
 border-radius:100px;}
.content{display:flex;padding:10px;background-color:#F4F4F4;flex-direction:column;}
.card1{display:flex;padding:10px;background-color:#fff;border-radius:6px;flex-direction:column;margin-bottom:10px;}
.card1:last-child{margin-bottom:0px;}
.card2{display:flex;padding:10px;background-color:#fff;border-radius:6px;flex-direction:row;margin-bottom:10px;justify-content:space-between;/* ºËÐÄ£ºÏÔʽָ¶¨´¹Ö±¶ÔÆ뷽ʽ£¬±ÜÃâ×ÓÔªËØÀ­Éì */
 align-items:center;box-sizing:border-box;}
.article-content{display:flex;padding:12px 12px 16px 12px;background-color:#fff;border-radius:6px;flex-direction:column;position:relative;margin-bottom:10px;}
.article-content:last-child{margin-bottom:0;}
.user-index{display:flex;margin-bottom:10px;}
.user2{display:flex;align-items:center;}
.follow-btn{/* »ù´¡Ñùʽ */
 padding:4px 6px;border-radius:4px;border:0.5px solid #5F4EAF;font-size:12px;line-height:14px;color:#5F4EAF;box-sizing:border-box;align-self:center;flex-shrink:0;display:flex;align-items:center;justify-content:center;/* ¿ÉÑ¡£º°´Å¥ÎÄ×Öˮƽ¾ÓÖУ¬¸üÃÀ¹Û */
}
.followed-btn{/* »ù´¡Ñùʽ */
 padding:4px 6px;border-radius:4px;border:0.5px solid #ccc;font-size:12px;line-height:14px;color:#8E8E8E;box-sizing:border-box;align-self:center;flex-shrink:0;display:flex;align-items:center;justify-content:center;/* ¿ÉÑ¡£º°´Å¥ÎÄ×Öˮƽ¾ÓÖУ¬¸üÃÀ¹Û */
}
.icon-10{width:10px;height:10px;margin-right:2px;}
.avatar-part{position:relative;margin-right:8px;}
.avatar1{width:30px;height:30px;border-radius:50%;object-fit:cover;}
.avatar3{width:30px;height:30px;border-radius:50%;object-fit:cover;}
.name{font-size:12px;line-height:14px;font-weight:500;margin-bottom:6px;}
.name2{font-size:14px;line-height:18px;font-weight:500;margin-bottom:4px;}
.name-group{display:flex;align-items:center;}
.rate-part{display:flex;text-align:center;align-items:center;}
.rate-part2{display:flex;text-align:center;align-items:center;padding:10px;width:100%;background-color:#ffffff10;border-radius:6px;margin-bottom: 14px;}
.rate-part2 .rate-part-label{width: 100%;}
.rate-part2 .rate-part-label{width: 100%;}

.rate-part-label:last-child{margin-right: 0;}
.rate-part-label{border:solid 1px #F44336;border-radius:4px;margin-right:6px;width:16.5vw;}
.rate-text{font-size:12px;line-height:14px;padding:2px;font-weight:500;background:#FFF5F7;color:#F44336;border-radius:4px 4px 0 0;}
.rate-part2 .rate-text{font-size: 16px;line-height: 20px;padding: 6px;}
.rate-part2 .rate-labe-text{font-size: 12px;padding: 3px;line-height: 14px;}


.rate-labe-text { font-size: 8px; color: #fff; line-height: 10px; background-color: #F44336; padding: 1px; }
.label-part{display:flex;align-items:center;height:16px;}
.label-red{color:#fff;font-size:10px;font-weight:400;line-height:14px;border-radius:20px;background:var(--design-red,#F44336);padding:0px 6px 0px 0px;align-items:center;position:relative;height:14px;display:flex;flex-direction:row;margin-right: 4px;}
.icon-16{width:16px;height:16px;margin-right:2px;}
.border-4{width:100%;height:0;/* ÓÃpadding-topÄ£Äâ0.5px¸ß¶È */
 padding-top:0.5px;background-image:linear-gradient(to right,#e0e0e0 0,#e0e0e0 3px,transparent 3px,transparent 6px);background-size:6px 100%;/* Ñ­»·ÖÜÆÚ£º3+3=6px */
 background-repeat:repeat-x;}


 .border-2{ width: 100%; /* ºËÐÄ£ºÓý¥±ä±³¾°Ä£ÄâÐéÏß */ background: linear-gradient(to right, #d1d1d1 50%, transparent 70%); /* ¿ØÖÆÐéÏßµÄÏ߶γ¤¶ÈºÍ¼ä¾à£¨µÚÒ»¸öÖµ=Ï߶γ¤+¼ä¾à£¬µÚ¶þ¸öÖµ=Ïß¿í£© */ background-size: 8px 0.5px; /* Èý¥±ä±³¾°ÆÌÂúÈÝÆ÷ */ background-repeat: repeat-x; /* »ù´¡²¼¾Ö£ºÈ·±£ÏßÄÜÏÔʾ³öÀ´ */ width: 100%; height: 0.5px; /* ¿ÉÑ¡£ºµ÷ÕûλÖ㬱ÈÈç¾ÓÖÐ */ margin-bottom:10px; /* ½â¾ö²¿·Öä¯ÀÀÆ÷ 0.5px äÖȾÄ£ºýÎÊÌâ */ transform: scaleY(0.5); transform-origin: 0 0;}
.border-3{ width: 100%; /* ºËÐÄ£ºÓý¥±ä±³¾°Ä£ÄâÐéÏß */ background: linear-gradient(to right, #d1d1d1 50%, transparent 70%); /* ¿ØÖÆÐéÏßµÄÏ߶γ¤¶ÈºÍ¼ä¾à£¨µÚÒ»¸öÖµ=Ï߶γ¤+¼ä¾à£¬µÚ¶þ¸öÖµ=Ïß¿í£© */ background-size: 8px 0.5px; /* Èý¥±ä±³¾°ÆÌÂúÈÝÆ÷ */ background-repeat: repeat-x; /* »ù´¡²¼¾Ö£ºÈ·±£ÏßÄÜÏÔʾ³öÀ´ */ width: 100%; height: 0.5px; /* ¿ÉÑ¡£ºµ÷ÕûλÖ㬱ÈÈç¾ÓÖÐ */ margin-bottom:6px; /* ½â¾ö²¿·Öä¯ÀÀÆ÷ 0.5px äÖȾÄ£ºýÎÊÌâ */ transform: scaleY(0.5); transform-origin: 0 0;}
.issue{padding:6px;border-radius:4px;background:linear-gradient(90deg,var(--bg-secondary,#F4F4F4) 0%,rgba(244,244,244,0.00) 100%);display:flex;align-items:center;margin-bottom:6px;position:relative;}
.issue:last-child{margin-bottom:0px;}
.icon-result{width:26px;height:26px;position:absolute;right:0px;}
.icon-result-article { width: 50px; height: 50px; position: absolute; right: 6px; top: 0px; }
.qishu{font-size:12px;font-weight:500;line-height:10px;color:#3E3276;display:flex;align-items:center;margin-right:8px;}
.qishu-icon1{width:3px;/* ¹Ì¶¨¿í¶È */
 height:auto;}
.qishu2{font-size:16px;font-weight:500;line-height:22px;color:#3E3276;display:flex;align-items:center;margin-right:6px;position:absolute;}
.qishu-icon2{width:5px;/* ¹Ì¶¨¿í¶È */
 height:auto;}
.title{font-size:16px;font-weight:500;display:flex;margin-bottom: 10px;position: relative;}
.title-text{display:flex;width:100%;line-height:22px;text-indent:48px;margin-bottom:8px;}
.num-label{width:14px;height:14px;border-radius:50%;background-color:#e0e0e0;font-size:10px;font-weight:500;text-align:center;margin-right:6px;line-height:14px;}
.num-update{width:12px;height:12px;border-radius:50%;background-color:#F44336;font-size:8px;font-weight:500;text-align:center;line-height:12px;position:absolute;color:#fff;top:0;right:0;}
.stats{display:flex;align-items:center;margin-right:12px;}
.stats .blue{color:#2196F3;}
.team-vs{font-size: 14px;}
.team-vs span{margin:0 6px;font-size: 12px;color: #8E8E8E;}
.team-vs span.red{color:#F44336;}

.sort{display:flex;flex-direction:row;justify-content:space-between;font-size:10px;line-height:12px;color:#8E8E8E;align-items:center;margin-bottom:14px;}
.left-sort{display:flex;}
.session-label{padding:3px 5px;border:0.5px solid #F44336;color:#F44336;border-radius:2px;margin-right:6px;}
.sort-label{padding:3px 5px;border:0.5px solid #2196F3;color:#2196F3;border-radius:2px;}
.match-bg {
    background-image: url(/content/images/plan/team-bg-h5.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 10px 0px 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    border-radius: 4px;
    margin-bottom: 12px;
}



.team{display:flex;flex-direction:column;align-items:center;width:100%;color: #fff;}
.team img{width:30px;height:30px;margin-bottom:8px;}
.vs-mid{display:flex;font-size:10px;line-height:12px;flex-direction:column;align-items:center;min-width:70px;color: #fff;}
.league-info{display:flex;flex-direction:column;align-items:center;color: #ffffff80;}
.league-info span{margin-top:2px;}
.VS2{font-size:18px;line-height:22px;font-weight:500;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Helvetica Neue",Helvetica,Arial,sans-serif;}
.star-icon{width:20px;height:20px;position:absolute;z-index:1;display:block;right:6.5px;top:3px;}
.star-icon.on{background:url(/content/images/plan/star-on.svg) no-repeat center;background-size:100%;background-color:transparent;}
.star-icon.off{background:url(/content/images/plan/star-off.svg) no-repeat center;background-size:100%;background-color:transparent;}
/* Íâ²ãÈÝÆ÷£ºÇ¿ÖÆÕ¼Âú¿í¶È */
.group-block-wrap{display:flex;flex-direction:column;line-height:14px;width:100%;box-sizing:border-box;}
/* ÿÐÐÈÝÆ÷£ºÇ¿ÖƳÅÂú£¬Ïû³ý¼ä¾àÓ°Ïì */
.group-row{display:flex;margin-bottom:2px;width:100%;box-sizing:border-box;}
/* µ¥Ôª¸ñͨÓÃÑùʽ */
.rate-tag{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px 20px;background-color:#f4f4f4;margin-right:2px;box-sizing:border-box;/* Ç°Á½Ðй̶¨25%£¬µÚÈýÐлᱻ¸²¸Ç */
 flex:25% 0 25%;width:100%;position:relative;}
/* µ¥Ôª¸ñͨÓÃÑùʽ */
 .rate-tag{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:10px 20px;background-color:#f4f4f4;margin-right:2px;box-sizing:border-box;flex:25% 0 25%;width:100%;position:relative;/* ÖØÖÃĬÈÏÔ²½Ç */
 border-radius:0;}
/* ÒƳýÿÐÐ×îºóÒ»¸öµ¥Ôª¸ñµÄÓÒ²à¼ä¾à */
 .group-row .rate-tag:last-child{margin-right:0;}
/* ========== ¶àÐг¡¾°£¨¡Ý2ÐУ© ========== */
 /* µÚÒ»ÐеÚÒ»¸öµ¥Ôª¸ñ£º×óÉÏÔ²½Ç */
 .group-row:first-child .rate-tag:first-child{border-radius:4px 0 0 0;}
/* µÚÒ»ÐÐ×îºóÒ»¸öµ¥Ôª¸ñ£ºÓÒÉÏÔ²½Ç */
 .group-row:first-child .rate-tag:last-child{border-radius:0 4px 0 0;}
/* ×îºóÒ»ÐеÚÒ»¸öµ¥Ôª¸ñ£º×óÏÂÔ²½Ç£¨ÐÞÕýÄãÃèÊöµÄ±ÊÎó£ºÔ­ÃèÊö"×îºóÒ»ÐеÚÒ»¸ö0 4px 0 0"ӦΪ×óÏÂÔ²½Ç 0 0 0 4px£© */
 .group-row:last-child .rate-tag:first-child{border-radius:0 0 0 4px;}
/* ×îºóÒ»ÐÐ×îºóÒ»¸öµ¥Ôª¸ñ£ºÓÒÏÂÔ²½Ç */
 .group-row:last-child .rate-tag:last-child{border-radius:0 0 4px 0;}
/* ========== µ¥Ðг¡¾°£¨½ö1ÐУ© ========== */
 /* Ö»ÓÐÒ»ÐÐʱ£¬µÚÒ»¸öµ¥Ôª¸ñ£º×óÉÏ+×óÏÂÔ²½Ç */
 .group-row:only-child .rate-tag:first-child{border-radius:4px 0px 0px 4px;}
/* Ö»ÓÐÒ»ÐÐʱ£¬×îºóÒ»¸öµ¥Ôª¸ñ£ºÓÒÉÏ+ÓÒÏÂÔ²½Ç */
 .group-row:only-child .rate-tag:last-child{border-radius:0 4px 4px 0;}
.rate-tag.choose{color:#fff;background-color:#F44336;}
/* ×îºóÒ»¸öµ¥Ôª¸ñÈ¡ÏûÓÒ²àmargin */
.group-row > .rate-tag:last-child{margin-right:0 !important;}
/* µÚÈýÐкËÐÄÐÞ¸´£º100%Ìî³ä£¬ÎÞ¿Õ϶ */
.group-row.third,.group-row.fourth{/* Ç¿ÖÆÐÐÈÝÆ÷ÎÞ¶îÍâ¼ä¾à */
 padding:0;margin:0 0 2px 0;}
/* µÚÈýÐеÚÒ»¸öÔªËØ£º½öÕ¼25%¿í¶È£¨²»À­Éì/ÊÕËõ£© */
.group-row.third .rate-tag:first-child{flex:0 0 24.7%;margin-right:2px;/* ±£ÁôºÍµÚ¶þ¸öÔªËصļä¾à */
}
/* µÚÈýÐеڶþ¸öÔªËØ£ºÇ¿ÖƳÅÂúÊ£Óà¿Õ¼ä£¬±£Áô¼ä¾à */
.group-row.third .rate-tag:nth-child(2){flex:1 1 auto;/* ºËÐÄ£ºÀ­ÉìÌî³äÊ£Óà¿í¶È */
 margin-right:2px;/* ±£ÁôºÍµÚÈý¸öÔªËصļä¾à */
 width:0;/* ¹Ø¼ü£ºÖØÖÿí¶È£¬ÈÃflexÍêÈ«ÉúЧ */
}
/* µÚÈýÐеÚÈý¸öÔªËØ£ºÇ¿ÖƳÅÂú×îºóÊ£Óà¿Õ¼ä */
.group-row.third .rate-tag:nth-child(3){flex:1 1 auto;/* ºËÐÄ£ºÀ­ÉìÌî³ä */
 margin-right:0;/* È¡Ïû×îºóÒ»¸ö¼ä¾à */
 width:0;/* ¹Ø¼ü£ºÖØÖÿí¶È */
}
/* µÚËÄÐеÚÒ»¸öÔªËØ£º½öÕ¼25%¿í¶È£¨²»À­Éì/ÊÕËõ£© */
.group-row.fourth .rate-tag:first-child{flex:0 0 24.7%;margin-right:2px;/* ±£ÁôºÍµÚ¶þ¸öÔªËصļä¾à */
}
/* µÚËÄÐеڶþ¸öÔªËØ£ºÇ¿ÖƳÅÂúÊ£Óà¿Õ¼ä£¬±£Áô¼ä¾à */
.group-row.fourth .rate-tag:nth-child(2){flex:1 1 auto;/* ºËÐÄ£ºÀ­ÉìÌî³äÊ£Óà¿í¶È */
 margin-right:2px;/* ±£ÁôºÍµÚÈý¸öÔªËصļä¾à */
 width:0;/* ¹Ø¼ü£ºÖØÖÿí¶È£¬ÈÃflexÍêÈ«ÉúЧ */
}
/* µÚËÄÐеÚÈý¸öÔªËØ£ºÇ¿ÖƳÅÂú×îºóÊ£Óà¿Õ¼ä */
.group-row.fourth .rate-tag:nth-child(3){flex:1 1 auto;/* ºËÐÄ£ºÀ­ÉìÌî³ä */
 margin-right:0;/* È¡Ïû×îºóÒ»¸ö¼ä¾à */
 width:0;/* ¹Ø¼ü£ºÖØÖÿí¶È */
}
.rate-tag span{margin-top:2px;}
/* µÚËÄÐÐÔ²½Ç */
.group-row.fourth .rate-tag:first-child{border-radius:0 0 0 4px;}
.group-row.fourth .rate-tag:last-child{border-radius:0 0 4px 0;}
.article-detail-wrap{position:relative;width:100%;/* Õ¼Âú¸¸¼¶¿í¶È */
 box-sizing:border-box;}
.article-detail{display:flex;flex-direction:column;font-size:14px;line-height:24px;margin-top:20px;position:relative;word-wrap: break-word;}
.article-detail p{
text-indent: 0em !important;
}

.article-detail.blur{filter:blur(11px);-webkit-filter:blur(11px);transform:translateZ(0);}
.article-detail h3{margin-bottom:8px;font-size:16px;font-weight:500;border-bottom: none;}

.unlock-text{position:absolute;/* ´¹Ö±¾ÓÖкËÐÄ£ºtop 50% + ÏòÉÏÆ«ÒÆ×ÔÉí50% */
 top:50%;/* ˮƽ¾ÓÖкËÐÄ£ºleft 50% + Ïò×óÆ«ÒÆ×ÔÉí50% */
 left:50%;transform:translate(-50%,-50%);/* ¾«×¼¾ÓÖУ¨Í¬Ê±´¦Àíˮƽ+´¹Ö±£© */
 z-index:10;/* È·±£ÔÚÄ£ºý²ãÖ®ÉÏ */
 width:90%;/* ÏÞÖÆ¿í¶È£¬±ÜÃâÎÄ×ÖÒç³ö */
 max-width:400px;/* ¿ÉÑ¡£ºÏÞÖÆ×î´ó¿í¶È£¬ÊÊÅä´óÆÁ */
 text-align:center;/* ÎÄ×ÖÄÚ²¿¾ÓÖÐ */
 color:#000;font-size:12px;line-height:20px;padding:12px 16px;border-radius:8px;/* ¶µµ×£ºÎÞÄ£ºý */
 filter:blur(0) !important;-webkit-filter:blur(0) !important;
 display: flex;
 text-align: left;
 justify-content: center;
    gap: 10px;
    align-items: center;
}
.lock-icon2{width: 32px;height: 32px;}

.agreement{padding:4px 4px 12px 4px;border-radius:4px;display:flex;color:#8E8E8E;line-height:14px;}
.icon-14{width:14px;height:14px;margin-right:4px;}
.agreement span a{color:#F2A128;text-decoration:none;}
.bottom-buy{display:flex;position:fixed;bottom:0;width:100%;border-radius:12px 12px 0 0;border:0.5px solid var(--border-primary,#EAEAEA);background-color:#fff;padding:16px 12px 24px 12px;justify-content:center;align-items:center;padding:16px 12px 24px;justify-content:space-between;font-size:14px;line-height:18px;z-index:99;}
.bottom-buy-left{display:flex;}
.number-buy{display:flex;align-items:center;margin-right:6px;}
.number-buy span{font-weight:500;color:#F44336;}
.avatar-small{display:flex;}
.avatar2{width:26px;height:26px;border-radius:50%;border:0.5px solid #fff;/* ÏÈÉè1px»ù´¡Ãè±ß */
 object-fit:cover;margin-left:-4px;}
.avatar2:first-child{margin-left:0;}
.unlock-btn{padding:4px 20px 4px 4px;background-color:#F44336;display:flex;border-radius:100px;color:#fff;align-items:center;min-width:156px;}
.unlock-btn.gray{padding:4px 20px 4px 4px;background-color:#ccc;display:flex;border-radius:100px;color:#fff !important;align-items:center;min-width:156px;}
.unlock-btn.gray2{padding:4px;background-color:#ccc;display:flex;border-radius:100px;color:#fff !important;align-items:center;min-width:156px;height:42px;}
.lock-icon{width:34px;height:34px;margin-right:8px;}
.lock-text{display:flex;flex-direction:column;align-items:center;width:100%;}
.unlock-btn.gray2 .lock-text h4{margin-right:0px;}
.lock-text h4{font-size:16px;font-weight:500;line-height:20px;margin-right:4px;}
.text-qiubi{display:flex;align-items:center;margin-bottom:2px;}
.lock-text span{font-size:10px;line-height:12px;}
.icon-choose{width:14px;height:14px;position:absolute;background:url(/content/images/plan/tick.svg) no-repeat;top:4px;right:4px;}
.icon-choose.red{width:14px;height:14px;position:absolute;background:url(/content/images/plan/tick-red.svg) no-repeat;top:4px;right:4px;}
.label-choose{border-radius:4px 0;background:linear-gradient(90deg,#FFAC47 0%,#FF9000 92.5%);font-size:10px;line-height:12px;color:#fff;font-weight:500;padding:1px 4px;justify-content:center;align-items:center;position:absolute;left:2px;top:-4px;}
.rate2{display:flex;align-items:center;}
.rate2 .name2{margin-bottom:0;margin-right:4px;}
.user-home{    position: relative;
    width: 100%;
    /* min-height: 72.8vw; */
    overflow: hidden;
    background: rgba(6,0,21,0.5),url(/content/images/plan/003.webp) center/cover no-repeat;
    background-blend-mode: normal;
    padding-bottom: 16px;}


.user-home-bg{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url(/content/images/plan/003.webp) center/120% 120% no-repeat;/* 120%·Å´ó */
 filter:blur(40px);/* Ä£ºý³Ì¶È£¨¿Éµ÷Õû£© */
 z-index:-2;/* ·ÅÔÚÃɲãÏ·½ */
}


.user-home::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(6,0,21,0.60);/* 50%͸Ã÷¶ÈµÄ#060015 */
 z-index:-1;/* ·ÅÔÚÄ£ºý±³¾°ÉÏ·½¡¢ÄÚÈÝÏ·½ */
}
/* Ö÷Ò³ÄÚÈÝ£ºÈ·±£ÔÚ×îÉϲã */
.home-content{position:relative;z-index:1;}
.user-avatar{width:54px;height:54px;border-radius:50%;border: 1px solid #fff;margin-right: 10px;}
.user-container{background:#F4F4F4;box-sizing:border-box;/* È·±£padding¼ÆÈë¸ß¶È£¬²»¶îÍâ³Å¿ª */
 -webkit-overflow-scrolling:touch;/* iOSµ¯ÐÔ¹ö¶¯¶µµ× */
 overflow:visible;min-height: 80dvh;}
.icon24{width:24px;height:24px;}
.title-bar{width:100%;display:flex;height:44px;align-items:center;justify-content:space-between;padding:0 12px;}
.user-info{display:flex;align-items:center;padding:8px 20px 12px 20px;justify-content:space-between;}
.user-part{font-size:18px;line-height:22px;color:#fff;font-weight:500;display:flex;align-items:center;}
.follow-btn-red{display: flex;
padding: 8px 14px;
justify-content: center;
align-items: center;
border-radius: 4px;
background: var(--design-red, #F44336);
font-size: 12px;
line-height: 14px;
color: #fff;
}
.icon-12{width: 12px;height: 12px;margin-right: 2px;}

.follow-btn-red.gray{display: flex;
padding: 8px 14px;
justify-content: center;
align-items: center;
border-radius: 4px;
background-color: #ffffff10;
font-size: 12px;
line-height: 14px;
color: #fff;
}

.record-part{
    padding: 0 20px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.introduction-text{
  font-size: 14px;
  line-height: 18px;
  color: #ffffff90;
}

.trend{background-color: #fff;
margin: 8px 0;
padding: 12px 10px 16px;
display: flex;
flex-direction: column;
font-size: 14px;
border-bottom: 0.5px solid #EAEAEA;}

.trend-top{
  display: flex;
  margin-bottom: 12px;
}

.trend-right{margin-left: 12px;}

.trend-right span{color: #F44336;}

.canava{
  height: 80px;
  text-align: center;
}

.order-title{background-color: #fff;
margin: 8px 0 0px;
padding: 9px 10px;
display: flex;
font-size: 14px;
border-bottom: 0.5px solid #EAEAEA;
align-items: center;}



.order-label{
  width: 3px;
height: 10px;
border-radius: 100px;
background-color: #F44336;
margin-right: 6px;

}

.order-list{
  background-color: #fff;
  padding: 12px;
}

 /* ²Ëµ¥ÈÝÆ÷ */

.tabMenu-bg{
  width: 100%;
  background-color: #fff;
  display: flex;
  padding: 11px;
  align-items: center;
  justify-content: center;
}


.tabMenu-group {
    display: flex;
    border: 1px solid #e04a3e; /* ºìÉ«±ß¿ò */
    border-radius: 4px; /* Ô²½Ç */
    overflow: hidden; /* Òþ²ØÄÚ²¿Ô²½ÇÒç³ö */
    width: fit-content; /* ÊÊÓ¦ÄÚÈÝ¿í¶È */
}

/* ²Ëµ¥Ïî */
.tabMenu-item {
    padding: 6px 20px; /* Äڱ߾à */
    font-size: 12px; /* ×ÖÌå´óС */
    color: #e04a3e; /* ºìÉ«×ÖÌå */
    cursor: pointer; /* Êó±êÖ¸Õë */
    background-color: #fff; /* ĬÈÏ°×É«±³¾° */
    transition: all 0.2s ease; /* ¹ý¶ÉЧ¹û */
    user-select: none; /* ½ûÖ¹ÎÄ×ÖÑ¡ÖÐ */
    line-height: 14px;
}

/* Ñ¡ÖÐ״̬Ñùʽ */
.tabMenu-item.active {
    background-color: #e04a3e; /* Ñ¡ÖÐʱºìÉ«±³¾° */
    color: #fff; /* Ñ¡ÖÐʱ°×É«×ÖÌå */
}

/* Êó±êÐü¸¡Ð§¹û£¨·ÇÑ¡ÖÐ״̬£© */
.tabMenu-item:not(.active):hover {
    background-color: #fef0ef; /* dzºì±³¾° */
}
.icon-tick-red {
    position: absolute;
    width: 18px;
    height: 18px;
    background-image: url(/content/images/plan/tick-red.svg);
    background-repeat: no-repeat;
    background-size: cover;
    right: 6px;
    top: 6px;
}

.icon-tick-white {
    position: absolute;
    width: 18px;
    height: 18px;
    background-image: url(/content/images/plan/tick.svg);
    background-repeat: no-repeat;
    background-size: cover;
    right: 6px;
    top: 6px;
}
/**ÒÔÏÂÊǹæÔòµ¯´°**/
.pop_out {
    position: absolute;
    top: 0;
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0px 22px;
    box-sizing: border-box;
    background-color: rgba(0, 0, 0, 0.5);
    text-align: center;
    gap: 18px;
    z-index: 999;
}

.pop {
    position: relative;
    border-radius: 6px;
    background-color: #fff;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0px 16px 30px;
    box-sizing: border-box;
    text-align: center;
    font-size: 14px;
    color: #141414;
    margin-top: -100px;
    gap: 16px;
    max-width: 330px;
}

.pop-close-btn {
    width: 30px;
    height: 30px;
    background-image: url(/content/images/plan/pop_close.svg);
}

.pop-title {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
    width: 100%;
}

    .pop-title.red {
        color: #F44336;
    }

.text-mid {
    display: flex;
    flex-direction: column;
    font-size: 14px;
    line-height: 22px;
    color: #515151;
    width: 100%;
    gap: 4px;
    height: 70px;
}

.slide-bottom {
    display: flex;
    width: 100%;
    justify-content: center;
    gap: 16px;
}

.slide-dot {
    border-radius: 50%;
    width: 8px;
    height: 8px;
    background-color: #d9d9d9;
}

    .slide-dot.choose {
        border-radius: 100px;
        width: 20px;
        height: 8px;
        background-color: #F44336;
    }

/* ¸øpopÌí¼Ó¹ý¶ÉЧ¹û */
.pop {
    transition: all 0.3s ease;
}

/* Ô²µãÇл»¹ý¶É */
.slide-dot {
    transition: all 0.3s ease;
}
/***************************/

.title-h1New{
        font-size: 16px;
    font-weight: 500;
    display: flex;
    line-height: 22px;
    color: #3E3276;
}



.qishuNew {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #3E3276;
    display: flex;
    align-items: center;
    margin-right: 6px;
    position: absolute;
}

.title-textNew {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #3E3276;
    text-indent: -10px;
}

.title-textNew2 span {
    color: #333;
    text-indent: 0;
}

.title2 {
    font-size: 16px;
    font-weight: 500;
    display: flex;
    margin-bottom: 10px;
    padding: 8px 4px;
    border-radius: 4px;
    border: 1px solid #E9E7F3;
    background: #FBFBFF;
}

.title-textNew2 {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #3E3276;
    text-indent: -10px;
    display: flex;
    align-items: center;

    
}


.session-label2 {
    padding: 3px 5px;
    border: 0.5px solid #F44336;
    color: #F44336;
    border-radius: 2px;
    margin-right: 6px;
    font-size: 10px;
    line-height: 12px;
    font-weight: 400;
        text-indent: 0;
}

.pop-img{
    width: 290px;
    height: 200px;
}