/* =========================================
   CYBER-MAGMA V4: PHOENIX REBIRTH FINAL
   最终优化版：新增无投票数按钮提示 + 完善搜索区样式
   ========================================= */


:root {
    /* 基础熔岩色 */
    --magma-red: #ff3300;
    --magma-orange: #ff8c00;
    --magma-yellow: #ffcc00;
    /* 凤凰专属色（强化重生感） */
    --phoenix-gold: #ffe600;
    --phoenix-red: #ff1a00;
    --phoenix-orange: #ff9900;
    --phoenix-gradient: linear-gradient(135deg, var(--phoenix-red) 0%, var(--phoenix-gold) 100%);
    --phoenix-shadow: 0 0 15px var(--phoenix-red), 0 0 30px var(--phoenix-orange), 0 0 45px var(--phoenix-gold);
    /* 基础深色 */
    --cyber-black: #050505;
    --cyber-dark: #0d0d0d;
    --cyber-border: rgba(255, 51, 0, 0.3);
    /* 科技感高光色 */
    --tech-blue: #00e5ff;
    --tech-purple: #9d00ff;
    --tech-gradient: linear-gradient(90deg, var(--tech-blue), var(--tech-purple));
    --cyber-border: rgba(255, 61, 0, 0.4);
    /* 赛博边框色（熔岩红） */
    /* 字体 */
    --font-display: 'Orbitron', 'Consolas', 'Courier New', monospace;
    --font-main: 'Rajdhani', sans-serif;
}

/* 全局重置 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* 1. 全局底色与背景（台球赛事主题） */
body {
    background-color: var(--cyber-black);
    /* 移除了极其消耗性能的 body background-position 动画和复杂的 5 层渐变层叠 */
    background-image:
        radial-gradient(circle at 50% 10%, rgba(255, 30, 0, 0.25) 0%, transparent 60%),
        linear-gradient(rgba(255, 51, 0, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 51, 0, 0.05) 1px, transparent 1px);
    background-size: 100% 100%, 40px 40px, 40px 40px;
    background-attachment: fixed;
    color: #eee;
    font-family: var(--font-main);
    overflow-x: hidden;
}

.apv-wrap {
    max-width: 1400px;
    margin: 0 auto;
    padding: 20px;
    position: relative;
}

/* 2. 赛事Logo + 标语布局 */
.apv-header-container {
    text-align: center;
    margin-bottom: 20px;
}

.apv-event-logo {
    height: 270px;
    max-width: 85%;
    object-fit: contain;
    filter: drop-shadow(0 0 15px rgba(255, 80, 0, 0.3));
    margin: 0 auto 15px;
    display: block;
}

/* =========================================
   CLEAN COLLAB BRANDING (静态优化版)
   ========================================= */

.apv-collab-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
    /* 增大间距 */
    margin: 30px auto 60px;
    width: 100%;
}

.brand-box {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 电脑版：大幅放大 Logo */
.apv-collab-brand .apv-event-logo {
    height: 300px;
    /* 从 140px 增加到 220px */
    width: auto;
    max-width: 40vw;
    object-fit: contain;
    filter: drop-shadow(0 0 20px rgba(255, 69, 0, 0.5));
}

.collab-divider {
    font-family: 'Orbitron', sans-serif;
    font-size: 48px;
    /* 增大符号尺寸 */
    font-weight: 900;
    color: #ff4500;
    text-shadow: 0 0 15px rgba(255, 69, 0, 0.8);
    line-height: 1;
}

/* 移动端适配：确保不挤压，不换行 */
/* =========================================
   MOBILE HORIZONTAL LAYOUT FIX
   恢复横向排列并优化缩放
   ========================================= */

@media (max-width: 768px) {
    .apv-collab-brand {
        /* 1. 强制恢复为横向 */
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        /* 绝对禁止换行 */
        justify-content: center;
        align-items: center;

        /* 2. 调整整体间距 */
        gap: 6px !important;
        margin: 15px auto 25px !important;
        padding: 0 10px;
        padding-top: 20px;
        width: 100%;
        box-sizing: border-box;
    }

    .apv-collab-brand .brand-box {
        /* 3. 让包装盒根据内容自适应，防止挤压 */
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        min-width: 0;
        /* 防止 Flex 子元素溢出 */
    }

    .apv-collab-brand .apv-event-logo {
        /* 4. 核心：大幅缩小横向排列时的 Logo 高度 */
        height: 160px !important;
        /* 调整为 60px 左右最适合并排 */
        width: auto !important;
        max-width: 40vw !important;
        /* 限制单个 Logo 宽度最大占屏幕 40% */
        object-fit: contain;
        margin: 0 !important;
        /* 清除之前的所有负边距 */
        filter: drop-shadow(0 0 8px rgba(255, 68, 0, 0.3));
        /* 增加一点微弱的凤凰火发光 */
    }

    .collab-divider {
        /* 5. 恢复分割符号的原始状态 */
        font-size: 18px !important;
        /* 缩小 X 的号数 */
        transform: none !important;
        /* 停止旋转 */
        margin: 0 5px !important;
        padding: 0 !important;
        display: flex;
        align-items: center;
        color: var(--magma-red);
        text-shadow: 0 0 10px var(--magma-red);
        flex-shrink: 0;
        /* 确保 X 不会被挤扁 */
    }
}

/* 针对极窄屏幕（如 iPhone SE）进一步优化 */
@media (max-width: 380px) {
    .apv-collab-brand .apv-event-logo {
        height: 50px !important;
        /* 更小屏则进一步缩小高度 */
    }

    .apv-collab-brand {
        gap: 5px !important;
    }
}

.apv-slogan {
    font-family: var(--font-display);
    /* 使用更锐利的熔岩渐变 */
    background: linear-gradient(to right,
            var(--magma-red) 0%,
            var(--magma-yellow) 50%,
            var(--magma-red) 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;

    font-weight: 950;
    font-size: 2.5rem;
    /* 稍微调大一点，更有宣言感 */
    text-align: center;
    display: block;
    margin: 30px 0;
    text-transform: uppercase;

    /* 核心动画：流光 + 呼吸 + 间距扩张 */
    animation:
        slogan-shine 4s linear infinite,
        phoenix-rebirth 3s infinite alternate cubic-bezier(0.45, 0.05, 0.55, 0.95);

    /* 初始发光 */
    text-shadow: 0 0 10px rgba(255, 51, 0, 0.5);
    position: relative;
}

/* 模拟凤凰羽翼煽动和重生的张力 - 优化版：移除 blur 和 filter，只使用 scale 和 opacity */
@keyframes phoenix-rebirth {
    0% {
        opacity: 0.7;
        transform: scale(0.98);
        letter-spacing: 10px;
        text-shadow: 0 0 5px var(--magma-red);
    }

    100% {
        opacity: 1;
        transform: scale(1.02);
        letter-spacing: 14px;
        text-shadow: 0 0 15px var(--magma-red);
    }
}

/* 标语内部的流光效果 */
@keyframes slogan-shine {
    to {
        background-position: 200% center;
    }
}

/* 装饰性侧线：让标语更像一个独立的荣誉徽章 */
.apv-slogan::before,
.apv-slogan::after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 50px;
    height: 2px;
    background: linear-gradient(to right, transparent, var(--magma-red));
    margin: 0 20px;
    box-shadow: 0 0 10px var(--magma-red);
}

.apv-slogan::after {
    background: linear-gradient(to left, transparent, var(--magma-red));
}

/* =========================================
   ULITMATE FIX: SLOGAN B-LETTER CLIPPING
   ========================================= */

/* =========================================
   MOBILE FIX: APV SLOGAN (Crisp + No Blur)
   只修复手机端 slogan：扩容 + 去 blur + 避免规则冲突
   ========================================= */
@media screen and (max-width: 768px) {

    /* Logo区下方间距保留你的逻辑 */
    .apv-collab-brand {
        margin-bottom: 15px !important;
    }

    body .apv-slogan {
        display: block !important;
        text-align: center !important;

        /* ✅ 容器扩容：给字母左右留“安全区”，避免边缘被裁切/发虚 */
        padding: 0 14px !important;
        overflow: visible !important;

        /* ✅ 不要把宽度卡死 200px；用 clamp 更稳 */
        max-width: clamp(260px, 86vw, 420px) !important;
        margin: 0 auto 18px auto !important;

        /* ✅ 字体：大但稳，避免过度缩放造成的抗锯齿抖动 */
        font-size: clamp(22px, 7.2vw, 34px) !important;
        line-height: 1.25 !important;

        /* ✅ 字距：别太夸张，否则更容易糊/挤压 */
        letter-spacing: clamp(4px, 1.6vw, 10px) !important;

        /* ✅ 换行策略：保持你想要的“自然换行”，但避免单词内断裂 */
        white-space: normal !important;
        word-break: keep-all !important;
        overflow-wrap: normal !important;

        /* ✅ 手机端清晰度增强 */
        -webkit-font-smoothing: antialiased;
        text-rendering: geometricPrecision;
        transform: translateZ(0);
        /* 让渲染更稳 */
        will-change: transform;

        /* ✅ 关键：手机端不要用 blur/filter 来做“呼吸”，会直接糊字 */
        filter: none !important;
    }

    /* ✅ 手机端动画：保留 shine + 轻微缩放，但不再改 filter/blur */
    .apv-slogan {
        animation:
            slogan-shine 4s linear infinite,
            phoenix-vertical-breath-crisp 2.6s infinite alternate ease-in-out !important;
    }

    @keyframes phoenix-vertical-breath-crisp {
        0% {
            transform: translateZ(0) scale(0.9);
            opacity: 0.6;
        }

        100% {
            transform: translateZ(0) scale(1.2);
            opacity: 1;
        }
    }

    /* 手机端装饰线隐藏保留你的逻辑 */
    .apv-slogan::before,
    .apv-slogan::after {
        display: none !important;
    }
}



/* 统一限制中间所有内容区域的宽度 */
.apv-rules,
.apv-search-container,
.apv-sharebar,
.apv-results,
.apv-remaining-wrap,
.apv-bonus-wrap,
.apv-grid {
    max-width: 1200px !important;
    /* 电脑端最舒适的宽度 */
    margin-left: auto !important;
    margin-right: auto !important;
    width: 95% !important;
    /* 确保在稍微小一点的屏幕上左右也有点缝隙 */
}

/* 针对 Grid 网格的特殊处理 */
.apv-grid {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* 3. 规则区域 */
.apv-rules {
    margin: 0 0 30px;
    padding: 20px 22px;
    border: 1px solid rgba(255, 80, 0, 0.25);
    background: linear-gradient(90deg, rgba(255, 51, 0, 0.15), rgba(0, 0, 0, 0.6));
    border-left: 4px solid var(--phoenix-red);
    border-radius: 12px;
    color: #eee;
    position: relative;
    overflow: hidden;
}

.apv-rules::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--phoenix-gradient);
    opacity: 0.8;
    animation: rule-fire-line 4s infinite alternate;
}

