/* ============================================================
   产品列表 · 一行式「档案行」（v1.1.52 / 列序 v1.1.60）
   编号 | 小图 | 名称(中/英) | 规格+货号N个 | 来源 | 价格 | 询价/详情
   与源站素表格区分：等宽货号徽章、悬停行首主色竖条、行分隔浅灰线。
   仅 product/list.php 加载（ProductController::listData 挂 head_extra）。
   ============================================================ */

.pro-rows { display: flex; flex-direction: column; }

/* 列头（与行 grid 对齐：编号88 图64 名称1fr(保底180) 规格(按内容) 来源100 价格84 动作140）
   v1.1.60：「来源」列挪到「价格」左边（用户指定红框位置），列宽随之对调
   v1.1.61：修「名称被压成几个字 + 规格列大片空白」——
   旧写法 规格 minmax(110px,210px) + 名称 minmax(0,1fr) 时，CSS Grid 会先把
   非弹性列撑到上限（规格列拿到 210px，其中 ~120px 是纯空白），名称列只能捡
   剩下的（窄窗口下只剩 ~46px，名称被截成「dUTP …」）。
   现在：规格列按内容自适应（不预留空白），名称列 180px 保底 + 占满剩余空间。 */
.pr-head,
.pr-row {
  display: grid;
  grid-template-columns: 88px 64px minmax(180px, 1fr) minmax(110px, max-content) 100px 84px 140px;
  gap: 14px;
  align-items: center;
}
.pr-head {
  padding: 9px 16px;
  font-size: 12.5px;
  color: #8a99a8;
  border-bottom: 1px solid #e3e9ef;
  background: #f7fafc;
  border-radius: 10px 10px 0 0;
}
.pr-head span:last-child { text-align: right; }

