/* ==================== 基础重置 ==================== */
*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;}
body{
    font-family:'Microsoft YaHei',-apple-system,BlinkMacSystemFont,sans-serif;
    font-size:14px;
    color:#e8c58d;
    overflow-x:hidden;
}
a{text-decoration:none;color:inherit;-webkit-tap-highlight-color:transparent;}
a:hover{text-decoration:none;}
ul,ol{list-style:none;}

/* ==================== 右侧浮动导航 ==================== */
.side-nav{
    position:fixed;
    right:30px;
    top:50%;
    transform:translateY(-50%);
    z-index:9998;
    display:flex;
    flex-direction:column;
    gap:12px;
}
.side-btn{
    display:flex;
    align-items:center;
    padding:12px 25px;
    background:linear-gradient(90deg,rgba(90,36,15,0.95) 0%,rgba(90,36,15,0.8) 100%);
    border:1px solid #5a240f;
    border-right:none;
    border-radius:8px 0 0 8px;
    color:#fef502;
    font-size:14px;
    white-space:nowrap;
    transition:all 0.3s ease;
    min-width:180px;
    max-width:220px;
}
.side-btn:hover{
    background:linear-gradient(90deg,rgba(139,90,43,0.98) 0%,rgba(90,36,15,0.9) 100%);
    padding-right:25px;
    box-shadow:0 3px 15px rgba(0,0,0,0.5);
}
.side-icon{
    font-size:18px;
    margin-right:10px;
    flex-shrink:0;
}
.side-text{
    flex:1;
}
.side-btn-qq{
    background:linear-gradient(90deg,rgba(0,153,255,0.95) 0%,rgba(0,102,204,0.8) 100%);
    border-color:#0099ff;
}
.side-btn-qq:hover{
    background:linear-gradient(90deg,rgba(0,180,255,0.98) 0%,rgba(0,120,230,0.9) 100%);
}

/* 右侧导航闪耀动画 */
.side-btn{
    animation:navShine 2s ease-in-out infinite;
}
.side-btn:nth-child(1){animation-delay:0s;}
.side-btn:nth-child(2){animation-delay:0.3s;}
.side-btn:nth-child(3){animation-delay:0.6s;}
.side-btn:nth-child(4){animation-delay:0.9s;}
.side-btn:nth-child(5){animation-delay:1.2s;}
.side-btn:nth-child(6){animation-delay:1.5s;}
@keyframes navShine{
    0%,100%{box-shadow:0 0 5px rgba(254,245,2,0.3);}
    50%{box-shadow:0 0 15px rgba(254,245,2,0.8),0 0 25px rgba(255,152,0,0.5);}
}
.side-btn:hover{
    animation:none;
    box-shadow:0 0 20px rgba(254,245,2,1),0 0 40px rgba(255,152,0,0.8),0 0 60px rgba(255,100,0,0.6);
    transform:scale(1.05);
}

/* ==================== 全屏背景 ==================== */
.fullscreen-bg{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:url(../Top/images/logo.png) no-repeat center top;
    background-size:100% auto;
    background-position:0 0;
    z-index:-1;
}

/* ==================== 滑动提示箭头 ==================== */
.scroll-hint{
    position:fixed !important;
    left:auto !important;
    right:250px !important;
    bottom:30px !important;
    z-index:9999 !important;
    display:flex !important;
    flex-direction:column;
    align-items:center;
    gap:5px;
    animation:hintPulse 1.5s ease-in-out infinite;
}
.scroll-arrow{
    font-size:36px;
    color:#fef502;
    text-shadow:0 0 15px rgba(254,245,2,0.8),0 0 30px rgba(255,152,0,0.6);
    animation:arrowGlow 1s ease-in-out infinite alternate;
}
.scroll-arrow-up{
    animation-delay:0s;
}
.scroll-arrow-down{
    animation-delay:0.5s;
}
.scroll-text{
    font-size:20px;
    color:#fef502;
    font-weight:bold;
    text-shadow:0 0 15px rgba(254,245,2,1),0 0 30px rgba(255,152,0,0.8);
    background:rgba(26,12,6,0.8);
    padding:12px 25px;
    border-radius:30px;
    border:3px solid #fef502;
    animation:textFlash 1.2s ease-in-out infinite;
    white-space:nowrap;
}
@keyframes hintPulse{
    0%,100%{transform:scale(1);}
    50%{transform:scale(1.1);}
}
@keyframes arrowGlow{
    0%{text-shadow:0 0 10px rgba(254,245,2,0.8),0 0 20px rgba(255,152,0,0.6);opacity:0.7;}
    100%{text-shadow:0 0 20px rgba(254,245,2,1),0 0 40px rgba(255,152,0,1),0 0 60px rgba(255,100,0,0.8);opacity:1;}
}
@keyframes textFlash{
    0%,100%{box-shadow:0 0 10px rgba(254,245,2,0.5);}
    50%{box-shadow:0 0 25px rgba(254,245,2,1),0 0 50px rgba(255,152,0,0.8);}
}

