/* Clobar 统一编辑器（assets/clobar-editor.js）的样式。各站一样；页面只设 --ce-top（工具栏吸在页头下面多少）。 */
.ce { --ce-top: 0px; --ce-primary: #007bff; margin: 0 0 12px; }
.ce [hidden] { display: none !important; }

/* 工具栏：外面一层 dock 吸顶（工具栏 + 「更多」那一排 + 弹出的颜色 / 符号面板一起吸住）。 */
.ce-dock { position: sticky; top: var(--ce-top); z-index: 5; }
.ce-bar { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; padding: 6px; border: 1px solid #ccc;
  border-bottom: 0; background: #f4f6f8; }
.ce-dock > .ce-bar:first-child { border-radius: 4px 4px 0 0; }
.ce-more { background: #eef1f4; }
.ce-imgbar { background: #eaf4ff; }
.ce-group { display: inline-flex; flex-wrap: wrap; gap: 2px; padding-right: 8px; border-right: 1px solid #dde2e8; }
.ce-group:last-child { border-right: 0; }
.ce-btn { min-width: 30px; height: 30px; padding: 0 7px; border: 1px solid transparent; border-radius: 4px; background: none;
  font: inherit; font-size: 14px; cursor: pointer; color: #333; white-space: nowrap; }
.ce-btn:hover { background: #fff; border-color: #ccd; }
.ce-btn.on { background: var(--ce-primary); color: #fff; }
.ce-select { height: 30px; border: 1px solid #ccd; border-radius: 4px; background: #fff; font: inherit; font-size: 14px; }
.ce-imgbar-label { font-size: 13px; color: #555; }
.ce-pop { position: absolute; left: 0; top: 100%; z-index: 6; display: flex; flex-wrap: wrap; gap: 3px; max-width: 340px;
  padding: 6px; margin: 4px 0; border: 1px solid #ccd; border-radius: 6px; background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.12); }
.ce-swatch { width: 24px; height: 24px; border: 1px solid #bbb; border-radius: 4px; cursor: pointer; }
.ce-char { width: 30px; height: 30px; border: 1px solid #e3e3e3; border-radius: 4px; background: #fff; font-size: 16px; cursor: pointer; }

/* 手机：工具栏一行左右滑（原来折成好几行、占半屏，键盘一弹出就没地方写了）。 */
@media (max-width: 767px) {
  .ce-dock > .ce-bar { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .ce-dock > .ce-bar::-webkit-scrollbar { display: none; }
  .ce-dock > .ce-bar .ce-group { flex-wrap: nowrap; flex: 0 0 auto; }
}

/* 正文 */
.ce-body { min-height: 360px; padding: 12px 14px; border: 1px solid #ccc; border-radius: 0 0 4px 4px; background: #fff;
  outline: 0; overflow-wrap: anywhere; text-align: left; }
.ce-body:focus { border-color: var(--ce-primary); box-shadow: 0 0 0 3px rgba(0,123,255,.12); }
.ce-body:empty::before { content: attr(data-placeholder); color: #aaa; }
.ce-body img, .ce-body video, .ce-body iframe { max-width: 100%; }
.ce-body table td, .ce-body table th { border: 1px solid #bbb; padding: 4px 6px; min-width: 40px; }
.ce-body a[id^="hw-a-"]::before { content: "⚓"; color: #999; font-size: 12px; }
.ce-body figure { margin: 12px 0; text-align: center; }
.ce-body figure img { display: block; margin: 0 auto; }
.ce-body figcaption { margin-top: 4px; min-height: 1.4em; font-size: 13px; line-height: 1.5; color: #8b8b90; text-align: center;
  text-indent: 0; outline: 1px dashed transparent; }
.ce-body figcaption:empty::before { content: attr(data-placeholder); color: #c0c4cc; }
.ce-body figcaption:focus, .ce-body figure:hover figcaption { outline-color: #cfd8e3; }
.ce-source { display: block; width: 100%; box-sizing: border-box; min-height: 360px; padding: 8px 10px; border: 1px solid #ccc;
  border-radius: 0 0 4px 4px; font-family: Consolas, monospace; font-size: 14px; }

/* 全屏：整块铺满，工具栏吸在最顶上。 */
.ce-full { position: fixed !important; inset: 0; z-index: 85; max-width: none !important; margin: 0 !important;
  padding: 12px 16px !important; background: #fafafa; overflow: auto; }
.ce-full .ce-dock { top: 0; }
.ce-full .ce-body { min-height: calc(100vh - 260px); }

/* 方形封面框（Clobar 发帖页那个虚线方框，两边一样）。 */
.ce-cover { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; }
.ce-cover-box { position: relative; flex: 0 0 auto; width: 120px; height: 120px; padding: 0; border: 1px dashed #b9c4d2;
  border-radius: 12px; background: #fff; cursor: pointer; overflow: hidden; display: grid; place-items: center; }
.ce-cover-box:hover { border-color: var(--ce-primary); }
.ce-cover.has-image .ce-cover-box { border-style: solid; border-color: #dde3ea; }
.ce-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ce-cover.is-fallback .ce-cover-img { opacity: .55; }
.ce-cover-plus { position: absolute; left: 0; right: 0; bottom: 8px; font-size: 13px; color: #556173; text-align: center; }
.ce-cover.is-fallback .ce-cover-plus { color: #1f2d3d; font-weight: 600; text-shadow: 0 0 4px #fff, 0 0 4px #fff; }
.ce-cover-side { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.ce-cover-note { font-size: 13px; color: #888; }
.ce-cover-remove { border: 0; background: none; padding: 0; color: #c0392b; font: inherit; font-size: 13px; cursor: pointer; }