/* ============================================================
   书笙OS · 评论组件（comp/pinglun）
   规则说明（每次修改同步更新）：
   1. 设计系统：暖棕古风 × 玻璃拟态。主色 #B07D56，辅色 #C49A6C，深墨 #2C2420，纸白 #FCF9F3。
      严禁把绿/蓝紫/蓝灰用作主视觉色；身份徽章沿用全站 SS_user_identity_badge 既有配色。
   2. 命名：CSS 前缀 pl-，JS 全局对象 PL，localStorage 键前缀 ss_pl_。
   3. 结构：.pl-root 为根节点（按钮组 + 浮窗）。半透明浮窗**默认常驻左下角**（直播间样式），
      .pl-root.is-open 时可见；评论按钮专用于打开浮窗，面板打开时被隐藏、关闭后恢复（2026-09-03）；
      pos=right 时加 .is-right 换到右下角（备选）。
   4. 直播滚动屏样式（修复记录74/75）：气泡容器透明，文字用半透明毛玻璃胶囊包裹；
      头像在左，昵称行+内容胶囊纵向排列；自己的消息胶囊底色加深区分。
      长评论默认折叠（2行），点击「展开」后显示全部。
  11. 直播感样式调优（2026-08-30）：
      - 气泡更透明：--pl-cap 降至 .30、昵称行 .25、点赞胶囊 .25，只保文字可读不挡背景；
        UI 元素（hover/登录条）用独立的 --pl-cap-ui 保持可交互感。
      - 单条高度压缩：头像 20px、胶囊 padding 3px 9px / 字号 12 / 行高 1.45、
        昵称行 padding 0 6px / 字号 10、条间距 3px、折叠 2 行。
      - 互动卡点赞按钮靠右：.pl-msg-body 为纵向 flex，原 flex:1 只会纵向拉伸且
        .pl-msg-hd 是 width:fit-content 导致 margin-left:auto 推不到最右；
        改为 .pl-work-row .pl-msg-hd { width:100%; flex-wrap:nowrap }，昵称超长省略号。
      - 2026-08-31 回调：胶囊 .30 过透致深色页面上评论看不清、且与互动卡观感不一，
        先加实至 .62 又被反馈"完全挡住作品（作品才是主角）"；最终定案 .40 低透明底 +
        深字浅色光晕投影（text-shadow，同 .pl-me-nm/.pl-hd-tt 思路）保可读，
        暗模式同步 .40 暗底暗晕；.pl-list 底部 mask 淡出移除（末条评论被淡化看不清）。
  12. 深色页面底部可读性（2026-08-30 修复记录74，页面书外背景近黑）：
      输入框 .92 近实底+blur、.pl-login/.pl-fab 提升不透明度至 .78~.85 并加轻投影；
      .pl-empty 加白色 text-shadow。与 11 的"气泡透明"不矛盾——气泡（内容区）保持透明
      不挡背景，输入条与按钮（交互件）保可读。
  13. 交互细化（2026-08-31 修复记录75）：
      - 「查看更多评论」去胶囊底改纯文字按钮（白色 text-shadow 保深底可读），不遮挡背景；
      - 顶部互动行标题文字（.pl-hd-tt）与关闭点均可点击隐藏面板，空白处仍点击穿透；
      - 身份区 .pl-me 去掉纸白胶囊底（用户反馈多余），名字改白色投影保可读；
      - .pl-dock bottom 20→80（含移动端），给底部输入条让位；.pl-bar 右内边距 12→6 发送钮贴右。
  14. 输入条独立（2026-08-31 修复记录77）：.pl-bar/.pl-login 移出 .pl-panel 独立 fixed 定位
      （与面板同位 left/bottom），由 root 的 .is-bar-on 控制显隐——页面内容未触底时输入条
      常显（PL.setBarAlways(true)），面板打开时也显示，关闭评论仅收起上面的评论区；
      触底重叠时跟随面板显隐（原行为）。面板打开时 .pl-panel 加 padding-bottom:52px
      给输入条留位（box-sizing:border-box 防 is-full 高度溢出）；身份浮层 .pl-ids 改为
      相对 .pl-bar（fixed 容器）定位弹出；.pl-dock bottom 80 保持不变。
   5. 层级：按钮组与浮窗 200，身份浮层 210。
      在作品集页需高于底部导航 100，低于管理面板 300 / AI 弹窗 420 / 图片选择 460 / 加载遮罩 500。
   6. 断点：768px 起浮窗收窄（右侧留按钮位），480px 再收紧；不用全宽抽屉以不遮挡内容；打印时整块隐藏。
   7. 互动状态卡（修复记录73/75/76）：取代原作品详情卡，改为第一条评论气泡样式，
      评论人显示为当前作品所属机构的校长（setWork 时 xz 传入 name/img/org/uid，随作品切换）。
      内容优先使用作品详情(detail)而非标题(title)；点赞按钮靠最右侧、低高度。
   8. 学员姓名脱敏（修复记录76）：学员身份的姓名经 maskName 脱敏显示。
   9. 微信生态跳转（修复记录76/80）：点击头像/姓名可跳转用户展示页（.pl-msg-nm-link
      手型指针+下划线hover），点击互动状态卡的机构名跳机构详情页（.pl-idn-link 手型指针）。
  10. 样式调整（修复记录76）：爱心距昵称右远（margin-left:auto）；
      展开/收起按钮靠右对齐。
 15. 展开高度自适应（2026-08-31）：.is-full 不再强制 height:52vh/min-height，
      改 max-height 封顶——评论少时面板随内容堆叠收缩不留大片空白，
      评论多超限时 .pl-list 内部滚动。
  16. 气泡统一定稿（2026-08-31，两轮迭代）：
      - 宽度跟随内容：.pl-msg-body 为纵向 flex，子项默认 stretch 会把 .pl-cap 拉成满行宽，
        加 align-items:flex-start 后气泡（含展开按钮/失败标记）紧贴内容收缩，各端一致；
        长评论 .is-clamp 折叠态与 max-width:100% 换行不受影响。
      - 直播评论区同款终稿：气泡**完全无底色**（曾历 .40 毛玻璃→.30 低透明→transparent 三版，
        用户对照直播间截图定稿纯文字），可读性靠多层浅色光晕包住文字（暗模式浅字暗晕），
        完全不遮挡作品；自己的消息不再棕金底（--pl-cap-mine 仅保留给身份浮层当前项），
        靠昵称「我」角标区分；--pl-cap 变量已废弃删除。
      - PC/移动端气泡、头像布局完全同一套样式（组件无端别差异，断点仅调面板外框尺寸）。
  17. 统一渲染与全面去底色（2026-08-31 修复记录81）：
      - 互动状态卡与评论列表行统一结构：.pl-msg-hd 改通栏 flex（名字+徽章居左、点赞居右），
        状态卡不再单独一套 .pl-work-row/.pl-work-zan 特例样式；
      - 每条评论自带点赞钮 .pl-zan（无底色图标+数字，Zan type=pinglun）；
      - .pl-msg-hd 昵称行与 .pl-zan 全部透明背景（名字/计数用光晕投影保可读，暗模式换暗晕）；
      - .pl-fab 悬浮点赞/评论钮去背景去边框去投影，纯图标 24px + 双层 drop-shadow 兜底可见，
        is-on 仅变色，48px 热区保留；
      - .pl-list 顶部 mask 渐隐移除（首条评论被淡化，观感像层级问题）。
  18. 底纱+浅色文字定稿（2026-08-31 修复记录82）：
      - 文字光晕方案废弃（实测难看且移动端深色背景下深字仍看不清）；
      - .pl-panel 加深色渐变底纱 rgba(26,21,16,.30)→.60（上浅下深，整体渐变非逐条色块），
        面板内文字全部改浅色（正文 #F2EAD9 / 名字 #E8D8B8 / 辅助 #D8C7A8 等），
        仅正文保留极轻暗投影；浅色文字两套主题通用，暗色模式文字覆盖已删除；
      - 宿主页书页让位策略同步改为"评论打开时书页顶到顶栏下沿"（anthology.php plShift）。
  19. @作品 / @作品集 卡片（2026-09-01）：
      - 废弃 .pl-wktag（描边棕字小标签，面板顶部底纱仅 .30 近乎白底时看不见）；
      - 改 .pl-wk 纸白近实底卡（rgba(252,249,243,.95) + 棕描边 + 轻投影）+ 深墨字，
        深色底纱与白色页面上都清晰；作品预览图 26×34 纵向 cover 裁切，无图用「书」字占位；
      - 卡片在评论正文下方独立一行（.pl-msg-body 内），需单独开 pointer-events:auto。
   ============================================================ */