/* ==================== 主容器 ==================== */
.main-container{
    width:100%;
    max-width:1200px;
    margin:0 auto;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    padding-top:30%;
    position:relative;
    z-index:1;
}

/* ==================== 顶部导航 ==================== */
.site-header{
    padding:15px 20px;
    background:rgba(26,12,6,0.8);
    border-bottom:2px solid #5a240f;
}
.header-content{
    max-width:1200px;
    margin:0 auto;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:15px;
}
.logo-area h1{
    font-size:28px;
    color:#fef502;
    text-shadow:2px 2px 4px rgba(0,0,0,0.8);
    letter-spacing:5px;
}
.main-nav{
    display:flex;
    gap:10px;
    flex-wrap:nowrap;
    justify-content:flex-end;
    flex:1;
}
.nav-btn{
    padding:10px 18px;
    background:linear-gradient(180deg,#cc0000 0%,#8b0000 50%,#660000 100%);
    border:2px solid #333;
    border-radius:5px;
    color:#ffd700;
    font-size:14px;
    font-weight:bold;
    transition:all 0.3s ease;
    text-shadow:1px 1px 2px #000, 0 0 10px rgba(255,215,0,0.5);
    box-shadow:0 2px 8px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.3);
    letter-spacing:1px;
    white-space:nowrap;
}
.nav-btn:hover{
    background:linear-gradient(180deg,#ff3333 0%,#cc0000 50%,#990000 100%);
    transform:translateY(-3px) scale(1.05);
    box-shadow:0 5px 20px rgba(255,0,0,0.4), 0 0 30px rgba(255,215,0,0.6), inset 0 1px 0 rgba(255,255,255,0.3);
    text-shadow:2px 2px 4px #000, 0 0 15px rgba(255,215,0,0.8), 0 0 25px rgba(255,100,0,0.5);
    border-color:#ffd700;
}

/* 顶部导航鼠标悬停特效 */
.main-nav .nav-btn:hover{
    box-shadow:0 5px 20px rgba(255,0,0,0.5), 0 0 40px rgba(255,215,0,0.8), 0 0 60px rgba(255,100,0,0.5);
    transform:translateY(-3px) scale(1.05);
}

/* 顶部导航只有鼠标悬停才有特效 */
.main-nav .nav-btn:hover{
    box-shadow:0 0 20px rgba(254,245,2,1),0 0 40px rgba(255,152,0,0.8),0 0 60px rgba(255,100,0,0.6);
    transform:translateY(-2px) scale(1.05);
    transition:all 0.3s ease;
}

/* ==================== 主横幅 ==================== */
.hero-section{
    padding:40px 20px;
    text-align:center;
    background:rgba(26,12,6,0.3);
    position:relative;
}
.thunder-wrapper{
    position:relative;
    display:inline-block;
}
.hero-title-img{
    width:auto;
    max-width:100%;
    max-height:180px;
    height:auto;
    display:block;
    margin:20px auto;
    animation:thunderPulse 2s ease-in-out infinite;
    filter:drop-shadow(0 0 15px rgba(100,149,237,0.8)) drop-shadow(0 0 30px rgba(138,43,226,0.6));
}
@keyframes thunderPulse{
    0%,100%{
        filter:drop-shadow(0 0 15px rgba(100,149,237,0.8)) drop-shadow(0 0 30px rgba(138,43,226,0.6)) drop-shadow(0 0 5px rgba(255,255,255,0.9));
        transform:scale(1);
    }
    50%{
        filter:drop-shadow(0 0 25px rgba(135,206,250,1)) drop-shadow(0 0 50px rgba(186,85,211,0.9)) drop-shadow(0 0 15px rgba(255,255,255,1));
        transform:scale(1.03);
    }
}
.hero-content h2{
    font-size:56px;
    color:#fef502;
    text-shadow:3px 3px 6px rgba(0,0,0,0.8);
    letter-spacing:10px;
    margin-bottom:15px;
}
.hero-content p{
    font-size:22px;
    color:#e8c58d;
    text-shadow:2px 2px 4px rgba(0,0,0,0.8);
    letter-spacing:8px;
    margin-bottom:30px;
}
.hero-btns{
    display:flex;
    justify-content:center;
    gap:20px;
    flex-wrap:wrap;
}
.hero-btn{
    padding:15px 40px;
    font-size:18px;
    font-weight:bold;
    border-radius:8px;
    transition:all 0.3s ease;
}
.hero-btn:hover{transform:translateY(-3px);box-shadow:0 5px 20px rgba(0,0,0,0.5);}
.btn-start{
    background:linear-gradient(180deg,#fef502 0%,#d4a056 100%);
    color:#3d1a0a;
    border:2px solid #fef502;
}
.btn-charge{
    background:linear-gradient(180deg,#FF9800 0%,#E65100 100%);
    color:#fff;
    border:2px solid #FF9800;
}

/* 客服微信和网址按钮闪耀动画 */
.hero-btns .hero-btn{
    animation:heroBtnShine 2s ease-in-out infinite;
}
.hero-btns .hero-btn:nth-child(1){animation-delay:0s;}
.hero-btns .hero-btn:nth-child(2){animation-delay:1s;}
@keyframes heroBtnShine{
    0%,100%{box-shadow:0 0 8px rgba(254,245,2,0.4);}
    50%{box-shadow:0 0 20px rgba(254,245,2,0.9),0 0 35px rgba(255,152,0,0.6);}
}
.hero-btns .hero-btn:hover{
    animation:none;
    box-shadow:0 0 25px rgba(254,245,2,1),0 0 50px rgba(255,152,0,0.9),0 0 75px rgba(255,100,0,0.7);
    transform:translateY(-3px) scale(1.05);
    cursor:pointer;
}

/* 微信二维码弹窗 */
.weixin-modal{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.85);
    z-index:10000;
    justify-content:center;
    align-items:center;
}
.weixin-modal.active{
    display:flex;
}
.weixin-modal-content{
    background:linear-gradient(180deg,#1a0c06 0%,#2d1a0f 100%);
    border:3px solid #fef502;
    border-radius:15px;
    padding:30px;
    text-align:center;
    position:relative;
    box-shadow:0 0 50px rgba(254,245,2,0.5);
    animation:modalPop 0.3s ease-out;
}
@keyframes modalPop{
    0%{transform:scale(0.5);opacity:0;}
    100%{transform:scale(1);opacity:1;}
}
.weixin-close{
    position:absolute;
    top:10px;
    right:15px;
    font-size:30px;
    color:#fef502;
    cursor:pointer;
    transition:all 0.3s;
}
.weixin-close:hover{
    color:#fff;
    transform:scale(1.2);
}
.weixin-img{
    max-width:300px;
    max-height:300px;
    border-radius:10px;
    border:2px solid #5a240f;
}
.weixin-tip{
    margin-top:20px;
    font-size:18px;
    color:#fef502;
    text-shadow:2px 2px 4px rgba(0,0,0,0.8);
}

/* ==================== 装备展示区域 ==================== */
.gallery-section{
    padding:30px 0;
    background:rgba(26,12,6,0.7);
}
.gallery-wrapper{
    position:relative;
    display:flex;
    align-items:center;
    max-width:1200px;
    margin:0 auto;
    padding:0 50px;
}
.gallery-btn{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:60px;
    height:80px;
    background:linear-gradient(180deg,#5a240f 0%,#3d1a0a 100%);
    border:3px solid #fef502;
    border-radius:15px;
    color:#fef502;
    font-size:28px;
    font-weight:bold;
    cursor:pointer;
    z-index:100;
    transition:all 0.3s ease;
    box-shadow:0 5px 20px rgba(0,0,0,0.6);
}
.gallery-btn:hover{
    background:linear-gradient(180deg,#8b5a2b 0%,#5a240f 100%);
    transform:translateY(-50%) scale(1.1);
    box-shadow:0 8px 30px rgba(254,245,2,0.4);
}
.gallery-btn-left{
    left:0;
}
.gallery-btn-right{
    right:0;
}
.gallery-carousel{
    display:flex;
    gap:20px;
    overflow-x:auto;
    padding:20px 10px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:#5a240f #1a0c06;
}
.gallery-carousel::-webkit-scrollbar{height:10px;}
.gallery-carousel::-webkit-scrollbar-track{background:#1a0c06;border-radius:5px;}
.gallery-carousel::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#5a240f,#8b5a2b);border-radius:5px;}
.gallery-carousel::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#8b5a2b,#fef502);}
.class-item{
    flex:0 0 320px;
    scroll-snap-align:start;
    background:rgba(90,36,15,0.5);
    border:3px solid #5a240f;
    border-radius:12px;
    overflow:hidden;
    transition:all 0.3s ease;
}
.class-item:hover{
    transform:translateY(-8px);
    box-shadow:0 15px 40px rgba(254,245,2,0.3);
    border-color:#fef502;
}
.class-item img{
    width:100%;
    height:400px;
    object-fit:cover;
    display:block;
    cursor:pointer;
    transition:transform 0.3s ease;
}
.class-item img:hover{
    transform:scale(1.05);
}

/* 图片放大弹窗 */
.image-modal{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.9);
    z-index:10001;
    justify-content:center;
    align-items:center;
}
.image-modal.active{
    display:flex;
}
.image-modal-content{
    background:linear-gradient(180deg,#1a0c06 0%,#2d1a0f 100%);
    border:3px solid #fef502;
    border-radius:15px;
    padding:20px;
    text-align:center;
    position:relative;
    box-shadow:0 0 60px rgba(254,245,2,0.6);
    animation:imgModalPop 0.3s ease-out;
    max-width:90%;
    max-height:90%;
}
@keyframes imgModalPop{
    0%{transform:scale(0.3);opacity:0;}
    100%{transform:scale(1);opacity:1;}
}
.image-close{
    position:absolute;
    top:5px;
    right:15px;
    font-size:40px;
    color:#fef502;
    cursor:pointer;
    transition:all 0.3s;
    z-index:10;
}
.image-close:hover{
    color:#fff;
    transform:scale(1.2);
}
.modal-img{
    max-width:80vw;
    max-height:70vh;
    border-radius:10px;
    border:2px solid #5a240f;
}
.image-caption{
    margin-top:15px;
    font-size:20px;
    color:#fef502;
    text-shadow:2px 2px 4px rgba(0,0,0,0.8);
}

/* ==================== 公告区域 ==================== */
.notice-section{
    padding:30px 20px;
    background:rgba(26,12,6,0.85);
    margin:0;
}
.section-title{
    text-align:center;
    font-size:24px;
    color:#fef502;
    text-shadow:2px 2px 4px rgba(0,0,0,0.8);
    margin-bottom:25px;
    padding-bottom:15px;
    border-bottom:2px solid #5a240f;
    letter-spacing:5px;
}
.notice-list{
    max-width:1000px;
    margin:0 auto;
    max-height:600px;
    overflow-y:auto;
    padding-right:10px;
    scrollbar-width:thin;
    scrollbar-color:#5a240f #1a0c06;
}
.notice-list::-webkit-scrollbar{width:8px;}
.notice-list::-webkit-scrollbar-track{background:#1a0c06;border-radius:4px;}
.notice-list::-webkit-scrollbar-thumb{background:#5a240f;border-radius:4px;}
.notice-list::-webkit-scrollbar-thumb:hover{background:#8b5a2b;}

.notice-card{
    background:rgba(90,36,15,0.4);
    border:1px solid #5a240f;
    border-radius:8px;
    padding:15px;
    margin-bottom:15px;
    transition:all 0.3s ease;
}
.notice-card:hover{
    background:rgba(90,36,15,0.6);
    box-shadow:0 5px 15px rgba(0,0,0,0.4);
}
.notice-card h4{
    font-size:16px;
    color:#fef502;
    margin-bottom:12px;
    padding-bottom:8px;
    border-bottom:1px dashed #5a240f;
}
.notice-card p{
    font-size:13px;
    color:#e8c58d;
    line-height:1.8;
    margin-bottom:8px;
}
.notice-card .tag{
    color:#fef502;
    font-weight:bold;
    margin-right:5px;
}

/* ==================== 底部 ==================== */
.site-footer{
    padding:30px 20px;
    background:rgba(26,12,6,0.95);
    border-top:2px solid #5a240f;
    margin-top:auto;
}
.footer-content{
    max-width:1200px;
    margin:0 auto;
    text-align:center;
}
.footer-content .tips{
    font-size:12px;
    color:#8c7261;
    margin-bottom:15px;
    line-height:1.6;
}
.footer-content .links{
    margin-bottom:15px;
}
.footer-content .links a{
    color:#d4d8d8;
    margin:0 10px;
    font-size:13px;
    transition:color 0.3s;
}
.footer-content .links a:hover{color:#fef502;}
.footer-content .copyright{
    font-size:12px;
    color:#8c7261;
}
.footer-content .icp{
    font-size:12px;
    color:#8c7261;
    margin:5px 0;
}
.footer-content .icp a{
    color:#8c7261;
}
.footer-content .icp a:hover{
    color:#fef502;
}
.footer-content .stats{
    margin-top:10px;
    font-size:12px;
    color:#8c7261;
    position:relative;
}
.footer-content .stats span{
    margin:0 15px;
}
.footer-content .stats strong{
    color:#fef502;
    font-weight:normal;
}
.footer-content .stats a{
    color:#fef502;
    text-decoration:none;
}
.footer-content .stats a:hover{
    color:#fff;
    text-decoration:underline;
}

/* ==================== 音乐控制 ==================== */
.musicbox{
    position:fixed;
    top:10px;
    right:10px;
    width:40px;
    height:40px;
    z-index:9999;
    cursor:pointer;
}
.musicbox.musicplay{
    background:url(../images/musicplay.png) no-repeat center;
    background-size:contain;
}

/* ==================== 响应式 - 大平板 iPad Pro (1024px-1366px) ==================== */
@media screen and (max-width:1366px) and (min-width:1024px){
    .side-nav{right:20px;}
    .side-btn{min-width:160px;max-width:200px;padding:10px 20px;}
    .logo-area h1{font-size:26px;}
    .hero-title-img{max-width:700px;}
    .main-nav{gap:12px;}
    .nav-btn{padding:10px 20px;font-size:14px;}
    .class-item{flex:0 0 340px;}
    .class-item img{height:420px;}
}

/* ==================== 响应式 - 平板 iPad (768px-1024px) ==================== */
@media screen and (max-width:1024px) and (min-width:768px){
    .side-nav{right:15px;gap:10px;}
    .side-btn{min-width:140px;max-width:180px;padding:10px 18px;font-size:13px;}
    .logo-area h1{font-size:24px;}
    .hero-title-img{max-width:600px;}
    .main-nav{gap:10px;}
    .nav-btn{padding:8px 18px;font-size:13px;}
    .hero-content h2{font-size:42px;letter-spacing:8px;}
    .hero-content p{font-size:18px;}
    .notice-list{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
    .class-item{flex:0 0 300px;}
    .class-item img{height:380px;}
}

/* ==================== 响应式 - 手机 (481px-768px) ==================== */
@media screen and (max-width:768px){
    /* 顶部导航 - 独立布局 */
    .site-header {
        padding: 10px 15px;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 10000;
        background: rgba(26,12,6,0.95);
        border-bottom: 2px solid #5a240f;
    }
    .header-content {
        display: block;
        max-width: 100%;
    }
    .logo-area {
        display: block;
        margin-bottom: 10px;
    }
    .logo-area h1 {
        font-size: 18px;
        letter-spacing: 2px;
        text-align: left;
    }
    .main-nav {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 8px;
        justify-content: flex-start;
        padding-bottom: 5px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .main-nav::-webkit-scrollbar {
        display: none;
    }
    .nav-btn,
    .nav-dropdown-wrapper .nav-btn {
        padding: 10px 16px;
        font-size: 13px;
        letter-spacing: 1px;
        white-space: nowrap;
        flex-shrink: 0;
        border-radius: 6px;
    }
    .nav-dropdown-wrapper {
        position: relative;
    }
    .nav-dropdown-wrapper .nav-btn {
        padding: 10px 16px;
    }
    .nav-dropdown-menu {
        position: fixed;
        top: auto;
        bottom: 0;
        left: 0;
        right: 0;
        max-height: 55vh;
        overflow-y: auto;
        border-radius: 15px 15px 0 0;
        z-index: 10001;
        padding: 15px;
    }
    .nav-dropdown-btn {
        display: block;
        padding: 14px;
        margin-bottom: 8px;
        font-size: 14px;
        border-radius: 8px;
    }
    .nav-dropdown-btn .download-link-name {
        font-size: 15px;
    }
    .main-container {
        padding-top: 85px;
    }

    /* 右侧导航 - 隐藏 */
    .side-nav {
        display: none !important;
    }

    /* 下拉菜单 */
    .dropdown-wrapper {
        position: relative;
    }
    .dropdown-menu {
        position: fixed;
        left: 10px;
        right: 10px;
        bottom: 10px;
        top: auto;
        border-radius: 12px;
        max-height: 45vh;
        overflow-y: auto;
        z-index: 9999;
    }

    /* 主内容区域 */
    .hero-section {
        padding: 25px 15px;
    }
    .hero-title-img {
        max-height: 110px;
    }

    /* 公告区域 */
    .notice-section {
        padding: 20px 15px;
    }
    .section-title {
        font-size: 20px;
        letter-spacing: 2px;
        margin-bottom: 15px;
    }
    .notice-card {
        padding: 15px;
        margin-bottom: 12px;
        border-radius: 8px;
    }
    .notice-card h4 {
        font-size: 16px;
    }
    .notice-card p {
        font-size: 14px;
        line-height: 1.7;
    }

    /* 职业介绍 */
    .class-section {
        padding: 20px 15px;
    }
    .class-item {
        flex: 0 0 100%;
        margin-bottom: 20px;
    }
    .class-item img {
        height: 300px;
    }

    /* 底部 */
    .site-footer {
        padding: 20px 15px;
    }

    /* 音乐控制 */
    .musicbox {
        top: 90px;
        right: 10px;
        width: 40px;
        height: 40px;
    }
}

/* ==================== 响应式 - 小屏手机 (<480px) ==================== */
@media screen and (max-width:480px){
    .site-header {
        padding: 8px 12px;
    }
    .logo-area h1 {
        font-size: 16px;
        letter-spacing: 1px;
    }
    .main-nav {
        gap: 6px;
    }
    .nav-btn,
    .nav-dropdown-wrapper .nav-btn {
        padding: 8px 14px;
        font-size: 12px;
    }
    .main-container {
        padding-top: 80px;
    }
    .hero-title-img {
        max-height: 90px;
    }
    .musicbox {
        top: 85px;
        right: 8px;
        width: 36px;
        height: 36px;
    }
}



/* ==================== IP隐私条款提示 ==================== */
.ip-tooltip-wrap{
    position:relative;
    display:inline-block;
    cursor:pointer;
}
.ip-tooltip{
    display:none;
    position:absolute;
    bottom:100%;
    right:0;
    margin-bottom:10px;
    width:320px;
    background:linear-gradient(180deg,#1a0c06 0%,#2d1a0f 100%);
    border:2px solid #fef502;
    border-radius:10px;
    padding:15px;
    z-index:9999;
    box-shadow:0 5px 25px rgba(0,0,0,0.8);
}
.ip-tooltip.active{
    display:block;
}
.ip-tooltip-title{
    color:#fef502;
    font-size:14px;
    font-weight:bold;
    margin-bottom:10px;
    padding-bottom:8px;
    border-bottom:1px solid #5a240f;
}
.ip-tooltip-content{
    position:relative;
}
.ip-tooltip-content p{
    color:#e8c58d;
    font-size:11px;
    line-height:1.6;
    margin-bottom:8px;
}
.ip-tooltip-content p:first-child{
    margin-top:0;
}
.ip-tooltip-content p:last-child{
    margin-bottom:0;
}
.ip-query-link{
    padding-top:10px;
    border-top:1px dashed #5a240f;
    margin-top:5px;
    text-align:center;
}
.ip-tooltip-content a{
    color:#fef502;
    text-decoration:underline;
    cursor:pointer;
}
.ip-tooltip-content a:hover{
    color:#fff;
}

/* 移动端IP提示框 */
@media screen and (max-width:768px){
    .ip-tooltip{
        width:260px;
        right:0;
        bottom:auto;
        top:100%;
        margin-bottom:0;
        margin-top:10px;
    }
}

/* ==================== 下拉导航菜单样式 ==================== */

/* 右侧浮动导航下拉容器 */
.dropdown-wrapper {
    position: relative;
}

.dropdown-trigger {
    cursor: pointer;
    justify-content: space-between;
    align-items: center;
}

.dropdown-arrow {
    font-size: 10px;
    margin-left: 8px;
    transition: transform 0.3s ease;
}

.dropdown-wrapper:hover .dropdown-arrow {
    transform: rotate(180deg);
}

/* 右侧浮动导航下拉菜单 */
.dropdown-menu {
    position: absolute;
    top: 0;
    right: 100%;
    margin-right: 10px;
    min-width: 320px;
    background: linear-gradient(180deg, rgba(26, 12, 6, 0.98) 0%, rgba(45, 26, 15, 0.98) 100%);
    border: 2px solid #fef502;
    border-radius: 10px;
    padding: 10px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(10px);
    transition: all 0.3s ease;
    z-index: 10000;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.8), 0 0 20px rgba(254, 245, 2, 0.3);
    pointer-events: none;
}

.dropdown-wrapper:hover .dropdown-menu,
.dropdown-wrapper .dropdown-menu:hover {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    pointer-events: auto;
}

/* 顶部导航下拉容器 */
.nav-dropdown-wrapper {
    position: relative;
    display: inline-block;
}

.nav-dropdown-trigger {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.nav-dropdown-arrow {
    font-size: 10px;
    margin-left: 6px;
    transition: transform 0.3s ease;
}

.nav-dropdown-wrapper:hover .nav-dropdown-arrow {
    transform: rotate(180deg);
}

/* 顶部导航按钮统一样式 */
.nav-dropdown-wrapper .nav-btn {
    padding: 10px 18px;
    background: linear-gradient(180deg,#cc0000 0%,#8b0000 50%,#660000 100%);
    border:2px solid #333;
    border-radius:5px;
    color:#ffd700;
    font-size:14px;
    font-weight:bold;
    transition:all 0.3s ease;
    text-shadow:1px 1px 2px #000, 0 0 10px rgba(255,215,0,0.5);
    box-shadow:0 2px 8px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.3);
    letter-spacing:1px;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.nav-dropdown-wrapper .nav-btn:hover {
    background:linear-gradient(180deg,#ff3333 0%,#cc0000 50%,#990000 100%);
    transform:translateY(-3px) scale(1.05);
    box-shadow:0 5px 20px rgba(255,0,0,0.4), 0 0 30px rgba(255,215,0,0.6), inset 0 1px 0 rgba(255,255,255,0.3);
    text-shadow:2px 2px 4px #000, 0 0 15px rgba(255,215,0,0.8), 0 0 25px rgba(255,100,0,0.5);
    border-color:#ffd700;
}

/* 顶部导航下拉菜单 */
.nav-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    min-width: 320px;
    background: linear-gradient(180deg, rgba(26, 12, 6, 0.98) 0%, rgba(45, 26, 15, 0.98) 100%);
    border: 2px solid #fef502;
    border-radius: 10px;
    padding: 10px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 9999;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.8), 0 0 20px rgba(254, 245, 2, 0.3);
    margin-top: 5px;
    pointer-events: none;
}

.nav-dropdown-wrapper:hover .nav-dropdown-menu,
.nav-dropdown-wrapper .nav-dropdown-menu:hover {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}

/* 下载次数标题样式 */
.dropdown-title {
    background: linear-gradient(90deg, #5a240f 0%, #8b4513 100%);
    color: #fef502;
    font-size: 12px;
    font-weight: bold;
    padding: 6px 10px;
    text-align: center;
    border-bottom: 1px solid #fef502;
    letter-spacing: 1px;
}

/* 下载按钮 - 链接和计数在一排 */
.download-btn,
.nav-dropdown-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 10px 15px;
    margin: 5px 0;
    background: linear-gradient(180deg, #cc0000 0%, #8b0000 100%);
    border: 2px solid #5a240f;
    border-radius: 8px;
    color: #ffd700;
    font-size: 14px;
    font-weight: bold;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
    box-shadow: 0 2px 8px rgba(0,0,0,0.6);
    letter-spacing: 0;
    white-space: nowrap;
    cursor: pointer;
}

.download-btn:hover,
.nav-dropdown-btn:hover {
    background: linear-gradient(180deg, #ff3333 0%, #cc0000 100%);
    border-color: #ffd700;
    transform: translateY(-2px);
    box-shadow: 0 5px 20px rgba(255,0,0,0.4);
}

/* 下载链接名称 */
.download-link-name {
    flex-shrink: 0;
}

/* 下载计数样式 */
.download-count {
    color: #00ff00;
    font-size: 12px;
    font-weight: normal;
    white-space: nowrap;
    margin-left: 10px;
}

.download-btn:hover .download-count,
.nav-dropdown-btn:hover .download-count {
    color: #ffff00;
}

/* 下拉菜单加宽 */
.dropdown-menu {
    min-width: 320px;
}

.nav-dropdown-menu {
    min-width: 320px;
}

/* 顶部导航下拉菜单显示切换 */
.nav-dropdown-menu.show {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* 下拉菜单动画效果 */
@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateX(10px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes navDropdownFadeIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

.dropdown-menu.active,
.nav-dropdown-menu.active {
    animation: dropdownFadeIn 0.3s ease forwards;
}

.nav-dropdown-menu.active {
    animation: navDropdownFadeIn 0.3s ease forwards;
}

/* 点击模式支持 - 移动端友好 */
@media screen and (max-width: 768px) {
    /* 右侧导航下拉菜单 - 移动端适配 */
    .dropdown-menu {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: 300px;
        max-width: 90vw;
        padding: 15px;
        z-index: 10001;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .dropdown-menu.active {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, -50%);
        pointer-events: auto;
    }

    .dropdown-wrapper:hover .dropdown-menu {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    /* 顶部导航下拉菜单 - 移动端适配 */
    .nav-dropdown-menu {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: 300px;
        max-width: 90vw;
        padding: 15px;
        z-index: 10001;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .nav-dropdown-menu.active {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, -50%);
        pointer-events: auto;
    }

    .nav-dropdown-wrapper:hover .nav-dropdown-menu {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    /* 移动端二级导航按钮 */
    .dropdown-btn,
    .nav-dropdown-btn {
        padding: 12px 15px;
        font-size: 14px;
    }

    .download-count {
        font-size: 12px;
    }

    /* 下拉菜单遮罩层 */
    .dropdown-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.7);
        z-index: 10000;
    }

    .dropdown-overlay.active {
        display: block;
    }
}

/* ==================== QQ客服弹窗样式 ==================== */

/* 右侧导航QQ弹窗 */
.qq-popup-wrapper {
    position: relative;
}

.qq-popup {
    position: absolute;
    top: 0;
    right: 100%;
    margin-right: 10px;
    min-width: 180px;
    background: linear-gradient(180deg, rgba(26, 12, 6, 0.98) 0%, rgba(45, 26, 15, 0.98) 100%);
    border: 2px solid #fef502;
    border-radius: 10px;
    padding: 15px;
    opacity: 0;
    visibility: hidden;
    transform: translateX(10px);
    transition: all 0.3s ease;
    z-index: 10000;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.8), 0 0 20px rgba(254, 245, 2, 0.3);
}

.qq-popup-wrapper:hover .qq-popup {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}

.qq-popup-content {
    text-align: center;
}

.qq-label {
    color: #e8c58d;
    font-size: 14px;
    margin-bottom: 8px;
}

.qq-number {
    color: #ffd700;
    font-size: 22px;
    font-weight: bold;
    letter-spacing: 2px;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
    margin-bottom: 12px;
}

.qq-link-btn {
    display: inline-block;
    padding: 8px 20px;
    background: linear-gradient(180deg, #00aa00 0%, #006600 100%);
    border: 2px solid #00cc00;
    border-radius: 6px;
    color: #fff;
    font-size: 13px;
    font-weight: bold;
    transition: all 0.3s ease;
}

.qq-link-btn:hover {
    background: linear-gradient(180deg, #00cc00 0%, #009900 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 204, 0, 0.5);
}

.qq-qrcode {
    width: 300px;
    height: 400px;
    border-radius: 8px;
    border: 2px solid #fef502;
    margin: 10px auto;
    display: block;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
    object-fit: contain;
}

/* 顶部导航QQ弹窗 */
.nav-qq-popup-wrapper {
    position: relative;
    display: inline-block;
}

.nav-qq-popup-wrapper .nav-btn {
    padding: 10px 25px;
    background: linear-gradient(180deg,#cc0000 0%,#8b0000 50%,#660000 100%);
    border:2px solid #333;
    border-radius:5px;
    color:#ffd700;
    font-size:15px;
    font-weight:bold;
    transition:all 0.3s ease;
    text-shadow:1px 1px 2px #000, 0 0 10px rgba(255,215,0,0.5);
    box-shadow:0 2px 8px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.3);
    letter-spacing:2px;
    display: inline-flex;
    align-items: center;
}

.nav-qq-popup-wrapper .nav-btn:hover {
    background:linear-gradient(180deg,#ff3333 0%,#cc0000 50%,#990000 100%);
    transform:translateY(-3px) scale(1.05);
    box-shadow:0 5px 20px rgba(255,0,0,0.4), 0 0 30px rgba(255,215,0,0.6), inset 0 1px 0 rgba(255,255,255,0.3);
    text-shadow:2px 2px 4px #000, 0 0 15px rgba(255,215,0,0.8), 0 0 25px rgba(255,100,0,0.5);
    border-color:#ffd700;
}

.nav-qq-popup {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    min-width: 180px;
    background: linear-gradient(180deg, rgba(26, 12, 6, 0.98) 0%, rgba(45, 26, 15, 0.98) 100%);
    border: 2px solid #fef502;
    border-radius: 10px;
    padding: 15px;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    z-index: 9999;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.8), 0 0 20px rgba(254, 245, 2, 0.3);
    margin-top: 5px;
}

.nav-qq-popup-wrapper:hover .nav-qq-popup {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
}

/* 移动端QQ弹窗适配 */
@media screen and (max-width: 768px) {
    .qq-popup,
    .nav-qq-popup {
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        min-width: 240px;
        max-width: 90vw;
        z-index: 10001;
        opacity: 0;
        visibility: hidden;
        padding: 20px;
    }

    .qq-popup-wrapper:hover .qq-popup,
    .nav-qq-popup-wrapper:hover .nav-qq-popup {
        opacity: 0;
        visibility: hidden;
        transform: translate(-50%, -50%);
    }

    .qq-popup.active,
    .nav-qq-popup.active {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, -50%);
    }

    .qq-label {
        font-size: 16px;
    }

    .qq-number {
        font-size: 26px;
    }

    .qq-link-btn {
        padding: 12px 24px;
        font-size: 15px;
    }
}
    }
}