@keyframes rule-fire-line {
    0% {
        opacity: 0.5;
        width: 50%;
    }

    100% {
        opacity: 1;
        width: 100%;
    }
}

.apv-rules::after {
    position: absolute;
    top: 5px;
    right: 10px;
    font-size: 10px;
    color: var(--phoenix-red);
    opacity: 0.6;
    font-family: var(--font-display);
}

.apv-rules-title {
    font-family: var(--font-display);
    color: var(--phoenix-gold);
    margin-bottom: 12px;
    font-size: 1.2rem;
    letter-spacing: 0.6px;
    font-weight: 800;
}

.apv-rules-list {
    margin: 0;
    padding-left: 20px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.6;
}

.apv-rules-list li {
    margin: 4px 0;
    list-style: none;
    position: relative;
}

.apv-rules-list li::before {
    content: "•";
    position: absolute;
    left: -18px;
    color: var(--phoenix-orange);
    font-size: 1.2rem;
}

/* 4. 搜索区域（核心优化：完善样式 + 同行布局 + 与分享区间隔） */
/* ==============================================
   赛博朋克火山熔岩风 - 搜索筛选区域样式
   核心配色：熔岩红(#ff3d00)、熔岩橙(#ff8a00)、暗紫黑(#0a0508)、金属灰(#221f26)
   视觉元素：熔岩渐变、霓虹发光、金属破损边框、科技感纹理
============================================== */