.pl-root {
  --pl-tan: #B07D56;
  --pl-tan-l: #C49A6C;
  --pl-tan-d: #96693E;
  --pl-ink: #2C2420;
  --pl-ink-2: #9B8E80;
  --pl-glass: rgba(252, 249, 243, .72);
  --pl-glass-strong: rgba(252, 249, 243, .90);
  --pl-line: rgba(176, 125, 86, .22);
  --pl-cap-ui: rgba(252, 249, 243, .48);     /* UI 元素（hover/登录条）用的较实底色 */
  --pl-cap-mine: rgba(196, 154, 108, .45);
  --pl-shadow: 0 8px 32px rgba(44, 36, 32, .14);
  --pl-shadow-lg: 0 16px 48px rgba(44, 36, 32, .20);
  position: fixed;
  z-index: 200;
  font-family: "PingFang SC", "Noto Serif SC", "Microsoft YaHei", sans-serif;
  color: var(--pl-ink);
}

/* ---------- 悬浮按钮组（紧贴浮窗右侧，评论钮仅作显隐开关） ---------- */
.pl-dock {
  position: fixed;
  left: 372px;
  bottom: 80px;   /* 上移给底部输入条让位（2026-08-31） */
  z-index: 200;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.pl-root.is-right .pl-dock { left: auto; right: 20px; }

/* 悬浮按钮（2026-08-31 修复记录81）：去背景去边框去投影，纯图标+浅色光晕兜底可见，
   48px 圆形热区保留保证可点面积；is-on（面板开）只变色不填充底 */
.pl-fab {
  position: relative;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--pl-tan-d);
  filter: drop-shadow(0 0 3px rgba(252, 249, 243, .6)) drop-shadow(0 1px 2px rgba(44, 36, 32, .22));
  transition: transform .25s, color .25s;
  -webkit-tap-highlight-color: transparent;
}
.pl-fab:hover { transform: translateY(-2px); }
.pl-fab:active { transform: translateY(0) scale(.94); }
.pl-fab svg { width: 24px; height: 24px; }
.pl-fab.is-on { color: var(--pl-tan); }
/* 面板打开时隐藏评论钮（2026-09-03）：浮窗已显示无需打开入口，关闭浮窗后按钮恢复显示；
   点赞钮(.pl-fab[data-pl=zan])不受影响始终显示 */
