body {
            /* 1. 背景图片基础设置（路径/重复/位置/固定） */
            background-image: url("../images/底页.jpg"); 
            background-repeat: no-repeat; /* 不重复平铺 */
            background-position: center center; /* 水平+垂直居中 */
            background-attachment: fixed; /* 固定背景，滚动页面不移动 */
            /* 2. 背景图片适配（铺满屏幕且不变形） */
            background-size: cover; 
            /* 3. 容错兜底（图片加载失败时显示深褐色背景） */
            background-color: #0a0808; 
            
            color: #e0d8c0;
            min-height: 100vh;
            position: relative;
            padding: 2rem 2rem; /* 左右留白适配手机 */
        }

        /* 背景叠加半透明黑层，增强诡异感 */
        body::before {
            content: "";
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.75);
            z-index: -1;
        }

        /* ========== 核心：所有内容居中容器 ========== */
        .content-wrapper {
            max-width: 900px; /* 限制最大宽度，避免大屏拉伸 */
            margin: 0 auto; /* 水平居中 */
            text-align: center; /* 内部行内/行块元素居中 */
        }

        /* ========== 字体层级差异化设计（加大大小差异） ========== */
        /* Header（最高级）：超大号+粗体+古铜色+光晕 */
        header {
            font-size: 3.2rem; /* 比之前更大，突出标题 */
            font-weight: 700; /* 粗体 */
            margin-bottom: 4rem;
            color: #d9b38c;
            text-shadow: 0 0 10px #8b4513, 0 0 20px rgba(139, 69, 19, 0.5);
            letter-spacing: 0.3rem;
        }

        /* H1（第二级）：大号+半粗体+浅褐色+下划线 */
        h1 {
            font-size: 2.2rem; /* 层级明显低于header */
            font-weight: 600; /* 半粗体，区别于header的粗体 */
            margin-bottom: 1.8rem;
            color: #c8a67e;
            border-bottom: 2px solid #8b4513;
            padding-bottom: 0.8rem;
            /* 让下划线宽度适配文字，同时居中 */
            display: inline-block; 
        }

        /* 正文P（第三级）：中等大小+常规字重+易读行高 */
        p {
            font-size: 1.2rem; /* 层级低于h1 */
            font-weight: 400; /* 常规字重 */
            line-height: 2; /* 加大行高，提升可读性 */
            margin-bottom: 3rem;
            text-shadow: 0 0 5px #000;
            background: rgba(10, 8, 8, 0.6);
            padding: 1.5rem 2rem;
            border-radius: 6px;
            border-left: 4px solid #8b4513;
            /* 正文恢复左对齐，仅容器居中 */
            text-align: left; 
        }

      

        /* 按钮（第四级）：中大号+半粗体+古铜渐变 */
        .enter-game-btn {
            font-size: 1.3rem; /* 层级低于正文 */
            font-weight: 500; /* 轻粗体，区别于正文 */
            padding: 1.2rem 3rem;
            background: linear-gradient(#5a3918, #3a250f);
            color: #f0e6d2;
            text-decoration: none;
            border-radius: 4px;
            cursor: pointer;
            box-shadow: 0 0 10px #8b4513, inset 0 0 5px rgba(0, 0, 0, 0.8);
            transition: all 0.3s ease;
            display: inline-block; /* 确保居中 */
              display: block; /* 改为块级元素 */
            margin: 0 auto 2rem; /* 左右自动外边距实现居中，保留底部间距 */
            width: fit-content; /* 宽度适配内容，不拉伸 */
        }

        .enter-game-btn:hover {
            background: linear-gradient(#704214, #5a3918);
            box-shadow: 0 0 20px #a0522d, inset 0 0 8px rgba(0, 0, 0, 0.9);
            transform: scale(1.05);
        }

        /* 隐藏音频控件 */
        audio {
            display: none;
        }

        /* 响应式适配（手机端自动调整） */
        @media (max-width: 850px) {
            .video-container {
                width: 100%;
                height: auto; /* 手机端视频高度自适应 */
                aspect-ratio: 16/9; /* 保持16:9比例 */
            }
            header { font-size: 2.5rem; }
            h1 { font-size: 1.8rem; }
            p { font-size: 1rem; }
        }
         footer {
            width: 100%;
            background: #1a1510; /* 深褐色，与body的#0a0808区分 */
            color: #f5e8d0; /* 更浅的泛黄文字，与body的#e0d8c0区分 */
            padding: 2rem 2rem;
            border-top: 2px solid #8b4513; /* 古铜色上边框，强化区分 */
            margin-top: 3rem;
            position: relative;
            bottom: 0;
        }
         .footer-content {
            max-width: 900px;
            margin: 0 auto;
            display: flex;
            align-items: center;
            gap: 2rem; /* 头像和文本之间的间距 */
            justify-content: center; /* 整体居中 */
          }
           .author-avatar {
            width: 80px;       
            height: 80px;     
            object-fit: cover;  /* 关键属性：裁剪图片以适应尺寸，防止图片被压扁或拉伸 */
            border-radius: 50%; 
            border: 2px solid #8b4513; 
            flex-shrink: 0;     /* 防止在窄屏幕下头像被挤压变形 */
        }