/* 全局样式 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
}

body {
    background-color: #f5f5f5;
    color: #333;
    line-height: 1.6;
}

.container {
    max-width: 1200px;
    margin: 20px auto;
    padding: 0 15px;
}

/* 科技风背景与全局 - 调整为更明亮的蓝色渐变 */
body.tech-bg {
    background: radial-gradient(ellipse at center, #093d7e 0%, #0d2755 100%);
    min-height: 100vh;
    color: #eaf6ff;
    font-family: 'Microsoft YaHei', 'PingFang SC', Arial, sans-serif;
    letter-spacing: 0.5px;
    position: relative;
}

/* 壮族风格页面顶部底部装饰 - 使用伪元素，增加亮度 */
body.tech-bg::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="500" height="60" viewBox="0 0 500 60"><g fill="none" stroke="%234b9fef" stroke-width="2" opacity="0.3"><path d="M20,15 C30,0 50,0 60,15 C70,30 90,30 100,15 C110,0 130,0 140,15 C150,30 170,30 180,15 C190,0 210,0 220,15 C230,30 250,30 260,15 C270,0 290,0 300,15 C310,30 330,30 340,15 C350,0 370,0 380,15 C390,30 410,30 420,15 C430,0 450,0 460,15 C470,30 490,30 500,15"/><path d="M0,45 C10,30 30,30 40,45 C50,60 70,60 80,45 C90,30 110,30 120,45 C130,60 150,60 160,45 C170,30 190,30 200,45 C210,60 230,60 240,45 C250,30 270,30 280,45 C290,60 310,60 320,45 C330,30 350,30 360,45 C370,60 390,60 400,45 C410,30 430,30 440,45 C450,60 470,60 480,45" /><path d="M5,30 L495,30" stroke-width="1.2" stroke-dasharray="3,8"/></g></svg>');
    background-repeat: repeat-x;
    opacity: 0.7;
    z-index: 999;
    pointer-events: none;
}

body.tech-bg::after {
    content: '';
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="500" height="60" viewBox="0 0 500 60"><g fill="none" stroke="%234b9fef" stroke-width="2" opacity="0.3"><path d="M20,45 C30,60 50,60 60,45 C70,30 90,30 100,45 C110,60 130,60 140,45 C150,30 170,30 180,45 C190,60 210,60 220,45 C230,30 250,30 260,45 C270,60 290,60 300,45 C310,30 330,30 340,45 C350,60 370,60 380,45 C390,30 410,30 420,45 C430,60 450,60 460,45 C470,30 490,30 500,45"/><path d="M0,15 C10,30 30,30 40,15 C50,0 70,0 80,15 C90,30 110,30 120,15 C130,0 150,0 160,15 C170,30 190,30 200,15 C210,0 230,0 240,15 C250,30 270,30 280,15 C290,0 310,0 320,15 C330,30 350,30 360,15 C370,0 390,0 400,15 C410,30 430,30 440,15 C450,0 470,0 480,15" /><path d="M5,30 L495,30" stroke-width="1.2" stroke-dasharray="3,8"/></g></svg>');
    background-repeat: repeat-x;
    transform: rotate(180deg);
    opacity: 0.7;
    z-index: 999;
    pointer-events: none;
}

/* 广西壮族特色暗纹背景 - 增加线条粗细和不透明度 */
.tech-bg-pattern {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="800" height="800" viewBox="0 0 800 800"><defs><pattern id="zhuangPattern" patternUnits="userSpaceOnUse" width="200" height="200"><g fill="none" stroke="%234b9fef" stroke-width="2" opacity="0.35"><path d="M50,0 L50,200 M0,50 L200,50"/><path d="M100,0 L100,200 M0,150 L200,150"/><path d="M150,0 L150,200 M0,100 L200,100"/><path d="M75,25 L125,25 L125,75 L75,75 Z"/><path d="M25,75 L75,75 L75,125 L25,125 Z"/><path d="M125,75 L175,75 L175,125 L125,125 Z"/><path d="M75,125 L125,125 L125,175 L75,175 Z"/><circle cx="50" cy="50" r="15" stroke-width="2.5"/><circle cx="150" cy="50" r="15" stroke-width="2.5"/><circle cx="50" cy="150" r="15" stroke-width="2.5"/><circle cx="150" cy="150" r="15" stroke-width="2.5"/><path d="M25,25 L75,50 L50,75 L25,50 Z" stroke-width="2.5"/><path d="M125,25 L175,50 L150,75 L125,50 Z" stroke-width="2.5"/><path d="M25,125 L75,150 L50,175 L25,150 Z" stroke-width="2.5"/><path d="M125,125 L175,150 L150,175 L125,150 Z" stroke-width="2.5"/></g></pattern></defs><rect width="100%" height="100%" fill="url(%23zhuangPattern)"/></svg>');
    opacity: 0.25;
    z-index: -1;
    pointer-events: none;
    animation: patternPulse 10s ease-in-out infinite, patternRotate 60s linear infinite;
}

/* 添加壮族铜鼓图案 - 增加明显度 */
.tech-bg-pattern::before {
    content: '';
    position: fixed;
    top: 10%;
    right: 5%;
    width: 300px;
    height: 300px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300"><defs><linearGradient id="drum-gradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="%234b9fef" stop-opacity="0.6"/><stop offset="100%" stop-color="%234b9fef" stop-opacity="0.2"/></linearGradient></defs><g fill="none" stroke="url(%23drum-gradient)" stroke-width="2"><circle cx="150" cy="150" r="140"/><circle cx="150" cy="150" r="120"/><circle cx="150" cy="150" r="100"/><circle cx="150" cy="150" r="80"/><circle cx="150" cy="150" r="60"/><path d="M150,10 L150,290 M10,150 L290,150"/><path d="M45,45 L255,255 M45,255 L255,45"/><path d="M30,90 L60,120 L30,150 L60,180 L30,210" stroke-width="2"/><path d="M270,90 L240,120 L270,150 L240,180 L270,210" stroke-width="2"/><path d="M90,30 L120,60 L150,30 L180,60 L210,30" stroke-width="2"/><path d="M90,270 L120,240 L150,270 L180,240 L210,270" stroke-width="2"/><path d="M120,65 L180,65 L180,125 L120,125 Z" stroke-width="1.2"/><path d="M120,175 L180,175 L180,235 L120,235 Z" stroke-width="1.2"/><path d="M65,120 L65,180 L125,180 L125,120 Z" stroke-width="1.2"/><path d="M175,120 L175,180 L235,180 L235,120 Z" stroke-width="1.2"/></g><g fill="none" stroke="%234b9fef" stroke-width="2.5" opacity="0.4"><circle cx="150" cy="40" r="10"/><circle cx="150" cy="260" r="10"/><circle cx="40" cy="150" r="10"/><circle cx="260" cy="150" r="10"/></g></svg>');
    opacity: 0.3;
    z-index: -1;
    pointer-events: none;
    animation: drumPulse 8s ease-in-out infinite, drumRotate 30s linear infinite;
}

/* 添加壮族织锦图案 - 增加明显度 */
.tech-bg-pattern::after {
    content: '';
    position: fixed;
    bottom: 10%;
    left: 5%;
    width: 250px;
    height: 250px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="250" height="250" viewBox="0 0 250 250"><defs><linearGradient id="brocade-gradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="%234b9fef" stop-opacity="0.6"/><stop offset="100%" stop-color="%234b9fef" stop-opacity="0.2"/></linearGradient></defs><g fill="none" stroke="url(%23brocade-gradient)" stroke-width="2"><path d="M25,25 L225,25 L225,225 L25,225 Z"/><path d="M50,50 L200,50 L200,200 L50,200 Z"/><path d="M75,75 L175,75 L175,175 L75,175 Z"/><path d="M100,100 L150,100 L150,150 L100,150 Z"/><path d="M25,25 L50,50 M225,25 L200,50 M25,225 L50,200 M225,225 L200,200"/><path d="M25,125 L50,125 M225,125 L200,125 M125,25 L125,50 M125,225 L125,200"/><path d="M50,125 L75,125 M200,125 L175,125 M125,50 L125,75 M125,200 L125,175"/><path d="M75,125 L100,125 M175,125 L150,125 M125,75 L125,100 M125,175 L125,150"/><path d="M75,75 L50,100 L75,125 L100,100 Z" stroke-width="2.5"/><path d="M175,75 L200,100 L175,125 L150,100 Z" stroke-width="2.5"/><path d="M75,175 L50,150 L75,125 L100,150 Z" stroke-width="2.5"/><path d="M175,175 L200,150 L175,125 L150,150 Z" stroke-width="2.5"/></g></svg>');
    opacity: 0.3;
    z-index: -1;
    pointer-events: none;
    animation: brocadePulse 12s ease-in-out infinite, brocadeRotate 45s linear infinite;
}

