/* ✅ 全局兼容基础设置 */
html, body {
    margin: 0;
    padding: 0;
    font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
    -webkit-text-size-adjust: 100%; /* 避免移动端字体缩放 */
}

/* ✅ 背景图兼容修复 */
.index_xslb_a { background: url(/Public/statics/images/dp.png) center center / cover no-repeat; }
.index_xslb_b { background: url(/Public/statics/images/kp.png) center center / cover no-repeat; }
.index_xslb_c { background: url(/Public/statics/images/2.xhs.png) center center / cover no-repeat; }
.index_xslb_d { background: url(/Public/statics/images/2.hs.png) center center / cover no-repeat; }
.index_xslb_e { background: url(/Public/statics/images/2.tt.png) center center / cover no-repeat; }

/* ✅ 通用 class 去掉 Vue data-v 限定符，兼容桌面模拟器 */
.lamp {
    position: fixed;
    z-index: 999;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    width: 100%;
    height: 32px;
    background: #2e2e2e;
    color: #9b9b9b;
    display: flex;
    align-items: center;
}

/* ✅ 真机 + 模拟器兼容 */
.lamp-img {
    width: 24px;
    height: auto;
    margin: 5px 15px;
    flex-shrink: 0;
}

.move-warp {
    display: inline-block;
    white-space: nowrap;
    height: 100%;
    flex-grow: 1;
    position: relative;
    overflow: hidden;
}

.move {
    width: 100%;
    height: auto;
}

.move-start {
    animation: message-scroll 22s linear infinite;
}

.move-item {
    height: 32px;
    color: #9b9b9b;
    font-size: 13px;
    line-height: 32px;
}

.orange { color: #fff; }
.org { color: #ff9917; }

@keyframes message-scroll {
    0%, to { transform: translateY(0); }
    10% { transform: translateY(-10%); }
    20% { transform: translateY(-20%); }
    30% { transform: translateY(-30%); }
    40% { transform: translateY(-40%); }
    50% { transform: translateY(-50%); }
    60% { transform: translateY(-60%); }
    70% { transform: translateY(-70%); }
    80% { transform: translateY(-80%); }
    90% { transform: translateY(-90%); }
    100% { transform: translateY(0); }
}

/* ✅ 图片样式优化 */
.index_lb img {
    border-radius: 6px;
    width: 100%;
    display: block;
}

/* ✅ swiper 兼容 */
.swiper-slide {
    width: 100% !important;
    box-sizing: border-box;
    padding: 0 6%;
}

/* ✅ 首页布局优化 */
.index_lb {
    width: 100%;
    margin: 0 auto;
    background: none;
}

/* ✅ 圆角背景修复 */
#oval {
    width: 100%;
    height: 100px;
    background: #ff5196;
    border-radius: 100px / 50px;
    margin-top: -50px;
}

/* ✅ .lamp 白背景 */
.lamp {
    background-color: #fff;
}

/* ✅ 列表布局 */
.row .col {
    float: left;
    box-sizing: border-box;
}

.category .col {
    width: 20% !important;
    margin-top: 7px;
}

.category .content img {
    width: 50px;
    padding: 0 5px;
}

.category .content {
    text-align: center;
}

.category .content span {
    display: block;
    margin-top: 1px;
    margin-bottom: 5px;
}

/* ✅ 栅格系统修复 */
.row .col.s6 { width: 50%; }
.row .col.s8 { width: 66.6667%; }

.chart-child .s8 span { font-size: 10px; }
.chart-child .s8, .chart-child h3 { color: #fff; }

/* ✅ 首页项目统计 */
.home-chart h3 { font-size: 18px; }

.chart-child {
    height: 70px;
    background: linear-gradient(90deg, #8570d8 30%, #fff);
    border-radius: 5px;
    padding: 5px !important;
}

.chart-child:nth-of-type(2) {
    background: linear-gradient(90deg, #f7718e 30%, #fff);
    margin-bottom: 10px;
}
.chart-child:nth-of-type(3) {
    background: linear-gradient(90deg, #54d5e2 30%, #fff);
}
.chart-child:nth-of-type(4) {
    background: linear-gradient(90deg, #38f 30%, #fff);
}

.chart-child .s8 span { font-size: 10px; }
.chart-child .s8 p { font-size: 12px; margin: 0; }
.chart-child .s4 img { width: 40px; height: 40px; margin-top: 9px; border-radius: 50%; }

/* ✅ 任务推荐样式 */
.index_tjrw {
    margin-top: 10px;
    height: 100%;
}
.index_rwxq img {
    width: 4rem;
    height: 4rem;
    margin: 1rem 0.5rem;
}
.index_wzns {
    width: 55%;
    padding-top: 5px;
}
.index_title {
    display: -webkit-box;
    min-height: 33px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

/* ✅ 弹幕修复 */
.barrage_box {
    height: 30px;
}
.barrage_box div.p a {
    line-height: 30px;
}

/* ✅ 响应式修复：防止桌面模拟不触发 */
@media screen and (max-width: 768px) {
    body {
        font-size: 14px;
    }
    .lamp {
        height: 36px;
    }
    .chart-child {
        height: auto;
    }
}