/* prospect.css —— 主动获客（客户开发）这条线自己的样式。
 *
 * 【为什么不写进 base.css / tools.css】那两个是全站共用的：
 *   base.css = 全站框架，tools.css = 78 个工具共用 → 改它们等于改现有页面（红线）。
 *   这条线的界面是新的，样式收在自己的文件里，怎么改都不会波到别的页面。
 *
 * 【命名】所有 class 以 pg- 开头（prospect），与现有页面零冲突。
 * 【配色】只用既有的 CSS 变量（tokens.css 那一套），不写死色值 ——
 *   第 30 轮刚把全站颜色收敛过，这里必须跟着变量走，别再造一套灰。
 * 【手机端】规则写在本文件底部的 @media 里（这条线自己的响应式），
 *   同时页面也挂了全站的 mobile.css，两者互不干扰。
 */

.pg-wrap {
    display: block;
    margin: 14px 0 40px;
}
/* 上半部分：左边卡片墙 + 右边卡片操作区（以前 .pg-wrap 自己就是这个两列网格）。
   2026-09-28 用户要求「表格不要搞窗口化，跟客户管理一样放在最下面」→ 拆成上下两块，
   线索表在下半部分全宽铺开。 */
.pg-top {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

/* ---------------- 页面最下面那张线索表（全宽，跟 crm 的 .body 一个意思） ---------------- */
.pg-leads { margin-top: 20px; border-top: 1px solid var(--border); padding-top: 14px; }
.pg-leads-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.pg-leads-head b { font-size: 15px; }
/* 表格不再关在一个 62vh 的窗口里 —— 页面自己滚，表头是粘的，横拖还是靠这个容器 */
.pg-leads .pg-g-wrap { max-height: none; }
/* 从侧栏点「线索表」滚过来时闪一下，让人知道滚对了地方 */
.pg-leads-on .pg-g-wrap { box-shadow: 0 0 0 3px var(--accent-soft); transition: box-shadow .2s ease; }
/* 表头那句「这次看的是角色「X」的数据」——换角色时它会变，让人一眼知道表里是谁的数据 */
.pg-leads-role {
    font-size: 12px; color: var(--accent-dark); background: var(--accent-soft);
    border-radius: 999px; padding: 2px 9px; white-space: nowrap;
}

/* ---------------- 卡片墙（左侧六张卡） ---------------- */
.pg-wall { display: flex; flex-direction: column; gap: 8px; }

.pg-card {
    display: grid;
    grid-template-columns: 30px 1fr;
    grid-template-rows: auto auto auto;
    gap: 2px 10px;
    padding: 10px 12px;
    text-align: left;
    background: var(--card, #fff);
    border: 1px solid var(--border);
    border-radius: 10px;
    cursor: pointer;
    font: inherit;
    color: inherit;
}
.pg-card:hover { border-color: var(--accent); }
.pg-card.on { border-color: var(--accent); box-shadow: inset 3px 0 0 var(--accent); }
.pg-card.later { opacity: .55; cursor: not-allowed; }
.pg-card-ico { grid-row: 1 / span 2; font-size: 20px; line-height: 1.2; }
.pg-card-name { font-weight: 600; }
.pg-card-sub { grid-column: 2; color: var(--muted-foreground); font-size: 12.5px; }
.pg-card-badge {
    grid-column: 2; justify-self: start; margin-top: 4px;
    font-size: 11px; padding: 1px 6px; border-radius: 999px;
    background: var(--accent); color: #fff;
}
.pg-card.later .pg-card-badge { background: var(--muted-foreground); }

.pg-card-strip {
    display: flex; flex-wrap: wrap; gap: 4px 12px;
    padding: 8px 12px; margin-top: 2px;
    border: 1px dashed var(--border); border-radius: 10px;
    color: var(--muted-foreground); font-size: 12.5px;
}
.pg-card-strip b { color: var(--foreground); }

/* ---------------- 操作区 ---------------- */
.pg-stage { min-width: 0; }
.pg-stage-head {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    padding: 8px 12px; margin-bottom: 12px;
    background: var(--card, #fff); border: 1px solid var(--border); border-radius: 10px;
}
.pg-stage-ico { font-size: 18px; }
.pg-back {
    border: 1px solid var(--border); background: transparent; color: var(--muted-foreground);
    border-radius: 8px; padding: 3px 8px; cursor: pointer; font: inherit; font-size: 12.5px;
}
.pg-back:hover { color: var(--foreground); border-color: var(--accent); }

.pg-head { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.pg-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pg-hint { color: var(--muted-foreground); font-size: 12.5px; }
.pg-sub2 { color: var(--muted-foreground); font-size: 11.5px; }
.pg-nowrap { white-space: nowrap; }
.pg-num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---------------- 按钮 ---------------- */
.pg-btn {
    border: 1px solid var(--border); background: var(--card, #fff); color: var(--foreground);
    border-radius: 8px; padding: 6px 12px; cursor: pointer; font: inherit; font-size: 13.5px;
}
.pg-btn:hover { border-color: var(--accent); }
.pg-btn:disabled { opacity: .5; cursor: not-allowed; }
.pg-btn-main { background: var(--accent); border-color: var(--accent); color: #fff; }
.pg-btn-main:hover { filter: brightness(1.06); }
.pg-btn-ai { border-color: var(--accent); color: var(--accent); }
.pg-btn-danger { color: #c0392b; border-color: #e3b7b1; }
.pg-busy { position: relative; }
.pg-mini {
    border: 1px solid var(--border); background: transparent; color: var(--muted-foreground);
    border-radius: 6px; padding: 2px 7px; cursor: pointer; font: inherit; font-size: 12px;
}
.pg-mini:hover { color: var(--foreground); border-color: var(--accent); }
.pg-mini:disabled { opacity: .45; cursor: not-allowed; }

/* ---------------- 战报条 ---------------- */
.pg-report {
    display: flex; gap: 8px; align-items: flex-start;
    padding: 9px 12px; margin: 8px 0 12px;
    border: 1px solid var(--border); border-left: 3px solid var(--accent);
    border-radius: 8px; background: var(--card, #fff); font-size: 13.5px;
}
.pg-report-ico { flex: 0 0 auto; }
.pg-report-ok { border-left-color: #2e8b57; }
.pg-report-warn { border-left-color: #d08700; }
.pg-report-bad { border-left-color: #c0392b; }
.pg-loading, .pg-empty { padding: 22px 12px; color: var(--muted-foreground); text-align: center; }
.pg-empty-t { font-size: 14px; }
.pg-empty-h { margin-top: 4px; font-size: 12.5px; }

/* ---------------- 表格 ---------------- */
.pg-tablewrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.pg-table { width: 100%; border-collapse: collapse; font-size: 13px; background: var(--card, #fff); }
.pg-table th, .pg-table td {
    padding: 7px 9px; text-align: left; border-bottom: 1px solid var(--border); vertical-align: top;
}
.pg-table th { background: var(--muted, #f6f6f6); font-weight: 600; font-size: 12.5px; white-space: nowrap; }
.pg-table tr:last-child td { border-bottom: 0; }
.pg-table tr.pg-on { background: rgba(0, 0, 0, .035); }
.pg-reason { max-width: 320px; color: var(--muted-foreground); }
.pg-pickcell { text-align: center; }
.pg-pager { display: flex; gap: 8px; align-items: center; padding: 8px 2px; font-size: 12.5px; color: var(--muted-foreground); }

/* ---------------- 徽标 / 判定 ---------------- */
.pg-pill { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 12px; white-space: nowrap; }
.pg-pill-ok { background: #e4f3e8; color: #1f6b3f; }
.pg-pill-watch { background: #fdf3d8; color: #8a6100; }
.pg-pill-no { background: #f6e5e3; color: #9c3427; }
.pg-pill-none { background: var(--muted, #eee); color: var(--muted-foreground); }
.pg-tier {
    display: inline-block; margin-left: 5px; padding: 0 5px; border-radius: 5px;
    border: 1px solid var(--border); font-size: 11px; color: var(--muted-foreground);
}
.pg-lock { margin-left: 4px; }
.pg-verdictline { margin-bottom: 6px; }
.pg-reason-big { font-size: 15px; }
.pg-conflict { border-left: 3px solid #c0392b; padding-left: 8px; }

/* ---------------- 表单 / chips ---------------- */
.pg-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 8px 0; }
.pg-form-1 { grid-template-columns: 1fr; }
.pg-form label, .pg-filters label { display: block; font-size: 12.5px; color: var(--muted-foreground); }
.pg-form input, .pg-form textarea, .pg-form select,
.pg-filters input, .pg-filters select {
    width: 100%; margin-top: 4px; padding: 7px 9px;
    border: 1px solid var(--border); border-radius: 8px; background: var(--card, #fff);
    color: var(--foreground); font: inherit; font-size: 13.5px;
}
.pg-form textarea { min-height: 60px; resize: vertical; }
.pg-wide { grid-column: 1 / -1; }
.pg-filters {
    display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
    padding: 10px; margin: 10px 0; border: 1px solid var(--border); border-radius: 10px;
}
.pg-filters label { min-width: 120px; }

.pg-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pg-chip {
    border: 1px solid var(--border); background: var(--card, #fff); color: var(--foreground);
    border-radius: 999px; padding: 4px 11px; cursor: pointer; font: inherit; font-size: 12.5px;
}
.pg-chip.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.pg-chip:disabled { opacity: .5; cursor: not-allowed; }
.pg-knob { padding: 12px; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 12px; }
.pg-knob-row { margin-bottom: 10px; }
.pg-knob-row:last-child { margin-bottom: 0; }

/* ---------------- 面板 / 抽屉 / 提示 ---------------- */
.pg-panel { padding: 12px; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 12px; }
.pg-panel-t {
    margin: 14px 0 6px; padding-bottom: 4px; font-weight: 600; font-size: 13px;
    border-bottom: 1px solid var(--border);
}
.pg-panel-t2 { margin-top: 22px; }
.pg-safe {
    padding: 8px 11px; margin: 8px 0; border-radius: 8px;
    background: var(--muted, #f6f6f6); color: var(--muted-foreground); font-size: 12.5px;
}
.pg-tabs { display: flex; gap: 6px; margin: 14px 0 10px; border-bottom: 1px solid var(--border); }
.pg-tab {
    border: 1px solid var(--border); border-bottom: 0; background: transparent; color: var(--muted-foreground);
    border-radius: 8px 8px 0 0; padding: 6px 12px; cursor: pointer; font: inherit; font-size: 13px;
}
.pg-tab.on { background: var(--card, #fff); color: var(--foreground); font-weight: 600; }
.pg-tab-n { color: var(--accent); }

.pg-mask {
    position: fixed; inset: 0; z-index: 9000; background: rgba(0, 0, 0, .38);
    display: flex; justify-content: flex-end;
}
.pg-drawer {
    width: min(720px, 94vw); height: 100%; display: flex; flex-direction: column;
    background: var(--card, #fff); border-left: 1px solid var(--border);
}
.pg-drawer-bar {
    display: flex; justify-content: space-between; align-items: center; gap: 10px;
    padding: 12px 14px; border-bottom: 1px solid var(--border);
}
.pg-drawer-body { padding: 14px; overflow: auto; }
.pg-x {
    border: 1px solid var(--border); background: transparent; color: var(--muted-foreground);
    border-radius: 8px; padding: 3px 10px; cursor: pointer; font: inherit; font-size: 12.5px;
}
.pg-kvblock { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; }
.pg-kv { display: flex; gap: 8px; padding: 3px 0; border-bottom: 1px dashed var(--border); font-size: 13px; }
.pg-kv-k { flex: 0 0 76px; color: var(--muted-foreground); }
.pg-kv-v { flex: 1; word-break: break-word; }
/* 详情里空的字段不再藏起来（藏了用户以为资料丢了）：明说"未填 / 待背调" */
.pg-kv-empty { color: var(--muted-foreground); }
/* 详情按组摊开（基本资料 / 联系方式 / …）——36 个字段平铺一串没法扫 */
.pg-kv-group {
    margin: 10px 0 2px; padding: 2px 0; font-size: 12px; font-weight: 600;
    color: var(--accent-dark); border-bottom: 1px solid var(--border);
}
.pg-kv-group:first-child { margin-top: 0; }
/* 「待背调」标记：这些字段是等背调去抓的，不是没给（用户 2026-09-28：「没有任何信息了」） */
.pg-todo {
    display: inline-block; font-size: 11px; line-height: 16px; padding: 0 6px;
    border: 1px dashed var(--border); border-radius: 999px;
    color: var(--muted-foreground); cursor: help; white-space: nowrap;
}
.pg-src { margin: 4px 0 0; padding-left: 20px; font-size: 12.5px; }
.pg-src a { color: var(--accent); }
.pg-hits { margin: 4px 0 0; padding-left: 20px; font-size: 13px; }
.pg-blocked { margin-top: 6px; color: #9c3427; font-size: 13px; }
.pg-sub { color: var(--muted-foreground); font-size: 13px; margin: 0 0 8px; }

/* ---------------- 采集台账 / 计划 / 合并 ---------------- */
.pg-steps { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; margin: 6px 0; font-size: 12.5px; }
.pg-step { padding: 2px 8px; border: 1px solid var(--border); border-radius: 999px; }
.pg-step.done { background: #e4f3e8; border-color: #b6dfc5; }
.pg-step.next { border-color: var(--accent); color: var(--accent); font-weight: 600; }
.pg-step-arrow { color: var(--muted-foreground); }
.pg-plan { padding: 12px; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 10px; }
.pg-plan-head { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.pg-plan-foot { display: flex; gap: 8px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.pg-plan-text { white-space: pre-wrap; font-size: 13px; background: var(--muted, #f6f6f6); padding: 10px; border-radius: 8px; }
.pg-bar { height: 6px; border-radius: 999px; background: var(--muted, #eee); overflow: hidden; margin: 6px 0; }
.pg-bar i { display: block; height: 100%; background: var(--accent); }
.pg-merge { padding: 12px; border: 1px solid var(--border); border-left: 3px solid #d08700; border-radius: 10px; margin-bottom: 10px; }
.pg-merge-done { border-left-color: #2e8b57; }
.pg-merge-t { font-weight: 600; margin-bottom: 4px; }
.pg-merge-foot { display: flex; gap: 8px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.pg-diff { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.pg-diff th, .pg-diff td { padding: 5px 7px; border-bottom: 1px solid var(--border); text-align: left; }
.pg-diff-f { color: var(--muted-foreground); white-space: nowrap; }
.pg-diff-old { color: var(--muted-foreground); }
.pg-diff-new { font-weight: 600; }
.pg-radio { display: inline-flex; gap: 3px; align-items: center; margin-right: 10px; font-size: 12px; }
.pg-radio input { margin: 0; }

/* ---------------- 提示条 ---------------- */
.pg-toast {
    position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 12px);
    z-index: 9500; max-width: min(560px, 90vw);
    padding: 9px 16px; border-radius: 999px;
    background: rgba(20, 20, 20, .92); color: #fff; font-size: 13.5px;
    opacity: 0; transition: opacity .22s, transform .22s; pointer-events: none;
}
.pg-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------------- 卡片内通用排版（卡片 1/2 用的一套 class） ----------------
 * ⚠️ 教训：这些 class 先出现在卡片的 HTML 里，CSS 里却一个都没有 ——
 *   结果旋钮区看着像"没穿衣服"（每批上限的输入框没有边框、标签和输入框挤在一起）。
 *   加卡片时先跑一遍「JS 里用到的 pg- class 有没有在 CSS 里定义」，别靠肉眼。
 */
.pg-cardroot { min-height: 40px; }
.pg-body { min-height: 40px; }
.pg-card-head { margin-bottom: 10px; }
.pg-card-head h2 { margin: 0 0 4px; font-size: 17px; }

.pg-field { display: block; margin-bottom: 10px; }
.pg-field-sm { display: inline-block; margin-bottom: 0; }
.pg-field > input[type="text"], .pg-field > input[type="search"] { width: 100%; max-width: 420px; margin-top: 4px; }
.pg-label { display: block; font-size: 12.5px; color: var(--muted-foreground); margin-bottom: 4px; }
.pg-label-h { font-size: 11.5px; opacity: .85; }
.pg-inline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.pg-inline-wrap { margin-top: 10px; }
.pg-inline input[type="text"] { flex: 1 1 240px; min-width: 160px; max-width: 420px; }
.pg-inline input[type="number"] { width: 76px; }
.pg-field input[type="text"], .pg-field input[type="number"], .pg-field input[type="search"],
.pg-inline input[type="text"], .pg-inline input[type="number"] {
    padding: 6px 9px; border: 1px solid var(--border); border-radius: 8px;
    background: var(--card, #fff); color: var(--foreground); font: inherit; font-size: 13.5px;
}
.pg-check { display: inline-flex; gap: 5px; align-items: center; font-size: 12.5px; color: var(--muted-foreground); }
.pg-check input { margin: 0; }
.pg-chip.off { opacity: .55; border-style: dashed; }
.pg-chip-tag { margin-left: 5px; font-size: 10.5px; opacity: .75; font-style: normal; }

/* 严格度：三选一（卡片 1） */
.pg-seg { display: flex; gap: 0; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; width: fit-content; }
.pg-seg button {
    border: 0; border-right: 1px solid var(--border); background: var(--card, #fff);
    color: var(--muted-foreground); padding: 6px 14px; cursor: pointer; font: inherit; font-size: 13px;
}
.pg-seg button:last-child { border-right: 0; }
.pg-seg button.on { background: var(--accent); color: #fff; font-weight: 600; }

/* 未登录 / 没数据时的引导块 */
.pg-gate { padding: 22px 14px; text-align: center; color: var(--muted-foreground); }
.pg-diff-pick { white-space: nowrap; }

/* ---------------- 手机端（这条线自己的响应式规则） ----------------
 * 电脑端已经被第 30 轮统一过配色，这里只处理"变窄了怎么摆"：
 *   卡片墙从左侧栏变成顶部横向滑动条，表格允许横向滑，抽屉占满宽。
 */
@media (max-width: 820px) {
    .pg-top { grid-template-columns: 1fr; gap: 10px; }
    .pg-wall { flex-direction: row; overflow-x: auto; padding-bottom: 4px; }
    .pg-card { min-width: 168px; }
    .pg-card-strip { width: 100%; }
    .pg-form { grid-template-columns: 1fr; }
    .pg-kvblock { grid-template-columns: 1fr; }
    .pg-drawer { width: 100%; }
    .pg-reason { max-width: 180px; }
    .pg-table th, .pg-table td { padding: 6px 7px; }
    .pg-stage-head { position: sticky; top: 0; z-index: 5; }
}
@media (max-width: 480px) {
    .pg-form input, .pg-form select, .pg-filters input, .pg-filters select { font-size: 16px; } /* 防 iOS 聚焦缩放 */
    .pg-card { min-width: 148px; }
}

/* ================================================================
 * 资料表（leads/）—— 收集到的资料落成的这张表
 * 对标飞书多维表格的那几样：列头 ⓘ 说明 / 单选色块 / 就地编辑 / 分组 /
 *   计算列（进度条、新鲜度、查重）/ 多视图 / 筛选 / 导出 / AI 助手。
 * 只用现有 CSS 变量（--card / --border / --accent / --muted / --muted-foreground），
 *   不写死色值 —— 第 30 轮刚收敛完全站颜色，这里跟着变量走。
 * ================================================================ */
.pg-leads { display: flex; flex-direction: column; gap: 10px; }
.pg-dim { color: var(--muted-foreground); }
.pg-spacer { flex: 1; }

/* 卡片墙上那条"看成果"的入口 —— 和四张卡同构，虚线描边一眼看出它不是一张卡 */
.pg-card-leads { border-style: dashed; }
.pg-card-leads:hover { border-style: solid; }
.pg-card-badge.ok { color: #1f6b3f; }

/* ---------------- 统计条 ---------------- */
.pg-gstats {
    display: flex; flex-wrap: wrap; gap: 14px; align-items: baseline;
    font-size: 13px; color: var(--muted-foreground);
    padding: 8px 12px; border: 1px solid var(--border); border-radius: 10px;
    background: var(--card, #fff);
}
.pg-gstats b { color: var(--foreground); font-size: 14px; }

/* ---------------- 工具条 ---------------- */
.pg-tb { display: flex; flex-direction: column; gap: 8px; }
.pg-tb-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pg-tb-filters { padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--card, #fff); }
.pg-input {
    border: 1px solid var(--border); border-radius: 8px; padding: 6px 9px;
    font: inherit; font-size: 13px; background: var(--card, #fff); color: var(--foreground);
}
.pg-input:focus { outline: none; border-color: var(--accent); }
.pg-tb-q { flex: 1; min-width: 180px; }
.pg-tb-sel { max-width: 170px; }
.pg-seg { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.pg-seg button {
    border: 0; background: var(--card, #fff); color: var(--foreground);
    padding: 6px 14px; cursor: pointer; font: inherit; font-size: 13px;
}
.pg-seg button.on { background: var(--accent); color: #fff; }
.pg-btn-ghost { background: transparent; }

/* ---------------- 列设置面板 ---------------- */
.pg-colpanel { padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--card, #fff); }
.pg-colgroup { margin-bottom: 8px; }
.pg-colgroup b { font-size: 12.5px; color: var(--muted-foreground); }
.pg-collist { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 4px; }
.pg-collab { display: inline-flex; align-items: center; gap: 5px; font-size: 13px; cursor: pointer; }

/* ---------------- 表格本体 ---------------- */
.pg-gridbox { min-height: 120px; }
.pg-g-wrap { overflow: auto; max-height: 62vh; border: 1px solid var(--border); border-radius: 10px; background: var(--card, #fff); }
.pg-grid {
    border-collapse: separate; border-spacing: 0; font-size: 13px;
    /* 固定列宽（配合 <colgroup>）：列宽可预测、长文本按固定宽截断。
       width: max-content 让"总宽 = 各列之和"，超出容器时由 .pg-g-wrap 横向滚动，
       而不是把列挤扁（挤扁会把公司名截成两个字，等于没显示）。 */
    table-layout: fixed; width: max-content; min-width: 100%;
}
.pg-grid th, .pg-grid td {
    padding: 7px 9px; text-align: left; border-bottom: 1px solid var(--border);
    vertical-align: top; white-space: nowrap; max-width: 320px; overflow: hidden; text-overflow: ellipsis;
}
.pg-grid thead th { position: sticky; top: 0; z-index: 2; background: var(--muted, #f6f6f6); font-weight: 600; font-size: 12.5px; }
.pg-g-thl { display: inline-flex; align-items: center; gap: 4px; }
.pg-g-info { color: var(--muted-foreground); cursor: help; font-style: normal; font-size: 11px; }
.pg-g-info:hover { color: var(--accent); }
.pg-g-check { width: 30px; text-align: center; }
.pg-g-act { position: sticky; right: 0; background: var(--card, #fff); display: flex; gap: 4px; }
.pg-grid tbody tr:hover td { background: rgba(0, 0, 0, .022); }
.pg-g-group td { background: var(--muted, #f6f6f6); font-weight: 600; font-size: 12.5px; }
.pg-editable { cursor: text; }
.pg-editable:hover { box-shadow: inset 0 0 0 1px var(--accent); }
.pg-cell-edit {
    width: 100%; min-width: 90px; border: 1px solid var(--accent); border-radius: 6px;
    padding: 2px 5px; font: inherit; font-size: 13px; background: var(--card, #fff); color: var(--foreground);
}
.pg-cell-hint { font-size: 11px; color: var(--muted-foreground); margin-left: 4px; }
.pg-g-link { color: var(--accent); text-decoration: none; }
.pg-g-link:hover { text-decoration: underline; }
.pg-g-long { white-space: normal; color: var(--muted-foreground); }
.pg-g-wide { max-width: 300px; }

/* ---------------- 徽标 / 标签 / 计算列 ---------------- */
.pg-v-yes { background: #e4f3e8; color: #1f6b3f; }
.pg-v-maybe { background: #fdf3d8; color: #8a6100; }
.pg-v-no { background: #f3e6e4; color: #9c3226; }
.pg-v-none { background: var(--muted, #f1f1f1); color: var(--muted-foreground); }
.pg-tier { background: #e6edf9; color: #2b4d8f; }
.pg-locked { background: var(--muted, #f1f1f1); color: var(--muted-foreground); }
.pg-dupe { background: #fdeee0; color: #93551a; cursor: help; }
.pg-tag {
    display: inline-block; margin: 0 3px 3px 0; padding: 1px 7px; border-radius: 6px;
    background: var(--muted, #f1f1f1); color: var(--muted-foreground); font-size: 12px;
}
.pg-fill { display: inline-flex; align-items: center; gap: 6px; min-width: 84px; }
.pg-fill i { display: block; height: 6px; border-radius: 3px; background: var(--accent); }
.pg-fill b { font-size: 11.5px; font-weight: 500; color: var(--muted-foreground); }
.pg-fill.pg-ok i { background: #3f9c62; }
.pg-fill.pg-warn i { background: #d9a12b; }
.pg-fill.pg-bad i { background: #c0645a; }
.pg-fresh { font-size: 12px; }
.pg-f-fresh { color: var(--muted-foreground); }
.pg-f-due { color: #8a6100; }
.pg-f-stale { color: #9c3226; }
.pg-f-none { color: var(--muted-foreground); font-style: italic; }

/* ---------------- 看板视图 ---------------- */
.pg-board { display: grid; grid-template-columns: repeat(4, minmax(200px, 1fr)); gap: 10px; }
.pg-kcol { border: 1px solid var(--border); border-radius: 10px; background: var(--muted, #fafafa); padding: 8px; }
.pg-kcol-head { display: flex; justify-content: space-between; align-items: center; }
.pg-kcol-hint { font-size: 11.5px; margin: 4px 0 8px; }
.pg-kcol-body { display: flex; flex-direction: column; gap: 8px; }
.pg-kcard { background: var(--card, #fff); border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; cursor: pointer; }
.pg-kcard:hover { border-color: var(--accent); }
.pg-kcard-top { display: flex; justify-content: space-between; gap: 6px; align-items: center; }
.pg-kcard-top b { font-size: 13.5px; }
.pg-kcard-sub { font-size: 12px; color: var(--muted-foreground); margin-top: 2px; }
.pg-kcard-row { display: flex; gap: 8px; align-items: center; font-size: 12px; margin-top: 6px; }
.pg-kcard-score { font-weight: 600; }
.pg-kcard-c { color: #1f6b3f; font-size: 11.5px; }
.pg-kcard-foot { display: flex; gap: 6px; align-items: center; margin-top: 6px; }
.pg-kcard-why {
    margin-top: 6px; font-size: 12px; color: var(--muted-foreground);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------------- 页脚（翻页 / 批量） ---------------- */
.pg-tfoot {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    padding: 6px 2px; font-size: 12.5px; color: var(--muted-foreground);
}

/* ---------------- 详情抽屉 / 表单 ---------------- */
.pg-detail { display: flex; flex-direction: column; gap: 6px; }
/* 抽屉开着时冻结背景页面（用户：「浏览详情的时候，左边背景表格还能拖动，应该冻结」）
   两层保险：overflow:hidden 挡用户滚 + body 固定定位挡程序化滚动（见 ui.js 的 lockScroll） */
html.pg-locked, body.pg-locked { overflow: hidden; }
body.pg-locked {
    position: fixed; left: 0; right: 0; width: 100%;
    top: calc(-1 * var(--pg-lock-y, 0px));
}
/* 详情里分段更醒目（① 概览 / ② AI 调查 / ③ 怎么开口 / ④ 来源 / ⑤ 全部资料） */
.pg-kv-sec { margin-top: 14px; font-size: 13px; }
.pg-kv-sec:first-child { margin-top: 0; }
/* AI 调查：一条口径一条结论 */
.pg-dim { padding: 6px 0; border-bottom: 1px dashed var(--border); }
.pg-dim-n { font-size: 12.5px; font-weight: 600; color: var(--foreground); margin-bottom: 3px; }
.pg-dim-v { font-size: 13px; line-height: 1.55; color: var(--muted-foreground); }
.pg-dim-risk .pg-dim-n { color: var(--accent-dark); }
/* 每条口径「查什么」（用户问的"背调内容是啥"——直接摊在这儿） */
.pg-dim-ask { font-size: 12px; color: var(--muted-foreground); opacity: .85; margin-bottom: 3px; }
/* 背调查到的原始资料（可点） */
.pg-src { margin: 4px 0 0; padding-left: 18px; font-size: 12.5px; }
.pg-src li { margin: 3px 0; line-height: 1.5; }
.pg-src a { color: var(--accent-dark); }
/* 「资料 1、3」这种来源编号 */
.pg-srcno { font-size: 11px; color: var(--accent-dark); white-space: nowrap; }
/* 第一句话：整段可点选（方便复制去发） */
.pg-first { margin-top: 8px; }
.pg-first-t { font-size: 12px; color: var(--muted-foreground); margin-bottom: 3px; }
.pg-first-b {
    font-size: 13px; line-height: 1.6; padding: 8px 10px; cursor: text;
    background: var(--accent-soft); border-radius: 8px; user-select: all;
}
.pg-form { display: flex; flex-direction: column; gap: 10px; }
.pg-lab { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
/* 详情抽屉最下面的「跑背调 / 转 CRM」常驻可见 —— 36 个字段摊开后按钮会被滚到看不见，
   而这两个按钮正是"看完资料接着干活"的出口（用户要的是能判定、能动手）。 */
.pg-drawer-body .pg-act {
    position: sticky; bottom: -14px; margin: 10px -14px -14px; padding: 10px 14px;
    background: var(--card); border-top: 1px solid var(--border); flex-wrap: wrap;
}
.pg-act { display: flex; gap: 8px; align-items: center; margin-top: 4px; }

/* ---------------- AI 助手 ---------------- */
.pg-aibox { display: block; }
.pg-ai-bar {
    display: flex; gap: 8px; align-items: center; padding: 8px 10px;
    border: 1px solid var(--border); border-left: 3px solid var(--accent);
    border-radius: 10px; background: var(--card, #fff);
}
.pg-ai-ico { font-size: 15px; }
.pg-ai-input {
    flex: 1; min-width: 160px; border: 0; background: transparent;
    font: inherit; font-size: 13px; color: var(--foreground);
}
.pg-ai-input:focus { outline: none; }
.pg-ai-out { margin-top: 8px; }
.pg-ai-card {
    border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px;
    background: var(--card, #fff); font-size: 13px;
}
.pg-ai-line b { color: var(--accent); }
.pg-ai-why { font-size: 12.5px; margin-top: 4px; }
.pg-ai-act { display: flex; gap: 10px; align-items: center; margin-top: 8px; }
.pg-ai-cost { font-size: 12px; }
.pg-ai-head { font-weight: 600; font-size: 13.5px; }
.pg-ai-list { margin: 6px 0 0 18px; padding: 0; }
.pg-ai-next { margin-top: 8px; }
.pg-ai-next ol { margin: 4px 0 0 18px; padding: 0; }
.pg-ai-foot { font-size: 12px; margin-top: 8px; }

/* ---------------- 手机端 ---------------- */
@media (max-width: 720px) {
    .pg-board { grid-template-columns: 1fr; }
    .pg-tb-q { min-width: 120px; }
    .pg-tb-sel { max-width: 100%; }
    .pg-g-wrap { max-height: none; }
    .pg-g-act { position: static; }
    .pg-gstats { gap: 10px; font-size: 12px; }
    .pg-ai-bar { flex-wrap: wrap; }
    .pg-ai-input { flex: 1 0 100%; }
}

/* 行内的危险操作（删）——和普通小按钮区分开，防误点 */
.pg-mini-danger { color: #9c3226; border-color: #e3b7b1; }
.pg-mini-danger:hover { color: #fff; background: #9c3226; border-color: #9c3226; }

/* 空泳道的说明 —— 空白格子会让用户以为"坏了"，给一句话 */
.pg-kcol-empty { padding: 10px 4px; font-size: 12px; text-align: center; }

/* ---------- 这一页要比别的工具页宽 ----------
   工具页的壳 .tp-wrap 限宽 980px（是给"说明型"页面定的），减去卡片墙 260px 后
   实际只剩约 620px —— 一张 10 列的资料表在这个宽度里首屏只看得到前 6 列，
   用户得横拖才知道"联系谁、值不值得跟"。
   用 :has() 把放宽**锁死在含本工具页面的那一页**上，别的工具页一点不受影响。 */
@media (min-width: 1100px) {
    .tp-wrap:has(.pg-wrap) { max-width: 1600px; }
    .tp-wrap:has(.pg-wrap) .pg-wrap { grid-template-columns: 232px minmax(0, 1fr); gap: 14px; }
    /* 壳放宽是**给表格的**；说明正文仍旧箍在 980px ——
       一行 1500px 的字读起来很累，而且他本来就是来用表的，不是来读说明的 */
    .tp-wrap:has(.pg-wrap) .tp-h1,
    .tp-wrap:has(.pg-wrap) .tp-lead,
    .tp-wrap:has(.pg-wrap) .tp-doc,
    .tp-wrap:has(.pg-wrap) .tp-links { max-width: 980px; }
}


/* ---------------- 待办队列（一进来先看见「今天该干嘛」） ---------------- */
.pg-queue { margin-bottom: 10px; }
.pg-q-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.pg-qchip {
    display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 999px;
    border: 1px solid var(--border); background: var(--card, #fff); color: var(--foreground);
    font-size: 13px; cursor: pointer; font-family: inherit;
}
.pg-qchip b { font-weight: 600; }
.pg-qchip i {
    font-style: normal; font-size: 12px; color: var(--muted-foreground);
    background: var(--muted, #f2f2f2); border-radius: 999px; padding: 0 7px;
}
.pg-qchip:hover { border-color: var(--accent); }
.pg-qchip.on { border-color: var(--accent); background: var(--accent); color: #fff; }
.pg-qchip.on i { background: rgba(255, 255, 255, .25); color: #fff; }
.pg-qchip-0 { opacity: .5; }
.pg-q-hint { font-size: 12px; color: var(--muted-foreground); margin-left: 4px; }

/* ---------------- 侧栏两段（干活 / 设置） ---------------- */
.pg-sec { display: flex; align-items: baseline; gap: 6px; margin: 10px 4px 6px; }
.pg-sec-t { font-size: 12px; font-weight: 700; letter-spacing: .5px; color: var(--muted-foreground); }
.pg-sec-tip { font-size: 11px; color: var(--muted-foreground); }

/* ---------------- 冻结列（照 CRM 的做法：横拖时左边两列不动） ---------------- */
/* 注意：绝对定位的抓手能待在 sticky 的 th 里（sticky 本身就是定位元素），
   但 th 有 overflow:hidden，所以抓手必须放在格里（right:0），不能写 -3px 伸出去。 */
.pg-grid th.pg-g-fz, .pg-grid td.pg-g-fz {
    position: sticky; z-index: 1; background: var(--card, #fff);
}
.pg-grid thead th.pg-g-fz { z-index: 3; background: var(--muted, #f6f6f6); }
.pg-grid td.pg-g-fz-end, .pg-grid th.pg-g-fz-end { box-shadow: 2px 0 5px -2px rgba(0, 0, 0, .18); }
.pg-grid tbody tr:hover td.pg-g-fz { background: #f8f8f8; }
.pg-g-check.pg-g-fz { text-align: center; }

/* ---------------- 列宽抓手 + 分组折叠 ---------------- */
/* 列宽抓手：样子（宽度/hover 反馈/touch-action）统一在 colresize.css —— 两条线共用一份。
   这里只说它贴在哪一边：本表 th 有 overflow:hidden，所以抓手必须留在格子里（right:0），
   不能像 crm 那样伸到格子外面去。 */
.pg-g-res { right: 0; }
.pg-g-caret { display: inline-block; width: 14px; color: var(--muted-foreground); }
.pg-g-group { cursor: pointer; }
.pg-g-group:hover td { background: #eef0f2; }

/* ---------------- 进度列（这条线最重要的一列） ---------------- */
.pg-prog {
    display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 999px;
    font-size: 12px; white-space: nowrap; border: 1px solid transparent;
}
.pg-prog i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.pg-prog-todo_research { background: #f1f3f5; color: #495057; }
.pg-prog-todo_score { background: #fff4e0; color: #a06200; }
.pg-prog-ready { background: #e6f4ea; color: #1f6b3f; }
.pg-prog-stuck { background: #fdeaea; color: #a52121; }
.pg-prog-in_crm { background: #e8eefc; color: #2b4d9b; }


/* ---------------- 「这一步做什么 + 当前条件」说白条（设置区通用件） ---------------- */
.pg-logic {
    border: 1px solid var(--border); border-left: 3px solid var(--accent);
    border-radius: 10px; background: var(--muted, #fafafa); padding: 10px 12px; margin: 0 0 12px;
}
.pg-logic-h { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: 13px; }
.pg-logic-step {
    display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px;
    border-radius: 50%; background: var(--accent); color: #fff; font-size: 12px; font-weight: 700;
}
.pg-logic-h b { font-weight: 600; }
.pg-logic-what { font-size: 12.5px; color: var(--muted-foreground); }
.pg-logic-lines { list-style: none; margin: 8px 0 0; padding: 0; }
.pg-logic-lines li {
    display: flex; align-items: baseline; gap: 8px; padding: 3px 0; font-size: 12.5px;
    border-top: 1px dashed var(--border);
}
.pg-logic-k { flex: 0 0 96px; color: var(--muted-foreground); }
.pg-logic-v { flex: 1 1 auto; font-weight: 600; word-break: break-all; }
.pg-logic-t { flex: 0 0 auto; color: var(--muted-foreground); font-size: 11.5px; }
.pg-logic-foot { margin-top: 7px; font-size: 12px; color: var(--muted-foreground); }
@media (max-width: 720px) {
    .pg-logic-lines li { flex-wrap: wrap; }
    .pg-logic-k { flex: 0 0 auto; }
    .pg-logic-t { flex: 1 1 100%; }
}

.pg-prog-dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; display: inline-block; }
.pg-prog-step { font-style: normal; font-size: 11px; opacity: .7; }
.pg-prog-done { font-weight: 600; }

/* ---------- 自我剖析 · 当前角色条 + 换角色（第33轮：画像合并到用户中心） ----------
   为什么要有这条：画像现在只有一份（用户中心的「我的角色」），
   所以卡片上必须一眼看出"这次按哪个角色干活"，否则用户会以为自己改的是别的角色的画像。 */
.pg-rolebar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0 4px;
  padding: 8px 12px; border: 1px solid var(--border); border-left: 3px solid var(--accent);
  border-radius: 8px; background: var(--card); font-size: 13px; }
.pg-rolebar b { font-size: 14px; }
.pg-rolebar .pg-btn { padding: 3px 10px; font-size: 12px; }
.pg-rolebar-warn { color: #b45309; }
.pg-role-tag { font-size: 11px; color: var(--muted); border: 1px solid var(--border);
  border-radius: 999px; padding: 1px 8px; }
.pg-role-cur { font-size: 11px; color: #fff; background: var(--accent); border-radius: 999px; padding: 1px 8px; }
.pg-roleswap { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
  border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; margin-bottom: 8px; }
.pg-roleswap.on { border-color: var(--accent); }
.pg-roleswap .pg-btn { flex-shrink: 0; }
/* 动作按钮沉底后的分隔：让"剖析 → 保存 → 配采集"的顺序看得出来 */
.pg-tools-foot { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border); }

/* ------------------------------------------------------------------ 去重三档（第33轮）
   卡片头一行：勾选 + 判定徽章 + 标题；理由单独一行；「系统自动处理」单列一栏。
   配色沿用全站 token（--muted-foreground / --border），不新造颜色。 */
.pg-merge-hd { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 4px; }
.pg-merge-hd .pg-merge-t { margin: 0; }
.pg-pick { display: inline-flex; align-items: center; gap: 4px; font-size: 12px;
           color: var(--muted-foreground); flex: 0 0 auto; cursor: pointer; }
.pg-vd { flex: 0 0 auto; font-size: 11.5px; line-height: 1.6; padding: 1px 7px;
         border-radius: 999px; border: 1px solid var(--border); color: var(--muted-foreground); }
.pg-vd-same { color: var(--foreground); font-weight: 600; }
.pg-vd-ask { font-weight: 600; }
.pg-why { margin: 2px 0 4px; }
.pg-bulk { display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
           padding: 8px 10px; margin: 4px 0 10px; border: 1px solid var(--border); border-radius: 8px; }
.pg-auto-row { border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; margin: 6px 0; }
.pg-auto-t { font-size: 13px; font-weight: 600; }
.pg-auto-foot { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.pg-btn-sm { font-size: 12px; padding: 3px 9px; }

/* ------------------------------------------------ 采集计划：国家 → 城市（第33轮）
   用户要的是"以国家/地区做分组计划"：一个国家一块，块里横排它的城市芯片。
   配色沿用全站 token，不新造颜色。 */
.pg-nats { display: flex; flex-direction: column; gap: 8px; margin: 6px 0; }
.pg-nat { border-left: 2px solid var(--border); padding-left: 8px; }
.pg-nat-h { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.pg-cityrow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.pg-city { font-size: 12.5px; line-height: 1.7; padding: 1px 8px; border-radius: 999px;
           border: 1px solid var(--border); color: var(--muted-foreground); white-space: nowrap; }
.pg-city.next { color: var(--foreground); font-weight: 600; }
.pg-city.done { color: var(--muted-foreground); text-decoration: line-through; }
.pg-plan-hint { border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; margin: 8px 0; }
.pg-plan-hint-t { font-size: 13px; margin-bottom: 6px; }
.pg-plan-hint-f { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pg-plan-hint-f .pg-in { flex: 1 1 200px; min-width: 160px; }

.pg-plan-hint-f .pg-in, .pg-plan-hint-f .pg-btn { min-height: 34px; }   /* 输入框和按钮一样高，别一高一低 */
.pg-plan-hint-f .pg-btn { white-space: nowrap; }

/* ------------------------------------------------ 深扒口径（第33轮 · 卡③）
   口径 = 用户能看、能改的"查什么"清单：每条一小块，问题逐条列。
   ⚠️ 类名统一带 rd- 前缀 —— 本来想叫 .pg-dim，但那是全站通用小字类，撞了名会把标题也变灰。 */
.pg-rlist { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.pg-rdim { border-left: 2px solid var(--border); padding-left: 9px; }
.pg-rdim-h { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.pg-rdim-asks { list-style: none; margin: 4px 0 0; padding: 0; }
.pg-rdim-asks li { font-size: 12.5px; color: var(--muted-foreground); padding: 1px 0 1px 12px;
                   position: relative; line-height: 1.65; }
.pg-rdim-asks li::before { content: "\00b7"; position: absolute; left: 3px; }
.pg-rbasis { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 4px 0 2px; }
.pg-rchip { font-size: 12px; padding: 1px 8px; border-radius: 999px; border: 1px solid var(--border);
            color: var(--muted-foreground); }
.pg-redit { display: flex; flex-direction: column; gap: 12px; }
.pg-rbox { border: 1px solid var(--border); border-radius: 8px; padding: 8px 10px; }
.pg-rbox label { display: block; margin-bottom: 6px; font-size: 12.5px; color: var(--muted-foreground); }
.pg-rbox input, .pg-rbox textarea { width: 100%; }

/* ------------------------------------------------ 判定口径（第33轮 · 卡④）
   这一页只讲「尺子」：门槛数字 + 三档规矩 + AI 判定怎么用。数字全部来自后端 /score/spec。 */
.pg-stats { display: flex; flex-wrap: wrap; gap: 14px; padding: 8px 0; color: var(--muted-foreground); }
.pg-stats b { color: var(--foreground); }
.pg-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.pg-spec-tb { width: 100%; border-collapse: collapse; font-size: 12px; margin: 6px 0; }
.pg-spec-tb th, .pg-spec-tb td { border-bottom: 1px solid var(--border); padding: 5px 6px; text-align: left; }
.pg-spec-tb th { color: var(--muted-foreground); font-weight: 500; }
.pg-spec-tb td:first-child { white-space: nowrap; width: 88px; }
.pg-spec-tb td:nth-child(3) { white-space: nowrap; color: var(--muted-foreground); }
/* 口径里一条条问题之间留点缝（不然一片糊在一起，扫不动） */
.pg-rdim-asks > div + div { margin-top: 4px; }
.pg-rdim-asks .pg-note { margin-top: 4px; }

/* ---------------- 卡① 自我剖析的表单（2026-09-28 用户要求：调输入框宽度 + 美化） ----------------
   以前：字段排成一列，输入框被 `.pg-field > input { max-width: 420px }` 卡在 420px，
   右边留一大片空白，看着像没做完（用户原话「输入框的宽度，做一下调整，做个美化」）。
   现在：短字段两列排、多行字段占整行；框高统一 38px，聚焦时用强调色描边（颜色只用 tokens 变量）。 */
.pg-form-self { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin: 10px 0 4px; }
.pg-form-self .pg-field { margin-bottom: 0; }
.pg-form-self .pg-field-wide { grid-column: 1 / -1; }
.pg-form-self .pg-field > input, .pg-form-self .pg-field > textarea { max-width: none; width: 100%; }
.pg-form-self input[type="text"], .pg-form-self input[type="search"], .pg-form-self textarea {
    height: 38px; padding: 8px 11px; font-size: 13.5px; line-height: 1.4; border-radius: 9px;
    transition: border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
.pg-form-self textarea { height: auto; min-height: 76px; resize: vertical; }
.pg-form-self input[type="text"]:hover, .pg-form-self textarea:hover { background: var(--accent-soft); }
.pg-form-self input[type="text"]:focus, .pg-form-self input[type="search"]:focus, .pg-form-self textarea:focus {
    outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft);
}
.pg-form-self .pg-label { font-weight: 600; color: var(--foreground); opacity: .78; }
@media (max-width: 760px) {
    /* 手机上排两列会把字挤断 → 一列到底 */
    .pg-form-self { grid-template-columns: 1fr; }
}