/* ==========================================================================
   Post article / markdown
   ========================================================================== */
.post-article { padding: 1.75rem clamp(1rem, 4vw, 2.5rem); }
.post-header { margin-bottom: 1.6rem; }
.post-title { margin: 0 0 0.6rem; font-size: clamp(1.6rem, 3vw, 2.1rem); line-height: 1.3; font-weight: 800; }
.post-header-meta { display: flex; flex-wrap: wrap; gap: 0.9rem; font-size: 0.85rem; color: var(--content-meta); }
.meta-item { display: inline-flex; align-items: center; gap: 0.3rem; }
.meta-link:hover, .post-header-meta .tag-item:hover { color: var(--primary); }
.post-header-meta { align-items: center; }

.post-body { font-size: 1rem; line-height: 1.85; color: var(--text-75); }
.markdown > *:first-child { margin-top: 0; }
.markdown h1, .markdown h2, .markdown h3, .markdown h4 { color: var(--deep-text); font-weight: 700; line-height: 1.35; margin: 1.8em 0 0.8em; scroll-margin-top: calc(var(--navbar-h) + 1rem); }
.markdown h2 { font-size: 1.5rem; padding-bottom: 0.3rem; border-bottom: 1px solid var(--line-divider); }
.markdown h3 { font-size: 1.25rem; }
.markdown h4 { font-size: 1.1rem; }
.markdown p { margin: 0 0 1.1em; }
.markdown a { color: var(--primary); border-bottom: 1px solid color-mix(in oklab, var(--primary) 35%, transparent); transition: border-color var(--dur) var(--ease); }
.markdown a:hover { border-color: var(--primary); }
.markdown ul, .markdown ol { padding-left: 1.4rem; margin: 0 0 1.1em; }
.markdown li { margin: 0.2em 0; }
.markdown blockquote {
  margin: 1.2em 0; padding: 0.4em 1.1em; border-left: 3px solid var(--primary);
  background: var(--btn-regular-bg); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: var(--text-75);
}
.markdown blockquote p:last-child { margin-bottom: 0; }
.markdown img { border-radius: var(--radius-md); margin: 1em auto; }
.markdown code {
  font-family: ui-monospace, "SFMono-Regular", "JetBrains Mono", Consolas, monospace;
  font-size: 0.88em; background: var(--inline-code-bg); color: var(--inline-code-color);
  padding: 0.15em 0.4em; border-radius: 0.35em;
}
/* Code blocks are scoped to a <pre> that actually contains <code>: a plain
   <pre> keeps the browser default. The container carries the surface, outline
   and scrollbar; the code element carries the base text colour. The outline
   uses the page background so the block sits in its own colour ring instead of
   fighting the card surface. */
.markdown pre:has(code) {
  background: var(--codeblock-bg);
  padding: 1rem 1.15rem; border-radius: var(--radius-md); overflow-x: auto;
  margin: 0 0 1.2em; font-size: 0.88rem; line-height: 1.6;
  outline: 2px solid var(--codeblock-outline); outline-offset: 0;
  scrollbar-color: var(--codeblock-scrollbar) transparent;
  scrollbar-width: thin;
}
.markdown pre:has(code)::-webkit-scrollbar { width: 10px; height: 10px; }
.markdown pre:has(code)::-webkit-scrollbar-thumb {
  background: var(--codeblock-scrollbar); border-radius: 999px;
  border: 2px solid transparent; background-clip: content-box;
}
.markdown pre:has(code)::-webkit-scrollbar-track { background: transparent; }
.markdown pre code {
  background: transparent; color: var(--codeblock-fg);
  padding: 0; font-size: inherit;
}

/* Token colours: Atom One (default, toggle off) and GitHub (toggle on).
   Adapted from highlight.js 11.12.0's atom-one-* / github-* styles. The
   renderer emits <span class="hljs-*"> without a .hljs wrapper, so the base
   surface/colour above is ours; these rules only map the token classes. */

