/* STTTE Knowledge Base — R2 "Frostpaper" light reading theme.
   Tokens come from /css/site-tokens.css (linked before this file). No :root here. */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:var(--teal);text-decoration:none;transition:color .25s}
a:hover{color:var(--teal-deep)}
img{max-width:100%}
::selection{background:var(--teal);color:#fff}

/* sidebar width as a local var */
body{--sidebar-w:300px}

/* loading state */
#app{font-family:var(--mono);color:var(--ink-3);text-align:center;padding-top:40vh;letter-spacing:.2em}

/* ---------- sidebar ---------- */
.sidebar{
  position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-w);
  background:var(--paper-2);border-right:1px solid var(--line);
  padding:30px 0 40px;overflow-y:auto;z-index:20;transition:transform .3s ease;
}
.sidebar::-webkit-scrollbar{width:6px}
.sidebar::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.sidebar .app-name{padding:0 28px 6px;margin:0}
.sidebar .app-name a{
  font-family:var(--fraunces);font-size:24px;letter-spacing:.28em;
  color:var(--ink);font-weight:600;padding-left:.28em;
}
.sidebar .app-name a:hover{color:var(--ink)}
.kb-kicker{
  display:block;padding:0 28px 18px;margin-top:6px;
  font-family:var(--mono);font-size:10px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--teal);
}

/* search */
.sidebar .search{margin:0;padding:0 22px 16px;border:0}
.sidebar .search input{
  width:100%;background:var(--card);border:1px solid var(--line);border-radius:9px;
  padding:11px 14px;color:var(--ink);font-family:var(--sans);font-size:13.5px;
  outline:none;transition:border-color .25s,box-shadow .25s;
}
.sidebar .search input::placeholder{color:var(--ink-3)}
.sidebar .search input:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-wash)}
.sidebar .search .clear{color:var(--ink-3)}
.sidebar .search .results-panel{background:transparent;color:var(--ink-2)}
.sidebar .search .matching-post{border-bottom:1px solid var(--line-soft)}
.sidebar .search .matching-post:hover{background:var(--card)}
.sidebar .search p{color:var(--ink-2)}
.sidebar .search p.search-keyword{color:var(--teal-deep);background:var(--teal-wash)}
.sidebar .search h2{font-family:var(--mono);font-size:11px;color:var(--ink);letter-spacing:.1em}

/* nav */
.sidebar-nav{padding:4px 0}
.sidebar ul{list-style:none;margin:0;padding:0}
.sidebar-nav > ul > li{margin-top:0}
.sidebar-nav > ul > li:first-child{margin-top:6px}
/* 段标题（参考查询/检验知识…）= 一级"标题"：分隔线 + 深青加粗大写，明显高一级 */
.sidebar-nav > ul > li > p,
.sidebar-nav > ul > li > strong{
  display:block;position:relative;margin:22px 0 6px;padding:16px 40px 4px 28px;
  border-top:1px solid var(--line);cursor:pointer;
  font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--teal-deep);font-weight:700;
}
/* ---- 可折叠（docsify-sidebar-collapse）：折叠时隐藏子列表 + 段标题右侧箭头 ---- */
.sidebar-nav > ul > li.folder:not(.open) > ul{display:none}
/* 箭头只画在可折叠分组(.folder)，叶子项(.file: 知识库首页/回主站)不画 */
.sidebar-nav > ul > li.folder > strong::after,
.sidebar-nav > ul > li.folder > p::after{
  content:"";position:absolute;right:26px;top:21px;width:5px;height:5px;
  border-right:1.6px solid var(--teal);border-bottom:1.6px solid var(--teal);
  transform:rotate(-45deg);transition:transform .2s;opacity:.85;
}
.sidebar-nav > ul > li.folder.open > strong::after,
.sidebar-nav > ul > li.folder.open > p::after{transform:rotate(45deg);top:18px}
.sidebar-nav > ul > li.folder:hover > strong::after,
.sidebar-nav > ul > li.folder:hover > p::after{opacity:1;border-color:var(--teal-deep)}
/* 链接 */
.sidebar-nav a{
  display:block;padding:7px 26px;font-family:var(--cn);font-size:14px;font-weight:400;
  color:var(--ink-2);border-left:2px solid transparent;line-height:1.5;
  transition:color .22s,border-color .22s,background .22s;
}
.sidebar-nav a:hover{color:var(--ink);background:var(--card)}
.sidebar-nav li.active > a,.sidebar-nav a.active{
  color:var(--teal-deep);font-weight:500;
  border-left-color:var(--teal);background:#fff;
  box-shadow:inset 2px 0 0 var(--teal);
}
/* === 多级层次：段标题(一级) > 页面(二级) > 页内H2(三级) > 页内H3(四级) === */

