/* 权限格子的共用件（shared/perm-edit.js，10-17 权限理顺第 2 步）：格子、三段按钮、格子编辑器、底下保存条、预览。前缀 pe-。
 * 颜色一种一个意思（老板 10-16 看图定的）：白 = 按 6 组 · 蓝 = 单独设 · 紫 = 个人例外 · 黄 = 改了没存（黄只留给这个）· 虚线 = 先只给管理员。
 * 颜色纪律同全站：只用 tokens.css 的语义层，不写裸色值、不写 :root。 */

/* ---------- 档位小牌 ---------- */
.pe-lv {
  display: inline-block; min-width: 38px; text-align: center; padding: 0 7px;
  border-radius: var(--radius-sm); border: 1px solid var(--border); background: var(--surface);
  font-size: var(--fs-xs); line-height: 18px; color: var(--text-muted); white-space: nowrap;
}
.pe-lv.view { color: var(--info-fg); background: var(--info-bg); border-color: var(--info-border); }
.pe-lv.rw { color: var(--success-fg); background: var(--success-bg); border-color: var(--success-border); font-weight: 600; }

/* ---------- 一格（能点的格子都是这个样子，悬停出 ✎） ---------- */
.pe-cell {
  display: inline-flex; align-items: center; gap: 6px; min-height: 28px; max-width: 100%; padding: 2px 10px;
  border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface);
  font: inherit; font-size: var(--fs-sm); color: var(--text-primary); cursor: pointer; white-space: nowrap; text-align: left;
}
.pe-cell:hover, .pe-cell.open { border-color: var(--accent); }
.pe-cell:hover::after { content: "✎"; color: var(--accent); font-weight: 600; margin-left: 2px; }
.pe-cell.open { box-shadow: 0 0 0 2px var(--accent-soft-border); }
.pe-cell:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.pe-cell .pe-meta { color: var(--text-secondary); font-size: var(--fs-xs); overflow: hidden; text-overflow: ellipsis; }
.pe-cell .pe-meta.warn { color: var(--warning-fg); }
.pe-cell .pe-tag { font-size: var(--fs-xs); font-weight: 600; color: var(--info-fg); }
.pe-cell .pe-tag.ex { color: var(--tag-4-fg); }
.pe-cell.own { background: var(--info-bg); border-color: var(--info-border); }
.pe-cell.ex { background: var(--tag-4-bg); border-color: var(--v-200); }
.pe-cell.chg { background: var(--warning-bg); border-color: var(--warning-fg); }
.pe-cell.err { background: var(--danger-bg); border-color: var(--danger-border); }
.pe-cell.err .pe-meta { color: var(--danger-fg); }
.pe-cell.lock { border-style: dashed; background: var(--surface-sunken); color: var(--text-secondary); }
.pe-cell.wait { cursor: default; color: var(--text-muted); }
.pe-old { position: relative; color: var(--text-muted); font-size: var(--fs-xs); }
.pe-old::after { content: ""; position: absolute; left: -2px; right: -2px; top: 50%; border-top: 1.5px solid var(--text-secondary); }
.pe-arrow { color: var(--warning-fg); font-weight: 700; }

/* ---------- 三段按钮：不给 / 只看 / 能改，全部的单 / 自己的单，按 6 组 / 单独挑 ---------- */
.pe-seg { display: inline-flex; border: 1px solid var(--border-control); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface); flex: none; vertical-align: middle; }
.pe-seg button {
  border: 0; border-left: 1px solid var(--border); background: transparent; padding: 0 10px; height: 26px;
  font: inherit; font-size: var(--fs-xs); color: var(--text-muted); cursor: pointer; white-space: nowrap;
}
.pe-seg button:first-child { border-left: 0; }
.pe-seg button:hover:not(:disabled) { background: var(--surface-hover); color: var(--text-primary); }
.pe-seg button:disabled { color: var(--text-disabled); cursor: not-allowed; }
.pe-seg button:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: -2px; }
.pe-seg button.on[data-v="none"] { background: var(--neutral-bg); color: var(--text-primary); font-weight: 600; box-shadow: inset 0 0 0 1px var(--border-strong); }
.pe-seg button.on[data-v="view"] { background: var(--info-bg); color: var(--info-fg); font-weight: 600; box-shadow: inset 0 0 0 1px var(--info-border); }
.pe-seg button.on[data-v="rw"] { background: var(--success-bg); color: var(--success-fg); font-weight: 600; box-shadow: inset 0 0 0 1px var(--success-border); }
.pe-seg button.on[data-v="pick"] { background: var(--accent-soft-bg); color: var(--accent-soft-fg); font-weight: 600; box-shadow: inset 0 0 0 1px var(--accent); }
.pe-seg.sm button { height: 22px; padding: 0 7px; }
.pe-seg.chg { box-shadow: 0 0 0 2px var(--warning-bg), 0 0 0 3px var(--warning-fg); }

