/* 仅优化“原始武尊·点击赞助充值”区域的UI：柔和亮色背景 + 流星金边滑过特效 */
/* 并按要求将充值链接区域（1173wan原始武尊 + 立即充值）整体缩小 */

.server-block {
    position: relative;
    overflow: hidden;  /* 让流星滑过效果不超出边界，保持整洁 */
}

/* 充值链接区域整体缩小：内边距、字体、徽章均等比调小，保持精致 */
.server-link {
    background: linear-gradient(105deg, #fff8e7 0%, #fff1d6 100%) !important;
    border-radius: 60px !important;
    border: 1px solid #ffe0a3 !important;
    box-shadow: 0 4px 12px rgba(255, 193, 7, 0.15), inset 0 1px 0 rgba(255,255,240,0.8) !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    text-decoration: none !important;
    font-weight: bold !important;
    /* 字体略微缩小，使整体UI更紧凑 */
    font-size: 1.1rem !important;
    color: #8b5a2b !important;
    /* 内边距缩小，整体高度降低 */
    padding: 10px 20px !important;
    letter-spacing: 0.5px !important;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

/* 右侧“立即充值”徽章同步缩小 */
.server-link .enter-badge {
    background: #ffd966cc !important;
    backdrop-filter: blur(2px) !important;
    padding: 5px 16px !important;
    border-radius: 40px !important;
    font-size: 0.9rem !important;
    font-weight: 800 !important;
    color: #6b3e1c !important;
    transition: transform 0.2s ease, background 0.2s !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
    position: relative;
    z-index: 3;
}

/* 流星金边滑过特效 —— 伪元素实现金色光带从左向右滑过边框效果 */
.server-link::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 80%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(255, 215, 0, 0.6) 30%,
        rgba(255, 180, 40, 0.9) 50%,
        rgba(255, 215, 0, 0.6) 70%,
        transparent 100%);
    transform: skewX(-25deg);
    z-index: 2;
    pointer-events: none;
    transition: none;
    animation: meteorSlide 3.5s infinite ease-in-out;
    border-radius: 60px;
    filter: blur(1px);
}

/* 增加第二层流光，强化金边质感，但保持不突兀 */
.server-link::after {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 60%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent 0%, 
        rgba(255, 200, 50, 0.5) 40%,
        rgba(255, 160, 0, 0.8) 60%,
        rgba(255, 200, 50, 0.5) 80%,
        transparent 100%);
    transform: skewX(-20deg);
    z-index: 2;
    pointer-events: none;
    animation: meteorSlideReverse 4.2s infinite ease-in-out;
    border-radius: 60px;
    filter: blur(1.5px);
}

/* 主流星动画：从左到右滑过，产生金边掠过效果 */
@keyframes meteorSlide {
    0% {
        left: -100%;
        opacity: 0;
    }
    10% {
        opacity: 0.6;
    }
    30% {
        opacity: 1;
    }
    60% {
        opacity: 0.8;
    }
    100% {
        left: 120%;
        opacity: 0;
    }
}

/* 第二条反向流星略慢，增加层次感，但保持顺滑 */
@keyframes meteorSlideReverse {
    0% {
        left: -150%;
        opacity: 0;
    }
    15% {
        opacity: 0.4;
    }
    40% {
        opacity: 0.9;
    }
    70% {
        opacity: 0.5;
    }
    100% {
        left: 140%;
        opacity: 0;
    }
}

/* 悬停时强化背景并轻微提升阴影，保留流星效果继续运行，更炫酷 */
.server-link:hover {
    background: linear-gradient(105deg, #fff7e8 0%, #ffefcf 100%) !important;
    box-shadow: 0 8px 20px rgba(255, 170, 0, 0.3), inset 0 1px 0 #fffef7 !important;
    border-color: #ffcf7a !important;
}

.server-link:hover .enter-badge {
    background: #ffcd7e !important;
    transform: scale(1.02) !important;
    color: #4f2b0c !important;
}

/* 保证流星特效不影响任何文字点击和交互内容 */
.server-link span, .server-link i {
    position: relative;
    z-index: 3;
}

/* 下方“当前在线火爆”字体保持之前调小的样式（0.6rem） */
.server-block .online-status {
    margin-top: 12px;
    font-size: 0.6rem !important;
    text-align: center;
    color: #8a9bb0;
    letter-spacing: 0.3px;
}

.server-block .online-status i {
    font-size: 0.6rem;
}

/* 针对移动端适配：进一步缩小充值链接区域，保持精致 */
@media (max-width: 768px) {
    .server-link {
        padding: 8px 16px !important;
        font-size: 0.95rem !important;
    }
    .server-link .enter-badge {
        padding: 4px 12px !important;
        font-size: 0.8rem !important;
    }
    /* 移动端稍微调整流星动画时长，保证性能平滑 */
    .server-link::before {
        animation: meteorSlide 3.2s infinite ease-in-out;
    }
    .server-link::after {
        animation: meteorSlideReverse 3.8s infinite ease-in-out;
    }
    .server-block .online-status {
        font-size: 0.55rem !important;
        margin-top: 8px;
    }
    .server-block .online-status i {
        font-size: 0.55rem;
    }
}

/* 确保其他卡片元素完全不受影响，不修改任何原有样式 */
.card, .sidebar, .main-content, .promo-grid, .promo-card, .footer, .hero-header, .logo-area, .inline-tag, .back-btn, .ratio-box, .simple-list, .note-items, .daily-card {
    /* 没有任何额外样式覆盖，完全保留原始样式表定义 */
}

/* 为链接内图标增加轻微金色光晕，无额外尺寸改动 */
.server-link i {
    color: #e67e22;
    text-shadow: 0 0 2px rgba(255,200,100,0.5);
}