/* ═══════════════════════════════════════════════════════════════
 * MD Nice 主题 · Phosphor（磷光）
 * 源自 CanvasAgents DESIGN.md「CanvasAgents · Phosphor」亮色取值
 *
 * 60-30-10：
 *   60% 中性底 —— 交给公众号自己的页面底色（浅色白 / 深色 #191919）
 *   30% 文字梯度 + 边框 —— #4A5563 / #6B7686 / #D2D8E0
 *   10% 磷光绿 #12874F —— 只给标题边条、加粗、链接
 *
 * 公众号适配（依据《公众号编辑器开发规范》与开源深色算法 mp-darkmode 实测）：
 *   · 文字色只写在根节点 #nice 上，子元素继承。深色算法只转换「写在元素上」的颜色，
 *     根节点有色 → 被转成浅色 → 全文继承；完全不写色则正文在深色下仍是黑字。
 *   · 不设 font-family（代码除外）—— 用公众号默认字体栈，避免 iOS 17+ 字体版本不一致。
 *   · 除代码块外不用浅色底块 —— 浅底在深色模式里会被算法压成一块中灰，
 *     所以 h2 / 引用 / 行内代码 / 表头都改成只用边框表达层级。
 *   · 代码块本来就是深底浅字，深浅两种模式下观感一致，保留。
 *   · 不用 text-align: start/end，行高一律 ≥ 1.5 倍字号，不用 !important。
 *   · 不用 CSS 变量：复制到公众号时样式会内联，微信不认 var()。
 *
 * Token 对照（改色时照这张表查）：
 *   primary.6 #12874F   primary.7 #0E6B3F
 *   text-secondary #4A5563  text-tertiary #6B7686  text-disabled #9AA3B0
 *   border #D2D8E0      divider #E2E6EC
 *   代码块取暗色：bg-layout.dark #12161C  text-primary.dark #D3DAE2
 * ═══════════════════════════════════════════════════════════════ */

/* 全局属性 */
#nice {
  padding: 0 4px;
  color: #1A2029;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.5px;
  word-break: break-word;
}

/* 段落 */
#nice p {
  margin: 14px 0;
  padding: 0;
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: 0.5px;
  text-align: justify;
}

/* ─── 标题 ─── */

/* 一级标题 —— 通栏，底部 1px 分割 */
#nice h1 {
  margin: 36px 0 20px;
  padding: 0 0 10px;
  border-bottom: 1px solid #D2D8E0;
  font-size: 22px;
  line-height: 1.5;
  font-weight: 600;
}
#nice h1 .prefix {
  display: none;
}
#nice h1 .content {
  font-size: 22px;
  font-weight: 600;
}
#nice h1 .suffix {
  display: none;
}

/* 二级标题 —— 取 Card.selected 的 3px 绿色左边条；去掉淡绿底以适配深色模式 */
#nice h2 {
  margin: 36px 0 16px;
  padding: 2px 0 2px 12px;
  border-left: 3px solid #12874F;
  font-size: 18px;
  line-height: 1.6;
  font-weight: 600;
}
#nice h2 .prefix {
  display: none;
}
#nice h2 .content {
  font-size: 18px;
  font-weight: 600;
}
#nice h2 .suffix {
  display: none;
}

/* 三级标题 —— 不加容器，靠字号字重与正文区分 */
#nice h3 {
  margin: 28px 0 12px;
  font-size: 16px;
  line-height: 1.6;
  font-weight: 600;
}
#nice h3 .prefix {
  display: none;
}
#nice h3 .content {
  font-size: 16px;
  font-weight: 600;
}

/* 四~六级标题 —— 退到次级文字色 */
#nice h4,
#nice h5,
#nice h6 {
  margin: 24px 0 10px;
  font-size: 15px;
  line-height: 1.6;
  font-weight: 600;
  color: #4A5563;
}

/* ─── 行内强调 ─── */

/* 加粗 —— 磷光绿承担唯一的强调色；取 primary.7 而非 .6：
 * 深色算法按明度反转，浅色下更深的绿在深色下更亮，与加粗斜体保持一致 */
#nice strong {
  color: #0E6B3F;
  font-weight: 600;
}

/* 斜体 —— 不上色，只降一级文字色，避免与加粗抢注意力 */
#nice em {
  color: #4A5563;
  font-style: italic;
}

/* 加粗斜体 */
#nice em strong,
#nice strong em {
  color: #0E6B3F;
}

/* 删除线 */
#nice del {
  color: #9AA3B0;
}

/* 链接 —— 微信里外链会被 MD Nice 转为脚注，这里只管颜色 */
#nice a {
  color: #12874F;
  text-decoration: none;
  border-bottom: 1px dashed #12874F;
}

/* 行内代码 —— 机器字符串一律等宽；只描边不填底，深色模式下不会变灰块。
 * inline-block：短命令（⌘J）整体换到下一行，而不是边框被行尾劈成两半；
 * 超过一行宽的长命令在框内折行（max-width + break-all），不会溢出屏幕 */