.pl-root.is-open .pl-fab[data-pl="msg"] { display: none; }
.pl-fab.is-zaned svg { fill: var(--pl-tan); }
.pl-fab.is-zaned { color: var(--pl-tan); }
.pl-fab.is-pop { animation: pl-pop .25s ease-out; }

@keyframes pl-pop {
  0% { transform: scale(1); }
  45% { transform: scale(1.22); }
  100% { transform: scale(1); }
}

.pl-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: linear-gradient(135deg, #B07D56, #96693E);
  color: #fff;
  font-size: 10px;
  line-height: 16px;
  text-align: center;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(150, 105, 62, .45);
  pointer-events: none;
}
.pl-badge.is-zero { display: none; }

/* ---------- 半透明浮窗（左下角常驻，直播间滚动评论效果） ----------
   2026-08-31 修复记录82：面板加深色渐变底纱（上浅下深 .30→.60），替代文字光晕方案——
   浅色评论文字在任意背景（深色书外/白色书页）上都清晰；底纱为整体渐变非逐条色块 */
.pl-panel {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 200;
  width: 340px;
  height: auto;
  max-height: 52vh;
  min-height: 0;
  border-radius: 16px;
  border: none;
  background: linear-gradient(180deg, rgba(26, 21, 16, .30) 0%, rgba(26, 21, 16, .45) 45%, rgba(26, 21, 16, .60) 100%);
  box-shadow: none;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;   /* 修复记录77：is-open 时加 padding-bottom 给独立输入条留位，防止 is-full 高度溢出 */
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px) scale(.97);
  transition: opacity .28s, transform .28s cubic-bezier(.22, 1, .36, 1), visibility .28s;
  pointer-events: none;
}
.pl-root.is-right .pl-panel { left: auto; right: 84px; }
.pl-root.is-open .pl-panel { opacity: 1; visibility: visible; transform: none; padding-bottom: 52px; }
/* is-full 展开高度自适应（2026-08-31）：不强制 height，评论少时面板随内容堆叠收缩，
   仅 max-height 封顶；评论多超限时 .pl-list 内部滚动 */
