/**
 * 小富富网络 - 全站自适应 v9（必须最后加载，覆盖 new.css / xinli.css）
 */
html { font-size: 16px; -webkit-text-size-adjust: 100%; }

body.xff-pay,
body.xff-test,
body.xff-quiz,
body.xff-result,
body.xff-classify {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
}

body.xff-site,
body.xff-body {
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
}

.xff-page-bg, .xff-hero-bg { display: none !important; }

/* ========== 首页壳 ========== */
body.xff-site .xff-site-shell {
    width: 100%;
    margin: 0 auto;
    min-height: 100vh;
    background: #F3F4F8;
}

.xff-main { width: 100%; padding-bottom: 88px; box-sizing: border-box; }

.home_header {
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 10px 14px !important;
    box-sizing: border-box !important;
    z-index: 200 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    height: auto !important;
    min-height: 52px !important;
    background: linear-gradient(135deg, #FF9500, #FF6B00) !important;
    box-shadow: 0 2px 12px rgba(255,149,0,0.25) !important;
}

.home_header .left { flex-shrink: 0; height: auto !important; }
.home_header .left img {
    height: 36px !important;
    width: auto !important;
    max-width: 120px;
    object-fit: contain;
    border-radius: 8px;
    cursor: pointer;
}
.home_header .right {
    flex: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    display: flex !important;
    float: none !important;
}
.home_header .right input {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    border-radius: 20px !important;
    padding: 8px 14px !important;
    background: rgba(255,255,255,0.25) !important;
    color: #fff !important;
    font-size: 14px !important;
}
.home_header .wode,
.home_header .xff-contact-btn {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    background: rgba(255,255,255,0.2);
    border-radius: 20px;
    cursor: pointer;
    text-decoration: none;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}
.home_header .wode img,
.home_header .xff-contact-btn img {
    width: 22px !important;
    height: 22px !important;
    object-fit: contain;
}

.home_banner {
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 12px 0 !important;
    box-sizing: border-box !important;
    height: auto !important;
    aspect-ratio: 16 / 7;
    max-height: 320px;
}
.home_banner .swiper-container,
.home_banner .swiper-slide { width: 100% !important; height: 100% !important; }
.home_banner .swiper-slide img { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; }

.home_nav {
    width: 100% !important;
    padding: 10px 12px !important;
    margin: 0 !important;
}
.home_nav ul {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}
.home_nav li {
    width: auto !important;
    padding: 12px 4px !important;
    text-align: center;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.home_nav li img {
    width: 36px !important;
    height: 36px !important;
    object-fit: contain;
    display: block;
    margin: 0 auto 6px;
}
.home_nav li p { font-size: 12px; color: #333; margin: 0; }

.home_title {
    width: 100% !important;
    padding: 14px 16px 6px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* 推荐/热门列表 - 统一卡片网格 */
.home_recommended_list,
.home_hot_list {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 12px !important;
    margin: 0 0 16px !important;
    overflow: visible !important;
    float: none !important;
}

.home_recommended_list ul,
.home_hot_list ul,
ul#fles {
    display: grid !important;
    gap: 12px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    flex-wrap: unset !important;
    flex-direction: unset !important;
}

.home_recommended_list li,
.home_hot_list li,
.classification_right li {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    float: none !important;
    flex-shrink: unset !important;
    background: #fff !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    padding: 0 !important;
}

.home_recommended_list li .img,
.home_hot_list li .img,
.classification_right li .img {
    width: 100% !important;
    aspect-ratio: 16/10 !important;
    float: none !important;
    height: auto !important;
    position: relative !important;
    flex-shrink: 0;
}
.home_recommended_list li .img img,
.home_hot_list li .img img,
.classification_right li .img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 0 !important;
}

.home_recommended_list li .dianji,
.home_recommended_list li h4,
.home_hot_list li .text,
.classification_right li .text {
    width: 100% !important;
    float: none !important;
    height: auto !important;
    max-height: none !important;
    padding: 10px 12px 12px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

.home_recommended_list li h4 {
    font-size: 15px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    color: #333 !important;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.home_hot_list li {
    flex-direction: row !important;
    align-items: stretch !important;
}
.home_hot_list li .img {
    width: 110px !important;
    min-width: 110px !important;
    aspect-ratio: 1 !important;
}
.home_hot_list li .text { flex: 1; padding: 12px !important; }

/* ========== 分类页 ========== */
body.xff-classify {
    background: #F3F4F8 !important;
    padding-bottom: 72px;
}

body.xff-classify .xff-classify-wrap {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

body.xff-classify .right1 {
    position: sticky !important;
    top: 0 !important;
    height: auto !important;
    width: 100% !important;
    padding: 10px 12px !important;
    background: linear-gradient(135deg, #FF9500, #FF6B00) !important;
    z-index: 100 !important;
    box-sizing: border-box;
}
body.xff-classify .right1 input {
    width: 100% !important;
    border-radius: 20px !important;
    padding: 10px 16px !important;
    background: rgba(255,255,255,0.9) !important;
    border: none !important;
}

.classification_left {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: block !important;
    overflow: visible !important;
    float: none !important;
    padding: 0 !important;
    background: transparent !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
}
.classification_left ul {
    display: flex !important;
    overflow-x: auto !important;
    gap: 8px !important;
    padding: 10px 12px !important;
    margin: 0 !important;
    list-style: none !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.classification_left ul::-webkit-scrollbar { display: none; }
.classification_left li {
    flex-shrink: 0 !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.3 !important;
    padding: 8px 16px !important;
    border-radius: 20px !important;
    background: #fff !important;
    font-size: 13px !important;
    white-space: nowrap;
    border: none !important;
}
.classification_left li.action {
    background: linear-gradient(135deg, #FF9500, #FF6B00) !important;
    color: #fff !important;
    border-right: none !important;
}
.classification_left li span { display: none !important; }

.classification_right {
    width: 100% !important;
    padding: 0 12px 16px !important;
    box-sizing: border-box !important;
    float: none !important;
}
.classification_right ul {
    display: grid !important;
    gap: 12px !important;
}
.classification_right li {
    flex-direction: row !important;
    padding: 12px !important;
    min-height: 100px !important;
}
.classification_right li .text { flex: 1; min-width: 0; }
.classification_right li .img {
    width: 90px !important;
    min-width: 90px !important;
    aspect-ratio: 1 !important;
    order: 2;
}

body.xff-classify .home_hot_list {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ========== 测评介绍页 test.html ========== */
body.xff-test {
    background: #F3F4F8 !important;
    padding-bottom: 80px !important;
}
body.xff-test .centent,
body.xff-test .xff-test-wrap {
    width: 100% !important;
    max-width: 720px !important;
    margin: 0 auto !important;
    background: #F3F4F8 !important;
    min-height: 100vh;
    box-sizing: border-box;
}

body.xff-test .details_img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow: hidden;
    position: relative;
    background: #fff;
}
body.xff-test .details_img > img {
    width: 100% !important;
    height: auto !important;
    max-height: 240px !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 0 !important;
}

body.xff-test .details_title {
    padding: 16px !important;
    margin: 0 !important;
    background: #fff !important;
    position: relative !important;
    top: auto !important;
}
body.xff-test .details_title h4 {
    font-size: 18px !important;
    height: auto !important;
    line-height: 1.4 !important;
}
body.xff-test .details_text {
    margin-top: 10px !important;
    padding: 16px !important;
    border-radius: 14px;
    margin-left: 12px;
    margin-right: 12px;
    width: calc(100% - 24px) !important;
    box-sizing: border-box;
}
body.xff-test .details_text_img img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    border-radius: 8px;
    margin-top: 10px;
}
body.xff-test .details_text_img p {
    word-break: break-word;
    line-height: 1.7;
}

/* test页内推荐列表 - 禁止横向小图布局 */
body.xff-test .home_recommended_list {
    padding: 0 12px 20px !important;
}
body.xff-test .home_recommended_list ul {
    grid-template-columns: 1fr !important;
}
body.xff-test .home_recommended_list li {
    flex-direction: row !important;
    padding: 12px !important;
}
body.xff-test .home_recommended_list li .dianji {
    flex: 1;
    order: 1;
    padding: 0 12px 0 0 !important;
}
body.xff-test .home_recommended_list li .img {
    width: 88px !important;
    min-width: 88px !important;
    aspect-ratio: 1 !important;
    order: 2;
}

body.xff-test .vip_footer {
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    max-width: 100% !important;
    width: 100% !important;
}

body.xff-test .home_header.hidden-xs {
    display: none !important;
}

body.xff-test .fenxaing {
    position: absolute;
    top: 12px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    padding: 0 12px;
    z-index: 5;
}

/* ========== 测评答题页弹窗 ========== */
body.xff-quiz .exam_rusults_box,
body.xff-quiz .my_binding_box,
body.xff-quiz .tcbox.sxtc_box,
body.xff-quiz .mbti_exam_pay_musk,
body.xff-quiz .musk {
    display: none !important;
}
body.xff-quiz .my_binding_box.xff-modal-open,
body.xff-quiz .exam_rusults_box.xff-modal-open {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
body.xff-quiz .tcbox.sxtc_box.xff-modal-open,
body.xff-quiz .musk.xff-modal-open {
    display: block !important;
}

body.xff-quiz .my_binding_mobile,
body.xff-quiz .tcbox.sxtc_box {
    border-radius: 16px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15) !important;
}
body.xff-quiz .my_binding_mobile button,
body.xff-quiz .tcbox .jx {
    background: linear-gradient(135deg, #FF9500, #FF6B00) !important;
    border-radius: 24px !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600 !important;
}
body.xff-quiz .tcbox .cxks {
    border-radius: 24px !important;
    border: 2px solid #ddd !important;
    color: #666 !important;
    background: #fff !important;
}

body.xff-quiz .xff-quiz-shell {
    max-width: 520px;
    margin: 0 auto;
}

/* ========== 底部导航 ========== */
.footer { height: 64px !important; }
footer {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
    padding: 6px 0 calc(6px + env(safe-area-inset-bottom)) !important;
    z-index: 300 !important;
    background: #fff !important;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.06) !important;
}
footer ul { display: flex !important; width: 100% !important; margin: 0; padding: 0; list-style: none; }
footer li { flex: 1 !important; float: none !important; text-align: center !important; height: auto !important; }
footer li img { height: 24px !important; margin: 2px auto !important; display: block !important; }
footer li p { font-size: 11px !important; height: auto !important; margin: 0; }

.vip_footer {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
    transform: none !important;
    display: flex !important;
    align-items: center !important;
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom)) !important;
    background: #fff !important;
    z-index: 300 !important;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.08) !important;
}
.vip_footer .left, .vip_footer .right, .vip_footer .zhongjian { float: none !important; width: auto !important; }
.vip_footer .right { flex: 2 !important; }
.vip_footer .right button {
    width: 100% !important;
    border-radius: 24px !important;
    height: 46px !important;
    background: linear-gradient(135deg, #FF9500, #FF6B00) !important;
    color: #fff !important;
    font-weight: 600 !important;
    border: none !important;
}

/* ========== 断点 ========== */
@media (max-width: 767px) {
    .home_recommended_list ul { grid-template-columns: 1fr !important; }
    .home_hot_list ul { grid-template-columns: 1fr !important; }
    .classification_right ul { grid-template-columns: 1fr !important; }
    .home_banner { max-height: 200px; }
    .home_hot_list li { flex-direction: column !important; }
    .home_hot_list li .img { width: 100% !important; min-width: 100% !important; }
}

@media (min-width: 768px) and (max-width: 991px) {
    body.xff-site .xff-site-shell { padding: 0 16px; }
    .home_recommended_list ul { grid-template-columns: repeat(2, 1fr) !important; }
    .home_hot_list ul { grid-template-columns: repeat(2, 1fr) !important; }
    .classification_right ul { grid-template-columns: repeat(2, 1fr) !important; }
    body.xff-test .centent { max-width: 100% !important; padding: 0 16px; }
}

@media (min-width: 992px) {
    body.xff-site .xff-site-shell,
    body.xff-classify .xff-classify-wrap {
        max-width: 1200px !important;
        margin: 0 auto !important;
        padding: 0 20px;
    }

    .home_recommended_list ul { grid-template-columns: repeat(4, 1fr) !important; }
    .home_hot_list ul { grid-template-columns: repeat(2, 1fr) !important; }
    .home_nav ul { grid-template-columns: repeat(8, 1fr) !important; }
    .home_banner { max-height: 400px; border-radius: 16px; overflow: hidden; }

    /* PC 分类：左侧竖栏 + 右侧网格 */
    body.xff-classify .xff-classify-body {
        display: grid !important;
        grid-template-columns: 200px 1fr !important;
        gap: 16px !important;
        align-items: start !important;
    }
    body.xff-classify .classification_left ul {
        flex-direction: column !important;
        overflow: visible !important;
        padding: 0 !important;
    }
    body.xff-classify .classification_left li {
        width: 100% !important;
        text-align: left !important;
        border-radius: 10px !important;
    }
    .classification_right ul { grid-template-columns: repeat(3, 1fr) !important; }
    .classification_right li { flex-direction: column !important; }
    .classification_right li .img { width: 100% !important; min-width: 100% !important; order: 0; }

    body.xff-test .centent,
    body.xff-test .xff-test-wrap { max-width: 860px !important; }

    footer {
        max-width: 1200px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        border-radius: 16px 16px 0 0;
    }

    body.xff-quiz .xff-quiz-shell { max-width: 520px; }
}

body.xff-pay #bao,
body.xff-pay .pay_box {
    width: calc(100% - 24px) !important;
    max-width: 520px !important;
    margin: 16px auto !important;
}

/* 支付/结果页 PC 背景铺满 */
@media (min-width: 768px) {
    body.xff-pay {
        background: rgb(223 226 235 / 21%) !important;
        min-height: 100vh;
    }

    body.xff-pay .pay_bg {
        width: 100vw !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }

    body.xff-pay #app {
        max-width: 520px !important;
        margin: 0 auto !important;
    }

    body.xff-pay .payment-unlock-page {
        max-width: 520px !important;
        margin: 0 auto !important;
    }

    body.xff-pay .payment-unlock-page:before {
        width: 100% !important;
        height: 280px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        background-size: cover !important;
        background-position: center top !important;
    }

    body.xff-site .love_bg {
        width: 100vw !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
    }
}

/* ========== 个人中心 wode - 覆盖 new.css 旧绝对定位 ========== */
body.xff-wode .my_top,
body.xff-wode .my_top_user,
body.xff-wode .my_top_vip,
body.xff-wode .my_nav,
body.xff-wode .my_order_list {
    float: none !important;
}

body.xff-wode .my_top_user .text h3,
body.xff-wode .my_top_user .text p {
    color: inherit;
}

body.xff-wode .my_top_user .text h3 {
    color: #1f2937 !important;
}

body.xff-wode .my_top_user .text p {
    color: #6b7280 !important;
}

body.xff-wode .my_top_vip a,
body.xff-wode .my_top_vip .my_top_vip-btn {
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
}

/* 首页/全站推广二维码弹层 PC 居中（与测评介绍页一致） */
@media (min-width: 768px) {
    .classification_qrcode_box {
        display: none;
        align-items: center;
        justify-content: center;
        padding: 20px;
        box-sizing: border-box;
    }
    .classification_qrcode_box[style*="display: block"],
    .classification_qrcode_box[style*="display:block"],
    .classification_qrcode_box.xff-show {
        display: flex !important;
    }
    .classification_qrcode {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: min(420px, 50vw) !important;
        transform: none !important;
        margin: 0 auto;
    }
    .classification_qrcode img {
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
    }
}