@charset "UTF-8";
/* variables */
/* ===== _reset.scss ===== */
*, *::before, *::after { box-sizing: border-box; }

body, html, div, header, footer, nav, li, h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; }

html { height: 100%; }

body { font-family: 'trebuchet ms', verdana, helvetica, arial, sans-serif; font-size: 14.5px; color: #212529; background-color: #667484 !important; position: relative; min-height: 100%; padding-bottom: 120px; }

a { text-decoration: none; }

button { border: none; outline: none; }

hr { border: 0; border-top: 1px solid #eee; margin: 20px 0; }

/* 标题 */
h1 { font-size: 21.5px; }

h2 { font-size: 20.5px; border-bottom: 1px solid #eee; margin: 40px 0 25px; }

h3 { font-size: 19px; margin: 30px 0 20px; }

h4 { font-size: 18px; margin: 30px 0 10px; }

h5 { font-size: 17px; margin: 20px 0 10px; }

h6 { font-size: 16px; margin: 10px 0 5px; }

/* 引用 */
blockquote { border-left: 5px solid #D6DBDF; padding: 7px 20px; background: rgba(112, 138, 153, 0.1); margin: 0 0 5px; }

blockquote p:last-of-type { margin: 0; }

blockquote p { color: #666; }

/* 表格：外框 1 px + 单元格 1 px 内边线，四周不去边 */
table { width: 100%; margin: 10px 0; border-collapse: collapse; border: 1px solid #ababab; overflow: hidden; /* 圆角裁剪 */ transform: translateZ(0); /* 触发 GPU 整 px 对齐 */ }

thead { border-bottom: 1px solid #777; background-color: #dee5f8; color: #404040; }

/* 只给表格里的单元格加边框 → 代码块零污染 */
table th, table td { padding: 6px 10px; text-align: left; border: 1px solid #ababab; /* 内框 1 px（同色） */ }

/* 斑马纹 */
tbody tr:nth-of-type(2n) { background-color: #f4f6f8; }

p { font-weight: 400; margin: 0 0 7px; }

img { max-width: 100%; }

#markdown-toc { display: block; }

.page[post] .label { margin-top: 16px; overflow: hidden; }

.page[post] .label .label-card { color: #888; float: left; margin-right: 15px; }

.page[post] .label .label-card .point { padding: 0 10px; color: #9d9d9d; }

.page[post] .label .label-card i { padding-right: 5px; color: #6b6a6a; }

.page[post] a { color: #4d6dad; transition: 0.5s ease; }

.page[post] a:hover { color: #223253; background-color: #f4efeb; }

.page[post] .left ul > h2 { color: #000; }

.page[post] .left ul li { color: #212529; margin: 0; }

@media screen and (max-width: 770px) { .page[post] .left { font-size: 14px; } .page[post] .left h1 { font-size: 21.5px; } .page[post] .left h2 { font-size: 18.5px; } .page[post] .left h3 { font-size: 19px; } .page[post] .left h4 { font-size: 18px; } .page[post] .left h5 { font-size: 17px; } .page[post] .left h6 { font-size: 16px; } }

.clearfix:after { content: "\200B"; display: block; height: 0; clear: both; }

.clearfix { *zoom: 1; }

.post-widgets { border-top: 1px solid #eee; margin-top: 15px; text-align: center; }

.btn { background: var(--btn-default-bg); border: 2px solid var(--btn-default-border-color); border-radius: 2px; color: var(--btn-default-color); display: inline-block; font-size: 0.875em; line-height: 2; padding: 0 20px; text-decoration: none; transition-property: background-color; transition-delay: 0s; transition-duration: 0.2s; transition-timing-function: ease-in-out; }

.btn:hover { background: var(--btn-default-hover-bg); border-color: var(--btn-default-hover-border-color); color: var(--btn-default-hover-color); }

.btn + .btn { margin: 0 0 8px 8px; }

.btn .fa-fw { text-align: left; width: 1.285714285714286em; }

.reward-container { margin: 20px auto; padding: 10px 0; text-align: center; width: 90%; }

.reward-container button { background: #c9ff55; border: 0; border-radius: 5px; color: #000; cursor: pointer; line-height: 2; outline: 0; padding: 0 15px; vertical-align: text-top; }

.reward-container button:hover { background: #43ff2a; }

#qr { padding-top: 20px; }

#qr a { border: 0; }

#qr img { display: inline-block; margin: 0.8em 2em 0 2em; max-width: 100%; width: 110px; }

#qr p { text-align: center; }

.post-copyright { background: var(--card-bg-color); border-left: 3px solid #ff2a2a; list-style: none; margin: 2em 0 0; padding: 0.5em 1em; }

.page { width: 800px; box-sizing: border-box; margin: 0 auto; }

.page .left { width: 100%; float: left; padding: 20px 30px; line-height: 1.5; font-size: 14.5px; background-color: #ffffff; background-clip: border-box; }

.page .left > h1 { margin-bottom: -10px; }

.page .left a:not([title]) { word-break: break-all; }

.page .left ul > h2 { margin-left: -40px; color: #000; }

.page .left ul li { line-height: 1.5; color: #888888; }

.page .left ul li time { display: inline-block; width: 130px; }

.page .left ul li .title { color: #536ea8; transition: 0.3s ease; }

.page .left ul li .title:hover { color: #4d6dad; }

.page .left ul li i { margin-right: 5px; }

.page .left ul li .categories { padding: 0 15px; }

.page .left ul li .categories i { color: #cac8c8; }

.page .left ul li .categories a { padding: 0 5px; background-color: #f7f3f3; color: #536ea8; font-size: 90%; transition: 0.3s ease; }

.page .left ul li .categories a:hover { background-color: #b6b6b9; }

.page .left ul li .pageTag i { color: #c6cbe9; }

.page .left ul li .pageTag a { padding: 0 5px; background-color: #c6cbe9; border-radius: 4px; color: #fff; font-size: 90%; transition: 0.3s ease; }

.page .left ul li .pageTag a:hover { background-color: #c0ddc7; }

.page .anchor { display: none; }

.page .right { display: none; /* 隐藏元素 */ height: 0; /* 设置高度为 0 */ overflow: hidden; /* 隐藏溢出的内容 */ float: left; width: 25%; padding-left: 20px; top: 0; }

.page .right .fixed { top: 20px; }

.page .right .scroll-bottom { position: absolute; bottom: 190px; }

.page .right .side { box-sizing: border-box; background-color: #ffffff; box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.3), 0 0 30px rgba(10, 10, 0, 0.1) inset; padding-bottom: 1px; -ms-word-break: break-all; word-break: break-all; /* Non standard for webkit */ -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }

.page .right .side > div { padding: 12px 15px; border-bottom: 1px solid #c0c0c0; font-size: 16px; font-weight: bold; }

.page .right .side a { color: #4d6dad; transition: 0.5s ease; }

.page .right .side a:hover { color: #223253; }

.page .right .content-ul { overflow-y: auto; padding-right: 10px; line-height: 1.8; padding-left: 35px; }

.page .right .content-ul ul { padding-left: 20px; }

@media screen and (max-width: 750px) { .page { width: 100%; margin: 0; } .page .left { width: 100%; float: left; padding: 10px 15px; line-height: 1.5; font-size: 14px; background-color: #ffffff; background-clip: border-box; } .page .left > h1 { font-size: 25px; margin-bottom: -10px; } .page .left ul { padding-left: 15px; } .page .left ul > h2 { font-size: 20px; margin-left: -15px; } .page .left ul li { margin: 20px 0; } .page .left ul li time { display: block; width: auto; } .page .left ul li .title { display: block; font-size: 16px; } .page .left ul li .categories { font-size: 12px; padding-left: 0; padding-right: 8px; } .page .anchor { display: block; visibility: hidden; position: fixed; top: 76px; right: 2.5%; padding: 5px 10px; color: #000; font-size: 15px; background-color: #ffffff; box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.3), 0 0 30px rgba(10, 10, 0, 0.1) inset; opacity: 0.7; transition: 0.2s cubic-bezier(0.5, 0.1, 0.51, 1.38); } .page .anchor-hide { opacity: 0; visibility: hidden; } .page .right { display: none; /* 隐藏元素 */ height: 0; /* 设置高度为 0 */ overflow: hidden; /* 隐藏溢出的内容 */ position: fixed; float: none; width: auto; max-width: 95%; padding: 0; top: 76px; right: 2.5%; opacity: 0; transform-origin: 100% 0; transform: scale(0.1); transition: 0.2s cubic-bezier(0.5, 0.1, 0.51, 1.38); } .page .right-show { z-index: 999; visibility: visible; opacity: 1; transform: scale(1); } .page .right-show .content-ul { margin-bottom: 0; } .page .right-show .content-ul > li:last-of-type { margin-bottom: 16px; } }

/*哔哩哔哩视频适配*/
.bilibili { position: relative; width: 100%; }

@media only screen and (max-width: 767px) { .bilibili { height: 15em; max-width: 25em; } }

@media only screen and (min-width: 768px) and (max-width: 991px) { .bilibili { height: 20em; max-width: 30em; } }

@media only screen and (min-width: 992px) and (max-width: 1199px) { .bilibili { height: 30em; max-width: 40em; } }

@media only screen and (min-width: 1200px) { .bilibili { height: 40em; max-width: 50em; } }

/** Syntax highlighting styles */
code { font-size: 95%; border-radius: 3px; color: #c7254e; background-color: #f9f2f4; font-family: Monaco,Menlo,"Microsoft YaHei Mono",Consolas,"Courier New",monospace,sans-serif; text-size-adjust: 100%; -ms-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

pre { overflow-x: auto; word-wrap: break-word; /* IE 5.5-7 */ white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */ white-space: none; font-family: Menlo,Monaco,Consolas,'Andale Mono','lucida console','Courier New',monospace; }

pre > code { margin: 0; padding: 0; font-size: 13px; color: #212529; border: none; background-color: #ffffdd; line-height: 1.3em; text-size-adjust: 100%; -ms-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

pre > code .lineno { color: #ece7e7; }

pre > code table { width: auto; }

::-webkit-scrollbar { width: 10px; height: 8px; }

::-webkit-scrollbar-track { width: 6px; background: rgba(16, 31, 28, 0.1); -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; }

::-webkit-scrollbar-thumb { background-color: rgba(144, 147, 153, 0.4); background-clip: padding-box; min-height: 28px; -webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; transition: background-color .3s; cursor: pointer; }

::-webkit-scrollbar-thumb:hover { background-color: rgba(144, 147, 153, 0.9); }

.rouge-table td { border: 1px solid #ffffdd; }

.highlight { border-radius: 3px; background: #ffffdd; /* Comment */ /* Error */ /* Keyword */ /* Literal */ /* Name */ /* Operator */ /* Punctuation */ /* Comment.Multiline */ /* Comment.Preproc */ /* Comment.Single */ /* Comment.Special */ /* Generic.Emph */ /* Generic.Strong */ /* Keyword.Constant */ /* Keyword.Declaration */ /* Keyword.Namespace */ /* Keyword.Pseudo */ /* Keyword.Reserved */ /* Keyword.Type */ /* Literal.Date */ /* Literal.Number */ /* Literal.String */ /* Name.Attribute */ /* Name.Builtin */ /* Name.Class */ /* Name.Constant */ /* Name.Decorator */ /* Name.Entity */ /* Name.Exception */ /* Name.Function */ /* Name.Label */ /* Name.Namespace */ /* Name.Other */ /* Name.Property */ /* Name.Tag */ /* Name.Variable */ /* Operator.Word */ /* Text.Whitespace */ /* Literal.Number.Float */ /* Literal.Number.Hex */ /* Literal.Number.Integer */ /* Literal.Number.Oct */ /* Literal.String.Backtick */ /* Literal.String.Char */ /* Literal.String.Doc */ /* Literal.String.Double */ /* Literal.String.Escape */ /* Literal.String.Heredoc */ /* Literal.String.Interpol */ /* Literal.String.Other */ /* Literal.String.Regex */ /* Literal.String.Single */ /* Literal.String.Symbol */ /* Name.Builtin.Pseudo */ /* Name.Variable.Class */ /* Name.Variable.Global */ /* Name.Variable.Instance */ /* Literal.Number.Integer.Long */ /* Generic Heading & Diff Header */ /* Generic.Subheading & Diff Unified/Comment? */ /* Generic.Deleted & Diff Deleted */ /* Generic.Inserted & Diff Inserted */ }

.highlight .hll { background-color: #ffffff; }

.highlight .highlight { border: 1px solid #c0bbbb; }

.highlight .c { color: #6A9955; }

.highlight .err { color: #960050; background-color: #1e0010; }

.highlight .k { color: #09189c; }

.highlight .l { color: #000; }

.highlight .n { color: #000; }

.highlight .o { color: #837f81; }

.highlight .p { color: #09189c; }

.highlight .cm { color: #6A9955; }

.highlight .cp { color: #000; }

.highlight .c1 { color: #6A9955; }

.highlight .cs { color: #000; }

.highlight .ge { font-style: italic; }

.highlight .gs { font-weight: bold; }

.highlight .kc { color: #66d9ef; }

.highlight .kd { color: #66d9ef; }

.highlight .kn { color: #000; }

.highlight .kp { color: #66d9ef; }

.highlight .kr { color: #66d9ef; }

.highlight .kt { color: #09189c; }

.highlight .ld { color: #000; }

.highlight .m { color: #000; }

.highlight .s { color: #c27c60; }

.highlight .na { color: #000; }

.highlight .nb { color: #000; }

.highlight .nc { color: #000; }

.highlight .no { color: #66d9ef; }

.highlight .nd { color: #000; }

.highlight .ni { color: #000; }

.highlight .ne { color: #000; }

.highlight .nf { color: #960050; }

.highlight .nl { color: #09189c; }

.highlight .nn { color: #000; }

.highlight .nx { color: #000; }

.highlight .py { color: #000; }

.highlight .nt { color: #000; }

.highlight .nv { color: #000; }

.highlight .ow { color: #000; }

.highlight .w { color: #000; }

.highlight .mf { color: #000; }

.highlight .mh { color: #000; }

.highlight .mi { color: #0086B3; }

.highlight .mo { color: #000; }

.highlight .sb { color: #000; }

.highlight .sc { color: #c27c60; }

.highlight .sd { color: #000; }

.highlight .s2 { color: #c27c60; }

.highlight .se { color: #c27c60; }

.highlight .sh { color: #000; }

.highlight .si { color: #000; }

.highlight .sx { color: #000; }

.highlight .sr { color: #000; }

.highlight .s1 { color: #000; }

.highlight .ss { color: #000; }

.highlight .bp { color: #000; }

.highlight .vc { color: #000; }

.highlight .vg { color: #000; }

.highlight .vi { color: #000; }

.highlight .il { color: #000; }

.highlight .gu { color: #000; }

.highlight .gd { color: #000; }

.highlight .gi { color: #000; }

.page[index] a { color: #4d6dad; transition: 0.5s ease; }

.page[index] a:hover { color: #223253; }

.page[index] .left > ul { padding: 0; }

.page[index] .left > ul > li { list-style: none; }

.page[index] .left > ul li { color: #000; }

.page[index] .left > ul li h2 { border: none; font-size: 18px; margin: 0; }

.page[index] .left > ul li .label { margin-bottom: 15px; overflow: hidden; }

.page[index] .left > ul li .label .label-card { color: #888; float: left; margin-right: 15px; }

.page[index] .left > ul li .label .label-card i { padding-right: 0; margin-right: 3px; color: #6b6a6a; }

.page[index] .left > ul li .label .categories { padding: 0; }

.page[index] .left > ul li .excerpt h2 { font-size: 24px; }

.page[index] .left > ul li .excerpt h3 { font-size: 22px; }

.page[index] .left > ul li .excerpt h4 { font-size: 20px; }

.page[index] .left > ul li .read-all { text-align: right; font-size: 14px; }

.page[index] .left > ul li .read-all a { color: #778ab0; transition: 0.2s ease; }

.page[index] .left > ul li .read-all a:hover { color: #5872a7; }

.page[index] .left > ul li .read-all a i { padding-right: 3px; }

.page[index] .left .pagination { text-align: center; }

.page[index] .left .pagination .previous, .page[index] .left .pagination .next { font-size: 20px; padding: 0 5px; }

.page[index] .left .pagination .page_number { padding: 0 5px; }

.page[index] .left .pagination .disable { color: #cbcbcb; }

.page[index] .right { display: none; /* 隐藏元素 */ height: 0; /* 设置高度为 0 */ overflow: hidden; /* 隐藏溢出的内容 */ }

.page[index] .right .wrap .side { margin-bottom: 20px; padding-bottom: 0; }

.page[index] .right .wrap .side i { margin-right: 3px; }

.page[index] .right .wrap .side .content-ul[cate] { overflow: hidden; list-style: none; margin: 0; padding: 0; }

.page[index] .right .wrap .side .content-ul[cate] li { font-size: 14px; }

.page[index] .right .wrap .side .content-ul[cate] li a { display: block; width: 100%; padding: 2px 0; border-bottom: 1px solid #eee; }

.page[index] .right .wrap .side .content-ul[cate] li a:hover { background-color: #dbdfee; }

.page[index] .right .wrap .side .content-ul[cate] li a:hover .badge { background-color: #dbdfee; transform: scale(1.2) rotate(360deg); }

.page[index] .right .wrap .side .content-ul[cate] li a .name { padding-left: 15px; }

.page[index] .right .wrap .side .content-ul[cate] li a .badge { display: block; float: right; text-align: center; margin-right: 15px; margin-top: 3px; padding: 0 10px; font-size: 12px; color: #fff; background-color: #bbb; border-radius: 50%; transition: 0.5s ease-in-out; }

.page[index] .right .wrap .side .content-ul[cate] li:last-of-type a { border: none; }

.page[index] .right .wrap .side .content-ul[recent] { padding-bottom: 16px; }

.page[index] .right .wrap .side .content-ul[recent] li { color: #aaa; font-size: 14px; }

.page[index] .right .wrap .side .tags-cloud { font-weight: normal; }

.page[index] .right .wrap .side .tags-cloud a { padding: 0 3px; border-radius: 5px; }

.page[index] .right .wrap .side .tags-cloud a:hover { background-color: #f0e7ce; }

@media screen and (max-width: 770px) { .page[index] .left > ul li h2 { font-size: 18px; } .page[index] .left > ul li .excerpt h2 { font-size: 20px; } .page[index] .left > ul li .excerpt h3 { font-size: 18px; } .page[index] .left > ul li .excerpt h4 { font-size: 16px; } .page[index] .left > ul li .excerpt li { margin: 0; } }

.page[demo] .left { width: 100%; }

.page[demo] .left a { color: #4d6dad; transition: 0.5s ease; }

.page[demo] .left a:hover { color: #223253; background-color: #f4efeb; }

.page[demo] .left .grid { margin: 0 auto; /* clearfix */ }

.page[demo] .left .grid:after { content: ''; display: block; clear: both; }

.page[demo] .left .grid .grid-item { width: 250px; background-color: #fff; margin-bottom: 20px; padding-bottom: 10px; float: left; transition: 0.5s ease; -webkit-transition: 0.5s ease; -moz-transition: 0.5s ease; -o-transition: 0.5s ease; -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3); }

.page[demo] .left .grid .grid-item:hover { -webkit-box-shadow: 0 2px 30px -1px rgba(0, 0, 0, 0.6), inset 0 0 87px 0 rgba(184, 184, 184, 0.13); -moz-box-shadow: 0 2px 30px -1px rgba(0, 0, 0, 0.6), inset 0 0 87px 0 rgba(184, 184, 184, 0.13); box-shadow: 0 2px 30px -1px rgba(0, 0, 0, 0.6), inset 0 0 87px 0 rgba(184, 184, 184, 0.13); }

.page[demo] .left .grid .grid-item .a-img { color: #fff; }

.page[demo] .left .grid .grid-item .a-img:hover { color: #fff; background-color: #fff; }

.page[demo] .left .grid .grid-item .demo-title { font-size: 18px; font-weight: bold; margin: 0 8px; }

.page[demo] .left .grid .grid-item p { margin: 0; padding: 0 8px; font-size: 14px; }

.deep { transition: 0.32s cubic-bezier(0.46, 0.03, 0.52, 0.96); transform-style: preserve-3d; transform: perspective(1600px) rotateX(14deg) translateZ(-200px); }

/* 1. 页脚：自然流，不固定 */
.site-footer { text-align: center; background-color: #2b2b3c; box-shadow: 0 -2px 4px 1px rgba(0, 0, 0, 0.5); color: #bbb; }

.site-footer .wrapper { max-width: 1140px; margin: 0 auto; padding: 15px 0; font-size: 14px; box-sizing: border-box; }

.site-footer .wrapper p { margin: 0; line-height: 1.6; }

.site-footer .wrapper .contact { display: inline-block; }

.site-footer .wrapper .contact a { color: #ccc; transition: 0.3s ease; }

.site-footer .wrapper .contact a:hover { color: #fff; }

.site-footer .wrapper .contact a i { margin: 0 5px; font-size: 20px; }

.site-footer .wrapper .description { display: inline-block; }

.site-footer .wrapper .power a { color: #8F90C5; transition: 0.3s ease; }

.site-footer .wrapper .power a:hover { color: #fff; }

/* 2. flex 撑满主体，footer 被顶到底 */
body { display: flex; flex-direction: column; min-height: 100vh; padding-bottom: 0 !important; }

.main-container, .page.clearfix.index-layout, .page.clearfix.post-layout { flex: 1; /* 撑满剩余高度 */ padding-bottom: 0; /* 不需要预留空间 */ }

.site-footer { flex-shrink: 0; /* 防止被压缩 */ }

/* 3. 响应式：小屏 footer 自然宽度 */
@media screen and (max-width: 770px) { .site-footer .wrapper { width: 100%; } }

/* 1. 横向 flex：导航 + 主列 */
body { display: flex; min-height: 100vh; margin: 0; padding: 0; }

.tree-nav-sidebar { width: 280px; /* 导航宽度 */ flex-shrink: 0; }

.main-container { flex: 1; /* 占剩余宽度 */ display: flex; flex-direction: column; /* 内容在上，footer 在下 */ }

/* 2. 内容区撑满，footer 沉底 */
.main-content { flex: 1; /* 撑满剩余高度 */ }

.site-footer { flex-shrink: 0; /* 不被压缩 */ background: #2b2b3c; color: #bbb; text-align: center; box-shadow: 0 -2px 4px 1px rgba(0, 0, 0, 0.5); }

/* 3. 响应式：小屏时导航堆叠，footer 自然宽度 */
@media (max-width: 768px) { body { flex-direction: column; } .tree-nav-sidebar { width: 100%; height: auto; max-height: 400px; } .main-container { width: 100%; } }

.content-ul::-webkit-scrollbar { width: 7px; height: 6px; }

.content-ul::-webkit-scrollbar-button { width: 0; height: 0; }

.content-ul::-webkit-scrollbar-thumb { background: #D3D3D3; border: 0 none #ffffff; border-radius: 50px; }

.content-ul::-webkit-scrollbar-thumb:hover { background: #a8a8a8; }

.content-ul::-webkit-scrollbar-thumb:active { background: #787878; }

.content-ul::-webkit-scrollbar-track { background: #F1F1F1; border-radius: 50px; }

.content-ul::-webkit-scrollbar-track:hover { background: #e2e2e2; }

.content-ul::-webkit-scrollbar-track:active { background: #cccccc; }

.content-ul::-webkit-scrollbar-corner { background: transparent; }

.back-to-top { position: fixed; left: 50%; margin-left: 580px; bottom: 37px; background-color: #ffffff; visibility: hidden; opacity: 0; transition: 0.4s ease; box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.3), 0 0 30px rgba(10, 10, 0, 0.1) inset; }

.back-to-top a { display: block; background-color: #eee; width: 38px; height: 38px; line-height: 38px; text-align: center; font-size: 20px; color: #b4b4b4; }

.back-to-top-show { visibility: visible; opacity: 0.7; }

.back-to-top-show:hover { opacity: 1; }

@media screen and (max-width: 1200px) and (min-width: 770px) { .back-to-top { left: 50%; margin-left: 45.5%; } }

@media screen and (max-width: 770px) { .back-to-top { right: 2.5%; left: auto; margin-left: 0px; } .back-to-top a { width: 33px; height: 33px; line-height: 33px; text-align: center; font-size: 18px; } }

/* ===== _tree-nav.scss ===== */
/* 优化版树形导航栏 - 带拖拽分隔条 */
:root { --tree-nav-width: 300px; }

body { background-color: #4a5568 !important; min-height: 100vh; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; margin: 0; padding: 0; position: relative; /* 拖拽时的全局样式 */ /* 导航栏隐藏时的状态 - 修复：移除 !important */ /* 导航栏显示时的状态 - 修复：移除 !important */ /* 小屏幕弹窗模式 - 彻底修复 */ }

body.nav-resizing { cursor: col-resize !important; user-select: none; }

body.nav-resizing * { user-select: none !important; pointer-events: none; }

body.nav-resizing .tree-nav-resizer { pointer-events: auto; }

body.nav-hidden .main-container, body.nav-hidden .page.clearfix.index-layout { margin-left: 0 !important; max-width: 100vw !important; }

body.nav-hidden .tree-nav-sidebar { display: none; transform: translateX(-100%); }

body.nav-hidden .tree-nav-resizer { display: none; }

body:not(.nav-hidden) .main-container, body:not(.nav-hidden) .page.clearfix.index-layout { margin-left: var(--tree-nav-width, 300px) !important; max-width: calc(100vw - var(--tree-nav-width, 300px)) !important; }

body:not(.nav-hidden) .tree-nav-sidebar { display: block; transform: translateX(0); }

body:not(.nav-hidden) .tree-nav-resizer { display: block; left: calc(var(--tree-nav-width, 300px) - 2px); }

body.nav-mobile-open { /* 阻止背景滚动 */ overflow: hidden; /* 遮罩层 */ }

body.nav-mobile-open::before { content: ''; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 9998; pointer-events: all; }

body.nav-mobile-open .tree-nav-sidebar { display: block !important; /* 这里需要 !important 覆盖默认隐藏 */ transform: translateX(0) !important; box-shadow: 2px 0 20px rgba(0, 0, 0, 0.3); z-index: 9999; opacity: 1; visibility: visible; }

body.nav-mobile-open .main-container, body.nav-mobile-open .page.clearfix.index-layout { margin-left: 0 !important; max-width: 100vw !important; }

body.nav-mobile-open .tree-nav-resizer { display: none; }

/* 2. 导航栏容器优化 - 简化版本 */
.tree-nav-sidebar { position: fixed; left: 0; top: 0; width: var(--tree-nav-width, 300px); height: 100vh; background: #2d3748; border-right: 1px solid #4a5568; padding: 1.5rem 1rem; overflow-y: auto; z-index: 100; box-sizing: border-box; /* 关键修改：默认隐藏，但不用 !important */ display: none; transform: translateX(-100%); transition: transform 0.3s ease, box-shadow 0.3s ease; /* 增强的滚动条样式 */ /* Firefox 滚动条样式 */ scrollbar-width: thin; scrollbar-color: #4a5568 #374358; }

.tree-nav-sidebar::-webkit-scrollbar { width: 8px; }

.tree-nav-sidebar::-webkit-scrollbar-track { background: #374358; border-radius: 4px; margin: 4px 0; }

.tree-nav-sidebar::-webkit-scrollbar-thumb { background: #4a5568; border-radius: 4px; border: 2px solid #374358; transition: background 0.2s ease; }

.tree-nav-sidebar::-webkit-scrollbar-thumb:hover { background: #5f6d86; }

.tree-nav-sidebar::-webkit-scrollbar-thumb:active { background: #90cdf4; }

/* 3. 分隔条样式 */
.tree-nav-resizer { position: fixed; left: calc(var(--tree-nav-width, 300px) - 2px); top: 0; width: 4px; height: 100vh; background: transparent; cursor: col-resize; z-index: 101; transition: all 0.2s ease; pointer-events: auto; }

.tree-nav-resizer:hover { background: rgba(144, 205, 244, 0.3); }

.tree-nav-resizer.resizing { background: rgba(144, 205, 244, 0.5); }

.tree-nav-resizer:after { display: none; }

/* 小屏幕适配 */
@media (max-width: 1024px) { .tree-nav-sidebar { width: 320px !important; /* 弹窗宽度 */ } /* 小屏幕下默认隐藏导航栏 */ body:not(.nav-mobile-open) .tree-nav-sidebar { display: none; } }

/* 移动端适配 */
@media (max-width: 768px) { .floating-toolbar.mobile-collapsed { background: transparent !important; border-color: transparent !important; box-shadow: none !important; } .floating-toolbar.mobile-collapsed .toolbar-items { opacity: 0; visibility: hidden; } .floating-toolbar.mobile-collapsed .toolbar-toggle { opacity: 1; visibility: visible; } .floating-toolbar.mobile-expanded { background: rgba(45, 55, 72, 0.95); border-color: rgba(74, 85, 104, 0.8); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); } .floating-toolbar.mobile-expanded .toolbar-items { opacity: 1; visibility: visible; } .floating-toolbar.mobile-expanded .toolbar-toggle { opacity: 0; visibility: hidden; } }

/* 4. 主内容区域 */
.main-container { background: #4a5568; min-height: 100vh; box-sizing: border-box; transition: margin-left 0.3s ease, max-width 0.3s ease; }

.main-content { padding: 2rem; background: #4a5568; box-sizing: border-box; }

.main-content::-webkit-scrollbar { width: 8px; }

.main-content::-webkit-scrollbar-track { background: #556177; border-radius: 4px; }

.main-content::-webkit-scrollbar-thumb { background: #353d4a; border-radius: 4px; }

.main-content::-webkit-scrollbar-thumb:hover { background: #2a303b; }

/* 5. 树导航核心样式优化 */
.tree-nav { font-size: 0.875rem; line-height: 1.5; background: #2d3748 !important; color: #e2e8f0; }

.tree-nav-header { margin-bottom: 1.5rem; padding-bottom: 0.75rem; border-bottom: 1px solid #4a5568; }

.tree-nav-header h3 { font-size: 1rem; font-weight: 600; margin: 0; color: #e2e8f0; display: flex; align-items: center; gap: 0.5rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.tree-nav-list { list-style: none; margin: 0; padding: 0; }

.tree-nav-link { display: flex; align-items: center; padding: 0.75rem; color: #90cdf4 !important; text-decoration: none; border-radius: 6px; transition: all 0.2s ease; margin-bottom: 0.25rem; gap: 0.5rem; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; flex: 1; }

.tree-nav-link:hover { color: #ffffff !important; background-color: #4a5568; }

.tree-nav-link.active { color: #ffffff !important; background-color: #4a5568 !important; font-weight: 500; border-left: 3px solid #4299e1 !important; }

.tree-nav-children { list-style: none; margin: 0.25rem 0; padding-left: 1rem; border-left: 1px solid #4a5568; display: none; }

.tree-nav-child .tree-nav-link { font-size: 0.8125rem; padding: 0.5rem 0.75rem; color: #a7d7f6 !important; }

.tree-nav-child .tree-nav-link.active { background-color: #556177 !important; border-left: 3px solid #63b3ed !important; }

.tree-nav-grandchildren { list-style: none; margin: 0.25rem 0; padding-left: 1rem; border-left: 1px solid #556177; display: none; }

.tree-nav-grandchild .tree-nav-link { font-size: 0.75rem; padding: 0.375rem 0.75rem; color: #bee2f9 !important; }

.tree-nav-grandchild .tree-nav-link.active { background-color: #5b6880 !important; border-left: 3px solid #90cdf4 !important; }

/* 6. 折叠展开功能优化 */
.tree-nav-item.has-children { position: relative; }

.tree-nav-parent { cursor: pointer; position: relative; padding-right: 2.5rem !important; display: flex; align-items: center; gap: 0.5rem; color: #90cdf4 !important; transition: all 0.2s ease; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; flex: 1; }

.tree-nav-parent:hover { color: #ffffff !important; background-color: #4a5568; }

.tree-nav-parent.active { background-color: #505c71 !important; }

.tree-nav-arrow { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); font-size: 0.75rem; transition: transform 0.2s ease; color: #90cdf4; flex-shrink: 0; }

.tree-nav-item.has-children.expanded .tree-nav-arrow { transform: translateY(-50%) rotate(90deg); }

/* 7. 页面布局优化 */
.page.clearfix.index-layout { display: flex; background: #4a5568; transition: margin-left 0.3s ease, max-width 0.3s ease; }

.index-content { flex: 1; padding: 2rem; background: #4a5568; }

.index-content::-webkit-scrollbar { width: 8px; }

/* 8. 工具提示优化 */
.tree-nav-link.truncated, .tree-nav-parent.truncated { cursor: help; position: relative; }

.tree-nav-link.truncated:hover::after, .tree-nav-parent.truncated:hover::after { content: attr(title); position: absolute; left: 50%; bottom: 100%; transform: translateX(-50%); background: #1a202c; color: white; padding: 0.5rem 0.75rem; border-radius: 4px; font-size: 0.75rem; white-space: nowrap; z-index: 1000; margin-bottom: 0.5rem; max-width: 250px; overflow: hidden; text-overflow: ellipsis; }

/* 9. 响应式设计优化 - 增强版 */
/* 中等屏幕适配 */
@media (max-width: 1200px) { .tree-nav-sidebar { width: 280px !important; } .tree-nav-resizer { left: calc(280px - 2px); } .main-container, .page.clearfix.index-layout { margin-left: 280px !important; max-width: calc(100% - 280px) !important; } }

/* 小屏幕适配 - 隐藏导航栏，使用弹窗模式 */
@media (max-width: 1024px) { body { /* 在小屏幕下强制隐藏导航栏 */ } body.nav-hidden .main-container, body.nav-hidden .page.clearfix.index-layout, body:not(.nav-hidden) .main-container, body:not(.nav-hidden) .page.clearfix.index-layout { margin-left: 0 !important; max-width: 100vw !important; } body.nav-hidden .tree-nav-sidebar, body:not(.nav-hidden) .tree-nav-sidebar { display: none !important; transform: translateX(-100%); } body.nav-hidden .tree-nav-resizer, body:not(.nav-hidden) .tree-nav-resizer { display: none !important; } /* 小屏幕下的导航栏样式调整 */ .tree-nav-sidebar { width: 320px !important; /* 弹窗宽度 */ } }

/* 移动端适配 */
@media (max-width: 768px) { .tree-nav-sidebar { width: 100% !important; /* 移动端全屏弹窗 */ max-height: 100vh; transform: translateX(-100%); transition: transform 0.3s ease; } .tree-nav-sidebar::-webkit-scrollbar { width: 6px; } .tree-nav-resizer { display: none; } .main-container, .page.clearfix.index-layout { margin-left: 0 !important; max-width: 100% !important; } .main-content, .index-content { padding: 1rem; } /* 移动端弹窗全屏样式 */ body.nav-mobile-open .tree-nav-sidebar { width: 100% !important; transform: translateX(0) !important; } }

/* 超小屏幕适配 */
@media (max-width: 480px) { .tree-nav-sidebar { padding: 1rem 0.75rem; } .tree-nav-link { padding: 0.625rem; font-size: 0.8125rem; } .tree-nav-parent { padding-right: 2rem !important; } .tree-nav-arrow { right: 0.75rem; } }

/* 10. 性能优化 */
.tree-nav-sidebar { will-change: transform; backface-visibility: hidden; }

.tree-nav-link, .tree-nav-parent { transition: all 0.2s ease !important; transform: translateZ(0); }

/* 11. 加载状态优化 */
.main-content.loading, .index-content.loading { opacity: 0.8; transition: opacity 0.2s ease; }

/* 12. 统一背景色 */
.tree-nav-sidebar, .tree-nav, .tree-nav-list, .tree-nav-children, .tree-nav-grandchildren { background: #2d3748 !important; }

.main-container, .main-content, .index-content, .page.clearfix.index-layout { background: #4a5568 !important; }

/* 13. 确保所有文本容器都能正确截断 */
.tree-nav-item { overflow: hidden; }

.tree-nav-link span, .tree-nav-parent span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }

/* ===== 强制覆盖样式 - 解决CSS优先级问题 ===== */
/* 最高优先级：使用ID选择器 + !important */
body.nav-mobile-open #treeNavSidebar, body.nav-mobile-open .tree-nav-sidebar { display: block !important; transform: translateX(0) !important; opacity: 1 !important; visibility: visible !important; z-index: 9999 !important; position: fixed !important; left: 0 !important; top: 0 !important; width: 320px !important; height: 100vh !important; }

/* 移动端全屏 */
@media (max-width: 768px) { body.nav-mobile-open #treeNavSidebar, body.nav-mobile-open .tree-nav-sidebar { width: 100% !important; } }

/* 隐藏状态 */
body.nav-hidden #treeNavSidebar, body.nav-hidden .tree-nav-sidebar { display: none !important; }

/* 大屏幕显示状态 */
@media (min-width: 1025px) { body:not(.nav-hidden) #treeNavSidebar, body:not(.nav-hidden) .tree-nav-sidebar { display: block !important; transform: translateX(0) !important; } }

/* ===== 移动端弹窗样式修复 ===== */
/* 小屏幕弹窗模式 - 修复为左侧弹窗 */
body.nav-mobile-open { /* 阻止背景滚动 */ overflow: hidden; position: relative; /* 遮罩层 */ /* 导航栏 - 左侧弹窗形式 */ }

body.nav-mobile-open::before { content: '' !important; position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important; background: rgba(0, 0, 0, 0.5) !important; z-index: 9998 !important; pointer-events: all !important; display: block !important; opacity: 1 !important; visibility: visible !important; }

body.nav-mobile-open #treeNavSidebar, body.nav-mobile-open .tree-nav-sidebar { display: block !important; transform: translateX(0) !important; box-shadow: 2px 0 20px rgba(0, 0, 0, 0.3) !important; z-index: 9999 !important; opacity: 1 !important; visibility: visible !important; position: fixed !important; left: 0 !important; top: 0 !important; width: 320px !important; /* 固定宽度，不是100% */ height: 100vh !important; max-width: 85vw !important; /* 最大宽度为视口的85% */ background: #2d3748 !important; /* 确保背景色 */ border-right: 1px solid #4a5568 !important; overflow-y: auto !important; }

body.nav-mobile-open .main-container, body.nav-mobile-open .page.clearfix.index-layout { margin-left: 0 !important; max-width: 100vw !important; /* 主内容区域不需要移动 */ }

body.nav-mobile-open .tree-nav-resizer { display: none !important; }

/* 移动端适配 - 更小的屏幕 */
@media (max-width: 768px) { body.nav-mobile-open #treeNavSidebar, body.nav-mobile-open .tree-nav-sidebar { width: 280px !important; /* 在小屏幕上稍微窄一点 */ max-width: 80vw !important; } }

/* 超小屏幕适配 */
@media (max-width: 480px) { body.nav-mobile-open #treeNavSidebar, body.nav-mobile-open .tree-nav-sidebar { width: 260px !important; max-width: 75vw !important; } }

/* 大屏幕隐藏弹窗样式 */
@media (min-width: 1025px) { body.nav-mobile-open { /* 大屏幕下不使用弹窗模式 */ } body.nav-mobile-open::before { display: none !important; } body.nav-mobile-open #treeNavSidebar, body.nav-mobile-open .tree-nav-sidebar { position: fixed !important; left: 0 !important; width: var(--tree-nav-width, 300px) !important; transform: translateX(0) !important; box-shadow: none !important; max-width: none !important; } }

/* ===== 强制修复 Header 样式 ===== */
.main-container header { background: #2d3748 !important; height: 52px !important; color: #e2e8f0 !important; margin-bottom: 20px; }

.main-container header a { color: #90cdf4 !important; }

.main-container header a:hover { color: #ffffff !important; background-color: #4a5568 !important; }

.main-container header .brand { color: #90cdf4 !important; }

.main-container header small { color: #e2e8f0 !important; }

@media (max-width: 770px) { .main-container header { height: 48px !important; } }

/* ===== 浮动工具栏样式 ===== */
.floating-toolbar { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); background: rgba(45, 55, 72, 0.95); backdrop-filter: blur(10px); border: 1px solid rgba(74, 85, 104, 0.8); border-radius: 8px; padding: 6px 4px; z-index: 1000; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); transition: all 0.3s ease; width: 46px; }

.floating-toolbar:hover { background: rgba(45, 55, 72, 0.95); backdrop-filter: blur(10px); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); border-color: rgba(74, 85, 104, 0.8); }

@media (max-width: 768px) { .floating-toolbar { right: 10px; transform: translateY(-50%); padding: 4px 3px; width: 44px; background: transparent; border-color: transparent; box-shadow: none; backdrop-filter: none; /* 移动端默认收缩状态 */ /* 移动端展开状态 */ } .floating-toolbar:hover { background: transparent; backdrop-filter: none; box-shadow: none; } .floating-toolbar.mobile-collapsed { width: 36px !important; padding: 6px 2px !important; height: 36px !important; min-height: 36px !important; } .floating-toolbar.mobile-collapsed .toolbar-items { display: none; } .floating-toolbar.mobile-collapsed .toolbar-toggle { display: flex; opacity: 1; } .floating-toolbar.mobile-collapsed .toolbar-close { display: none; } .floating-toolbar.mobile-collapsed:hover { background: rgba(45, 55, 72, 0.8); border-color: rgba(74, 85, 104, 0.6); backdrop-filter: blur(10px); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); } .floating-toolbar.mobile-expanded { width: 44px !important; background: rgba(45, 55, 72, 0.95); border-color: rgba(74, 85, 104, 0.8); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); backdrop-filter: blur(10px); height: auto; min-height: 50px; } .floating-toolbar.mobile-expanded .toolbar-items { display: flex; opacity: 1; } .floating-toolbar.mobile-expanded .toolbar-toggle { display: none; } .floating-toolbar.mobile-expanded .toolbar-close { display: flex; opacity: 1; } .floating-toolbar:hover { background: rgba(45, 55, 72, 0.95); border-color: rgba(74, 85, 104, 0.8); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); backdrop-filter: blur(10px); } }

/* 添加关闭按钮样式 */
.toolbar-close { display: none; position: absolute; top: -8px; right: -8px; background: #e53e3e; border: none; color: white; cursor: pointer; padding: 4px; border-radius: 50%; width: 20px; height: 20px; font-size: 10px; line-height: 1; z-index: 1002; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3); transition: transform 0.2s ease; align-items: center; justify-content: center; }

.toolbar-close:hover { background: #c53030; transform: scale(1.1); }

.toolbar-close .toolbar-icon { width: 12px; height: 12px; }

.toolbar-toggle { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: transparent; border: none; color: #e2e8f0; cursor: pointer; padding: 6px; border-radius: 6px; transition: transform 0.2s ease; z-index: 1001; width: 36px; height: 36px; min-width: 36px; min-height: 36px; align-items: center; justify-content: center; }

.toolbar-toggle:hover { background: #4a5568; color: white; transform: translate(-50%, -50%) scale(1.05); }

.toolbar-toggle .toolbar-icon { width: 20px; height: 20px; margin: 0; }

.toolbar-items { display: flex; flex-direction: column; gap: 1px; transition: all 0.3s ease; /* 移动端展开时的动画 */ }

@media (max-width: 768px) { .floating-toolbar.mobile-expanded .toolbar-items { animation: toolbarExpand 0.3s ease; } }

@keyframes toolbarExpand { 0% { opacity: 0;
    transform: scale(0.8); }
  100% { opacity: 1;
    transform: scale(1); } }

.toolbar-item { display: flex; flex-direction: column; align-items: center; background: transparent; border: none; border-radius: 4px; padding: 6px 2px; color: #e2e8f0; cursor: pointer; transition: all 0.2s ease; position: relative; min-width: 0; text-align: center; width: 100%; }

.toolbar-item:hover { background: #4a5568; color: white; transform: translateY(-1px); }

.toolbar-item:active { transform: translateY(0) scale(0.98); }

.toolbar-item.active { background: #4299e1; color: white; }

.toolbar-icon { flex-shrink: 0; transition: transform 0.2s ease; margin-bottom: 2px; width: 18px; height: 18px; }

.toolbar-label { font-size: 10px; font-weight: 500; line-height: 1.1; white-space: nowrap; opacity: 1; width: 100%; text-align: center; }

/* 移动端适配 */
@media (max-width: 768px) { .toolbar-toggle { display: flex; } .toolbar-close { display: flex; } .floating-toolbar { /* 移动端默认收缩状态 */ /* 移动端展开状态 */ } .floating-toolbar.mobile-collapsed .toolbar-items { display: none; } .floating-toolbar.mobile-collapsed .toolbar-toggle { display: flex; } .floating-toolbar.mobile-collapsed .toolbar-close { display: none; } .floating-toolbar.mobile-expanded .toolbar-items { display: flex; } .floating-toolbar.mobile-expanded .toolbar-toggle { display: none; } .floating-toolbar.mobile-expanded .toolbar-close { display: flex; } }

/* 搜索模态框样式 */
.search-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); display: none; z-index: 9999; opacity: 0; transition: opacity 0.3s ease; }

.search-modal.active { display: block; opacity: 1; }

/* 搜索模态框内容 - 确保不干扰下拉列表定位 */
.search-modal-content { background: rgba(45, 55, 72, 0.95); border-radius: 12px; padding: 0; max-width: 500px; width: 90%; max-height: 80vh; overflow: visible !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); transform: translateY(-20px); transition: transform 0.3s ease; position: absolute; top: 100px; left: 50%; transform: translateX(-50%) translateY(-20px); z-index: 10000; }

.active .search-modal-content { transform: translateX(-50%) translateY(0); }

.search-header { display: flex; justify-content: space-between; align-items: center; padding: 20px; border-bottom: 1px solid rgba(74, 85, 104, 0.8); }

.search-header h3 { margin: 0; color: #e2e8f0; font-size: 1.2rem; }

.search-close { background: none; border: none; font-size: 24px; color: #e2e8f0; cursor: pointer; padding: 0; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }

.search-close:hover { background: #4a5568; color: white; }

/* 修复搜索下拉列表对齐问题 */
.search-input-container { padding: 20px; position: relative; overflow: visible !important; }

#searchInput { width: 100%; padding: 12px 16px; border: 1px solid rgba(74, 85, 104, 0.8); border-radius: 8px; background: rgba(55, 67, 88, 0.95); color: #e2e8f0; font-size: 14px; box-sizing: border-box; }

#searchInput:focus { outline: none; border-color: #4299e1; box-shadow: 0 0 0 2px rgba(66, 153, 225, 0.2); }

#searchInput::placeholder { color: rgba(107, 128, 163, 0.95); }

/* 修复下拉列表对齐 */
.search-results { position: absolute; top: 100%; left: 20px; right: 20px; background: rgba(45, 55, 72, 0.95); border: 1px solid rgba(74, 85, 104, 0.8); border-radius: 8px; max-height: 300px; overflow-y: auto; z-index: 10001; display: none; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); margin-top: 4px; box-sizing: border-box; }

.search-results.has-results { display: block !important; visibility: visible !important; opacity: 1 !important; }

.search-result-item { padding: 12px; border-bottom: 1px solid rgba(74, 85, 104, 0.8); cursor: pointer; transition: all 0.2s ease; }

.search-result-item:hover { background: #556177; transform: translateX(2px); }

.search-result-item.active { background: #4299e1 !important; color: white !important; transform: translateX(4px); }

.search-result-item.active .result-title, .search-result-item.active .result-url { color: white !important; }

.search-result-item.active mark { background: rgba(255, 255, 255, 0.3) !important; color: white !important; }

.search-result-item:last-child { border-bottom: none; }

.search-result-item .result-title { font-weight: 600; color: #e2e8f0; margin-bottom: 4px; line-height: 1.4; }

.search-result-item .result-title mark { background: #4299e1; color: white; padding: 0 2px; border-radius: 2px; font-weight: bold; }

.search-result-item .result-url { font-size: 11px; color: rgba(139, 155, 182, 0.95); font-family: monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 赞赏模态框样式 */
.donate-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); display: none; align-items: center; justify-content: center; z-index: 2000; opacity: 0; transition: opacity 0.3s ease; }

.donate-modal.active { display: flex; opacity: 1; }

.donate-modal-content { background: rgba(45, 55, 72, 0.95); border-radius: 12px; padding: 0; max-width: 500px; width: 90%; max-height: 80vh; overflow: hidden; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); transform: translateY(-20px); transition: transform 0.3s ease; }

.active .donate-modal-content { transform: translateY(0); }

.donate-header { display: flex; justify-content: space-between; align-items: center; padding: 20px; border-bottom: 1px solid rgba(74, 85, 104, 0.8); }

.donate-header h3 { margin: 0; color: #e2e8f0; font-size: 1.2rem; }

.donate-close { background: none; border: none; font-size: 24px; color: #e2e8f0; cursor: pointer; padding: 0; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }

.donate-close:hover { background: #4a5568; color: white; }

.donate-body { padding: 20px; text-align: center; }

.donate-body p { margin-bottom: 20px; color: #e2e8f0; line-height: 1.5; }

.donate-images { display: flex; gap: 20px; justify-content: center; flex-wrap: wrap; }

.donate-image { text-align: center; }

.donate-image img { width: 150px; height: 150px; border-radius: 8px; border: 2px solid rgba(74, 85, 104, 0.8); transition: border-color 0.2s ease; }

.donate-image img:hover { border-color: #4299e1; }

.donate-image span { display: block; margin-top: 8px; color: #e2e8f0; font-size: 12px; }

/* 导航栏隐藏时的工具栏位置调整 */
body:not(.nav-visible) .floating-toolbar { right: 20px; }

@media (max-width: 480px) { .floating-toolbar { padding: 4px 2px; right: 8px; width: 44px; } .floating-toolbar.mobile-collapsed { width: 32px !important; padding: 6px 1px !important; height: 32px !important; min-height: 32px !important; } .floating-toolbar.mobile-expanded { width: 42px !important; } .toolbar-toggle .toolbar-icon { width: 18px; height: 18px; } .toolbar-close { top: -6px; right: -6px; width: 18px; height: 18px; } .toolbar-close .toolbar-icon { width: 10px; height: 10px; } }

@media (max-width: 360px) { .search-modal-content { top: 60px; width: 98%; } .search-results { left: 10px; right: 10px; max-height: 200px; } .floating-toolbar { right: 5px; width: 40px; } .donate-images { flex-direction: column; align-items: center; } }

/* 高对比度模式支持 */
@media (prefers-contrast: high) { .floating-toolbar { border: 2px solid #e2e8f0; } .toolbar-item { border: 1px solid transparent; } .toolbar-item:hover { border-color: #e2e8f0; } .search-results { border: 2px solid rgba(74, 85, 104, 0.8); } .search-result-item { border-bottom: 2px solid rgba(74, 85, 104, 0.8); } .search-result-item.active { border-left: 4px solid #4299e1; } }

/* 减少动画模式支持 */
@media (prefers-reduced-motion: reduce) { .floating-toolbar, .toolbar-item, .search-modal, .search-modal-content, .search-result-item, .donate-modal, .donate-modal-content { transition: none; } .search-result-item:hover, .search-result-item.active { transform: none; } }

@media (max-width: 480px) { .search-input-container { padding: 10px; } .search-results { left: 10px; right: 10px; max-height: 200px; } }

/* ===== TOC 侧边栏样式 ===== */
.toc-sidebar { position: fixed; top: 50%; right: 68px; transform: translateY(-50%); width: 250px; max-height: 80vh; background: rgba(45, 55, 72, 0.95); backdrop-filter: blur(10px); border: 1px solid rgba(74, 85, 104, 0.8); border-radius: 12px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); z-index: 999; opacity: 0; visibility: hidden; transition: all 0.3s ease; }

.toc-sidebar.active { opacity: 1; visibility: visible; }

.toc-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid rgba(74, 85, 104, 0.8); }

.toc-header h3 { margin: 0; color: #e2e8f0; font-size: 1rem; font-weight: 600; }

.toc-close { background: none; border: none; font-size: 20px; color: #e2e8f0; cursor: pointer; padding: 0; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }

.toc-close:hover { background: #4a5568; color: white; }

.toc-content { padding: 16px 20px; max-height: calc(80vh - 68px); overflow-y: auto; }

.toc-content::-webkit-scrollbar { width: 4px; }

.toc-content::-webkit-scrollbar-track { background: transparent; }

.toc-content::-webkit-scrollbar-thumb { background: rgba(74, 85, 104, 0.8); border-radius: 2px; }

.toc-content::-webkit-scrollbar-thumb:hover { background: #4299e1; }

/* TOC 列表样式 */
.toc-list { list-style: none; margin: 0; padding: 0; }

.toc-item { margin-bottom: 6px; }

.toc-item:last-child { margin-bottom: 0; }

.toc-link { display: block; padding: 6px 10px; color: #e2e8f0; text-decoration: none; border-radius: 6px; transition: all 0.2s ease; border-left: 2px solid transparent; font-size: 13px; line-height: 1.4; }

.toc-link:hover { background: #4a5568; color: white; transform: translateX(2px); }

.toc-link.active { background: #4299e1; color: white; border-left-color: white; font-weight: 500; box-shadow: 0 2px 6px rgba(66, 153, 225, 0.3); }

.toc-link.active:hover { background: #2180cf; transform: translateX(2px); }

/* TOC 层级样式 */
.toc-level-1 { padding-left: 0; font-size: 14px; font-weight: 600; }

.toc-level-2 { padding-left: 12px; }

.toc-level-3 { padding-left: 24px; }

.toc-level-4 { padding-left: 36px; }

.toc-level-5 { padding-left: 48px; }

.toc-level-6 { padding-left: 60px; }

/* 空状态样式 */
.toc-empty { text-align: center; color: rgba(139, 155, 182, 0.95); font-size: 13px; padding: 20px 0; }

/* 移动端适配 */
@media (max-width: 768px) { .toc-sidebar { right: 56px; width: 220px; max-height: 70vh; } .toc-header { padding: 14px 16px; } .toc-header h3 { font-size: 0.95rem; } .toc-content { padding: 14px 16px; max-height: calc(70vh - 62px); } .toc-link { padding: 5px 8px; font-size: 12px; } .toc-level-1 { font-size: 13px; } .toc-level-2 { padding-left: 10px; } .toc-level-3 { padding-left: 20px; } .toc-level-4 { padding-left: 30px; } .toc-level-5 { padding-left: 40px; } .toc-level-6 { padding-left: 50px; } }

@media (max-width: 480px) { .toc-sidebar { right: 44px; width: 200px; max-height: 60vh; } .toc-header { padding: 12px 14px; } .toc-header h3 { font-size: 0.9rem; } .toc-content { padding: 12px 14px; max-height: calc(60vh - 56px); } .toc-link { padding: 4px 8px; font-size: 11px; } .toc-level-1 { font-size: 12px; } .toc-level-2 { padding-left: 8px; } .toc-level-3 { padding-left: 16px; } .toc-level-4 { padding-left: 24px; } .toc-level-5 { padding-left: 32px; } .toc-level-6 { padding-left: 40px; } }

/* 高对比度模式支持 */
@media (prefers-contrast: high) { .toc-sidebar { border: 2px solid #e2e8f0; } .toc-link { border-left: 2px solid transparent; } .toc-link.active { border-left: 2px solid white; border: 2px solid white; } }

/* 减少动画模式支持 */
@media (prefers-reduced-motion: reduce) { .toc-sidebar { transition: none; } .toc-link { transition: none; } .toc-link:hover { transform: none; } }

/* ===== 赞赏侧边栏样式 ===== */
.donate-sidebar { position: fixed; top: 50%; right: 68px; transform: translateY(-50%); width: 250px; max-height: 80vh; background: rgba(45, 55, 72, 0.95); backdrop-filter: blur(10px); border: 1px solid rgba(74, 85, 104, 0.8); border-radius: 12px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); z-index: 999; opacity: 0; visibility: hidden; transition: all 0.3s ease; }

.donate-sidebar.active { opacity: 1; visibility: visible; }

.donate-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid rgba(74, 85, 104, 0.8); }

.donate-header h3 { margin: 0; color: #e2e8f0; font-size: 1rem; font-weight: 600; }

.donate-close { background: none; border: none; font-size: 20px; color: #e2e8f0; cursor: pointer; padding: 0; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }

.donate-close:hover { background: #4a5568; color: white; }

.donate-body { padding: 16px 20px; }

.donate-body p { margin-bottom: 16px; color: #e2e8f0; line-height: 1.5; font-size: 13px; text-align: center; }

.donate-images { display: flex; flex-direction: column; gap: 16px; align-items: center; }

.donate-image { text-align: center; }

.donate-image img { width: 120px; height: 120px; border-radius: 8px; border: 2px solid rgba(74, 85, 104, 0.8); transition: border-color 0.2s ease; }

.donate-image img:hover { border-color: #4299e1; }

.donate-image span { display: block; margin-top: 8px; color: #e2e8f0; font-size: 12px; }

/* 移动端适配 */
@media (max-width: 768px) { .donate-sidebar { right: 56px; width: 220px; max-height: 70vh; } .donate-header { padding: 14px 16px; } .donate-body { padding: 14px 16px; } .donate-image img { width: 100px; height: 100px; } }

@media (max-width: 480px) { .donate-sidebar { right: 44px; width: 200px; max-height: 60vh; } .donate-header { padding: 12px 14px; } .donate-body { padding: 12px 14px; } .donate-image img { width: 90px; height: 90px; } }

/* ===== 关注侧边栏样式 ===== */
.follow-sidebar { position: fixed; top: 50%; right: 68px; transform: translateY(-50%); width: 250px; max-height: 80vh; background: rgba(45, 55, 72, 0.95); backdrop-filter: blur(10px); border: 1px solid rgba(74, 85, 104, 0.8); border-radius: 12px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); z-index: 999; opacity: 0; visibility: hidden; transition: all 0.3s ease; }

.follow-sidebar.active { opacity: 1; visibility: visible; }

.follow-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid rgba(74, 85, 104, 0.8); }

.follow-header h3 { margin: 0; color: #e2e8f0; font-size: 1rem; font-weight: 600; }

.follow-close { background: none; border: none; font-size: 20px; color: #e2e8f0; cursor: pointer; padding: 0; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }

.follow-close:hover { background: #4a5568; color: white; }

.follow-body { padding: 16px 20px; }

.follow-body p { margin-bottom: 16px; color: #e2e8f0; line-height: 1.5; font-size: 13px; text-align: center; }

.follow-images { display: flex; flex-direction: column; gap: 16px; align-items: center; }

.follow-image { text-align: center; }

.follow-image img { width: 120px; height: 120px; border-radius: 8px; border: 2px solid rgba(74, 85, 104, 0.8); transition: border-color 0.2s ease; }

.follow-image img:hover { border-color: #4299e1; }

.follow-image span { display: block; margin-top: 8px; color: #e2e8f0; font-size: 12px; }

/* 移动端适配 */
@media (max-width: 768px) { .follow-sidebar { right: 56px; width: 220px; max-height: 70vh; } .follow-header { padding: 14px 16px; } .follow-body { padding: 14px 16px; } .follow-image img { width: 100px; height: 100px; } }

@media (max-width: 480px) { .follow-sidebar { right: 44px; width: 200px; max-height: 60vh; } .follow-header { padding: 12px 14px; } .follow-body { padding: 12px 14px; } .follow-image img { width: 90px; height: 90px; } }

/* 修复从移动端切回 PC 模式时背景透明问题 */
@media (min-width: 769px) { .floating-toolbar { background: rgba(45, 55, 72, 0.95) !important; border-color: rgba(74, 85, 104, 0.8) !important; backdrop-filter: blur(10px) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important; width: 46px !important; padding: 6px 4px !important; } /* 清除移动端状态影响 */ .floating-toolbar.mobile-expanded, .floating-toolbar.mobile-collapsed { background: rgba(45, 55, 72, 0.95) !important; border-color: rgba(74, 85, 104, 0.8) !important; backdrop-filter: blur(10px) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important; width: 46px !important; padding: 6px 4px !important; height: auto !important; min-height: 0 !important; } }

@media (min-width: 769px) { .floating-toolbar.desktop-restored { background: rgba(45, 55, 72, 0.95) !important; border-color: rgba(74, 85, 104, 0.8) !important; backdrop-filter: blur(10px) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important; width: 46px !important; padding: 6px 4px !important; } }

/*# sourceMappingURL=main.css.map */