/* ---------- 行 ---------- */
.pr-row {
  position: relative;
  padding: 12px 16px;
  border-bottom: 1px solid #eef3f7;
  background: #fff;
  transition: background .15s;
}
.pr-row::before {
  content: '';
  position: absolute;
  left: 0; top: 18%;
  width: 3px; height: 64%;
  background: #0f88c4;
  border-radius: 0 3px 3px 0;
  opacity: 0;
  transition: opacity .15s;
}
.pr-row:hover { background: #f7fbfe; }
.pr-row:hover::before { opacity: 1; }

/* 编号：等宽徽章 */
.pr-no {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 13.5px;
  font-weight: 600;
  color: #0f6f9e;
  background: #eff7fc;
  border: 1px solid #d8ecf7;
  border-radius: 6px;
  padding: 4px 8px;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pr-no:hover { background: #0f88c4; border-color: #0f88c4; color: #fff; }
.pr-no.is-empty { color: #b6c2cc; background: #f6f8fa; border-color: #eef2f5; }

/* 小图 */
.pr-pic {
  width: 64px; height: 64px;
  border: 1px solid #eef3f7;
  border-radius: 8px;
  overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  background: #fbfdfe;
  flex: none;
}
.pr-pic img { width: 100%; height: 100%; object-fit: contain; }
.pr-pic .ph { font-size: 11px; color: #c3ced7; }

/* 名称区（v1.1.58 两行 → v1.1.64 三行 → v1.1.65：PC 端一行）
   v1.1.65：PC 端整行「一行展示」——中文名与英文名并排在同一行，各自超长省略号，
   行高只由小图 64px 决定，列表更紧凑；名称列本身仍占满剩余宽度（留白用掉）。
   手机端（≤900px）在下面的媒体查询里恢复成「中文名一行 + 英文名第二行」。 */
.pr-main { min-width: 0; display: flex; align-items: center; gap: 10px; }
.pr-nm { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 0 1 auto; max-width: 64%; }
.pr-nm a {
  font-size: 14.5px;
  font-weight: 600;
  color: #123a52;
  text-decoration: none;
  line-height: 1.45;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.pr-nm a:hover { color: #0f88c4; }
.pr-nm .pr-hot, .pr-nm .pr-top {
  font-style: normal; font-size: 10.5px; font-weight: 700;
  padding: 1px 6px; border-radius: 4px; flex: none; letter-spacing: .5px;
}
.pr-nm .pr-hot { color: #d46b08; background: #fff3e0; border: 1px solid #ffd591; }
.pr-nm .pr-top { color: #0f88c4; background: #e8f6fd; border: 1px solid #bde4f8; }
.pr-en {
  display: block;
  margin-top: 0;
  font-size: 12px;
  color: #8a99a8;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  flex: 1 1 auto; min-width: 0;
}

/* 规格 + 货号N个 */
.pr-spec { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.pr-spec-t {
  font-size: 12.5px;
  color: #55708a;
  background: #f5f8fa;
  border: 1px dashed #dde7ee;
  border-radius: 6px;
  padding: 3px 9px;
  align-self: flex-start;
  max-width: 210px; /* v1.1.61：给规格 chip 一个硬上限（列宽跟内容走，防个别超长规格把列撑爆） */
  /* v1.1.81：超长规格改「最多两行 + 省略号」（原单行 nowrap 硬截，个别被源站
     塞了整段营销文案的规格把列撑爆、文字互相遮挡——用户点名 p-1271 这类）。
     两行足够读完真实规格（1000 mL / 500T 之类），营销文案折到第二行截掉。 */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: clip;
  line-height: 1.5;
}
.pr-cnt {
  font-size: 11.5px;
  font-weight: 600;
  color: #0a7d43;
  background: #ecf9f1;
  border: 1px solid #c6ecd6;
  border-radius: 999px;
  padding: 2px 9px;
  align-self: flex-start;
  white-space: nowrap;
  font-family: inherit;
  line-height: 1.7;
}
/* v1.1.58：可点开的「货号 N 个」开关 + 旋转小箭头 */
button.pr-cnt { cursor: pointer; transition: background .15s, border-color .15s; }
button.pr-cnt:hover { background: #0a7d43; border-color: #0a7d43; color: #fff; }
button.pr-cnt.is-open { background: #0a7d43; border-color: #0a7d43; color: #fff; }
.pr-cnt-arr {
  display: inline-block; width: 0; height: 0; margin-left: 5px; vertical-align: 2px;
  border-left: 4px solid transparent; border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  transition: transform .18s;
}
button.pr-cnt.is-open .pr-cnt-arr { transform: rotate(180deg); }

/* ---------- 展开面板：横跨整行（grid-column 1/-1），浅绿底承托货号胶囊 ---------- */
.pr-exp {
  grid-column: 1 / -1;
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 4px; padding: 10px 12px 11px;
  background: #f4fbf7;
  border: 1px solid #d9f0e3;
  border-radius: 8px;
}
.pr-exp[hidden] { display: none; }
.pr-exp-i {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 4px 11px; border-radius: 999px;
  background: #fff; border: 1px solid #cde9da;
  font-size: 12.5px; color: #14453b; text-decoration: none;
  transition: border-color .15s, color .15s, background .15s;
}
.pr-exp-i b {
  font-weight: 600; color: #0a6e3f;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing: .3px;
}
.pr-exp-i span { color: #62807a; }
.pr-exp-i:hover { border-color: #0a7d43; background: #ecf9f1; }
.pr-exp-more {
  display: inline-flex; align-items: center;
  padding: 4px 6px; font-size: 12.5px; color: #0a7d43; text-decoration: none;
}
.pr-exp-more:hover { text-decoration: underline; }

/* 价格 */
.pr-price { font-size: 13.5px; color: #123a52; font-weight: 600; text-align: center; }
/* v1.1.81：促销小标签（任一货号 目录价>促销价 时出现，「促」字红色小方块）。
   促销价可能会变，用户要求前端明确标出来。 */
.pr-price .pl-cu {
  display: inline-block; vertical-align: 1px;
  font-style: normal; font-size: 10.5px; font-weight: 700; line-height: 1;
  color: #fff; background: #e5484d; border-radius: 4px;
  padding: 2px 4px; margin-left: 3px;
}

/* 来源（v1.1.59）：翌圣产品 → 官网原链接；其它 → 占位符保持列对齐 */
.pr-src { font-size: 12px; text-align: center; white-space: nowrap; }
.pr-src a {
  color: #0f88c4; text-decoration: none;
  border-bottom: 1px dashed #9ccbe4; padding-bottom: 1px;
}
.pr-src a:hover { color: #0d76ac; border-bottom-color: #0d76ac; }
.pr-src span { color: #5f8399; }
.pr-src .pr-src-none { color: #c3ced8; }

/* v1.1.62：列表行不再显示「淘 / 其他」店铺徽章（用户要求），样式随之移除；
   店铺/来源统一由「来源」列承担。 */

/* 动作 */
.pr-act { display: flex; gap: 8px; justify-content: flex-end; }
/* v1.1.81：按钮双文案（手机端缩成单字「详」「询」）——默认显示全词 */
.pr-act .pl-half { display: none; }

/* ---------- 移动端 / 窄屏 ---------- */
/* v1.1.81 手机端列表重排（用户第四轮定稿样稿 shot-mobile4.png）：
   主打「名称 + 规格」两个主角，其它全部弱化——
   · 名称：中文最多两行、优先完整（大字，不再单行截半）
   · 规格：chip 加强（13px 实线边框），完整两行为限
   · 英文名：一行淡灰小字
   · 来源：淡灰小号（「来源：」前缀保留）
   · 价格：隐藏（现状如此）
   · 按钮：右侧一列两个 36px 小方钮 —— 蓝「询」+ 白「详」
     （模板里每个按钮带双文案 .pl-full「询价/详情」与 .pl-half「询/详」，
      PC 显示全词、手机端只显示单字） */
@media (max-width: 900px) {
  .pr-head { display: none; }
  .pr-row {
    /* 图列 76px（v1.1.63 口径），行按 pic|main|spec|src|act 五区排 */
    grid-template-columns: 76px minmax(0, 1fr) auto;
    grid-template-areas:
      "pic main act"
      "pic spec act"
      "pic src  act";
    row-gap: 7px;
    column-gap: 12px;
    align-items: start;
    padding: 12px 12px;
  }
  .pr-no { display: none; }
  .pr-pic { grid-area: pic; width: 76px; height: 76px; }

  /* ① 名称（主角一）：最多两行、优先完整 */
  .pr-main { grid-area: main; display: block; min-width: 0; }
  .pr-nm { max-width: none; display: block; }
  .pr-nm a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    font-size: 14.5px;
    line-height: 1.42;
  }
  .pr-nm .pr-hot, .pr-nm .pr-top { vertical-align: 2px; }
  /* ② 英文名（弱化）：一行淡灰小字 */
  .pr-en {
    margin-top: 2px; flex: none;
    font-size: 11.5px; color: #a5b3c0;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* ③ 规格（主角二）：chip 加强、完整两行为限 */
  .pr-spec { grid-area: spec; flex-direction: row; align-items: flex-start; flex-wrap: wrap; margin-top: 1px; }
  .pr-spec-t {
    font-size: 13px; line-height: 1.45; padding: 4px 10px;
    border: 1px solid #d5e2ec; background: #f2f7fb;
    max-width: 100%;
  }

  /* ④ 来源（弱化）：淡灰小号、去虚下划线 */
  .pr-src { grid-area: src; text-align: left; font-size: 11px; color: #9fb0bd; margin-top: 1px; white-space: normal; }
  .pr-src a { color: #9fb0bd; border-bottom: 0; padding-bottom: 0; }
  .pr-src::before { content: '来源：'; color: #b7c4cf; }

  /* 价格隐藏（现状口径不变） */
  .pr-price { display: none; }

  /* ⑤ 按钮：右侧一列 36px 小方钮（询=主色在前，详=白底） */
  .pr-act { grid-area: act; flex-direction: column; align-self: center; gap: 7px; align-items: stretch; }
  .pr-act a {
    width: 36px; height: 36px; padding: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; border-radius: 10px; letter-spacing: 0;
  }
  .pr-act .pl-full { display: none; }        /* 手机端只显示单字 */
  .pr-act .pl-half { display: inline; }
  .pr-act .pr-detail { background: #fff; }
}
@media (min-width: 901px) {
  /* 双文案的另一半：PC 显示全词、单字隐藏 */
  .pr-act .pl-half { display: none; }
}

/* v1.1.86 展开项里的规格价（大械明码标价，48T ￥1,200 直接可见） */
.pr-exp-i .pr-exp-p { font-style: normal; margin-left: auto; color: #d4380d; font-weight: 700; font-size: 12.5px; }

/* ============================================================
 * v1.1.151 稿 C「明亮骨架 + 深色筛选控制台」——产品列表皮肤
 * 前缀约定：pl-（布局/控制台/横幅）/ pg-（网格卡）——
 * 与既有 pr-（档案行）/ pro-（首页卡片）零冲突，三者可并存。
 * 设计稿：abiop_list_draft_C.html
 * ============================================================ */
:root{
  /* 12 品类色板（与首页 hm 体系同值）：色 / 深 / 浅 */
  --pl-c-1:#0f88c4; --pl-cd-1:#0a6c9e; --pl-cl-1:#e5f4fc;  /* 细胞培养 */
  --pl-c-2:#12b5a4; --pl-cd-2:#0d8a7d; --pl-cl-2:#e3f8f5;  /* 蛋白与免疫 */
  --pl-c-3:#5b8def; --pl-cd-3:#3c63c9; --pl-cl-3:#ecf1fe;  /* 生化代谢检测 */
  --pl-c-4:#f59e0b; --pl-cd-4:#c97f06; --pl-cl-4:#fdf3e3;  /* 分子生物学 */
  --pl-c-5:#1baa6b; --pl-cd-5:#128a53; --pl-cl-5:#e6f6ef;  /* 细胞状态分析 */
  --pl-c-6:#7c5cd6; --pl-cd-6:#5f43b0; --pl-cl-6:#f0ebfc;  /* 试剂盒与耗材 */
  --pl-c-7:#e5484d; --pl-cd-7:#c23338; --pl-cl-7:#fdecec;  /* 抗体与蛋白 */
  --pl-c-8:#0e9c8e; --pl-cd-8:#0a7a6f; --pl-cl-8:#e4f6f4;  /* 检测试剂盒 */
  /* 深色控制台（稿 B 玻璃拟态 + 荧光色） */
  --dk-1:#0b2233; --dk-2:#0e2c42;
  --dk-glass:rgba(255,255,255,.055); --dk-glass-2:rgba(255,255,255,.09);
  --dk-line:rgba(255,255,255,.10); --dk-line-2:rgba(255,255,255,.16);
  --dk-tx-1:#e8f3fa; --dk-tx-2:#a8c2d4; --dk-tx-3:#6d8ca3;
  --neon-cy:#3ec6e0; --neon-mint:#3ee0b0; --neon-amber:#ffb84d;
  --neon-rose:#ff6b7a; --neon-violet:#9d8cf0; --neon-green:#4cd97b;
  --dk-sh:0 12px 32px rgba(11,47,69,.22);
}

/* ---------- 分类横幅（仅分类页，真实数据） ---------- */
.pl-banner{position:relative;overflow:hidden;border-radius:14px;margin-bottom:16px;color:#fff;
  background:linear-gradient(120deg,#0b2f45 0%,#0d3d59 55%,#0f5a80 100%)}
.pl-b-glow{position:absolute;right:-60px;top:-70px;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(18,181,164,.45),transparent 65%)}
.pl-b-glow2{position:absolute;right:180px;bottom:-120px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(245,158,11,.28),transparent 65%)}
.pl-b-in{position:relative;z-index:1;display:flex;align-items:center;gap:24px;padding:24px 28px}
.pl-b-pic{width:84px;height:84px;border-radius:18px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:38px;
  background:linear-gradient(135deg,var(--pl-c-1),var(--pl-c-2));box-shadow:0 8px 24px rgba(15,136,196,.4)}
.pl-b-tx{min-width:0}
.pl-b-tx h1{margin:0;font-size:24px;font-weight:800;letter-spacing:.5px;color:#fff}
.pl-b-tx h1 .en{font-size:12.5px;font-weight:400;color:rgba(255,255,255,.6);margin-left:10px;letter-spacing:1px}
.pl-b-tx p{margin:6px 0 0;font-size:13px;color:rgba(255,255,255,.78);max-width:640px}
.pl-b-stat{margin-left:auto;flex-shrink:0;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);
  border-radius:12px;padding:10px 18px;text-align:center}
.pl-b-stat b{display:block;font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.pl-b-stat span{font-size:12px;color:rgba(255,255,255,.7)}

/* ---------- 布局：左目录 + 中内容（外层 .layout 仍管右栏） ---------- */
.pl-cols{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px;align-items:start}
.pl-cat{position:sticky;top:14px}

/* 左：分类目录（彩色色标） */
.pl-cnode{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:9px;font-size:13.5px;
  color:#4a6377;text-decoration:none;transition:.15s;position:relative}
.pl-cnode:hover{background:#eef5fa;color:#1e3346}
.pl-cnode.on{background:#e5f4fc;color:#0a6c9e;font-weight:700}
.pl-cnode .sw{width:10px;height:10px;border-radius:3px;flex-shrink:0;background:var(--pc,#0f88c4)}
.pl-cnode .n{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-cnode .arrow{font-size:10px;color:#7d95a8}
.pl-cnode.sub{padding-left:25px;font-size:12.5px}
.pl-cnode.sub::before{content:"";position:absolute;left:15px;top:50%;width:6px;height:6px;border-radius:50%;
  border:2px solid var(--pc,#0f88c4);transform:translateY(-50%);background:#fff}
.pl-cnode.sub.on{background:var(--pc,#0f88c4);color:#fff}
.pl-cnode.sub.on::before{border-color:#fff;background:transparent}

/* ---------- ★ 深色筛选控制台 ---------- */
.pl-console{position:relative;overflow:hidden;border-radius:14px;margin-bottom:14px;
  background:linear-gradient(165deg,var(--dk-2) 0%,var(--dk-1) 72%);
  border:1px solid var(--dk-line-2);box-shadow:var(--dk-sh)}
.pl-cs-spec{height:4px;background:linear-gradient(90deg,var(--pl-c-1),var(--pl-c-2) 34%,var(--pl-c-4) 66%,var(--pl-c-7))}
.pl-cs-hd{display:flex;align-items:center;gap:8px;padding:13px 16px 0;font-size:12px;color:var(--dk-tx-3)}
.pl-cs-hd .dot{width:8px;height:8px;border-radius:50%;background:var(--neon-cy);box-shadow:0 0 8px var(--neon-cy);animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.pl-cs-hd b{color:var(--dk-tx-1);font-size:14.5px;font-weight:700;letter-spacing:.5px}
.pl-cs-hd .sum{margin-left:auto;font-size:12px}
.pl-cs-hd .sum i{font-style:normal;color:var(--neon-amber);font-weight:800;font-variant-numeric:tabular-nums}
.pl-cs-bd{padding:10px 16px 15px}
.pl-cs-form{display:flex;flex-direction:column;gap:10px}
.pl-cs-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pl-cs-row + .pl-cs-row{padding-top:10px;border-top:1px dashed var(--dk-line)}
.pl-cs-row .lbl{font-size:12px;color:var(--dk-tx-3);flex-shrink:0;letter-spacing:1px}

/* 深色搜索框 */
.pl-kwbox{display:flex;border:1px solid var(--dk-line-2);border-radius:999px;overflow:hidden;background:var(--dk-glass);
  flex:1;min-width:230px;max-width:430px;transition:.2s}
.pl-kwbox:focus-within{border-color:var(--neon-cy);box-shadow:0 0 0 3px rgba(62,198,224,.13)}
.pl-kwbox input{flex:1;min-width:0;border:0;outline:0;padding:7px 17px;font-size:13px;background:transparent;color:var(--dk-tx-1)}
.pl-kwbox input::placeholder{color:var(--dk-tx-3)}
.pl-kwbox button{border:0;padding:0 20px;font-size:13px;font-weight:800;cursor:pointer;white-space:nowrap;
  background:linear-gradient(135deg,var(--neon-cy),#1e9ec4);color:#04121c}
.pl-reset{font-size:12.5px;color:var(--dk-tx-3);text-decoration:none}
.pl-reset:hover{color:var(--neon-rose)}

/* 深色 select / 数字输入（原生下拉展开时系统渲染，深色化本体） */
.pl-sel{appearance:none;-webkit-appearance:none;border:1px solid var(--dk-line);border-radius:999px;
  background:var(--dk-glass) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='5'><path d='M0 0l4 5 4-5z' fill='%23a8c2d4'/></svg>") no-repeat right 12px center;
  color:var(--dk-tx-2);font-size:12.5px;padding:6px 30px 6px 14px;cursor:pointer;transition:.15s;max-width:190px}
.pl-sel:hover{border-color:var(--dk-line-2);color:var(--dk-tx-1)}
.pl-sel:focus{outline:0;border-color:var(--neon-cy)}
.pl-sel option{background:#0e2c42;color:#e8f3fa}
.pl-num{width:76px;padding:6px 12px;border-radius:999px;background-image:none}
.pl-num::placeholder{color:var(--dk-tx-3)}
.pl-dash{color:var(--dk-tx-3);font-size:12px}

/* 排序行（并入控制台） */
.pl-cs-sort{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--dk-line-2)}
.pl-cs-sort a{padding:6px 14px;border-radius:9px;font-size:12.5px;color:var(--dk-tx-2);text-decoration:none;
  background:var(--dk-glass);border:1px solid var(--dk-line);transition:.15s}
.pl-cs-sort a:hover{color:var(--dk-tx-1);border-color:var(--dk-line-2)}
.pl-cs-sort a.on{background:linear-gradient(135deg,rgba(62,198,224,.22),rgba(62,227,176,.15));
  border-color:rgba(62,198,224,.5);color:var(--neon-cy);font-weight:700}
.pl-cs-sort .sp{flex:1}
.pl-cs-sort .cnt{font-size:12.5px;color:var(--dk-tx-3)}
.pl-cs-sort .cnt b{color:var(--neon-amber);font-size:16px;font-weight:800;font-variant-numeric:tabular-nums;
  text-shadow:0 0 12px rgba(255,184,77,.4)}
.pl-viewsw{display:flex;border:1px solid var(--dk-line);border-radius:9px;overflow:hidden}
.pl-viewsw a{padding:6px 12px;font-size:12.5px;color:var(--dk-tx-3);text-decoration:none;background:var(--dk-glass);border:0;border-radius:0}
.pl-viewsw a.on{background:rgba(62,198,224,.14);color:var(--neon-cy);font-weight:700}

/* ---------- 网格卡（稿 C 默认视图） ---------- */
.pl-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pgrid{background:#fff;border:1px solid #dceaf3;border-radius:14px;overflow:hidden;position:relative;
  transition:.18s;display:flex;flex-direction:column}
.pgrid:hover{border-color:var(--pc);box-shadow:0 6px 20px rgba(16,63,89,.10);transform:translateY(-3px)}
.pgrid .specbar{height:4px;background:linear-gradient(90deg,var(--pcd),var(--pc))}
.pg-pic{position:relative;height:148px;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:linear-gradient(160deg,var(--pcl) 0%,#fff 78%);text-decoration:none}
.pg-pic::after{content:"";position:absolute;right:-30px;bottom:-40px;width:130px;height:130px;border-radius:50%;
  background:var(--pc);opacity:.07}
.pg-pic img{max-width:82%;max-height:82%;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(16,63,89,.18));
  transition:.25s;position:relative}
.pgrid:hover .pg-pic img{transform:scale(1.06) rotate(-3deg)}
.pg-pic .ph{font-size:12px;color:#b6c2cc}
.pg-tag{position:absolute;left:10px;top:10px;z-index:2;font-style:normal;font-size:11px;font-weight:700;
  letter-spacing:.3px;padding:2px 9px;border-radius:6px}
.pg-tag.hot{background:linear-gradient(135deg,#ff8a5c,#e5484d);color:#fff}
.pg-tag.rec{background:linear-gradient(135deg,#37d39b,#1baa6b);color:#fff}
.pg-tag.top{background:linear-gradient(135deg,#5b8def,#3c63c9);color:#fff}
.pg-tag.ship{left:auto;right:10px}
.pg-tag.ship.ok{background:#fff;color:#128a53;border:1px solid #bfe8d6}
.pg-tag.ship.wait{background:#fff;color:#c97f06;border:1px solid #f3ddb0}
.pg-bd{padding:12px 14px 14px;display:flex;flex-direction:column;flex:1;min-width:0}
.pg-cat{display:flex;align-items:center;gap:5px;font-size:11.5px;color:#7d95a8;margin-bottom:5px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-cat .sw{width:8px;height:8px;border-radius:2.5px;background:var(--pc);flex-shrink:0}
.pg-bd h3{margin:0;font-size:14.5px;font-weight:700;color:#0b2f45;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px}
.pg-bd h3 a{color:inherit;text-decoration:none}
.pgrid:hover .pg-bd h3 a{color:var(--pcd)}
.pg-en{font-size:11.5px;color:#7d95a8;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-meta{display:flex;align-items:center;gap:6px;margin-top:9px;flex-wrap:wrap}
.pg-no{font-size:11.5px;font-weight:700;color:var(--pcd);background:var(--pcl);border-radius:6px;padding:2px 8px;
  font-family:Consolas,Menlo,monospace}
.pg-brand{font-size:11.5px;color:#4a6377;border:1px solid #dceaf3;border-radius:6px;padding:2px 8px;text-decoration:none}
.pg-brand:hover{border-color:var(--pc);color:var(--pcd)}
.pg-cnt{font-size:11.5px;color:#7d95a8}
.pg-spec{font-size:11.5px;color:#7d95a8;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-foot{margin-top:auto;padding-top:10px;display:flex;align-items:flex-end;gap:8px}
.pg-price{color:#e5484d;font-weight:800;font-size:21px;font-variant-numeric:tabular-nums;line-height:1}
.pg-cu{font-style:normal;font-size:10.5px;font-weight:700;color:#fff;background:#e5484d;border-radius:4px;
  padding:1px 5px;margin-left:5px;vertical-align:3px;cursor:help}
.pg-man{font-size:15px;text-decoration:none;line-height:1}
.pg-ask{margin-left:auto;border:0;border-radius:8px;padding:7px 14px;font-size:12.5px;font-weight:700;color:#fff;
  text-decoration:none;cursor:pointer;background:linear-gradient(135deg,var(--pc),var(--pcd));transition:.15s}
.pg-ask:hover{filter:brightness(1.1);box-shadow:0 4px 12px rgba(16,63,89,.18)}

/* ---------- 移动端 / 窄屏 ---------- */
@media (max-width: 900px) {
  .pl-cols{grid-template-columns:minmax(0,1fr)}
  .pl-cat{display:none}                 /* 移动端分类走顶部导航，左目录不收 */
  .pl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .pl-b-in{flex-wrap:wrap;padding:18px 16px;gap:14px}
  .pl-b-stat{margin-left:0}
  .pl-cs-row .lbl{width:auto}
  .pl-sel{max-width:none;flex:1;min-width:120px}
  .pl-kwbox{max-width:none}
  .pl-cs-sort .cnt{width:100%;text-align:right}
  .pg-pic{height:120px}
  .pg-bd h3{min-height:0}
}