/*--------------------------------------------------------------------------------------------*/

/* 设置等宽字体 */
/* xj.base 默认字体并不是等间距的，但做文档还是等间距字体更好，所以在这里重新设置一次 Iosevka */
/* 黑白主题的内容还不完善，不少插件有待改进就暂不启用了，把文本打散换行在移动端小屏幕会好看些 */

@font-face{font-family:"Iosevka";font-weight:normal;font-style:normal; src:url("../font/iosevka/34.1.0/IosevkaFixed-Regular.woff2?time=2026-03-18T00:00:00UTC+8") format('woff2');}
@font-face{font-family:"Iosevka";font-weight:bold;  font-style:normal; src:url("../font/iosevka/34.1.0/IosevkaFixed-Bold.woff2?time=2026-03-18T00:00:00UTC+8") format('woff2');}
@font-face{font-family:"Iosevka";font-weight:normal;font-style:oblique;src:url("../font/iosevka/34.1.0/IosevkaFixed-Oblique.woff2?time=2026-03-18T00:00:00UTC+8") format('woff2');}
@font-face{font-family:"Iosevka";font-weight:bold;  font-style:oblique;src:url("../font/iosevka/34.1.0/IosevkaFixed-BoldOblique.woff2?time=2026-03-18T00:00:00UTC+8") format('woff2');}

@font-face{font-family:"NotoSans";font-weight:normal;font-style:normal; src:url("../font/notosans/2.004/NotoSansSC-Regular.woff2?time=2026-03-18T00:00:00UTC+8") format('woff2');}
@font-face{font-family:"NotoSans";font-weight:bold;  font-style:normal; src:url("../font/notosans/2.004/NotoSansSC-Bold.woff2?time=2026-03-18T00:00:00UTC+8") format('woff2');}

.xj-basic-white{
--xj-bodyGradient:rgba(204,204,204,0.5);
}
.xj-basic-black{
--xj-bodyGradient:rgba(102,102,102,0.5);
}

html{overflow-x:auto;overflow-y:scroll;}
html:is([lang|="zh"]){word-break:break-all;line-break:anywhere;}
body{background-repeat:no-repeat;background-position:center left, center right;background-size:4px 100%, 4px 100%;}
body{background-color:var(--xj-f0f0f0);background-image:linear-gradient(90deg, var(--xj-bodyGradient) 0%, transparent 100%), linear-gradient(90deg, transparent 0%, var(--xj-bodyGradient) 100%);}



/* ------------------------------------------------------------------------------------------ */

/* 左边的侧边栏 */
#pub_pack{display:flex;margin:0 auto;width:1280px;}

#pub_lang{position:fixed;top:0;left:0;display:flex;opacity:0;pointer-events:none;}

#pub_side{flex:0 0 auto;position:sticky;
top:0px;align-self:flex-start;width:240px;background-color:var(--xj-fff);}
#pub_wrap{display:flex;flex-direction:column;flex:0 0 auto;margin-left:16px;width:1024px;gap:16px;}



/* 顶部的导航栏 */
#pub_head{display:flex;align-items:center;flex:0 0 auto;padding:0 32px;height:64px;background-color:var(--xj-fff);}

#pub_headText{flex:1 1 auto;margin-bottom:0;font-weight:normal;line-height:1;}
#pub_headText a{display:inline-block;}
#pub_headText span{display:inline-block;font-size:32px;line-height:40px;}
#pub_headText small{position:relative;top:2px;display:inline-block;margin-left:8px;font-size:16px;line-height:16px;}

#pub_headForm{position:relative;flex:0 0 auto;margin-left:8px;width:200px;height:40px;}
#pub_headFormText{width:200px;}
#pub_headFormIcon{position:absolute;top:0;right:0;z-index:40;width:40px;
padding:0;color:var(--xj-999);}

#pub_headCode{flex:0 0 auto;margin-left:8px;padding:0;width:40px;color:var(--xj-999);}
#pub_headLang{flex:0 0 auto;margin-left:8px;padding:0;width:40px;color:var(--xj-999);}
#pub_headBulb{flex:0 0 auto;margin-left:8px;padding:0;width:40px;color:var(--xj-999);}



