/* 页面级样式：发帖 / 回复 / 编辑（forum/post.htm + klp_post_editor + klp_post_rail） */

.klp-post { --rail-w: 300px; }
.klp-req { color: var(--danger); font-style: normal; }

/* ---------- 页头：标题 + 保存状态 + 操作按钮，滚动时吸在顶栏下 ---------- */
.klp-post-head { position: sticky; top: var(--top-h); z-index: 60; display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: -10px 0 12px; padding: 10px 0; background: var(--bg); }
.klp-post-title { display: flex; align-items: center; gap: 12px; min-width: 0; }
.klp-post-title h1 { margin: 0; font-size: 24px; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; }
.klp-post-saved { color: var(--text-2); background: var(--surface); }
.klp-post-saved .k-dotc { background: var(--brand); }
.klp-post-drafts { font-size: 13px; color: var(--text-3); }
.klp-post-drafts b { font-weight: 500; font-family: var(--mono); margin-left: 2px; }
.klp-post-drafts:hover, .klp-post-drafts.a { color: var(--text); }
.klp-post-tip { width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; font-size: 11px; color: var(--text-3); cursor: help; }
.klp-post-acts { display: flex; align-items: center; gap: 8px; flex: none; }
.klp-post-hookbtn { display: contents; }
.klp-post-hookbtn .pn { height: 36px; padding: 0 14px; border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface); color: var(--text); font: 600 14px var(--font); box-shadow: none; cursor: pointer; }
.klp-post-hookbtn .pn:hover { background: var(--hover); }
.klp-post-hookbtn .pn em { font-style: normal; }
.klp-draft-menu { position: absolute; min-width: 320px; max-width: 420px; }
.klp-draft-menu ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; }
.klp-draft-menu li { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: var(--r-sm); font-size: 13px; }
.klp-draft-menu li:hover { background: var(--hover); }
.klp-draft-menu li > a.xi2 { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.klp-draft-menu li label { order: 3; font-size: 12px; color: var(--text-3); }
.klp-draft-menu li .xg1 { font-size: 12px; color: var(--text-3); white-space: nowrap; }
.klp-draft-menu li.xi2 { border-top: 1px solid var(--line); border-radius: 0; margin-top: 4px; padding-top: 10px; }
.klp-draft-menu li.xi2 a { color: var(--ink); }

.klp-post-cols { gap: 24px; }
.klp-post-rail { top: calc(var(--top-h) + 68px); max-height: calc(100vh - var(--top-h) - 88px); overflow-y: auto; scrollbar-width: none; padding-bottom: 4px; }
.klp-post-rail::-webkit-scrollbar { display: none; }

/* ---------- 基本信息卡片 ---------- */
.klp-post-meta { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 16px; }
.klp-post-meta .k-field > label, .klp-pr .k-field > label { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; color: var(--text); }
.klp-post-row2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.klp-sel { position: relative; }
.klp-sel select.k-inp { appearance: none; -webkit-appearance: none; padding-right: 34px; cursor: pointer; }
.klp-sel > .k-ic { position: absolute; right: 11px; top: 50%; margin-top: -8px; color: var(--text-3); pointer-events: none; }
.klp-inp-static { display: flex; align-items: center; background: var(--hover); }
.klp-post-forum { height: 38px; box-sizing: border-box; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-radius: var(--r-md); background: var(--hover); font-size: 14px; min-width: 0; }
.klp-post-forum b { font-weight: 600; }
.klp-post-forum .k-meta { flex: none; }
.klp-post-forum-chg { margin-left: auto; flex: none; font-size: 12.5px; font-weight: 500; color: var(--text-2); }
.klp-post-forum-chg:hover { color: var(--ink); }
.klp-count { margin-left: auto; font-size: 12px; font-weight: 400; color: var(--text-3); cursor: help; }
.klp-count.is-over { color: var(--danger); }
.k-inp.klp-subject { height: 44px; font-size: 16px; font-weight: 500; }
.klp-post-re { height: 40px; display: flex; align-items: center; gap: 12px; padding: 0 12px; border-radius: var(--r-md); background: var(--hover); font-size: 14px; }
.klp-post-re a { margin-left: auto; flex: none; font-size: 12.5px; color: var(--text-2); }

.klp-post-notice { margin: 0; }
.tbms { background: var(--warn-soft); border: 1px solid var(--warn-line); border-radius: 12px; padding: 10px 14px; color: var(--warn); font-size: 13px; }
.tbms a.xi2 { color: var(--warn); text-decoration: underline; }
.tbms .pipe { margin: 0 6px; opacity: .5; }

/* 投票 / 悬赏 / 分类信息等 Discuz 原生表单：只统一外框和输入框 */
.klp-post-special { padding: 18px 20px; overflow: visible; }
.klp-post-special .px, .klp-post-special .ps, .klp-post-special select, .klp-post-special textarea.pt { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); color: var(--text); min-height: 34px; box-sizing: border-box; padding: 0 10px; }
.klp-post-special textarea.pt { padding: 8px 10px; }
.klp-post-special th, .klp-post-special td { padding: 6px 4px; }
.klp-post-special .sinf, .klp-post-special .sadd { float: none; width: auto; }
.klp-post-quote { padding: 12px 16px; border-radius: 12px; background: var(--hover); color: var(--text-2); font-size: 13.5px; }
.klp-post-quote .quote, .klp-post-quote blockquote { margin: 0; padding: 0; border: 0; background: none; }

