/* 页面级样式：个人空间 / 消息 / 搜索（沿用 Discuz 原生结构，只做外观） */

/* 左侧二级菜单 + 内容：设置、勋章、道具、任务、消息等原生页面共用的 ct2_a 布局。
   Discuz 给它写了整列外框、每项虚线、选中项负边距白框、固定行高和 overflow: hidden，这里全部清掉重画。 */
.ct2_a { display: flex; gap: 24px; align-items: flex-start; background: none; border: 0; }
.ct2_a .appl { flex: none; order: -1; float: none; width: 208px; margin: 0; padding: 8px; box-sizing: border-box; overflow: visible; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); position: sticky; top: calc(var(--top-h) + 20px); }
.ct2_a .mn { flex: 1; min-width: 0; float: none; display: block; width: auto; margin: 0; padding: 0; }
.appl .tbn { margin: 0; background: none; border: 0; }
.appl .tbn .mt, .appl .tbn h2 { margin: 0; padding: 6px 10px 8px; border: 0; font-size: 12px; font-weight: 500; color: var(--text-3); letter-spacing: .02em; }
.appl ul, .appl .tbn ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.appl li, .appl .tbn li, .appl .tbn li.a { margin: 0; padding: 0; height: auto; line-height: normal; border: 0; background: none; overflow: visible; font-size: 14px; }
.appl li a, .appl .tbn ul a { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 10px; border-radius: var(--r-sm); color: var(--text-2); font-weight: 500; line-height: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.appl li a:hover, .appl .tbn ul a:hover { background: var(--hover); color: var(--text); }
.appl li.a a, .appl .tbn li.a a, .appl li.current a { background: var(--hover); color: var(--text); font-weight: 600; }
.appl img { margin: 0; width: 16px; height: 16px; flex: none; }
.appl span { float: none; margin-left: auto; font-size: 12px; }
.appl .tbn + .tbn, .appl .bbda + .tbn { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line); }

/* ── 设置区：home.php?mod=spacecp 下的全部页面 + 私信 ──────────────────────────
   个人资料、积分、用户组、隐私筛选、密码安全、访问推广，以及挂在设置里的插件页
   （手机号绑定、账号注销、头像挂件、我的授权、QQ 绑定…），用的都是 Discuz 原生模板，
   内容块一律写成 .bm.bw0 —— 原版靠 .ct2_a 这一列的整体外框把它们围住，新模板把那个外框
   去掉了（左菜单自己成了卡片），内容于是变成一块没有边界、贴着边的裸 HTML。
   这里把内容块重新画成卡片，再把 Discuz 的标题、标签页、表单表格、数据表格排一遍版。
   勋章 / 道具 / 私信列表这些已经改写成 .k-card 的页面不受影响（选择器只认 .bm）。 */
.ct2_a .mn > .bm { box-sizing: border-box; margin: 0 0 16px; --bm-px: 24px; padding: 0 var(--bm-px) 24px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); overflow: visible; }
.ct2_a .mn > .bm:last-child { margin-bottom: 0; }
/* Discuz 在 .ct2_a 布局里把页面标题藏了（.ct2_a h1.mt{display:none}，左菜单已经指明在哪一页），
   新版把它当卡片头用，顺手去掉标题里那些老版 gif 图标 */
.ct2_a .mn > .bm > h1.mt { display: block; margin: 0 calc(-1 * var(--bm-px)); padding: 0 var(--bm-px); border-bottom: 1px solid var(--line); font: 600 15px/50px var(--font); color: var(--text); }
.ct2_a .mn > .bm > h1.mt img { display: none; }
/* 卡片头之后的第一块内容要留出间距；标签页和整条通栏的说明除外，它们自己贴边 */
.ct2_a .mn > .bm > h1.mt + * { margin-top: 20px; }
.ct2_a .mn > .bm > h1.mt + .tb { margin-top: 0; }

/* 插件页常在块里直接丢 <br> 撑间距，卡片有自己的节奏，去掉 */
.ct2_a .mn > .bm > br { display: none; }
/* 块里直接写的小标题（QQ 绑定、头像挂件这些插件页） */
.ct2_a .mn > .bm > h2 { margin: 20px 0 10px; font-size: 14px; font-weight: 600; color: var(--text); }

/* 标签页：通栏画到卡片两边 */
.ct2_a .mn > .bm > .tb { margin: 0 calc(-1 * var(--bm-px)) 20px; padding: 0 var(--bm-px); }
/* 提醒页：Discuz 把「筛选设置」写成首个 .y，discuz.css 的 margin-left: auto 会把整排页签推到右边；
   这里整排靠左，筛选设置排到页签后面 */
.ct2_a .mn > .bm > .tb > .y:has(> a[href*="op=filter"]) { order: 1; margin-left: 0; }
/* 说明段落（.bbda 是 Discuz 的下边框工具类） */
.ct2_a .mn > .bm > p, .ct2_a .mn > .bm > div.bbda { line-height: 1.7; font-size: 13px; color: var(--text-2); }
.ct2_a .mn > .bm > .bbda { margin: 0 calc(-1 * var(--bm-px)) 20px; padding: 0 var(--bm-px) 18px; }

/* 头像、二维码这类直接放在表格里的图 */
.ct2_a .mn .tfm td > img, .ct2_a .mn .tfm td > a > img { border-radius: var(--r-md); }

/* 表单表格：左边一列标签，右边控件，标签跟输入框居中对齐 */
/* 表格本身限宽：个人资料这类右边还带一列「公开 / 仅好友」下拉，内容区一宽，
   下拉就被推到几百像素开外，跟它管的那个输入框对不上了 */
.ct2_a .mn table.tfm { width: 100%; max-width: 720px; }
.ct2_a .mn .tfm th { box-sizing: border-box; width: 116px; padding: 7px 16px 7px 0; vertical-align: top; font: 500 13px/38px var(--font); color: var(--text-2); }
.ct2_a .mn .tfm td { padding: 7px 0; vertical-align: top; line-height: 38px; }
.ct2_a .mn .tfm td .px, .ct2_a .mn .tfm td .ps, .ct2_a .mn .tfm td select, .ct2_a .mn .tfm td textarea.pt { max-width: 340px; }
/* 说明文字、提示：撤掉上面给控件用的 38px 行高 */
.ct2_a .mn .tfm .d, .ct2_a .mn .tfm td p, .ct2_a .mn .tfm td .tip, .ct2_a .mn .tfm td label { line-height: 1.6; }
.ct2_a .mn .tfm .d { margin-top: 2px; }
/* 表格自带的小标题（头像页、积分页用 caption 分段） */
.ct2_a .mn table caption { padding: 0 0 10px; text-align: left; }
.ct2_a .mn table caption h2 { margin: 0; font-size: 14px; font-weight: 600; color: var(--text); }
.ct2_a .mn table caption p { margin: 4px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--text-3); }
.ct2_a .mn table caption .y { float: right; font: 400 13px var(--font); }
.ct2_a .mn table + table { margin-top: 24px; }

/* 数据表格：积分记录这类普通列表 */
.ct2_a .mn table.dt { width: 100%; border-collapse: collapse; }
.ct2_a .mn .dt th { padding: 9px 12px; background: var(--hover); font: 500 12.5px var(--font); color: var(--text-3); text-align: left; white-space: nowrap; }
.ct2_a .mn .dt tr th:first-child { border-radius: var(--r-sm) 0 0 var(--r-sm); }
.ct2_a .mn .dt tr th:last-child { border-radius: 0 var(--r-sm) var(--r-sm) 0; }
.ct2_a .mn .dt td { padding: 10px 12px; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--text-2); vertical-align: top; }
.ct2_a .mn .dt tr:last-child td { border-bottom: 0; }

/* 用户组权限对照（.tdats）：Discuz 用几张浮动表拼出「左边固定标签 + 右边各组数值」，
   各表之间没有任何关联，全靠每一行高度一模一样才逐行对齐：
   - 行高：原版单元格只给了 height: 26px，行高随字体走。中文标签落到后备字体（微软雅黑）上，
     行盒比 26px 高出零点几像素，只有左边那列是纯中文，六十多行累积下来错开二十多像素。
     所以把 line-height 压到 20px，height 才真正说了算。
   - 布局：原版写死 150 + 300 + 350 的浮动宽度，「对比某个用户组」时右上角的组名条（ul.tb）
     和下面的数值表（.tscr）靠浮动一上一下叠着；新模板里 .tb 被 discuz.css 改成了 flex 页签，
     一变就散架（组名条被拉成一整列色块，数值表挤出卡片外）。这里改成网格，位置逐个钉死：
     第一行 46px 是表头高度（.c0），组名条占右上格，数值表从第二行开始，正好接上左边的第二行。 */