/* 添加波浪纹装饰 - 增加明显度和动态效果 */
.tech-bg-waves {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><defs><pattern id="zhuangWave" patternUnits="userSpaceOnUse" width="100" height="100"><path d="M0,25 Q25,0 50,25 T100,25" fill="none" stroke="%234b9fef" stroke-width="2" opacity="0.25"/><path d="M0,50 Q25,25 50,50 T100,50" fill="none" stroke="%234b9fef" stroke-width="2" opacity="0.25"/><path d="M0,75 Q25,50 50,75 T100,75" fill="none" stroke="%234b9fef" stroke-width="2" opacity="0.25"/></pattern></defs><rect width="100%" height="100%" fill="url(%23zhuangWave)"/></svg>');
    opacity: 0.2;
    z-index: -2;
    pointer-events: none;
    animation: waveMove 40s linear infinite, wavePulse 15s ease-in-out infinite;
}

/* 壮族纹样动画 - 增强动画效果 */
@keyframes patternPulse {
    0%, 100% { opacity: 0.25; }
    50% { opacity: 0.35; }
}

@keyframes patternRotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes drumPulse {
    0%, 100% { 
        opacity: 0.3; 
        transform: scale(1);
    }
    50% { 
        opacity: 0.4; 
        transform: scale(1.05);
    }
}

@keyframes drumRotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes brocadePulse {
    0%, 100% { 
        opacity: 0.3; 
        transform: scale(1) rotate(0deg);
    }
    50% { 
        opacity: 0.4; 
        transform: scale(1.05) rotate(5deg);
    }
}

@keyframes brocadeRotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes waveMove {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 400px 400px;
    }
}

@keyframes wavePulse {
    0%, 100% { opacity: 0.2; }
    50% { opacity: 0.3; }
}

/* 科技风格顶部横幅 - 更新为更明亮的样式 */
.tech-banner {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 120px;
    background: linear-gradient(90deg, #00459a 0%, #0069b9 50%, #00459a 100%);
    margin-bottom: 20px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}
@media (max-height: 920px) {
    .tech-banner {
        height: 60px;
    }
    .tech-navbar {
        margin: 0 auto;
    }
    .risk-container {
        padding: 0px;
    }
    .tech-main {
        min-height: calc(100vh - 201px);
    }
}

    /* 添加民族风暗纹背景 */
    .tech-banner-pattern {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300"><defs><pattern id="pattern1" x="0" y="0" width="60" height="60" patternUnits="userSpaceOnUse"><path d="M0,30 L30,0 L60,30 L30,60 Z" fill="none" stroke="%2366b3ff" stroke-width="1.5" opacity="0.4"/></pattern><pattern id="pattern2" x="15" y="15" width="60" height="60" patternUnits="userSpaceOnUse"><path d="M0,30 L30,0 L60,30 L30,60 Z" fill="none" stroke="%2366b3ff" stroke-width="1.5" opacity="0.4"/></pattern><pattern id="pattern3" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><rect x="0" y="0" width="10" height="10" fill="%2366b3ff" opacity="0.15"/><rect x="10" y="10" width="10" height="10" fill="%2366b3ff" opacity="0.15"/></pattern><pattern id="pattern4" x="0" y="0" width="30" height="30" patternUnits="userSpaceOnUse"><circle cx="15" cy="15" r="5" fill="none" stroke="%2366b3ff" stroke-width="1.5" opacity="0.3"/></pattern><pattern id="pattern5" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse"><path d="M20,0 L40,20 L20,40 L0,20 Z" fill="none" stroke="%2366b3ff" stroke-width="1.5" opacity="0.3"/></pattern></defs><rect width="100%" height="100%" fill="url(%23pattern1)"/><rect width="100%" height="100%" fill="url(%23pattern2)"/><rect width="100%" height="100%" fill="url(%23pattern3)"/><rect width="100%" height="100%" fill="url(%23pattern4)"/><rect width="100%" height="100%" fill="url(%23pattern5)"/></svg>');
        opacity: 0.5;
        animation: patternMove 60s linear infinite;
    }

    @keyframes patternMove {
        0% {
            background-position: 0 0;
        }

        100% {
            background-position: 300px 300px;
        }
    }

    .tech-banner::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(to right, rgba(80, 200, 255, 0), rgba(80, 200, 255, 0.9), rgba(80, 200, 255, 0) );
        box-shadow: 0 0 20px rgba(80, 200, 255, 0.9);
    }

    .tech-banner::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent 0%, rgba(80, 200, 255, 0.15) 50%, transparent 100%), linear-gradient(0deg, transparent 0%, rgba(80, 200, 255, 0.15) 50%, transparent 100%);
        background-size: 200% 200%;
        animation: gradientMove 8s linear infinite;
    }

    /* 添加光束扫描效果 - 更亮更明显 */
    .tech-banner-beam {
        position: absolute;
        top: 0;
        left: -100%;
        width: 50%;
        height: 100%;
        background: linear-gradient(90deg, rgba(80, 200, 255, 0) 0%, rgba(80, 200, 255, 0.1) 50%, rgba(80, 200, 255, 0) 100% );
        transform: skewX(-30deg);
        animation: beamScan 8s ease-in-out infinite;
    }

    @keyframes beamScan {
        0%, 100% {
            left: -100%;
            opacity: 0;
        }

        20%, 80% {
            opacity: 1;
        }

        50% {
            left: 100%;
        }
    }

    .banner-center {
        text-align: center;
        position: relative;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding: 0 50px;
    }

    /* 民族风装饰元素 */
    .banner-decorations {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        overflow: hidden;
    }

    .pattern-dot {
        position: absolute;
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: rgba(0, 132, 255, 0.4);
        opacity: 0;
        transform: translate(-50%, -50%);
        animation: dotPulse 4s ease-in-out infinite;
    }

    @keyframes dotPulse {
        0%, 100% {
            opacity: 0;
            transform: translate(-50%, -50%) scale(0.5);
        }

        50% {
            opacity: 0.8;
            transform: translate(-50%, -50%) scale(1.2);
        }
    }

    .pattern-line {
        position: absolute;
        width: 60px;
        height: 1px;
        background: linear-gradient(90deg, rgba(0, 132, 255, 0) 0%, rgba(0, 132, 255, 0.6) 50%, rgba(0, 132, 255, 0) 100% );
        transform-origin: left center;
        opacity: 0;
        animation: lineGrow 5s ease-in-out infinite;
    }

    @keyframes lineGrow {
        0%, 100% {
            opacity: 0;
            transform: scaleX(0);
        }

        50% {
            opacity: 0.8;
            transform: scaleX(1);
        }
    }