/* 外层容器 - 熔岩科技感包裹 */
.apv-search-container {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 30px;
    padding: 18px 24px;
    background: linear-gradient(135deg, #0a0508 0%, #1a1018 100%);
    border: 2px solid;
    border-image: linear-gradient(45deg, #ff3d00, #ff8a00, #ff3d00) 1;
    border-radius: 12px;
    box-shadow:
        0 0 25px rgba(255, 61, 0, 0.4),
        /* 熔岩外发光 */
        inset 0 0 15px rgba(0, 0, 0, 0.8),
        /* 内阴影增强质感 */
        0 4px 0 rgba(0, 0, 0, 0.5);
    /* 底部投影模拟金属厚度 */
    position: relative;
    flex-wrap: wrap;
    /* 移动端自适应换行 */
    touch-action: manipulation;
    /* 核心：消除移动端click 300ms延迟 */
}

/* 容器装饰：熔岩裂纹高光 */
.apv-search-container::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    right: 2px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #ff8a00, transparent);
    border-radius: 8px 8px 0 0;
    opacity: 0.9;
    z-index: 1;
}

/* 搜索输入框 - 熔岩科技输入面板 */
.apv-search-input {
    flex: 1;
    min-width: 220px;
    padding: 16px 22px;
    background: linear-gradient(135deg, #221f26 0%, #0a0508 100%);
    border: 1px solid #ff3d00;
    border-radius: 8px;
    color: #fff;
    font-family: 'Consolas', 'Courier New', monospace;
    /* 科技感字体 */
    font-size: 1rem;
    letter-spacing: 0.8px;
    outline: none;
    transition: all 0.3s ease;
    box-shadow:
        inset 0 0 10px rgba(255, 61, 0, 0.2),
        /* 内熔岩光效 */
        0 0 8px rgba(255, 61, 0, 0.1);
    touch-action: auto;
    /* 允许输入框触摸交互 */
}

/* 输入框占位符 - 熔岩半透明样式 */
.apv-search-input::placeholder {
    color: rgba(255, 138, 0, 0.5);
    font-style: italic;
    letter-spacing: 1px;
}

/* 输入框聚焦 - 熔岩爆发光效 */
.apv-search-input:focus {
    border-color: #ff8a00;
    box-shadow:
        inset 0 0 15px rgba(255, 138, 0, 0.3),
        0 0 20px rgba(255, 61, 0, 0.5);
    /* 外发光增强 */
    background: linear-gradient(135deg, #2a252d 0%, #0a0508 100%);
    transform: translateY(-1px);
    /* 轻微上浮，增强交互感 */
}

/* 国家下拉框 - 熔岩科技下拉面板（修复移动端兼容） */
.apv-country-select {
    min-width: 180px;
    padding: 16px 22px;
    padding-right: 50px;
    /* 预留自定义箭头空间 */
    background: linear-gradient(135deg, #221f26 0%, #0a0508 100%);
    border: 1px solid #ff3d00;
    border-radius: 8px;
    color: #fff;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 1rem;
    letter-spacing: 0.8px;
    outline: none;
    cursor: pointer;
    transition: all 0.3s ease;
    /* 修复：兼容移动端下拉框样式 */
    -webkit-appearance: none;
    /* 加webkit前缀，适配iOS */
    -moz-appearance: none;
    appearance: none;
    box-shadow:
        inset 0 0 10px rgba(255, 61, 0, 0.2),
        0 0 8px rgba(255, 61, 0, 0.1);
    /* 自定义熔岩箭头（适配移动端） */
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff8a00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 20px center;
    background-size: 20px;
    touch-action: manipulation;
    /* 允许触摸触发下拉 */
    z-index: 100;
    /* 确保下拉框在最上层 */
    /* 修复：取消overflow:hidden，避免移动端选项截断 */
    overflow: visible;
    line-height: 1.2;
    /* 保证文字垂直居中不被压扁 */
    text-overflow: ellipsis;
    /* 超长国家名省略，不挤压 */
    white-space: nowrap;
    /* 强制单行，避免换行挤压 */
}

/* 下拉框hover - 熔岩升温效果 */
.apv-country-select:hover {
    border-color: #ff8a00;
    box-shadow:
        inset 0 0 15px rgba(255, 138, 0, 0.3),
        0 0 15px rgba(255, 61, 0, 0.4);
    transform: translateY(-1px);
}

/* 下拉框选项修复（适配移动端） */
.apv-country-select option {
    line-height: 1.5;
    padding: 14px 15px !important;
    background: #0a0508 !important;
    /* 熔岩暗黑背景 */
    color: #fff !important;
    border-bottom: 1px solid rgba(255, 61, 0, 0.2) !important;
}

/* 清空按钮 - 熔岩科技按钮 */
.apv-clear-btn {
    min-width: 120px;
    padding: 16px 28px;
    background: linear-gradient(135deg, #ff3d00 0%, #ff8a00 100%);
    border: none;
    border-radius: 8px;
    color: #0a0508;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease-out;
    position: relative;
    overflow: hidden;
    box-shadow:
        0 4px 0 rgba(0, 0, 0, 0.3),
        /* 底部投影 */
        0 0 15px rgba(255, 61, 0, 0.4);
    /* 熔岩外发光 */
    touch-action: manipulation;
    /* 消除移动端点击延迟 */
    -webkit-tap-highlight-color: transparent;
    /* 移除移动端点击高亮 */
}

/* 按钮hover - 熔岩流动光效 */
.apv-clear-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: all 0.6s ease;
}

.apv-clear-btn:hover::before {
    left: 100%;
    /* 光效从左到右流动 */
}

/* 按钮hover/active交互 */
.apv-clear-btn:hover {
    transform: translateY(-2px);
    box-shadow:
        0 6px 0 rgba(0, 0, 0, 0.3),
        0 0 25px rgba(255, 61, 0, 0.6);
}

.apv-clear-btn:active {
    transform: translateY(1px);
    box-shadow:
        0 2px 0 rgba(0, 0, 0, 0.3),
        0 0 15px rgba(255, 61, 0, 0.4);
}

/* 结果计数 - 熔岩科技数字显示 */
.apv-results {
    margin-left: 10px;
    padding: 12px 15px;
    color: #ff8a00;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 1px;
    background: rgba(10, 5, 8, 0.5);
    border: 1px solid rgba(255, 61, 0, 0.3);
    border-radius: 6px;
    box-shadow: inset 0 0 8px rgba(255, 61, 0, 0.2);
}

/* 结果计数数字高亮 */
#apv-result-count {
    color: #fff;
    font-size: 1.1rem;
    text-shadow: 0 0 8px rgba(255, 138, 0, 0.8);
    /* 数字霓虹光效 */
}

/* 移动端适配 - 修复布局+交互（核心修改） */
@media (max-width: 768px) {
    .apv-search-container {
        padding: 15px 20px;
        gap: 12px;
    }

    .apv-search-input {
        min-width: 100%;
        padding: 14px 20px;
    }

    /* 修复：移动端下拉框适配 */
    .apv-country-select {
        min-width: 100%;
        padding: 14px 20px 14px 20px !important;
        padding-right: 45px !important;
        /* 适配移动端箭头空间 */
        background-position: right 15px center !important;
        /* 箭头左移，避免遮挡 */
        font-size: 0.95rem;
        /* 适配移动端字体 */
    }

    .apv-clear-btn {
        min-width: 100%;
        padding: 14px 20px;
        font-size: 0.9rem;
    }

    .apv-results {
        min-width: 100%;
        text-align: center;
        margin-left: 0;
        margin-top: 10px;
        padding: 10px 15px;
    }
}

/* 6. 分享区域 */
.apv-sharebar {
    margin-top: 0;
    /* 间隔由搜索区的margin-bottom控制 */
    padding: 35px !important;
    background: #080808 !important;
    border: 1px solid #222 !important;
    border-top: 4px solid var(--phoenix-red) !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
    align-items: center !important;
    position: relative !important;
    box-shadow: 0 0 15px rgba(255, 51, 0, 0.1) !important;
    border-radius: 12px;
    margin-bottom: 40px;
}

.apv-sharebar::before {
    content: "SHARE_REBIRTH_COMMAND | SPREAD THE FIRE";
    position: absolute;
    top: -14px;
    left: 20px;
    background: var(--phoenix-red);
    color: #000;
    font-size: 10px;
    font-weight: 900;
    padding: 2px 10px;
    font-family: var(--font-display);
    border-radius: 4px;
}

.apv-share-btn {
    background: var(--phoenix-gradient) !important;
    color: #000 !important;
    font-family: var(--font-display) !important;
    font-weight: 900 !important;
    padding: 16px 35px !important;
    border: none !important;
    cursor: pointer !important;
    clip-path: polygon(10% 0, 100% 0, 90% 100%, 0 100%) !important;
    transition: 0.3s !important;
    box-shadow: 0 0 10px rgba(255, 153, 0, 0.3) !important;
    border-radius: 4px;
}

.apv-share-btn:hover {
    background: var(--phoenix-gold) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 0 20px rgba(255, 230, 0, 0.5) !important;
}


/* Copy 按钮样式（默认禁用/启用双状态） */
.apv-copy-btn {
    min-width: 120px;
    padding: 16px 28px;
    border: none;
    border-radius: 8px;
    color: #0a0508;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s ease-out;
    position: relative;
    overflow: hidden;
    box-shadow:
        0 4px 0 rgba(0, 0, 0, 0.3),
        0 0 15px rgba(255, 61, 0, 0.1);
    /* 启用状态 - 熔岩渐变 */
    background: linear-gradient(135deg, #ff3d00 0%, #ff8a00 100%);
}

/* Copy 按钮禁用状态样式 */
.apv-copy-btn:disabled {
    background: linear-gradient(135deg, #444 0%, #222 100%);
    color: #888;
    cursor: not-allowed;
    box-shadow: none;
    opacity: 0.7;
}

/* Share/Copy 按钮 hover 熔岩流光效（启用状态才生效） */
.apv-share-btn::before,
.apv-copy-btn:not(:disabled)::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: all 0.6s ease;
}

.apv-share-btn:hover::before,
.apv-copy-btn:not(:disabled):hover::before {
    left: 100%;
}

/* Share/Copy 按钮 hover/active 交互 */
.apv-share-btn:hover,
.apv-copy-btn:not(:disabled):hover {
    transform: translateY(-2px);
    box-shadow:
        0 6px 0 rgba(0, 0, 0, 0.3),
        0 0 25px rgba(255, 61, 0, 0.6);
}

.apv-share-btn:active,
.apv-copy-btn:not(:disabled):active {
    transform: translateY(1px);
    box-shadow:
        0 2px 0 rgba(0, 0, 0, 0.3),
        0 0 15px rgba(255, 61, 0, 0.4);
}

.apv-share-link {
    flex: 1 !important;
    min-width: 250px !important;
    background: #000 !important;
    border: 1px solid var(--phoenix-orange) !important;
    color: var(--phoenix-orange) !important;
    padding: 15px !important;
    font-family: 'Courier New', monospace !important;
    font-size: 14px !important;
    border-radius: 4px;
    outline: none;
}

/* Share 提示文本样式 */
.apv-share-tip {
    margin-left: 10px;
    padding: 12px 15px;
    color: #ff8a00;
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: 0.9rem;
    letter-spacing: 1px;
    background: rgba(10, 5, 8, 0.5);
    border: 1px solid rgba(255, 61, 0, 0.3);
    border-radius: 6px;
    box-shadow: inset 0 0 8px rgba(255, 61, 0, 0.2);
    flex: 1;
    min-width: 100%;
    margin-top: 10px;
}

/* 移动端适配 Sharebar */
@media (max-width: 768px) {
    .apv-sharebar {
        padding: 15px 20px;
        gap: 12px;
    }

    .apv-share-btn,
    .apv-copy-btn,
    .apv-share-link {
        min-width: 100%;
        padding: 14px 20px;
    }

    .apv-share-tip {
        min-width: 100%;
        margin-left: 0;
        margin-top: 10px;
    }
}


/* ========== 7. 票数主面板（保留你的核心样式，补充布局/文字样式） ========== */
.apv-remaining-wrap,
.apv-bonus-wrap {
    /* 保留你的所有核心样式 */
    background: linear-gradient(135deg, #111 0%, #050505 100%);
    border: 1px solid var(--cyber-border);
    border-left: 5px solid var(--phoenix-red);
    padding: 25px;
    margin-bottom: 15px;
    clip-path: polygon(0 0, 97% 0, 100% 30%, 100% 100%, 3% 100%, 0 70%);
    box-shadow: 0 0 10px rgba(255, 51, 0, 0.1);

    /* 新增：弹性布局，让标签和数字对齐更美观 */
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
    /* 移动端自动换行 */
}

/* 票数标签文字（Remaining Daily Votes/Bonus Votes）- 新增样式 */
/* 票数标签文字 - 精准匹配 */
.apv-vote-label {
    font-family: var(--font-display) !important;
    /* 强制优先级 */
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #ff8a00 !important;
    /* 熔岩橙 */
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    /* 大写 */
}

/* 保留你原有票数数字的核心样式，仅补全!important优先级确保生效 */
#remaining-votes,
#apv-bonus-balance {
    font-family: var(--font-display) !important;
    font-size: 56px !important;
    font-weight: 900 !important;
    background: var(--phoenix-gradient) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    text-shadow: 0 0 25px rgba(255, 230, 0, 0.7) !important;
    animation: main-vote-pulse 1.5s infinite alternate !important;

    /* 新增：数字最小宽度，避免晃动 */
    min-width: 60px;
    text-align: center;
}

/* 保留你原有脉冲动画 */
@keyframes main-vote-pulse {
    0% {
        transform: scale(1);
        text-shadow: 0 0 25px rgba(255, 230, 0, 0.7);
    }

    100% {
        transform: scale(1.08);
        text-shadow: 0 0 35px rgba(255, 230, 0, 0.9), 0 0 50px var(--phoenix-red);
    }
}

/* 注释文字样式（apv-remaining-note）- 新增适配 */
.apv-remaining-note {
    font-family: var(--font-display);
    font-size: 14px;
    color: rgba(255, 138, 0, 0.6);
    /* 半透熔岩橙，不抢戏 */
    font-style: italic;
    letter-spacing: 0.5px;
    margin-left: 10px;
    /* 移动端换行到下方 */
    flex: 1 1 100%;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed rgba(255, 61, 0, 0.2);
}

/* ========== 移动端适配（新增，保证小屏美观） ========== */
@media (max-width: 768px) {

    .apv-remaining-wrap,
    .apv-bonus-wrap {
        padding: 20px 15px;
        clip-path: polygon(0 0, 95% 0, 100% 20%, 100% 100%, 5% 100%, 0 80%);
        /* 适配小屏的多边形 */
    }

    #remaining-votes,
    #apv-bonus-balance {
        font-size: 40px !important;
        /* 小屏缩小数字 */
    }

    .apv-remaining-wrap>span:first-child,
    .apv-bonus-wrap>span:first-child {
        font-size: 16px;
    }
}

/* 8. 选手卡片网格 */
.apv-grid {
    display: -ms-grid !important;
    display: grid !important;
    -ms-grid-columns: (minmax(280px, 1fr))[auto-fill] !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
    gap: 40px !important;
    padding: 20px 0 !important;
    perspective: 1500px !important;
    /* 增强3D透视 */
}

/* 选手卡样式强化 */
.apv-card {
    background: linear-gradient(135deg, var(--cyber-dark), #000);
    border: 2px solid var(--phoenix-red) !important;
    border-radius: 8px;
    position: relative;
    transition: transform 0.2s cubic-bezier(0.2, 0, 0.2, 1), box-shadow 0.2s ease !important;
    display: flex;
    flex-direction: column;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
    overflow: hidden;
    /* 性能优化：隔离布局与喷涂 */
    contain: layout style;
    will-change: transform, box-shadow;
    /* 高级性能：按需渲染 */
    content-visibility: auto;
    contain-intrinsic-size: 300px 550px;
}

/* 选手卡额外装饰边框 */
.apv-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 1px solid rgba(255, 230, 0, 0.2);
    border-radius: 8px;
    pointer-events: none;
    opacity: 0.5;
}

/* 选手卡hover效果强化 - 纯净放大版 */
.apv-card:hover {
    border-color: var(--phoenix-gold) !important;
    transform: translateY(-5px) scale(1.02) !important;
    box-shadow: 0 12px 24px rgba(255, 51, 0, 0.3) !important;
    z-index: 10;
}

.apv-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle at 20% 80%, var(--phoenix-red) 1px, transparent 1px),
        radial-gradient(circle at 80% 90%, var(--phoenix-orange) 1.5px, transparent 1.5px),
        radial-gradient(circle at 50% 70%, var(--phoenix-gold) 1px, transparent 1px),
        radial-gradient(circle at 40% 30%, var(--phoenix-orange) 0.8px, transparent 0.8px),
        radial-gradient(circle at 70% 40%, var(--phoenix-red) 1px, transparent 1px),
        radial-gradient(circle at 10% 95%, var(--phoenix-red) 1.2px, transparent 1.2px),
        radial-gradient(circle at 30% 85%, var(--phoenix-orange) 1px, transparent 1px),
        radial-gradient(circle at 60% 92%, var(--phoenix-gold) 2px, transparent 1.5px),
        radial-gradient(circle at 90% 75%, var(--phoenix-red) 0.8px, transparent 0.8px),
        radial-gradient(circle at 25% 65%, var(--phoenix-orange) 1.3px, transparent 1.3px),
        radial-gradient(circle at 75% 55%, var(--phoenix-gold) 1px, transparent 1px),
        radial-gradient(circle at 45% 45%, var(--phoenix-red) 1.5px, transparent 1.5px),
        radial-gradient(circle at 15% 35%, var(--phoenix-orange) 1px, transparent 1px),
        radial-gradient(circle at 85% 25%, var(--phoenix-gold) 0.8px, transparent 0.8px),
        radial-gradient(circle at 55% 15%, var(--phoenix-red) 1.2px, transparent 1.2px);
    background-size: 100% 100%;
    opacity: 0;
    z-index: 1;
    pointer-events: none;
    transition: 0.3s ease-out;
    /* 更灵敏 */
}

.apv-card:hover::before {
    opacity: 0.9;
    animation: ember-rise 3s infinite linear;
}

@keyframes ember-rise {
    0% {
        opacity: 0.3;
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateY(-20px);
    }
}

/* 9. 选手照片容器 */
.apv-photo-wrapper {
    width: 100%;
    height: 400px;
    overflow: hidden;
    position: relative;
    background: #000;
    border-bottom: 2px solid var(--phoenix-red);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 98%);
}

