
        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }

        body {
            margin: 0;
            background-color: #ffffff;
        }

        /* Banner整体容器 */
        .snapshot-container {
            position: relative;
            width: 100%;
            max-width: 1790px;
            min-height: clamp(440px, 30vw, 550px);
            margin: 0 auto;
            padding:
                clamp(40px, 4vw, 70px)
                clamp(24px, 5vw, 100px);
            overflow: hidden;

            display: flex;
            align-items: center;

            color: #ffffff;
            background-color: #0d3882;

            font-family:
                -apple-system,
                BlinkMacSystemFont,
                "Segoe UI",
                Roboto,
                "Helvetica Neue",
                Arial,
                sans-serif;
        }

        /* 动态背景画布 */
        .snapshot-bg-canvas {
            position: absolute;
            inset: 0;
            z-index: 1;

            width: 100%;
            height: 100%;

            pointer-events: none;
        }

        /* 内容区域 */
        .snapshot-content {
            position: relative;
            z-index: 2;

            width: 100%;

            display: grid;
            grid-template-columns:
                minmax(220px, 320px)
                minmax(0, 1fr);
            align-items: start;

            gap: clamp(40px, 5vw, 90px);
        }

        /* 左侧标题 */
        .snapshot-title {
            max-width: 320px;

            font-size: clamp(28px, 2.4vw, 40px);
            font-weight: 500;
            line-height: 1.25;
            letter-spacing: -0.5px;

            text-wrap: balance;
        }

        /* 右侧数据网格 */
        .snapshot-stats-grid {
            width: 100%;
            min-width: 0;

            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));

            column-gap: clamp(40px, 5vw, 100px);
            row-gap: clamp(36px, 4vw, 60px);
        }

        /* 单个数据项 */
        .stat-item {
            width: 100%;
            min-width: 0;

            display: flex;
            flex-direction: column;
            align-items: flex-start;
        }

        /*
         * 右侧数据文字
         * 取消省略号和隐藏设置
         * 宽度不足时自然换行并完整显示
         */
        .stat-number {
            width: 100%;

            margin-bottom: clamp(10px, 1vw, 16px);

            font-size: clamp(38px, 3.7vw, 72px);
            font-weight: 400;
            line-height: 1.08;
            letter-spacing: -1.5px;

            white-space: normal;
            overflow: visible;
            text-overflow: clip;
            overflow-wrap: break-word;
            word-break: normal;

            text-wrap: balance;
        }

        /* 数据描述 */
        .stat-label {
            width: 100%;
            max-width: 420px;

            font-size: clamp(14px, 1.15vw, 21px);
            font-weight: 400;
            line-height: 1.45;

            opacity: 0.9;

            white-space: normal;
            overflow-wrap: break-word;
        }

        /*
         * 平板及中等尺寸屏幕
         * 标题移动至上方，数据继续保持两列
         */
        @media (max-width: 1200px) {
            .snapshot-container {
                min-height: auto;
            }

            .snapshot-content {
                grid-template-columns: 1fr;
                gap: 42px;
            }

            .snapshot-title {
                max-width: 460px;
            }

            .snapshot-stats-grid {
                column-gap: clamp(30px, 6vw, 70px);
            }

            .stat-number {
                font-size: clamp(36px, 5.5vw, 62px);
            }
        }

        /*
         * 移动端
         * 所有数据变成单列排列
         */
        @media (max-width: 768px) {
            .snapshot-container {
                padding: 48px 24px;
            }

            .snapshot-content {
                gap: 38px;
            }

            .snapshot-title {
                max-width: 100%;
                font-size: clamp(28px, 8vw, 38px);
            }

            .snapshot-stats-grid {
                grid-template-columns: 1fr;
                row-gap: 34px;
            }

            .stat-number {
                max-width: 100%;
                font-size: clamp(36px, 10vw, 54px);
                line-height: 1.1;
                letter-spacing: -1px;
            }

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

        /* 超小屏幕 */
        @media (max-width: 420px) {
            .snapshot-container {
                padding: 40px 20px;
            }

            .snapshot-content {
                gap: 32px;
            }

            .snapshot-stats-grid {
                row-gap: 30px;
            }

            .stat-number {
                font-size: clamp(32px, 9.5vw, 44px);
            }
        }

        /* 用户系统关闭动画时停止背景动画 */
        @media (prefers-reduced-motion: reduce) {
            .snapshot-bg-canvas {
                display: none;
            }
        }
    