/* ---------- 小按钮 / 链接 ---------- */
.pe-btn {
  display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 12px;
  border: 1px solid var(--border-control); border-radius: var(--radius-sm); background: var(--surface);
  color: var(--text-primary); font: inherit; font-size: var(--fs-sm); cursor: pointer; white-space: nowrap;
}
.pe-btn:hover:not(:disabled) { background: var(--surface-hover); }
.pe-btn.pri { background: var(--accent); border-color: var(--accent); color: var(--text-on-accent); font-weight: 600; }
.pe-btn.pri:hover:not(:disabled) { background: var(--accent-hover); }
.pe-btn:disabled { background: var(--surface-sunken); border-color: var(--border); color: var(--text-disabled); cursor: not-allowed; }
.pe-btn.confirm { border: 1.5px solid var(--danger-fg); color: var(--danger-fg); font-weight: 700; }
.pe-btn.confirm.on { background: var(--danger-bg); }
.pe-lnk { border: 0; background: none; padding: 0; color: var(--accent); font: inherit; font-size: var(--fs-xs); cursor: pointer; white-space: nowrap; }
.pe-lnk:hover:not(:disabled) { text-decoration: underline; }
.pe-lnk:disabled { color: var(--text-disabled); cursor: default; }
.pe-lnk.muted { color: var(--text-muted); }
.pe-hint { color: var(--text-muted); font-size: var(--fs-xs); margin: 0; }
.pe-hint.warn, .pe-bad { color: var(--warning-fg); }
.pe-ok { color: var(--success-fg); }
.pe-sp { flex: 1; }

/* ---------- 格子编辑器（三处共用） ---------- */
.pe-ed {
  position: fixed; z-index: var(--z-popover); width: 460px; max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow: auto;
  background: var(--surface-raised); color: var(--text-primary); border: 1px solid var(--border-strong);
  border-radius: var(--radius-md); box-shadow: var(--shadow-3); font-size: var(--fs-sm);
}
.pe-ed-h { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--border-subtle); }
.pe-ed-h small { color: var(--text-muted); font-size: var(--fs-xs); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pe-x { margin-left: auto; border: 0; background: none; color: var(--text-muted); font-size: var(--fs-md); cursor: pointer; }
.pe-ed-b { display: grid; grid-template-columns: 44px 1fr; gap: 10px; padding: 12px 14px; align-items: start; }
.pe-ed-b > span { color: var(--text-muted); font-size: var(--fs-xs); line-height: 26px; }
.pe-ed-b > .pe-hint { grid-column: 1 / -1; }
.pe-opts { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; min-height: 26px; }
.pe-opts .pe-hint { flex-basis: 100%; }
.pe-colbox { grid-column: 1 / -1; border: 1px solid var(--border-subtle); border-radius: var(--radius-sm); }
.pe-colbar { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-bottom: 1px solid var(--border-subtle); background: var(--surface-sunken); font-size: var(--fs-xs); color: var(--text-muted); }
.pe-q { flex: 1; min-width: 0; height: 26px; padding: 0 8px; border: 1px solid var(--border-control); border-radius: var(--radius-sm); font: inherit; font-size: var(--fs-xs); background: var(--surface); color: var(--text-primary); }
.pe-cols { max-height: 260px; overflow: auto; }
.pe-col { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 8px; border-bottom: 1px solid var(--border-subtle); }
.pe-col:last-child { border-bottom: 0; }
.pe-col-n { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-xs); }
.pe-col-n small { margin-left: 6px; color: var(--text-muted); }
.pe-g { margin-left: 6px; padding: 0 5px; border-radius: var(--radius-sm); font-style: normal; font-size: 11px; background: var(--surface-sunken); color: var(--text-muted); }
.pe-g.factory, .pe-g.cost { background: var(--danger-bg); color: var(--danger-fg); }
.pe-g.customer, .pe-g.sale { background: var(--warning-bg); color: var(--warning-fg); }
.pe-sum { margin: 0 14px; padding: 8px 10px; border-radius: var(--radius-sm); background: var(--accent-soft-bg); color: var(--accent-soft-fg); font-size: var(--fs-xs); }
.pe-sum b { color: var(--text-primary); }
.pe-ed-f { display: flex; align-items: center; gap: 8px; padding: 10px 14px; flex-wrap: wrap; }