.apv-photo-wrapper::after {
    content: "";
    position: absolute;
    top: -100%;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(transparent, var(--phoenix-gradient), transparent);
    opacity: 0.6;
    z-index: 2;
    pointer-events: none;
}

.apv-card:hover .apv-photo-wrapper::after {
    animation: scan-line 2s infinite linear;
}

@keyframes scan-line {
    0% {
        transform: translateY(-100%);
        opacity: 0;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        transform: translateY(100%);
        opacity: 0;
    }
}

.apv-photo-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.8s ease-out;
    transform: scale(1.05);
}

/* 移除了极其卡顿的 heat-distort 动画（clip-path + hue-rotate + filter 是性能杀手） */

/* 10. 选手信息 + 票数 */
.apv-info {
    padding: 25px 20px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    z-index: 2;
    background: rgba(0, 0, 0, 0.7);
}

.apv-name {
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 900;
    color: #fff;
    margin-bottom: 15px;
    border-left: 4px solid var(--phoenix-red);
    padding-left: 15px;
    letter-spacing: 1px;
    text-shadow: 0 0 8px var(--phoenix-red);
}

.apv-flag {
    width: 24px !important;
    height: auto !important;
    border: 1px solid #444;
    vertical-align: middle;
    margin-left: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    border-radius: 4px;
}

.apv-votes {
    margin: 15px 0 20px;
    padding: 25px 10px !important;
    background: linear-gradient(135deg, rgba(255, 51, 0, 0.15), rgba(0, 0, 0, 0.5)) !important;
    border-radius: 8px !important;
    text-align: center !important;
    position: relative !important;
    border: 1px solid rgba(255, 51, 0, 0.3) !important;
    box-shadow: 0 0 15px rgba(255, 51, 0, 0.2), inset 0 0 10px rgba(0, 0, 0, 0.5) !important;
}

.apv-votes::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    right: 4px;
    height: 2px;
    background: var(--tech-gradient);
    opacity: 0.7;
    border-radius: 1px;
    animation: vote-line-scan 3s infinite linear;
}

@keyframes vote-line-scan {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

.count-num {
    font-family: var(--font-display) !important;
    font-size: 4.2rem !important;
    background: var(--phoenix-gradient) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-stroke: 0.5px rgba(255, 255, 255, 0.3) !important;
    font-weight: 900 !important;
    text-shadow: 0 0 15px var(--phoenix-gold), 0 0 30px var(--phoenix-red), 0 0 45px var(--phoenix-orange) !important;
    letter-spacing: 2px !important;
    animation: vote-pulse 1.2s infinite alternate !important;
    display: block !important;
    line-height: 1.2 !important;
}

@keyframes vote-pulse {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.05);
    }
}



