/* Reading styles are separate from the desktop/window chrome. */
.legacy-text-green { color: #36a86c; }
.legacy-text-red { color: #e45b5b; }
.legacy-text-yellow { color: #b68b29; }
.legacy-text-cyan { color: #259fba; }
.legacy-text-blue { color: #409eff; }
.legacy-text-purple { color: #a36acb; }
.legacy-text-gray { color: #8b949f; }
.legacy-text-small { font-size: .85em; }
.legacy-text-large { font-size: 1.2em; }
.legacy-text-huge { font-size: 1.5em; }
.legacy-text-bold { font-weight: 700; }
.legacy-paragraph { display: block; }
.post-content .legacy-text img { width: 1.2em; height: 1.2em; object-fit: contain; vertical-align: -.18em; border-radius: 0; }
.post-content .legacy-image { margin: 20px 0; text-align: center; }
.post-content .legacy-image img { display: block; margin-inline: auto; }
.post-content .legacy-image figcaption { margin-top: 8px; font-size: .85em; line-height: 1.6; color: inherit; opacity: .7; overflow-wrap: anywhere; }
.post-content .gallery > .legacy-image { flex: 1 1 220px; min-width: 0; }
.legacy-tabs { margin: 20px 0; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.legacy-tab-list { display: none; gap: 4px; padding: 8px; overflow: auto; border-bottom: 1px solid var(--line); }
.legacy-tabs.is-enhanced .legacy-tab-list { display: flex; }
.legacy-tab-list button { flex-shrink: 0; padding: 7px 12px; border-radius: 4px; font-size: 13px; }
.legacy-tab-list button[aria-selected="true"] { color: #409eff; background: #409eff18; }
.legacy-tab-panel { padding: 5px 18px 15px; }
.legacy-tabs.is-enhanced .legacy-tab-fallback-label { display: none; }
.legacy-tab-fallback-label, .legacy-timeline-title { font-weight: 600; }
.legacy-timeline { margin: 24px 0; }
.legacy-timenode { margin-left: 7px; padding: 1px 0 12px 24px; border-left: 2px solid #8ab7a0; }
.legacy-time-label { position: relative; font-weight: 600; color: #36a86c; }
.legacy-time-label::before { content: ''; position: absolute; left: -30px; top: .6em; width: 10px; height: 10px; border-radius: 50%; background: #36a86c; }
.post-content a {
  color: var(--md-link-color, #409eff);
  transition: color .15s;
}
.post-content a:hover,
.post-content a:focus-visible {
  color: var(--md-link-hover-color, #67c23a);
  text-decoration: underline;
}
.post-content u {
  text-decoration-color: var(--md-underline-color, #67c23a);
  text-underline-offset: .22em;
}
.post-content :not(pre) > code {
  color: var(--md-inline-code-color, #7850a8);
  background: var(--md-inline-code-background, #f3edf9);
  padding: 2px 5px;
  border-radius: 2px;
}
.post-content blockquote {
  margin: 20px 0;
  padding: 1px 22px;
  border-left: 5px solid var(--md-blockquote-border, #2dbb78);
  background: var(--md-blockquote-background, #ebebeb);
  color: inherit;
}
.post-content blockquote blockquote { margin: 18px 0; }

.post-content .code-block {
  margin: 20px 0;
  overflow: hidden;
  border-radius: 6px;
  background: var(--md-code-background, #282c34);
  color: var(--md-code-text-color, #abb2bf);
  font-family: Consolas, "Cascadia Code", monospace;
  font-size: 13px;
  line-height: 1.75;
}
.code-block-header {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 14px;
  font: 11px/1.5 "Segoe UI", "Microsoft YaHei", sans-serif;
}
.code-traffic-lights { display: flex; gap: 6px; margin-right: auto; }
.code-traffic-lights i { width: 10px; height: 10px; border-radius: 50%; background: #fc625d; }
.code-traffic-lights i:nth-child(2) { background: #fdbc40; }
.code-traffic-lights i:nth-child(3) { background: #35cd4b; }
.code-language { color: var(--md-code-text-color, #abb2bf); }
.code-block-header button { color: inherit; padding: 4px 2px; font: inherit; }
.code-block-header button:hover { color: #fff; }
.code-block-header button:focus-visible { outline-color: #98c379; }
.code-copy { min-width: 48px; }
.code-collapse { display: grid; place-items: center; }
.code-collapse svg { width: 16px; height: 16px; transition: transform .15s; }
.code-collapse[aria-expanded="false"] svg { transform: rotate(-90deg); }
.code-block-body { display: flex; align-items: stretch; overflow: hidden; padding: 10px 0 16px; }
.code-line-numbers {
  flex: 0 0 auto;
  padding: 0 14px 0 18px;
  text-align: right;
  white-space: pre;
  color: #838994;
  user-select: none;
  font: inherit;
}
.post-content .code-block pre {
  flex: 1;
  min-width: 0;
  margin: 0;
  padding: 0 20px 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  overflow: auto;
  tab-size: 2;
}
.post-content .code-block pre code {
  display: block;
  width: max-content;
  min-width: 100%;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}
.code-block ::-webkit-scrollbar-thumb { background: #515866; }
.code-block .hljs-comment, .code-block .hljs-quote { color: #7f8795; font-style: italic; }
.code-block .hljs-keyword, .code-block .hljs-selector-tag { color: #c678dd; }
.code-block .hljs-string, .code-block .hljs-addition { color: #98c379; }
.code-block .hljs-attr, .code-block .hljs-number, .code-block .hljs-built_in,
.code-block .hljs-type, .code-block .hljs-symbol { color: #d19a66; }
.code-block .hljs-literal { color: #56b6c2; }
.code-block .hljs-title, .code-block .hljs-section { color: #61afef; }
.code-block .hljs-subst, .code-block .hljs-variable, .code-block .hljs-deletion { color: #e06c75; }
.code-block .hljs-params, .code-block .hljs-variable.language_ { color: #abb2bf; }
.code-block .hljs-attribute { color: #e06c75; }
.code-block .hljs-selector-class { color: #d19a66; }

/* Before progressive enhancement (or without JS), keep Hexo's code readable. */
.post-content figure.highlight { margin: 20px 0; background: var(--md-code-background, #282c34); border-radius: 6px; overflow: auto; }
.post-content figure.highlight table { display: table; width: 100%; }
.post-content figure.highlight td { border: 0; padding: 0; }
.post-content figure.highlight pre { border: 0; margin: 0; background: transparent; color: var(--md-code-text-color, #abb2bf); }
@media (max-width: 760px) {
  .code-block-header { gap: 8px; padding-inline: 10px; }
  .code-traffic-lights { gap: 4px; }
  .code-traffic-lights i { width: 8px; height: 8px; }
  .post-content .code-block { font-size: 12px; }
  .code-line-numbers { padding-left: 10px; padding-right: 10px; }
  .post-content blockquote { padding-inline: 15px; }
}

/* Diagram cards follow the reader theme; source retains code highlighting. */
.post-content .mermaid-block {
  --diagram-surface: #fafbfc;
  --diagram-header: #f1f3f5;
  --diagram-border: #dfe3e8;
  --diagram-text: #606b77;
  --diagram-hover: #303c49;
  --diagram-error: #94621f;
  border: 1px solid var(--diagram-border);
  background: var(--diagram-surface);
  box-shadow: 0 2px 5px #26354808;
}
.reader-window[data-theme="dark"] .mermaid-block {
  --diagram-surface: #252a32;
  --diagram-header: #2c323b;
  --diagram-border: #3d4652;
  --diagram-text: #b3bdca;
  --diagram-hover: #f0f3f7;
  --diagram-error: #e7bd84;
  box-shadow: none;
}
.mermaid-block .code-block-header {
  background: var(--diagram-header);
  color: var(--diagram-text);
  border-bottom: 1px solid var(--diagram-border);
}
.mermaid-block .code-language { color: inherit; }
.mermaid-block .code-block-header button:hover { color: var(--diagram-hover); }
/* SVGs must not inherit the desktop's small outline-icon sizing. */
.mermaid-output { padding: 24px 20px; background: var(--diagram-surface, #fafbfc); color: var(--diagram-text, #414b54); overflow: auto; text-align: center; }
.mermaid-output svg { display: block; width: 100%; height: auto; margin: auto; fill: initial; stroke: none; stroke-width: initial; }
.mermaid-stage { position: fixed; left: -20000px; top: 0; width: 900px; pointer-events: none; }
.mermaid-body { display: block; padding: 0; }
.mermaid-source { display: flex; padding: 14px 0 16px; border-top: 1px solid var(--diagram-border); background: var(--md-code-background, #282c34); color: var(--md-code-text-color, #abb2bf); }
.mermaid-error { padding: 12px 18px; color: var(--diagram-error, #94621f); }
.mermaid-error button { margin-left: 12px; text-decoration: underline; }

/* Footnotes share the article palette in both reading themes. */
.post-content .footnotes { margin-top:2.5em; padding-top:1em; border-top:1px solid var(--line); font-size:.9em; }
.post-content .footnotes .footnotes-title { margin:.2em 0 .8em; font-size:1.2em; }
.post-content .footnotes li { padding-left:.3em; scroll-margin-top:24px; }
.post-content [data-footnote-ref] { padding:0 .15em; scroll-margin-top:24px; text-decoration:none; }
.post-content [data-footnote-backref] { margin-left:.35em; text-decoration:none; }

/* Volantis-compatible notes and link cards. */
.post-content .legacy-note {--note-rgb:112,125,140;display:flex;align-items:center;gap:10px;margin:1em 0;padding:16px 16px 16px 8px;border:0;border-left:4px solid rgb(var(--note-rgb));border-radius:4px;background:rgba(var(--note-rgb),.1);color:inherit;}
.post-content .legacy-note-blue {--note-rgb:49,130,206;}
.post-content .legacy-note-yellow {--note-rgb:255,189,43;}
.post-content .legacy-note-red {--note-rgb:254,95,88;}
.post-content .legacy-note-green {--note-rgb:61,197,80;}
.post-content .legacy-note-cyan {--note-rgb:27,148,169;}
.post-content .legacy-note-purple {--note-rgb:147,93,190;}
.post-content .legacy-note-clear {background:transparent;}
.post-content .legacy-note-light {background:rgba(128,128,128,.04);}
.post-content .legacy-note-icon {display:flex;align-items:center;justify-content:center;flex:0 0 20px;color:rgb(var(--note-rgb));}
.post-content .legacy-note-icon svg {display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
.post-content .legacy-note-body {min-width:0;flex:1;}
.post-content .legacy-note-body > :first-child {margin-top:0;}
.post-content .legacy-note-body > :last-child {margin-bottom:0;}
.reader-window[data-theme="dark"] .post-content .legacy-note {background:rgba(var(--note-rgb),.13);border-color:rgba(var(--note-rgb),.4);border-left-color:rgb(var(--note-rgb));color:inherit;}
.reader-window[data-theme="dark"] .post-content .legacy-note-blue {--note-rgb:106,172,235;}
.reader-window[data-theme="dark"] .post-content .legacy-note-yellow {--note-rgb:224,179,79;}
.reader-window[data-theme="dark"] .post-content .legacy-note-red {--note-rgb:236,126,135;}
.reader-window[data-theme="dark"] .post-content .legacy-note-green {--note-rgb:108,197,149;}
.reader-window[data-theme="dark"] .post-content .legacy-note-cyan {--note-rgb:93,191,207;}
.reader-window[data-theme="dark"] .post-content .legacy-note-purple {--note-rgb:190,149,225;}
.reader-window[data-theme="dark"] .post-content .legacy-note-clear {background:transparent;}
.reader-window[data-theme="dark"] .post-content .legacy-note-light {background:rgba(255,255,255,.04);}
.post-content a.legacy-link {display:flex;align-items:center;gap:14px;box-sizing:border-box;width:100%;max-width:520px;margin:16px 0;padding:15px 18px;border:1px solid #dde3e9;border-radius:12px;background:#f7f9fb;color:#35434d;text-decoration:none;line-height:1.5;transition:border-color .18s,box-shadow .18s;}
.post-content a.legacy-link:hover {text-decoration:none;border-color:var(--md-link-color,#409eff);box-shadow:0 4px 16px #0000000d;}
.post-content .legacy-link-icon {display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:10px;background:#fff;color:var(--md-link-color,#409eff);overflow:hidden;}
.post-content .legacy-link-icon img {display:block;width:36px;height:36px;object-fit:contain;border-radius:0;}
.post-content .legacy-link-icon svg {width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;}
.post-content .legacy-link-text {display:flex;flex-direction:column;gap:4px;min-width:0;flex:1;}
.post-content .legacy-link-text strong {font-size:15px;overflow-wrap:anywhere;}
.post-content .legacy-link-url {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:#76828e;}
.post-content .legacy-link-arrow {flex-shrink:0;color:#88939f;font-size:20px;}
.reader-window[data-theme="dark"] .post-content a.legacy-link {background:#2a3039;border-color:#424c59;color:#e0e5eb;}
.reader-window[data-theme="dark"] .post-content a.legacy-link:hover {border-color:var(--md-link-color,#409eff);}
.reader-window[data-theme="dark"] .post-content .legacy-link-icon {background:#343d49;}
.reader-window[data-theme="dark"] .post-content .legacy-link-url {color:#a4b0bf;}
@media(max-width:760px) {.post-content a.legacy-link {padding:12px;gap:10px;}}