/* 二级：页面名 —— 方块项目符，14px，略重，是“页面标题” */
.sidebar-nav > ul > li > ul > li > a{
  position:relative;padding:7px 22px 7px 33px;font-size:14px;color:var(--ink-2);font-weight:500;
}
.sidebar-nav > ul > li > ul > li > a::before{
  content:"";position:absolute;left:22px;top:.95em;width:5px;height:5px;
  border-radius:1.5px;background:var(--ink-3);transition:background .22s;
}
.sidebar-nav > ul > li > ul > li > a:hover::before,
.sidebar-nav > ul > li > ul > li.active > a::before{background:var(--teal)}

/* 三级+四级容器：左侧引导竖线，整体内缩 */
.sidebar-nav > ul > li > ul > li > ul{
  margin:3px 0 10px 33px;border-left:1px solid var(--line);
}

/* 三级：页内 H2 小标题 —— 12.5px，灰，短横引导 */
.sidebar-nav > ul > li > ul > li > ul > li > a{
  position:relative;padding:5px 16px 5px 16px;font-size:12.5px;
  color:var(--ink-3);font-weight:400;line-height:1.5;
}
/* 四级：页内 H3 —— 更小更缩更淡 */
.sidebar-nav > ul > li > ul > li > ul > li > ul > li > a{
  padding:3px 14px 3px 30px;font-size:11.5px;color:var(--ink-3);opacity:.78;
}
.sidebar-nav > ul > li > ul > li > ul a:hover{color:var(--ink-2);opacity:1}
.sidebar-nav > ul > li > ul > li > ul a.active,
.sidebar-nav > ul > li > ul > li > ul li.active > a{color:var(--teal-deep);font-weight:500;opacity:1}

/* ---------- content ---------- */
.content{position:absolute;top:0;right:0;left:var(--sidebar-w);transition:left .3s ease}
.markdown-section{
  max-width:760px;margin:0 auto;padding:70px 56px 120px;
}

/* headings — soft display serif */
.markdown-section h1,.markdown-section h2,.markdown-section h3,.markdown-section h4,.markdown-section h5,.markdown-section h6{
  font-family:var(--fraunces);color:var(--ink);font-weight:500;
  line-height:1.22;letter-spacing:.01em;
}
.markdown-section h1{
  font-family:var(--cn);font-weight:600;
  font-size:clamp(32px,4.4vw,40px);margin:0 0 16px;line-height:1.2;
}
.markdown-section h2{
  font-size:27px;margin:50px 0 18px;padding-top:26px;
  border-top:1px solid var(--line);
}
.markdown-section h3{font-size:21px;margin:34px 0 12px;color:var(--ink);font-weight:600}
.markdown-section h4{font-size:17px;margin:26px 0 10px;color:var(--ink);font-weight:600}
.markdown-section h5{font-family:var(--cn);font-size:15.5px;margin:22px 0 7px;color:var(--ink);font-weight:600}
.markdown-section h6{font-family:var(--cn);font-size:14px;margin:18px 0 6px;color:var(--ink-2);font-weight:600;letter-spacing:.03em}
.markdown-section h1 + p,.markdown-section h1 + blockquote{color:var(--ink)}

/* prose — the readability core */
.markdown-section p,.markdown-section li{
  font-family:var(--cn);font-size:17px;line-height:1.85;
  color:var(--ink-2);font-weight:400;
}
.markdown-section p{margin:0 0 22px;max-width:68ch}
.markdown-section strong{color:var(--ink);font-weight:600}
.markdown-section em{color:var(--teal);font-style:italic}
.markdown-section a{border-bottom:1px solid var(--teal-wash)}
.markdown-section a:hover{border-bottom-color:var(--teal)}
.markdown-section ul,.markdown-section ol{padding-left:1.4em;max-width:70ch;margin:.5em 0 1.05em}
.markdown-section li{margin:.3em 0;line-height:1.72;font-size:16px}
.markdown-section li::marker{color:var(--teal)}
.markdown-section li li::marker{color:var(--ink-3)}
.markdown-section li > ul,.markdown-section li > ol{margin:.22em 0 .35em;padding-left:1.15em;max-width:none}
.markdown-section h2 + ul,.markdown-section h3 + ul,.markdown-section h4 + ul,.markdown-section h5 + ul{margin-top:.2em}
/* dense outline pages: tighten the lead-in bold sub-label spacing */
.markdown-section p + ul{margin-top:.3em}