.pl-root.is-open .pl-panel.is-full { max-height: 52vh; }

/* 各交互元素恢复可点（输入条/登录条已移出面板独立 fixed，root 无 pointer-events 限制，天然可点） */
.pl-panel .pl-hd-x,
.pl-panel .pl-hd-tt,
.pl-panel .pl-work,
.pl-panel .pl-more,
.pl-panel .pl-cap,
.pl-panel .pl-msg-hd,
.pl-panel .pl-expand { pointer-events: auto; }
.pl-msg { pointer-events: none; }
.pl-msg .pl-cap,
.pl-msg .pl-msg-hd,
.pl-msg .pl-wk,
.pl-msg .pl-expand,
.pl-msg .pl-msg-flag.is-err { pointer-events: auto; }
.pl-list:empty { pointer-events: none; padding: 0; }

.pl-hd {
  flex: none;
  height: 30px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: transparent;
}
/* 顶部互动行标题文字可点击隐藏面板（修复记录75：箭头太小难点，文字/图标整行可点，空白处仍穿透）
   2026-08-31 修复记录82：面板加深色渐变底纱，面板内文字全部改浅色（详见 .pl-panel 处说明） */
.pl-hd-tt { font-size: 11px; font-weight: 500; color: rgba(242, 234, 217, .78); pointer-events: auto; cursor: pointer; }
.pl-hd-x {
  width: 24px;
  height: 24px;
  border: none;
  background: transparent;
  color: rgba(242, 234, 217, .7);
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
  border-radius: 8px;
  font-family: inherit;
}
.pl-hd-x:hover { background: rgba(242, 234, 217, .14); color: #fff; }

/* ---------- 互动状态卡 ---------- */
.pl-work {
  flex: none;
  margin: 0 12px 6px;
}

/* ---------- 查看更多评论（懒加载入口；纯文字按钮） ---------- */
.pl-more {
  flex: none;
  margin: 2px 12px 4px;
  padding: 4px;
  border: none;
  background: transparent;
  color: #D8C7A8;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
  font-family: inherit;
  transition: opacity .24s;
}
.pl-more:hover { text-decoration: underline; }
.pl-more.is-hide { display: none; }
.pl-empty { padding: 14px 12px; text-align: center; font-size: 12px; color: rgba(242, 234, 217, .6); }
.pl-empty.is-hide { display: none; }

/* ---------- 气泡流（直播滚动屏：容器透明，纯文字评论） ---------- */
.pl-list {
  flex: 1;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0 10px 6px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  overscroll-behavior: contain;
  /* mask 渐隐已整体移除（2026-08-31 修复记录81）：顶部淡入使首条评论被淡化，观感像"层级有问题" */
}
.pl-list::-webkit-scrollbar { width: 4px; }
.pl-list::-webkit-scrollbar-thumb { background: rgba(176, 125, 86, .25); border-radius: 4px; }

/* 单条消息：头像在左，右侧为昵称行+胶囊内容 */
.pl-msg {
  display: flex;
  gap: 6px;
  animation: pl-msg-in .28s ease-out;
  pointer-events: none;
}
@keyframes pl-msg-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}

/* 头像 */
.pl-av {
  flex: none;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  object-fit: cover;
  background: #F5F0E8;
  box-shadow: 0 2px 6px rgba(44, 36, 32, .12);
  pointer-events: auto;
  margin-top: 1px;
}

/* 右侧主体：昵称行 + 内容胶囊纵向排列
   align-items:flex-start（2026-08-31）：纵向 flex 子项默认 stretch 会把 .pl-cap 拉成满行宽，
   改后气泡长度跟随内容收缩，各端一致；.is-clamp 折叠与超长换行仍受 max-width:100% 约束 */
.pl-msg-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
}

/* 昵称行（2026-08-31 修复记录81 统一）：通栏一行——用户名+身份徽章居左、点赞钮居右，
   整行无独立底色（可读性由面板底纱保证，2026-08-31 修复记录82 文字改浅色） */