/* --- Atom One Light (default) --- */
.markdown pre code :is(.hljs-comment, .hljs-quote) { color: #a0a1a7; font-style: italic; }
.markdown pre code :is(.hljs-doctag, .hljs-keyword, .hljs-formula) { color: #a626a4; }
.markdown pre code :is(.hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst) { color: #e45649; }
.markdown pre code .hljs-literal { color: #0184bb; }
.markdown pre code :is(.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute) { color: #50a14f; }
.markdown pre code .hljs-meta .hljs-string { color: #50a14f; }
.markdown pre code :is(.hljs-attr, .hljs-variable, .hljs-template-variable, .hljs-type, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-number) { color: #986801; }
.markdown pre code :is(.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title) { color: #4078f2; }
.markdown pre code :is(.hljs-built_in, .hljs-title.class_) { color: #c18401; }
.markdown pre code .hljs-class .hljs-title { color: #c18401; }
.markdown pre code .hljs-emphasis { font-style: italic; }
.markdown pre code .hljs-strong { font-weight: bold; }
.markdown pre code .hljs-link { text-decoration: underline; }

/* --- Atom One Dark (default, dark mode) --- */
:root.dark .markdown pre code :is(.hljs-comment, .hljs-quote) { color: #5c6370; font-style: italic; }
:root.dark .markdown pre code :is(.hljs-doctag, .hljs-keyword, .hljs-formula) { color: #c678dd; }
:root.dark .markdown pre code :is(.hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst) { color: #e06c75; }
:root.dark .markdown pre code .hljs-literal { color: #56b6c2; }
:root.dark .markdown pre code :is(.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute) { color: #98c379; }
:root.dark .markdown pre code .hljs-meta .hljs-string { color: #98c379; }
:root.dark .markdown pre code :is(.hljs-attr, .hljs-variable, .hljs-template-variable, .hljs-type, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-number) { color: #d19a66; }
:root.dark .markdown pre code :is(.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title) { color: #61aeee; }
:root.dark .markdown pre code :is(.hljs-built_in, .hljs-title.class_) { color: #e6c07b; }
:root.dark .markdown pre code .hljs-class .hljs-title { color: #e6c07b; }
:root.dark .markdown pre code .hljs-emphasis { font-style: italic; }
:root.dark .markdown pre code .hljs-strong { font-weight: bold; }
:root.dark .markdown pre code .hljs-link { text-decoration: underline; }

/* --- GitHub Light (toggle on) --- */
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-comment, .hljs-code, .hljs-formula) { color: #6a737d; font-style: normal; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-doctag, .hljs-keyword, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-variable.language_) { color: #d73a49; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-meta .hljs-keyword { color: #d73a49; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_) { color: #6f42c1; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-class .hljs-title { color: #6f42c1; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-attr, .hljs-attribute, .hljs-literal, .hljs-meta, .hljs-number, .hljs-operator, .hljs-variable, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id) { color: #005cc5; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-regexp, .hljs-string) { color: #032f62; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-meta .hljs-string { color: #032f62; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-built_in, .hljs-symbol) { color: #e36209; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code :is(.hljs-name, .hljs-quote, .hljs-selector-tag, .hljs-selector-pseudo) { color: #22863a; font-style: normal; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-subst { color: #24292e; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-section { color: #005cc5; font-weight: bold; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-bullet { color: #735c0f; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-emphasis { color: #24292e; font-style: italic; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-strong { color: #24292e; font-weight: bold; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-addition { color: #22863a; background-color: #f0fff4; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-deletion { color: #b31d28; background-color: #ffeef0; }
:root:not(.dark)[data-code-scheme="github"] .markdown pre code .hljs-link { color: inherit; text-decoration: none; }

/* --- GitHub Dark (toggle on, dark mode) --- */
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-comment, .hljs-code, .hljs-formula) { color: #8b949e; font-style: normal; }
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-doctag, .hljs-keyword, .hljs-template-tag, .hljs-template-variable, .hljs-type, .hljs-variable.language_) { color: #ff7b72; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-meta .hljs-keyword { color: #ff7b72; }
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_) { color: #d2a8ff; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-class .hljs-title { color: #d2a8ff; }
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-attr, .hljs-attribute, .hljs-literal, .hljs-meta, .hljs-number, .hljs-operator, .hljs-variable, .hljs-selector-attr, .hljs-selector-class, .hljs-selector-id) { color: #79c0ff; }
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-regexp, .hljs-string) { color: #a5d6ff; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-meta .hljs-string { color: #a5d6ff; }
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-built_in, .hljs-symbol) { color: #ffa657; }
:root.dark[data-code-scheme="github"] .markdown pre code :is(.hljs-name, .hljs-quote, .hljs-selector-tag, .hljs-selector-pseudo) { color: #7ee787; font-style: normal; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-subst { color: #c9d1d9; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-section { color: #1f6feb; font-weight: bold; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-bullet { color: #f2cc60; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-emphasis { color: #c9d1d9; font-style: italic; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-strong { color: #c9d1d9; font-weight: bold; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-addition { color: #aff5b4; background-color: #033a16; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-deletion { color: #ffdcd7; background-color: #67060c; }
:root.dark[data-code-scheme="github"] .markdown pre code .hljs-link { color: inherit; text-decoration: none; }
/* A wide table scrolls inside the text column instead of widening the page:
   the table element is the scroll container (block box, the inner table layout
   is untouched). Cells have a floor and a cap so columns neither squeeze to a
   single character nor stretch a paragraph into one line. */
.markdown table {
  display: block; width: 100%; max-width: 100%; overflow-x: auto;
  border-collapse: collapse; margin: 0 0 1.2em; font-size: 0.92rem;
}
.markdown th, .markdown td {
  min-width: 7.5rem; max-width: 20rem; word-break: break-word;
  border: 1px solid var(--line-color); padding: 0.5rem 0.75rem;
}
.markdown th { background: var(--btn-regular-bg); }
.markdown hr { margin: 2em 0; }
.markdown .footnotes { font-size: 0.88rem; color: var(--content-meta); }

/* --------------------------------------------------------------------------
   Admonitions — output of markdown-it-admonition (`!!! tip` … `!!!`), ported
   from the Nextario theme (same Markdown parser): a translucent wash of the
   type's accent, with the type's icon and a capitalised label in the title.
   Per type: --aclr accent, --aimg title icon (masked), --atlt fallback label.
   -------------------------------------------------------------------------- */
.admonition {
  --aclr: var(--primary);
  position: relative;
  margin: 1.2em 0;
  padding: 1rem;
  border-radius: var(--radius-md);
}
.admonition::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit;
  background-color: var(--aclr); opacity: 0.125; pointer-events: none;
}
.admonition > :first-child { margin-top: 0; }
.admonition > :last-child { margin-bottom: 0; }
.admonition > .admonition-title {
  display: flex; align-items: center;
  margin: 0 0 0.5rem; color: var(--aclr);
  font-weight: 900; line-height: 1.5rem; text-transform: capitalize;
}
.admonition > .admonition-title::before {
  content: ""; height: 1.5rem; min-width: 1.5rem; margin-right: 0.5rem;
  background-color: var(--aclr);
  mask-image: var(--aimg); mask-size: contain; mask-position: left; mask-repeat: no-repeat;
}
.admonition > .admonition-title:empty::after {
  content: var(--atlt); font-size: 1.25rem; display: flex; align-items: center;
}
.admonition.note { --aclr: oklch(.7 .14 250); --atlt: "NOTE"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.71 7.04c.39-.39.39-1.04 0-1.41l-2.34-2.34c-.37-.39-1.02-.39-1.41 0l-1.84 1.83 3.75 3.75M3 17.25V21h3.75L17.81 9.93l-3.75-3.75L3 17.25z'/%3E%3C/svg%3E"); }
.admonition.abstract { --aclr: light-dark(#000d, #fffd); --atlt: "ABSTRACT"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17 9H7V7h10m0 6H7v-2h10m-3 6H7v-2h7M12 3a1 1 0 0 1 1 1 1 1 0 0 1-1 1 1 1 0 0 1-1-1 1 1 0 0 1 1-1m7 0h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2z'/%3E%3C/svg%3E"); }
.admonition.info { --aclr: var(--primary); --atlt: "INFO"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z'%3E%3C/path%3E%3C/svg%3E"); }
.admonition.tip { --aclr: oklch(.7 .14 180); --atlt: "TIP"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a8.456 8.456 0 0 0-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75ZM5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75Z'%3E%3C/path%3E%3C/svg%3E"); }
.admonition.attention { --aclr: light-dark(#000d, #fffd); --atlt: "ATTENTION"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z'%3E%3C/path%3E%3C/svg%3E"); }
.admonition.bug { --aclr: light-dark(#862d, #ea6d); --atlt: "BUG"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 12h-4v-2h4m0 6h-4v-2h4m6-6h-2.81a5.985 5.985 0 0 0-1.82-1.96L17 4.41 15.59 3l-2.17 2.17a6.002 6.002 0 0 0-2.83 0L8.41 3 7 4.41l1.62 1.63C7.88 6.55 7.26 7.22 6.81 8H4v2h2.09c-.05.33-.09.66-.09 1v1H4v2h2v1c0 .34.04.67.09 1H4v2h2.81c1.04 1.79 2.97 3 5.19 3s4.15-1.21 5.19-3H20v-2h-2.09c.05-.33.09-.66.09-1v-1h2v-2h-2v-1c0-.34-.04-.67-.09-1H20V8z'/%3E%3C/svg%3E"); }
.admonition.warning { --aclr: oklch(.7 .14 60); --atlt: "WARNING"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z'%3E%3C/path%3E%3C/svg%3E"); }
.admonition.caution { --aclr: oklch(.6 .2 25); --atlt: "CAUTION"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.47.22A.749.749 0 0 1 5 0h6c.199 0 .389.079.53.22l4.25 4.25c.141.14.22.331.22.53v6a.749.749 0 0 1-.22.53l-4.25 4.25A.749.749 0 0 1 11 16H5a.749.749 0 0 1-.53-.22L.22 11.53A.749.749 0 0 1 0 11V5c0-.199.079-.389.22-.53Zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5ZM8 4a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4Zm0 8a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z'%3E%3C/path%3E%3C/svg%3E"); }
.admonition.danger { --aclr: oklch(.6 .2 25); --atlt: "DANGER"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 15H6l7-14v8h5l-7 14v-8z'/%3E%3C/svg%3E"); }
.admonition.success { --aclr: oklch(.7 .14 260); --atlt: "SUCCESS"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 20.42-6.21-6.21 2.83-2.83L9 14.77l9.88-9.89 2.83 2.83L9 20.42z'/%3E%3C/svg%3E"); }
.admonition.failure { --aclr: oklch(.6 .2 25); --atlt: "FAILURE"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6.91 17.09 4 12 9.09 6.91 4 4 6.91 9.09 12 4 17.09 6.91 20 12 14.91 17.09 20 20 17.09 14.91 12 20 6.91z'/%3E%3C/svg%3E"); }
.admonition.example { --aclr: oklch(.6 .2 125); --atlt: "EXAMPLE"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 13v-2h14v2H7m0 6v-2h14v2H7M7 7V5h14v2H7M3 8V5H2V4h2v4H3m-1 9v-1h3v4H2v-1h2v-.5H3v-1h1V17H2m2.25-7a.75.75 0 0 1 .75.75c0 .2-.08.39-.21.52L3.12 13H5v1H2v-.92L4 11H2v-1h2.25z'/%3E%3C/svg%3E"); }
.admonition.error { --aclr: oklch(.6 .2 30); --atlt: "ERROR"; --aimg: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cg%3E%3Cpath d='M16 31a15 15 0 1 1 15-15 15 15 0 0 1-15 15Zm0-28a13 13 0 1 0 13 13A13 13 0 0 0 16 3Z'/%3E%3Cpath d='M16 24a2 2 0 1 1 2-2 2 2 0 0 1-2 2Zm0-2ZM16 18a1 1 0 0 1-1-1V8a1 1 0 0 1 2 0v9a1 1 0 0 1-1 1Z'/%3E%3C/g%3E%3C/svg%3E"); }
.admonition.quote { --aclr: oklch(.7 .14 120); --atlt: "QUOTE"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 17h3l2-4V7h-6v6h3M6 17h3l2-4V7H5v6h3l-2 4z'/%3E%3C/svg%3E"); }
.admonition.question { --aclr: oklch(.75 .14 90); --atlt: "QUESTION"; --aimg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m15.07 11.25-.9.92C13.45 12.89 13 13.5 13 15h-2v-.5c0-1.11.45-2.11 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41a2 2 0 0 0-2-2 2 2 0 0 0-2 2H8a4 4 0 0 1 4-4 4 4 0 0 1 4 4 3.2 3.2 0 0 1-.93 2.25M13 19h-2v-2h2M12 2A10 10 0 0 0 2 12a10 10 0 0 0 10 10 10 10 0 0 0 10-10c0-5.53-4.5-10-10-10z'/%3E%3C/svg%3E"); }

.markdown pre { position: relative; }
.code-copy {
  position: absolute; top: 0.5rem; right: 0.5rem;
  font-size: 0.72rem; padding: 0.2rem 0.55rem; border: none; border-radius: 0.35rem;
  background: color-mix(in srgb, var(--codeblock-fg) 12%, transparent);
  color: var(--codeblock-fg); opacity: 0;
  transition: opacity var(--dur) var(--ease), background-color var(--dur) var(--ease);
}
.markdown pre:hover .code-copy, .code-copy:focus { opacity: 1; }
.code-copy:hover { background: color-mix(in srgb, var(--codeblock-fg) 22%, transparent); }
.code-copy:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }

.post-seg-end { display: none; }
.seg-loading { display: flex; justify-content: center; padding: 1.5rem; }
.seg-loading[hidden] { display: none; }
.spinner {
  width: 1.6rem; height: 1.6rem; border-radius: 50%;
  border: 3px solid var(--line-color); border-top-color: var(--primary);
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Neighbour links: their own cards below the article (upstream keeps them out
   of the post card), stacked on phones and side by side from md up. */
.post-neighbors { display: grid; grid-template-columns: 1fr; gap: 0.75rem; }
.neighbor {
  display: flex; flex-direction: column; gap: 0.25rem; padding: 0.85rem 1rem;
  border-radius: var(--radius-lg); background: var(--card-bg); box-shadow: var(--shadow-card);
  transition: background-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
:root:not(.dark) .neighbor { box-shadow: 0 2px 12px -8px rgb(0 0 0 / 0.25); }
.neighbor:hover { background: var(--card-bg-hover); transform: translateY(-2px); }
.neighbor.newer { text-align: right; align-items: flex-end; }
.neighbor-label { display: inline-flex; align-items: center; gap: 0.25rem; font-size: 0.78rem; color: var(--content-meta); }
.neighbor-title { font-weight: 600; font-size: 0.95rem; }
.neighbor.placeholder { background: transparent; box-shadow: none; }
@media (min-width: 768px) {
  .post-neighbors { grid-template-columns: 1fr 1fr; }
}

/* comments */
.comments { background: var(--card-bg); border-radius: var(--radius-lg); padding: 1.25rem 1.5rem; }