/* 通用广告容器样式（左右侧共用） */
        .side-ad {
            position: fixed; /* 核心：固定定位，不随滚动条移动 */
            top: 50%; /* 垂直居中 */
            transform: translateY(-50%); /* 垂直居中修正 */
            width: 160px; /* 广告条宽度，可自定义 */
            height: 576px; /* 广告条高度，可自定义 */
            overflow: hidden; /* 隐藏超出容器的广告内容 */
            z-index: 9999; /* 置顶显示，避免被其他内容遮挡 */
            border-radius: 4px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.2);
        }

        /* 左侧广告条：定位到屏幕最左侧 */
        .ad-left {
            left: 10px;
        }

        /* 右侧广告条：定位到屏幕最右侧 */
        .ad-right {
            right: 10px;
        }

        /* 广告轮播列表 */
        .ad-list {
            width: 100%;
            height: 100%;
        }

        /* 单个广告项 */
        .ad-item {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0; /* 默认隐藏 */
            transition: opacity 2s ease; /* 淡入淡出过渡，更丝滑 */
        }

        /* 广告图片样式（保证填充容器） */
        .ad-item img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* 图片等比填充，不拉伸 */
            cursor: pointer; /* 鼠标悬浮显示手型 */
        }

        /* ========== 核心：自动轮播动画（淡入淡出） ========== */
        /* 左侧广告轮播动画（修改为2个广告，总时长6s，每个显示3s） */
        @keyframes adLeftSlide {
            0%, 45% { opacity: 1; z-index: 10; } /* 第1个广告显示3s */
            50%, 95% { opacity: 0; z-index: 1; } /* 第2个广告显示3s */
            100% { opacity: 0; z-index: 1; }
        }
        .ad-left .ad-item:nth-child(1) { animation: adLeftSlide 6s infinite 0s; }
        .ad-left .ad-item:nth-child(2) { animation: adLeftSlide 6s infinite 3s; }

        /* 右侧广告轮播动画（2个广告，总时长6s，每个显示3s） */
        @keyframes adRightSlide {
            0%, 45% { opacity: 1; z-index: 10; } /* 第1个广告显示 */
            50%, 95% { opacity: 0; z-index: 1; } /* 第2个广告显示 */
            100% { opacity: 0; z-index: 1; }
        }
        .ad-right .ad-item:nth-child(1) { animation: adRightSlide 6s infinite 0s; }
        .ad-right .ad-item:nth-child(2) { animation: adRightSlide 6s infinite 3s; }

        /* 可选：鼠标悬浮暂停轮播 */
        .side-ad:hover .ad-item {
            animation-play-state: paused !important;
        }

        /* 响应式适配：小屏幕隐藏广告（避免遮挡内容） */
        @media (max-width: 768px) {
            .side-ad {
                display: none;
            }
            body {
                padding: 0 20px;
            }
        }