/* Votes 票数区域 - 微调间距和层级 */
/* Votes 票数区域 - 赛博朋克熔岩风优化 */
.apv-votes {
    font-size: 1.1rem;
    color: var(--magma-orange);
    margin-bottom: 16px;
    font-weight: 800;
    /* 加重字体，增强赛博朋克硬朗感 */
    line-height: 1.2;
    letter-spacing: 0.5px;
    /* 字母间距，赛博朋克标志性特征 */
    text-shadow: 0 0 4px rgba(255, 107, 0, 0.6);
    /* 熔岩橙霓虹辉光，轻量不刺眼 */
}

.apv-votes-label {
    font-size: 0.8em;
    opacity: 0.8;
    /* 提高一点不透明度，增强可读性 */
    margin-left: 4px;
    font-weight: 600;
    letter-spacing: 1px;
    /* 统一赛博朋克字体间距 */
    color: #ff9500;
    /* 熔岩橙偏亮，贴合赛博霓虹 */
}

/* Vote button 赛博朋克熔岩风核心优化 */
.apv-vote-btn {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 100%);
    /* 轻量熔岩暗纹渐变 */
    color: var(--magma-red);
    border: 1px solid var(--magma-red);
    padding: 12px 25px;
    font-size: 16px;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: 800;
    /* 更粗字体，赛博朋克硬朗感 */
    letter-spacing: 1.5px;
    /* 加宽字母间距，赛博标志性 */
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 48px;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    box-shadow: 0 0 8px rgba(220, 0, 0, 0.3);
    /* 基础熔岩红霓虹辉光 */
}

/* 按钮 hover 赛博熔岩霓虹特效 */
.apv-vote-btn:hover:not(.voted):not(.is-disabled) {
    background: linear-gradient(135deg, var(--magma-red) 0%, #990000 100%);
    /* 熔岩红渐变背景 */
    color: #000;
    /* 黑色文字对比，赛博朋克高对比 */
    border-color: #ff3300;
    /* 更亮的熔岩红边框 */
    box-shadow: 0 0 12px var(--magma-red), 0 0 20px rgba(255, 80, 0, 0.5);
    /* 双层霓虹辉光（红+橙） */
    transform: translateY(-1px);
    /* 轻微上浮，增强交互反馈 */
}

/* 点击按压效果 */
.apv-vote-btn:active:not(.voted):not(.is-disabled) {
    transform: translateY(0) scale(0.98);
    /* 取消上浮+轻微缩放，更自然 */
    box-shadow: 0 0 8px var(--magma-red);
    /* 辉光减弱，模拟按压 */
}

/* 已投票/禁用状态 - 赛博废土风 */
.apv-vote-btn.voted,
.apv-vote-btn.is-disabled {
    background: linear-gradient(135deg, #222 0%, #111 100%);
    /* 暗灰渐变，赛博废土感 */
    border-color: #444;
    color: #666;
    cursor: not-allowed;
    box-shadow: none;
    letter-spacing: 1px;
    text-shadow: none;
}

/* 已投票状态 hover 无变化 */
.apv-vote-btn.voted:hover,
.apv-vote-btn.is-disabled:hover {
    background: linear-gradient(135deg, #222 0%, #111 100%);
    color: #666;
    box-shadow: none;
    transform: none;
}

/* 加载中动画（赛博朋克旋转光效） */
.apv-vote-btn .apv-loading {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid var(--magma-red);
    border-top-color: var(--magma-orange);
    /* 熔岩橙顶部，渐变光效 */
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin-left: 8px;
    vertical-align: middle;
    box-shadow: 0 0 6px var(--magma-red);
    /* 加载动画霓虹辉光 */
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}




/* 12. 科技感排名 */
.apv-rank {
    position: absolute;
    top: -15px;
    right: -15px;
    width: 105px !important;
    height: 80px !important;
    background: linear-gradient(135deg, #0a0a0a 0%, #000 100%) !important;
    border: 2px solid var(--tech-blue) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: var(--font-display) !important;
    font-weight: 900 !important;
    font-size: 32px !important;
    background: var(--tech-gradient) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-stroke: 1px var(--tech-blue) !important;
    z-index: 10 !important;
    clip-path: polygon(10% 0, 90% 0, 100% 10%, 100% 90%, 90% 100%, 10% 100%, 0 90%, 0 10%) !important;
    box-shadow: 0 0 15px var(--tech-blue), 0 5px 20px rgba(0, 0, 0, 0.8) !important;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

.apv-rank::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(0, 229, 255, 0.4), transparent);
    z-index: 1;
    animation: rank-scan 2s infinite linear;
}

.apv-rank span {
    position: relative;
    z-index: 2;
    animation: rank-pulse 1.5s infinite alternate;
}

@keyframes rank-pulse {
    0% {
        transform: scale(1);
        text-shadow: 0 0 10px var(--tech-blue);
    }

    100% {
        transform: scale(1.1);
        text-shadow: 0 0 20px var(--tech-blue), 0 0 30px var(--tech-purple);
    }
}

.apv-rank-label {
    position: absolute !important;
    bottom: 8px !important;
    font-size: 9px !important;
    color: var(--tech-blue) !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    z-index: 2 !important;
    text-shadow: 0 0 8px var(--tech-blue) !important;
}

.apv-card:hover .apv-rank {
    transform: rotate(5deg) scale(1.15) !important;
    border-color: var(--tech-purple) !important;
    box-shadow: 0 0 25px var(--tech-purple), 0 0 40px var(--tech-blue), 0 5px 20px rgba(0, 0, 0, 0.8) !important;
}

.apv-card:nth-child(1) .apv-rank {
    border: 3px solid var(--phoenix-gold) !important;
    background: linear-gradient(90deg, var(--tech-blue), var(--phoenix-gold)) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-stroke: 1px var(--phoenix-gold) !important;
    box-shadow: 0 0 20px var(--phoenix-gold), 0 0 30px var(--tech-blue), 0 5px 20px rgba(0, 0, 0, 0.8) !important;
}

.apv-card:nth-child(1) .apv-rank::before {
    background: linear-gradient(90deg, transparent, rgba(255, 230, 0, 0.5), transparent) !important;
    animation: rank-scan 1.5s infinite linear !important;
}

.apv-card:nth-child(1) .apv-rank span {
    animation: top-rank-pulse 1s infinite alternate !important;
}

@keyframes top-rank-pulse {
    0% {
        transform: scale(1);
        text-shadow: 0 0 15px var(--phoenix-gold), 0 0 25px var(--tech-blue);
    }

    100% {
        transform: scale(1.15);
        text-shadow: 0 0 25px var(--phoenix-gold), 0 0 40px var(--tech-blue), 0 0 60px var(--phoenix-red);
    }
}

@keyframes rank-scan {
    0% {
        left: -100%;
    }

    100% {
        left: 100%;
    }
}

.apv-card:nth-child(1) {
    border: 2px solid var(--phoenix-gold) !important;
    box-shadow: var(--phoenix-shadow), 0 0 30px var(--tech-blue), 0 0 50px rgba(0, 0, 0, 0.8) !important;
    background: linear-gradient(135deg, rgba(255, 30, 0, 0.05) 0%, rgba(0, 100, 150, 0.03) 50%, #0d0d0d 100%) !important;
}

.apv-card:nth-child(1)::before {
    opacity: 0.5 !important;
    animation: ember-rise 4s infinite linear !important;
}

.apv-card:nth-child(1):hover {
    transform: scale(1.08) !important;
    box-shadow: var(--phoenix-shadow), 0 0 40px var(--tech-blue), 0 0 60px rgba(0, 0, 0, 0.9) !important;
}

/* 13. 响应式适配 */
@media (max-width: 768px) {
    .apv-grid {
        -ms-grid-columns: 1fr !important;
        grid-template-columns: 1fr !important;
        gap: 25px !important;
        padding: 20px !important;
    }

    .apv-event-logo {
        height: 180px !important;
    }

    .apv-photo-wrapper {
        height: 350px !important;
    }

    .apv-rank {
        width: 70px !important;
        height: 70px !important;
        font-size: 26px !important;
        top: -10px !important;
        right: -10px !important;
    }

    .apv-sharebar {
        flex-direction: column !important;
        padding: 20px !important;
    }

    .count-num {
        font-size: 3.2rem !important;
    }

    #remaining-votes,
    #apv-bonus-balance {
        font-size: 42px !important;
    }

    .apv-vote-btn {
        font-size: 0.9rem !important;
        letter-spacing: 4px !important;
    }

    .apv-search-container {
        gap: 10px;
        padding: 12px 15px;
    }

    .apv-clear-btn,
    .apv-copy-btn {
        padding: 12px 20px;
        font-size: 0.8rem;
    }
}

@media (max-width: 420px) {
    .apv-event-logo {
        height: 180px !important;
    }

    .apv-slogan {
        letter-spacing: 4px !important;
        font-size: 0.9rem !important;
    }

    .count-num {
        font-size: 2.8rem !important;
    }

    #remaining-votes,
    #apv-bonus-balance {
        font-size: 36px !important;
    }

    .apv-rank {
        width: 60px !important;
        height: 60px !important;
        font-size: 22px !important;
    }

    .apv-search-container {
        flex-direction: column;
        align-items: stretch;
    }

    .apv-clear-btn,
    .apv-copy-btn {
        width: 100%;
    }

    /* 移动端调整无投票数提示位置 */
    .apv-vote-btn.no-votes::after {
        top: auto;
        bottom: -40px;
    }

    .apv-vote-btn.no-votes::before {
        top: auto;
        bottom: -10px;
        transform: translateX(-50%) rotate(225deg);
    }
}

/* =========================================
   PHOENIX COUNTDOWN: ENERGY TERMINAL
   ========================================= */

.vote-countdown {
    padding: 25px 40px;
    margin: 40px auto;
    max-width: 800px;
    background: #050505;
    position: relative;
    /* 更加硬核的斜切造型 */
    clip-path: polygon(5% 0, 100% 0, 95% 100%, 0 100%);
    border: 1px solid #222;
    border-left: 6px solid var(--magma-red);
    border-right: 6px solid var(--magma-red);
    text-align: center;
    overflow: hidden;
}

/* 装饰性背景层：模拟雷达或扫描感 */
.vote-countdown::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255, 51, 0, 0.05) 1px, transparent 1px),
        linear-gradient(rgba(255, 51, 0, 0.05) 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: 0.3;
}