/* ---------- 底下保存条 + 预览 ---------- */
.pe-bar.pe-off { display: none !important; }      /* 表设计里切到「字段设计」时收起 */
.pe-bar { position: fixed; right: 20px; bottom: 16px; z-index: var(--z-sticky); display: grid; gap: 8px; justify-items: end; max-width: calc(100vw - 40px); }
.pe-bar-main {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 12px; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--warning-fg); box-shadow: var(--shadow-3);
}
.pe-cnt { color: var(--warning-fg); font-weight: 600; white-space: nowrap; }
.pe-cnt i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; background: var(--warning-bg); border: 1px solid var(--warning-fg); vertical-align: -1px; margin-right: 6px; }
.pe-sep { width: 1px; height: 20px; background: var(--border); }
.pe-pv {
  width: min(980px, calc(100vw - 40px)); max-height: 38vh; overflow: auto; padding: 10px 14px; border-radius: var(--radius-md);
  background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-2);
}
.pe-pv-h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.pe-pv-h em { font-style: normal; font-weight: 600; color: var(--danger-fg); }
.pe-pv-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pe-pv-list li { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 2px 10px; align-items: start; padding: 4px 0; border-top: 1px solid var(--border-subtle); }
.pe-pv-list li b { font-weight: 600; }
.pe-pv-list li.risk b { color: var(--danger-fg); }
.pe-pv-list li small { grid-column: 1; color: var(--text-muted); font-size: var(--fs-xs); }
.pe-pv-items { grid-column: 2; display: flex; flex-wrap: wrap; gap: 4px 6px; }
.pe-pv-chip { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: var(--radius-full); border: 1px solid var(--border); font-size: var(--fs-xs); line-height: 20px; }
.pe-pv-chip.gain { color: var(--success-fg); background: var(--success-bg); border-color: var(--success-border); }
.pe-pv-chip.lose { color: var(--warning-fg); background: var(--warning-bg); border-color: var(--warning-border); }
.pe-pv-chip.risk { color: var(--danger-fg); background: var(--danger-bg); border-color: var(--danger-border); font-weight: 600; }

/* ---------- 图例 ---------- */
.pe-legend { display: inline-flex; align-items: center; gap: 14px; font-size: var(--fs-xs); color: var(--text-secondary); font-weight: 400; }
.pe-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.pe-legend i { display: inline-block; width: 14px; height: 14px; border-radius: 4px; border: 1px solid var(--border-strong); background: var(--surface); }
.pe-legend i.c { background: var(--info-bg); border-color: var(--info-border); }
.pe-legend i.e { background: var(--tag-4-bg); border-color: var(--v-200); }
.pe-legend i.y { background: var(--warning-bg); border-color: var(--warning-fg); }