#nice p code,
#nice li code,
#nice table code {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 2px;
  padding: 0 5px;
  border: 1px solid #D2D8E0;
  border-radius: 4px;
  font-size: 13px;
  line-height: 1.6;
  font-family: Menlo, Consolas, monospace;
  word-break: break-all;
  vertical-align: baseline;
}

/* ─── 块级元素 ─── */

/* 引用 —— Alert 形制的 3px 左边条；去掉浅底，边条用中性灰，把绿色留给 h2。
 * 注意：公众号给 <blockquote> 自带一条左竖线，复制时会把它换成 <section> 避免双竖线 */
#nice blockquote {
  margin: 20px 0;
  padding: 2px 0 2px 14px;
  border-left: 3px solid #D2D8E0;
  color: #6B7686;
}
#nice blockquote p {
  margin: 8px 0;
  color: #6B7686;
  font-size: 14px;
  line-height: 1.8;
}

/* 代码块 —— 画框取 TerminalPanel 暗色：整篇唯一的深色块，读者一眼知道「这是终端里的东西」 */
#nice pre {
  margin: 20px 0;
  border-radius: 6px;
  overflow: hidden;
}
#nice pre code,
#nice pre.custom code {
  display: -webkit-box;
  padding: 16px;
  border-radius: 6px;
  background: #12161C;
  color: #D3DAE2;
  font-size: 13px;
  line-height: 1.7;
  font-family: Menlo, Consolas, monospace;
  letter-spacing: 0;
  overflow-x: auto;
  white-space: nowrap;
}
/* 代码高亮 —— 取各色槽的暗色值，保证在 #12161C 上的对比度 */
#nice .hljs-comment,
#nice .hljs-quote {
  color: #8B96A5;
  font-style: italic;
}
#nice .hljs-keyword,
#nice .hljs-selector-tag,
#nice .hljs-literal {
  color: #A78BFA;
}
#nice .hljs-string,
#nice .hljs-attr,
#nice .hljs-template-variable,
#nice .hljs-addition {
  color: #3DD68C;
}
#nice .hljs-number,
#nice .hljs-built_in,
#nice .hljs-type {
  color: #E5A13A;
}
#nice .hljs-title,
#nice .hljs-function,
#nice .hljs-section {
  color: #4EA8E8;
}
#nice .hljs-deletion,
#nice .hljs-meta {
  color: #F2555A;
}

/* 列表 */
#nice ul,
#nice ol {
  margin: 12px 0;
  padding-left: 24px;
}
#nice ul {
  list-style-type: disc;
}
#nice ul ul {
  list-style-type: circle;
}
#nice ol {
  list-style-type: decimal;
}
#nice li section {
  margin: 6px 0;
  font-size: 15px;
  line-height: 1.8;
}

/* 分隔线 —— 虚线，像终端里的分节符 */
#nice hr {
  height: 0;
  margin: 32px 0;
  border: 0;
  border-top: 1px dashed #D2D8E0;
}

/* 图片 */
#nice img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
  border-radius: 6px;
}
#nice figure {
  margin: 20px 0;
}
/* 图注 —— caption 档：12px + 三级文字色 */
#nice figcaption {
  margin-top: 8px;
  color: #6B7686;
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}

/* 表格 —— 不填底色，表头只靠字重与加粗的下边线区分 */
#nice table {
  width: 100%;
  margin: 20px 0;
  border-collapse: collapse;
  font-size: 14px;
}
#nice table tr th {
  padding: 8px 10px;
  border: 1px solid #D2D8E0;
  border-bottom: 2px solid #D2D8E0;
  font-size: 14px;
  line-height: 1.6;
  font-weight: 600;
  text-align: left;
}
#nice table tr td {
  padding: 8px 10px;
  border: 1px solid #D2D8E0;
  font-size: 14px;
  line-height: 1.6;
  text-align: left;
}

/* 脚注 */
#nice .footnote-word,
#nice .footnote-ref {
  color: #12874F;
  font-weight: 600;
}
#nice .footnotes-sep {
  margin-top: 36px;
  padding-top: 12px;
  border-top: 1px dashed #D2D8E0;
  font-size: 13px;
  line-height: 1.6;
}
#nice .footnotes-sep::before {
  content: "参考资料";
  color: #6B7686;
}
#nice .footnote-num {
  color: #12874F;
}
#nice .footnote-item {
  display: block;
  margin: 4px 0;
  font-size: 12px;
  line-height: 1.6;
}
#nice .footnote-item p {
  display: inline;
  margin: 0;
  color: #6B7686;
  font-size: 12px;
  line-height: 1.6;
}
#nice .footnote-item em {
  color: #6B7686;
  font-style: normal;
  word-break: break-all;
}

/* 行间公式 */
#nice .block-equation svg {
  max-width: 100%;
}