/* ---------- 编辑器 ----------
 * Discuz 的 editor.css 给按钮写了雪碧图、text-indent: -9999px、float 和固定宽高，这里整套换掉 */
.klp-ed { overflow: visible; }
.klp-ed-loading { padding: 60px 0; text-align: center; color: var(--text-3); font-size: 13px; }
.klp-ed .edt { border: 0; background: none; overflow: visible; }
.klp-ed .edt .bar.klp-ed-bar { position: sticky; top: calc(var(--top-h) + 56px); z-index: 30; height: auto; padding: 0; border: 0; background: var(--surface); border-radius: var(--r-lg) var(--r-lg) 0 0; }
#e_controls_mask { display: none !important; }
.klp-ed-top { display: flex; align-items: center; gap: 12px; padding: 12px 14px 10px; }
.klp-ed-hint { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.klp-ed-tools { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.klp-ed-hook { display: flex; align-items: center; gap: 4px; }
.klp-ed .edt .btn.klp-ed-btns { float: none; display: flex; flex-wrap: wrap; align-items: center; gap: 2px; padding: 6px 10px; border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
/* 按钮组（editor.js 按 id 找它们、改 className）只当逻辑分组，不参与布局 */
.klp-ed-btns > div:not(.klp-ed-more), .klp-ed-btns > div > span, .klp-ed-more > div, .klp-ed-more > div > span, .klp-ed-btns p { display: contents; }
.klp-ed-btns br { display: none; }
.klp-ed-sep { width: 1px; height: 18px; margin: 0 6px; background: var(--line); flex: none; }
/* editor.js 会把按钮的 className 整个改成 "hover" 或清空，所以样式挂在元素上而不是 .klp-eb 类上 */
.klp-ed .edt .bar a, .klp-ed .klp-eb { float: none; box-sizing: border-box; width: auto; min-width: 32px; height: 32px; padding: 0 7px; margin: 0; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 0; border-radius: var(--r-sm); background: none; color: var(--text-2); text-indent: 0; font: 500 13px var(--font); cursor: pointer; overflow: visible; }
.klp-ed .edt .bar a:hover, .klp-ed .klp-eb:hover { background: var(--hover); color: var(--text); }
.klp-ed .edt .bar a.hover, .klp-ed .edt .bar a.hover:hover { background: var(--soft); color: var(--soft-ink); border: 0; box-shadow: none; }
.klp-ed .edt .bar a .k-ic, .klp-ed .klp-eb .k-ic { vertical-align: 0; }
.klp-ed .edt .bar a.dp { width: auto; border: 0; background: none; }
.klp-ed .edt .bar a.tblbtn_disabled, .klp-ed .edt .bar a.hd_dsb { opacity: .4; }
.klp-ed .edt .bar a.cst img { max-height: 18px; }
.klp-ed .klp-ed-moreb { margin-left: auto; color: var(--text-3); }
.klp-ed-more { display: none; flex-basis: 100%; flex-wrap: wrap; align-items: center; gap: 2px; padding-top: 4px; margin-top: 4px; border-top: 1px dashed var(--line); }
.is-more .klp-ed-more { display: flex; }
.klp-ed .is-more .klp-ed-moreb { background: var(--hover); color: var(--text); }
.klp-ed .edt .bar .klp-ed-grp-txt a { font-size: 12.5px; }
/* Markdown 模式下这些按钮插入的是 Discuz 代码，只留能换成 Markdown 语法的和图片、附件、表情、@ */
.klp-post.is-md .klp-ed-more, .klp-post.is-md #e_underline, .klp-post.is-md #e_hide, .klp-post.is-md #e_free, .klp-post.is-md .klp-ed-moreb { display: none; }

.klp-ed-rst { align-items: center; gap: 8px; margin: 12px 14px 0; padding: 8px 12px; border-radius: var(--r-md); background: var(--info-soft); color: var(--info); font-size: 13px; }
.klp-ed-rst[style*="display: block"], .klp-ed-rst[style=""] { display: flex !important; }
.klp-ed-rst a { color: var(--info); }
.klp-ed-rst-x { margin-left: auto; display: grid; place-items: center; }
.klp-ed .edt .area { padding: 0; background: none; }
.klp-ed .edt .pt, .klp-ed #e_textarea { display: block; box-sizing: border-box; padding: 18px 22px 40px !important; font: 15px/1.85 var(--font); color: var(--text); background: transparent; resize: vertical; }
.klp-post.is-md #e_textarea { font: 14px/1.8 var(--mono); }
.klp-ed #e_iframe { display: block; width: 100%; background: transparent; }
.klp-ed .edt .bbar { height: auto; min-height: 44px; box-sizing: border-box; display: flex; align-items: center; gap: 4px 12px; flex-wrap: wrap; padding: 6px 14px; border-top: 1px solid var(--line); background: none; border-radius: 0 0 var(--r-lg) var(--r-lg); text-align: left; font-size: 0; }
.klp-ed .edt .bbar > * { font-size: 12px; }
.klp-ed .edt .bbar, .klp-ed .edt .bbar a { color: var(--text-3); }
.klp-ed .edt .bbar a:hover { color: var(--text); }
.klp-ed .edt .bbar em { float: none; width: auto; height: auto; font-style: normal; order: 2; }
.klp-ed .edt .bbar em:empty { display: none; }
#e_svdsecond, #e_svd, #e_rst, #e_chck, #e_tpr { order: 3; }
#e_resize { display: none; }
.klp-ed-stats { display: flex; gap: 14px; order: 1; }
.klp-ed-stats b { font: 500 12px var(--mono); color: var(--text-2); }
.klp-ed-kbd { order: 9; margin-left: auto; display: inline-flex; align-items: center; gap: 4px; }
.klp-ed-kbd kbd { font: 11px var(--mono); padding: 1px 6px; border: 1px solid var(--line); border-radius: 5px; background: var(--bg); color: var(--text-2); }
/* 全屏编辑：editor.js 把工具栏、编辑区、底栏都改成 fixed，这里补上底色 */
.klp-ed-isfull .klp-ed .edt .bar.klp-ed-bar { border-radius: 0; box-shadow: 0 1px 0 var(--line); }
.klp-ed-isfull .klp-ed .edt .area, .klp-ed-isfull .klp-ed .edt .bbar { background: var(--surface); left: 0; width: 100%; border-radius: 0; }

/* ---------- 附件卡片 ---------- */
.klp-att { padding: 16px 20px 20px; display: flex; flex-direction: column; gap: 12px; }
.klp-att-hd { display: flex; align-items: baseline; gap: 10px; }
.klp-att-hd b { font-size: 15px; flex: none; }
.klp-att-hd .k-meta { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.klp-att-n { margin-left: auto; flex: none; }
.klp-att-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 26px 16px; border: 1.5px dashed var(--line); border-radius: 12px; background: var(--bg); text-align: center; font-size: 14px; color: var(--text-2); cursor: pointer; transition: border-color .15s, background .15s; }
.klp-att-drop > span:first-child { display: inline-flex; align-items: center; gap: 8px; }
.klp-att-drop b { color: var(--text); }
.klp-att-drop:hover, .klp-att-drop.is-over { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 6%, var(--surface)); }
.klp-att-list { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.klp-att-list li { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 8px 0 12px; border: 1px solid var(--line); border-radius: var(--r-md); font-size: 13.5px; }
.klp-att-list li > a, .klp-att-list li > span:not(.klp-att-ic) { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.klp-att-list li > a:hover { color: var(--ink); }
.klp-att-ic { width: 8px; height: 8px; border-radius: 2px; background: var(--brand); flex: none; }
.klp-att-list li.is-img .klp-att-ic { background: var(--info); border-radius: 50%; }
.klp-att-set { height: 28px; padding: 0 10px; border: 0; border-radius: var(--r-sm); background: none; color: var(--text-3); font: 500 12.5px var(--font); cursor: pointer; }
.klp-att-set:hover { background: var(--hover); color: var(--text); }

.klp-post-sec:empty { display: none; }
.sec .px { max-width: 200px; }
#seccheck_secqaa, #seccheck_seccode { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

/* ---------- 右栏 ---------- */
.klp-pr { display: flex; flex-direction: column; gap: 10px; }
.klp-pr .k-card-t { font-size: 14px; }
.klp-pr .k-card-h { margin: 0; }
.klp-pr p.k-meta { margin: 0; line-height: 1.55; }
.klp-pr-stack { gap: 16px; }
.klp-pr-stack .k-field + .k-field { padding-top: 16px; border-top: 1px solid var(--line); }
.klp-pr .k-inp { height: 36px; font-size: 13.5px; }
.klp-types { display: flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 9px; background: var(--hover); }
.klp-types .k-seg { flex: 1 0 auto; justify-content: center; height: 28px; }
.klp-inp-unit { position: relative; display: flex; align-items: center; }
.klp-inp-unit .k-inp { padding-right: 44px; }
.klp-inp-unit > span:last-child { position: absolute; right: 12px; font-size: 12.5px; color: var(--text-3); pointer-events: none; }
.klp-inp-unit .klp-pre { position: absolute; left: 12px; font-size: 12.5px; color: var(--text-3); pointer-events: none; }
.klp-inp-unit .klp-pre + .k-inp { padding-left: 42px; }
.klp-pr-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.klp-pr-pair > div > label { display: block; font-size: 12px; color: var(--text-3); margin-bottom: 4px; }
.klp-pr-mini { font-size: 12px; color: var(--text-3); }
.klp-pr-mini select { height: 26px; padding: 0 4px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--text); font: 12px var(--mono); }

.klp-tagbox { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-height: 38px; box-sizing: border-box; padding: 6px 8px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); cursor: text; }
.klp-tagbox:focus-within { border-color: var(--brand); box-shadow: var(--ring); }
.klp-tag { display: inline-flex; align-items: center; gap: 2px; height: 24px; padding: 0 4px 0 9px; border-radius: 6px; background: var(--hover); font-size: 12.5px; font-weight: 500; }
.klp-tag button { width: 18px; height: 18px; border: 0; padding: 0; border-radius: 4px; background: none; color: var(--text-3); font-size: 14px; line-height: 1; cursor: pointer; }
.klp-tag button:hover { background: var(--line); color: var(--text); }
.klp-tag-inp { flex: 1; min-width: 70px; height: 24px; border: 0; outline: none; background: none; font: 13px var(--font); color: var(--text); padding: 0 2px; }
.klp-tag-inp::placeholder { color: var(--text-3); }
.klp-pr p.k-meta a { margin-left: 8px; color: var(--text-2); }
.klp-pr p.k-meta a:hover { color: var(--ink); }
.klp-tag-recent { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.klp-tag-recent .k-chip { cursor: pointer; background: none; }
.klp-tag-recent .k-chip:hover { border-color: var(--brand); color: var(--text); }

/* 开关：原生 checkbox 画成拨动开关，name / id 不变，Discuz 的脚本照常读 */
.klp-opts { gap: 4px; }
.klp-opts .k-card-t { margin-bottom: 6px; }
.klp-sw { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; font-size: 13.5px; color: var(--text); cursor: pointer; }
.klp-sw input { appearance: none; -webkit-appearance: none; position: relative; flex: none; width: 34px; height: 20px; margin: 0; border: 0; border-radius: 999px; background: var(--line); cursor: pointer; transition: background .15s; }
.klp-sw input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .15s; }
.klp-sw input:checked { background: var(--brand); }
.klp-sw input:checked::after { transform: translateX(14px); }
.klp-sw input:disabled { opacity: .45; cursor: not-allowed; }
.klp-sw input:focus-visible { box-shadow: var(--ring); }
.klp-more { margin-top: 6px; border-top: 1px solid var(--line); padding-top: 6px; }
.klp-more > summary { list-style: none; display: flex; align-items: center; gap: 4px; height: 32px; font-size: 13px; color: var(--text-3); cursor: pointer; }
.klp-more > summary::-webkit-details-marker { display: none; }
.klp-more > summary:hover { color: var(--text); }
.klp-more[open] > summary .k-ic { transform: rotate(180deg); }
.klp-more > p.k-meta { margin-top: 8px; }
.klp-more > p.k-meta a { margin: 0; }
.klp-more-blk { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; padding-top: 8px; border-top: 1px dashed var(--line); font-size: 13px; }
.klp-rush { display: flex; flex-direction: column; gap: 6px; }
.klp-rush > label { font-size: 12px; color: var(--text-3); }
#post_extra_tb label { display: inline-flex; margin: 0 6px 6px 0; padding: 0 10px; height: 28px; align-items: center; border-radius: 999px; border: 1px solid var(--line); cursor: pointer; }
#post_extra_tb label.a { background: var(--soft); color: var(--soft-ink); border-color: transparent; }

.klp-pf { gap: 8px; }
.klp-pf-name { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; }
.klp-pf-mods { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
.klp-pf-mods a { display: flex; align-items: center; gap: 7px; font-size: 13px; color: var(--text); }
.klp-pf-note { margin: 4px 0 0; font-size: 12.5px; line-height: 1.65; color: var(--text-2); }
.klp-pf-rules { max-height: 260px; overflow: auto; padding: 10px 12px; border-radius: var(--r-md); background: var(--hover); font-size: 12.5px; line-height: 1.7; color: var(--text-2); }
.klp-pf-rules img { max-width: 100%; }

/* ---------- 预览 ---------- */
.klp-preview { position: fixed; inset: 0; z-index: 400; display: flex; justify-content: center; align-items: flex-start; padding: 48px 16px; overflow-y: auto; background: rgba(10,13,13,.45); backdrop-filter: blur(2px); }
/* 预览弹窗：遮罩淡入、卡片上浮（关闭时 post.js 调 KLP.fadeOut 淡出） */
.klp-preview { animation: klpFade var(--dur-2) var(--ease-io); }
.klp-preview-in { animation: klpRise var(--dur-3) var(--ease); }
.klp-preview-in { width: 780px; max-width: 100%; box-sizing: border-box; padding: 20px 32px 36px; box-shadow: var(--shadow-pop); }
.klp-preview-hd { display: flex; align-items: center; gap: 10px; margin: 0 -12px 12px 0; }
.klp-preview-hd b { font-size: 13px; color: var(--text-3); font-weight: 500; }
.klp-preview-hd .k-icbtn { margin-left: auto; }
.klp-preview .klp-thread-title { margin: 0 0 18px; font-size: 26px; line-height: 1.4; font-weight: 600; }
.klp-preview-body { font-size: 16px; line-height: 1.85; word-break: break-word; }
.klp-preview-body img { max-width: 100%; height: auto; border-radius: 12px; }
.klp-preview-body blockquote { margin: 8px 0; padding: 12px 16px; border-radius: 12px; background: var(--hover); color: var(--text-2); }
.klp-preview-md { white-space: pre-wrap; font: 13.5px/1.75 var(--mono); margin: 0; padding: 16px; border-radius: 12px; background: var(--hover); }

@media (max-width: 1180px) {
	.klp-post-cols { flex-direction: column; align-items: stretch; }
	.klp-post-rail { position: static; width: auto; max-height: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); align-items: start; }
}
@media (max-width: 640px) {
	.klp-post-head { flex-wrap: wrap; }
	.klp-post-title h1 { font-size: 20px; }
	.klp-ed-hint { display: none; }
}

/* 发帖前选版块（forum.php?mod=misc&action=nav，头部「发布」按钮弹出） */
.klp-fsel { width: 640px; max-width: calc(100vw - 48px); }
.fwin .m_c .klp-fsel { margin: -8px -20px -16px; }
.klp-fsel-hd { display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 12px 24px; }
.klp-fsel-hd h3 { margin: 0; font-size: 17px; font-weight: 600; color: var(--text); }
.klp-fsel-cols { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 24px; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.klp-fsel-col { height: 300px; overflow-y: auto; padding: 6px; display: flex; flex-direction: column; gap: 2px; }
.klp-fsel-col + .klp-fsel-col { border-left: 1px solid var(--line); }
.klp-fsel-col:empty { background: var(--bg); }
.klp-fsel-col a { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 34px; padding: 0 10px; border-radius: var(--r-sm); color: var(--text); font-size: 14px; text-decoration: none; }
.klp-fsel-col a:hover { background: var(--hover); }
.klp-fsel-col a.has-sub::after { content: "›"; color: var(--text-3); font-size: 16px; line-height: 1; }
.klp-fsel-col a.is-on { background: var(--soft); color: var(--soft-ink); font-weight: 600; }
.klp-fsel-col a.is-on::after { color: var(--soft-ink); }
.klp-fsel-empty { margin: auto; font-size: 13px; color: var(--text-3); }
.klp-fsel-ft { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 24px 20px; }
.klp-fsel-path { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.klp-fsel-path #pbnv { font-size: 13px; }
.klp-fsel-path #pbnv b { color: var(--text); font-weight: 600; }
.klp-fsel-path #enterbtn { color: var(--ink); font-size: 13px; flex: none; }
.klp-fsel-ft #postbtn { flex: none; }
.klp-fsel-ft #postbtn:disabled { opacity: .4; cursor: not-allowed; }
.klp-fsel-page { width: fit-content; margin: 24px auto; }

/* 插件在 post_middle / post_bottom 输出的零散选项（远程图片本地化、回帖邮件提醒等） */
.klp-post-hooks { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 20px; padding: 0 4px; font-size: 13px; color: var(--text-2); }
.klp-post-hooks:empty { display: none; }
.klp-post-hooks p, .klp-post-hooks div { margin: 0; }
.klp-post-hooks label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.klp-post-hooks input[type="checkbox"], .klp-post-hooks input[type="radio"] { accent-color: var(--brand); margin: 0; }
.klp-post-hooks a { color: var(--ink); }
#e_svd, #e_chck, #e_tpr { display: none; }

/* 编辑器图片 / 附件弹层里上传插件（h5upload）的「选择文件」按钮：原来是一张蓝色按钮图 */
#e_attach_menu #spanButtonPlaceholder, #e_image_menu #imgSpanButtonPlaceholder { position: relative; display: inline-flex; align-items: center; width: auto; height: 32px; line-height: 32px; padding: 0 14px; border-radius: var(--r-sm); background: var(--text); color: var(--bg); font-size: 13px; font-weight: 600; }
#e_attach_menu #spanButtonPlaceholder:hover, #e_image_menu #imgSpanButtonPlaceholder:hover { opacity: .88; }
#e_attach_menu #spanButtonPlaceholder .webuploader-pick, #e_image_menu #imgSpanButtonPlaceholder .webuploader-pick { text-indent: 0; background: none; }
#e_attach_menu #spanButtonPlaceholder .webuploader-pick::before { content: "选择文件"; }
#e_image_menu #imgSpanButtonPlaceholder .webuploader-pick::before { content: "选择图片"; }
#e_attach_menu .uploaderdndbox, #e_image_menu .uploaderdndbox, #e_attach_menu .uploaderdndboxs, #e_image_menu .uploaderdndboxs { border: 1.5px dashed var(--line); border-radius: 12px; }
#e_attach_menu .uploaderdndtip, #e_image_menu .uploaderdndtip, #e_attach_menu .upfilednd, #e_image_menu .upfilednd { color: var(--text-3); font-size: 15px; }

/* 编辑器弹层底部：提交 + 取消（取消由 post.js 补上） */
#e_menus .pns, #e_menus .o.pns { display: flex; align-items: center; gap: 8px; }
#e_menus .klp-menu-cancel { margin: 0; }

/* 右栏「主题售价 / 回帖奖励」：标题行就是开关，打开后才出现输入 */
.klp-pr .klp-pr-opt > .klp-sw { min-height: 24px; font-weight: 600; font-size: 13px; }
.klp-pr-body { display: flex; flex-direction: column; gap: 8px; }

/* 底栏：字数统计对齐、右下角的「代码」开关 */
.klp-ed-stats span { display: inline-flex; align-items: baseline; gap: 5px; line-height: 20px; }
.klp-ed-stats b { line-height: 20px; }
.klp-ed .edt .bbar .klp-ed-codeb { order: 10; display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 9px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); color: var(--text-2); font: 500 12px var(--font); cursor: pointer; }
.klp-ed .edt .bbar .klp-ed-codeb:hover { background: var(--hover); color: var(--text); }
.klp-ed .edt .bbar .klp-ed-codeb.on { background: var(--soft); border-color: transparent; color: var(--soft-ink); }
.klp-post.is-md .klp-ed-codeb { display: none !important; }
.klp-post.is-code #e_textarea { font: 14px/1.8 var(--mono); }

/* Markdown 分栏：左源码、右预览。预览用 contain: size 不参与撑高，高度跟着左边的编辑框走 */
.klp-md-pv { display: none; }
.klp-post.is-md .klp-ed .edt .area { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.klp-post.is-md #e_textarea { width: 100% !important; border-right: 1px solid var(--line) !important; resize: none; }
.klp-post.is-md .klp-md-pv { display: block; contain: size; overflow-y: auto; padding: 18px 22px 40px; font-size: 15px; line-height: 1.8; color: var(--text); word-break: break-word; background: var(--bg); }
.klp-md-pv .parsedown-markdown { font-size: 15px; }
.klp-md-pv img { max-width: 100%; height: auto; border-radius: 10px; }
.klp-md-pv pre { overflow-x: auto; }
.klp-md-empty { margin: 0; color: var(--text-3); font-size: 13px; }
/* 预览逐字进入：新出现的字从模糊、透明到清晰；整块替换时整体淡入 */
.klp-md-ch { animation: klpMdCh .32s var(--ease, ease-out) both; }
@keyframes klpMdCh { from { opacity: 0; filter: blur(3px); } to { opacity: 1; filter: none; } }
.klp-md-pv.is-in > * { animation: klpMdIn .28s var(--ease, ease-out) both; }
@keyframes klpMdIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .klp-md-ch, .klp-md-pv.is-in > * { animation: none; } }

/* 可视化编辑区的 iframe 也带 .pt 类，不能吃上面给文本框的内边距：
 * 内边距落在 iframe 内容区外面，那一圈点了进不了输入状态。留白改由 iframe 里的 body 自己出（post.js 的 edcss） */
.klp-ed .edt #e_iframe.pt, .klp-ed #e_iframe { padding: 0 !important; }

/* discuz.css 给所有 .tb 标签的选中项画了一条 ::after 下划线；表情分类是分段样式，不要它。
 * 图片 / 附件弹层的标签自己用 border-bottom 画下划线，也关掉 ::after 免得叠两条 */
.sllt [id$="smiliesdiv_tb"] a::after, #e_image_ctrl a::after, #e_attach_ctrl a::after { content: none; display: none; }

/* 图片弹层「网络图片」：地址 / 宽 / 高三栏 */
#e_www .p_opt table { width: 100%; border-collapse: collapse; }
#e_www .p_opt th { padding: 0 0 6px; text-align: left; font-size: 12.5px; font-weight: 500; color: var(--text-2); }
#e_www .p_opt td { padding: 0; }
#e_www .p_opt th + th, #e_www .p_opt td + td { padding-left: 8px; }
#e_www .p_opt .px { margin: 0; }

/* 编辑区获得焦点时不画描边（整个卡片就是编辑区，描边会贴着卡片边缘出现一圈青色） */
.klp-ed #e_textarea:focus, .klp-ed #e_textarea:focus-visible, .klp-ed #e_iframe:focus { outline: none; box-shadow: none; border: 0; }

/* ---------- 编辑器弹层：链接 / @ / 表格等小弹层（.p_pof）、图片 / 附件上传（.fwinmask）、表情（.sllt） ----------
 * 弹层打开时会被 showMenu() 挪到 #append_parent，所以按 id（e_xxx_menu）选，不按位置选 */
div[id^="e_"][id$="_menu"] { --em-pad: 18px; font-size: 13px; color: var(--text); }
div[id^="e_"][id$="_menu"].p_pof { padding: 0; border-radius: 14px; min-width: 260px; }
div[id^="e_"][id$="_menu"] .p_opt { position: relative; padding: var(--em-pad); margin: 0; border: 0; }
div[id^="e_"][id$="_menu"] .p_opt > div:not([class]) { display: flex; flex-direction: column; gap: 6px; color: var(--text-2); font-size: 12.5px; font-weight: 500; }
div[id^="e_"][id$="_menu"] .p_opt > div:not([class]) br { display: none; }
div[id^="e_"][id$="_menu"] .px, div[id^="e_"][id$="_menu"] textarea.pt { box-sizing: border-box; width: 100% !important; height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); color: var(--text); font: 14px var(--font); outline: none; margin-bottom: 6px; }
div[id^="e_"][id$="_menu"] textarea.pt { height: 90px; padding: 8px 12px; }
div[id^="e_"][id$="_menu"] .px:focus, div[id^="e_"][id$="_menu"] textarea.pt:focus { border-color: var(--brand); box-shadow: var(--ring); }
div[id^="e_"][id$="_menu"] .pns { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 0; }
div[id^="e_"][id$="_menu"] .o { display: flex; justify-content: flex-end; align-items: center; gap: 8px; margin: 0; padding: 12px var(--em-pad); border-top: 1px solid var(--line); background: none; }
div[id^="e_"][id$="_menu"] .pn { height: 34px; padding: 0 16px; border-radius: var(--r-md); border: 1px solid var(--line); background: var(--surface); color: var(--text); font: 600 13px var(--font); box-shadow: none; cursor: pointer; }
div[id^="e_"][id$="_menu"] .pn:hover { background: var(--hover); }
div[id^="e_"][id$="_menu"] .pn.pnc { border-color: transparent; background: var(--text); color: var(--bg); }
div[id^="e_"][id$="_menu"] .pn.pnc:hover { opacity: .88; }
div[id^="e_"][id$="_menu"] .pn strong, div[id^="e_"][id$="_menu"] .pn span { font-weight: 600; }

/* 关闭按钮：Discuz 的 cls.gif 在本风格下地址是坏的（拼成了 http://static/...），改画成 × */
div[id^="e_"][id$="_menu"] .flbc { position: relative; display: block; width: 28px; height: 28px; margin: 0; padding: 0; border-radius: var(--r-sm); background: none; text-indent: 0; font-size: 0; cursor: pointer; overflow: hidden; }
div[id^="e_"][id$="_menu"] .flbc::before { content: "×"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 20px; line-height: 1; color: var(--text-3); }
div[id^="e_"][id$="_menu"] .flbc:hover { background: var(--hover); }
div[id^="e_"][id$="_menu"] .p_opt > .y { position: absolute; top: 8px; right: 8px; margin: 0 !important; float: none; z-index: 2; }

/* @ 用户：候选列表就地展开在输入框下面 */
#e_at_menu #at_list { position: static !important; width: auto !important; margin: 2px 0 0; padding: 4px; box-shadow: none; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); min-width: 0; max-height: 240px; overflow-y: auto; animation: none; }
#e_at_menu #at_list ul { margin: 0; padding: 0; list-style: none; }
#e_at_menu #at_list li a { display: flex; align-items: center; height: 32px; padding: 0 10px; border-radius: var(--r-sm); color: var(--text); font-size: 13.5px; font-weight: 400; }
#e_at_menu #at_list li a:hover, #e_at_menu #at_list li a.a { background: var(--soft); color: var(--soft-ink); }
#e_at_menu #at_list li.xg1 { margin-top: 4px; padding: 8px 10px 4px; border-top: 1px solid var(--line); font-size: 12px; font-weight: 400; color: var(--text-3); }

/* 表情：顶部分类做成分段标签，表情排成网格。
 * 私聊、快速回帖这类小编辑器（seditor）的表情层 id 带前缀（pmsmiliesdiv_tb、fastpostsmiliesdiv_table），
 * 所以按 .sllt + id 后缀选，发帖页和各处小编辑器共用一套 */
.sllt { border-radius: 14px; }
.sllt [id$="smiliesdiv_tb"] { width: auto !important; margin: 0 0 8px; padding: 0; border: 0; }
.sllt [id$="smiliesdiv_tb"] ul { display: flex; flex-wrap: wrap; gap: 2px; margin: 0; padding: 3px; list-style: none; border-radius: 9px; background: var(--hover); }
.sllt [id$="smiliesdiv_tb"] li { float: none; display: block; margin: 0; border: 0; background: none; cursor: pointer; }
.sllt [id$="smiliesdiv_tb"] li a { display: flex; align-items: center; height: 26px; padding: 0 12px; margin: 0; border: 0; border-radius: 7px; background: none; color: var(--text-3); font-size: 12.5px; font-weight: 500; text-decoration: none; }
.sllt [id$="smiliesdiv_tb"] li a:hover { color: var(--text); }
.sllt [id$="smiliesdiv_tb"] li.current a { background: var(--surface); color: var(--text); box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 0 0 1px var(--line); }
.sllt [id$="smiliesdiv_table"] { border-collapse: separate; border-spacing: 2px; }
.sllt [id$="smiliesdiv_table"] td { width: 34px; height: 34px; padding: 0; border: 0; border-radius: var(--r-sm); text-align: center; vertical-align: middle; cursor: pointer; }
.sllt [id$="smiliesdiv_table"] td:hover { background: var(--hover); }
.sllt [id$="smiliesdiv_table"] td img { width: 24px; height: 24px; object-fit: contain; }
.sllt .sllt_p { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); font: 12px var(--mono); color: var(--text-3); }
.sllt .sllt_p .z { display: flex; gap: 4px; float: none; }
.sllt .sllt_p a { height: 26px; padding: 0 10px; display: inline-flex; align-items: center; border-radius: var(--r-sm); border: 1px solid var(--line); color: var(--text-2); font: 500 12px var(--font); text-decoration: none; }
.sllt .sllt_p a:hover { background: var(--hover); color: var(--text); }

/* 图片 / 附件上传弹层 */
#e_image_menu table.fwin, #e_attach_menu table.fwin { width: 100%; }
#e_image_menu td.m_c, #e_attach_menu td.m_c { padding: 0; }
#e_image_menu .mtm, #e_attach_menu .mtm { margin: 0; }
#e_image_ctrl, #e_attach_ctrl { display: flex; align-items: center; gap: 4px; height: auto; margin: 0 !important; padding: 10px 10px 0 calc(var(--em-pad) - 12px); border-bottom: 1px solid var(--line); line-height: normal; background: none; }
#e_image_ctrl li, #e_attach_ctrl li { float: none; margin: 0; border: 0; background: none; }
#e_image_ctrl li.y, #e_attach_ctrl li.y { order: 9; margin-left: auto; align-self: center; padding-bottom: 8px; }
#e_image_ctrl li a, #e_attach_ctrl li a { display: flex; align-items: center; height: 40px; padding: 0 12px; margin: 0 0 -1px; border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: none; color: var(--text-3); font-size: 14px; font-weight: 500; text-decoration: none; }
#e_image_ctrl li a:hover, #e_attach_ctrl li a:hover { color: var(--text); }
#e_image_ctrl li.current a, #e_attach_ctrl li.current a { color: var(--text); font-weight: 600; border-bottom-color: var(--text); background: none; }
#e_image_menu .p_opt, #e_attach_menu .p_opt { padding: 16px var(--em-pad); }
#e_image_menu .bbda, #e_attach_menu .bbda { border-bottom: 0; }
#e_image_menu .pbm.cl, #e_attach_menu .pbm.cl { display: flex; align-items: center; gap: 12px; padding: 0 0 12px; }
#e_image_menu .upfilelist, #e_attach_menu .upfl, #e_image_menu .uploaderdndbox, #e_attach_menu .uploaderdndbox { box-sizing: border-box; min-height: 150px; max-height: 320px; overflow-y: auto; margin: 0; padding: 8px; border: 1.5px dashed var(--line); border-radius: 12px; background: var(--bg); }
#e_image_menu .uploaderdndtip, #e_attach_menu .uploaderdndtip { height: 132px; line-height: 132px; font-size: 14px; color: var(--text-3); }
#e_image_menu .webuploader-dnd-over, #e_attach_menu .webuploader-dnd-over { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 6%, var(--surface)); }
#e_image_menu .notice, #e_attach_menu .notice { margin: 12px 0 0; padding: 0; border: 0; background: none; font-size: 12.5px; line-height: 1.7; color: var(--text-3); }
#e_image_menu .notice .xi1, #e_attach_menu .notice .xi1 { color: var(--text-2); font-weight: 500; }
#e_image_menu .miniqrcode { width: 56px; height: 56px; border-radius: 8px; border: 1px solid var(--line); background: #fff; padding: 3px; box-sizing: border-box; }
#e_image_menu #image_tblheader { display: flex; justify-content: space-between; padding: 0 0 8px; border: 0; font-size: 12.5px; }
#e_image_menu #image_tblheader a, #e_attach_menu #attach_tblheader a { color: var(--ink); }
#e_image_menu #imgattachlist table { width: 100%; }
#e_image_menu #imgattachlist td { padding: 4px; vertical-align: top; }
#e_image_menu #imgattachlist img { border-radius: 8px; max-width: 100%; }

/* ---------- 附件上传弹层 ----------
 * 已上传的文件：Discuz 每个文件一张小表（刚上传的在 #fsUploadProgress，已有的在 #attachlist），
 * 列是 文件名 / 描述 / 阅读权限 / 售价 / 删除。表头（#attach_tblheader）是另一张表，
 * 两边都用 table-layout: fixed + 同样的列宽，才能上下对齐 */
#e_attach_menu { width: min(700px, calc(100vw - 32px)) !important; }
#e_attach_menu #e_attachlist > .pbm { display: flex; align-items: center; gap: 12px; padding: 0 0 12px; }
#e_attach_menu #e_attachlist > .pbm::after { content: "上传后点文件名插入正文"; margin-left: auto; font-size: 12px; color: var(--text-3); }
#e_attach_menu #attach_tblheader { width: 100%; table-layout: fixed; border-collapse: separate; border: 0; margin: 0; padding: 0 9px; }
#e_attach_menu #attach_tblheader td { padding: 0 10px 6px; border: 0; font-size: 12px; font-weight: 500; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#e_attach_menu #attach_tblheader td.atnu, #e_attach_menu #attach_tblheader img { display: none; }
#e_attach_menu .upfl { padding: 6px; }
#e_attach_menu .upfl table { width: 100%; table-layout: fixed; border-collapse: separate; border-spacing: 0; }
#e_attach_menu .upfl .progressWrapper, #e_attach_menu #attachlist > table { margin: 0 0 6px; }
#e_attach_menu .upfl tbody[id^="attach_"] td { height: 44px; padding: 6px 10px; border: 1px solid var(--line); border-width: 1px 0; background: var(--surface); font-size: 13px; vertical-align: middle; }
#e_attach_menu .upfl tbody[id^="attach_"] td:first-child { border-left-width: 1px; border-radius: 10px 0 0 10px; }
#e_attach_menu .upfl tbody[id^="attach_"] td:last-child { border-right-width: 1px; border-radius: 0 10px 10px 0; }
/* 列宽：表头与文件行共用 */
#e_attach_menu .atds, #e_attach_menu .attv, #e_attach_menu .attp, #e_attach_menu .attpr, #e_attach_menu .attc { box-sizing: border-box; }
#e_attach_menu .atds { width: 120px; }
#e_attach_menu .attv { width: 116px; }
#e_attach_menu .attp, #e_attach_menu .attpr { width: 76px; }
#e_attach_menu .attc { width: 50px; text-align: center; }
#e_attach_menu .attswf p { display: flex; align-items: center; margin: 0; min-width: 0; }
#e_attach_menu .attswf p > span { display: flex; align-items: center; gap: 8px; min-width: 0; }
#e_attach_menu .attswf img.vm { width: 16px; height: 16px; flex: none; opacity: .75; }
#e_attach_menu .attswf a.xi2 { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-weight: 500; }
#e_attach_menu .attswf a.xi2:hover { color: var(--ink); }
#e_attach_menu .attswf .atturl img { width: 14px; height: 14px; opacity: .5; margin-left: 4px; }
#e_attach_menu .upfl tbody[id^="attach_"] .px, #e_attach_menu .upfl tbody[id^="attach_"] .ps { box-sizing: border-box; width: 100% !important; height: 30px; margin: 0; padding: 0 8px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--surface); color: var(--text); font: 12.5px var(--font); }
#e_attach_menu .upfl tbody[id^="attach_"] .px:focus, #e_attach_menu .upfl tbody[id^="attach_"] .ps:focus { border-color: var(--brand); box-shadow: var(--ring); outline: none; }
#e_attach_menu .upfl a.d { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border-radius: var(--r-sm); background: none; text-indent: 0; font-size: 0; color: var(--text-3); float: none; }
#e_attach_menu .upfl a.d::before { content: "×"; font-size: 18px; line-height: 1; }
#e_attach_menu .upfl a.d:hover { background: var(--danger-soft); color: var(--danger); }
/* 有文件之后，拖放提示缩成一行，不再占 132px */
#e_attach_menu .upfl:has(tbody[id^="attach_"]) .uploaderdndtip { height: 40px; line-height: 40px; font-size: 12.5px; }
#e_attach_menu .upfl:has(tbody[id^="attach_"]) { min-height: 0; }