/* the editor's rich writing box (emoji-editor.js): formatting, quotes, lists and emoji show as they will in the post */
.editor.has-ce textarea[data-ed-text] { display: none !important; }
.ed-ce { display: block; width: 100%; box-sizing: border-box; padding: 12px 14px; min-height: 180px; max-height: 70vh; overflow-y: auto; color: var(--text); font: 1rem/1.6 var(--ui); overflow-wrap: anywhere; word-break: break-word; outline: none; cursor: text; position: relative; }
.ed-ce.is-empty::before { content: attr(data-placeholder); position: absolute; top: var(--ed-pt, 12px); left: var(--ed-pl, 14px); right: 14px; color: var(--muted); pointer-events: none; }
.ed-ce img.emo { width: 22px; height: 22px; vertical-align: -5px; margin: 0 1px; object-fit: contain; }
.ed-ce b, .ed-ce strong { font-weight: 700; }
.ed-ce a { color: var(--gold); text-decoration: underline; text-decoration-color: rgba(227, 194, 122, .45); text-underline-offset: 2px; }
.ed-ce h1, .ed-ce h2, .ed-ce h3, .ed-ce h4, .ed-ce h5, .ed-ce h6 { font: 600 1.15rem/1.25 var(--title); letter-spacing: .02em; color: var(--gold2); margin: .4em 0 .5em; }
.ed-ce blockquote { margin: .4em 0 1em; padding: 10px 14px; border-left: 3px solid var(--gold-dim); background: #12100c; border-radius: 0 var(--r-s) var(--r-s) 0; color: var(--soft); }
.ed-ce blockquote[data-who]::before { content: attr(data-who) " said"; display: block; font-size: .86rem; color: var(--gold-dim); margin-bottom: 4px; user-select: none; }
.ed-ce blockquote blockquote { margin: .3em 0 .6em; }
.ed-ce pre { background: #0a0907; border: 1px solid var(--line); border-radius: var(--r-s); padding: 12px 14px; margin: .5em 0 1em; font: .9rem/1.5 var(--mono); color: #e7dcc6; white-space: pre-wrap; overflow-wrap: anywhere; }
.ed-ce aside { border: 1px dashed var(--line2); border-radius: var(--r-s); padding: 6px 12px; margin: .4em 0 1em; }
.ed-ce aside::before { content: "Spoiler"; display: block; color: var(--gold); font-weight: 600; margin-bottom: 6px; user-select: none; }
.ed-ce aside[data-title]::before { content: attr(data-title); }
.ed-ce section { text-align: center; }
.ed-ce ul, .ed-ce ol { padding-left: 1.5em; margin: .4em 0 .9em; }
.ed-ce img.ed-img { display: inline-block; max-width: 100%; max-height: 260px; height: auto; vertical-align: middle; border-radius: var(--r-s); border: 1px solid var(--line); margin: 4px 0; }
.ed-ce > :first-child { margin-top: 0; }
.editor .ed-bar > button.on { background: var(--panel3); color: var(--gold2); box-shadow: inset 0 0 0 1px rgba(227, 194, 122, .28); }
.ed-ce.ed-bad { box-shadow: inset 0 0 0 1px #b8574a; }
.emo-ac { position: absolute; z-index: 31; min-width: 200px; max-width: calc(100% - 12px); max-height: 264px; overflow-y: auto; background: var(--panel2); border: 1px solid var(--line2); border-radius: var(--r-s); box-shadow: 0 14px 30px rgba(0, 0, 0, .5); }
.emo-ac button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 12px; border: 0; background: none; color: var(--text); font: .95rem var(--ui); cursor: pointer; text-align: left; }
.emo-ac button img { width: 22px; height: 22px; flex: none; }
.emo-ac button.on, .emo-ac button:hover { background: var(--panel3); }
@media (max-width: 700px) { .emo-ac button { padding: 10px 12px; } .ed-ce { font-size: 16px; } }
/* posts: the line break the writer puts after a quote, heading, list, code, spoiler or centred block is only the
   block's own end, so it takes no extra space (the post then looks exactly as it did in the writing box) */
.pbody blockquote.quote + br, .pbody h3.ph + br, .pbody ul + br, .pbody ol + br, .pbody pre.code + br, .pbody details.spoiler + br, .pbody .pc + br { display: none; }
