 body {
            font-family: 'Inter', system-ui, sans-serif;
            background-color: #FFF9F5;
        }
        
        /* 导航栏滚动效果 */
        .nav-scrolled {
            background-color: rgba(255, 255, 255, 0.95);
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
        }
        
        /* 平滑滚动 */
        html {
            scroll-behavior: smooth;
        }
        
        /* 列表项hover效果 */
        .list-item-hover {
            transition: all 0.2s ease;
        }
        .list-item-hover:hover {
            color: #FF7D00;
            transform: translateX(5px);
        }
        
        /* 搜索框图标定位优化 */
        .search-icon {
            left: 0.75rem;
            top: 50%;
            transform: translateY(-50%);
        }
        .search-btn {
            right: 0.25rem;
            top: 50%;
            transform: translateY(-50%);
        }
        
        /* 修复平板端导航文字不换行 */
        .nav-item {
            white-space: nowrap; /* 禁止导航文字换行 */
        }
.content {
  line-height: 1.6; /* 基础行高，优化阅读体验 */
  color: #333; /* 基础文本颜色，避免纯黑刺眼 */
}

/* 1. H2 标题样式 */
.content h2 {

  font-weight: 600; /* 中等加粗，避免过粗压迫感 */
  color: #ff7d00; /* 深灰色，比正文深一号 */
  margin: 0.5rem 0.2rem; /* 上下间距，区分段落 */
  padding-bottom: 0.8rem; /* 底部内边距，配合边框 */
  border-bottom: 2px solid #fff2e5; /* 底部浅边框，视觉分隔 */
  line-height: 1.3; /* 标题行高，避免换行拥挤 */
  letter-spacing: -0.02em; /* 轻微字间距，提升精致感 */
}

/* 2. 段落样式 */
.content p {
  margin: 1.2rem 0; /* 段落间距，保证呼吸感 */
  text-indent: 2em; 
  text-align: justify; /* 两端对齐，排版更整齐 */
  word-break: break-word; /* 处理长单词/URL换行 */
}

/* 3. 图片样式（响应式+优雅排版） */
.content img {
  display: block; /* 去除图片默认inline的空隙 */
  max-width: 100%; /* 响应式，不超出容器宽度 */
  height: auto; /* 保持宽高比，避免拉伸变形 */
  margin: 2rem auto; /* 上下间距+水平居中 */
  border-radius: 8px; /* 轻微圆角，提升现代感 */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); /* 浅阴影，增加层次感 */
  object-fit: cover; /* 若图片比例不一致，裁剪居中显示（可选） */
  text-align: center;
}

/* 4. 加粗标签样式（strong/b 统一处理） */
.content strong,
.content b {
  font-weight: 600; /* 中等加粗，比默认bold更舒适 */
  color: #ff7d00; /* 深灰色，突出但不刺眼 */
  /* 可选：添加轻微颜色强调（根据主题调整） */
  /* color: #2563eb; */
}

/* 可选优化：链接样式（若内容有a标签，可补充） */
.content a {
  color: #ff7d00;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color 0.2s ease;
}
.content a:hover {
  color: #ff7d00;
}

/* 标题层级补充 */
.content h1,
.content h3,
.content h4,
.content h5,
.content h6 {
  color: #222;
  font-weight: 600;
  line-height: 1.35;
  margin: 1.4rem 0 0.8rem;
}
.content h1 { font-size: 1.75rem; }
.content h3 { font-size: 1.25rem; color: #ff7d00; }
.content h4 { font-size: 1.1rem; }
.content h5,
.content h6 { font-size: 1rem; color: #555; }

/* 列表 */
.content ul,
.content ol {
  margin: 1rem 0 1.2rem;
  padding-left: 1.6em;
}
.content ul { list-style: disc; }
.content ol { list-style: decimal; }
.content li {
  margin: 0.4rem 0;
  line-height: 1.7;
  word-break: break-word;
}
.content li > ul,
.content li > ol {
  margin: 0.35rem 0 0.5rem;
}

/* 引用 / 分割线 / 代码 */
.content blockquote {
  margin: 1.4rem 0;
  padding: 0.85rem 1rem 0.85rem 1.1rem;
  border-left: 4px solid #ff7d00;
  background: #fff7ef;
  color: #555;
  border-radius: 0 8px 8px 0;
}
.content blockquote p { text-indent: 0; margin: 0.4rem 0; }
.content hr {
  border: 0;
  border-top: 1px solid #f0e4d8;
  margin: 1.8rem 0;
}
.content pre,
.content code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.9em;
}
.content code {
  background: #fff2e5;
  color: #c2410c;
  padding: 0.12em 0.35em;
  border-radius: 4px;
}
.content pre {
  margin: 1.2rem 0;
  padding: 1rem 1.1rem;
  overflow-x: auto;
  background: #2b2b2b;
  color: #f5f5f5;
  border-radius: 8px;
  line-height: 1.55;
}
.content pre code {
  background: transparent;
  color: inherit;
  padding: 0;
}

/* 表格（覆盖 Tailwind preflight 的 border:0） */
.content .table-wrap,
.content .table-responsive {
  width: 100%;
  overflow-x: auto;
  margin: 1.4rem 0;
  -webkit-overflow-scrolling: touch;
}
.content table {
  width: 100%;
  max-width: 100%;
  margin: 1.4rem 0;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 0.95rem;
  line-height: 1.55;
  color: #333;
  background: #fff;
  border: 1px solid #f0e4d8;
  border-radius: 8px;
  overflow: hidden;
  display: table;
  text-indent: 0;
}
.content thead {
  background: #fff2e5;
}
.content th,
.content td {
  border: 1px solid #f0e4d8;
  padding: 0.7rem 0.85rem;
  text-align: left;
  vertical-align: top;
  word-break: break-word;
}
.content th {
  font-weight: 600;
  color: #9a3412;
  background: #fff2e5;
  white-space: nowrap;
}
.content tbody tr:nth-child(even) {
  background: #fffaf5;
}
.content tbody tr:hover {
  background: #fff4e8;
}
.content caption {
  caption-side: top;
  text-align: left;
  font-weight: 600;
  color: #666;
  padding: 0 0 0.6rem;
}

/* 响应式适配：小屏幕优化 */
@media (max-width: 768px) {
  .content {
    padding: 1.5rem 1rem;
  }
  .content h2 {
    font-size: clamp(1.5rem, 4vw, 1.8rem);
    margin: 2rem 0 1rem;
    padding-bottom: 0.6rem;
  }
  .content p {
    font-size: 0.95rem;
    margin: 1rem 0;
  }
  .content img {
    margin: 1.5rem auto;
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
  }
  .content {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .content table {
    width: max-content;
    min-width: 100%;
    font-size: 0.88rem;
  }
  .content th,
  .content td {
    padding: 0.55rem 0.65rem;
  }
}
 
  @layer utilities {
            .content-auto {
                content-visibility: auto;
            }
            .text-shadow {
                text-shadow: 0 2px 4px rgba(0,0,0,0.1);
            }
            .card-hover {
                transition: all 0.3s ease;
            }
            .card-hover:hover {
                transform: translateY(-5px);
                box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
            }
            .search-focus {
                @apply focus:outline-none focus:ring-2 focus:ring-primary/50 focus:border-primary;
            }
            .btn-hover {
                @apply transition-all duration-300 hover:shadow-md;
            }
        }