/* ====== 上下按钮改进版 ====== */
.UDAside #up,
.UDAside #down {
  position: fixed;
  right: 20px;
  z-index: 999; /* 保证在最上层 */
  text-align: center;
  width: 44px;
  height: 44px;
  line-height: 44px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
  backdrop-filter: blur(5px); /* 毛玻璃质感 */
}
/* 向上按钮 */
.UDAside #up {
  bottom: 90px;
  background: linear-gradient(135deg, rgba(230, 165, 250, 0.6), rgba(180, 80, 255, 0.6));
  color: white;
}

.UDAside #up:hover {
  background: linear-gradient(135deg, rgb(160, 2, 252), rgb(110, 0, 190));
  transform: translateY(-3px) scale(1.05); /* 悬停轻微弹起 */
}
/* 向下按钮 */
.UDAside #down {
  bottom: 25px;
  background: linear-gradient(135deg, rgba(129, 192, 242, 0.6), rgba(45, 150, 233, 0.6));
  color: white;
}

.UDAside #down:hover {
  background: linear-gradient(135deg, rgb(45, 150, 233), rgb(0, 100, 180));
  transform: translateY(3px) scale(1.05); /* 悬停轻微下移 */
}
/* 手机端适配 */
@media only screen and (max-width: 900px) {
  .UDAside #up,
  .UDAside #down {
    right: 15px;
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
  }
  .UDAside #up { bottom: 70px; }
}


/* .notion-aside-table-of-contents {
  display: flex;

  flex-direction: column;

  align-items: center;

  max-height: calc(100vh - 148px - 16px);

  min-width: 222px;

  overflow: auto;

  background: var(--bg-color);

  border-radius: 4px;

} */
/* 
.notion-aside {
  position: -webkit-sticky;
  position: sticky;
  top: 148px;
  z-index: 101;
  align-self: flex-start;
  flex: 1 1;
  display: none;
  flex-direction: column;
  align-items: center;
}


/* === 左侧浮动 Table of Contents 样式（渐变 + 圆角卡片）=== */
.TableOfContents {
  position: fixed;
  top: 100px;
  left: 10px; /* 左侧位置 */
  width: 260px;
  background: linear-gradient(to bottom, #fffbe6, #ffffff); /* 柔和浅黄到白渐变 */
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  padding: 15px;
  font-size: 0.9rem; /* 调大字体方便阅读 */
  line-height: 1.8;
  z-index: 1000;
  max-height: 70vh;
  overflow-y: auto;
}

/* 目录标题 */
.TableOfContents__Header {
  text-align: center;
  font-weight: bold;
  margin-bottom: 12px;
  font-size: 1rem;
  color: #444;
}
.TableOfContents__Header::before,
.TableOfContents__Header::after {
  content: " ✦ ";
  color: #d4a373; /* 点缀符号颜色，可改 */
}

/* 每个目录条目 */
.TableOfContents__Item {
  list-style: none;
  cursor: pointer;
  transition: all 0.2s ease;
}
.TableOfContents__Item:hover {
  background: rgba(0,0,0,0.05);
  border-radius: 6px;
}
.TableOfContents__Item > a {
  color: inherit;
  text-decoration: none;
  display: block;
  padding: 4px 2px;
}

/* 层级缩进 */
.TableOfContents__Item[data-level="1"] { font-weight: bold; }
.TableOfContents__Item[data-level="2"] { padding-left: 15px; font-size: 0.9em; }
.TableOfContents__Item[data-level="3"] { padding-left: 30px; font-size: 0.85em; }

/* 当前阅读位置高亮（左侧标记线） */
.TableOfContents__Item.active > a {
  color: #d4a373; /* 同渐变的暖色系 */
  font-weight: bold;
  border-left: 3px solid #d4a373;
  padding-left: 5px;
}

/* 滚动条美化 */
.TableOfContents::-webkit-scrollbar { width: 6px; }
.TableOfContents::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 4px;
}
.TableOfContents::-webkit-scrollbar-thumb {
  background: #d4a373;
  border-radius: 4px;
}
.TableOfContents::-webkit-scrollbar-thumb:hover {
  background: #b37d4e;
}

/* 移动端隐藏 */
@media (max-width: 900px) {
  .TableOfContents {
    display: none;
  }
}


.utterances {
  width: 85%;
  max-width: 100%;
  margin: 0px auto;
  padding: 0px 96px;
  height: 269px;
}

.utterances {
  margin-top: 5rem;
}

.utterances-frame {
  position: static;
}