@uiw/react-md-editor 3.10.0 → 3.11.0

package/dist/mdeditor.css

@@ -1,123 +1,380 @@
+@media (prefers-color-scheme: dark) {
+  .wmde-markdown,
+  .wmde-markdown-var {
+    color-scheme: dark;
+    --color-prettylights-syntax-comment: #8b949e;
+    --color-prettylights-syntax-constant: #79c0ff;
+    --color-prettylights-syntax-entity: #d2a8ff;
+    --color-prettylights-syntax-storage-modifier-import: #c9d1d9;
+    --color-prettylights-syntax-entity-tag: #7ee787;
+    --color-prettylights-syntax-keyword: #ff7b72;
+    --color-prettylights-syntax-string: #a5d6ff;
+    --color-prettylights-syntax-variable: #ffa657;
+    --color-prettylights-syntax-brackethighlighter-unmatched: #f85149;
+    --color-prettylights-syntax-invalid-illegal-text: #f0f6fc;
+    --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
+    --color-prettylights-syntax-carriage-return-text: #f0f6fc;
+    --color-prettylights-syntax-carriage-return-bg: #b62324;
+    --color-prettylights-syntax-string-regexp: #7ee787;
+    --color-prettylights-syntax-markup-list: #f2cc60;
+    --color-prettylights-syntax-markup-heading: #1f6feb;
+    --color-prettylights-syntax-markup-italic: #c9d1d9;
+    --color-prettylights-syntax-markup-bold: #c9d1d9;
+    --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
+    --color-prettylights-syntax-markup-deleted-bg: #67060c;
+    --color-prettylights-syntax-markup-inserted-text: #aff5b4;
+    --color-prettylights-syntax-markup-inserted-bg: #033a16;
+    --color-prettylights-syntax-markup-changed-text: #ffdfb6;
+    --color-prettylights-syntax-markup-changed-bg: #5a1e02;
+    --color-prettylights-syntax-markup-ignored-text: #c9d1d9;
+    --color-prettylights-syntax-markup-ignored-bg: #1158c7;
+    --color-prettylights-syntax-meta-diff-range: #d2a8ff;
+    --color-prettylights-syntax-brackethighlighter-angle: #8b949e;
+    --color-prettylights-syntax-sublimelinter-gutter-mark: #484f58;
+    --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
+    --color-fg-default: #c9d1d9;
+    --color-fg-muted: #8b949e;
+    --color-fg-subtle: #484f58;
+    --color-canvas-default: #0d1117;
+    --color-canvas-subtle: #161b22;
+    --color-border-default: #30363d;
+    --color-border-muted: #21262d;
+    --color-neutral-muted: rgba(110, 118, 129, 0.4);
+    --color-accent-fg: #58a6ff;
+    --color-accent-emphasis: #1f6feb;
+    --color-attention-subtle: rgba(187, 128, 9, 0.15);
+    --color-danger-fg: #f85149;
+  }
+}
+@media (prefers-color-scheme: light) {
+  .wmde-markdown,
+  .wmde-markdown-var {
+    color-scheme: light;
+    --color-prettylights-syntax-comment: #6e7781;
+    --color-prettylights-syntax-constant: #0550ae;
+    --color-prettylights-syntax-entity: #8250df;
+    --color-prettylights-syntax-storage-modifier-import: #24292f;
+    --color-prettylights-syntax-entity-tag: #116329;
+    --color-prettylights-syntax-keyword: #cf222e;
+    --color-prettylights-syntax-string: #0a3069;
+    --color-prettylights-syntax-variable: #953800;
+    --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
+    --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
+    --color-prettylights-syntax-invalid-illegal-bg: #82071e;
+    --color-prettylights-syntax-carriage-return-text: #f6f8fa;
+    --color-prettylights-syntax-carriage-return-bg: #cf222e;
+    --color-prettylights-syntax-string-regexp: #116329;
+    --color-prettylights-syntax-markup-list: #3b2300;
+    --color-prettylights-syntax-markup-heading: #0550ae;
+    --color-prettylights-syntax-markup-italic: #24292f;
+    --color-prettylights-syntax-markup-bold: #24292f;
+    --color-prettylights-syntax-markup-deleted-text: #82071e;
+    --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
+    --color-prettylights-syntax-markup-inserted-text: #116329;
+    --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
+    --color-prettylights-syntax-markup-changed-text: #953800;
+    --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
+    --color-prettylights-syntax-markup-ignored-text: #eaeef2;
+    --color-prettylights-syntax-markup-ignored-bg: #0550ae;
+    --color-prettylights-syntax-meta-diff-range: #8250df;
+    --color-prettylights-syntax-brackethighlighter-angle: #57606a;
+    --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
+    --color-prettylights-syntax-constant-other-reference-link: #0a3069;
+    --color-fg-default: #24292f;
+    --color-fg-muted: #57606a;
+    --color-fg-subtle: #6e7781;
+    --color-canvas-default: #ffffff;
+    --color-canvas-subtle: #f6f8fa;
+    --color-border-default: #d0d7de;
+    --color-border-muted: hsl(210, 18%, 87%);
+    --color-neutral-muted: rgba(175, 184, 193, 0.2);
+    --color-accent-fg: #0969da;
+    --color-accent-emphasis: #0969da;
+    --color-attention-subtle: #fff8c5;
+    --color-danger-fg: #cf222e;
+  }
+}
+[data-color-mode*='dark'] .wmde-markdown,
+[data-color-mode*='dark'] .wmde-markdown-var,
+body[data-color-mode*='dark'] {
+  color-scheme: dark;
+  --color-prettylights-syntax-comment: #8b949e;
+  --color-prettylights-syntax-constant: #79c0ff;
+  --color-prettylights-syntax-entity: #d2a8ff;
+  --color-prettylights-syntax-storage-modifier-import: #c9d1d9;
+  --color-prettylights-syntax-entity-tag: #7ee787;
+  --color-prettylights-syntax-keyword: #ff7b72;
+  --color-prettylights-syntax-string: #a5d6ff;
+  --color-prettylights-syntax-variable: #ffa657;
+  --color-prettylights-syntax-brackethighlighter-unmatched: #f85149;
+  --color-prettylights-syntax-invalid-illegal-text: #f0f6fc;
+  --color-prettylights-syntax-invalid-illegal-bg: #8e1519;
+  --color-prettylights-syntax-carriage-return-text: #f0f6fc;
+  --color-prettylights-syntax-carriage-return-bg: #b62324;
+  --color-prettylights-syntax-string-regexp: #7ee787;
+  --color-prettylights-syntax-markup-list: #f2cc60;
+  --color-prettylights-syntax-markup-heading: #1f6feb;
+  --color-prettylights-syntax-markup-italic: #c9d1d9;
+  --color-prettylights-syntax-markup-bold: #c9d1d9;
+  --color-prettylights-syntax-markup-deleted-text: #ffdcd7;
+  --color-prettylights-syntax-markup-deleted-bg: #67060c;
+  --color-prettylights-syntax-markup-inserted-text: #aff5b4;
+  --color-prettylights-syntax-markup-inserted-bg: #033a16;
+  --color-prettylights-syntax-markup-changed-text: #ffdfb6;
+  --color-prettylights-syntax-markup-changed-bg: #5a1e02;
+  --color-prettylights-syntax-markup-ignored-text: #c9d1d9;
+  --color-prettylights-syntax-markup-ignored-bg: #1158c7;
+  --color-prettylights-syntax-meta-diff-range: #d2a8ff;
+  --color-prettylights-syntax-brackethighlighter-angle: #8b949e;
+  --color-prettylights-syntax-sublimelinter-gutter-mark: #484f58;
+  --color-prettylights-syntax-constant-other-reference-link: #a5d6ff;
+  --color-fg-default: #c9d1d9;
+  --color-fg-muted: #8b949e;
+  --color-fg-subtle: #484f58;
+  --color-canvas-default: #0d1117;
+  --color-canvas-subtle: #161b22;
+  --color-border-default: #30363d;
+  --color-border-muted: #21262d;
+  --color-neutral-muted: rgba(110, 118, 129, 0.4);
+  --color-accent-fg: #58a6ff;
+  --color-accent-emphasis: #1f6feb;
+  --color-attention-subtle: rgba(187, 128, 9, 0.15);
+  --color-danger-fg: #f85149;
+}
+[data-color-mode*='light'] .wmde-markdown,
+[data-color-mode*='light'] .wmde-markdown-var,
+body[data-color-mode*='light'] {
+  color-scheme: light;
+  --color-prettylights-syntax-comment: #6e7781;
+  --color-prettylights-syntax-constant: #0550ae;
+  --color-prettylights-syntax-entity: #8250df;
+  --color-prettylights-syntax-storage-modifier-import: #24292f;
+  --color-prettylights-syntax-entity-tag: #116329;
+  --color-prettylights-syntax-keyword: #cf222e;
+  --color-prettylights-syntax-string: #0a3069;
+  --color-prettylights-syntax-variable: #953800;
+  --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
+  --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
+  --color-prettylights-syntax-invalid-illegal-bg: #82071e;
+  --color-prettylights-syntax-carriage-return-text: #f6f8fa;
+  --color-prettylights-syntax-carriage-return-bg: #cf222e;
+  --color-prettylights-syntax-string-regexp: #116329;
+  --color-prettylights-syntax-markup-list: #3b2300;
+  --color-prettylights-syntax-markup-heading: #0550ae;
+  --color-prettylights-syntax-markup-italic: #24292f;
+  --color-prettylights-syntax-markup-bold: #24292f;
+  --color-prettylights-syntax-markup-deleted-text: #82071e;
+  --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
+  --color-prettylights-syntax-markup-inserted-text: #116329;
+  --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
+  --color-prettylights-syntax-markup-changed-text: #953800;
+  --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
+  --color-prettylights-syntax-markup-ignored-text: #eaeef2;
+  --color-prettylights-syntax-markup-ignored-bg: #0550ae;
+  --color-prettylights-syntax-meta-diff-range: #8250df;
+  --color-prettylights-syntax-brackethighlighter-angle: #57606a;
+  --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
+  --color-prettylights-syntax-constant-other-reference-link: #0a3069;
+  --color-fg-default: #24292f;
+  --color-fg-muted: #57606a;
+  --color-fg-subtle: #6e7781;
+  --color-canvas-default: #ffffff;
+  --color-canvas-subtle: #f6f8fa;
+  --color-border-default: #d0d7de;
+  --color-border-muted: hsl(210, 18%, 87%);
+  --color-neutral-muted: rgba(175, 184, 193, 0.2);
+  --color-accent-fg: #0969da;
+  --color-accent-emphasis: #0969da;
+  --color-attention-subtle: #fff8c5;
+  --color-danger-fg: #cf222e;
+}
 .wmde-markdown {
+  -webkit-text-size-adjust: 100%;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
   font-size: 16px;
   line-height: 1.5;
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
-}
-.wmde-markdown > :first-child {
-  margin-top: 0 !important;
+  word-wrap: break-word;
+  color: var(--color-fg-default);
+  background-color: var(--color-canvas-default);
 }