/* ---------- 群晖式三列表（10-17 老板：左列是项，三列 不给 / 只看 / 能改，一行一个圆点，点表头 = 整列） ---------- */
.pe-rc { width: 76px; text-align: center; padding: 0 !important; }
.pe-rd {
  position: relative; display: inline-block; width: 18px; height: 18px; padding: 0; margin: 0; vertical-align: middle;
  border: 1.5px solid var(--border-strong); border-radius: 50%; background: var(--surface); cursor: pointer;
}
button.pe-rd:hover:not(:disabled) { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft-bg); }
button.pe-rd:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.pe-rd.on { border-color: var(--accent); }
.pe-rd.on::after { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--accent); }
/* 勾的几个角色里有的是这一档（「不一样」）：虚线圈 + 淡点 */
.pe-rd.some { border-style: dashed; border-color: var(--accent); }
.pe-rd.some::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--accent); opacity: .35; }
.pe-rd:disabled { cursor: not-allowed; border-color: var(--border); background: var(--surface-sunken); }
.pe-na { color: var(--text-disabled); font-size: var(--fs-xs); }
.pe-rh { display: inline-flex; flex-direction: column; align-items: center; gap: 3px; border: 0; background: none; padding: 4px 6px; border-radius: var(--radius-sm);
  font: inherit; font-size: var(--fs-xs); font-weight: 600; color: var(--text-secondary); cursor: pointer; }
.pe-rh:hover { background: var(--surface-hover); color: var(--text-primary); }
.pe-rh .pe-rd { width: 14px; height: 14px; cursor: pointer; }
.pe-rh .pe-rd.on::after { inset: 2px; }
.pe-mix { display: inline-block; margin-left: 8px; padding: 0 7px; border-radius: var(--radius-full); border: 1px dashed var(--accent);
  color: var(--accent-soft-fg); background: var(--accent-soft-bg); font-size: 11px; font-weight: 600; line-height: 18px; cursor: help; vertical-align: 1px; }
.pe-was { display: inline-block; color: var(--warning-fg); font-size: var(--fs-xs); white-space: nowrap; margin-right: 8px; }

/* ---------- 逐列表（老板 10-17 图 5：一行一个角色 / 个人，一列一个字段） ---------- */
.pe-ft-wrap { width: 0; min-width: 100%; max-height: min(62vh, 640px); overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface); }
.pe-ft { border-collapse: separate; border-spacing: 0; font-size: var(--fs-xs); color: var(--text-primary); }
.pe-ft th, .pe-ft td { border-bottom: 1px solid var(--border-subtle); border-right: 1px solid var(--border-subtle); background: var(--surface); }
.pe-ft thead th { position: sticky; z-index: 3; background: var(--surface-sunken); font-weight: 600; color: var(--text-secondary); }
.pe-ft thead tr:first-child th { top: 0; height: 28px; padding: 0 8px; white-space: nowrap; }
.pe-ft thead tr:nth-child(2) th { top: 29px; height: 44px; padding: 2px 3px; }
.pe-ft .pe-ft-who { position: sticky; left: 0; z-index: 2; width: 220px; min-width: 220px; max-width: 220px; padding: 6px 10px; text-align: left; vertical-align: top; }
.pe-ft .pe-ft-rows { position: sticky; left: 221px; z-index: 2; width: 124px; min-width: 124px; padding: 6px 8px; text-align: left; vertical-align: middle; box-shadow: 2px 0 0 var(--border); }
.pe-ft thead .pe-ft-who, .pe-ft thead .pe-ft-rows { z-index: 5; vertical-align: bottom; }
.pe-ft thead .pe-ft-who small { display: block; font-weight: 400; color: var(--text-muted); }
.pe-ft-g { text-align: center; font-size: 11px; }
.pe-ft-g.g-factory, .pe-ft-g.g-cost { background: var(--danger-bg) !important; color: var(--danger-fg) !important; }
.pe-ft-g.g-customer, .pe-ft-g.g-sale { background: var(--warning-bg) !important; color: var(--warning-fg) !important; }
.pe-ft-g.g-progress, .pe-ft-g.g-product { background: var(--info-bg) !important; color: var(--info-fg) !important; }
.pe-ft-g.g-none { color: var(--text-muted) !important; font-style: italic; }
.pe-ft-c { width: 66px; min-width: 66px; max-width: 66px; }
.pe-ft-cn { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; width: 100%; border: 0; background: none; padding: 2px;
  font: inherit; font-size: 11px; font-weight: 500; line-height: 1.3; color: var(--text-primary); text-align: center; cursor: pointer; border-radius: var(--radius-sm); word-break: break-all; }