.banner-logo-icon {
    height: 6.5vw;
    max-height: 90px;
    min-height: 55px;
    margin-right: 0.5vw;
    filter: drop-shadow(0 0 10px #00eaff) drop-shadow(0 0 20px #00cfff);
    transition: filter 0.3s ease;
}

    .banner-title {
        font-size: 38px;
        font-weight: bold;
        color: #fff;
        text-shadow: 0 0 10px rgba(0, 217, 255, 0.8);
        letter-spacing: 4px;
        position: relative;
        padding: 0 20px;
        animation: titleGlow 3s ease-in-out infinite;
    }

    @keyframes titleGlow {
        0%, 100% {
            text-shadow: 0 0 10px rgba(0, 217, 255, 0.5);
        }

        50% {
            text-shadow: 0 0 20px rgba(0, 217, 255, 0.9), 0 0 30px rgba(0, 132, 255, 0.5);
        }
    }

    .banner-title::before,
    .banner-title::after {
        content: '';
        position: absolute;
        top: 50%;
        width: 100px;
        height: 2px;
        background: linear-gradient(90deg, rgba(0, 217, 255, 0), rgba(0, 217, 255, 0.8), rgba(0, 217, 255, 0) );
    }

    .banner-title::before {
        right: 100%;
    }

    .banner-title::after {
        left: 100%;
    }

    .banner-date {
        position: absolute;
        right: 50px;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(0, 217, 255, 0.1);
        padding: 10px 15px;
        border-radius: 8px;
        border: 1px solid rgba(0, 217, 255, 0.3);
        cursor: pointer;
        transition: all 0.3s ease;
    }

        .banner-date:hover {
            background: rgba(0, 217, 255, 0.2);
            border-color: rgba(0, 217, 255, 0.5);
            box-shadow: 0 0 15px rgba(0, 217, 255, 0.3);
        }

        .banner-date input {
            background: transparent;
            border: none;
            color: rgba(255, 255, 255, 0.8);
            font-size: 14px;
            text-align: center;
            cursor: pointer;
        }

            .banner-date input:focus {
                outline: none;
            }

    @keyframes gradientMove {
        0% {
            background-position: 0% 0%;
        }

        100% {
            background-position: 200% 200%;
        }
    }

    /* 为顶部横幅添加光效元素 */
    .tech-banner::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><defs><linearGradient id="g" x1="0%" y1="0%" x2="100%" y2="0%"><stop offset="0%" stop-color="%23000" stop-opacity="0"/><stop offset="50%" stop-color="%2300d9ff" stop-opacity="0.05"/><stop offset="100%" stop-color="%23000" stop-opacity="0"/></linearGradient></defs><rect width="100%" height="100%" fill="url(%23g)"/></svg>');
        animation: shine 3s infinite linear;
    }

    @keyframes shine {
        0% {
            transform: translateX(-100%);
        }

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

    /* 科技风格导航 */
    .tech-navbar {
        display: flex;
        justify-content: center;
        background: linear-gradient(90deg, rgba(9, 61, 126, 0.5) 0%, rgba(13, 39, 85, 0.5) 100%);
        border-radius: 50px;
        padding: 5px;
        margin: 0 auto 20px;
        max-width: 600px;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3), inset 0 1px 3px rgba(80, 200, 255, 0.3), 0 0 10px rgba(80, 200, 255, 0.1);
        position: relative;
        z-index: 10;
        backdrop-filter: blur(5px);
        border: 1px solid rgba(80, 200, 255, 0.2);
    }

        .tech-navbar::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border-radius: 50px;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="600" height="60" viewBox="0 0 600 60"><defs><pattern id="navPattern" patternUnits="userSpaceOnUse" width="60" height="60"><path d="M30,0 L60,30 L30,60 L0,30 Z" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/><path d="M15,15 L45,15 L45,45 L15,45 Z" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.15"/><circle cx="30" cy="30" r="15" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/></pattern></defs><rect width="100%" height="100%" fill="url(%23navPattern)"/></svg>');
            opacity: 0.6;
            z-index: -1;
        }

    .nav-item {
        color: #e6f4ff;
        text-decoration: none;
        padding: 10px 30px;
        border-radius: 30px;
        font-size: 1rem;
        margin: 0 5px;
        transition: all 0.3s ease;
        position: relative;
        overflow: hidden;
        letter-spacing: 1px;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
        z-index: 1;
        background: transparent;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #techIconContainer canvas {
        background-color: transparent !important;
    }

    .nav-item::before,
    .nav-item::after {
        content: '';
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        transition: all 0.3s ease;
        opacity: 0;
        border-radius: 30px;
    }

    .nav-item::before {
        background: linear-gradient(90deg, rgba(80, 200, 255, 0.2) 0%, rgba(80, 200, 255, 0.1) 100%);
        transform: translateY(-3px);
    }

    .nav-item::after {
        background: rgba(80, 200, 255, 0.05);
    }

    .nav-item:hover,
    .nav-item.active {
        color: #ffffff;
        text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2), 0 0 5px rgba(80, 200, 255, 0.3);
    }

        .nav-item.active::before {
            opacity: 1;
            transform: translateY(0);
        }

        .nav-item.active::after {
            opacity: 1;
        }

    @keyframes fadeIn {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .tech-main {
        min-height: calc(100vh - 286px);
        animation: fadeIn 1s ease-out;
        position: relative;
        z-index: 1;
        margin: auto;
        display: flex;
        align-items: center;
    }

    /* 面板样式 */
    .panel {
        background: linear-gradient(135deg, rgba(9, 61, 126, 0.5) 0%, rgba(13, 39, 85, 0.5) 100%);
        border-radius: 15px;
        padding: 20px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), inset 0 1px 5px rgba(80, 200, 255, 0.2), 0 0 15px rgba(80, 200, 255, 0.1);
        margin-bottom: 20px;
        position: relative;
        overflow: hidden;
        backdrop-filter: blur(5px);
        border: 1px solid rgba(80, 200, 255, 0.15);
        transition: all 0.3s ease;
    }

        .panel:hover {
            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25), inset 0 1px 5px rgba(80, 200, 255, 0.3), 0 0 20px rgba(80, 200, 255, 0.15);
            transform: translateY(-3px);
        }

        .panel::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><defs><pattern id="panelPattern" patternUnits="userSpaceOnUse" width="80" height="80"><path d="M0,0 L80,0 L80,80 L0,80 Z" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.1"/><path d="M20,0 L20,80 M40,0 L40,80 M60,0 L60,80" stroke="%2366b3ff" stroke-width="0.5" opacity="0.1"/><path d="M0,20 L80,20 M0,40 L80,40 M0,60 L80,60" stroke="%2366b3ff" stroke-width="0.5" opacity="0.1"/><circle cx="20" cy="20" r="5" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/><circle cx="60" cy="20" r="5" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/><circle cx="20" cy="60" r="5" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/><circle cx="60" cy="60" r="5" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/></pattern></defs><rect width="100%" height="100%" fill="url(%23panelPattern)"/></svg>');
            opacity: 0.3;
            z-index: -1;
        }

        .panel h3 {
            color: #fff;
            font-size: 1.2rem;
            margin-bottom: 15px;
            font-weight: 600;
            letter-spacing: 1px;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
            padding-bottom: 10px;
            border-bottom: 1px solid rgba(80, 200, 255, 0.2);
            position: relative;
        }

            .panel h3::after {
                content: '';
                position: absolute;
                bottom: -1px;
                left: 0;
                width: 30%;
                height: 2px;
                background: linear-gradient(90deg, rgba(80, 200, 255, 0.8) 0%, rgba(80, 200, 255, 0) 100%);
            }

    /* 历史区块tab */
    .history-tabs {
        display: flex;
        gap: 10px;
        margin-bottom: 18px;
    }

        .history-tabs .tab-btn {
            background: none;
            border: 1.5px solid #00cfff99;
            color: #b0e0ff;
            border-radius: 6px;
            padding: 6px 18px;
            font-size: 15px;
            cursor: pointer;
            transition: background 0.2s, color 0.2s, box-shadow 0.2s;
        }

            .history-tabs .tab-btn.active, .history-tabs .tab-btn:hover {
                background: #00cfff33;
                color: #00cfff;
                box-shadow: 0 0 8px #00cfff99;
            }

    .history-list {
        list-style: none;
        color: #eaf6ff;
        font-size: 16px;
        padding-left: 0;
        margin-top: 0;
    }

        .history-list li {
            margin-bottom: 10px;
            border-left: 3px solid #00cfff99;
            padding-left: 10px;
            line-height: 1.7;
        }

    /* 表格科技风 */
    .news-table, .info-table, .macro-table {
        width: 100%;
        border-collapse: collapse;
        background: transparent;
        color: #eaf6ff;
        font-size: 1vw;
        margin-top: 0;
        min-width: 0;
        max-width: 100vw;
    }

        .news-table th, .info-table th, .macro-table th {
            background: #00cfff22;
            color: #00cfff;
            font-weight: 600;
            padding: 8px 6px;
            border-bottom: 1.5px solid #00cfff55;
            text-align: left;
        }

        .news-table td, .info-table td, .macro-table td {
            padding: 8px 6px;
            border-bottom: 1px solid #1a3a5c;
            color: #eaf6ff;
            background: transparent;
        }

        .news-table tr:last-child td, .info-table tr:last-child td, .macro-table tr:last-child td {
            border-bottom: none;
        }

    /* 3D 柱状图区域 */
    .tech-chart {
        width: 98vw;
        min-width: 220px;
        max-width: 100vw;
        height: 40vw;
        min-height: 220px;
        max-height: 520px;
        margin: 0 auto 40px auto;
        background: rgba(10,26,47,0.7);
        border-radius: 24px;
        box-shadow: 0 0 32px #00cfff33, 0 2px 8px #0008;
        border: 2px solid #00cfff55;
        position: relative;
        z-index: 2;
        animation: fadeIn 1.2s;
    }


    /* 动画 */
    @keyframes fadeIn {
        from {
            opacity: 0;
            transform: translateY(40px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* 响应式 */
    @media (max-width: 1400px) {
        .tech-panels, .policy-params {
            grid-template-columns: 1fr 1fr;
            gap: 2vw;
        }

        .tech-chart, .chart-container {
            width: 98vw;
            min-width: 180px;
            max-width: 100vw;
        }
    }

    @media (max-width: 900px) {
        .tech-panels, .policy-params {
            grid-template-columns: 1fr;
            gap: 2vw;
        }

        .panel, .param-card, .param-card.small-card, .fund-data-card {
            min-width: 0;
            width: 98vw;
            max-width: 100vw;
            min-height: 120px;
        }

        .tech-chart, .chart-container {
            width: 98vw;
            min-width: 120px;
            height: 30vw;
            max-height: 320px;
        }
    }

    @media (max-width: 600px) {
        .banner-title {
            font-size: 1.2rem;
        }

        .nav-item {
            font-size: 0.9rem;
            padding: 0.5vh 1vw;
        }

        .param-card, .param-card.small-card, .fund-data-card {
            min-width: 0;
            width: 98vw;
            max-width: 100vw;
            min-height: 80px;
            height: auto;
        }

            .fund-data-card .row-flex {
                gap: 1vw;
            }

                .fund-data-card .row-flex span {
                    font-size: 0.9rem;
                    padding: 0.5vw 0 0.4vw 0;
                }
    }

    /* 旧样式保留，兼容其它页面 */
    /* 头部样式 */
    header {
        background-color: #fff;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
        padding: 15px 30px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .logo {
        font-size: 20px;
        font-weight: bold;
        color: #2196F3;
    }

    nav ul {
        display: flex;
        list-style: none;
    }

        nav ul li {
            margin-left: 30px;
        }

            nav ul li a {
                text-decoration: none;
                color: #555;
                padding: 5px 10px;
                border-radius: 4px;
                transition: all 0.3s ease;
            }

                nav ul li a:hover {
                    background-color: #f0f0f0;
                }

                nav ul li a.active {
                    color: #2196F3;
                    font-weight: bold;
                    border-bottom: 2px solid #2196F3;
                }

    /* 页脚样式 */
    footer {
        text-align: center;
        padding: 20px;
        margin-top: 40px;
        background-color: #fff;
        box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.05);
    }

    /* 图表容器样式 */
    .chart-container {
        background: linear-gradient(135deg, rgba(9, 61, 126, 0.4) 0%, rgba(13, 39, 85, 0.4) 100%);
        border-radius: 15px;
        padding: 20px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), inset 0 1px 5px rgba(80, 200, 255, 0.2), 0 0 15px rgba(80, 200, 255, 0.1);
        margin-bottom: 20px;
        position: relative;
        overflow: hidden;
        backdrop-filter: blur(3px);
        border: 1px solid rgba(80, 200, 255, 0.15);
        height: 400px;
        min-width: 0;
    }

        .chart-container::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><defs><pattern id="gridPattern" patternUnits="userSpaceOnUse" width="40" height="40"><path d="M40,0 L0,0 L0,40" fill="none" stroke="%2366b3ff" stroke-width="0.5" opacity="0.1"/></pattern></defs><rect width="100%" height="100%" fill="url(%23gridPattern)"/></svg>');
            opacity: 0.2;
            z-index: -1;
            pointer-events: none;
        }

        .chart-container::after {
            content: '';
            position: absolute;
            top: 10px;
            left: 10px;
            width: calc(100% - 20px);
            height: calc(100% - 20px);
            border: 1px dashed rgba(0, 217, 255, 0.15);
            border-radius: 6px;
            pointer-events: none;
            z-index: 1;
        }

    .chart-header {
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
    }

    .legend {
        display: flex;
    }

    .legend-item {
        display: flex;
        align-items: center;
        margin-right: 20px;
    }

    .dot {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        margin-right: 6px;
    }

    .blue {
        background-color: #4285f4;
    }

    .green {
        background-color: #34a853;
    }

    .time-period {
        display: flex;
        gap: 20px;
        align-items: center;
    }

    .time-selector {
        position: relative;
        background: linear-gradient(145deg, rgba(0, 217, 255, 0.05) 0%, rgba(0, 217, 255, 0.1) 100%);
        border: 1px solid rgba(0, 217, 255, 0.3);
        border-radius: 8px;
        padding: 8px 15px;
        cursor: pointer;
        transition: all 0.3s ease;
        min-width: 180px;
        backdrop-filter: blur(5px);
    }

        .time-selector::before {
            content: '';
            position: absolute;
            top: -1px;
            left: -1px;
            right: -1px;
            bottom: -1px;
            background: linear-gradient(45deg, rgba(0, 217, 255, 0.5), transparent, rgba(0, 217, 255, 0.5));
            border-radius: 8px;
            z-index: -1;
            opacity: 0;
            transition: opacity 0.3s ease;
        }

        .time-selector:hover::before {
            opacity: 1;
        }

        .time-selector:hover {
            background: linear-gradient(145deg, rgba(0, 217, 255, 0.1) 0%, rgba(0, 217, 255, 0.2) 100%);
            box-shadow: 0 0 20px rgba(0, 217, 255, 0.2), inset 0 0 10px rgba(0, 217, 255, 0.1);
            transform: translateY(-1px);
        }

        .time-selector select {
            background: transparent;
            border: none;
            color: #eaf6ff;
            font-size: 14px;
            width: 100%;
            cursor: pointer;
            outline: none;
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            padding-right: 25px;
        }

            .time-selector select option {
                background: #0a1a2f;
                color: #eaf6ff;
                padding: 10px;
                font-size: 14px;
                border-bottom: 1px solid rgba(0, 217, 255, 0.1);
            }

                .time-selector select option:hover {
                    background: rgba(0, 217, 255, 0.2);
                }

        .time-selector::after {
            content: '';
            position: absolute;
            right: 12px;
            top: 50%;
            transform: translateY(-50%);
            width: 10px;
            height: 10px;
            border-right: 2px solid rgba(0, 217, 255, 0.8);
            border-bottom: 2px solid rgba(0, 217, 255, 0.8);
            transform: translateY(-70%) rotate(45deg);
            transition: all 0.3s ease;
        }

        .time-selector:hover::after {
            border-color: rgba(0, 217, 255, 1);
            box-shadow: 0 0 5px rgba(0, 217, 255, 0.5);
        }

        /* 下拉列表滚动样式 */
        .time-selector select::-webkit-scrollbar {
            width: 6px;
        }

        .time-selector select::-webkit-scrollbar-track {
            background: rgba(0, 217, 255, 0.05);
            border-radius: 3px;
        }

        .time-selector select::-webkit-scrollbar-thumb {
            background: rgba(0, 217, 255, 0.3);
            border-radius: 3px;
            transition: all 0.3s ease;
        }

            .time-selector select::-webkit-scrollbar-thumb:hover {
                background: rgba(0, 217, 255, 0.5);
            }

    /* 下拉面板样式 */
    .select-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: linear-gradient(145deg, rgba(10, 26, 47, 0.95) 0%, rgba(10, 26, 47, 0.98) 100%);
        border: 1px solid rgba(0, 217, 255, 0.3);
        border-radius: 8px;
        margin-top: 5px;
        max-height: 200px;
        overflow-y: auto;
        z-index: 1000;
        backdrop-filter: blur(10px);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3), 0 0 20px rgba(0, 217, 255, 0.2);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-10px);
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .time-selector.active .select-dropdown {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .chart-header-flex {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 20px;
        padding: 15px 20px;
        background: rgba(0, 217, 255, 0.05);
        border: 1px solid rgba(0, 217, 255, 0.2);
        border-radius: 8px;
        backdrop-filter: blur(10px);
    }

    .panel-chart {
        background: linear-gradient(135deg, rgba(10, 26, 47, 0.9) 0%, rgba(10, 26, 47, 0.8) 100%);
        border: 1px solid rgba(0, 217, 255, 0.3);
        border-radius: 12px;
        padding: 20px;
        box-shadow: 0 0 30px rgba(0, 217, 255, 0.1);
        backdrop-filter: blur(10px);
    }

    .legend {
        display: flex;
        gap: 20px;
        align-items: center;
    }

    .legend-item {
        display: flex;
        align-items: center;
        color: #eaf6ff;
        font-size: 14px;
    }

    .dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        margin-right: 8px;
        box-shadow: 0 0 10px rgba(0, 217, 255, 0.5);
    }

        .dot.blue {
            background: #00cfff;
        }

        .dot.green {
            background: #34a853;
        }

    .chart-tabs {
        display: flex;
        gap: 10px;
        margin: 20px 0;
        padding: 0 10px;
    }

    .tab-btn {
        /*background: linear-gradient(135deg, rgba(9, 61, 126, 0.4) 0%, rgba(13, 39, 85, 0.4) 100%);*/
        color: #e6f4ff;
        background-color: transparent;
        border: none;
        padding: 10px 20px;
        margin: 0 5px 10px 0;
        font-size: 0.9rem;
        cursor: pointer;
        transition: all 0.3s ease;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
        position: relative;
        overflow: hidden;
        outline: none;
    }

        .tab-btn:hover,
        .tab-btn.active {
            border: 1px solid rgba(80, 200, 255, 0.2);
            border-radius: 8px;
            background: linear-gradient(135deg, rgba(9, 80, 156, 0.6) 0%, rgba(13, 50, 105, 0.6) 100%);
            color: #ffffff;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2), 0 0 5px rgba(80, 200, 255, 0.5), inset 0 1px 3px rgba(80, 200, 255, 0.3);
            transform: translateY(-2px);
            border-color: rgba(80, 200, 255, 0.5);
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), inset 0 1px 2px rgba(80, 200, 255, 0.1);
        }

        .tab-btn::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="50" viewBox="0 0 100 50"><defs><pattern id="btnPattern" patternUnits="userSpaceOnUse" width="20" height="20"><circle cx="10" cy="10" r="2" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/></pattern></defs><rect width="100%" height="100%" fill="url(%23btnPattern)"/></svg>');
            opacity: 0.3;
            z-index: -1;
            transition: opacity 0.3s ease;
        }

        .tab-btn:hover::before,
        .tab-btn.active::before {
            opacity: 0.5;
        }

    .data-info {
        margin-top: 20px;
        padding: 20px;
        background: linear-gradient(135deg, rgba(9, 61, 126, 0.5) 0%, rgba(13, 39, 85, 0.5) 100%);
        border-radius: 15px;
        padding: 20px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2), inset 0 1px 5px rgba(80, 200, 255, 0.2), 0 0 15px rgba(80, 200, 255, 0.1);
        margin-bottom: 20px;
        position: relative;
        overflow: hidden;
        backdrop-filter: blur(3px);
        border: 1px solid rgba(80, 200, 255, 0.15);
        transition: all 0.3s ease;
        width: 100%;
        max-width: 100vw;
        min-width: 0;
        box-sizing: border-box;
    }

        .data-info:hover {
            box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25), inset 0 1px 5px rgba(80, 200, 255, 0.3), 0 0 20px rgba(80, 200, 255, 0.15);
            transform: translateY(-3px);
        }

        .data-info h3 {
            color: #fff;
            font-size: 1.2rem;
            margin-bottom: 15px;
            font-weight: 600;
            letter-spacing: 1px;
            text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
            padding-bottom: 10px;
            border-bottom: 1px solid rgba(80, 200, 255, 0.2);
            position: relative;
        }

            .data-info h3::after {
                content: '';
                position: absolute;
                bottom: -1px;
                left: 0;
                width: 30%;
                height: 2px;
                background: linear-gradient(90deg, rgba(80, 200, 255, 0.8) 0%, rgba(80, 200, 255, 0) 100%);
            }