/* 中间主体部分 */
#pub_main{flex:1 1 auto;display:flex;flex-direction:column;gap:16px;}

#pub_main > section{flex:0 0 auto;
padding:32px 32px 16px;background-color:var(--xj-fff);}

#pub_main > section:last-of-type{flex:1 1 auto;}

#pub_main h2{font-weight:normal;}
#pub_main h3{font-weight:normal;}
#pub_main h4{font-weight:normal;}
#pub_main h5{font-weight:normal;}
#pub_main h6{font-weight:normal;}



/* 最后面的注脚 */
#pub_foot{flex:0 0 auto;padding:12px 32px;height:64px;line-height:20px;background-color:var(--xj-fff);}



/* 左侧的工具栏 */
#pub_tool{position:fixed;bottom:0;left:0;z-index:40;width:100%;height:4px;background-color:transparent;}
#pub_toolPack{position:relative;margin:0 auto;max-width:1280px;height:4px;background-color:transparent;}

#pub_toolBackToTop{position:absolute;bottom:12px;padding:0;width:40px;right:80px;box-shadow:0 4px 8px rgba(0,0,0,0.5);color:var(--xj-999);}
#pub_toolNavigated{position:absolute;bottom:12px;padding:0;width:40px;right:32px;box-shadow:0 4px 8px rgba(0,0,0,0.5);color:var(--xj-999);}

#pub_toolAnchorTip{position:absolute;right:32px;bottom:60px;padding:4px;min-width:88px;border:1px solid var(--xj-ccc);border-radius:4px;background-color:var(--xj-fff);box-shadow:0 4px 8px rgba(0,0,0,0.5);font-size:12px;line-height:16px;opacity:0.5;}
#pub_toolAnchorTip:before{position:absolute;right:10px;bottom:-8px;width:0;height:0;border:8px solid transparent;border-top-color:var(--xj-ccc);border-bottom:0;content:"";}
#pub_toolAnchorTip:after{position:absolute;right:12px;bottom:-6px;width:0;height:0;border:6px solid transparent;border-top-color:var(--xj-fff);border-bottom:0;content:"";}
#pub_toolAnchorTip:hover{opacity:1;}

#pub_toolAnchorTip a{display:block;padding:4px 2px;text-align:right;}
#pub_toolAnchorTip a:hover{background-color:var(--xj-f0f0f0);}



/* 全局宽高尺寸 */
#pub_size{position:fixed;top:0;right:0;bottom:0;left:0;
z-index:-1;background-color:var(--xj-ccc);box-shadow:0 0 0 10px #f00 inset;font-size:36px;opacity:0;pointer-events:none;}



/*--------------------------------------------------------------------------------------------*/

/* 只有当 summary 的 display:list-item 才会有 ::marker 伪元素, 它仅支持字体属性, white-space, */
/* color, text-combine-upright, unicode-bidi, direction, content 这些样式, 并不支持背景的设置 */
/* summary 里有 block 标签如 h2, 文本过长会导致小三角和文本换行, 所以改用伪元素背景实现小三角 */
/* summary 使用 flex 布局, 以便换行时小三角能够垂直居中, summary 此时就只能有单个直接子元素了 */
/* 如果没有明文设置 summary, 浏览器也会自动帮忙补上, 但样式可能就不生效了, 所以千万不要这样做 */
/* 内容复杂时在 summary 后面用 div 包裹内容, 因为使用了通配符 * 所以用单个 p 标签放内容也可以 */

details{display:block;margin:0px 0px 16px 0px;}

details > summary{display:flex;list-style:none;counter-increment:none;padding:8px;cursor:pointer;box-shadow:0 0 0 1px var(--xj-ccc) inset;}
details[open] > summary{background-color:var(--xj-f0f0f0);}
details > summary > *{margin-bottom:0;}