/* blockquote — teal wash note */
.markdown-section blockquote{
  margin:30px 0;padding:18px 24px;border-radius:0 12px 12px 0;
  border-left:3px solid var(--teal);
  background:var(--teal-wash);color:var(--ink-2);
}
.markdown-section blockquote p{
  color:var(--ink-2);font-size:15.5px;line-height:1.82;
  margin:0;max-width:64ch;
}
.markdown-section blockquote p + p{margin-top:12px}
.markdown-section hr{border:0;border-top:1px solid var(--line);margin:3em 0}

/* code */
.markdown-section code{
  font-family:var(--mono);font-size:.86em;background:var(--paper-2);
  color:var(--teal-deep);padding:.15em .45em;border-radius:4px;
  border:1px solid var(--line-soft);
}
.markdown-section pre{
  background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:0;margin:1.6em 0;overflow:hidden;
}
.markdown-section pre > code{
  display:block;background:none;border:0;color:var(--ink);
  padding:18px 20px;line-height:1.7;overflow-x:auto;font-size:13.5px;
}

/* tables — the showcase for 参考查询 content */
.markdown-section table{
  border-collapse:separate;border-spacing:0;width:100%;margin:24px 0 30px;
  font-family:var(--sans);font-size:15px;display:table;
  background:var(--card);border:1px solid var(--line);
  border-radius:12px;overflow:hidden;
  box-shadow:0 1px 2px rgba(0,0,0,.02);
}
.markdown-section th,.markdown-section td{
  padding:13px 20px;text-align:left;
  border-bottom:1px solid var(--line-soft);
}
.markdown-section th{
  background:var(--paper-2);color:var(--teal-deep);
  font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;
  text-transform:uppercase;font-weight:600;
  border-bottom:1px solid var(--line);
}
.markdown-section td{font-family:var(--cn);color:var(--ink-2)}
/* numeric figures: lean on mono, right-aligned for readability */
.markdown-section td[align="right"],.markdown-section th[align="right"]{
  text-align:right;font-family:var(--mono);color:var(--ink);font-weight:500;
}
.markdown-section td[align="center"],.markdown-section th[align="center"]{text-align:center}
.markdown-section tbody tr:nth-child(even) td{background:#e3e8ea}
.markdown-section tbody tr:hover td{background:var(--teal-wash)}
.markdown-section tbody tr:last-child td{border-bottom:none}

/* file / attachment chips */
.kb-file{
  display:inline-flex;align-items:center;gap:10px;padding:10px 16px;margin:4px 0;
  border:1px solid var(--line);border-radius:9px;background:var(--card);
  font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink-2);
  transition:background .3s,gap .3s,border-color .3s,color .3s;
}
.kb-file:hover{background:var(--teal-wash);border-color:var(--teal);gap:14px;color:var(--teal-deep)}

/* doc meta line */
.kb-meta{
  font-family:var(--mono)!important;font-size:11px!important;letter-spacing:.14em;
  color:var(--ink-3)!important;text-transform:uppercase;
}

/* ---------- mobile ---------- */
.sidebar-toggle{
  position:fixed;top:0;left:0;z-index:30;width:44px;height:44px;padding:12px;
  background:rgba(232,235,236,.82);backdrop-filter:blur(8px);
  border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);cursor:pointer;
}
.sidebar-toggle .sidebar-toggle-button span{display:block;width:18px;height:2px;margin:3px 0;background:var(--ink-2)}
.content,.sidebar{transition:all .25s ease}
@media (max-width: 768px){
  .sidebar{transform:translateX(-100%)}
  .content{left:0}
  body.close .sidebar{transform:translateX(0)}
  body.close .content{left:var(--sidebar-w)}
  .markdown-section{padding:64px 24px 90px}
  .sidebar-toggle{display:block}
}
@media (min-width: 769px){ .sidebar-toggle{display:none} }