.pe-ft-cn:hover { background: var(--surface-hover); color: var(--accent); }
.pe-ft-x { text-align: center; padding: 3px 4px; }
.pe-fc { width: 54px; height: 24px; padding: 0; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface);
  font: inherit; font-size: 11px; color: var(--text-muted); cursor: pointer; white-space: nowrap; }
.pe-fc:hover { border-color: var(--accent); }
.pe-fc:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.pe-fc.v-view { background: var(--info-bg); color: var(--info-fg); border-color: var(--info-border); }
.pe-fc.v-manage { background: var(--success-bg); color: var(--success-fg); border-color: var(--success-border); font-weight: 600; }
.pe-fc.v-mix { color: var(--accent-soft-fg); border: 1px dashed var(--accent);
  background: repeating-linear-gradient(135deg, var(--accent-soft-bg) 0 4px, var(--surface) 4px 8px); font-weight: 600; }
.pe-fc.chg { box-shadow: 0 0 0 2px var(--warning-fg); }
.pe-ft-name { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; font-size: var(--fs-sm); }
.pe-ft-name b { font-weight: 600; }
.pe-ft-who > small { display: block; color: var(--text-muted); margin-top: 1px; }
.pe-ft-whole { display: inline-flex; align-items: center; gap: 3px; margin-top: 5px; color: var(--text-muted); font-size: 11px; }
.pe-ft-whole button { height: 20px; padding: 0 6px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); font: inherit; font-size: 11px; color: var(--text-secondary); cursor: pointer; }
.pe-ft-whole button:hover { border-color: var(--accent); color: var(--accent); }
.pe-ft-rows select { width: 100%; height: 26px; border: 1px solid var(--border-control); border-radius: var(--radius-sm); background: var(--surface); color: var(--text-primary); font: inherit; font-size: 11.5px; }
.pe-ft td.pe-ft-rows.chg, .pe-ft tr.pe-ft-row td.pe-ft-rows.chg { background: var(--warning-bg); }
.pe-ft-rows .pe-mix { margin: 3px 0 0; }
.pe-ft-admin td { background: var(--accent-soft-bg) !important; }
.pe-ft-all { color: var(--text-secondary); padding: 6px 10px; }
.pe-ft-row.off td:not(.pe-ft-who) { opacity: .45; }
.pe-ft-row.off .pe-ft-name { color: var(--text-secondary); }
.pe-ft-row.off:hover td { opacity: 1; }
.pe-ft-row.err .pe-ft-who { box-shadow: inset 3px 0 0 var(--danger-fg); }
.pe-ft-sec td { background: var(--surface-sunken) !important; color: var(--text-secondary); font-weight: 600; padding: 4px 10px; }
.pe-ft-add td { background: var(--surface-sunken); }

/* 表头列名 / 按条件 的小浮层 */
.pe-menu { position: fixed; z-index: var(--z-popover); display: grid; gap: 8px; width: 300px; padding: 10px 12px; background: var(--surface-raised);
  border: 1px solid var(--border-strong); border-radius: var(--radius-md); box-shadow: var(--shadow-3); font-size: var(--fs-sm); }
.pe-menu-row { display: flex; gap: 6px; flex-wrap: wrap; }
.pe-menu-row .pe-btn { height: 28px; }
.pe-menu .pe-btn.v-view { color: var(--info-fg); }
.pe-menu .pe-btn.v-manage { color: var(--success-fg); font-weight: 600; }
.pe-menu-list { display: grid; gap: 2px; max-height: 220px; overflow: auto; }
.pe-menu-list .pe-lnk { text-align: left; padding: 4px 6px; font-size: var(--fs-sm); border-radius: var(--radius-sm); }
.pe-menu-list .pe-lnk.on { background: var(--accent-soft-bg); font-weight: 600; }
.pe-menu-chk { display: flex; align-items: center; gap: 6px; font-size: var(--fs-xs); color: var(--text-secondary); }
.pe-ft-sect { position: sticky; left: 10px; }
.pe-ftrows-btn { display: inline-flex; align-items: center; justify-content: space-between; gap: 4px; width: 100%; height: 26px; padding: 0 8px; border: 1px solid var(--border-control);
  border-radius: var(--radius-sm); background: var(--surface); font: inherit; font-size: 11.5px; color: var(--text-primary); cursor: pointer; white-space: nowrap; overflow: hidden; }