.info-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

        .info-flex span {
            background: rgba(80, 200, 255, 0.1);
            padding: 8px 15px;
            border-radius: 8px;
            font-size: 0.9rem;
            color: #e6f4ff;
            border: 1px solid rgba(80, 200, 255, 0.2);
            display: inline-block;
            box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
        }

            .info-flex span:hover {
                background: rgba(80, 200, 255, 0.2);
                transform: translateY(-2px);
                box-shadow: 0 5px 12px rgba(0, 0, 0, 0.2);
            }

    /* 风险预测页面样式 */
    .risk-container {
        /*padding: 20px;*/
        width: 100%;
        max-width: 1400px;
        margin: 0 auto;
        position: relative;
        width: 100vw;
        min-width: 0;
        padding: 1vw 1vw;
        box-sizing: border-box;
    }

    .risk-flex {
        display: flex;
        gap: 20px;
        margin-bottom: 20px;
    }

    .panel-riskleft, .panel-riskright {
        flex: 1;
        background: linear-gradient(145deg, rgba(21, 48, 85, 0.9) 0%, rgba(27, 61, 105, 0.8) 100%);
        border: 1px solid rgba(0, 198, 255, 0.3);
        box-shadow: 0 0 20px rgba(0, 198, 255, 0.1);
        padding: 20px;
        border-radius: 8px;
        backdrop-filter: blur(10px);
        position: relative;
        overflow: hidden;
        width: 100%;
        max-width: 100vw;
        min-width: 0;
        box-sizing: border-box;
    }

        .panel-riskleft::before, .panel-riskright::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            height: 2px;
            background: linear-gradient(to right, rgba(0, 217, 255, 0), rgba(0, 217, 255, 0.6), rgba(0, 217, 255, 0));
        }

    .risk-header-card {
        background: rgba(24, 55, 98, 0.5);
        border-radius: 8px;
        padding: 20px;
        margin-bottom: 20px;
    }

    .risk-level-display {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        margin: 15px 0;
        flex-wrap: wrap;
        gap: 20px;
    }

    .risk-level {
        font-size: 24px;
        color: #00c6ff;
        text-shadow: 0 0 10px rgba(0, 198, 255, 0.5);
    }

    .risk-score {
        color: #fff;
        font-size: 16px;
    }

    .risk-trend {
        display: flex;
        align-items: center;
        gap: 10px;
        color: #ff4757;
    }

    .trend-arrow {
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
    }

        .trend-arrow.up {
            border-bottom: 10px solid #ff4757;
        }

        .trend-arrow.down {
            border-top: 10px solid #2ed573;
        }

    .indicators-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-top: 15px;
    }

    .indicator-item {
        background: rgba(24, 55, 98, 0.5);
        border-radius: 6px;
        padding: 15px;
        border: 1px solid rgba(0, 198, 255, 0.2);
    }

    .indicator-name {
        color: #fff;
        margin-bottom: 8px;
    }

    .indicator-value {
        font-size: 20px;
        margin-bottom: 5px;
    }

        .indicator-value.warning {
            color: #ffa502;
        }

        .indicator-value.danger {
            color: #ff4757;
        }

        .indicator-value.normal {
            color: #2ed573;
        }

    .indicator-status {
        font-size: 12px;
        padding: 2px 8px;
        border-radius: 10px;
        display: inline-block;
        background: rgba(0, 0, 0, 0.2);
    }

    .chart-controls {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin: 15px 0;
    }

    .tech-btn {
        background: rgba(0, 198, 255, 0.1);
        border: 1px solid rgba(0, 198, 255, 0.3);
        color: #fff;
        padding: 8px 15px;
        border-radius: 4px;
        cursor: pointer;
        transition: all 0.3s ease;
    }

        .tech-btn:hover, .tech-btn.active {
            background: rgba(0, 198, 255, 0.2);
            border-color: rgba(0, 198, 255, 0.5);
            box-shadow: 0 0 15px rgba(0, 198, 255, 0.3);
        }

    .risk-details {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin-top: 15px;
    }

    .detail-item {
        background: rgba(6, 30, 78, 0.5);
        border-radius: 6px;
        padding: 15px;
    }

    .detail-label {
        color: rgba(255, 255, 255, 0.6);
        font-size: 14px;
        display: block;
        margin-bottom: 5px;
    }

    .detail-value {
        color: #fff;
        font-size: 16px;
    }

    @media (max-width: 1024px) {
        .risk-flex {
            flex-direction: column;
        }

        .indicators-grid {
            grid-template-columns: 1fr;
        }

        .risk-details {
            grid-template-columns: 1fr;
        }
    }

    /* 确保导航栏样式统一 */
    .top-nav {
        background: #0a1a2f;
        padding: 15px 0;
        text-align: center;
        border-bottom: 1px solid #00cfff;
    }

        .top-nav a {
            color: #b0e0ff;
            text-decoration: none;
            padding: 8px 20px;
            margin: 0 10px;
            border-radius: 5px;
            transition: all 0.3s ease;
        }

            .top-nav a:hover,
            .top-nav a.active {
                background: #00cfff;
                color: #0a1a2f;
            }

    /* 政策参数页面新样式 */
    .tech-background {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        overflow: hidden;
        width: 100vw !important;
        height: 100vh !important;
        min-width: 0;
        min-height: 0;
        max-width: 100vw;
        max-height: 100vh;
    }

    .tech-grid {
        position: absolute;
        width: 200%;
        height: 200%;
        background-image: linear-gradient(rgba(0, 207, 255, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 207, 255, 0.1) 1px, transparent 1px);
        background-size: 50px 50px;
        transform: rotate(-45deg);
        animation: gridMove 20s linear infinite;
    }

    .tech-particles {
        position: absolute;
        width: 100%;
        height: 100%;
        background: radial-gradient(circle at center, rgba(0,207,255,0.1) 0%, transparent 70%);
        animation: particlesPulse 4s ease-in-out infinite;
    }

    @keyframes gridMove {
        0% {
            transform: rotate(-45deg) translateY(0);
        }

        100% {
            transform: rotate(-45deg) translateY(-50px);
        }
    }

    @keyframes particlesPulse {
        0%, 100% {
            opacity: 0.3;
            transform: scale(1);
        }

        50% {
            opacity: 0.6;
            transform: scale(1.1);
        }
    }

    .policy-container {
        max-width: 1400px;
        margin: 0px auto;
        padding: 20px;
        position: relative;
        width: 100vw;
        min-width: 0;
        padding: 0vw 1vw;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-content: center;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: center;
    }

    .policy-title {
        text-align: center;
        margin-bottom: 60px;
        position: relative;
    }

        .policy-title h2 {
            color: #00cfff;
            font-size: 2.2vw;
            min-font-size: 1.2rem;
            max-font-size: 2.2rem;
            margin: 0;
            text-shadow: 0 0 20px rgba(0, 207, 255, 0.5);
        }

    .title-decoration {
        position: absolute;
        left: 50%;
        bottom: -15px;
        transform: translateX(-50%);
        width: 8vw;
        min-width: 60px;
        max-width: 180px;
        height: 0.3vw;
        min-height: 2px;
        max-height: 6px;
    }

    .policy-params {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 60px;
        margin-top: 40px;
        max-width: 900px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        flex-wrap: wrap;
        gap: 4vw;
        max-width: 100vw;
        min-width: 0;
        width: 100%;
    }

    .param-card {
        position: relative;
        width: 40vw;
        min-width: 220px;
        max-width: 420px;
        height: 28vw;
        min-height: 180px;
        max-height: 320px;
        background: linear-gradient(145deg, rgba(35,81,138,0.85), rgba(26,64,112,0.85));
        border-radius: 40px;
        overflow: hidden;
        transition: transform 0.3s ease;
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 198, 255, 0.15);
    }

        /* 壮族花纹装饰背景 */
        .param-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><g fill="none" stroke="%233978ad" stroke-width="1" opacity="0.08"><path d="M80,80 L120,80 L120,120 L80,120 Z M80,280 L120,280 L120,320 L80,320 Z M280,80 L320,80 L320,120 L280,120 Z M280,280 L320,280 L320,320 L280,320 Z"/><path d="M80,80 L120,120 M80,120 L120,80 M80,280 L120,320 M80,320 L120,280 M280,80 L320,120 M280,120 L320,80 M280,280 L320,320 M280,320 L320,280"/><path d="M160,40 L240,40 L240,80 L160,80 Z M160,320 L240,320 L240,360 L160,360 Z M40,160 L80,160 L80,240 L40,240 Z M320,160 L360,160 L360,240 L320,240 Z"/><path d="M180,180 L220,180 L220,220 L180,220 Z"/><path d="M0,200 L400,200 M200,0 L200,400" stroke-dasharray="5,5" opacity="0.06"/><circle cx="200" cy="200" r="140" stroke-width="0.5" opacity="0.06"/><circle cx="200" cy="200" r="100" stroke-width="0.5" opacity="0.06"/><circle cx="200" cy="200" r="60" stroke-width="0.5" opacity="0.06"/></g></svg>');
            opacity: 0.3;
            z-index: 1;
            pointer-events: none;
        }

    .param-glow {
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: radial-gradient(circle at center, rgba(0,207,255,0.2) 0%, transparent 70%);
        animation: glowRotate 10s linear infinite;
        opacity: 0.6;
    }

    .param-content {
        position: relative;
        width: 100%;
        height: 100%;
        padding: 30px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background: rgba(35,81,138,0.60);
        border-radius: 40px;
        overflow: hidden;
        z-index: 2;
    }

    .param-icon {
        width: 60px;
        height: 60px;
        margin-bottom: 20px;
    }

    .icon-calculator, .icon-money {
        width: 100%;
        height: 100%;
        fill: #00cfff;
        filter: drop-shadow(0 0 8px rgba(0, 207, 255, 0.5));
    }

    .param-title {
        color: #b0e0ff;
        font-size: 20px;
        margin-bottom: 20px;
        text-align: center;
    }

    .param-value {
        color: #00cfff;
        font-size: 48px;
        font-weight: bold;
        text-shadow: 0 0 20px rgba(0, 207, 255, 0.5);
        display: flex;
        align-items: baseline;
    }

        .param-value span {
            font-size: 24px;
            margin-left: 8px;
        }

    .param-border {
        position: absolute;
        inset: 0;
        border: 2px solid transparent;
        border-radius: 20px;
        background: linear-gradient(145deg, rgba(0,207,255,0.4), transparent) border-box;
        -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: destination-out;
        mask-composite: exclude;
        z-index: 3;
    }

    @keyframes glowRotate {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    .param-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.3), 0 0 30px rgba(0, 198, 255, 0.25);
    }

        .param-card:hover .param-glow {
            animation: glowRotate 5s linear infinite;
            opacity: 0.8;
        }

    /* 响应式调整 */
    @media (max-width: 768px) {
        .policy-params {
            flex-direction: column;
            gap: 30px;
        }

        .param-card {
            width: 100%;
            max-width: 320px;
        }
    }

    /* 选择器动画效果 */
    .time-selector.selected::after {
        transform: translateY(-70%) rotate(225deg);
    }

    .time-selector.selected {
        animation: selectPulse 0.5s ease;
    }

    @keyframes selectPulse {
        0% {
            box-shadow: 0 0 20px rgba(0, 217, 255, 0.2);
        }

        50% {
            box-shadow: 0 0 30px rgba(0, 217, 255, 0.4);
        }

        100% {
            box-shadow: 0 0 20px rgba(0, 217, 255, 0.2);
        }
    }

    /* 下拉选项悬停效果 */
    .time-selector select option:hover {
        background: linear-gradient(90deg, rgba(0, 217, 255, 0.2), rgba(0, 217, 255, 0.1));
    }

    /* 选择器激活状态 */
    .time-selector.active {
        background: linear-gradient(145deg, rgba(0, 217, 255, 0.15) 0%, rgba(0, 217, 255, 0.25) 100%);
        border-color: rgba(0, 217, 255, 0.5);
        box-shadow: 0 0 25px rgba(0, 217, 255, 0.3);
    }

        .time-selector.active::after {
            transform: translateY(-30%) rotate(225deg);
        }

    /* 滚动条动画 */
    @keyframes scrollGlow {
        0% {
            background: rgba(0, 217, 255, 0.3);
        }

        50% {
            background: rgba(0, 217, 255, 0.5);
        }

        100% {
            background: rgba(0, 217, 255, 0.3);
        }
    }

    .time-selector select::-webkit-scrollbar-thumb {
        animation: scrollGlow 2s infinite;
    }

    .content-wrapper {
        min-width: calc(100vw - 100px);
        margin: 0 auto;
        /*padding: 20px;*/
        position: relative;
        z-index: 1;
    }

    @media (max-width: 720px) {
        .content-wrapper {
            min-width: calc(100vw);
        }
    }

    @media (min-width: 1500px) {
        .content-wrapper {
            min-width: calc(100vw - 300px);
        }
    }

    .chart-control-panel {
        background: linear-gradient(135deg, rgba(9, 61, 126, 0.4) 0%, rgba(13, 39, 85, 0.4) 100%);
        border-radius: 15px;
        padding: 15px;
        margin-bottom: 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2), inset 0 1px 3px rgba(80, 200, 255, 0.2);
        border: 1px solid rgba(80, 200, 255, 0.15);
        position: relative;
        overflow: hidden;
    }

        .chart-control-panel::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="100" viewBox="0 0 300 100"><defs><pattern id="controlPattern" patternUnits="userSpaceOnUse" width="50" height="50"><path d="M0,25 L50,25 M25,0 L25,50" stroke="%2366b3ff" stroke-width="0.5" opacity="0.15"/><circle cx="25" cy="25" r="3" fill="none" stroke="%2366b3ff" stroke-width="0.5" opacity="0.2"/></pattern></defs><rect width="100%" height="100%" fill="url(%23controlPattern)"/></svg>');
            opacity: 0.2;
            z-index: -1;
        }

    /* 图例样式 */
    .legend-section {
        display: flex;
        align-items: center;
        gap: 15px;
    }

    .legend-item {
        display: flex;
        align-items: center;
        margin-right: 15px;
        font-size: 0.9rem;
        color: #e6f4ff;
    }

    .dot {
        width: 12px;
        height: 12px;
        border-radius: 50%;
        margin-right: 6px;
        display: inline-block;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    }

        .dot.blue {
            background: #4b9fef;
            box-shadow: 0 0 8px rgba(75, 159, 239, 0.5);
        }

        .dot.green {
            background: #49d6a5;
            box-shadow: 0 0 8px rgba(73, 214, 165, 0.5);
        }

    /* 时间选择器样式 */
    .time-selector {
        position: relative;
        margin-right: 10px;
        z-index: 10;
    }

        .time-selector select {
            background: rgba(9, 61, 126, 0.6);
            color: #e6f4ff;
            border: 1px solid rgba(80, 200, 255, 0.3);
            padding: 8px 28px 8px 12px;
            border-radius: 8px;
            font-size: 0.9rem;
            appearance: none;
            -webkit-appearance: none;
            cursor: pointer;
            outline: none;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
            transition: all 0.3s ease;
        }

            .time-selector select:hover {
                background: rgba(13, 80, 156, 0.7);
                border-color: rgba(80, 200, 255, 0.5);
                box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15), 0 0 5px rgba(80, 200, 255, 0.3);
            }

        .time-selector::after {
            content: '';
            position: absolute;
            top: 50%;
            right: 10px;
            transform: translateY(-50%);
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 6px solid rgba(80, 200, 255, 0.7);
            pointer-events: none;
            transition: all 0.3s ease;
        }

        .time-selector:hover::after {
            border-top-color: rgba(80, 200, 255, 1);
        }

    @keyframes waveMove {
        0% {
            background-position: 0 0;
        }

        100% {
            background-position: 400px 400px;
        }
    }

    /* 壮族铜鼓图案装饰 */
    .tech-main::before {
        content: '';
        position: fixed;
        top: 20%;
        right: 5%;
        width: 300px;
        height: 300px;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" viewBox="0 0 300 300"><g fill="none" stroke="%233978ad" stroke-width="1" opacity="0.06"><circle cx="150" cy="150" r="140"/><circle cx="150" cy="150" r="120"/><circle cx="150" cy="150" r="100"/><circle cx="150" cy="150" r="80"/><circle cx="150" cy="150" r="60"/><path d="M150,10 L150,290 M10,150 L290,150"/><path d="M45,45 L255,255 M45,255 L255,45"/><path d="M30,90 L60,120 L30,150 L60,180 L30,210" stroke-width="2"/><path d="M270,90 L240,120 L270,150 L240,180 L270,210" stroke-width="2"/><path d="M90,30 L120,60 L150,30 L180,60 L210,30" stroke-width="2"/><path d="M90,270 L120,240 L150,270 L180,240 L210,270" stroke-width="2"/><path d="M120,65 L180,65 L180,125 L120,125 Z" stroke-width="1.2"/><path d="M120,175 L180,175 L180,235 L120,235 Z" stroke-width="1.2"/><path d="M65,120 L65,180 L125,180 L125,120 Z" stroke-width="1.2"/><path d="M175,120 L175,180 L235,180 L235,120 Z" stroke-width="1.2"/></g></svg>');
        opacity: 0.15;
        z-index: -3;
        pointer-events: none;
    }

    .tech-main::after {
        content: '';
        position: fixed;
        bottom: 10%;
        left: 5%;
        width: 200px;
        height: 200px;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200" viewBox="0 0 200 200"><g fill="none" stroke="%233978ad" stroke-width="1" opacity="0.06"><path d="M20,20 L180,20 L180,180 L20,180 Z"/><path d="M50,50 L150,50 L150,150 L50,150 Z"/><path d="M20,20 L50,50 M180,20 L150,50 M20,180 L50,150 M180,180 L150,150"/><path d="M85,20 L115,20 M85,180 L115,180 M20,85 L20,115 M180,85 L180,115"/><path d="M50,85 L50,115 M150,85 L150,115 M85,50 L115,50 M85,150 L115,150"/><path d="M85,85 L115,85 L115,115 L85,115 Z"/><circle cx="100" cy="100" r="30" /></g></svg>');
        opacity: 0.15;
        z-index: -3;
        pointer-events: none;
    }

    /* 壮族花纹角落装饰 */
    .content-wrapper::before,
    .content-wrapper::after,
    .risk-container::before,
    .risk-container::after,
    .policy-container::before,
    .policy-container::after {
        content: '';
        position: absolute;
        width: 60px;
        height: 60px;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 60 60"><g fill="none" stroke="%233978ad" stroke-width="1" opacity="0.15"><path d="M0,15 L15,0 M0,30 L30,0 M0,45 L45,0 M0,60 L60,0 M15,60 L60,15 M30,60 L60,30 M45,60 L60,45"/><path d="M0,0 L15,15 L0,30 M60,30 L45,45 L60,60"/><circle cx="30" cy="30" r="15" stroke-dasharray="3,3"/><path d="M20,10 L40,10 L40,25 L20,25 Z" stroke-width="0.5"/><path d="M10,35 L25,35 L25,50 L10,50 Z" stroke-width="0.5"/><path d="M35,35 L50,35 L50,50 L35,50 Z" stroke-width="0.5"/></g></svg>');
        background-repeat: no-repeat;
        pointer-events: none;
        z-index: -1;
    }

    .content-wrapper::before,
    .risk-container::before,
    .policy-container::before {
        top: 0;
        left: 0;
    }

    .content-wrapper::after,
    .risk-container::after,
    .policy-container::after {
        bottom: 0;
        right: 0;
        transform: rotate(180deg);
    }

    /* 页脚样式 */
    .tech-footer {
        background: linear-gradient(90deg, rgba(9, 61, 126, 0.8) 0%, rgba(13, 39, 85, 0.8) 100%);
        color: #e6f4ff;
        text-align: center;
        padding: 20px;
        font-size: 0.9rem;
        letter-spacing: 1px;
        position: relative;
        overflow: hidden;
        border-top: 1px solid rgba(80, 200, 255, 0.2);
        width: 100vw;
        min-width: 0;
        max-width: 100vw;
        margin: auto auto 0px auto
    }

        .tech-footer::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="80" viewBox="0 0 400 80"><defs><pattern id="footerPattern" patternUnits="userSpaceOnUse" width="100" height="80"><path d="M0,40 Q25,20 50,40 T100,40" fill="none" stroke="%2366b3ff" stroke-width="1" opacity="0.2"/></pattern></defs><rect width="100%" height="100%" fill="url(%23footerPattern)"/></svg>');
            opacity: 0.3;
            z-index: -1;
            pointer-events: none;
        }

    /* 中央按钮样式 */
    .center-tabs {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 20px auto 30px;
        background: rgba(10, 40, 80, 0.5);
        padding: 15px 20px;
        border-radius: 15px;
        box-shadow: 0 0 20px rgba(0, 200, 255, 0.3);
        position: relative;
        z-index: 5;
        max-width: 800px;
    }

        .center-tabs::before {
            content: '';
            position: absolute;
            top: -2px;
            left: -2px;
            right: -2px;
            bottom: -2px;
            background: linear-gradient(45deg, #00aaff, transparent, #00aaff, transparent, #00aaff);
            border-radius: 16px;
            z-index: -1;
            animation: borderGlow 8s linear infinite;
        }

    @keyframes borderGlow {
        0%, 100% {
            opacity: 0.5;
        }

        50% {
            opacity: 1;
        }
    }

    .center-tabs .tab-btn {
        margin: 0 10px;
        font-size: 16px;
        padding: 10px 18px;
        transition: all 0.3s ease;
    }

        .center-tabs .tab-btn:hover,
        .center-tabs .tab-btn.active {
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(0, 200, 255, 0.5);
        }

    /* 现有的chart-tabs样式保持不变 */
    .card-glow-track {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 4;
    }

    .glow-dot {
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background: radial-gradient(circle, #00eaff 60%, rgba(0,234,255,0.15) 100%);
        box-shadow: 0 0 16px 6px #00eaffcc, 0 0 32px 12px #00eaff44;
        filter: blur(0.5px);
        position: absolute;
        left: 0;
        top: 0;
        z-index: 5;
        transition: box-shadow 0.2s;
    }

    @keyframes glowDotMove {
        0% {
            left: 0%;
            top: 0%;
        }

        12.5% {
            left: 100%;
            top: 0%;
        }

        25% {
            left: 100%;
            top: 0%;
        }

        37.5% {
            left: 100%;
            top: 100%;
        }

        50% {
            left: 100%;
            top: 100%;
        }

        62.5% {
            left: 0%;
            top: 100%;
        }

        75% {
            left: 0%;
            top: 100%;
        }

        87.5% {
            left: 0%;
            top: 0%;
        }

        100% {
            left: 0%;
            top: 0%;
        }
    }

    .glow-dot {
        transition: box-shadow 0.2s;
    }

    .param-card {
        position: relative;
        overflow: visible;
    }

        .param-card.small-card {
            width: 420px;
            height: 220px;
            border-radius: 32px;
            margin: 0;
            box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18), 0 0 20px rgba(0, 198, 255, 0.18);
            background: linear-gradient(145deg, rgba(35,81,138,0.85), rgba(26,64,112,0.85));
            position: relative;
        }

            .param-card.small-card .param-content {
                padding: 24px 0 0 0;
            }

            .param-card.small-card .param-icon {
                width: 48px;
                height: 48px;
                margin-bottom: 12px;
            }

            .param-card.small-card .param-title {
                font-size: 1.18rem;
                margin-bottom: 12px;
            }

            .param-card.small-card .param-value {
                font-size: 2.2rem;
            }

                .param-card.small-card .param-value span {
                    font-size: 1.1rem;
                    margin-left: 4px;
                }

            .param-card.small-card::before {
                content: '';
                position: absolute;
                inset: 0;
                border-radius: 32px;
                padding: 2px;
                background: linear-gradient(120deg, #00eaff, #00cfff 40%, #00eaff 80%, transparent 100%);
                -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                -webkit-mask-composite: xor;
                mask-composite: exclude;
                z-index: 2;
                pointer-events: none;
                animation: fundCardGlow 3s linear infinite;
                opacity: 0.85;
            }

    .fund-data-card {
        background: linear-gradient(145deg, rgba(35,81,138,0.85), rgba(26,64,112,0.85));
        border-radius: 32px;
        box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18), 0 0 20px rgba(0, 198, 255, 0.18);
        border: none;
        margin: 0 auto 20px auto;
        margin-top: 18px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        position: relative;
        max-width: 930px;
        min-width: 600px;
        min-height: 340px;
        height: 340px;
    }

        .fund-data-card::before {
            content: '';
            position: absolute;
            inset: 0;
            border-radius: 32px;
            padding: 2px;
            background: linear-gradient(120deg, #00eaff, #00cfff 40%, #00eaff 80%, transparent 100%);
            -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            -webkit-mask-composite: xor;
            mask-composite: exclude;
            z-index: 2;
            pointer-events: none;
            animation: fundCardGlow 3s linear infinite;
            opacity: 0.85;
        }

        .fund-data-card .row-flex span {
            background: linear-gradient(145deg, rgba(35,81,138,0.85), rgba(26,64,112,0.85));
            border: none;
            border-radius: 18px;
            box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18), 0 0 20px rgba(0, 198, 255, 0.18);
            position: relative;
            z-index: 1;
        }

            .fund-data-card .row-flex span::before {
                content: '';
                position: absolute;
                inset: 0;
                border-radius: 18px;
                padding: 2px;
                background: linear-gradient(120deg, #00eaff, #00cfff 40%, #00eaff 80%, transparent 100%);
                -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
                -webkit-mask-composite: xor;
                mask-composite: exclude;
                z-index: 2;
                pointer-events: none;
                animation: fundCardGlow 3s linear infinite;
                opacity: 0.85;
            }

    .fund-data-card-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 100%;
        padding-top: 32px;
    }

    .fund-data-header {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 18px;
    }

        .fund-data-header .fund-date {
            margin-top: 8px;
            font-size: 1.22rem;
            font-weight: 600;
            color: #00eaff;
        }

    .fund-data-card .row-flex {
        display: flex;
        justify-content: center;
        align-items: stretch;
        gap: 48px;
        margin-top: 32px;
        width: 100%;
    }

        .fund-data-card .row-flex span {
            flex: 1 1 0;
            min-width: 0;
            max-width: 260px;
            font-size: 1.38rem;
            padding: 22px 0 16px 0;
            margin: 0 8px;
            text-align: center;
        }

    @media (max-width: 900px) {
        .fund-data-card-content {
            padding-top: 12px;
        }

        .fund-data-card .row-flex {
            gap: 16px;
            margin-top: 16px;
        }

            .fund-data-card .row-flex span {
                font-size: 1em;
                padding: 10px 0 8px 0;
                max-width: 100%;
            }
    }

    .fund-data-header h3 {
        font-size: 2.2rem;
        font-weight: 800;
        letter-spacing: 2px;
        color: #fff;
        margin-bottom: 8px;
        position: relative;
        text-shadow: 0 2px 16px #00eaff99, 0 0 8px #00cfff55;
    }

        .fund-data-header h3::after {
            content: '';
            display: block;
            margin: 16px auto 0 auto;
            width: 120px;
            height: 6px;
            border-radius: 3px;
            background: linear-gradient(90deg, #00eaff 0%, #00cfff 60%, transparent 100%);
            box-shadow: 0 0 24px #00eaff99, 0 0 32px #00cfff55;
            opacity: 0.95;
            animation: splitLineGlow 2.2s linear infinite alternate;
        }

    @keyframes splitLineGlow {
        0% {
            filter: brightness(1) blur(0.5px);
            opacity: 0.7;
        }

        100% {
            filter: brightness(1.5) blur(2.5px);
            opacity: 1;
        }
    }

    .fund-data-header .fund-date {
        font-size: 1.38rem;
        font-weight: 700;
        color: #00eaff;
        text-shadow: 0 1px 8px #00eaff99;
    }

    .fund-data-card .row-flex span {
        font-size: 1.08rem;
        padding: 16px 0 10px 0;
    }

        .fund-data-card .row-flex span b {
            font-size: 1.32em;
            color: #00eaff;
            font-weight: 800;
            letter-spacing: 1px;
            display: inline-block;
            animation: valueGlow 1.2s infinite alternate;
        }

    @keyframes valueGlow {
        0% {
            text-shadow: 0 0 8px #00eaff99, 0 0 2px #00cfff55;
        }

        100% {
            text-shadow: 0 0 18px #00eaff, 0 0 8px #00cfff;
            color: #fff;
        }
    }

    /* 新增大卡片走马灯高光圆点动画 */
    .fund-data-card .card-glow-track {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 3;
        overflow: hidden; /* 防止圆点溢出边框 */
        border-radius: 32px; /* 与大卡片圆角一致 */
    }

        .fund-data-card .card-glow-track .glow-dot {
            width: 24px; /* 调整圆点大小 */
            height: 24px; /* 调整圆点大小 */
            border-radius: 50%;
            background: radial-gradient(circle, #00eaff 60%, rgba(0,234,255,0.15) 100%);
            box-shadow: 0 0 20px 8px #00eaffcc, 0 0 40px 15px #00eaff44; /* 调整光影效果 */
            filter: blur(0.8px); /* 调整模糊 */
            position: absolute;
            left: 0;
            top: 0;
            z-index: 5;
            /* animation: glowDotMove 5s linear infinite; /* 调整动画速度 */ */
        }
    /* glowDotMove keyframes已存在 */