/* 顶部流光动画 */
.vote-countdown::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--magma-yellow), transparent);
    animation: terminal-scan 3s infinite;
}

@keyframes terminal-scan {
    0% {
        left: -100%;
    }

    100% {
        left: 200%;
    }
}

/* 倒计时标签：REBIRTH_SEQUENCE */
.vote-countdown .countdown-label {
    display: block;
    font-family: var(--font-display);
    font-size: 14px;
    letter-spacing: 6px;
    color: var(--magma-red);
    margin-bottom: 15px;
    text-transform: uppercase;
    font-weight: 900;
    text-shadow: 0 0 10px rgba(255, 51, 0, 0.5);
}

/* 数字容器逻辑 */
.vote-countdown .countdown-value {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 15px;
}

.unit-group {
    display: flex;
    align-items: baseline;
    background: rgba(255, 51, 0, 0.05);
    padding: 10px 15px;
    border: 1px solid rgba(255, 51, 0, 0.1);
    border-radius: 4px;
}

/* 数字样式：极高清晰度与震撼发光 */
.vote-countdown .days,
.vote-countdown .hours,
.vote-countdown .minutes,
.vote-countdown .seconds {
    font-family: var(--font-display);
    font-size: 42px;
    font-weight: 900;
    color: #fff;
    /* 核心：白色文字 + 多层窄半径发光 = 极高清晰度 */
    text-shadow:
        0 0 5px var(--magma-yellow),
        0 0 15px var(--magma-red);
    line-height: 1;
}

/* 单位样式 (D/H/M/S) */
.unit-group small {
    font-family: var(--font-display);
    font-size: 12px;
    color: var(--magma-red);
    margin-left: 5px;
    font-weight: 700;
}

/* 呼吸波动：只针对容器，不针对文字，防止文字模糊 */
.unit-group {
    animation: container-pulse 2s infinite ease-in-out;
}

@keyframes container-pulse {

    0%,
    100% {
        border-color: rgba(255, 51, 0, 0.1);
        box-shadow: none;
    }

    50% {
        border-color: rgba(255, 51, 0, 0.4);
        box-shadow: 0 0 15px rgba(255, 51, 0, 0.1);
    }
}

/* 状态：已结束 */
.vote-countdown.ended {
    border-color: #333;
    opacity: 0.7;
    filter: grayscale(1);
}

.vote-countdown.ended .countdown-label {
    color: #666;
    text-shadow: none;
}

@media (max-width: 768px) {

    /* 1. 容器调整：缩小内边距，取消固定宽度 */
    .vote-countdown {
        padding: 15px 10px;
        margin: 20px auto;
        max-width: 95%;
        clip-path: none;
        /* 手机端去掉大幅度斜切，防止切掉数字 */
        border-left-width: 4px;
        border-right-width: 4px;
    }

    /* 2. 标签调整：缩小字号和间距 */
    .vote-countdown .countdown-label {
        font-size: 12px;
        letter-spacing: 3px;
        margin-bottom: 12px;
    }

    /* 3. 核心：倒计时值容器 */
    .vote-countdown .countdown-value {
        gap: 5px;
        /* 缩小每个数字组之间的间距 */
        display: flex;
        justify-content: center;
        flex-wrap: nowrap;
        /* 强制不换行，或者视情况选 wrap */
    }

    /* 4. 每个数字单元组（D/H/M/S） */
    .unit-group {
        padding: 6px 4px;
        /* 大幅缩小内边距 */
        flex: 1;
        /* 让四个盒子平分宽度 */
        min-width: 60px;
        /* 设定最小宽度防止挤压变形 */
        display: flex;
        flex-direction: column;
        /* 手机端建议：数字在上，单位在下 */
        align-items: center;
    }

    /* 5. 数字字号缩减 */
    .vote-countdown .days,
    .vote-countdown .hours,
    .vote-countdown .minutes,
    .vote-countdown .seconds {
        font-size: 22px;
        /* 从 42px 降到 22px */
        text-shadow: 0 0 8px var(--magma-red);
        /* 减弱发光范围，更清晰 */
    }

    /* 6. 单位标签调整 (D/H/M/S) */
    .unit-group small {
        margin-left: 0;
        margin-top: 2px;
        font-size: 9px;
        opacity: 0.8;
    }
}

/* 针对超窄屏幕（如 iPhone SE）的极致优化 */
@media (max-width: 360px) {

    .vote-countdown .days,
    .vote-countdown .hours,
    .vote-countdown .minutes,
    .vote-countdown .seconds {
        font-size: 18px;
    }

    .unit-group {
        min-width: 50px;
    }
}


/* =========================================
   HOLOGRAPHIC PRIZE: ENERGY OVERLAY
   极简全息风：移除物理边框，强调光影融合
   ========================================= */

.apv-match-focal {
    text-align: center;
    margin: 5px auto;
    padding: 10px;
    background: transparent;
    /* 完全透明背景，融合主背景 */
    position: relative;
}

/* 1. 顶部全息标签 - 弱化感 */
.match-glitch-text {
    font-family: var(--font-display);
    font-size: 12px;
    letter-spacing: 5px;
    color: var(--magma-red);
    opacity: 0.8;
    margin-bottom: 10px;
    position: relative;
    display: inline-block;
}

/* 2. $5000 核心：全息高亮发光 */
.prize-value {
    font-family: var(--font-display);
    font-size: 4.5rem;
    /* 增大尺寸，形成视觉中心 */
    font-weight: 900;
    color: #fff;
    line-height: 1;
    letter-spacing: -2px;
    /* 核心特效：多层发光模拟凤凰火 */
    text-shadow:
        0 0 10px var(--magma-orange),
        0 0 25px var(--magma-red),
        0 0 50px rgba(255, 51, 0, 0.4);
    animation: focal-vibrate 3s infinite;
}

.currency {
    font-size: 1.5rem;
    margin-left: 10px;
    color: var(--magma-yellow);
    text-shadow: 0 0 10px var(--magma-yellow);
}

/* 3. 对决信息：轻量化横线 */
.match-line-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 15px;
}

.match-title {
    font-family: var(--font-main);
    font-size: 1.4rem;
    font-weight: 700;
    color: #eee;
    letter-spacing: 4px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
}

.side-line {
    width: 80px;
    height: 1px;
    /* 线条两端渐变消失，完美融合背景 */
    background: linear-gradient(to right, transparent, var(--magma-red), transparent);
}