details > summary::marker{display:none;}
details > summary::before{flex:0 0 24px;content:" ";background-position:left center;background-repeat:no-repeat;background-image:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23999' d='M4 14V2l8 6z'/%3E%3C/svg%3E");}
details[open] > summary::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%23999' d='M2 4h12l-6 8-6-8z'/%3E%3C/svg%3E");}

details > content{display:block;margin-top:-1px;padding:16px;box-shadow:0 0 0 1px var(--xj-ccc) inset;}
details > content > *:last-child{margin-bottom:0;}

/* 紧凑模式, 用 div 容器包裹, 就无须每个标签都添加类名了, xj.theme 其他标签包裹也改用 wrap 吧 */
.details-wrap{padding-top:1px;margin-bottom:16px;}
.details-wrap > details{margin-top:-1px;margin-bottom:0;}

/* 也许全部改成 revert, 具体等 xj.theme 重构再决定吧 */
.details-unset{margin-bottom:0;}
.details-unset > summary{padding:0;border:none;}
.details-unset > content{margin-top:0;padding:0;border:0;}
.details-unset > content > *:last-child{margin-bottom:revert;}

.summary-unset{padding:0;border:none;}
.summary-unset + *{margin-top:0;padding:0;border:0;}
.summary-unset + * > *:last-child{margin-bottom:revert;}



/*--------------------------------------------------------------------------------------------*/

/* IE11- 和 Edge15- 完全不支持 sticky 属性 */
/* Safari V12.1- 的 sticky 属性值需要添加 -webkit- 前缀 */
/* Chrome V56~90 和 Edge V16~18, 只支持 th 标签实现 sticky 属性值定位 */

/* 必须为 th 设置背景色, 否则往下滚后, 内容会重叠, 但 Chrome 的背景色会覆盖掉边框, 得另想办法 */
/* 最后发现可以使用 border-collapse:separate 让边框不折叠, 再单独设置表格的边框, 就能解决问题 */

.powerTable{border-collapse:separate;}

.powerTable thead th{position:sticky;top:0;z-index:32;background-color:var(--xj-fff);cursor:pointer;}
.powerTable thead th .icon{color:var(--xj-ccc);}
.powerTable thead th .icon.fa-sort-up{color:#39f;}
.powerTable thead th .icon.fa-sort-down{color:#39f;}
.powerTable thead th span{display:inline-block;vertical-align:middle;}

.powerTable thead th{border:none;border-right:1px solid var(--xj-ccc);border-bottom:3px solid var(--xj-ccc);border-top:1px solid var(--xj-ccc);}
.powerTable thead th:first-child{border-left:1px solid var(--xj-ccc);}

.powerTable tbody td{border:none;border-right:1px solid var(--xj-ccc);border-bottom:1px solid var(--xj-ccc);vertical-align:middle;}
.powerTable tbody td:first-child{border-left:1px solid var(--xj-ccc);}

.powerTable tfoot th{border:none;border-right:1px solid var(--xj-ccc);border-bottom:1px solid var(--xj-ccc);vertical-align:middle;}
.powerTable tfoot th:first-child{border-left:1px solid var(--xj-ccc);}

/* 翻译后表头不要加粗, 也不要拉大字母间距 */
html:not([lang|="zh"]) .powerTable thead th span b{letter-spacing:0px!important;font-weight:normal!important;}
.powerTable thead th span b[_msttexthash][_msthash]{letter-spacing:0px!important;font-weight:normal!important;}

/* document.getElementById('trLength01').textContent = trShowIndexArray.length;
<tfoot><tr><td>项目统计</td><td id="trLength01" colSpan="99"></td></tr></tfoot>
.powerTable tfoot td{border:none;border-right:1px solid var(--xj-ccc);border-bottom:1px solid var(--xj-ccc);background-color:var(--xj-fff);box-shadow:0 -1px 0 var(--xj-ccc);}
.powerTable tfoot td{vertical-align:middle;height:28px;position:sticky;bottom:0;z-index:32;color:var(--xj-999);}
.powerTable tfoot td:first-child{border-left:1px solid var(--xj-ccc);text-align:center;}*/



/*--------------------------------------------------------------------------------------------*/

/* 自定义中日韩英控制标签, 留着一份原生中文不设置 lang="xx" translate="no" 属性, 方便机翻处理 */
zh-hans-i, zh-hant-i, ja-i, ko-i, en-i, ud-i{display:inline;}
zh-hans-b, zh-hant-b, ja-b, ko-b, en-b, ud-b{display:block;}
zh-hans-t, zh-hant-t, ja-t, ko-t, en-t, ud-t{display:table;}
zh-hans-f, zh-hant-f, ja-f, ko-f, en-f, ud-f{display:flex;}
zh-hans-g, zh-hant-g, ja-g, ko-g, en-g, ud-g{display:grid;}

zh-hans-ib, zh-hant-ib, ja-ib, ko-ib, en-ib, ud-ib{display:inline-block;}
zh-hans-it, zh-hant-it, ja-it, ko-it, en-it, ud-it{display:inline-table;}
zh-hans-if, zh-hant-if, ja-if, ko-if, en-if, ud-if{display:inline-flex;}
zh-hans-ig, zh-hant-ig, ja-ig, ko-ig, en-ig, ud-ig{display:inline-grid;}

html:not([lang="zh-hans"]):not([lang="zh-cn"]):not([lang="zh-sg"]):not([lang="zh-my"]):not([lang="auto"]) 
:is(zh-hans-i, zh-hans-b, zh-hans-t, zh-hans-f, zh-hans-g, zh-hans-ib, 
zh-hans-it, zh-hans-if, zh-hans-ig){display:none;}

html:not([lang="zh-hant"]):not([lang="zh-hk"]):not([lang="zh-mo"]):not([lang="zh-tw"]) 
:is(zh-hant-i, zh-hant-b, zh-hant-t, zh-hant-f, zh-hant-g, zh-hant-ib, 
zh-hant-it, zh-hant-if, zh-hant-ig){display:none;}

html:not([lang="zh"]) :is(zh-i, zh-b, zh-t, zh-f, zh-g, zh-ib, zh-it, zh-if, zh-ig){display:none;}
html:not([lang="ja"]) :is(ja-i, ja-b, ja-t, ja-f, ja-g, ja-ib, ja-it, ja-if, ja-ig){display:none;}
html:not([lang="ko"]) :is(ko-i, ko-b, ko-t, ko-f, ko-g, ko-ib, ko-it, ko-if, ko-ig){display:none;}

html:not([lang="en"]) :is(en-i, en-b, en-t, en-f, en-g, en-ib, en-it, en-if, en-ig){display:none;}
html:not([lang="ud"]) :is(ud-i, ud-b, ud-t, ud-f, ud-g, ud-ib, ud-it, ud-if, ud-ig){display:none;}

/* 使用自定义 h 标签代替 <span style="display:none"></span> 和 <i hidden></i>, 尽量让文本更短 */
/* 现在改变了项目名称和文本描述的处理方式, 这个标签应该是用不上了, 但也没必要删了, 暂时先留着 */
h{display:none!important;}

/* 使用自定义 c 标签代替 code, 一方面输入更短, 另一方面浏览器翻译的时候也不会当作代码而不翻译 */
c{padding:0 0.5em;color:#f39;vertical-align:bottom;background-color:var(--xj-f0f0f0);}

/* 既 native bold, italic, 仅限环境有加粗或倾斜字体的情况, 不允许浏览器自动合成, 避免影响宽度 */
/* notoSans 字体只能它们自己使用, 如果设为全局, ib 标签会出现采用多种不同字体混排而出错的情况 */
ni{font-style:italic;font-synthesis:none;}
nb{font-weight:bolder;font-synthesis:none;}

html:is([lang|="zh"]) :is(ni,nb){font-family:var(--xj-codeFont-notoSans);}
html:not([lang|="zh"]) :is(ni,nb){font-family:var(--xj-textFont-notoSans);}

:is(ni,nb){
--xj-codeFont-notoSans:"Iosevka", "Iosevka Fixed", "Menlo", "Consolas", 
"Liberation Mono", "Courier New", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans CN", "NotoSans", monospace;
--xj-textFont-notoSans:"-apple-system", "Segoe UI", "Roboto", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans CN", "NotoSans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif;}


