/* TerseLink 官网 · 使用教程（依赖 site.css） */
.docs-shell{grid-template-columns:264px minmax(0,1fr) 220px;gap:64px}
.search{position:relative;max-width:520px;margin-top:26px}
.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--mute)}
.search .input{padding-left:42px;background:rgba(255,255,255,.8)}
.search kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-family:var(--mono);font-size:11px;color:var(--mute);border:1px solid var(--line-2);border-radius:5px;padding:1px 6px;background:#fff}
.band-meta{display:flex;gap:10px;flex-wrap:wrap}
.band-meta span{font-size:12.5px;color:var(--ink-2);border:1px solid var(--line);background:rgba(255,255,255,.6);padding:4px 10px;border-radius:999px}
.band-meta b{font-family:var(--mono);font-weight:600}

/* article */
.article{min-width:0;max-width:940px}
.topic{padding-bottom:56px;margin-bottom:56px;border-bottom:1px solid var(--line)}
.topic:last-child{border-bottom:0;margin-bottom:0}
.topic-h{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.topic-h .no{font-family:var(--mono);font-size:12.5px;color:var(--blue);border:1px solid currentColor;border-radius:999px;padding:2px 10px}
.topic-h .grp{font-size:12px;color:var(--mute);letter-spacing:.1em;font-weight:600}
.article h2{font-size:30px;margin:0 0 14px;letter-spacing:-.025em}
.article h3{font-size:19px;margin:34px 0 12px;letter-spacing:-.01em;display:flex;align-items:center;gap:10px}
.article h3::before{content:"";width:4px;height:18px;border-radius:2px;background:var(--grad)}
.article p{font-size:15.5px;color:var(--ink-2);margin:10px 0;line-height:1.8}
.article p b,.article li b{color:var(--ink)}
.article ul.dot{margin:10px 0 10px 20px;color:var(--ink-2);font-size:15px;line-height:1.8}
.article code{font-family:var(--mono);font-size:.88em;background:var(--paper-2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;color:var(--ink)}
.lead-p{font-size:17px!important;color:var(--ink-2)}
.steplist{display:flex;flex-direction:column;gap:0;margin:16px 0;counter-reset:s;border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:hidden}
.steplist>div{display:grid;grid-template-columns:34px 1fr;gap:16px;padding:18px 24px;border-bottom:1px solid var(--line);counter-increment:s}
.steplist>div:last-child{border-bottom:0}
.steplist>div::before{content:counter(s);width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--mono);font-size:12px;display:grid;place-items:center}
.steplist b{display:block;font-size:15.5px;margin-bottom:2px}
.steplist p{margin:0;font-size:14.5px}
.steplist .code{margin-top:10px}
.dtable{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;margin:16px 0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.dtable th{text-align:left;font-size:12.5px;font-weight:600;color:var(--mute);background:var(--paper);padding:11px 18px;border-bottom:1px solid var(--line)}
.dtable td{padding:12px 18px;border-bottom:1px solid var(--line);color:var(--ink-2);vertical-align:top;line-height:1.65}
.dtable tr:last-child td{border-bottom:0}
.dtable td:first-child{color:var(--ink);font-weight:600;white-space:nowrap}
.dtable td.n{font-family:var(--mono);color:var(--mute);font-weight:500;width:40px}
.code{position:relative;background:var(--night);color:#cfe0f2;border-radius:12px;font-family:var(--mono);font-size:13px;line-height:1.7;margin:14px 0;overflow:hidden}
.code-h{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;border-bottom:1px solid var(--night-line);font-size:11.5px;color:#6f86a4}
.code-h button{font-family:var(--sans);font-size:12px;color:#9fcaf0;padding:2px 8px;border-radius:6px;border:1px solid var(--night-line)}
.code-h button:hover{background:rgba(255,255,255,.06)}
.code pre{padding:14px 16px;overflow-x:auto;font-family:inherit;white-space:pre}
.code .k{color:#77B7E5}.code .s{color:#38D39F}.code .c{color:#5d7090}
.flow-mini{display:grid;grid-template-columns:1fr auto 1.1fr auto 1fr;align-items:center;gap:10px;margin:18px 0}
.flow-mini div{border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff;text-align:center}
.flow-mini div.mid{background:var(--night);color:#fff;border-color:var(--night)}
.flow-mini div.mid img{width:28px;height:28px;margin:0 auto 6px}
.flow-mini b{display:block;font-size:14.5px}
.flow-mini small{font-size:12px;color:var(--mute)}
.flow-mini div.mid small{color:#8ea1b9}
.flow-mini i{font-style:normal;color:var(--blue);font-family:var(--mono)}
.callout{display:grid;grid-template-columns:22px 1fr;gap:12px;padding:16px 18px;border-radius:12px;margin:18px 0;font-size:14.5px;line-height:1.75;border:1px solid}
.callout svg{width:20px;height:20px;margin-top:2px}
.callout b.t{display:block;margin-bottom:2px}
.callout ul{margin-left:18px}
.callout.tip{background:var(--blue-bg);border-color:rgba(0,118,191,.16);color:#0f3a63}
.callout.tip svg{color:var(--blue)}
.callout.warn{background:var(--warn-bg);border-color:rgba(183,121,31,.22);color:#6b4a12}
.callout.warn svg{color:var(--warn)}
.callout.ok{background:var(--save-bg);border-color:rgba(11,155,106,.2);color:#0a5a40}
.callout.ok svg{color:var(--save)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}
.mini-card{border:1px solid var(--line);border-radius:12px;padding:14px 16px;background:#fff}
.mini-card b{display:block;font-size:14.5px;margin-bottom:2px}
.mini-card span{font-size:13.5px;color:var(--ink-2)}
.mini-card .badge{margin-left:6px;vertical-align:1px}
.hl{background:rgba(255,214,102,.55);border-radius:3px;padding:0 1px}
.no-result{display:none;padding:60px 20px;text-align:center;color:var(--mute);border:1px dashed var(--line-2);border-radius:16px}
.no-result b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}

/* right toc */
.toc{position:sticky;top:calc(var(--nav-h) + 24px);font-size:13.5px}
.toc-t{font-size:11.5px;letter-spacing:.12em;color:var(--mute);font-weight:700;margin-bottom:10px}
.toc a{display:block;padding:5px 0 5px 12px;color:var(--mute);border-left:2px solid var(--line);transition:color .15s,border-color .15s;line-height:1.45}
.toc a:hover{color:var(--ink)}
.toc a.on{color:var(--blue);border-left-color:var(--blue);font-weight:600}
.toc-help{margin-top:22px;border-top:1px solid var(--line);padding-top:18px;color:var(--mute);font-size:13px}
.toc-help a{border:0;padding:4px 0;color:var(--ink-2)}
.toc-help a:hover{color:var(--blue)}
.side .cnt{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--mute)}

@media (max-width:1200px){
  .docs-shell{grid-template-columns:264px minmax(0,1fr)}
  .toc{display:none}
}
@media (max-width:960px){
  .docs-shell{grid-template-columns:1fr}
  .side{position:sticky;top:var(--nav-h);z-index:5;background:var(--paper);padding:10px 0;margin:0 -20px;padding-left:20px;padding-right:20px;border-bottom:1px solid var(--line)}
}
@media (max-width:640px){
  .flow-mini{grid-template-columns:1fr}
  .flow-mini i{transform:rotate(90deg);justify-self:center}
  .grid2{grid-template-columns:1fr}
  .dtable td:first-child{white-space:normal}
}