/* 4. 底部动态副标题：扫描感 */
.match-subtitle {
    margin-top: 10px;
    font-family: var(--font-display);
    font-size: 10px;
    color: var(--magma-orange);
    letter-spacing: 8px;
    opacity: 0.6;
    animation: subtitle-blink 4s infinite;
}

/* 动画特效 */
@keyframes focal-vibrate {

    0%,
    100% {
        filter: brightness(1);
    }

    50% {
        filter: brightness(1.2);
    }
}

@keyframes subtitle-blink {

    0%,
    20%,
    40%,
    100% {
        opacity: 0.6;
    }

    10%,
    30% {
        opacity: 0.2;
    }
}

/* =========================================
   MOBILE FIX: PRIZE & MATCH TEXT
   确保 "Winner VS Champion" 始终保持单行
   ========================================= */

@media (max-width: 768px) {

    /* 先新增apv-match-focal的移动端样式（往上移动） */
    .apv-match-focal {
        margin: -30 px auto 30px auto !important;
        /* 原50px auto → 10px auto，大幅上移 */
        padding: 5px !important;
        /* 减少内边距，进一步上移 */
    }

    /* 1. 奖金数字稍微收敛，腾出垂直空间 */
    .prize-value {
        font-size: 2.8rem !important;
        letter-spacing: -1px;
    }

    /* 2. 核心修复：对决文案容器 */
    .match-line-container {
        display: flex;
        flex-direction: row;
        /* 强制水平排列 */
        align-items: center;
        justify-content: center;
        gap: 8px;
        /* 缩小元素间距 */
        width: 100%;
        white-space: nowrap;
        /* 绝对禁止文字换行 */
    }

    /* 3. 调整对决文字大小 */
    .match-title {
        font-size: 0.85rem !important;
        /* 降低字号以适应宽度 */
        letter-spacing: 1px !important;
        /* 缩减字间距 */
        flex-shrink: 0;
        /* 禁止文字被挤压 */
    }

    /* 4. 自动隐藏或极度缩短装饰线 */
    .side-line {
        width: 15px !important;
        /* 线条缩短到几乎只剩一个点缀 */
        opacity: 0.5;
    }
}

/* 针对极窄屏幕（如 iPhone SE）的“保命”策略 */
@media (max-width: 380px) {
    .match-title {
        font-size: 0.75rem !important;
    }

    .side-line {
        display: none;
        /* 屏幕太窄时直接舍弃线条，保文字单行 */
    }
}

/* =========================================
   凤凰浴火重生：时间宣告区
   ========================================= */
.match-time-notice {
    position: relative;
    margin: 25px 0 35px 0;
    /* 增加上下间距，给特效留出空间 */
    text-align: center;
    font-family: var(--font-display);
    display: flex;
    flex-direction: column;
    /* 改为竖向排列，强调层级 */
    align-items: center;
    justify-content: center;
    gap: 5px;
    /* 背景增加一个极微妙的熔岩光晕底座 */
    background: radial-gradient(ellipse at center, rgba(255, 68, 0, 0.2) 0%, transparent 70%);
    padding: 15px 0;
    z-index: 1;
}

/* 核心日期：燃烧的凤凰之心 */
.time-date {
    font-size: 2.2rem;
    /* 极大字号 */
    font-weight: 900;
    letter-spacing: 3px;
    line-height: 1;
    color: #fff;
    /* 核心白热化 */
    position: relative;
    /* 多层级极致发光：模拟核心热能 */
    text-shadow:
        0 0 10px var(--magma-yellow),
        0 0 25px var(--magma-orange),
        0 0 50px var(--magma-red),
        0 0 80px rgba(255, 51, 0, 0.6);
    /* 缓慢的燃烧呼吸动画 */
    animation: phoenix-burn 3s infinite alternate ease-in-out;
}

/* 特效：浴火重生的上升火星 (Ember Rising) */
.time-date::before,
.time-date::after {
    content: '';
    position: absolute;
    left: 50%;
    width: 100%;
    height: 100%;
    pointer-events: none;
    background-repeat: no-repeat;
    mix-blend-mode: screen;
    opacity: 0;
}

/* 第一层火星颗粒 */
.time-date::before {
    top: -20%;
    transform: translateX(-50%);
    background-image:
        radial-gradient(circle, var(--magma-yellow) 1px, transparent 2px),
        radial-gradient(circle, var(--magma-orange) 1.5px, transparent 3px),
        radial-gradient(circle, var(--magma-red) 1px, transparent 2px);
    background-size: 20% 20%, 30% 30%, 15% 15%;
    background-position: 10% 80%, 50% 90%, 80% 85%;
    animation: ember-rise 2.5s infinite linear;
}

/* 第二层火星颗粒（交错动画） */
.time-date::after {
    top: -10%;
    transform: translateX(-50%);
    background-image:
        radial-gradient(circle, var(--magma-yellow) 1.2px, transparent 2px),
        radial-gradient(circle, var(--magma-orange) 1px, transparent 2px);
    background-size: 25% 25%, 35% 35%;
    background-position: 30% 95%, 70% 88%;
    animation: ember-rise 3s infinite linear reverse;
    /* 反向交错 */
}


/* 装饰分隔符（弱化） */
.time-sep {
    display: none;
    /* 在这个酷炫版本中，斜杠显得多余，隐藏掉 */
}

/* 事件说明：余烬文字 */
.time-event {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--magma-orange);
    letter-spacing: 2px;
    text-transform: uppercase;
    opacity: 0.8;
    margin-top: 5px;
    /* 增加一点被上方核心照亮的感觉 */
    text-shadow: 0 0 10px rgba(255, 68, 0, 0.5);
    position: relative;
}

/* 给事件文字加一条细细的底部能量线 */
.time-event::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--magma-red), transparent);
    opacity: 0.6;
}


/* ====================
   动画定义
   ==================== */

/* 核心燃烧呼吸 */
@keyframes phoenix-burn {
    0% {
        filter: brightness(1);
        text-shadow:
            0 0 10px var(--magma-yellow),
            0 0 25px var(--magma-orange),
            0 0 50px var(--magma-red);
        transform: scale(1);
    }

    100% {
        /* 变亮、变大、光晕扩散 */
        filter: brightness(1.2);
        text-shadow:
            0 0 15px #fff,
            0 0 35px var(--magma-yellow),
            0 0 70px var(--magma-orange),
            0 0 100px var(--magma-red);
        transform: scale(1.05);
    }
}

/* 火星上升动画 */
@keyframes ember-rise {
    0% {
        transform: translateX(-50%) translateY(20px) scale(1.5);
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    100% {
        /* 向上飘动并消失 */
        transform: translateX(-50%) translateY(-60px) scale(2);
        opacity: 0;
    }
}


/* =========================================
   移动端优化
   ========================================= */
@media (max-width: 768px) {
    .match-time-notice {
        margin: 20px 0 30px 0;
    }

    .time-date {
        font-size: 1.6rem;
        /* 手机上稍微减小字号，但依然很大 */
        letter-spacing: 1px;
    }

    .time-event {
        font-size: 0.75rem;
        letter-spacing: 1px;
        max-width: 90%;
    }
}

/* =========================================
   CHALLENGE PROTOCOL: INDUSTRIAL DATA PANEL
   保持原有工业设计，适配新的嵌套层级
   ========================================= */

.apv-protocol-section {
    max-width: 900px;
    margin: 40px auto;
    /* 电脑端保持呼吸感 */
    padding: 30px;
    background: rgba(20, 0, 0, 0.9);
    /* 加深背景取代模糊，性能更好 */
    border-left: 3px solid var(--magma-red);
    border-right: 3px solid rgba(255, 69, 0, 0.2);
    position: relative;
    /* backdrop-filter: blur(10px); 移除了极其卡顿的背景模糊 */

    /* 新增：确保在 flex 容器中宽度正常 */
    width: 100%;
    box-sizing: border-box;
}

/* 装饰性角标 - 保持原样 */
.apv-protocol-section::before {
    content: "REBORN | $5000 MATCH";
    position: absolute;
    top: -10px;
    left: 20px;
    background: var(--magma-red);
    color: #000;
    font-size: 10px;
    font-weight: 900;
    padding: 2px 8px;
    font-family: var(--font-display);
}

.protocol-header {
    text-align: center;
    font-family: var(--font-display);
    font-size: 1.2rem;
    color: var(--magma-yellow);
    letter-spacing: 3px;
    margin-bottom: 30px;
    text-shadow: 0 0 10px rgba(255, 204, 0, 0.5);
}

.header-icon {
    font-size: 10px;
    vertical-align: middle;
    margin: 0 15px;
    color: var(--magma-red);
}

.protocol-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
}

