/* 图片工具栏 */
        .toolbar {
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
            background-color: rgba(255, 255, 255, 0.7);
            padding: 8px; /* 调整工具栏内边距 */
            border-radius: 3px;
            display: flex;
            align-items: center;
            justify-content: space-around;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
        }

        .toolbar button {
            font-size: 14px; /* 调整按钮字体大小 */
            margin: 0 3px; /* 调整按钮之间的间距 */
            background-color: rgba(0, 120, 255, 0.5);
            color: #fff;
            border: none;
            padding: 6px 8px; /* 调整按钮内边距 */
            border-radius: 2px;
            cursor: pointer;
        }

        .toolbar button:hover {
            background-color: rgba(0, 120, 255, 0.7);
        }


        /* 图片背景遮罩 */
        .overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.8);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1005;
        }

        .zoomed-image {
            max-width: 100%;
            max-height: 100%;
            cursor: grab;
        }

        .toc {
            display: none;

            position: fixed;
            z-index: 1000; /* 设置略低的z-index值 */

            font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
            top: 0;
            left: 0;
            width: 180px; /* 左侧目录宽度 */
            height: 100%; /* 充满整个屏幕高度 */
            overflow-y: auto; /* 如果内容超出高度，显示滚动条 */
            padding: 20px;
            border-right: 2px solid #ddd; /* 添加分割线 */
            color: #d1d8e0; /* 默认文字颜色 */
            background-color: #2e3138;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }

        .toc > ul {
            List-style: none;
            padding-top: 45px;
            padding-left: 0px;
        }

        .toc ul {
            List-style: none;
            padding-left: 1px;
        }

        .toc li {
            List-style: none;
            padding-top: 4px;
            margin-left: 12px;
            transition: background-color 0.3s, transform 0.2s;
        }

        .toc a {
            List-style: none;
            padding-bottom: 3px;
            position: relative;
            display: block;
            padding-left: 5px;
            line-height: 1.5;
        }

        .toc a::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            width: 2px;
            background-color: hsla(204, 83%, 62%, 100%);
            transform: scaleY(0.9); /* 控制边框高度占比 */
        }

        .toc li:hover {
            /*background-color: #ccc;*/
            transform: translateX(6px);
        }

        .toc a:hover {

            color: #2ecc71 !important; /* 鼠标悬停时的颜色 */
            text-decoration: underline; /* 悬停时添加下划线效果 */
            background-color: #34495e; /* 鼠标悬停时链接元素的背景色 */
        }

        .tocShowButton {
            display: block;
            position: fixed;
            z-index: 1001; /* 设置略低的z-index值 */
            top: 40px;
            left: 30px;
            cursor: pointer;
            color: #fff;
            background-color: #596275;
            border: none;
            padding: 0px 60px;
            border-radius: 5px;
            font-size: 15px;
        }

        /* 基础表格样式 */
        .markdown-content > table {
            width: 100%;
            border-collapse: collapse;
            font-family: Arial, sans-serif;
            background-color: #f6f6f6; /* 使用纯白色背景 */
            border-radius: 8px; /* 添加圆角 */
            box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
            transition: all 0.3s ease; /* 平滑过渡效果 */
            overflow: hidden; /* 隐藏超出的部分 */
        }

        /* 表格边框样式 */
        .markdown-content > table th,
        .markdown-content > table td {
            border: 1px solid #e0e0e0; /* 边框颜色为浅灰色 */
            padding: 6px; /* 增加内边距 */
            text-align: left;
            color: #333333; /* 文字颜色为深灰色 */
            transition: all 0.3s ease; /* 平滑过渡效果 */
        }

        /* 表头样式 */
        .markdown-content > table thead th {
            background-color: #f0f0f0; /* 使用淡灰色作为表头背景 */
            color: #333333; /* 文字颜色为深灰色 */
            font-weight: bold;
            border-top-left-radius: 8px; /* 左上角圆角 */
            border-top-right-radius: 8px; /* 右上角圆角 */
        }

        /* 行间隔样式 */
        .markdown-content > table tbody tr:nth-child(even) {
            background-color: #f3faf3; /* 使用极淡灰色作为偶数行背景色 */
        }

        /* 鼠标悬停效果 */
        .markdown-content > table tbody tr:hover {
            background-color: #f0f0f0; /* 鼠标悬停时背景变为淡灰色 */
            /*color: #333333; !* 文字颜色保持不变 *!*/
        }


        /* 内容 */
        body {
            /*font-family: Arial, sans-serif;*/
            font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
            max-width: 800px; /* 自适应屏幕大小 */
            margin: 0 auto; /* 水平居中 */
            padding: 20px;
            background-color: white; /* 默认背景色 */
            color: black; /* 默认文字颜色 */
            transition: background-color 0.4s ease-in-out, color 0.4s ease-in-out;
        }

        /* 复制按钮 */
        .copy-btn {
            background-color: rgba(197, 217, 227, 0.99);
            color: white;
            border: none;
            padding: 5px 6px;
            font-size: 10px;
            cursor: pointer;
            border-radius: 4px;
            position: absolute;
            top: 5px;
            right: 5px;
            z-index: 1;
            opacity: 0.6; /* 设置透明度 */
        }

        /* 复制按钮 */
        .copy-btn:hover {
            background-color: #83a2dc;
            opacity: 1; /* 悬停时完全不透明 */
        }

        /* 强调代码块的样式 */
        pre {
            position: relative;
            z-index: 999; /* 设置略低的z-index值 */
            margin-top: 32px;
            margin: 1em 0;
            /*padding: 1em;*/
            overflow-x: auto;
            border-radius: 5px;
            background-color: #F7F7F7; /* 背景色 */
            /*border: 1px solid #d5ebe1;  边框 */
            border-left: 4px solid #9b9bb6;
            font-family: 'Consolas', monospace; /* 使用等宽字体 */
        }

        pre > code {
            border: 0;
            display: inline;
            max-width: initial;
            padding: 0;
            margin: 0;
            overflow: initial;
            line-height: inherit;
            font-size: .85em;
            white-space: pre;
            background: 0 0;

        }

        code {
            font-family: 'Consolas', monospace;
            border-radius: 2px;
            background-color: rgb(171 169 169 / 61%);
            color: inherit;
            margin: 0 0.2em;
            padding: 0.02em 0.3em;
            font-size: 0.86em;
        }

        /* 代码块中的代码样式 */
        code[class*="language-"] {
            font-family: 'Consolas', monospace;
            font-size: 0.8em;
        }

        /* for block of numbers 代码块 中行间距等调整 */
        pre code td.hljs-ln-numbers {
            text-align: center;
            color: #9c9c9c;
            /*border-right: 0.5px solid #9c9c9c;*/
            vertical-align: top;
            padding-right: 0.6rem;
            border: none;
        }

        /* 修改滚动条样式 */
        ::-webkit-scrollbar {
            width: 12px; /* 滚动条宽度 */
            height: 9px;
            opacity: 0.5; /* 设置透明度 */
            /*border-radius: 8px; !* 滚动条边框圆角 *!*/
        }

        ::-webkit-scrollbar-track {
            background: #100e0e; /* 滚动条轨道的背景颜色 */
        }

        ::-webkit-scrollbar-thumb {
            background: #484948F9; /* 滚动条的颜色 */
            border-radius: 4px; /* 滚动条的圆角 */
            opacity: 0.6; /* 悬停时完全不透明 */
            transition: background-color 1s; /* 添加颜色变化的过渡效果 */
        }

        ::-webkit-scrollbar-thumb:hover {
            background-color: #abadad;
            opacity: 1; /* 悬停时完全不透明 */
        }

        /* 提示框样式 */
        .note, .info {
            background-color: #E6F0FC; /* 淡蓝色背景 */
            color: black;
            border-left: 5px solid #4d8cf0; /* 左边框样式 */
            padding: 12px;
            margin-bottom: 10px;
            font-family: 'Microsoft YaHei', sans-serif;
            border-radius: 4px; /* 滚动条的圆角 */
        }

        .warning {
            color: black;
            background-color: #FDF1E5; /* 黄色背景 */
            border-left: 5px solid #eccc68; /* 左边框样式 */
            padding: 16px;
            margin-bottom: 10px;
            font-family: 'Microsoft YaHei', sans-serif;
            border-radius: 4px; /* 滚动条的圆角 */
        }

        .tip {
            color: black;
            background-color: #E5F8F8; /* 黄色背景 */
            border-left: 5px solid #E5F8F8; /* 左边框样式 */
            padding: 16px;
            margin-bottom: 10px;
            font-family: 'Microsoft YaHei', sans-serif;
            border-radius: 4px; /* 滚动条的圆角 */
        }

        /* 日间模式样式 */
        body.night-mode {
            background-color: #2c2f36; /* 深色背景 */
            color: rgba(255, 255, 255, 0.99); /* 白色文字 */
        }

        /* 日间模式样式 代码块 */
        body.day-mode pre {
            background-color: #535c68; /* 夜间模式下的代码块背景色 */
            color: white; /* 代码块文字颜色 */
            border-left: 4px solid #7c949f;
            font-family: 'Consolas', monospace; /* 使用等宽字体 */
        }

        /* 日间模式样式 toc目录 */
        body.day-mode .toc a {
            color: #0099ff; /* 代码块文字颜色 */
        }

        body.day-mode .toc {
            background-color: white;
        }

        /* 夜间模式样式 鼠标指向时变为灰色 */
        body.day-mode .toc a:hover {
            text-decoration: underline; /* 悬停时添加下划线效果 */
            background-color: #f4f8ee; /* 鼠标悬停时链接元素的背景色 */
            color: #2ecc71;
        }

        /* 切换日间夜间开关按钮样式 */
        .toggle {
            position: fixed;
            z-index: 1001; /* 设置略低的z-index值 */
            top: 40px; /* 距离顶部的距离 */
            right: 40px; /* 距离右侧的距离 */
        }

        .toggle input {
            display: none;
        }

        /* 滑块样式 */
        .slider {
            z-index: 500;
            position: relative;
            display: inline-block;
            width: 40px;
            height: 20px;
            background-color: grey;
            border-radius: 20px;
            cursor: pointer;
            transition: background-color 0.4s ease-in-out;
        }

        /* 太阳和月亮图标 */
        .slider::before {
            position: absolute;
            content: "\1F31E"; /* 太阳图标 */
            font-size: 14px;
            left: 2px;
            bottom: 2px;
            transition: transform 0.4s ease-in-out;
        }

        /* 夜间模式下太阳图标隐藏，月亮图标显示 */
        input:checked + .slider::before {
            content: "\1F319"; /* 月亮图标 */
            transform: translateX(20px);
        }

        input:checked + .slider {
            background-color: #2196F3; /* 调整按钮背景颜色 */
        }

        /* 全局图片 大小限制 */
        img {
            padding-top: 10px;
            max-width: 800px;
            height: auto;
            margin-right: 5px;
            text-align: center;
            transition: transform 0.5s ease-in-out;
        }

        .markdown-content img {
            transition: transform 0.3s ease-in-out;
            max-height: 100vh; /* 图片最大高度，保持在视窗内 */
            max-width: 80%; /* 图片最大宽度 */
        }

        /*  图片放大 */
        .markdown-content img.zoomed {
            z-index: 999;
            position: fixed;
            top: 0;
            left: 250px;
            width: calc(100% - 300px);
            bottom: 0;
            object-fit: contain;
            margin: auto;
            transition: transform 0.3s ease-in-out; /* 添加缩放的过渡效果 */
        }

        /* 作者信息样式 */
        .author-info {
            position: relative;
            bottom: 0px;
            left: 50px;
            display: inline-flex;
            align-items: center;
            z-index: 1; /* 提高层叠顺序 */
        }

        /* 图片样式 */
        .author-info img {
            width: 30px;
            height: auto;
            margin-right: 5px;
        }

        h1, h2, h3, h4, h5 {
            font-weight: 700;
            margin-top: 1.2em;
            margin-bottom: 0.1em;
            /*font-family: Georgia, Palatino, serif;*/
            font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
        }

        h1, h2 {
        / / 让标题往左移动
            /*margin-left: -22px;*/
        }

        h1 {
            border-bottom: 1.2px solid rgba(211, 202, 207, 0.99);
            font-size: 35px;
            line-height: 3rem;
        }

        h2 {
            font-size: 30px;
            /*line-height: 25px;*/
            line-height: 0.75;
        }

        h3 {
            /*color: #70a1ff;*/
            font-size: 25px;
            line-height: 0.75;
        }

        h4 {
            /*color: #2E80F2;*/
            font-size: 20px;
            line-height: 0.75;
        }

        h5 {
            font-size: 18px;
            line-height: 0.75;
            /*list-style: 18px;*/
        }


        /* a标签 */
        a {
            color: white;
            margin: 0;
            padding: 0;
            vertical-align: baseline;
        }

        a:hover {
            text-decoration: none;
            color: #ff6600;
        }

        a:visited {
            /*color: purple;*/
        }

        /* 文字居中 */
        .title {
            font-size: 43px;
            text-align: center;
        }