.md { white-space: normal; overflow-wrap: anywhere; line-height: 1.375; }
.md.jumbo { font-size: calc(var(--font-size) * 2.75); line-height: 1.2; }
.md strong { font-weight: 700; color: var(--header-text); }
.md em { font-style: italic; }
.md-underline { text-decoration: underline; }
.md-strike { text-decoration: line-through; }
.md-link { color: var(--link); text-decoration: none; }
.md-link:hover { text-decoration: underline; }
.md-code {
  background: var(--dark); border-radius: var(--radius); padding: 0.1em 0.3em;
  font: 0.875em ui-monospace, Menlo, Consolas, monospace; white-space: pre-wrap;
}
.md-codeblock {
  position: relative; margin: 4px 0; padding: 8px 12px; background: var(--side);
  border: 1px solid var(--dark); border-radius: var(--radius); overflow-x: auto;
  font: 0.875em/1.3 ui-monospace, Menlo, Consolas, monospace; white-space: pre; color: var(--text);
}
.md-codeblock code { font: inherit; background: none; padding: 0; }
.md-copy {
  position: absolute; top: 4px; right: 4px; padding: 2px 8px; font: 0.75em var(--font, inherit);
  color: var(--muted); background: var(--hover); border: 0; border-radius: var(--radius);
  cursor: pointer; opacity: 0; user-select: none;
}
.md-codeblock:hover .md-copy, .md-copy:focus-visible { opacity: 1; }
.md-copy:hover { color: var(--header-text); background: var(--active); }
.md-quote {
  margin: 2px 0; padding: 0 8px 0 12px; border-left: 4px solid var(--active);
  border-radius: var(--radius); color: var(--text);
}
.md-spoiler { background: var(--dark); border-radius: var(--radius); padding: 0 2px; cursor: pointer; color: transparent; }
.md-spoiler > * { pointer-events: none; color: transparent; }
.md-spoiler:hover { background: var(--hover); }
.md-spoiler.revealed { background: var(--hover); color: var(--text); cursor: auto; }
.md-spoiler.revealed > * { pointer-events: auto; color: inherit; }
.md-h1, .md-h2, .md-h3 { color: var(--header-text); font-weight: 700; margin: 8px 0 4px; }
.md-h1 { font-size: 1.5em; line-height: 1.2; }
.md-h2 { font-size: 1.25em; line-height: 1.2; }
.md-h3 { font-size: 1.1em; line-height: 1.2; }
.md-list { margin: 4px 0; padding-left: 24px; list-style: disc; }
.mention {
  background: color-mix(in srgb, var(--accent) 30%, transparent);
  color: color-mix(in srgb, var(--accent) 40%, var(--header-text));
  border-radius: var(--radius); padding: 0 2px; font-weight: 500; cursor: pointer;
}
.mention:hover { background: color-mix(in srgb, var(--accent) 60%, transparent); color: var(--header-text); }
.mention-self { background: color-mix(in srgb, var(--accent) 45%, transparent); }
