.rich-editor-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px; border: 1px solid rgba(124,190,232,.32); border-bottom: none; background: rgba(8,35,61,.6); }
.rich-editor-group { display: flex; align-items: center; gap: 4px; padding-right: 8px; border-right: 1px solid rgba(124,190,232,.25); }
.rich-editor-group:last-of-type { padding-right: 0; border-right: 0; }
.rich-editor-toolbar select, .rich-editor-toolbar button, .rich-editor-color-label {
	height: 32px; padding: 0 8px; border: 1px solid rgba(124,190,232,.32); border-radius: 0;
	background: rgba(8,35,61,.82); color: white; font: 700 11px var(--body); cursor: pointer;
}
.rich-editor-toolbar button:hover, .rich-editor-toolbar select:hover { border-color: #6dccff; }
.rich-editor-color-label { display: inline-flex; align-items: center; gap: 4px; }
.rich-editor-color-label input[type="color"] { width: 20px; height: 20px; padding: 0; border: none; background: none; cursor: pointer; }
.rich-editor-template { background: rgba(247,168,49,.18); border-color: rgba(247,168,49,.5); }
.rich-editor-image-toolbar {
	display: flex; align-items: center; gap: 12px; padding: 8px; border: 1px solid rgba(124,190,232,.32); border-top: none; border-bottom: none;
	background: rgba(8,35,61,.4); color: #a9c7db; font: 700 11px var(--body);
}
.rich-editor-image-toolbar[hidden] { display: none; }
.rich-editor-image-input[hidden] { display: none; }
.rich-editor-image-toolbar button { height: 28px; padding: 0 10px; border: 1px solid rgba(124,190,232,.32); background: rgba(8,35,61,.82); color: white; cursor: pointer; }
.rich-editor-surface {
	min-height: 220px; max-height: 60vh; overflow-y: auto; overflow-x: hidden; overflow-wrap: break-word; word-break: break-word; padding: 16px; border: 1px solid rgba(124,190,232,.32);
	background: rgba(6,18,30,.85); color: white; font: 14px var(--body); line-height: 1.7; outline: none;
}
.rich-editor-surface:empty::before { content: attr(data-placeholder); color: #6d8296; }
.rich-editor-surface * { max-width: 100%; overflow-wrap: break-word; word-break: break-word; }
.rich-editor-surface img { max-width: 100%; height: auto; cursor: pointer; }
.rich-editor-surface img.rich-editor-image-selected { outline: 2px solid #6dccff; outline-offset: 2px; }
.rich-editor-surface h1, .rich-editor-surface h2, .rich-editor-surface h3 { color: #6dccff; line-height: 1.15; }
.rich-editor-surface a { color: #6dccff; }
.rich-editor-surface table, .rich-content table { width: 100%; margin: 18px 0; border-collapse: collapse; font-size: 13px; }
.rich-editor-surface th, .rich-editor-surface td, .rich-content th, .rich-content td { padding: 10px; border: 1px solid #b9c9d5; text-align: left; }
.rich-editor-surface th, .rich-content th { background: #eef3f5; color: #17202b; font-size: 10px; letter-spacing: .5px; text-transform: uppercase; }
.rich-editor-surface::after { content: ""; display: table; clear: both; }

/* Light-theme rendering of stored rich content on public pages */
.rich-content { color: var(--ink, #17202b); font-size: 14px; line-height: 1.8; overflow-wrap: break-word; word-break: break-word; overflow-x: hidden; }
.rich-content * { max-width: 100%; overflow-wrap: break-word; word-break: break-word; }
.rich-content::after { content: ""; display: table; clear: both; }
.rich-content img { max-width: 100%; height: auto; }
.rich-content h1, .rich-content h2, .rich-content h3 { line-height: 1.15; }
.rich-content a { color: var(--blue, #1769ff); }