.markdown-editor { min-width: 0; max-width: 100%; border: 1px solid rgba(92, 164, 255, .25); border-radius: .8rem; padding: 1rem; background: rgba(7, 22, 40, .42); }
.markdown-toolbar { display: flex; flex-wrap: wrap; gap: .25rem; padding: .45rem; border: 1px solid var(--bs-border-color); border-bottom: 0; border-radius: .45rem .45rem 0 0; background: rgba(15, 40, 70, .72); }
.markdown-toolbar button { min-width: 2rem; min-height: 2rem; border: 0; border-radius: .3rem; color: var(--bs-body-color); background: transparent; }
.markdown-toolbar button:hover, .markdown-toolbar button:focus-visible { color: #fff; background: rgba(61, 139, 253, .22); }
.markdown-editor__input { width: 100%; min-width: 0; max-width: 100%; min-height: clamp(14rem, 38vh, 28rem); border-top-left-radius: 0; border-top-right-radius: 0; resize: vertical; font-family: Consolas, "Cascadia Code", "SFMono-Regular", Menlo, monospace; line-height: 1.55; tab-size: 4; }
.markdown-editor__preview { min-width: 0; min-height: 14rem; max-height: min(60vh, 36rem); overflow: auto; overscroll-behavior: contain; padding: 1rem; border: 1px solid var(--bs-border-color); border-radius: .45rem; background: rgba(5, 17, 31, .55); }
.markdown-body { overflow-wrap: anywhere; line-height: 1.65; }
.markdown-body > :first-child { margin-top: 0; }
.markdown-body > :last-child { margin-bottom: 0; }
.markdown-body :is(h1, h2, h3, h4, h5, h6) { margin: 1.4em 0 .6em; color: var(--bs-heading-color, #e8f3ff); line-height: 1.25; }
.markdown-body :is(h1, h2) { padding-bottom: .35rem; border-bottom: 1px solid rgba(92, 164, 255, .25); }
.markdown-body a { color: #78b7ff; }
.markdown-body blockquote { margin: 1rem 0; padding: .35rem 1rem; border-left: .25rem solid #3d8bfd; color: var(--bs-secondary-color); background: rgba(61, 139, 253, .08); }
.markdown-body code { padding: .12rem .35rem; border-radius: .25rem; color: #b9dcff; background: rgba(18, 48, 80, .85); }
.markdown-body pre { overflow: auto; padding: 1rem; border: 1px solid rgba(92, 164, 255, .2); border-radius: .5rem; background: #071525; }
.markdown-body pre code { padding: 0; color: inherit; background: transparent; }
.markdown-body table { width: 100%; margin: 1rem 0; border-collapse: collapse; }
.markdown-body :is(th, td) { padding: .6rem .75rem; border: 1px solid rgba(122, 174, 228, .3); }
.markdown-body th { background: rgba(30, 77, 126, .55); }
.markdown-body tr:nth-child(even) td { background: rgba(18, 48, 80, .25); }
.markdown-body img { max-width: 100%; height: auto; border-radius: .4rem; }
.markdown-body input[type="checkbox"] { margin-right: .45rem; }

@media (max-width: 575.98px) {
  .markdown-editor { padding: .75rem; }
  .markdown-toolbar button { flex: 0 0 2.35rem; }
  .markdown-editor__preview { max-height: 50vh; padding: .75rem; }
}