.pe-ftrows-btn span { color: var(--accent); }
.pe-ftrows-btn:hover:not(:disabled) { border-color: var(--accent); }
.pe-ftrows-btn:disabled { background: var(--surface-sunken); color: var(--text-disabled); cursor: not-allowed; }
.pe-ftrows-btn.mix { border-style: dashed; border-color: var(--accent); color: var(--accent-soft-fg); background: var(--accent-soft-bg); font-weight: 600; }
.pe-menu-list .pe-lnk:disabled { color: var(--text-disabled); }

/* 最新几条数据（10-19） */
.pe-ft-sample td { background: var(--surface-hover); color: var(--muted); max-width: 140px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pe-ft-sample td small { font-size: 11px; }

/* 看哪些单 · 按条件筛：页面中间的对话框（10-19 老板嫌小框看不清） */
.pe-rfm { position: fixed; inset: 0; z-index: var(--z-modal, 1000); display: flex; align-items: flex-start; justify-content: center; padding: 10vh 16px 16px;
  background: color-mix(in srgb, var(--ink) 28%, transparent); }
.pe-rfm-box { width: min(720px, 100%); max-height: 80vh; overflow: auto; display: grid; gap: 14px; padding: 18px 22px; border-radius: 12px;
  background: var(--surface); box-shadow: 0 18px 50px color-mix(in srgb, var(--ink) 22%, transparent); font-size: 14px; color: var(--ink); }
.pe-rfm-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.pe-rfm-head b { font-size: 16px; }
.pe-rfm-head small { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; }
.pe-rfm-x { border: 0; background: none; font-size: 22px; line-height: 1; color: var(--muted); cursor: pointer; }
.pe-rfm-match { color: var(--ink); }
.pe-rfm-cols, .pe-rfm-row { display: grid; grid-template-columns: 22px minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1.3fr) 30px; gap: 8px; align-items: center; }
.pe-rfm-cols span { font-size: 12px; color: var(--muted); }
.pe-rfm-n { color: var(--muted); font-size: 12px; text-align: center; }
.pe-rfm select, .pe-rfm input[type=text], .pe-rfm input[type=date], .pe-rfm input[type=number] { width: 100%; box-sizing: border-box; height: 34px; padding: 0 10px;
  border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); font-size: 14px; color: var(--ink); }
.pe-rfm-match select { width: auto; margin: 0 4px; }
.pe-rfm-days { display: flex; align-items: center; gap: 6px; }
.pe-rfm-days input { width: 90px !important; }
.pe-rfm-na { color: var(--muted); font-size: 13px; }
.pe-rfm-del { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius-sm); height: 34px; cursor: pointer; color: var(--muted); font-size: 16px; }
.pe-rfm-del:hover { color: var(--danger-fg); }
.pe-rfm-add { justify-self: start; border: 1px dashed var(--line); background: none; border-radius: var(--radius-sm); padding: 6px 12px; cursor: pointer; color: var(--green); }
.pe-rfm-ex { display: grid; gap: 4px; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--surface-hover); font-size: 13px; color: var(--ink-2, var(--ink)); }
.pe-rfm-ex i { font-style: normal; color: var(--green); margin: 0 2px; }
.pe-rfm-foot { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 12px; }
.pe-rfm-foot small { color: var(--muted); font-size: 12px; margin-right: auto; }
.pe-rfm-msg { color: var(--danger-fg); font-size: 13px; }
@media (max-width: 560px) { .pe-rfm-cols { display: none; } .pe-rfm-row { grid-template-columns: 1fr 30px; } .pe-rfm-n { display: none; } .pe-rfm-row > *:not(.pe-rfm-del) { grid-column: 1; } .pe-rfm-del { grid-column: 2; grid-row: 1; } }