.ct2_a .mn .tdats { display: grid; grid-template-columns: 150px minmax(240px, 1fr) minmax(240px, 1fr); grid-template-rows: 46px auto; margin: 4px 0 16px; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.ct2_a .mn .tdats:not(:has(> .tscr)) { grid-template-columns: 150px minmax(240px, 1fr); }
/* align-self: start 不能省：表格被网格拉高时，多出来的高度会摊到每一行上 */
.ct2_a .mn .tdats > * { align-self: start; }
.ct2_a .mn .tdats > table { grid-row: 1 / 3; float: none; width: 100%; margin: 0; }
.ct2_a .mn .tdats > table:first-child { grid-column: 1; }
.ct2_a .mn .tdats > table + table { grid-column: 2; }
.ct2_a .mn .tdats > .tb { grid-column: 3; grid-row: 1; display: flex; align-items: flex-end; box-sizing: border-box; width: auto; height: 46px; margin: 0; padding: 0; border: 0; line-height: normal; }
.ct2_a .mn .tdats > .tb li { flex: 1; min-width: 0; box-sizing: border-box; height: 38px; padding: 0 12px; border: 0; border-radius: var(--r-sm) var(--r-sm) 0 0; background: var(--soft); color: var(--soft-ink); font: 600 13px/38px var(--font); text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ct2_a .mn .tdats > .tscr { grid-column: 3; grid-row: 2; float: none; width: auto; }
.ct2_a .mn .tdats .tscr .tdat { float: none; width: 100%; }
.ct2_a .mn .tdats .tscr .tdat th, .ct2_a .mn .tdats .tscr .tdat td { width: auto; }
.ct2_a .mn .tdats th, .ct2_a .mn .tdats td { padding: 0 10px; line-height: 20px; border-color: var(--surface); background: var(--surface); color: var(--text-2); font-size: 13px; }
.ct2_a .mn .tdats th { font-weight: 600; color: var(--text); }
.ct2_a .mn .tdats td img { vertical-align: middle; }
/* 分段标题行不要上下边框：中间那列（.tfx）被 Discuz 用 !important 定成了 0 3px，
   两边各多 1px 就又错行了 */
.ct2_a .mn .tdats .h th { border-top-width: 0; border-bottom-width: 0; background: var(--hover); color: var(--text-3); font-size: 12.5px; }
/* 行本身也要清底色：中间那列的 tr.alt 带着 Discuz 的米黄底，会从单元格之间的亚像素缝里漏出来 */
.ct2_a .mn .tdats tr { background: transparent; }
.ct2_a .mn .tdats tr.alt th, .ct2_a .mn .tdats tr.alt td { background: var(--hover); }
.ct2_a .mn .tdats .c0 { background: transparent; }
.ct2_a .mn .tdats .c0 h4 { margin: 0; line-height: 38px; background: var(--text); color: var(--bg); border-radius: var(--r-sm) var(--r-sm) 0 0; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 页签：四个下拉（我的 / 晋级 / 普通 / 管理组）在原版是右浮动，DOM 里却排在最前，
   discuz.css 给每个 .y 都挂了 margin-left: auto，四个一起分走空白，整排七个页签被撑散还换了行。
   这里让三个普通页签靠左，下拉整组排到后面、只有第一个把自己推到右边。
   选中某个下拉组时 Discuz 会让「我的用户组」也高亮，两条下划线指的不是一回事，撤掉后者。 */
/* 七个页签在 1280 宽的窗口里差五十来像素放不下，字号、间距都收一点 */
.ct2_a .mn > .bm > .tb:has(> #gmy) { gap: 16px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; font-size: 13px; }
.ct2_a .mn > .bm > .tb:has(> #gmy) > li { flex: none; white-space: nowrap; }
.ct2_a .mn > .bm > .tb:has(> #gmy) > .showmenu { padding-right: 14px; }
.ct2_a .mn > .bm > .tb:has(> #gmy) > .y { order: 1; margin-left: 0; }
.ct2_a .mn > .bm > .tb > #gmy { margin-left: auto; }
.ct2_a .mn > .bm > .tb:has(> .y.a) > li.a:not(.y) a { font-weight: 500; color: var(--text-3); }
.ct2_a .mn > .bm > .tb:has(> .y.a) > li.a:not(.y) a::after { display: none; }

/* 积分概览那几行 */
.ct2_a .mn .creditl { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 0 calc(-1 * var(--bm-px)) 20px; padding: 0 var(--bm-px) 18px; border-bottom: 1px solid var(--line); font-size: 13px; color: var(--text); }
.ct2_a .mn .creditl li { float: none; width: auto; margin: 0; padding: 0; line-height: 1.8; }
.ct2_a .mn .creditl em { margin-right: 4px; color: var(--text-3); }
.ct2_a .mn .creditl .xg1 { margin-left: 4px; }

/* 复制按钮这类跟在输入框后面另起一行的控件 */
.ct2_a .mn .tfm td.pns .pn { margin-top: 8px; }

/* 提交行 */
.ct2_a .mn > .bm .pnpost, .ct2_a .mn > .bm > form > .pn, .ct2_a .mn > .bm > form > input.pn { margin-top: 20px; }

/* ── 设置区新外框（home/spacecp_header + spacecp_footer，#ct.ct2_a.klp-cp）──────────────
   结构仍是 #ct > .mn > .bm 三层（没搬的原版设置页和插件页按这个层数收尾），上面那些 .ct2_a .mn 的内容规则照常生效；
   这里只管新加的东西：卡片头（标题 + 一句说明）、链接式页签、左栏（自己的头像 + 分组导航）、积分概览、窄卡片下的表单。 */
.klp-cp .klp-cp-card { container-type: inline-size; padding-bottom: 28px; }
.klp-cp-h { margin: 0 calc(-1 * var(--bm-px)); padding: 22px var(--bm-px) 16px; }
.klp-cp-h h1 { margin: 0; font-size: 20px; font-weight: 600; letter-spacing: -.01em; line-height: 1.4; color: var(--text); }
.klp-cp-h p { margin: 6px 0 0; font-size: 13px; line-height: 1.6; color: var(--text-3); }
/* 没有页签的页面（头像、密码安全、插件页）在卡片头下补一条分隔线，内容跟它拉开 */
.klp-cp-card > .klp-cp-h:not(:has(~ .klp-cp-tabs, ~ .tb)) { margin-bottom: 22px; border-bottom: 1px solid var(--line); }
.klp-cp-card > .klp-cp-tabs { margin: 0 calc(-1 * var(--bm-px)) 22px; padding: 0 var(--bm-px); flex-wrap: wrap; column-gap: 22px; }
.klp-cp-tabs-end { margin-left: auto; display: flex; align-items: center; }
.klp-cp-tabs-end select { max-width: 220px; }
/* 说明条（原版的 .tbmu / .bbda 说明段） */
.klp-cp .klp-cp-card .klp-cp-intro { margin: 0 0 20px; padding: 12px 14px; border: 0; border-radius: var(--r-md); background: var(--hover); font-size: 13px; line-height: 1.7; color: var(--text-2); }
.klp-cp .klp-cp-card .klp-cp-intro.is-warn { background: var(--warn-soft); color: var(--warn); }
.klp-cp .klp-cp-intro p { margin: 0; }
.klp-cp .klp-cp-intro p + p { margin-top: 4px; }
.klp-cp-seg { margin: 0 0 16px; }
.klp-cp-foot { margin: 16px 0 0; }
.klp-cp-scroll { overflow-x: auto; scrollbar-width: thin; }
.klp-cp .tfm .klp-cp-hl > * { background: var(--soft); }
/* 表单：标签不许折行（原版表格自动布局，右边下拉一宽，标签列就被挤成一字一行）；按钮跟输入框对齐 */
.klp-cp .tfm th { white-space: nowrap; }
.klp-cp .tfm td .k-btn { vertical-align: middle; }
.klp-cp .tfm td.pns .k-btn { margin-left: 8px; }
/* 卡片窄了（侧栏展开、小窗口）：标签放到控件上面，一项一行 */
@container (max-width: 560px) {
	.klp-cp .klp-cp-card table.tfm, .klp-cp .klp-cp-card table.tfm > tbody, .klp-cp .klp-cp-card table.tfm > tbody > tr { display: block; width: auto; max-width: none; }
	.klp-cp .klp-cp-card table.tfm > tbody > tr > th, .klp-cp .klp-cp-card table.tfm > tbody > tr > td { display: block; width: auto; padding: 0; line-height: 1.6; }
	.klp-cp .klp-cp-card table.tfm > tbody > tr { padding: 8px 0; }
	.klp-cp .klp-cp-card table.tfm > tbody > tr > th { padding-bottom: 6px; white-space: normal; }
	.klp-cp .klp-cp-card table.tfm > tbody > tr > td.p { margin-top: 6px; text-align: left; }
	.klp-cp .klp-cp-card table.tfm td .px, .klp-cp .klp-cp-card table.tfm td .ps, .klp-cp .klp-cp-card table.tfm td select, .klp-cp .klp-cp-card table.tfm td textarea { max-width: 100%; box-sizing: border-box; }
}
/* 积分概览：原版是一行行「名称: 数值」，换成一格一项 */
.klp-cp .creditl.klp-cp-credits { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; margin: 0 0 24px; padding: 0; border: 0; }
.klp-cp .klp-cp-credits li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 4px; height: auto; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-md); font: 600 18px/1.4 var(--mono); color: var(--text); }
.klp-cp .klp-cp-credits li em { flex-basis: 100%; margin: 0 0 2px; font: 400 12px/1.5 var(--font); color: var(--text-3); }
.klp-cp .klp-cp-credits li em img { width: 14px; height: 14px; vertical-align: -2px; }
.klp-cp .klp-cp-credits li a, .klp-cp .klp-cp-credits li .xg1 { flex-basis: 100%; margin: 2px 0 0; font: 400 12px/1.5 var(--font); color: var(--text-3); }
.klp-cp .klp-cp-credits li.xi1 { border-color: transparent; background: var(--soft); }
.klp-cp .klp-cp-credits li.xi1 em { color: var(--soft-ink); }
.klp-cp .klp-cp-log caption h2 { display: flex; align-items: center; justify-content: space-between; }
.klp-cp .klp-cp-log caption .k-more-link { font-size: 12.5px; font-weight: 400; }
/* 本模板自己排的表单（积分转账）：一项一行，左标签右控件，卡片窄了标签放上面 */
.klp-cp-form { display: flex; flex-direction: column; gap: 14px; max-width: 640px; }
.klp-cp-row { display: grid; grid-template-columns: 116px minmax(0, 1fr); align-items: start; gap: 6px 16px; }
.klp-cp-k { padding-top: 9px; font-size: 13px; font-weight: 500; color: var(--text-2); }
.klp-cp-k .rq { margin-right: 2px; }
.klp-cp-v { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.klp-cp-v > .px { width: 100%; max-width: 340px; box-sizing: border-box; }
.klp-cp-inline { display: flex; align-items: center; gap: 8px; }
.klp-cp-inline .px { width: auto; }
.klp-cp .klp-cp-num { width: 120px; font-family: var(--mono); }
.klp-cp-d { margin: 0; font-size: 12.5px; line-height: 1.6; color: var(--text-3); }
@container (max-width: 560px) {
	.klp-cp-row { grid-template-columns: minmax(0, 1fr); }
	.klp-cp-k { padding-top: 0; }
	.klp-cp-k:empty { display: none; }
}
/* 积分记录的筛选条：一排「小标签 + 控件」，放不下就折行 */
.klp-cp-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 14px; margin: 0 0 18px; padding: 14px 16px; border-radius: var(--r-md); background: var(--hover); }
.klp-cp-fi { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.klp-cp-fi > span { font-size: 12px; color: var(--text-3); }
.klp-cp-filter select.ps { min-width: 120px; max-width: 180px; height: 34px; }
.klp-cp-filter .px { width: 116px; height: 34px; box-sizing: border-box; }
.klp-cp-filter .k-btn { height: 34px; }
/* 积分规则：加分 / 扣分 / 0 三种颜色；动作名不折行 */
.klp-cp-rules td:first-child { white-space: nowrap; color: var(--text); }
.klp-cp-rules td:nth-child(2), .klp-cp-rules td:nth-child(3) { white-space: nowrap; }
/* 积分记录的「变更时间」：日期和时分别拆成两行 */
.klp-cp-card table.dt:not(.klp-cp-rules) td:last-child { white-space: nowrap; }
.klp-cr-up { font-weight: 600; color: var(--ok); }
.klp-cr-down { font-weight: 600; color: var(--danger); }
.klp-cr-zero { color: var(--text-3); opacity: .6; }
/* 左栏：自己的头像 + 分组导航（替换原版 .appl 里的 .tbn 列表） */
/* 设置项十几个，比一屏高，不吸顶（吸顶的话下半截要等整页滚到底才看得到） */
.klp-cp > .appl { position: static; width: 224px; padding: 10px; }
.klp-cp-me { display: flex; align-items: center; gap: 10px; padding: 4px 6px 12px; margin-bottom: 4px; border-bottom: 1px solid var(--line); }
.klp-cp-me .k-av img { width: 100%; height: 100%; }
.klp-cp-me-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.klp-cp-me-t b { font-size: 14px; font-weight: 600; color: var(--text); }
.klp-cp .appl .klp-cp-me-t span, .klp-cp .appl .klp-cp-lbl { margin-left: 0; }
.klp-cp-nav { display: flex; flex-direction: column; gap: 2px; }
.klp-cp .appl .klp-cp-lbl { padding: 12px 10px 4px; font-size: 12px; font-weight: 500; color: var(--text-3); }
.klp-cp-nav a { display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 10px; border-radius: var(--r-sm); font-size: 14px; font-weight: 500; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.klp-cp-nav a .k-ic { flex: none; color: var(--text-3); }
.klp-cp-nav a:hover { background: var(--hover); color: var(--text); }
.klp-cp-nav a.on { background: var(--hover); color: var(--text); font-weight: 600; }
.klp-cp-nav a.on .k-ic { color: var(--ink); }
/* 用户组页签（ul.tb，右边四项是 showMenu 下拉，结构不能换）：新外框下内容区窄一些，七项一行放不下，允许折到第二行；
   下拉项的小箭头（li::after）跟文字一行，原版 li 是 list-item、里面的 a 是块级，箭头被挤到下一行。选择器带 #gmy 是为了压过上面同样带它的那条 nowrap */
.klp-cp .mn > .bm > .tb.klp-cp-tb:has(> #gmy) { flex-wrap: wrap; overflow: visible; column-gap: 18px; }
.klp-cp .klp-cp-tb > li { display: flex; align-items: center; }
.klp-cp .klp-cp-tb > li > a { display: inline-flex; align-items: center; }
/* 窗口不够宽（左边站点侧栏还占着 248px）：设置导航挪到卡片上面，排成一行可折的胶囊，头像和分组小标题收起；
   不然内容卡片只剩三百来像素，表单挤成一条 */
@media (max-width: 1080px) {
	.klp-cp { flex-direction: column; align-items: stretch; gap: 16px; }
	.klp-cp > .appl { order: -1; width: auto; padding: 8px; }
	.klp-cp-me, .klp-cp .appl .klp-cp-lbl { display: none; }
	.klp-cp-nav { flex-direction: row; flex-wrap: wrap; gap: 4px; }
	.klp-cp-nav a { height: 32px; padding: 0 10px; font-size: 13px; }
}

/* 个人空间顶部资料卡（home/space_menu，所有空间页面共用；对照设计稿 Space.dc.html）
   封面横幅 → 88px 头像压在横幅下沿 → 名字 / 用户组 / UID · 最后访问 → 签名 + 五个数据 → 分页 */
.klp-uhead { padding: 0; margin-bottom: 20px; overflow: hidden; }
.klp-uhead-cover { height: 180px; background: repeating-linear-gradient(135deg, var(--hover) 0 10px, var(--bg) 10px 20px); border-bottom: 1px solid var(--line); }
.klp-uhead-main { position: relative; display: flex; align-items: flex-start; gap: 16px; padding: 16px 28px 0 144px; }
.klp-uhead-av { position: absolute; left: 28px; top: -44px; width: 88px; height: 88px; overflow: hidden; box-shadow: 0 0 0 4px var(--surface); }
.klp-uhead-av img { width: 88px; height: 88px; border-radius: 50%; }
/* 头像挂件四周各探出 33px：卡片 overflow: hidden，左边要多留出来，名字也跟着往右让开 */
.klp-uhead-main:has(> .klp-uhead-av > .k-av-frame) { padding-left: 176px; }
.klp-uhead-main > .klp-uhead-av:has(> .k-av-frame) { left: 40px; }
.klp-uhead-id { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.klp-uhead-namerow { display: flex; align-items: center; gap: 8px; min-width: 0; }
.klp-uhead-name { margin: 0; font-size: 22px; font-weight: 600; line-height: 1.3; }
.klp-uhead-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; font-size: 13px; color: var(--text-3); }
.klp-uhead-meta a { color: var(--text-3); }
.klp-uhead-seen { display: inline-flex; align-items: center; gap: 6px; }
.klp-seen-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text-3); }
.klp-seen-dot.on { background: #2EB872; }
.klp-uhead-act { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.klp-icbtn-sq { width: 36px; padding: 0; }
.k-chip-info { background: var(--info-soft); color: var(--info); border-color: transparent; }
.klp-uhead-sub { display: flex; align-items: center; gap: 24px; padding: 20px 28px 18px; }
.klp-uhead-sign { flex: 1; min-width: 0; margin: 0; display: flex; align-items: center; gap: 8px; color: var(--text-2); }
.klp-uhead-sign .k-ic { color: var(--text-3); flex: none; }
.klp-uhead-stats { display: flex; margin-right: -22px; }
.klp-uhead-stats > a, .klp-uhead-stats > span { display: flex; flex-direction: column; gap: 2px; min-width: 92px; padding: 0 22px; border-left: 1px solid var(--line); color: var(--text-3); font-size: 12px; }
.klp-uhead-stats b { font-size: 20px; font-weight: 500; line-height: 1.3; color: var(--text); white-space: nowrap; }
.klp-uhead-stats > a:hover b { color: var(--ink); }
.klp-utabs { display: flex; gap: 24px; margin: 0; padding: 0 28px; border-top: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.klp-utabs a { position: relative; height: 46px; display: inline-flex; align-items: center; gap: 6px; color: var(--text-3); font-weight: 500; white-space: nowrap; }
.klp-utabs a .k-mono { font-size: 12px; font-weight: 400; color: var(--text-3); }
.klp-utabs a:hover { color: var(--text); }
.klp-utabs a.on { color: var(--text); }
.klp-utabs a.on::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; border-radius: 2px; background: var(--text); }

/* 个人空间右栏：勋章墙 / 个人资料 */
.klp-medalwall .klp-medals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 8px; }
.klp-medalwall .klp-medal { display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; font-size: 11.5px; color: var(--text-3); }
.klp-medal-ic { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--hover); transition: transform .15s ease; }
.klp-medal-ic img { width: 34px; height: 34px; object-fit: contain; }
.klp-medal:hover .klp-medal-ic { transform: translateY(-2px); }
.klp-medal.is-new .klp-medal-ic { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--brand); }
.klp-medal span.k-ellip { max-width: 100%; }
.klp-medal-note { display: flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 12px; }
.klp-medal-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand); }
.klp-kvlist { margin: 0; }
.klp-kvlist > div { display: flex; justify-content: space-between; align-items: center; height: 36px; border-top: 1px solid var(--line); font-size: 13.5px; }
.klp-kvlist > div:first-child { border-top: 0; }
.klp-kvlist dt { color: var(--text-3); }
.klp-kvlist dd { margin: 0; color: var(--text); font-family: var(--mono); font-size: 13px; }

/* 发布的主题：卡片，左边标签 / 标题 / 数据，右边首图 */
.klp-space .klp-plist-card { padding: 0; background: none; border: 0; box-shadow: none; overflow: visible; }
.klp-space .klp-plist-bar { padding: 0 0 4px; border: 0; }
.klp-plist-h { margin: 0 6px 0 0; font-size: 15px; font-weight: 600; }
.klp-space .klp-plist-filter { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); margin-bottom: 4px; }
.klp-tplist { gap: 12px; }
.klp-tp { display: flex; align-items: center; gap: 20px; padding: 16px 20px; border-top: 1px solid var(--line); transition: border-color .15s ease; }
.klp-tp:hover { border-color: color-mix(in srgb, var(--text) 16%, var(--line)); }
.klp-tp-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.klp-tp-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 12.5px; }
.klp-tp-chips .k-chip-sm { height: 22px; }
.klp-tp-date { margin-left: auto; font-size: 12.5px; color: var(--text-3); }
.klp-tp-title { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.5; }
.klp-tp-title a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.klp-tp-title a:hover { color: var(--ink); }
.klp-tp-title a.recy { color: var(--text-3); text-decoration: line-through; }
.klp-tp-stats { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 18px; font-size: 13px; color: var(--text-3); min-width: 0; }
.klp-tp-stats a { color: var(--text-3); }
.klp-tp-stats a:hover { color: var(--text); }
.klp-tp-cover { flex: none; width: 136px; height: 88px; border-radius: 12px; overflow: hidden; background: var(--hover); }
.klp-tp-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.klp-tplist .k-empty { padding: 48px 20px; text-align: center; color: var(--text-3); border: 1px dashed var(--line); border-radius: 16px; }

/* 个人资料页 */
.klp-profile { display: flex; flex-direction: column; gap: 16px; }
.klp-kv { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 2px 24px; }
.klp-kv li { display: flex; gap: 12px; align-items: baseline; padding: 9px 0; border-bottom: 1px dashed var(--line); min-width: 0; font-size: 14px; color: var(--text); word-break: break-all; }
.klp-kv li em { flex: none; width: 96px; font-style: normal; color: var(--text-3); font-size: 13px; }
.klp-kv li img { max-height: 18px; vertical-align: -3px; }
.klp-ok { color: var(--ok); }
.klp-sig { font-size: 14px; line-height: 1.7; color: var(--text-2); overflow-wrap: anywhere; }
.klp-sig table:not(.k-fence) { width: auto; }
.klp-sig img { max-width: 100%; height: auto; }
.klp-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.klp-chips .k-chip img { max-height: 16px; vertical-align: -3px; margin-right: 4px; }
.klp-profile-groups { margin-bottom: 8px; }
/* 活跃概况：时间做成小卡片网格，IP 单独一块（带归属地标签），时区放页脚 */
.klp-active .klp-profile-groups { margin: 4px 0 14px; }
.klp-profile-groups .k-chip svg { flex: none; }
.klp-actgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.klp-acttile { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 12px 14px; border-radius: 12px; background: var(--hover); }
.klp-acttile > span { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-3); }
.klp-acttile > span svg { flex: none; }
.klp-acttile b { font-size: 14.5px; font-weight: 500; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.klp-acttile b small { margin-left: 4px; font-family: var(--font); font-size: 12px; color: var(--text-3); }
.klp-acttile-hl { background: var(--soft); }
.klp-acttile-hl > span { color: var(--soft-ink); }
.klp-acttile-hl b { font-size: 20px; line-height: 1.1; }
.klp-iplog { margin-top: 14px; padding: 4px 14px; border: 1px solid var(--line); border-radius: 12px; }
.klp-iplog-h { display: flex; align-items: center; gap: 6px; height: 38px; font-size: 13px; font-weight: 500; color: var(--text-2); }
.klp-iplog-h .k-meta { margin-left: auto; font-weight: 400; font-size: 12px; }
.klp-iprow { display: flex; align-items: center; gap: 12px; min-height: 40px; border-top: 1px dashed var(--line); font-size: 13.5px; color: var(--text); min-width: 0; }
.klp-iprow em { flex: none; width: 96px; font-style: normal; font-size: 13px; color: var(--text-3); }
.klp-iprow .k-mono { overflow-wrap: anywhere; }
.klp-act-foot { display: flex; align-items: center; gap: 6px; margin: 12px 0 0; font-size: 12.5px; }
.klp-statgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.klp-statgrid > div, .klp-statgrid > a { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 12px; background: var(--hover); }
.klp-statgrid b { font-size: 18px; font-weight: 500; color: var(--text); }
.klp-statgrid span { font-size: 12.5px; color: var(--text-3); }
.klp-profile-links { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 14px; font-size: 13px; color: var(--text-3); }
.klp-profile-links a { color: var(--text-3); }
.klp-profile-links a:hover { color: var(--text); }
.klp-profile-links b { color: var(--text); font-weight: 500; }
.klp-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.klp-table th { text-align: left; font-weight: 500; font-size: 12.5px; color: var(--text-3); padding: 8px 10px; border-bottom: 1px solid var(--line); }
.klp-table td { padding: 10px; border-bottom: 1px solid var(--line); vertical-align: top; }
.klp-table tr:last-child td { border-bottom: 0; }
.klp-medals { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 8px; }
.klp-medal { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 11.5px; color: var(--text-3); min-width: 0; }
.klp-medal img { width: 40px; height: 40px; object-fit: contain; }
.klp-medal:hover { color: var(--text); }
.klp-medal span { max-width: 100%; }

/* 空间与消息的内容块 */
.ct2_a .mn .bm, .ct1 .mn .bm { border-radius: var(--r-lg); }
.ct2_a .mn .bm.bw0 { border: 1px solid var(--line); background: var(--surface); --bm-px: 20px; padding: 4px var(--bm-px); }
#notice_body, #pm_body, .xld { padding: 0; }
.xld dl, .nts li, #notice_body .cl { border-bottom: 1px solid var(--line); }
.nts { list-style: none; margin: 0; padding: 0; }
.nts li { display: flex; gap: 12px; padding: 14px 0; align-items: flex-start; }
.nts li:last-child { border-bottom: 0; }
.nts .avt img { width: 36px; height: 36px; border-radius: 50%; }
.nts .ntc_body { flex: 1; min-width: 0; }
.nts .ntc_body .xg1, .nts .xg1 { font-size: 12px; color: var(--text-3); }
.nts .quote, .nts blockquote { margin-top: 6px; background: var(--hover); border-radius: 10px; padding: 8px 12px; font-size: 13px; color: var(--text-2); }
.nts .unread, .nts li.new { position: relative; }
.nts li.new::before { content: ""; position: absolute; left: -12px; top: 22px; width: 7px; height: 7px; border-radius: 50%; background: var(--brand); }
/* 未读提醒：Discuz 在 .ntc_body 上内联 color:#000;font-weight:bold，夜间就成了黑字。
   内联样式只能用 !important 压，颜色换成正文色，加粗保留当未读标记 */
.nts .ntc_body[style*="bold"] { color: var(--text) !important; }
/* 系统提醒没有发送人，用喇叭图标占头像位（原版是 systempm.png）；「屏蔽」是右上角的图标按钮（原版 op.png 背景） */
.nts .klp-ntc-sys { background: var(--soft); color: var(--soft-ink); }
.nts .klp-ntc-ign { float: right; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: var(--r-sm); color: var(--text-3); opacity: 0; transition: opacity var(--dur-1) var(--ease-io), background-color var(--dur-1) var(--ease-io), color var(--dur-1) var(--ease-io); }
.nts dl:hover .klp-ntc-ign, .nts .klp-ntc-ign:focus-visible { opacity: 1; }
.nts .klp-ntc-ign:hover { background: var(--danger-soft); color: var(--danger); }
.ct2_a .mn .bm.bw0 > .pgs { margin: 16px 0 12px; }

/* 私信会话 */
.pm_list, #pmlist { display: flex; flex-direction: column; }
.pm_list li, #pmlist li { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.pmform .tedt, #pmform .tedt { border-radius: 12px; }
.pm .pmsg, .pm_c { background: var(--hover); border-radius: 12px; padding: 10px 14px; }

/* 消息 / 提醒页左栏：分类图标沿用顶栏铃铛菜单的 .klp-ntc-ic。
   .appl span 的 margin-left: auto 是给计数靠右用的，图标得撤掉 */
.appl .klp-ntc-ic { margin-left: 0; font-size: inherit; width: 24px; height: 24px; }
.appl .klp-ntc-nav a { gap: 10px; }
.appl .klp-ntc-nav .k-cnt { margin-left: auto; }

/* 私信会话列表。整行可点靠行里铺满的 .klp-pm-link（交给无刷新切页），
   不用 Discuz 的 addBlockLink——它 location.href 整页跳，进会话没有过渡。
   「标记已读」的 markreadpm() 会把行的 className 整个改成 'bbda cl'，所以行样式挂在 .klp-pm-list > div 上 */
.klp-pm-list { display: flex; flex-direction: column; margin: 8px -12px; }
.klp-pm-list > div { position: relative; display: flex; align-items: center; gap: 12px; padding: 12px; border: 0; border-radius: var(--r-md); transition: background var(--dur-1) var(--ease); animation: klpIn var(--dur-2) var(--ease) both; }
.klp-pm-list > div:hover { background: var(--hover); }
.klp-pm-list > div + div::before { content: ""; position: absolute; left: 76px; right: 12px; top: 0; height: 1px; background: var(--line); }
.klp-pm-list > div:hover::before, .klp-pm-list > div:hover + div::before { opacity: 0; }
/* 进页时逐行错开一点浮上来，前 8 行之后不再加延迟，长列表不至于等半天 */
.klp-pm-list > div:nth-child(2) { animation-delay: 30ms; } .klp-pm-list > div:nth-child(3) { animation-delay: 60ms; }
.klp-pm-list > div:nth-child(4) { animation-delay: 90ms; } .klp-pm-list > div:nth-child(5) { animation-delay: 120ms; }
.klp-pm-list > div:nth-child(6) { animation-delay: 150ms; } .klp-pm-list > div:nth-child(7) { animation-delay: 180ms; }
.klp-pm-list > div:nth-child(n+8) { animation-delay: 210ms; }
.klp-pm-link { position: absolute; inset: 0; border-radius: inherit; z-index: 0; }
.klp-pm-link:focus-visible { box-shadow: var(--ring); outline: none; }
.klp-pm-ck, .klp-pm-av, .klp-pm-name, .klp-pm-ops { position: relative; z-index: 1; }
.klp-pm-ck { display: grid; place-items: center; width: 18px; flex: none; }
.klp-pm-ck input { margin: 0; }
.klp-pm-av { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; flex: none; display: grid; place-items: center; background: var(--hover); }
.klp-pm-av img { width: 100%; height: 100%; object-fit: cover; display: block; border: 0; padding: 0; border-radius: 0; }
.klp-pm-sys { background: var(--soft); color: var(--soft-ink); }
.klp-pm-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.klp-pm-hd { display: flex; align-items: center; gap: 8px; min-width: 0; }
.klp-pm-name { font-size: 14.5px; font-weight: 600; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.klp-pm-name:hover { color: var(--ink); }
.klp-pm-time { margin-left: auto; flex: none; }
.klp-pm-sum { font-size: 13.5px; color: var(--text-2); }
.klp-pm-sum img { max-height: 18px; vertical-align: -3px; }
.klp-pm-me { color: var(--text-3); }
.klp-pm-list > .is-new .klp-pm-sum { color: var(--text); font-weight: 500; }
/* 未读：头像右上角一个品牌色圆点 */
.klp-pm-list > .is-new .klp-pm-av::after { content: ""; position: absolute; right: 1px; top: 1px; width: 10px; height: 10px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 2px var(--surface); }
.klp-pm-list > .is-new .klp-pm-av { overflow: visible; }
.klp-pm-list > .is-new .klp-pm-av img { border-radius: 50%; }
.klp-pm-ops { display: flex; align-items: center; gap: 4px; flex: none; }
.klp-pm-num { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--hover); color: var(--text-3); font-size: 12px; display: grid; place-items: center; box-sizing: border-box; }
.klp-pm-list > div:hover .klp-pm-num { background: var(--surface); }
.klp-pm-ops .k-icbtn { opacity: 0; transition: opacity var(--dur-1) var(--ease); }
.klp-pm-list > div:hover .klp-pm-ops .k-icbtn, .klp-pm-ops .k-icbtn[aria-expanded="true"], .klp-pm-ops .k-icbtn:focus-visible { opacity: 1; }
.klp-pm-ops .k-menu, .klp-msg-ops .k-menu { right: 0; top: 40px; min-width: 160px; }
.k-mi.klp-mi-dan { color: var(--danger); }
.k-mi.klp-mi-dan:hover { background: var(--danger-soft); color: var(--danger); }
.klp-pm-bar { display: flex; align-items: center; gap: 8px; padding: 12px 0 16px; border-top: 1px solid var(--line); }
.klp-pm-all { display: inline-flex; align-items: center; gap: 6px; margin-right: 4px; font-size: 13px; color: var(--text-2); cursor: pointer; }
.klp-pm-all input { margin: 0; }
.klp-pm-pg { margin-left: auto; padding: 0; }

/* 私信对话：气泡，自己发的靠右 */
.klp-msg-list { display: flex; flex-direction: column; gap: 14px; padding: 16px 0; }
.klp-msg { display: flex; align-items: flex-start; gap: 10px; animation: klpIn var(--dur-2) var(--ease) both; }
.klp-msg.is-me { flex-direction: row-reverse; }
.klp-msg-av { width: 36px; height: 36px; border-radius: 50%; overflow: hidden; flex: none; display: grid; place-items: center; background: var(--soft); color: var(--soft-ink); }
.klp-msg-av img { width: 36px; height: 36px; object-fit: cover; display: block; border: 0; padding: 0; }
.klp-msg-main { display: flex; flex-direction: column; gap: 4px; max-width: min(72%, 620px); min-width: 0; }
.klp-msg.is-me .klp-msg-main { align-items: flex-end; }
.klp-msg-hd { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.klp-msg-hd a { color: var(--text-2); font-weight: 500; }
.klp-msg-bubble { padding: 9px 14px; border-radius: 4px 14px 14px 14px; background: var(--hover); color: var(--text); font-size: 14px; line-height: 1.65; overflow-wrap: anywhere; }
.klp-msg.is-me .klp-msg-bubble { border-radius: 14px 4px 14px 14px; background: var(--soft); }
.klp-msg-bubble img { max-width: 100%; height: auto; }
.klp-msg-ops { position: relative; align-self: center; }
.klp-msg-ops .k-icbtn { width: 28px; height: 28px; opacity: 0; transition: opacity var(--dur-1) var(--ease); }
.klp-msg:hover .klp-msg-ops .k-icbtn, .klp-msg-ops .k-icbtn[aria-expanded="true"] { opacity: 1; }
#pm_ul_post { border-top: 1px solid var(--line); padding-top: 12px; }
#pm_ul_post dl { display: flex; gap: 10px; border: 0; padding: 0; margin: 0; }
#pm_ul_post .avt img { width: 36px; height: 36px; border-radius: 50%; }
#pm_ul_post dd.ptm { flex: 1; min-width: 0; padding-top: 0; }

/* 搜索结果 */
.slst { list-style: none; margin: 0; padding: 0; }
.slst li, .slst .xld { padding: 16px 20px; border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--surface); margin-bottom: 12px; }
.slst h3, .slst .xs2 { font-size: 16px; font-weight: 600; margin: 0 0 6px; line-height: 1.5; }
.slst p { margin: 0 0 6px; color: var(--text-2); font-size: 13.5px; }
.slst .xg1 { font-size: 12px; color: var(--text-3); }
.slst em, .xst em, strong.xi1 em { font-style: normal; font-weight: 600; color: var(--text); background: none; border-bottom: 1px solid var(--brand); }
#searchform .bm, .sch .bm { border-radius: var(--r-lg); }
#scform_srchtxt, .sch .px { height: 42px; border-radius: 11px; }

/* 群组、勋章等其他原生页面的通用卡片间距 */
.ct1 .mn > .bm, .ct2 .mn > .bm, .ct3 .mn > .bm { margin-bottom: 16px; }
.ml.mls li { padding: 6px 0; }
.md_ctrl img, .md_can img { max-height: 40px; }

/* 个人空间的主题 / 回复 / 点评列表（home/space_thread） */
.klp-spacelist { display: flex; flex-direction: column; gap: 16px; }
.klp-plist-card { padding: 0; overflow: hidden; }
.klp-plist-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.klp-plist-bar .k-seg { height: 30px; padding: 0 14px; font-size: 13.5px; }
.klp-plist-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 12px 20px; border-bottom: 1px solid var(--line); background: var(--bg); }
.klp-plist-filter .ps, .klp-plist-filter .px { height: 32px; }
.klp-chips .k-chip.on { background: var(--text); color: var(--bg); border-color: transparent; }
.klp-plist { display: flex; flex-direction: column; }
.klp-prow { display: flex; align-items: center; gap: 20px; padding: 16px 20px; border-top: 1px solid var(--line); }
.klp-prow:first-child { border-top: 0; }
.klp-prow:hover { background: var(--hover); }
.klp-prow-chk { flex: none; }
.klp-prow-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.klp-prow-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; font-size: 12.5px; }
.klp-prow-author { font-weight: 600; font-size: 13px; }
.klp-prow-title { margin: 0; font-size: 15.5px; font-weight: 600; line-height: 1.5; display: flex; align-items: center; gap: 6px; min-width: 0; }
.klp-prow-title a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.klp-prow-title a:hover { color: var(--ink); }
.klp-prow-title a.recy { color: var(--text-3); text-decoration: line-through; }
.klp-prow-att { color: var(--text-3); }
.klp-prow-pages a { display: inline-block; min-width: 20px; padding: 0 5px; margin-right: 2px; border-radius: 5px; text-align: center; font: 12px var(--mono); color: var(--text-3); }
.klp-prow-pages a:hover { background: var(--line); color: var(--text); }
.klp-prow-quote { display: block; padding: 8px 12px; border-radius: 10px; background: var(--bg); border: 1px solid var(--line); color: var(--text-2); font-size: 13px; line-height: 1.6; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.klp-prow-quote:hover { color: var(--text); }
.klp-prow-stats { flex: none; display: flex; gap: 14px; color: var(--text-3); font-size: 13px; }
.klp-prow-stats > a, .klp-prow-stats > span { display: inline-flex; align-items: center; gap: 5px; color: var(--text-3); min-width: 56px; }
.klp-prow-stats > a:hover { color: var(--text); }
.klp-prow-last { flex: none; width: 150px; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; font-size: 13px; text-align: right; }
.klp-prow-last a:first-child { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.klp-prow-last .k-meta { font-size: 12px; }
.klp-plist .k-empty { padding: 48px 20px; text-align: center; color: var(--text-3); }
.klp-plist-foot { display: flex; align-items: center; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--line); font-size: 13px; }
.klp-plist-note { padding: 0 20px 14px; margin: 0; }

/* 勋章中心 / 我的勋章（home/space_medal.htm） */
.klp-medalpage .mn { overflow: visible; display: flex; flex-direction: column; gap: 16px; }
.klp-mdl-card { padding: 20px 22px; }
.klp-mdl-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }
.klp-mdl-title { min-width: 0; flex: 1; }
.klp-mdl-title h1 { margin: 0 0 6px; font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
.klp-mdl-title p { margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 4px; font-size: 13px; color: var(--text-3); }
.klp-mdl-title p b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
.klp-mdl-sep { width: 1px; height: 12px; margin: 0 8px; background: var(--line); }
.klp-mdl-bar { max-width: 320px; height: 6px; margin-top: 12px; border-radius: 99px; background: var(--hover); overflow: hidden; }
.klp-mdl-bar i { display: block; height: 100%; border-radius: inherit; background: var(--brand); }
.klp-mdl-head .k-seg em { font-style: normal; font-size: 11.5px; color: var(--text-3); font-variant-numeric: tabular-nums; }

.klp-mdl-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 12px; }
.klp-mdl { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 8px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); text-align: center; outline: 0; z-index: 1; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, z-index .15s linear; }
.klp-mdl:hover, .klp-mdl:focus-visible { border-color: color-mix(in srgb, var(--brand) 55%, var(--line)); box-shadow: 0 6px 18px rgba(17,20,19,.06); transform: translateY(-2px); z-index: 20; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, z-index 0s; }
/* 层级：悬停立刻升到 20；离开后 0.15s 内从 20 线性降回 1——马上低于新悬停的卡片，又在提示淡出期间高于其余卡片 */
.klp-mdl-ic { position: relative; width: 64px; height: 64px; border-radius: 16px; display: grid; place-items: center; background: var(--hover); }
.klp-mdl-ic img { max-width: 44px; max-height: 44px; width: auto; height: auto; }
.klp-mdl.is-own .klp-mdl-ic { background: var(--soft); }
.klp-mdl.is-none .klp-mdl-ic img, .klp-mdl.is-get .klp-mdl-ic img { filter: grayscale(.85); opacity: .55; transition: filter .15s ease, opacity .15s ease; }
.klp-mdl:hover .klp-mdl-ic img, .klp-mdl:focus-visible .klp-mdl-ic img { filter: none; opacity: 1; }
.klp-mdl-ok { position: absolute; right: -4px; bottom: -4px; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; background: var(--brand); color: #fff; box-shadow: 0 0 0 2px var(--surface); }
.klp-mdl-name { margin: 0; max-width: 100%; font-size: 13px; font-weight: 600; line-height: 1.4; color: var(--text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.klp-mdl-st { min-height: 24px; display: flex; align-items: center; justify-content: center; }
.klp-mdl-muted { font-size: 12px; color: var(--text-3); }
.k-btn-xs { height: 24px; padding: 0 9px; border-radius: 7px; font-size: 12px; gap: 4px; }

/* 悬停提示：纯 CSS，不再依赖 Discuz 的 showMenu */
.klp-mdl-tip { position: absolute; left: 50%; top: calc(100% + 8px); width: 240px; padding: 12px 14px; border-radius: 12px; background: var(--text); color: var(--bg); text-align: left; font-size: 12.5px; line-height: 1.6; box-shadow: var(--shadow-pop); opacity: 0; visibility: hidden; transform: translate(-50%, -4px); transition: opacity .12s ease, transform .12s ease, visibility 0s linear .12s; pointer-events: none; z-index: 20; }
.klp-mdl-tip::before { content: ""; position: absolute; left: 50%; top: -5px; width: 10px; height: 10px; margin-left: -5px; background: inherit; transform: rotate(45deg); border-radius: 2px; }
.klp-mdl:hover .klp-mdl-tip, .klp-mdl:focus-visible .klp-mdl-tip { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
.klp-mdl-tip b { display: block; font-size: 13.5px; font-weight: 600; margin-bottom: 2px; }
.klp-mdl-tip p { margin: 0; opacity: .82; overflow-wrap: anywhere; }
.klp-mdl-tip-f { margin-top: 8px; padding-top: 8px; border-top: 1px solid color-mix(in srgb, var(--bg) 18%, transparent); font-size: 12px; opacity: .72; }
.klp-mdl-tip-f strong { font-weight: 600; }
.klp-mdl-tip-f a { color: inherit; text-decoration: underline; }
/* 浅色下是「正文色底 + 底色字」的反色气泡；夜间这两个变量对调，照搬就成了白气泡，
 * 夜间改成比卡片略亮的浮层，描边由 --shadow-pop 自带的那圈 1px 线画 */
html[data-theme="dark"] .klp-mdl-tip { background: var(--hover); color: var(--text); }
html[data-theme="dark"] .klp-mdl-tip-f { border-top-color: var(--line); }

.klp-mdl-grid[data-f="own"] > .klp-mdl:not([data-st="own"]),
.klp-mdl-grid[data-f="get"] > .klp-mdl:not([data-st="get"]),
.klp-mdl-grid[data-f="none"] > .klp-mdl:not([data-st="none"]) { display: none; }
.klp-mdl-empty[hidden] { display: none; }

.klp-mdl-sub { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.klp-mdl-sub h2 { margin: 0; font-size: 15px; font-weight: 600; }
.klp-mdl-sub span { font-size: 12.5px; color: var(--text-3); }
.klp-mdl-log { list-style: none; margin: 0; padding: 0; }
.klp-mdl-log li { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; color: var(--text-2); }
.klp-mdl-log li:last-child { border-bottom: 0; }
.klp-mdl-log-t { flex: 1; min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.klp-mdl-log-t b { color: var(--text); font-weight: 600; }
.klp-mdl-user { color: var(--text); font-weight: 600; }
.klp-mdl-user:hover { color: var(--ink); }
.klp-mdl-mini { width: 20px; height: 20px; object-fit: contain; }
.klp-mdl-logic { width: 32px; height: 32px; flex: none; border-radius: 9px; display: grid; place-items: center; background: var(--hover); color: var(--text-3); }
.klp-mdl-logic img { max-width: 22px; max-height: 22px; }
.klp-mdl-log time { flex: none; font-size: 12px; color: var(--text-3); font-variant-numeric: tabular-nums; }

/* 道具商店 / 我的道具 / 道具记录（home/space_magic*.htm），卡片和悬停提示沿用上面勋章页的 klp-mdl-* */
.klp-mg-warn { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; padding: 10px 14px; border-radius: var(--r-md); background: var(--warn-soft); color: var(--warn); border: 1px solid var(--warn-line); font-size: 13px; }
.klp-mg-link { color: var(--ink); font-weight: 500; margin-right: 10px; }
.klp-mg-link:hover { text-decoration: underline; }
.klp-mg-cap { display: flex; align-items: center; gap: 12px; margin-top: 12px; font-size: 12.5px; color: var(--text-3); }
.klp-mg-cap .klp-mdl-bar { flex: none; width: 200px; margin: 0; }
.klp-mg-cap b { color: var(--text); font-weight: 600; font-variant-numeric: tabular-nums; }
.klp-mg-grid { grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); }
.klp-mg-price { margin: 0; display: flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--text-3); }
.klp-mg-price svg { color: var(--warn); }
.klp-mg-price b { font-size: 15px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
.klp-mg-ops { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.klp-mg-num { position: absolute; right: -8px; bottom: -6px; min-width: 20px; height: 20px; padding: 0 6px; box-sizing: border-box; border-radius: 99px; display: grid; place-items: center; background: var(--text); color: var(--bg); font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; box-shadow: 0 0 0 2px var(--surface); }
.klp-mg-table td { vertical-align: middle; }
.klp-mg-name { font-weight: 600; color: var(--text); }
.klp-mg-time { color: var(--text-3); font-variant-numeric: tabular-nums; }
.klp-mg-table a { color: var(--ink); }

/* 勋章购买 / 申请（home/space_medal_float）和道具购买 / 赠送 / 使用 / 出售 / 丢弃（home/space_magic_*_opreation）的弹窗。
 * 原版是左图右文的 dl.xld，窄窗口里文字一行只剩四五个字、价格余额挤成一团；
 * 改成「图标 + 名称」一行，下面用键值块列价格、有效期、条件，按钮在底栏。签到页的「补签」也走道具使用弹窗 */
table.fwin td.m_c:has(> .klp-bw) { padding: 0; }
.klp-bw { box-sizing: border-box; width: 440px; max-width: calc(100vw - 32px); }
.klp-bw .f_c { width: auto; }
.klp-bw .c { padding: 8px 20px 20px; }
.klp-bw .o.pns { padding: 12px 20px; }
.klp-bw-page .klp-bw { width: auto; max-width: none; }
.klp-bw-hero { display: flex; align-items: center; gap: 14px; }
.klp-bw-ic { flex: none; width: 64px; height: 64px; border-radius: 16px; display: grid; place-items: center; background: var(--soft); }
.klp-bw-ic img { max-width: 44px; max-height: 44px; width: auto; height: auto; }
.klp-bw-t { flex: 1; min-width: 0; }
.klp-bw-t b { display: block; font-size: 16px; font-weight: 600; line-height: 1.4; color: var(--text); }
/* 道具说明里带换行（「可以提升某个主题\n注：……」），原样保留 */
.klp-bw-t p { margin: 4px 0 0; font-size: 13px; line-height: 1.6; color: var(--text-2); white-space: pre-line; overflow-wrap: anywhere; }
.klp-bw-kv { margin: 16px 0 0; padding: 2px 14px; border-radius: 12px; background: var(--hover); }
.klp-bw-kv > div { display: flex; align-items: baseline; gap: 12px; padding: 9px 0; font-size: 13px; line-height: 1.6; }
.klp-bw-kv > div + div { border-top: 1px solid var(--line); }
.klp-bw-kv dt { flex: none; width: 64px; color: var(--text-3); }
.klp-bw-kv dd { flex: 1; min-width: 0; margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; color: var(--text); }
.klp-bw-kv dd small { flex-basis: 100%; font-size: 12px; color: var(--text-3); }
.klp-bw-cond { overflow-wrap: anywhere; }
.klp-bw-cond b { font-weight: 500; color: var(--text-3); }
.klp-bw-kv dd.klp-bw-price { gap: 4px; }
.klp-bw-price svg { flex: none; align-self: center; color: var(--warn); }
.klp-bw-price b { font: 700 17px var(--mono); color: var(--text); }
.klp-bw-price s { font: 13px var(--mono); color: var(--text-3); }
.klp-bw-price .k-chip { margin-left: 4px; }
.klp-bw-warn { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; padding: 9px 12px; border-radius: var(--r-md); background: var(--warn-soft); border: 1px solid var(--warn-line); color: var(--warn); font-size: 12.5px; line-height: 1.6; }
.klp-bw-warn svg { flex: none; margin-top: 2px; }
.klp-bw-warn.is-info { background: var(--info-soft); border-color: transparent; color: var(--info); }
.klp-bw-qty { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.klp-bw-qty > label { font-size: 13px; font-weight: 500; color: var(--text-2); }
.klp-bw-unit { font-size: 13px; color: var(--text-3); }
.klp-bw-total { margin-left: auto; display: flex; align-items: baseline; gap: 4px; font-size: 12.5px; color: var(--text-3); white-space: nowrap; }
.klp-bw-total span { margin-right: 2px; }
.klp-bw-total b { font: 700 18px var(--mono); color: var(--text); }
.klp-bw-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 4px; margin: 10px 0 0; font-size: 12px; color: var(--text-3); }
.klp-bw-foot b { font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; }
.klp-bw-foot .klp-mdl-sep { margin: 0 6px; height: 10px; }
.klp-bw-form { display: flex; flex-direction: column; gap: 14px; margin-top: 18px; }
.klp-bw-form .k-step { align-self: flex-start; }
.klp-bw-user { display: flex; align-items: center; gap: 8px; }
.klp-bw-user .dpbtn { flex: none; width: 38px; height: 38px; border-radius: var(--r-md); font-size: 0; }
.klp-bw-pick { margin-bottom: 16px; }
.klp-bw-pick select { width: 100%; }
/* 各道具类 show() 输出的表单片段：magicshowtype 包的 <p>、magicshowsetting 的「说明 p.mtm + input.px」 */
.klp-bw-show { margin-top: 16px; font-size: 13px; line-height: 1.7; color: var(--text-2); }
.klp-bw-show p { margin: 0; }
.klp-bw-show p:empty { display: none; }
.klp-bw-show p + p { margin-top: 8px; }
.klp-bw-show p.mtm { margin: 12px 0 6px; font-weight: 500; color: var(--text-2); }
.klp-bw-show input.px { box-sizing: border-box; width: 100%; height: 38px; }
.klp-bw-show label { display: inline-flex; align-items: center; gap: 6px; margin-right: 16px; }
.klp-bw-err:empty { display: none; }
.klp-bw-err { margin-bottom: 12px; font-size: 13px; color: var(--danger); }

/* 好友页：自己的好友中心（页签 + 右栏分组）和别人空间里的好友列表共用一套卡片网格 */
.klp-fr-card { padding: 16px 20px 20px; }
.klp-fr-head { display: flex; align-items: center; gap: 10px; min-height: 32px; }
.klp-fr-tabs { margin: 8px 0 0; overflow-x: auto; scrollbar-width: none; }
.klp-fr-tabs a { white-space: nowrap; }
.klp-fr-tip { margin: 12px 0 0; font-size: 13px; line-height: 1.6; }
.klp-fr-tip a { color: var(--ink); }
.klp-fr-form { display: flex; gap: 8px; }
.klp-fr-card .klp-fr-form { margin-top: 12px; max-width: 420px; }
.klp-fr-form .k-btn { flex: none; }
.klp-frlist { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.klp-fr { position: relative; display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; transition: border-color var(--dur-1) var(--ease-io); }
.klp-fr:hover { border-color: color-mix(in srgb, var(--text) 16%, var(--line)); }
.klp-fr-av { position: relative; flex: none; overflow: visible; }
.klp-fr-av img { width: 48px; height: 48px; border-radius: 50%; }
.klp-fr-ol { position: absolute; right: 1px; bottom: 1px; width: 11px; height: 11px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 2px var(--surface); }
.klp-fr-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.klp-fr-name { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 14.5px; font-weight: 600; }
.klp-fr-name a:hover { color: var(--ink); }
.klp-fr-note { flex: none; max-width: 90px; overflow: hidden; text-overflow: ellipsis; font-weight: 400; }
.klp-fr-sub { display: flex; align-items: center; gap: 5px; margin: 0; font-size: 12.5px; color: var(--text-3); }
.klp-fr-sub .k-ic { flex: none; }
.klp-fr-ops { flex: none; display: flex; align-items: center; gap: 2px; }
.klp-fr-more { position: relative; }
.klp-fr-more .k-menu { right: 0; top: 40px; min-width: 168px; }
.klp-fr-more .k-mi .k-meta { margin-left: auto; }
.klp-fr-subh { margin: 20px 0 0; font-size: 14px; font-weight: 600; }
.klp-fr-empty { margin-top: 16px; border: 1px dashed var(--line); border-radius: 12px; }
/* 右栏：好友分组、找朋友入口 */
.klp-frgroups { list-style: none; margin: 0; padding: 0; }
.klp-frgroups li { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 8px; margin: 0 -8px; border-radius: var(--r-sm); font-size: 13.5px; }
.klp-frgroups li:hover { background: var(--hover); }
.klp-frgroups li.on { background: var(--soft); }
.klp-frgroups li.on .klp-frgroup-name { color: var(--soft-ink); font-weight: 500; }
.klp-frgroup-name { flex: 1; min-width: 0; color: var(--text-2); }
.klp-frgroup-ops { display: none; gap: 8px; flex: none; font-size: 12px; }
.klp-frgroup-ops a { color: var(--text-3); }
.klp-frgroup-ops a:hover { color: var(--ink); }
.klp-frgroups li:hover .klp-frgroup-ops, .klp-frgroups li:focus-within .klp-frgroup-ops { display: flex; }
.klp-frnav { display: flex; flex-direction: column; }
.klp-frnav a { display: flex; align-items: center; gap: 10px; height: 36px; padding: 0 8px; margin: 0 -8px; border-radius: var(--r-sm); font-size: 13.5px; color: var(--text-2); }
.klp-frnav a:hover { background: var(--hover); color: var(--text); }
.klp-frnav .k-ic { color: var(--text-3); }

/* 任务页（home/space_task + home/klp_task_row）。图标块、进度条、奖励这几样顶栏「进行中的任务」（klp.css 的 .klp-tbar）也在用 */
.klp-task-ic { flex: none; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--r-md); background: var(--soft); color: var(--soft-ink); }
.klp-task-ic-lg { width: 52px; height: 52px; border-radius: 14px; }
.klp-task-bar { flex: 1; min-width: 0; height: 6px; border-radius: 99px; background: var(--hover); overflow: hidden; }
.klp-task-bar i { display: block; height: 100%; max-width: 100%; border-radius: inherit; background: var(--brand); }
.klp-task-prog { display: flex; align-items: center; gap: 10px; max-width: 360px; font-size: 12.5px; color: var(--text-2); }
.klp-task-prize { display: inline-flex; align-items: center; gap: 4px; color: var(--text-2); font-weight: 500; }
.klp-task-prize .k-ic { color: var(--warn); }

.klp-tasks { padding: 0; overflow: hidden; }
.klp-tasks-h { padding: 20px 22px 0; }
.klp-tasks-h h1 { margin: 0 0 6px; font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
.klp-tasks-h p { margin: 0; font-size: 13px; color: var(--text-3); }
.klp-tasks-tabs { padding: 0 22px; margin-top: 10px; }
.klp-tasks-tabs em { margin-left: 6px; font-style: normal; font-size: 12px; color: var(--text-3); font-variant-numeric: tabular-nums; }
/* 「进行中」里有奖励没领：标签旁一个红点，和顶栏未读的提示同一个颜色 */
.klp-tasks-tabs .klp-tasks-dot { margin-left: 6px; background: var(--danger); }
/* 分组标题：新手引导（一次性任务）/ 持久任务（有周期的），分法见 klp_task_groups() */
.klp-task-group { display: flex; align-items: baseline; gap: 8px; padding: 16px 22px 6px; border-top: 1px solid var(--line); }
.klp-tasks-tabs + .klp-task-group { border-top: 0; }
.klp-task-group h2 { margin: 0; font-size: 13px; font-weight: 600; color: var(--text-2); }
.klp-task-group .k-meta { font-size: 12px; }
.klp-task-list { list-style: none; margin: 0; padding: 0; }
.klp-task { display: flex; align-items: center; gap: 16px; padding: 16px 22px; border-top: 1px solid var(--line); }
.klp-task:first-child { border-top: 0; }
.klp-task.is-claim { background: color-mix(in srgb, var(--soft) 50%, transparent); }
.klp-task-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.klp-task-t { display: flex; align-items: center; gap: 8px; min-width: 0; }
.klp-task-t a { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; font-weight: 600; color: var(--text); }
.klp-task-t a:hover { color: var(--ink); }
.klp-task-t .k-chip { flex: none; }
.klp-task-d { margin: 0; font-size: 13px; line-height: 1.6; color: var(--text-2); }
.klp-task-m { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; font-size: 12.5px; }
.klp-task-act { flex: none; min-width: 92px; display: flex; justify-content: flex-end; }
.klp-task-next { white-space: nowrap; font-size: 12.5px; }
.klp-tasks-empty { padding: 56px 20px; }

/* 任务详情 */
.klp-taskv { padding: 24px; }
.klp-taskv-h { display: flex; align-items: center; gap: 16px; }
.klp-taskv-t { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.klp-taskv-t h1 { margin: 0; font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
.klp-taskv-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.klp-taskv-tags .k-chip { gap: 4px; }
.klp-taskv-desc { margin-top: 18px; font-size: 14px; line-height: 1.75; color: var(--text-2); }
.klp-taskv-kv { margin: 20px 0 0; border-top: 1px solid var(--line); }
.klp-taskv-kv > div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.klp-taskv-kv dt { font-size: 13px; line-height: 1.7; color: var(--text-3); }
.klp-taskv-kv dd { margin: 0; font-size: 14px; line-height: 1.7; }
/* 完成条件是任务脚本 view() 拼的 HTML（原版的、klpbbs_task 的都有），只认 ul / li / a / b */
.klp-taskv-cond ul { margin: 0; padding-left: 18px; list-style: disc; }
.klp-taskv-cond li { list-style: inherit; }
.klp-taskv-cond a { color: var(--ink); }
.klp-taskv-cond a:hover { text-decoration: underline; }
.klp-taskv-cond b, .klp-taskv-cond strong { font-weight: 600; color: var(--text); }
.klp-taskv-act { margin-top: 20px; display: flex; flex-direction: column; gap: 14px; }
.klp-taskv-prog { max-width: 420px; }
.klp-taskv-btns { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.klp-taskv-st { margin: 0; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--text-2); }
.klp-taskv-st .k-ic { color: var(--ok); }
.klp-taskv-parters { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 14px 10px; }
.klp-taskv-parters li { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; font-size: 13px; }
.klp-taskv-parters .k-ellip { max-width: 100%; color: var(--text); }

/* 任务页右栏 */
.klp-task-how ol { margin: 0; padding: 0; list-style: none; counter-reset: klpstep; display: flex; flex-direction: column; gap: 12px; }
.klp-task-how li { position: relative; padding-left: 30px; font-size: 13px; line-height: 1.6; color: var(--text-2); counter-increment: klpstep; }
.klp-task-how li::before { content: counter(klpstep); position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%; background: var(--soft); color: var(--soft-ink); font: 600 12px/20px var(--mono); text-align: center; }
.klp-task-how b { display: block; font-weight: 600; color: var(--text); }

/* 窄主栏（窗口窄、右栏还在的时候主栏只剩两三百像素）：按钮挪到正文下面，页签不折字。按容器宽度判断，不看窗口 */
.klp-tasks { container-type: inline-size; }
.klp-tasks-tabs { flex-wrap: wrap; column-gap: 20px; }
.klp-tasks-tabs a { white-space: nowrap; }
@container (max-width: 520px) {
	.klp-tasks-h, .klp-tasks-tabs, .klp-task-group { padding-left: 16px; padding-right: 16px; }
	.klp-tasks-tabs { column-gap: 14px; }
	.klp-task { flex-wrap: wrap; align-items: flex-start; gap: 10px 12px; padding: 14px 16px; }
	.klp-task-b { flex: 1 1 calc(100% - 52px); }
	.klp-task-act { width: 100%; min-width: 0; justify-content: flex-start; padding-left: 52px; }
	.klp-taskv-h { align-items: flex-start; }
	.klp-taskv-kv > div { grid-template-columns: 1fr; gap: 4px; }
}

/* ---------- 搜索页（plugin.php?id=klpbbs_theme:search，模板 search/klp_search） ----------
   站里的帖子搜索走 xunsearch，原来的落地页是插件自带的 Bootstrap 独立页；
   新模板下由 klpbbs_theme 转到这一页，外观走本模板的组件。旧版风格仍旧是那张独立页。 */
.klp-srch-box, .klp-srch-main { display: flex; flex-direction: column; gap: 14px; }
.klp-srch-form { display: flex; align-items: center; gap: 10px; }
.klp-srch-form .k-ic { flex: none; color: var(--text-3); }
.klp-srch-form .k-inp { flex: 1; min-width: 0; height: 44px; border-radius: 12px; font-size: 15px; }
.klp-srch-form .k-btn { flex: none; height: 44px; padding: 0 22px; }
.klp-srch-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
/* 「只看主题帖」是个开关按钮，没打开时不要让那个勾太抢眼 */
.klp-srch-filters .k-btn-sec:not(.on) .k-ic { opacity: .35; }
/* 高级搜索开关：靠右；生效条件数用浅底计数，不用红色（这不是待处理的提醒） */
.klp-srch-advbtn { margin-left: auto; }
.klp-srch-advbtn .k-cnt { background: var(--soft); color: var(--soft-ink); }
.klp-srch-caret { transition: transform var(--dur-2) var(--ease); }
.klp-srch-advbtn[aria-expanded="true"] .klp-srch-caret { transform: rotate(180deg); }
.klp-srch-conds { display: flex; flex-wrap: wrap; gap: 6px; margin-top: -4px; }

.klp-srch-adv.is-collapsed .klp-srch-adv-body { display: none; }
.klp-srch-adv-body { padding: 16px 0 2px; border-top: 1px solid var(--line); }
.klp-srch-adv-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.klp-srch-lbl { font-size: 13px; font-weight: 500; color: var(--text-2); }
.klp-srch-wide { grid-column: 1 / -1; }
.klp-srch-adv .k-segw { align-self: flex-start; }
.klp-srch-adv-act { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }

/* 问帕帕：整条是一个链接，浅底点缀，不抢结果列表的戏 */
.klp-srch-ai { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 12px 16px; border-radius: var(--r-lg); background: var(--soft); color: var(--soft-ink); border: 1px solid transparent; }
.klp-srch-ai:hover { border-color: var(--brand); }
.klp-srch-ai-ic { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); color: var(--ink); }
.klp-srch-ai-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.klp-srch-ai-txt b { font-size: 14px; font-weight: 600; color: var(--text); }
.klp-srch-ai-txt span { font-size: 12.5px; color: var(--text-2); }
.klp-srch-ai-go { flex: none; display: inline-flex; align-items: center; gap: 2px; font-size: 13px; font-weight: 600; color: var(--ink); }
.klp-srch-ai:hover .klp-srch-ai-go .k-ic { transform: translateX(2px); }
.klp-srch-ai-go .k-ic { transition: transform var(--dur-2) var(--ease); }
.klp-srch-sum { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; margin: 16px 2px 12px; font-size: 13px; color: var(--text-3); }
.klp-srch-sum b { color: var(--text); font-weight: 600; }
.klp-srch-fix a { color: var(--ink); font-weight: 500; }

.klp-srch-list { display: flex; flex-direction: column; padding-block: 4px; }
.klp-srch-item { display: flex; align-items: flex-start; gap: 16px; padding: 16px 0; border-top: 1px solid var(--line); }
.klp-srch-body { flex: 1; min-width: 0; }
/* 主题首图：尺寸和个人空间主题列表的 .klp-tp-cover 一致 */
.klp-srch-cover { flex: none; width: 136px; height: 88px; border-radius: 12px; overflow: hidden; background: var(--hover); }
.klp-srch-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.klp-srch-item:first-child { border-top: 0; }
.klp-srch-t { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 16px; font-weight: 600; line-height: 1.5; }
.klp-srch-t a { min-width: 0; }
.klp-srch-t a:hover { color: var(--ink); }
.klp-srch-sm { margin: 0 0 8px; font-size: 13.5px; line-height: 1.75; color: var(--text-2); word-break: break-word; }
/* 命中的词：xunsearch 打的是 <em>，和原生搜索页同一套外观 */
.klp-srch-t em, .klp-srch-sm em { font-style: normal; font-weight: 600; color: var(--text); background: none; border-bottom: 1px solid var(--brand); }
.klp-srch-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 14px; }
.klp-srch-forum { display: inline-flex; align-items: center; gap: 6px; }
.klp-srch-meta a:hover { color: var(--text); }
.klp-srch-pg { justify-content: center; margin-top: 18px; }

.klp-srch-fgroups { max-height: 280px; overflow-y: auto; margin: 0 -6px 12px; padding: 0 6px; display: flex; flex-direction: column; gap: 12px; }
.klp-srch-fgroup { display: flex; flex-direction: column; gap: 2px; }
.klp-srch-fitem { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: var(--r-sm); font-size: 13.5px; color: var(--text-2); cursor: pointer; }
.klp-srch-fitem:hover { background: var(--hover); color: var(--text); }
.klp-srch-fitem input { flex: none; }
.klp-srch-fbtn { width: 100%; }
.klp-srch-help { line-height: 1.8; }
/* 窄屏：高级搜索一列排，帕帕入口只留标题 */
@media (max-width: 720px) {
	.klp-srch-adv-grid { grid-template-columns: minmax(0, 1fr); }
	.klp-srch-ai-txt span { display: none; }
	.klp-srch-cover { width: 96px; height: 64px; }
}

/* ── 管理面板：forum.php?mod=modcp ──────────────────────────────────────
   外壳是 forum/modcp.htm（菜单分组 + 图标），各子页面仍是原版模板，内容卡片吃上面「设置区」的规则。
   这里只补面板特有的：菜单计数、登录卡、筛选表单（.exfm）、内部留言（.um）和空状态。 */
.klp-mdcp .appl .tbn .klp-mdcp-n { margin-left: auto; font-size: 12px; color: var(--text-3); }
.klp-mdcp .appl .tbn .k-cnt { margin-left: auto; }
.klp-mdcp .appl .tbn .k-ic { flex: none; color: var(--text-3); }
.klp-mdcp .appl li.a .k-ic, .klp-mdcp .appl li a:hover .k-ic { color: var(--text); }

.klp-mdcp-login { display: flex; flex-direction: column; gap: 16px; max-width: 360px; padding-top: 20px; }
.klp-mdcp-tip { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 10px 12px; border-radius: var(--r-md); background: var(--info-soft); color: var(--info); font-size: 13px; line-height: 1.6; }
.klp-mdcp-tip .k-ic { flex: none; margin-top: 2px; }
.klp-mdcp-who { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--text); }

/* 内部留言：发留言的表单（forum/modcp_home.htm） */
.klp-mdcp-note { display: flex; flex-direction: column; gap: 10px; padding-top: 20px; }
.klp-mdcp-note textarea.k-inp { height: auto; min-height: 96px; padding: 10px 12px; line-height: 1.6; resize: vertical; }
.klp-mdcp-note-f { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; font-size: 13px; color: var(--text-2); }
.klp-mdcp-note-f label { display: inline-flex; align-items: center; gap: 6px; }
.klp-mdcp-exp .k-inp { width: 56px; height: 32px; padding: 0 8px; text-align: center; font-family: var(--mono); }
.klp-mdcp-note-f .k-btn { margin-left: auto; }

/* 筛选 / 添加表单：原版是一块灰底的两列表格，th 写死百分比宽度 */
.klp-mdcp .mn .exfm { margin: 20px 0 0; padding: 16px 18px; border: 0; border-radius: var(--r-md); background: var(--hover); }
/* 四列表格（标签 / 控件 / 标签 / 控件）在窄一点的屏幕上会撑破卡片：改成「标签 + 控件」成对排、放不下就折到下一行。
 * 每行第一格当标签列（提交按钮那行第一格是 &nbsp; 占位的 td，同样按标签宽度占位，按钮才能和控件对齐） */
.klp-mdcp .mn .exfm table, .klp-mdcp .mn .exfm tbody { display: block; width: 100%; }
.klp-mdcp .mn .exfm tr { display: flex; flex-wrap: wrap; align-items: center; }
.klp-mdcp .mn .exfm th, .klp-mdcp .mn .exfm tr > td:first-child { flex: 0 0 104px; box-sizing: border-box; }
/* 只靠 flex-wrap 会把「标签」和它的控件拆到两行；按表单宽度二选一：够宽一行两对，不够宽一对一行 */
.klp-mdcp .mn .exfm { container-type: inline-size; }
/* 审核页的版块下拉写在 th 里（原版如此），装着控件的 th 也按控件列排 */
.klp-mdcp .mn .exfm td, .klp-mdcp .mn .exfm th:has(> .ftid) { flex: 1 1 calc(100% - 104px); min-width: 0; box-sizing: border-box; }
@container (min-width: 680px) {
	.klp-mdcp .mn .exfm td, .klp-mdcp .mn .exfm th:has(> .ftid) { flex: 1 1 0; }
}
.klp-mdcp .mn .exfm th:empty:has(+ td:empty), .klp-mdcp .mn .exfm th:empty + td:empty { display: none; }
.klp-mdcp .mn .exfm th, .klp-mdcp .mn .exfm td { padding: 6px 12px 6px 0; vertical-align: middle; border: 0; background: none; font-size: 13px; line-height: 1.6; color: var(--text); }
.klp-mdcp .mn .exfm th { width: auto; font-weight: 500; color: var(--text-2); }
.klp-mdcp .mn .exfm .px, .klp-mdcp .mn .exfm select { height: 36px; max-width: 100%; }
/* 原版输入框靠 size 属性定宽，在新字体下会撑破卡片；「从…至…」两个 size=10 的框收窄并排在一行 */
.klp-mdcp .mn .exfm input.px { width: 180px; }
.klp-mdcp .mn .exfm input.px[size="10"], .klp-mdcp .mn .exfm input.px[size="2"] { width: 88px; }
.klp-mdcp .mn .exfm td:has(> input.px[size="10"]) { white-space: nowrap; }
/* 留言框带行内 style="width: 95%; height: 120px"，压行内样式只能 !important */
.klp-mdcp .mn .exfm textarea.pt { box-sizing: border-box; width: 100% !important; }
.klp-mdcp .mn .exfm ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; }
.klp-mdcp .mn .exfm label { display: inline-flex; align-items: center; gap: 6px; }
.klp-mdcp .mn h2.mtm, .klp-mdcp .mn h2.bbs { margin: 24px 0 10px; padding: 0; border: 0; font-size: 14px; font-weight: 600; color: var(--text); }

/* 内部留言 */
.klp-mdcp .mn .um { margin: 0; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; line-height: 1.7; color: var(--text); }
.klp-mdcp .mn .um p { margin: 0; }
.klp-mdcp .mn .um .pbn { display: flex; align-items: center; gap: 8px; padding: 0 0 4px; font-size: 12.5px; }
.klp-mdcp .mn .um .pbn .y { order: 9; margin-left: auto; float: none; color: var(--text-3); }
.klp-mdcp .mn .um.bw0 { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; border-bottom: 0; }
.klp-mdcp .mn .um.alt { background: none; }
/* 审核列表的正文预览：原版是行内写死 55px 高、自带滚动条的框，「展开」再切成 auto */
.klp-mdcp .mn .um [id^="list_note_"] { margin-top: 6px; padding: 8px 12px; border-radius: var(--r-sm); background: var(--hover); font-size: 13px; line-height: 1.7; color: var(--text-2); scrollbar-width: thin; }
.klp-mdcp .mn .um .pbn .y .pipe { margin: 0 6px; color: var(--line); }

/* 「用户权限」页的「特殊用户」标题行：原版右浮动的搜索表单在前、标题在后 */
.klp-mdcp .mn .cl:has(> .y.pns) { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; margin-top: 24px; padding: 0 0 12px; }
.klp-mdcp .mn .cl:has(> .y.pns) > h2 { order: -1; margin: 0; font-size: 14px; font-weight: 600; }
.klp-mdcp .mn .cl:has(> .y.pns) > .y { float: none; margin-left: auto; }
.klp-mdcp .mn .y.pns form { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-2); white-space: nowrap; }
.klp-mdcp .mn .y.pns .px { width: 140px; }
/* 权限表列多，表头允许折行，不然整张表探出卡片 */
.klp-mdcp .mn .dt th { white-space: normal; min-width: 4em; }

/* 日期框 + 旁边的日历下拉按钮（禁止 IP 的有效期等）：原版 .hasd 让两者左浮动叠在一起，这里改回行内并排，别让按钮掉到下一行 */
.klp-mdcp .mn td:has(> .dpbtn) { white-space: nowrap; }
.klp-mdcp .mn td:has(> .dpbtn) > .px { float: none; display: inline-block; vertical-align: middle; }
.klp-mdcp .mn td:has(> .dpbtn) > .dpbtn { float: none; display: inline-block; vertical-align: middle; width: 36px; height: 36px; margin-left: 4px; border-radius: var(--r-md); font-size: 0; }
.klp-mdcp .mn .dt td > .px { width: 120px; }

.klp-mdcp .mn .emp { margin: 0; padding: 32px 0; text-align: center; font-size: 13px; color: var(--text-3); }
.klp-mdcp .mn .notice { margin-top: 12px; font-size: 13px; color: var(--text-3); }

/* 收藏（home/space_favorite）：一条一行，类型图标 + 标题 / 时间 + 悬停出现的删除 */
#favorite_ul { margin: 0; padding: 0; list-style: none; }
.klp-fav { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.klp-fav input.pc { flex: none; margin: 9px 0 0; accent-color: var(--ink); }
.klp-fav-ic { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--r-sm); background: var(--bg); color: var(--text-3); }
.klp-fav-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.klp-fav-t { font-size: 14px; font-weight: 500; color: var(--text); }
.klp-fav-t:hover { color: var(--ink); }
.klp-fav-d { margin: 4px 0 0; font-size: 13px; color: var(--text-2); }
.klp-fav .klp-act { flex: none; width: 30px; padding: 0; justify-content: center; opacity: 0; transition: opacity var(--dur-1) var(--ease-io), background-color var(--dur-1) var(--ease-io), color var(--dur-1) var(--ease-io); }
.klp-fav:hover .klp-act, .klp-fav .klp-act:focus-visible { opacity: 1; }

/* 好友分组（spacecp_friend op=group）：原版 .buddy li 是写死的 #F9F9F9 浅灰卡片 */
.buddy li { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--bg); }
.buddy_group li { border-bottom-color: var(--line); }