/* 菜单按钮样式 */
  .menu-button {
    position: fixed;
    top: 10px;
    right: 5px;
    padding: 10px;
    background-color: transparent;
    color: white;
    cursor: pointer; /* 鼠标悬停时显示指针形状 */
    z-index: 1001; /* 确保菜单按钮位于其他元素上方 */
    border: none; /* 无边框 */
  }
  /* 菜单按钮图片样式和过渡效果 */
  .menu-button img {
    transition: transform 0.5s ease; /* 图片变换有0.5秒的过渡效果 */
  }
  .menu-button.active img {
    transform: rotate(90deg); /* 激活按钮时图片旋转90度 */
  }
  /* 文本目录样式 */
  .text-directory {
    position: fixed;
    top: 80px;
    right: -200px; /* 初始状态下目录在屏幕右侧之外 */
    width: 120px;
    background-color: transparent; /* 背景透明 */
    transition: right 0.5s ease; /* 目录位置变化有0.5秒的过渡效果 */
    z-index: 1000; /* 确保目录位于其他元素上方但低于菜单按钮 */
  }
  /* 目录激活状态样式 */
  .text-directory.active {
    right: 0; /* 激活目录时滑入屏幕右侧可见位置 */
  }
  /* 目录列表项样式 */
  .directory-item {
    display: block;
    padding: 5px 5px;
    padding-left: 10px;
    line-height: 1.5;
    font-size: 15px;
    background-color: rgba(255, 255, 255, 0.9) !important; /* 半透明背景 */
    border: 1px solid #ccc; /* 灰色边框 */
    margin-bottom: 5px; /* 底部间距 */
    text-align: left;
    white-space: nowrap; /* 不换行 */
    list-style: none; /* 无列表样式 */
    border-top-left-radius: 20px; /* 左上角圆角 */
    border-bottom-left-radius: 20px; /* 左下角圆角 */
    text-decoration: none; /* 无文本装饰 */
    color: #000000 !important; /* 黑色文字 */
    transition: margin-left 0.5s ease, background-color 0.5s ease, color 0.5s ease; /*背景和文字颜色的过渡效果*/
  }
  /* 列表项悬停时样式 */
  .directory-item:hover {
    margin-left: -10px; /* 悬停时向左移动10像素 */
    background-color: #cccccc !important; /* 灰色背景 */
    color: #ffffff !important; /* 白色文字 */
    transition: margin-left 0.5s ease, background-color 0.5s ease, color 0.5s ease; /*悬停背景/文字颜色的过渡效果*/
  }
  /* 为图标设置固定样式，不受悬停影响 */
  .directory-item .yuanse {
    color: #000000 !important; /* 设置图标的默认颜色为黑色 */
    transition: none; /* 取消图标的颜色过渡效果 */
  }


  /* 夜间模式部分效果 */
  .dark-theme .directory-item {
    transition: margin-left 0.5s ease, background-color 0.5s ease, color 0.5s ease; /*背景和文字颜色的过渡效果*/
  }
  .dark-theme .directory-item:hover {
    transition: margin-left 0.5s ease, background-color 0.5s ease, color 0.5s ease; /*悬停背景/文字颜色的过渡效果*/
  }