.markdown-field { margin-bottom: 20px; min-width: 0; }
.markdown-field > label { display: block; margin-bottom: 8px; font-weight: 600; }
.markdown-editor { border: 1px solid #304858; border-radius: 10px; overflow: hidden; background: #0d1b28; }
.markdown-editor:focus-within { border-color: #60cfdf; box-shadow: 0 0 0 2px #60cfdf33; }
.markdown-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 8px; background: #182b3b; border-bottom: 1px solid #304858; }
.markdown-toolbar button { min-width: 36px; min-height: 36px; padding: 6px 10px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: #b9d4e4; font: inherit; font-size: 14px; cursor: pointer; }
.markdown-toolbar button:hover, .markdown-toolbar button[aria-pressed="true"] { background: #27495a; color: #7de1e6; }
.markdown-toolbar button:focus-visible { outline: 2px solid #60cfdf; outline-offset: -2px; }
.markdown-toolbar button:disabled { opacity: .4; cursor: default; }
.markdown-toolbar [data-md-command="bold"] { font-weight: 800; }
.markdown-toolbar [data-md-command="italic"] { font-style: italic; }
.markdown-toolbar .markdown-preview-toggle { margin-inline-start: auto; }
.markdown-editor textarea { display: block; box-sizing: border-box; width: 100%; min-height: 260px; max-height: 65vh; margin: 0; padding: 16px; border: 0; border-radius: 0; outline: 0; box-shadow: none; background: transparent; color: inherit; font: inherit; line-height: 1.65; resize: vertical; }
.markdown-editor textarea:focus { outline: 0; box-shadow: none; }
.markdown-editor .markdown-preview { min-height: 260px; max-height: 65vh; overflow: auto; margin: 0; padding: 16px; overflow-wrap: anywhere; }
.markdown-editor [hidden] { display: none !important; }
.markdown-preview[aria-busy="true"]::before { content: '…'; color: #91afc3; }
.markdown-hint { display: block; margin-top: 7px; color: #91afc3; font-size: 12px; }
@media (max-width: 600px) { .markdown-toolbar { gap: 2px; padding: 5px; } .markdown-toolbar button { padding: 6px; } }