-.wmde-markdown > :last-child {
-  margin-bottom: 0 !important;
+.wmde-markdown details,
+.wmde-markdown figcaption,
+.wmde-markdown figure {
+  display: block;
 }
-.wmde-markdown pre[class*='language-']:hover .copied,
-.wmde-markdown pre:hover .copied {
-  visibility: visible;
+.wmde-markdown summary {
+  display: list-item;
 }
-.wmde-markdown pre[class*='language-'] .copied,
-.wmde-markdown pre .copied {
-  visibility: hidden;
-  display: flex;
-  position: absolute;
-  cursor: pointer;
-  color: #a5afbb;
-  top: 6px;
-  right: 6px;
-  border-radius: 5px;
-  background: #e3e3e3;
-  padding: 6px;
-  font-size: 12px;
-  transition: all 0.3s;
+.wmde-markdown [hidden] {
+  display: none !important;
 }
-.wmde-markdown pre[class*='language-'] .copied::before,
-.wmde-markdown pre .copied::before {
-  content: ' ';
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  top: 0;
-  left: 0;
+.wmde-markdown a {
+  background-color: transparent;
+  color: var(--color-accent-fg);
+  text-decoration: none;
 }
-.wmde-markdown pre[class*='language-'] .copied .octicon-copy,
-.wmde-markdown pre .copied .octicon-copy {
-  display: block;
+.wmde-markdown a:active,
+.wmde-markdown a:hover {
+  outline-width: 0;
 }
-.wmde-markdown pre[class*='language-'] .copied .octicon-check,
-.wmde-markdown pre .copied .octicon-check {
-  display: none;
+.wmde-markdown abbr[title] {
+  border-bottom: none;
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
 }
-.wmde-markdown pre[class*='language-'] .copied.active .octicon-copy,
-.wmde-markdown pre .copied.active .octicon-copy {
-  display: none;
+.wmde-markdown b,
+.wmde-markdown strong {
+  font-weight: 600;
 }
-.wmde-markdown pre[class*='language-'] .copied.active .octicon-check,
-.wmde-markdown pre .copied.active .octicon-check {
-  display: block;
+.wmde-markdown dfn {
+  font-style: italic;
 }
-.wmde-markdown pre[class*='language-'] .copied:hover,
-.wmde-markdown pre .copied:hover,
-.wmde-markdown pre[class*='language-'] .copied:active,
-.wmde-markdown pre .copied:active,
-.wmde-markdown pre[class*='language-'] .copied.active,
-.wmde-markdown pre .copied.active {
-  background: #2e9b33;
-  color: #fff;
+.wmde-markdown h1 {
+  margin: 0.67em 0;
+  font-weight: 600;
+  padding-bottom: 0.3em;
+  font-size: 2em;
+  border-bottom: 1px solid var(--color-border-muted);
 }
-.wmde-markdown code[class*='language-'],
-.wmde-markdown pre[class*='language-'] {
-  color: black;
-  text-align: left;
-  white-space: pre;
-  word-spacing: normal;
-  word-break: normal;
-  word-wrap: normal;
-  -webkit-hyphens: none;
-          -ms-hyphens: none;
-      hyphens: none;
+.wmde-markdown mark {
+  background-color: var(--color-attention-subtle);
+  color: var(--color-text-primary);
 }
-.wmde-markdown pre code {
-  display: block;
-  padding: 16px;
-  overflow: auto;
-  font-size: 85%;
-  line-height: 1.45;
-  background-color: #f6f8fa;
-  border-radius: 6px;
+.wmde-markdown small {
+  font-size: 90%;
 }
-.wmde-markdown pre {
-  margin-bottom: 18px;
-  line-height: 1.45;
+.wmde-markdown sub,
+.wmde-markdown sup {
+  font-size: 75%;
+  line-height: 0;
   position: relative;
-  overflow-x: auto;
-  background-color: #f6f8fa;
-  border-radius: 3px;
+  vertical-align: baseline;
 }
-.wmde-markdown code,
-.wmde-markdown tt {
-  background-color: rgba(27, 31, 35, 0.05);
-  border-radius: 3px;
-  font-size: 85%;
-  margin: 0;
-  padding: 0.2em 0.4em;
+.wmde-markdown sub {
+  bottom: -0.25em;
 }
-.wmde-markdown pre,
-.wmde-markdown code,
-.wmde-markdown tt {
-  font-family: SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
+.wmde-markdown sup {
+  top: -0.5em;
 }
 .wmde-markdown img {
+  border-style: none;
   max-width: 100%;
+  box-sizing: content-box;
+  background-color: var(--color-canvas-default);
+}
+.wmde-markdown code,
+.wmde-markdown kbd,
+.wmde-markdown pre,
+.wmde-markdown samp {
+  font-family: monospace, monospace;
+  font-size: 1em;
+}
+.wmde-markdown figure {
+  margin: 1em 40px;
+}
+.wmde-markdown hr {
+  box-sizing: content-box;
+  overflow: hidden;
+  background: transparent;
+  border-bottom: 1px solid var(--color-border-muted);
+  height: 0.25em;
+  padding: 0;
+  margin: 24px 0;
+  background-color: var(--color-border-default);
+  border: 0;
 }
 .wmde-markdown input {
-  vertical-align: middle;
-  margin: 0 0.2em 0.25em -1.6em;
+  font: inherit;
+  margin: 0;
+  overflow: visible;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
 }
-.wmde-markdown input + p {
-  display: inline;
+.wmde-markdown [type='button'],
+.wmde-markdown [type='reset'],
+.wmde-markdown [type='submit'] {
+  -webkit-appearance: button;
 }
-.wmde-markdown h1,
-.wmde-markdown h2 {
-  border-bottom: 1px solid #eaecef;
-  padding-bottom: 0.3em;
+.wmde-markdown [type='button']::-moz-focus-inner,
+.wmde-markdown [type='reset']::-moz-focus-inner,
+.wmde-markdown [type='submit']::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+.wmde-markdown [type='button']:-moz-focusring,
+.wmde-markdown [type='reset']:-moz-focusring,
+.wmde-markdown [type='submit']:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+.wmde-markdown [type='checkbox'],
+.wmde-markdown [type='radio'] {
+  box-sizing: border-box;
+  padding: 0;
+}
+.wmde-markdown [type='number']::-webkit-inner-spin-button,
+.wmde-markdown [type='number']::-webkit-outer-spin-button {
+  height: auto;
+}
+.wmde-markdown [type='search'] {
+  -webkit-appearance: textfield;
+  outline-offset: -2px;
+}
+.wmde-markdown [type='search']::-webkit-search-cancel-button,
+.wmde-markdown [type='search']::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+.wmde-markdown ::-webkit-input-placeholder {
+  color: inherit;
+  opacity: 0.54;
+}
+.wmde-markdown ::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  font: inherit;
+}
+.wmde-markdown a:hover {
+  text-decoration: underline;
+}
+.wmde-markdown hr::before {
+  display: table;
+  content: '';
+}
+.wmde-markdown hr::after {
+  display: table;
+  clear: both;
+  content: '';
+}
+.wmde-markdown table {
+  border-spacing: 0;
+  border-collapse: collapse;
+  display: block;
+  width: -webkit-max-content;
+  width: max-content;
+  max-width: 100%;
+  overflow: auto;
+}
+.wmde-markdown td,
+.wmde-markdown th {
+  padding: 0;
+}
+.wmde-markdown details summary {
+  cursor: pointer;
+}
+.wmde-markdown details:not([open]) > *:not(summary) {
+  display: none !important;
+}
+.wmde-markdown kbd {
+  display: inline-block;
+  padding: 3px 5px;
+  font: 11px ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
+  line-height: 10px;
+  color: var(--color-fg-default);
+  vertical-align: middle;
+  background-color: var(--color-canvas-subtle);
+  border: solid 1px var(--color-neutral-muted);
+  border-bottom-color: var(--color-neutral-muted);
+  border-radius: 6px;
+  box-shadow: inset 0 -1px 0 var(--color-neutral-muted);
 }
 .wmde-markdown h1,
 .wmde-markdown h2,
@@ -125,71 +382,256 @@
 .wmde-markdown h4,
 .wmde-markdown h5,
 .wmde-markdown h6 {
+  margin-top: 24px;
+  margin-bottom: 16px;
   font-weight: 600;
   line-height: 1.25;
-  margin-bottom: 16px;
-  margin-top: 24px;
 }
-.wmde-markdown h1 .anchor,
-.wmde-markdown h2 .anchor,
-.wmde-markdown h3 .anchor,
-.wmde-markdown h4 .anchor,
-.wmde-markdown h5 .anchor,
-.wmde-markdown h6 .anchor {
-  float: left;
-  padding-right: 4px;
-  margin-left: -20px;
-  line-height: 1;
+.wmde-markdown table {
+  border-spacing: 0;
+  border-collapse: collapse;
+  display: block;
+  width: -webkit-max-content;
+  width: max-content;
+  max-width: 100%;
+  overflow: auto;
 }
-.wmde-markdown h1 .octicon-link,
-.wmde-markdown h2 .octicon-link,
-.wmde-markdown h3 .octicon-link,
-.wmde-markdown h4 .octicon-link,
-.wmde-markdown h5 .octicon-link,
-.wmde-markdown h6 .octicon-link {
-  visibility: hidden;
-  vertical-align: middle;
+.wmde-markdown td,
+.wmde-markdown th {
+  padding: 0;
 }
-.wmde-markdown h1:hover .octicon-link,
-.wmde-markdown h2:hover .octicon-link,
-.wmde-markdown h3:hover .octicon-link,
-.wmde-markdown h4:hover .octicon-link,
-.wmde-markdown h5:hover .octicon-link,
-.wmde-markdown h6:hover .octicon-link {
-  visibility: visible;
+.wmde-markdown details summary {
+  cursor: pointer;
 }
-.wmde-markdown h1 {
-  font-size: 2em;
+.wmde-markdown details:not([open]) > *:not(summary) {
+  display: none !important;
+}
+.wmde-markdown kbd {
+  display: inline-block;
+  padding: 3px 5px;
+  font: 11px ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
+  line-height: 10px;
+  color: var(--color-fg-default);
+  vertical-align: middle;
+  background-color: var(--color-canvas-subtle);
+  border: solid 1px var(--color-neutral-muted);
+  border-bottom-color: var(--color-neutral-muted);
+  border-radius: 6px;
+  box-shadow: inset 0 -1px 0 var(--color-neutral-muted);
+}
+.wmde-markdown h1,
+.wmde-markdown h2,
+.wmde-markdown h3,
+.wmde-markdown h4,
+.wmde-markdown h5,
+.wmde-markdown h6 {
+  margin-top: 24px;
+  margin-bottom: 16px;
+  font-weight: 600;
+  line-height: 1.25;
 }
 .wmde-markdown h2 {
+  font-weight: 600;
+  padding-bottom: 0.3em;
   font-size: 1.5em;
+  border-bottom: 1px solid var(--color-border-muted);
 }
 .wmde-markdown h3 {
+  font-weight: 600;
   font-size: 1.25em;
 }
 .wmde-markdown h4 {
+  font-weight: 600;
   font-size: 1em;
 }
 .wmde-markdown h5 {
+  font-weight: 600;
   font-size: 0.875em;
 }
 .wmde-markdown h6 {
+  font-weight: 600;
   font-size: 0.85em;
+  color: var(--color-fg-muted);
 }
-.wmde-markdown ol,
-.wmde-markdown ul {
+.wmde-markdown p {
+  margin-top: 0;
+  margin-bottom: 10px;
+}
+.wmde-markdown blockquote {
+  margin: 0;
+  padding: 0 1em;
+  color: var(--color-fg-muted);
+  border-left: 0.25em solid var(--color-border-default);
+}
+.wmde-markdown ul,
+.wmde-markdown ol {
+  margin-top: 0;
+  margin-bottom: 0;
   padding-left: 2em;
 }
-.wmde-markdown ol > p,
-.wmde-markdown ul > p {
+.wmde-markdown ol ol,
+.wmde-markdown ul ol {
+  list-style-type: lower-roman;
+}
+.wmde-markdown ul ul ol,
+.wmde-markdown ul ol ol,
+.wmde-markdown ol ul ol,
+.wmde-markdown ol ol ol {
+  list-style-type: lower-alpha;
+}
+.wmde-markdown dd {
+  margin-left: 0;
+}
+.wmde-markdown tt,
+.wmde-markdown code {
+  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
+  font-size: 12px;
+}
+.wmde-markdown pre {
+  margin-top: 0;
   margin-bottom: 0;
+  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
+  font-size: 12px;
+  word-wrap: normal;
 }
-.wmde-markdown ul {
+.wmde-markdown .octicon {
+  display: inline-block;
+  overflow: visible !important;
+  vertical-align: text-bottom;
+  fill: currentColor;
+}
+.wmde-markdown ::-webkit-input-placeholder {
+  color: var(--color-fg-subtle);
+  opacity: 1;
+}
+.wmde-markdown :-ms-input-placeholder {
+  color: var(--color-fg-subtle);
+  opacity: 1;
+}
+.wmde-markdown ::placeholder {
+  color: var(--color-fg-subtle);
+  opacity: 1;
+}
+.wmde-markdown input::-webkit-outer-spin-button,
+.wmde-markdown input::-webkit-inner-spin-button {
+  margin: 0;
+  -webkit-appearance: none;
+  appearance: none;
+}
+.wmde-markdown [data-catalyst] {
+  display: block;
+}
+.wmde-markdown::before {
+  display: table;
+  content: '';
+}
+.wmde-markdown::after {
+  display: table;
+  clear: both;
+  content: '';
+}
+.wmde-markdown > *:first-child {
+  margin-top: 0 !important;
+}
+.wmde-markdown > *:last-child {
+  margin-bottom: 0 !important;
+}
+.wmde-markdown a:not([href]) {
+  color: inherit;
+  text-decoration: none;
+}
+.wmde-markdown .absent {
+  color: var(--color-danger-fg);
+}
+.wmde-markdown a.anchor {
+  float: left;
+  padding-right: 4px;
+  margin-left: -20px;
+  line-height: 1;
+}
+.wmde-markdown .anchor:focus {
+  outline: none;
+}
+.wmde-markdown p,
+.wmde-markdown blockquote,
+.wmde-markdown ul,
+.wmde-markdown ol,
+.wmde-markdown dl,
+.wmde-markdown table,
+.wmde-markdown pre,
+.wmde-markdown details {
+  margin-top: 0;
   margin-bottom: 16px;
+}
+.wmde-markdown blockquote > :first-child {
   margin-top: 0;
 }
-.wmde-markdown li {
-  display: list-item;
+.wmde-markdown blockquote > :last-child {
+  margin-bottom: 0;
+}
+.wmde-markdown sup > a::before {
+  content: '[';
+}
+.wmde-markdown sup > a::after {
+  content: ']';
+}
+.wmde-markdown h1 .octicon-link,
+.wmde-markdown h2 .octicon-link,
+.wmde-markdown h3 .octicon-link,
+.wmde-markdown h4 .octicon-link,
+.wmde-markdown h5 .octicon-link,
+.wmde-markdown h6 .octicon-link {
+  color: var(--color-fg-default);
+  vertical-align: middle;
+  visibility: hidden;
+}
+.wmde-markdown h1:hover .anchor,
+.wmde-markdown h2:hover .anchor,
+.wmde-markdown h3:hover .anchor,
+.wmde-markdown h4:hover .anchor,
+.wmde-markdown h5:hover .anchor,
+.wmde-markdown h6:hover .anchor {
+  text-decoration: none;
+}
+.wmde-markdown h1:hover .anchor .octicon-link,
+.wmde-markdown h2:hover .anchor .octicon-link,
+.wmde-markdown h3:hover .anchor .octicon-link,
+.wmde-markdown h4:hover .anchor .octicon-link,
+.wmde-markdown h5:hover .anchor .octicon-link,
+.wmde-markdown h6:hover .anchor .octicon-link {
+  visibility: visible;
+}
+.wmde-markdown h1 tt,
+.wmde-markdown h1 code,
+.wmde-markdown h2 tt,
+.wmde-markdown h2 code,
+.wmde-markdown h3 tt,
+.wmde-markdown h3 code,
+.wmde-markdown h4 tt,
+.wmde-markdown h4 code,
+.wmde-markdown h5 tt,
+.wmde-markdown h5 code,
+.wmde-markdown h6 tt,
+.wmde-markdown h6 code {
+  padding: 0 0.2em;
+  font-size: inherit;
+}
+.wmde-markdown ul.no-list,
+.wmde-markdown ol.no-list {
+  padding: 0;
+  list-style-type: none;
+}
+.wmde-markdown ol[type='1'] {
+  list-style-type: decimal;
+}
+.wmde-markdown ol[type='a'] {
+  list-style-type: lower-alpha;
+}
+.wmde-markdown ol[type='i'] {
+  list-style-type: lower-roman;
+}
+.wmde-markdown div > ol:not([type]) {
+  list-style-type: decimal;
 }
 .wmde-markdown ul ul,
 .wmde-markdown ul ol,
@@ -198,177 +640,381 @@
   margin-top: 0;
   margin-bottom: 0;
 }
-.wmde-markdown ul ul ul {
-  list-style-type: square;
+.wmde-markdown li > p {
+  margin-top: 16px;
+}
+.wmde-markdown li + li {
+  margin-top: 0.25em;
+}
+.wmde-markdown dl {
+  padding: 0;
+}
+.wmde-markdown dl dt {
+  padding: 0;
+  margin-top: 16px;
+  font-size: 1em;
+  font-style: italic;
+  font-weight: 600;
+}
+.wmde-markdown dl dd {
+  padding: 0 16px;
+  margin-bottom: 16px;
+}
+.wmde-markdown table th {
+  font-weight: 600;
+}
+.wmde-markdown table th,
+.wmde-markdown table td {
+  padding: 6px 13px;
+  border: 1px solid var(--color-border-default);
+}
+.wmde-markdown table tr {
+  background-color: var(--color-canvas-default);
+  border-top: 1px solid var(--color-border-muted);
+}
+.wmde-markdown table tr:nth-child(2n) {
+  background-color: var(--color-canvas-subtle);
+}
+.wmde-markdown table img {
+  background-color: transparent;
+}
+.wmde-markdown img[align='right'] {
+  padding-left: 20px;
+}
+.wmde-markdown img[align='left'] {
+  padding-right: 20px;
+}
+.wmde-markdown .emoji {
+  max-width: none;
+  vertical-align: text-top;
+  background-color: transparent;
+}
+.wmde-markdown span.frame {
+  display: block;
+  overflow: hidden;
+}
+.wmde-markdown span.frame > span {
+  display: block;
+  float: left;
+  width: auto;
+  padding: 7px;
+  margin: 13px 0 0;
+  overflow: hidden;
+  border: 1px solid var(--color-border-default);
+}
+.wmde-markdown span.frame span img {
+  display: block;
+  float: left;
+}
+.wmde-markdown span.frame span span {
+  display: block;
+  padding: 5px 0 0;
+  clear: both;
+  color: var(--color-fg-default);
+}
+.wmde-markdown span.align-center {
+  display: block;
+  overflow: hidden;
+  clear: both;
 }
-.wmde-markdown ul ul {
-  list-style-type: circle;
+.wmde-markdown span.align-center > span {
+  display: block;
+  margin: 13px auto 0;
+  overflow: hidden;
+  text-align: center;
+}
+.wmde-markdown span.align-center span img {
+  margin: 0 auto;
+  text-align: center;
+}
+.wmde-markdown span.align-right {
+  display: block;
+  overflow: hidden;
+  clear: both;
 }
-.wmde-markdown ul {
-  list-style-type: disc;
+.wmde-markdown span.align-right > span {
+  display: block;
+  margin: 13px 0 0;
+  overflow: hidden;
+  text-align: right;
 }
-.wmde-markdown > blockquote,
-.wmde-markdown > blockquote blockquote {
+.wmde-markdown span.align-right span img {
   margin: 0;
-  border-left: 0.25em solid #dfe2e5;
-  color: #6a737d;
-  padding: 0 1em;
+  text-align: right;
+}
+.wmde-markdown span.float-left {
+  display: block;
+  float: left;
+  margin-right: 13px;
+  overflow: hidden;
+}
+.wmde-markdown span.float-left span {
+  margin: 13px 0 0;
+}
+.wmde-markdown span.float-right {
+  display: block;
+  float: right;
+  margin-left: 13px;
+  overflow: hidden;
+}
+.wmde-markdown span.float-right > span {
+  display: block;
+  margin: 13px auto 0;
+  overflow: hidden;
+  text-align: right;
+}
+.wmde-markdown code,
+.wmde-markdown tt {
+  padding: 0.2em 0.4em;
+  margin: 0;
+  font-size: 85%;
+  background-color: var(--color-neutral-muted);
+  border-radius: 6px;
+}
+.wmde-markdown code br,
+.wmde-markdown tt br {
+  display: none;
+}
+.wmde-markdown del code {
+  text-decoration: inherit;
+}
+.wmde-markdown pre code {
+  font-size: 100%;
+}
+.wmde-markdown pre > code {
+  padding: 0;
+  margin: 0;
+  word-break: normal;
+  white-space: pre;
+  background: transparent;
+  border: 0;
+}
+.wmde-markdown .highlight {
+  margin-bottom: 16px;
 }
-.wmde-markdown > blockquote > :last-child,
-.wmde-markdown > blockquote blockquote > :last-child {
+.wmde-markdown .highlight pre {
   margin-bottom: 0;
+  word-break: normal;
 }
-.wmde-markdown > blockquote > :first-child,
-.wmde-markdown > blockquote blockquote > :first-child {
-  margin-top: 0;
+.wmde-markdown .highlight pre,
+.wmde-markdown pre {
+  padding: 16px;
+  overflow: auto;
+  font-size: 85%;
+  line-height: 1.45;
+  background-color: var(--color-canvas-subtle);
+  border-radius: 6px;
 }
-.wmde-markdown hr {
-  margin: 1.5em auto;
+.wmde-markdown pre code,
+.wmde-markdown pre tt {
+  display: inline;
+  max-width: auto;
+  padding: 0;
+  margin: 0;
+  overflow: visible;
+  line-height: inherit;
+  word-wrap: normal;
+  background-color: transparent;
+  border: 0;
+}
+.wmde-markdown .csv-data td,
+.wmde-markdown .csv-data th {
+  padding: 5px;
+  overflow: hidden;
+  font-size: 12px;
+  line-height: 1;
+  text-align: left;
+  white-space: nowrap;
+}
+.wmde-markdown .csv-data .blob-num {
+  padding: 10px 8px 9px;
+  text-align: right;
+  background: var(--color-canvas-default);
   border: 0;
-  border-top: 2px dotted #eee;
-  height: 1px;
 }
-.wmde-markdown > table,
-.wmde-markdown > blockquote table {
+.wmde-markdown .csv-data tr {
+  border-top: 0;
+}
+.wmde-markdown .csv-data th {
+  font-weight: 600;
+  background: var(--color-canvas-subtle);
+  border-top: 0;
+}
+.wmde-markdown .footnotes {
+  font-size: 12px;
+  color: var(--color-fg-muted);
+  border-top: 1px solid var(--color-border-default);
+}
+.wmde-markdown .footnotes ol {
+  padding-left: 16px;
+}
+.wmde-markdown .footnotes li {
+  position: relative;
+}
+.wmde-markdown .footnotes li:target::before {
+  position: absolute;
+  top: -8px;
+  right: -8px;
+  bottom: -8px;
+  left: -24px;
+  pointer-events: none;
+  content: '';
+  border: 2px solid var(--color-accent-emphasis);
+  border-radius: 6px;
+}
+.wmde-markdown .footnotes li:target {
+  color: var(--color-fg-default);
+}
+.wmde-markdown .footnotes .data-footnote-backref g-emoji {
+  font-family: monospace;
+}
+.wmde-markdown .task-list-item {
+  list-style-type: none;
+}
+.wmde-markdown .task-list-item label {
+  font-weight: 400;
+}
+.wmde-markdown .task-list-item.enabled label {
+  cursor: pointer;
+}
+.wmde-markdown .task-list-item + .wmde-markdown .task-list-item {
+  margin-top: 3px;
+}
+.wmde-markdown .task-list-item .handle {
+  display: none;
+}
+.wmde-markdown .task-list-item-checkbox,
+.wmde-markdown input[type='checkbox'] {
+  margin: 0 0.2em 0.25em -1.6em;
+  vertical-align: middle;
+}
+.wmde-markdown .contains-task-list:dir(rtl) .task-list-item-checkbox,
+.wmde-markdown .contains-task-list:dir(rtl) input[type='checkbox'] {
+  margin: 0 -1.6em 0.25em 0.2em;
+}
+.wmde-markdown ::-webkit-calendar-picker-indicator {
+  -webkit-filter: invert(50%);
+          filter: invert(50%);
+}
+.wmde-markdown pre[class*='language-'] {
+  position: relative;
+}
+.wmde-markdown pre .copied {
+  visibility: hidden;
+  display: flex;
+  position: absolute;
+  cursor: pointer;
+  color: var(--color-fg-defaul);
+  top: 6px;
+  right: 6px;
+  border-radius: 5px;
+  background: var(--color-border-default);
+  padding: 6px;
+  font-size: 12px;
+  transition: all 0.3s;
+}
+.wmde-markdown pre .copied .octicon-copy {
   display: block;
-  overflow: auto;
-  width: 100%;
-  border-collapse: collapse;
-  border-spacing: 0;
-  font-size: 14px;
 }
-.wmde-markdown > table tr,
-.wmde-markdown > blockquote table tr {
-  background-color: #fff;
-  border-top: 1px solid #c6cbd1;
+.wmde-markdown pre .copied .octicon-check {
+  display: none;
 }
-.wmde-markdown > table td,
-.wmde-markdown > blockquote table td,
-.wmde-markdown > table th,
-.wmde-markdown > blockquote table th {
-  border: 1px solid #dfe2e5;
-  padding: 6px 13px;
+.wmde-markdown pre:hover .copied {
+  visibility: visible;
 }
-.wmde-markdown blockquote,
-.wmde-markdown details,
-.wmde-markdown dl,
-.wmde-markdown ol,
-.wmde-markdown p,
-.wmde-markdown pre,
-.wmde-markdown table,
-.wmde-markdown ul {
-  margin-bottom: 16px;
-  margin-top: 0;
+.wmde-markdown pre:hover .copied:hover {
+  background: var(--color-prettylights-syntax-entity-tag);
+  color: var(--color-canvas-default);
 }
-.wmde-markdown a {
-  color: #0366d6;
-  text-decoration: none;
+.wmde-markdown pre:hover .copied:active,
+.wmde-markdown pre .copied.active {
+  background: #2e9b33;
+  color: var(--color-canvas-default);
 }
-.wmde-markdown a:hover {
-  text-decoration: underline;
+.wmde-markdown pre .active .octicon-copy {
+  display: none;
 }
-.wmde-markdown .namespace {
-  opacity: 0.7;
+.wmde-markdown pre .active .octicon-check {
+  display: block;
 }
-.wmde-markdown .token.important {
-  font-weight: normal;
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: var(--color-prettylights-syntax-comment);
+}
+.token.namespace {
+  opacity: 0.7;
 }
-.wmde-markdown .token.bold {
+.token.property,
+.token.tag,
+.token.selector,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: var(--color-prettylights-syntax-entity-tag);
+}
+.token.maybe-class-name {
+  color: var(--color-prettylights-syntax-variable);
+}
+.token.property-access,
+.token.operator,
+.token.boolean,
+.token.number,
+.token.selector .token.class,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin {
+  color: var(--color-prettylights-syntax-constant);
+}
+.token.deleted {
+  color: var(--color-prettylights-syntax-markup-deleted-text);
+}
+.code-line .token.deleted {
+  background-color: var(--color-prettylights-syntax-markup-deleted-bg);
+}
+.token.inserted {
+  color: var(--color-prettylights-syntax-markup-inserted-text);
+}
+.code-line .token.inserted {
+  background-color: var(--color-prettylights-syntax-markup-inserted-bg);
+}
+.token.variable {
+  color: var(--color-prettylights-syntax-constant);
+}
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: var(--color-prettylights-syntax-string);
+}
+.token.color,
+.token.atrule,
+.token.attr-value,
+.token.function,
+.token.class-name {
+  color: var(--color-prettylights-syntax-string);
+}
+.token.rule,
+.token.regex,
+.token.important,
+.token.keyword {
+  color: var(--color-prettylights-syntax-keyword);
+}
+.token.coord {
+  color: var(--color-prettylights-syntax-meta-diff-range);
+}
+.token.important,
+.token.bold {
   font-weight: bold;
 }
-.wmde-markdown .token.italic {
+.token.italic {
   font-style: italic;
 }
-.wmde-markdown .token.entity {
+.token.entity {
   cursor: help;
 }
-.wmde-markdown kbd {
-  background-color: #fafbfc;
-  border-bottom-color: #d1d5da;
-  border: 1px solid #d1d5da;
-  border-radius: 3px;
-  box-shadow: inset 0 -1px 0 #d1d5da;
-  color: #56595d;
-  display: inline-block;
-  font-size: 10px;
-  font-family: ui-monospace, SFMono-Regular, SF Mono, Consolas, Liberation Mono, Menlo, monospace;
-  line-height: 10px;
-  padding: 2px 4px;
-  vertical-align: middle;
-}
-
-.wmde-markdown-color .token.tag .attr-value {
-  color: #032f62;
-}
-.wmde-markdown-color .token.property,
-.wmde-markdown-color .token.tag,
-.wmde-markdown-color .token.boolean,
-.wmde-markdown-color .token.number,
-.wmde-markdown-color .token.function-name,
-.wmde-markdown-color .token.constant,
-.wmde-markdown-color .token.symbol,
-.wmde-markdown-color .token.deleted {
-  color: #0060c9;
-}
-.wmde-markdown-color .token.punctuation {
-  color: #a0a0a0;
-}
-.wmde-markdown-color code[class*='language-'] {
-  color: black;
-}
-.wmde-markdown-color code[class*='language-'] .token.selector,
-.wmde-markdown-color code[class*='language-'] .token.attr-name,
-.wmde-markdown-color code[class*='language-'] .token.string,
-.wmde-markdown-color code[class*='language-'] .token.char,
-.wmde-markdown-color code[class*='language-'] .token.function,
-.wmde-markdown-color code[class*='language-'] .token.builtin {
-  color: #6f42c1;
-}
-.wmde-markdown-color code[class*='language-'] .token.inserted {
-  color: #22863a;
-  background-color: #f0fff4;
-}
-.wmde-markdown-color code[class*='language-'] .token.deleted {
-  color: #b31d28;
-  background-color: #ffeef0;
-}
-.wmde-markdown-color code[class*='language-'] .token.class-name {
-  color: #6f42c1;
-}
-.wmde-markdown-color code[class*='language-'] .code-block {
-  color: #032f62;
-}
-.wmde-markdown-color code[class*='language-'] .token.comment,
-.wmde-markdown-color code[class*='language-'] .token.block-comment,
-.wmde-markdown-color code[class*='language-'] .token.prolog,
-.wmde-markdown-color code[class*='language-'] .token.doctype,
-.wmde-markdown-color code[class*='language-'] .token.cdata {
-  color: #7d8b99;
-}
-.wmde-markdown-color code[class*='language-'] .token.punctuation {
-  color: #a0a0a0;
-}
-.wmde-markdown-color code[class*='language-'] .token.operator,
-.wmde-markdown-color code[class*='language-'] .token.entity,
-.wmde-markdown-color code[class*='language-'] .token.url,
-.wmde-markdown-color code[class*='language-'] .token.variable {
-  color: #d73a49;
-  background: rgba(255, 255, 255, 0.5);
-}
-.wmde-markdown-color code[class*='language-'] .token.atrule,
-.wmde-markdown-color code[class*='language-'] .token.attr-value {
-  color: #004698;
-}
-.wmde-markdown-color code[class*='language-'] .token.keyword {
-  color: #d63200;
-}
-.wmde-markdown-color code[class*='language-'] .token.regex,
-.wmde-markdown-color code[class*='language-'] .token.important {
-  color: #e90;
-}
-.wmde-markdown-color code[class*='language-'] .token.string {
-  color: #0a53c1;
-}
 
 .w-md-editor-aree {
   overflow: auto;
@@ -469,48 +1115,40 @@
     color: transparent !important;
   }
 }
-.w-md-editor-text-pre {
-  color: #333;
-}
-.w-md-editor-text-pre .table .punctuation {
-  color: #c3c3c3;
+.w-md-editor-text-pre .punctuation {
+  color: var(--color-prettylights-syntax-comment) !important;
 }
-.w-md-editor-text-pre .table .table-header {
-  color: #000;
+.w-md-editor-text-pre .token.url,
+.w-md-editor-text-pre .token.content {
+  color: var(--color-prettylights-syntax-constant) !important;
 }
-.w-md-editor-text-pre .url {
-  color: #032f62 !important;
+.w-md-editor-text-pre .token.title.important {
+  color: var(--color-prettylights-syntax-markup-bold);
 }
-.w-md-editor-text-pre .url .content {
-  color: #0366d6;
+.w-md-editor-text-pre .token.code-block .function {
+  color: var(--color-prettylights-syntax-entity);
 }
-.w-md-editor-text-pre .hr {
-  color: #999;
-}
-.w-md-editor-text-pre .blockquote {
-  color: #a6a6a6;
-}
-.w-md-editor-text-pre .title,
-.w-md-editor-text-pre .bold {
-  color: #000 !important;
+.w-md-editor-text-pre .token.bold {
+  font-weight: unset !important;
 }
-.w-md-editor-text-pre .title {
+.w-md-editor-text-pre .token.title {
   line-height: unset !important;
   font-size: unset !important;
   font-weight: unset !important;
 }
-.w-md-editor-text-pre .code.keyword {
-  color: #596394 !important;
+.w-md-editor-text-pre .token.code.keyword {
+  color: var(--color-prettylights-syntax-constant) !important;
 }
-.w-md-editor-text-pre .strike {
-  color: #bf4ca0;
+.w-md-editor-text-pre .token.strike,
+.w-md-editor-text-pre .token.strike .content {
+  color: var(--color-prettylights-syntax-markup-deleted-text) !important;
 }
 
 .w-md-editor-toolbar-child {
   position: absolute;
   border-radius: 3px;
-  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2);
-  background-color: #fff;
+  box-shadow: 0 0 0 1px var(--color-border-default), 0 0 0 var(--color-border-default), 0 1px 1px var(--color-border-default);
+  background-color: var(--color-canvas-default);
   z-index: 1;
   display: none;
 }
@@ -535,8 +1173,8 @@
 }
 
 .w-md-editor-toolbar {
-  border-bottom: 1px solid #dfdfe0;
-  background-color: #fbfbfb;
+  border-bottom: 1px solid var(--color-border-default);
+  background-color: var(--color-canvas-default);
   padding: 0 5px 0 5px;
   display: flex;
   justify-content: space-between;
@@ -561,7 +1199,6 @@
   height: 20px;
   line-height: 14px;
   background: none;
-  color: #586069;
   padding: 4px;
   margin: 0 1px;
   border-radius: 2px;
@@ -572,34 +1209,35 @@
   cursor: pointer;
   transition: all 0.3s;
   white-space: nowrap;
+  color: var(--color-fg-default);
 }
 .w-md-editor-toolbar li > button:hover,
 .w-md-editor-toolbar li > button:focus {
-  color: #06c;
-  background-color: #dcdcdc;
+  background-color: var(--color-neutral-muted);
+  color: var(--color-accent-fg);
 }
 .w-md-editor-toolbar li > button:active {
-  color: #6a57ff;
-  background-color: #dcdcdc;
+  background-color: var(--color-neutral-muted);
+  color: var(--color-danger-fg);
 }
 .w-md-editor-toolbar li > button:disabled {
-  color: #ccc;
+  color: var(--color-border-default);
   cursor: not-allowed;
 }
 .w-md-editor-toolbar li > button:disabled:hover {
   background-color: transparent;
-  color: #ccc;
+  color: var(--color-border-default);
 }
 .w-md-editor-toolbar li.active > button {
-  color: #06c;
-  background-color: #e8e8e8;
+  color: var(--color-accent-fg);
+  background-color: var(--color-neutral-muted);
 }
 .w-md-editor-toolbar-divider {
   height: 14px;
   width: 1px;
   margin: -3px 3px 0 3px !important;
   vertical-align: middle;
-  background-color: #ccc;
+  background-color: var(--color-border-default);
 }
 
 .w-md-editor-bar {
@@ -622,13 +1260,13 @@
 }
 
 .w-md-editor {
-  color: #24292e;
   text-align: left;
-  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2);
   border-radius: 3px;
   padding-bottom: 1px;
   position: relative;
-  background-color: #fff;
+  color: var(--color-fg-default);
+  box-shadow: 0 0 0 1px var(--color-border-default), 0 0 0 var(--color-border-default), 0 1px 1px var(--color-border-default);
+  background-color: var(--color-canvas-default);
   font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }
 .w-md-editor-content {
@@ -643,7 +1281,7 @@
 .w-md-editor-preview {
   width: 50%;
   box-sizing: border-box;
-  box-shadow: inset 1px 0 0 0 #dfdfe0;
+  box-shadow: inset 1px 0 0 0 var(--color-border-default);
   position: absolute;
   padding: 10px 20px;
   overflow: auto;
@@ -660,7 +1298,7 @@
 .w-md-editor-show-preview .w-md-editor-input {
   width: 0%;
   overflow: hidden;
-  background-color: #fdfdfd;
+  background-color: var(--color-canvas-default);
 }
 .w-md-editor-show-preview .w-md-editor-preview {
   width: 100%;