.pl-msg-hd {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  color: rgba(242, 234, 217, .78);
  flex-wrap: nowrap;
  max-width: 100%;
  width: 100%;
  min-width: 0;
  padding: 0;
  background: transparent;
}
.pl-msg-nm {
  font-weight: 600;
  color: #E8D8B8;
  font-size: 11px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 可跳转的昵称（微信生态中点击跳转用户页） */
.pl-msg-nm-link { cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pl-msg-nm-link:hover { text-decoration: underline; }
.pl-idn { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 身份徽章配色沿用全站 SS_user_identity_badge */
.pl-idn {
  flex: none;
  font-size: 10px;
  font-weight: 600;
  border-radius: 4px;
  padding: 0 4px;
  line-height: 1.4;
  border: 1px solid;
}
.pl-idn-xz { color: #6366F1; background: #6366F11a; border-color: #6366F140; }
.pl-idn-ls { color: #059669; background: #0596691a; border-color: #05966940; }
.pl-idn-fw { color: #D97706; background: #D977061a; border-color: #D9770640; }
.pl-idn-xy { color: #0EA5E9; background: #0EA5E91a; border-color: #0EA5E940; }
.pl-idn-yh { color: #6B7280; background: #6B72801a; border-color: #6B728040; }
/* 互动状态卡的机构名：微信生态中可点击跳小程序机构详情页 */
.pl-idn-link { cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pl-idn-link:hover { filter: brightness(1.12); }

/* 评论正文（2026-08-31 修复记录82）：浅色文字，可读性由面板深色渐变底纱保证——
   深色背景（书外）上清晰，白色书页上也因底纱而清晰；不再使用文字光晕（实测难看且深底不清） */
.pl-cap {
  display: inline-block;
  max-width: 100%;
  padding: 3px 9px;
  border-radius: 10px;
  background: transparent;
  font-size: 12px;
  line-height: 1.45;
  color: #F2EAD9;
  text-shadow: 0 1px 2px rgba(26, 21, 16, .45);
  word-break: break-word;
  white-space: pre-wrap;
  pointer-events: auto;
  cursor: pointer;
  position: relative;
}
.pl-cap .pl-at { color: #D8B58A; font-weight: 500; }

/* 自己的消息：不再单独配色（2026-08-31 气泡去色统一），昵称带「我」角标区分 */
.pl-msg-nm-me::after {
  content: "我";
  margin-left: 4px;
  font-size: 9px;
  color: #fff;
  background: linear-gradient(135deg, var(--pl-tan), var(--pl-tan-l));
  border-radius: 3px;
  padding: 1px 4px;
  vertical-align: middle;
}
.pl-msg.is-pending { opacity: .65; }
.pl-msg.is-pending .pl-cap { border: 1px dashed rgba(216, 181, 138, .45); }
.pl-msg-flag { font-size: 10px; color: rgba(242, 234, 217, .75); margin-top: 2px; }
.pl-msg-flag.is-err { color: #E5907B; cursor: pointer; }

/* 长评论折叠/展开（修复记录75/76：展开按钮靠右；2026-08-30 折叠降为2行压缩高度） */
.pl-cap.is-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pl-expand {
  display: inline-block;
  font-size: 11px;
  color: #D8C7A8;
  cursor: pointer;
  margin-top: 2px;
  pointer-events: auto;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  align-self: flex-end;     /* 展开按钮靠右对齐 */
  margin-left: auto;        /* 在 flex 容器中推到右侧 */
}
.pl-expand:hover { text-decoration: underline; }

/* 点赞钮（2026-08-31 修复记录81 统一）：作品卡与每条评论行通用——无底色纯图标+数字，
   在通栏昵称行内 margin-left:auto 贴右；点击整颗热区稍大（负 margin 扩展命中范围） */
.pl-zan {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  color: rgba(242, 234, 217, .72);
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  white-space: nowrap;
  flex: none;
  margin-left: auto;
  padding: 2px;
  margin-right: -2px;
}
.pl-zan svg { width: 12px; height: 12px; }
.pl-zan.is-on { color: #C89A6C; font-weight: 600; }
.pl-zan.is-on svg { fill: #C89A6C; }

/* ---------- 输入条（修复记录77：独立于面板 fixed 定位，is-bar-on 控制显隐） ---------- */
.pl-bar {
  position: fixed;
  left: 20px;
  bottom: 20px;                /* 与面板同位：面板打开时覆盖其 padding-bottom 区，视觉连续 */
  z-index: 200;
  width: 340px;
  padding: 8px 6px 8px 12px;   /* 右内边距收窄：发送钮贴右（2026-08-31） */
  display: flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .24s, transform .24s cubic-bezier(.22, 1, .36, 1), visibility .24s;
}
.pl-root.is-bar-on .pl-bar { opacity: 1; visibility: visible; transform: none; }
.pl-root.is-right .pl-bar { left: auto; right: 20px; }
.pl-me {
  flex: none;
  width: 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  cursor: pointer;
}
.pl-me-avwrap { position: relative; }
.pl-me .pl-av { width: 30px; height: 30px; margin-top: 0; }
.pl-me-nm {
  max-width: 42px;
  font-size: 9px;
  line-height: 1.2;
  color: #CFC0A0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pl-me-tag {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--pl-tan);
  color: #fff;
  font-size: 9px;
  line-height: 14px;
  text-align: center;
  border: 1.5px solid var(--pl-glass-strong);
}
.pl-me-tag.is-hide { display: none; }

.pl-input {
  flex: 1;
  height: 32px;
  min-width: 0;
  border-radius: 16px;
  border: 1px solid rgba(176, 125, 86, .30);
  background: rgba(252, 249, 243, .92);   /* 近实底：深色页面上深墨文字仍清晰（修复记录74） */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 0 14px;
  font-size: 13px;
  color: var(--pl-ink);
  outline: none;
  font-family: inherit;
  box-shadow: 0 2px 8px rgba(44, 36, 32, .10);
}
.pl-input::placeholder { color: var(--pl-ink-2); }
.pl-input:focus { border-color: var(--pl-tan); background: #fff; }

.pl-send {
  flex: none;
  height: 32px;
  padding: 0 14px;
  border-radius: 16px;
  border: none;
  background: linear-gradient(135deg, var(--pl-tan), var(--pl-tan-l));
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 3px 12px rgba(176, 125, 86, .28);
  font-family: inherit;
}
.pl-send:disabled { background: #E7DFD3; color: var(--pl-ink-2); box-shadow: none; cursor: not-allowed; }

.pl-login {
  position: fixed;
  left: 20px;
  bottom: 20px;               /* 修复记录77：与输入条同位，未登录时随 is-bar-on 显隐 */
  z-index: 200;
  width: 340px;
  padding: 9px;
  border-radius: 999px;
  border: 1px solid rgba(176, 125, 86, .30);
  background: rgba(252, 249, 243, .85);
  color: var(--pl-tan-d);
  font-size: 12px;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(44, 36, 32, .10);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity .24s, transform .24s cubic-bezier(.22, 1, .36, 1), visibility .24s;
}
.pl-root.is-bar-on .pl-login { opacity: 1; visibility: visible; transform: none; }
.pl-root.is-right .pl-login { left: auto; right: 20px; }
.pl-login.is-hide { display: none; }

/* ---------- 身份切换浮层（修复记录77：相对独立输入条 .pl-bar 定位弹出） ---------- */
.pl-ids {
  position: absolute;
  left: 12px;
  bottom: 52px;
  z-index: 210;
  width: 208px;
  padding: 6px;
  border-radius: 14px;
  border: 1px solid rgba(176, 125, 86, .28);
  background: var(--pl-glass-strong);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: var(--pl-shadow-lg);
  display: none;
}
.pl-ids.is-show { display: block; animation: pl-ids-in .24s cubic-bezier(.22, 1, .36, 1); }
@keyframes pl-ids-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
.pl-ids-hd { font-size: 11px; color: var(--pl-ink-2); padding: 6px 8px 8px; }
.pl-id {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 7px 8px;
  border-radius: 10px;
  cursor: pointer;
  transition: background .2s;
  -webkit-tap-highlight-color: transparent;
}
.pl-id:hover { background: var(--pl-cap-ui); }
.pl-id.is-cur { background: var(--pl-cap-mine); }
.pl-id .pl-av { width: 26px; height: 26px; margin-top: 0; }
.pl-id-nm { flex: 1; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-id-ck { color: var(--pl-tan); font-size: 13px; font-weight: 700; }

/* ---------- 移动端遮罩 ---------- */
.pl-mask { display: none; }

/* ---------- 暗色模式 ---------- */
.dark-theme .pl-root,
.pl-root.is-dark {
  --pl-glass: rgba(26, 21, 16, .74);
  --pl-glass-strong: rgba(30, 25, 20, .90);
  --pl-line: rgba(201, 169, 97, .22);
  --pl-cap-ui: rgba(26, 21, 16, .48);
  --pl-cap-mine: rgba(150, 105, 62, .38);
  --pl-ink: #E8DFD0;
  --pl-ink-2: rgba(232, 223, 208, .58);
  --pl-tan-d: #C49A6C;
  --pl-shadow: 0 8px 32px rgba(0, 0, 0, .45);
  --pl-shadow-lg: 0 16px 48px rgba(0, 0, 0, .55);
}
.dark-theme .pl-panel,
.pl-root.is-dark .pl-panel { border-color: rgba(201, 169, 97, .28); }
.dark-theme .pl-input,
.pl-root.is-dark .pl-input { background: rgba(255, 255, 255, .06); color: var(--pl-ink); }
.dark-theme .pl-input:focus,
.pl-root.is-dark .pl-input:focus { background: rgba(255, 255, 255, .10); }
.dark-theme .pl-av,
.pl-root.is-dark .pl-av { background: #2C2420; }
/* 2026-08-31 修复记录82：面板内文字已全部浅色+底纱保可读，暗色模式无需再覆盖文字色/光晕 */
/* 深色页面修复记录74：交互件在暗色模式用暗玻璃 */
.dark-theme .pl-login,
.pl-root.is-dark .pl-login { background: rgba(26, 21, 16, .85); }

/* ---------- 响应式断点 ---------- */
@media (max-width: 768px) {
  .pl-panel {
    left: 12px;
    bottom: 12px;
    width: calc(100vw - 84px);
    max-height: 40vh;
  }
  .pl-root.is-right .pl-panel { left: 12px; right: auto; }
  .pl-dock { left: auto; right: 12px; bottom: 80px; }
  .pl-bar, .pl-login { left: 12px; bottom: 12px; width: calc(100vw - 84px); }
  .pl-root.is-right .pl-bar, .pl-root.is-right .pl-login { left: 12px; right: auto; }
  .pl-root.is-open .pl-panel.is-full { max-height: 40vh; }
}

@media (max-width: 480px) {
  .pl-panel { max-height: 36vh; }
  .pl-root.is-open .pl-panel.is-full { max-height: 36vh; }
  .pl-fab { width: 40px; height: 40px; }
  .pl-fab svg { width: 18px; height: 18px; }
  .pl-ids { width: 168px; }
}

/* ---------- 整块隐藏 ---------- */
.pl-root.is-hide { display: none; }

/* ---------- 打印 / 导出 PDF 隐藏 ---------- */
@media print {
  .pl-root { display: none !important; }
}

/* ---------- @作品 / @作品集 卡片（2026-09-01 优化，评论统一后活动详情页专用）----------
   旧版 .pl-wktag 是描边棕字小标签：面板顶部的底纱只有 30%（近乎白底）时几乎看不见，已废弃。
   现版为纸白近实底卡 + 作品预览图（26×34 纵向裁切）+ 深墨字，任意背景（深色底纱/白色页面）都清晰；
   卡片放在评论正文下方独立一行，点击跳作品集页对应位置（普通作品 oid / 特邀作品 tid 序号） */
.pl-wk {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  margin-top: 3px;
  padding: 3px 9px 3px 3px;
  border-radius: 10px;
  background: rgba(252, 249, 243, .95);
  border: 1px solid rgba(176, 125, 86, .32);
  box-shadow: 0 2px 8px rgba(44, 36, 32, .18);
  color: var(--pl-ink);
  text-decoration: none;
  cursor: pointer;
}
.pl-wk:hover { background: #FFFDF8; border-color: rgba(176, 125, 86, .58); }
/* 作品预览图（无图时用「书」字占位，保持卡片形态一致） */
.pl-wk-img {
  flex: none;
  width: 26px;
  height: 34px;
  object-fit: cover;
  border-radius: 5px;
  background: #EFE7D9;
}
.pl-wk-img.is-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--pl-tan-d);
  background: rgba(176, 125, 86, .12);
}
.pl-wk-nm {
  min-width: 0;
  font-size: 11px;
  line-height: 1.35;
  color: var(--pl-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
