.composer{width:920px}
.editor-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 26px 10px}
.editor-modes{display:flex;border:1px solid #e8ddf4;border-radius:8px;background:#faf7fd;padding:3px}
.editor-modes button{border:0;background:none;color:#857392;border-radius:5px;padding:7px 13px;font:inherit;font-size:12px;cursor:pointer}
.editor-modes button[aria-pressed=true]{background:linear-gradient(110deg,#ff006e,#a020f0);color:white;box-shadow:0 2px 6px #a020f024}
#editor-status{font-size:10px;color:#9887a8}
.format-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:0 26px 10px;border-bottom:1px solid #f0eaf5}
.format-toolbar button{border:0;background:transparent;padding:7px 10px;min-width:30px;border-radius:5px;font-size:12px;color:#5f4477;cursor:pointer}
.format-toolbar button:hover,.format-toolbar button:focus-visible{background:#f3e7fc;outline:2px solid #d7b6f0}
.format-divider{width:1px;height:18px;background:#e9dff2;margin:0 4px}
.compose-rich{overflow:auto;overflow-wrap:anywhere;min-height:220px;max-height:38vh;padding:20px 27px;line-height:1.7;font-size:14px;outline:none}
.compose-rich:focus{box-shadow:inset 3px 0 #d91cff}
.compose-rich:empty:before{content:attr(data-placeholder);color:#a9a0b6;pointer-events:none}
.compose-rich p{margin:0 0 12px}.compose-rich a{color:#6d28ff;text-decoration:underline}
.compose-rich blockquote{border-left:3px solid #e4d6ef;padding-left:14px;margin-left:4px;color:#7e6c8d}
.compose-rich table{border-collapse:collapse;max-width:100%}.compose-rich td,.compose-rich th{border:1px solid #e2d8eb;padding:8px}
.composer .compose-source{font-family:Consolas,monospace;font-size:12px;line-height:1.7;background:#faf8fd;min-height:220px;max-height:38vh;white-space:pre-wrap}
.editor-help{margin:0;padding:8px 26px 12px;font-size:10px;color:#9683a5}
.composer [hidden]{display:none!important}
.composer button:disabled{opacity:.55;cursor:wait}
.composer-window-actions{display:flex;align-items:center;gap:10px}
.composer form{overflow-y:auto}
.composer footer{position:sticky;bottom:0;z-index:2;background:white}
.composer header,.compose-fields,.editor-controls,.format-toolbar,.editor-insert-panel,.editor-meta,.attachment-list{flex-shrink:0}
.format-toolbar{gap:6px;padding-top:3px}
.format-group{display:flex;align-items:center;gap:2px;flex-wrap:wrap;padding-right:7px;border-right:1px solid #ece4f3}
.format-group:last-child{border-right:0}
.format-toolbar button{min-height:32px;padding:6px 8px}
.format-toolbar button[aria-pressed=true]{background:#eee1fc;color:#6d28ff;box-shadow:inset 0 0 0 1px #ddc5f5}
.format-toolbar select{max-width:135px;border:1px solid #e8ddf4;border-radius:6px;background:#faf7fd;color:#5f4477;font:inherit;font-size:11px;min-height:32px;padding:5px 7px;cursor:pointer}
.format-toolbar select:focus-visible,.format-color:focus-within{outline:2px solid #b88be3;outline-offset:2px}
.format-color{display:flex;align-items:center;justify-content:center;gap:3px;min-height:32px;padding:4px;border-radius:5px;color:#5f4477;font-size:12px}
.format-color input{width:22px;height:23px;border:0;background:transparent;padding:0;cursor:pointer}
.compose-rich{font-family:Arial,sans-serif;font-size:16px;min-height:180px;flex:1 0 180px;max-height:45dvh}
.compose-rich h1,.compose-rich h2,.compose-rich h3{line-height:1.3;margin:12px 0}
.compose-rich pre{white-space:pre-wrap;background:#f6f3fa;padding:12px}
.compose-rich hr{border:0;border-top:1px solid #ded6e8;margin:18px 0}
.editor-insert-panel{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;padding:12px 26px;background:#faf7fd;border-bottom:1px solid #ece4f3}
.editor-insert-panel label{display:flex;flex:1;min-width:120px;flex-direction:column;gap:5px;font-size:11px;color:#756186}
.editor-insert-panel input:not([type=checkbox]){width:100%;border:1px solid #dfd3eb;border-radius:6px;padding:8px;background:white;font:inherit;color:#33214d}
.editor-insert-panel input:focus{outline:2px solid #b88be3;outline-offset:1px}
.editor-insert-panel input[type=number]{max-width:90px}
.editor-insert-panel .editor-check{flex-direction:row;align-items:center;min-width:190px;align-self:center}
.editor-insert-panel .secondary{font-size:11px;min-height:34px}
.emoji-panel{display:block}
.emoji-panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:7px;font-size:12px;color:#756186}
.emoji-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px;max-width:660px}
.emoji-grid button{font-family:"Segoe UI Emoji","Apple Color Emoji",sans-serif;font-size:23px;background:transparent;border-radius:6px;min-height:36px;padding:4px;line-height:1.2}
.emoji-grid button:hover,.emoji-grid button:focus-visible{background:#eadcf9;outline:2px solid #d1a9ee}
.editor-meta{display:flex;justify-content:space-between;gap:12px;padding:7px 26px 10px;font-size:10px;color:#94839f}
.editor-preview-dialog{width:800px;max-width:calc(100vw - 24px);height:80dvh;max-height:92dvh;padding:0;border:1px solid #e4dfec;border-radius:14px;box-shadow:0 24px 100px #1a13243d;color:#33214d;background:white}
.editor-preview-dialog[open]{display:flex;flex-direction:column}
.editor-preview-dialog::backdrop{background:#241c305e;backdrop-filter:blur(3px)}
.editor-preview-dialog header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;background:#f5eefb;flex-shrink:0}
.editor-preview-dialog .eyebrow{font-size:9px;color:#9885a9}
.editor-preview-dialog h2{font-size:19px;margin:6px 0 0;font-weight:550}
.preview-envelope{display:grid;gap:6px;padding:16px 24px;border-bottom:1px solid #ece4f3;overflow-wrap:anywhere}
.preview-envelope strong{font-size:14px}.preview-envelope span{font-size:12px;color:#887497}
.editor-preview-dialog iframe{width:100%;border:0;flex:1;min-height:100px;background:white}
.editor-preview-dialog>p{font-size:11px;line-height:1.6;color:#94839f;padding:12px 24px;margin:0;border-top:1px solid #ece4f3}
.composer.composer-expanded{width:calc(100vw - 40px);height:94dvh;max-height:94dvh}
.composer.composer-expanded form{height:100%;max-height:94dvh}
.composer.composer-expanded .compose-rich,.composer.composer-expanded .compose-source{max-height:none;flex:1 0 180px}
@media(max-width:650px){.editor-controls{padding:12px 20px 9px}#editor-status{display:none}.format-toolbar{padding-inline:17px}.compose-rich,.composer .compose-source{flex:1;max-height:none;min-height:100px}.editor-help{padding-inline:20px}}
@media(max-width:650px){.editor-controls{align-items:flex-start;flex-wrap:wrap}.editor-ai-actions{flex-wrap:wrap}.format-group{padding-right:4px}.format-toolbar{gap:5px;max-height:170px;overflow:auto}.format-toolbar button{padding:6px;min-height:34px}.format-toolbar select{max-width:115px}.editor-insert-panel{padding:12px 20px}.emoji-grid{grid-template-columns:repeat(8,minmax(0,1fr));max-height:155px;overflow:auto}.editor-meta{padding-inline:20px}.editor-meta>span:last-child{display:none}.composer header{padding-block:13px}.composer.composer-expanded{width:100%;height:100dvh;max-height:100dvh}.composer.composer-expanded form{max-height:100dvh}.composer .compose-rich,.composer .compose-source{flex:1 0 150px}.composer-window-actions{gap:3px}}
