/* ===== 调整文章区域宽度 ===== */

/* 方案 A：内容区占 3/4 宽度（原 2/4 → 3/4）*/
@media (min-width: 1024px) {
  #dream-single-post-main {
    grid-column: span 3 / span 3 !important;
    max-width: 100% !important;
  }
  
  /* 可选：隐藏左侧空边栏，让内容居中 */
  .lg\:grid-cols-4 > div:first-child {
    display: none !important;
  }
  
  /* 可选：右侧目录固定宽度，避免被挤压 */
  #TableOfContents {
    position: sticky;
    top: 2rem;
    max-width: 240px;
    width: 100%;
  }
}

/* 方案 B：内容区占满中间 2 列，但增加内边距提升可读性 */
@media (min-width: 1024px) {
  #dream-single-post-content {
    max-width: 1000px !important;  /* 最佳阅读宽度 */
    margin: 0 auto !important;     /* 居中 */
  }
}

/* 方案 C：完全自定义网格布局 */
@media (min-width: 1024px) {
  .lg\:grid-cols-4 {
    grid-template-columns: 1fr minmax(600px, 2fr) 240px !important;
    /* 左侧边栏 | 文章内容(最小600px) | 右侧目录 */
  }
}

/* ===== 移动端优化 ===== */
/* 确保移动端内容不被过度拉伸 */
@media (max-width: 1023px) {
  #dream-single-post-content {
    padding: 0 1rem;
  }
}