.protocol-item {
    position: relative;
    padding-left: 50px;
    padding-top: 10px;
    text-align: left;
    /* 确保文字左对齐 */
}

.item-number {
    position: absolute;
    left: 0;
    top: 0;
    font-family: var(--font-display);
    font-size: 24px;
    font-weight: 900;
    color: rgba(255, 69, 0, 0.3);
    font-style: italic;
}

.protocol-item p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #ccc;
    margin: 0;
}

.protocol-item strong {
    color: var(--magma-orange);
    text-shadow: 0 0 5px rgba(255, 140, 0, 0.3);
}

/* =========================================
   移动端沉浸式优化 (重点微调)
   ========================================= */
@media (max-width: 768px) {
    .apv-protocol-section {
        /* 1. 调整边距：在手机端不再使用负边距，而是自适应宽度 */
        margin: 20px 0;
        padding: 25px 15px;
        /* 适当减小内边距，给文字腾空间 */
        border-left: 2px solid var(--magma-red);
        border-right: none;

        /* 2. 背景渐变保持沉浸感 */
        background: linear-gradient(135deg, rgba(30, 0, 0, 0.8) 0%, rgba(10, 0, 0, 0.9) 100%);
        width: 100% !important;
        left: 0 !important;
    }

    .protocol-grid {
        grid-template-columns: 1fr;
        /* 强制单列 */
        gap: 15px;
        /* 紧凑排版 */
    }

    .protocol-item {
        padding-left: 40px;
        /* 手机端稍微缩进 */
        border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        padding-bottom: 15px;
    }

    .protocol-item:last-child {
        border-bottom: none;
    }

    .protocol-header {
        font-size: 0.9rem;
        /* 标题自适应 */
        text-align: center;
        /* 标题居中更美观 */
        margin-bottom: 20px;
    }

    .item-number {
        font-size: 20px;
        /* 缩小数字尺寸 */
    }
}

/* ================================
   APV Load More - Cyber Magma UI
   ================================ */

.apv-loadmore-wrap {
    width: 100%;
    max-width: 1100px;
    margin: 18px auto 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.apv-load-more-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 220px;
    padding: 14px 18px;
    border-radius: 14px;
    border: 1px solid rgba(255, 80, 20, 0.35);
    background:
        radial-gradient(circle at 20% 0%, rgba(255, 210, 120, 0.18), transparent 55%),
        linear-gradient(135deg, rgba(255, 42, 26, 0.18), rgba(255, 10, 99, 0.10), rgba(0, 0, 0, 0.35));
    color: rgba(255, 255, 255, 0.92);
    font-weight: 800;
    letter-spacing: .6px;
    text-transform: uppercase;
    cursor: pointer;
    user-select: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, filter .18s ease;
    box-shadow:
        0 16px 34px rgba(0, 0, 0, 0.45),
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        inset 0 -12px 26px rgba(255, 42, 26, 0.12);
}

.apv-load-more-btn::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 14px;
    background: linear-gradient(120deg,
            rgba(255, 42, 26, 0.0),
            rgba(255, 42, 26, 0.45),
            rgba(255, 230, 0, 0.25),
            rgba(255, 10, 99, 0.35),
            rgba(0, 0, 0, 0.0));
    opacity: .55;
    filter: blur(10px);
    z-index: -1;
    transition: opacity .18s ease, filter .18s ease;
}

.apv-load-more-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 230, 0, 0.40);
    box-shadow:
        0 18px 40px rgba(0, 0, 0, 0.55),
        0 0 26px rgba(255, 42, 26, 0.18),
        0 0 18px rgba(255, 230, 0, 0.10),
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        inset 0 -12px 26px rgba(255, 42, 26, 0.14);
}

.apv-load-more-btn:hover::before {
    opacity: .80;
    filter: blur(12px);
}

.apv-load-more-btn:active {
    transform: translateY(0px) scale(0.99);
}

.apv-load-more-btn.is-loading {
    cursor: wait;
    filter: saturate(1.08);
}

.apv-load-more-btn.is-loading::after {
    content: "";
    width: 16px;
    height: 16px;
    margin-left: 10px;
    border-radius: 999px;
    border: 2px solid rgba(255, 255, 255, 0.22);
    border-top-color: rgba(255, 230, 0, 0.80);
    border-left-color: rgba(255, 42, 26, 0.70);
    animation: apvSpin 0.9s linear infinite;
}

@keyframes apvSpin {
    to {
        transform: rotate(360deg);
    }
}

.apv-load-more-btn[disabled],
.apv-load-more-btn:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
    box-shadow:
        0 12px 26px rgba(0, 0, 0, 0.45),
        inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.apv-loadmore-tip {
    font-size: 12px;
    letter-spacing: .2px;
    color: rgba(255, 255, 255, 0.75);
    opacity: .9;
    min-height: 16px;
}


/* ===============================
   APV Cyber-Magma Hint (Always On)
   =============================== */

.apv-filter-hint {
    position: relative;
    margin: 12px 0 14px;
    padding: 12px 14px;
    border-radius: 14px;

    /* 深色玻璃底 + 熔岩渐变 */
    background:
        radial-gradient(120% 140% at 0% 0%, rgba(255, 80, 0, 0.22) 0%, rgba(0, 0, 0, 0) 55%),
        radial-gradient(120% 140% at 100% 100%, rgba(255, 0, 120, 0.16) 0%, rgba(0, 0, 0, 0) 55%),
        rgba(10, 8, 12, 0.86);

    border: 1px solid rgba(255, 90, 0, 0.25);
    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.45),
        inset 0 0 0 1px rgba(255, 255, 255, 0.04);

    display: flex;
    gap: 10px;
    align-items: flex-start;

    /* 避免字体导致布局抖动 */
    line-height: 1.35;
    letter-spacing: 0.2px;
}

.apv-filter-hint::before {
    content: "";
    position: absolute;
    inset: -1px;
    border-radius: 14px;

    /* 熔岩边框光晕（不重） */
    background: linear-gradient(135deg,
            rgba(255, 70, 0, 0.55),
            rgba(255, 180, 0, 0.25),
            rgba(255, 0, 120, 0.40));
    opacity: 0.55;
    filter: blur(10px);
    z-index: -1;
}

/* 左侧 TIP 标签 */
.apv-filter-hint__tag {
    flex: 0 0 auto;
    font-family: "Orbitron", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-weight: 800;
    font-size: 12px;
    letter-spacing: 0.9px;

    padding: 6px 10px;
    border-radius: 999px;

    color: rgba(255, 240, 210, 0.95);
    background:
        linear-gradient(135deg, rgba(255, 45, 0, 0.95), rgba(255, 175, 0, 0.85));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow:
        0 10px 20px rgba(255, 60, 0, 0.10),
        inset 0 0 0 1px rgba(0, 0, 0, 0.22);
}

/* 右侧文案 */
.apv-filter-hint__text {
    font-family: "Rajdhani", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.88);
}

/* 文案里的强调（如果你想加 <b> 或 <strong>） */
.apv-filter-hint__text b,
.apv-filter-hint__text strong {
    color: rgba(255, 230, 140, 0.95);
    font-weight: 800;
}

/* 移动端更紧凑 */
@media (max-width: 600px) {
    .apv-filter-hint {
        padding: 11px 12px;
        border-radius: 12px;
        gap: 9px;
    }

    .apv-filter-hint__text {
        font-size: 13px;
    }
}

/* 强调 Load More 关键词（赛博熔岩高亮） */
.apv-highlight {
    display: inline-block;
    padding: 2px 8px;
    margin: 0 2px;
    border-radius: 999px;

    font-weight: 800;
    letter-spacing: 0.4px;

    color: #fff;
    background: linear-gradient(135deg,
            #ff2a00,
            #ff8c00,
            #ffcc00);

    box-shadow:
        0 6px 18px rgba(255, 80, 0, 0.35),
        inset 0 0 0 1px rgba(0, 0, 0, 0.35);

    text-transform: uppercase;
    font-size: 0.95em;
}


/* Load More / heavy DOM append 时，临时关动画与重滤镜，避免卡顿 */
html.apv-loading-all *,
html.apv-loading-all *::before,
html.apv-loading-all *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}

/* 如果你有大量 blur/glow/filter，这条特别关键 */
html.apv-loading-all .apv-card,
html.apv-loading-all .apv-wrap,
html.apv-loading-all .apv-event-header {
    filter: none !important;
    backdrop-filter: none !important;
}